/** Add School page — uses the shared AditiSoftware light/dark theme tokens. */

.school-page-main {
	width: 100%;
	margin: 0;
	background:
		radial-gradient(circle at 10% 0%, color-mix(in srgb, var(--aditi-brand-orange) 8%, transparent), transparent 30%),
		var(--aditi-page-background);
}

.school-page {
	width: calc(100% - 20px);
	min-height: 68vh;
	margin: 0 auto;
	padding: 10px 0;
	color: var(--aditi-text-primary);
}

.school-page--cart {
	width: 100%;
	min-height: 0;
	margin-top: 24px;
	padding: 0;
}

.school-page--cart .school-page__heading {
	margin-bottom: 14px !important;
}

.school-page-main + .wp-block-template-part {
	margin-block-start: 0;
}

.school-page__heading {
	display: flex;
	align-items: center;
	gap: 17px;
	margin: 0 0 12px !important;
}

.school-page__heading-icon {
	display: grid;
	width: 60px;
	height: 60px;
	flex: 0 0 60px;
	place-items: center;
	border: 1px solid var(--aditi-brand-orange-border);
	border-radius: var(--aditi-radius-section);
	background: var(--aditi-brand-orange-soft);
	color: var(--aditi-brand-orange);
	box-shadow: var(--aditi-shadow-sm);
}

.school-page__heading-icon .aditi-icon { width: 31px; height: 31px; }

.school-page__heading p {
	margin: 0 0 3px;
	color: var(--aditi-brand-orange);
	font-size: .72rem;
	font-weight: var(--aditi-font-weight-extrabold);
	letter-spacing: .16em;
}

.school-page__heading h1 {
	margin: 0;
	color: var(--aditi-text-heading);
	font-size: clamp(1.7rem, 3vw, 2.35rem);
	font-weight: var(--aditi-font-weight-extrabold);
	line-height: 1.15;
}

.school-page__heading div > span {
	display: block;
	margin-top: 5px;
	color: var(--aditi-text-muted);
	font-size: .92rem;
}

.school-notice {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 18px;
	padding: 13px 16px;
	border: 1px solid;
	border-radius: var(--aditi-radius-card);
	font-weight: var(--aditi-font-weight-semibold);
}

.school-notice .aditi-icon { width: 21px; height: 21px; flex: none; }
.school-notice--success { border-color: var(--aditi-success-border); background: var(--aditi-success-surface); color: var(--aditi-success); }
.school-notice--error { border-color: color-mix(in srgb, var(--aditi-danger) 40%, transparent); background: var(--aditi-danger-surface); color: var(--aditi-danger); }

.school-form {
	overflow: visible;
	margin: 0 !important;
	border: 1px solid var(--aditi-border-default);
	border-radius: var(--aditi-radius-large);
	background: var(--aditi-surface-primary);
	box-shadow: var(--aditi-shadow-panel);
}

.school-form__body {
	padding: clamp(20px, 2.4vw, 28px);
}

.school-location-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 28px;
}

.school-details-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px 30px;
	padding-top: 14px;
}

.school-field { position: relative; min-width: 0; }
.school-field--wide { grid-column: 1 / -1; }

.school-field > label,
.school-modal__body > label {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 9px;
	color: var(--aditi-text-heading);
	font-size: .98rem;
	font-weight: var(--aditi-font-weight-bold);
	line-height: 1.25;
}

.school-field > label b,
.school-modal__body > label b {
	color: var(--aditi-danger-required);
	font-size: 1.05em;
}

.school-field > label em {
	color: var(--aditi-text-muted);
	font-size: .86em;
	font-style: normal;
	font-weight: var(--aditi-font-weight-medium);
}

.school-field__icon {
	display: grid;
	width: 29px;
	height: 29px;
	flex: 0 0 29px;
	place-items: center;
	border-radius: var(--aditi-radius-control);
	background: var(--aditi-brand-orange-soft);
	color: var(--aditi-brand-orange);
}

.school-field__icon .aditi-icon { width: 19px; height: 19px; }

.school-field input[type="text"],
.school-field input[type="search"],
.school-field select,
.school-field textarea,
.school-select-trigger,
.school-modal__body input {
	width: 100%;
	border: 1px solid var(--aditi-border-strong);
	border-radius: var(--aditi-radius-button);
	outline: 0;
	background: var(--aditi-surface-primary);
	color: var(--aditi-text-heading);
	font: inherit;
	font-size: .96rem;
	transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.school-field input[type="text"],
.school-field select,
.school-select-trigger,
.school-modal__body input {
	min-height: 54px;
	padding: 12px 16px;
}

.school-field select {
	padding-right: 42px;
	appearance: none;
	background-image: linear-gradient(45deg, transparent 50%, var(--aditi-text-secondary) 50%), linear-gradient(135deg, var(--aditi-text-secondary) 50%, transparent 50%);
	background-position: calc(100% - 20px) 24px, calc(100% - 15px) 24px;
	background-repeat: no-repeat;
	background-size: 5px 5px, 5px 5px;
}

.school-field textarea {
	min-height: 112px;
	padding: 14px 16px 30px;
	line-height: 1.55;
	resize: vertical;
}

.school-field :is(input, select, textarea)::placeholder,
.school-modal__body input::placeholder {
	color: var(--aditi-text-placeholder);
}

.school-field :is(input, select, textarea):focus,
.school-select-trigger:focus-visible,
.school-modal__body input:focus {
	border-color: var(--aditi-brand-orange);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--aditi-brand-orange) 17%, transparent);
}

.school-field.is-invalid :is(input, select, textarea, .school-select-trigger) {
	border-color: var(--aditi-danger);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--aditi-danger) 12%, transparent);
}

.school-field__hint {
	position: absolute;
	right: 12px;
	bottom: -18px;
	margin: 0;
	color: var(--aditi-text-muted);
	font-size: .72rem;
}

.school-field__error {
	min-height: 16px;
	margin: 4px 0 -20px;
	color: var(--aditi-danger);
	font-size: .74rem;
	font-weight: var(--aditi-font-weight-semibold);
}

.school-location-row {
	display: block;
}

.school-combobox { position: relative; min-width: 0; }

.school-select-trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	color: var(--aditi-text-placeholder);
	font-weight: var(--aditi-font-weight-medium);
	text-align: left;
	cursor: pointer;
}

.school-location-field.has-value .school-select-trigger { color: var(--aditi-text-heading); }

.school-select-trigger i {
	width: 10px;
	height: 10px;
	flex: 0 0 10px;
	margin: -5px 2px 0 0;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform .2s ease;
}

.school-location-field.is-open .school-select-trigger i { margin-top: 5px; transform: rotate(225deg); }

.school-select-panel {
	position: absolute;
	top: calc(100% + 7px);
	right: 0;
	left: 0;
	z-index: 30;
	overflow: hidden;
	border: 1px solid var(--aditi-border-strong);
	border-radius: var(--aditi-radius-card);
	background: var(--aditi-surface-primary);
	box-shadow: var(--aditi-shadow-lg);
}

.school-select-search {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 10px;
	padding: 0 12px;
	border: 1px solid var(--aditi-border-default);
	border-radius: var(--aditi-radius-control);
	background: var(--aditi-surface-subtle);
	color: var(--aditi-text-muted);
}

.school-select-search .aditi-icon { width: 19px; height: 19px; flex: none; }

.school-select-search input[type="search"] {
	min-width: 0;
	min-height: 42px;
	padding: 7px 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

.school-select-options {
	max-height: 218px;
	overflow-y: auto;
	padding: 0 8px 8px;
	scrollbar-color: var(--aditi-border-strong) transparent;
	scrollbar-width: thin;
}

.school-select-option {
	display: block;
	width: 100%;
	padding: 8px 12px;
	border: 0;
	border-radius: var(--aditi-radius-control);
	background: transparent;
	color: var(--aditi-text-primary);
	font: inherit;
	font-size: .9rem;
	font-weight: var(--aditi-font-weight-medium);
	text-align: left;
	cursor: pointer;
}

.school-select-option:hover,
.school-select-option[aria-selected="true"] {
	background: var(--aditi-brand-orange-soft);
	color: var(--aditi-brand-orange);
}

.school-select-empty {
	margin: 0;
	padding: 14px 18px;
	color: var(--aditi-text-muted);
	font-size: .84rem;
	text-align: center;
}

.school-select-add {
	display: flex;
	width: calc(100% - 16px);
	align-items: center;
	gap: 10px;
	margin: 0 8px 8px;
	padding: 9px 12px;
	border: 0;
	border-radius: var(--aditi-radius-control);
	background: var(--aditi-brand-orange-soft);
	color: var(--aditi-brand-orange);
	font: inherit;
	font-size: .85rem;
	font-weight: var(--aditi-font-weight-bold);
	cursor: pointer;
}

.school-select-add span { font-size: 1.35rem; line-height: 1; }

.school-textarea { position: relative; }
.school-textarea > span { position: absolute; right: 13px; bottom: 8px; color: var(--aditi-text-muted); font-size: .74rem; }
.school-textarea > span b { font-weight: var(--aditi-font-weight-medium); }

.school-form__actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 13px;
	padding: 18px clamp(24px, 3.5vw, 42px);
	border-top: 1px solid var(--aditi-border-default);
	border-radius: 0 0 var(--aditi-radius-large) var(--aditi-radius-large);
	background: var(--aditi-surface-secondary);
}

.school-form__actions > p { margin: 0 auto 0 0; color: var(--aditi-text-muted); font-size: .82rem; }

.school-button {
	display: inline-flex;
	min-height: 48px;
	align-items: center;
	justify-content: center;
	gap: 9px;
	padding: 10px 22px;
	border: 1px solid;
	border-radius: var(--aditi-radius-button);
	font: inherit;
	font-weight: var(--aditi-font-weight-bold);
	cursor: pointer;
	transition: border-color .2s ease, background-color .2s ease, color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.school-button .aditi-icon { width: 21px; height: 21px; }
.school-button--primary { border-color: var(--aditi-brand-orange); background: linear-gradient(135deg, var(--aditi-brand-orange), var(--aditi-brand-orange-dark)); color: var(--aditi-text-inverse); box-shadow: 0 7px 18px color-mix(in srgb, var(--aditi-brand-orange) 20%, transparent); }
.school-button--primary:hover { border-color: var(--aditi-brand-orange-dark); box-shadow: 0 10px 24px color-mix(in srgb, var(--aditi-brand-orange) 27%, transparent); transform: translateY(-1px); }
.school-button--secondary { border-color: var(--aditi-border-strong); background: var(--aditi-surface-primary); color: var(--aditi-text-heading); }
.school-button--secondary:hover { border-color: var(--aditi-brand-orange); color: var(--aditi-brand-orange); transform: translateY(-1px); }

.school-modal {
	position: fixed;
	inset: 0;
	z-index: 1000;
	display: grid;
	place-items: center;
	padding: 24px;
}

.school-modal[hidden] { display: none !important; }
.school-modal__backdrop { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: rgb(var(--aditi-shadow-rgb) / .48); backdrop-filter: blur(3px); cursor: default; }

.school-modal__dialog {
	position: relative;
	z-index: 1;
	width: min(420px, 100%);
	overflow: hidden;
	border: 1px solid var(--aditi-border-strong);
	border-radius: var(--aditi-radius-section);
	background: var(--aditi-surface-primary);
	box-shadow: 0 24px 70px rgb(var(--aditi-shadow-rgb) / .3);
	animation: school-modal-in .18s ease-out both;
}

@keyframes school-modal-in { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }

.school-modal__dialog > header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
	padding: 17px 20px;
	border-bottom: 1px solid var(--aditi-border-default);
	background: var(--aditi-surface-secondary);
}

.school-modal__dialog h2 { margin: 0; color: var(--aditi-text-heading); font-size: 1.12rem; }
.school-modal__dialog header button { display: grid; width: 34px; height: 34px; place-items: center; padding: 0; border: 0; border-radius: var(--aditi-radius-control); background: transparent; color: var(--aditi-text-muted); cursor: pointer; }
.school-modal__dialog header button:hover { background: var(--aditi-brand-orange-soft); color: var(--aditi-brand-orange); }
.school-modal__dialog header .aditi-icon { width: 20px; height: 20px; }

.school-modal__body { padding: 20px; }
.school-modal__body > p:first-child { margin: 0 0 16px; color: var(--aditi-text-muted); font-size: .86rem; }
.school-modal__body input { min-height: 50px; padding: 10px 13px; }
.school-modal__body .school-field__error { margin-bottom: 0; }

.school-modal__dialog > footer { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 20px 19px; }
.school-modal__dialog > footer .school-button { min-width: 105px; min-height: 44px; padding: 8px 18px; }
html.has-school-modal { overflow: hidden; }

html[data-theme="dark"] .school-form,
html[data-theme="dark"] .school-select-panel,
html[data-theme="dark"] .school-modal__dialog {
	box-shadow: 0 18px 48px rgb(0 0 0 / .36);
}

html[data-theme="dark"] .school-select-search { border-color: var(--aditi-border-medium); }

@media (max-width: 980px) {
	.school-location-grid { grid-template-columns: 1fr; gap: 23px; }
	.school-select-panel { max-width: 520px; }
}

@media (max-width: 680px) {
	.school-page { width: calc(100% - 20px); padding: 10px 0; }
	.school-page__heading { align-items: flex-start; }
	.school-page__heading-icon { width: 52px; height: 52px; flex-basis: 52px; }
	.school-form__body { padding: 20px 16px 25px; }
	.school-details-grid { grid-template-columns: 1fr; gap: 23px; padding-top: 25px; }
	.school-field--wide { grid-column: auto; }
	.school-form__actions { display: grid; grid-template-columns: 1fr 1fr; padding: 15px 16px; }
	.school-form__actions > p { grid-column: 1 / -1; margin: 0; text-align: center; }
	.school-button { width: 100%; padding-right: 12px; padding-left: 12px; }
}

@media (max-width: 420px) {
	.school-form__actions { grid-template-columns: 1fr; }
	.school-modal { padding: 12px; }
}

@media (prefers-reduced-motion: reduce) {
	.school-modal__dialog { animation: none; }
	.school-page * { scroll-behavior: auto !important; }
}
