/* NI Tutoring Introductions — public styles v3.2
   The NITS design system ("Apple/Emil playbook"): white 880px card on lavender
   #F6F4FB, Montserrat headings / Source Sans body, ONE yellow pill per page,
   quiet indigo everything else, hairline cells, 120ms press feedback,
   reduced-motion + touch guards. Measured against nits-apple-design-standards.md. */

:root{
	/* Palette read from the LIVE site (seag-resources computed styles, 13 Jul
	   2026) — navy + light blue family; the old indigo/lavender docs values
	   are retired. Var names kept for markup stability. */
	--nits-navy:#01264C;         /* headings, button text, primary solids */
	--nits-indigo:#01264C;       /* callout bars, step badges (navy now) */
	--nits-indigo-soft:#01264C;  /* solid secondary buttons (navy now) */
	--nits-purple:#1D5D96;       /* quiet links + focus rings (site link blue) */
	--nits-yellow:#EDB307;       /* the ONE CTA per page (live site yellow) */
	--nits-body:#002B5C;
	--nits-muted:#66799B;
	--nits-hairline:#E3EDF6;
	--nits-lavender:#E7F3FA;     /* callout surface (live: light blue) */
	--nits-tint:#F2F8FC;         /* page tint (live body background) */
	--nits-blue:#EAF2FA;         /* strips / product surfaces */
	--nits-chip:#DFEBF5;         /* pills & chips */
	--nits-card-shadow:0 2px 10px rgba(1,38,76,.08);
	--nits-ease-out:cubic-bezier(.23,1,.32,1);
	--nits-ease-inout:cubic-bezier(.77,0,.175,1);
	--nits-font-head:Montserrat,"Source Sans Pro","Source Sans 3",sans-serif;
	--nits-font-body:"Source Sans Pro","Source Sans 3",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

/* ---------- Standalone shell ---------- */
.niti-standalone{margin:0;font-family:var(--nits-font-body);background:var(--nits-tint);color:var(--nits-body);line-height:1.6;-webkit-font-smoothing:antialiased}
.niti-wrap{max-width:928px;margin:0 auto;padding:0 24px 24px}
.niti-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 4px 26px}
.niti-logo{display:inline-flex;align-items:center;gap:10px;font-family:var(--nits-font-head);font-weight:700;font-size:1.05rem;color:var(--nits-navy);text-decoration:none;letter-spacing:-.01em}
.niti-logo img{width:38px;height:38px;border-radius:8px;object-fit:contain;display:block}
.niti-header-link{font-size:.9rem;color:var(--nits-indigo-soft);text-decoration:none;font-weight:600}
.niti-footer{text-align:center;color:var(--nits-muted);font-size:.85rem;padding:26px 0 8px}
.niti-page-nav{text-align:center;font-size:.85rem;color:var(--nits-muted);padding:16px 0 0}
.niti-page-nav a{color:var(--nits-indigo-soft);text-decoration:none;margin:0 6px;font-weight:600}

/* ---------- The card ---------- */
.niti-card{background:#fff;border:none;border-radius:10px;padding:40px;box-shadow:var(--nits-card-shadow)}
@media(max-width:640px){.niti-card{padding:24px 20px}}
.niti-card h1{font-family:var(--nits-font-head);font-size:1.7rem;font-weight:600;letter-spacing:-.01em;line-height:1.25;margin:0 0 14px;color:var(--nits-navy)}
.niti-card h2,.niti-dash h2{font-family:var(--nits-font-head);font-size:1.25rem;font-weight:600;color:var(--nits-navy);letter-spacing:-.01em}
.niti-card h3,.niti-dash h3{font-family:var(--nits-font-head);font-size:1.02rem;font-weight:600;color:var(--nits-navy);margin:30px 0 10px;padding-top:22px;border-top:1px solid var(--nits-hairline)}
.niti-card h1+h3,.niti-card h1+p+h3,.niti-card .niti-error+h3{border-top:none;padding-top:0}
.niti-card h4,.niti-dash h4{font-family:var(--nits-font-head);font-size:.95rem;font-weight:600;color:var(--nits-navy);margin:16px 0 8px}
.niti-small{font-size:.86rem;color:var(--nits-muted)}
.niti-card a,.niti-dash a{color:var(--nits-indigo-soft);text-decoration:none;font-weight:600}
@media(hover:hover) and (pointer:fine){
	.niti-card a:hover,.niti-dash a:hover{color:var(--nits-purple);text-decoration:underline;text-underline-offset:3px}
}

/* ---------- Buttons ---------- */
.niti-btn{display:inline-block;background:var(--nits-yellow);color:var(--nits-navy);border:none;border-radius:999px;padding:12px 26px;font-family:var(--nits-font-body);font-size:1rem;font-weight:700;cursor:pointer;text-decoration:none !important;margin:4px 6px 4px 0;transition:transform 120ms var(--nits-ease-out),filter 150ms ease;will-change:transform}
.niti-btn:active{transform:scale(.97)}
@media(hover:hover) and (pointer:fine){.niti-btn:hover{filter:brightness(.96);color:var(--nits-navy)}}
.niti-btn-indigo{background:var(--nits-indigo-soft);color:#fff}
@media(hover:hover) and (pointer:fine){.niti-btn-indigo:hover{filter:brightness(1.12);color:#fff}}
.niti-btn-secondary,.niti-btn-ghost{background:transparent;color:var(--nits-indigo-soft);border:none;padding:12px 10px;font-weight:600}
@media(hover:hover) and (pointer:fine){
	.niti-btn-secondary:hover,.niti-btn-ghost:hover{background:transparent;color:var(--nits-purple);text-decoration:underline !important;text-underline-offset:3px}
}
.niti-btn-ghost{color:var(--nits-muted)}
.niti-btn[disabled]{opacity:.6;cursor:default}
.niti-btn .niti-spinner{margin-left:8px}
:focus-visible{outline:2px solid var(--nits-purple);outline-offset:3px;border-radius:4px}

/* ---------- Callouts (the only alert style) ---------- */
.niti-banner,.niti-error,.niti-success,.niti-goodfaith,.niti-reassure,.niti-declaration{background:var(--nits-lavender);border:none;border-left:4px solid var(--nits-indigo);border-radius:8px;padding:14px 18px;margin:14px 0;color:var(--nits-body);font-size:.95rem}
.niti-banner strong,.niti-goodfaith strong,.niti-declaration strong{color:var(--nits-indigo)}
.niti-banner-amber,.niti-declaration{background:#FFF8E6;border-left-color:var(--nits-yellow)}
.niti-error{background:#FDF2F1;border-left-color:#B42318}
.niti-success{background:#EFF9F3;border-left-color:#1E7F4F}
.niti-success h3{border-top:none;padding-top:0;margin-top:0}
.niti-reassure{text-align:left}

/* ---------- Forms ---------- */
.niti-form label{display:block;margin:12px 0;font-weight:600;font-size:.95rem;color:var(--nits-navy)}
.niti-form input[type=text],.niti-form input[type=email],.niti-form input[type=tel],.niti-form input[type=date],.niti-form input[type=url],.niti-form input[type=number],.niti-form input[type=password],.niti-form select,.niti-form textarea{display:block;width:100%;box-sizing:border-box;margin-top:5px;padding:11px 12px;border:1px solid #D7DEEC;border-radius:8px;font:inherit;font-weight:400;color:var(--nits-body);background:#fff;transition:border-color 150ms ease}
.niti-form input:focus,.niti-form select:focus,.niti-form textarea:focus{outline:2px solid var(--nits-purple);outline-offset:1px;border-color:var(--nits-purple)}
.niti-form ::placeholder{color:#A9B2CC}
.niti-grid{display:grid;grid-template-columns:1fr;gap:0 18px}
@media(min-width:640px){.niti-grid{grid-template-columns:1fr 1fr}}
.niti-fieldset{border:none;border-top:1px solid var(--nits-hairline);border-radius:0;padding:16px 0 4px;margin:18px 0 0}
.niti-fieldset legend{font-family:var(--nits-font-head);font-weight:600;font-size:.98rem;padding:0 8px 0 0;color:var(--nits-navy)}
.niti-checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:2px}
.niti-check{display:flex;gap:9px;align-items:flex-start;font-weight:400 !important;margin:7px 0;color:var(--nits-body)}
.niti-check input{margin-top:4px;flex:none;accent-color:var(--nits-indigo-soft)}
.niti-invalid{outline:2px solid #B42318 !important}
.niti-inline{font-weight:400 !important;margin-top:8px}
.niti-inline input{margin-top:4px}
.niti-hp{position:absolute !important;left:-9999px !important;height:1px;width:1px;overflow:hidden}

/* ---------- Data tables → Apple cells ---------- */
.niti-table{width:100%;border-collapse:collapse;margin:16px 0}
.niti-table th,.niti-table td{text-align:left;padding:11px 12px 11px 0;border-bottom:1px solid var(--nits-hairline);vertical-align:top;font-size:.95rem}
.niti-table th{width:36%;color:var(--nits-muted);font-weight:600;font-size:.86rem}
.niti-table td{color:var(--nits-body)}
.niti-table tr:last-child th,.niti-table tr:last-child td{border-bottom:none}

/* ---------- Chips & tags ---------- */
.niti-tag{display:inline-block;background:var(--nits-chip);color:var(--nits-navy);border-radius:999px;padding:3px 12px;font-size:.78rem;font-weight:600;vertical-align:middle}
.niti-tag-urgent{background:#FDF2F1;color:#B42318}
.niti-tag-short_term{background:#FFF8E6;color:#8a6a10}
.niti-badge-due{display:inline-block;background:var(--nits-lavender);color:var(--nits-indigo);border-radius:999px;padding:3px 12px;font-size:.78rem;font-weight:700;font-variant-numeric:tabular-nums}
.niti-badge-urgent{background:#FDF2F1;color:#B42318}

/* ---------- Multi-step journey ---------- */
.niti-progress{display:flex;gap:0;list-style:none;margin:22px 0 8px;padding:0;counter-reset:nitiprog}
.niti-progress li{flex:1;text-align:center;font-size:.8rem;color:var(--nits-muted);padding:8px 4px 12px;border-bottom:2px solid var(--nits-hairline)}
.niti-progress li::before{counter-increment:nitiprog;content:counter(nitiprog);display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--nits-chip);color:var(--nits-muted);font-weight:700;font-size:.75rem;margin-right:7px;vertical-align:-5px;font-variant-numeric:tabular-nums}
.niti-progress li.is-active{color:var(--nits-navy);font-weight:700;border-bottom-color:var(--nits-indigo)}
.niti-progress li.is-active::before{background:var(--nits-indigo);color:#fff}
.niti-step-panel{display:none}
.niti-step-panel.is-active{display:block}

/* ---------- How-it-works steps ---------- */
.niti-steps{display:grid;grid-template-columns:1fr;gap:0;margin:20px 0;padding:0;list-style:none;counter-reset:nitistep}
@media(min-width:768px){.niti-steps{grid-template-columns:repeat(4,1fr);gap:0 22px}}
.niti-step{position:relative;background:transparent;border:none;border-top:1px solid var(--nits-hairline);border-radius:0;padding:18px 4px 14px}
.niti-step::before{counter-increment:nitistep;content:counter(nitistep);display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--nits-indigo);color:#fff;font-weight:700;margin-bottom:10px;font-variant-numeric:tabular-nums}
.niti-step h4{margin:0 0 6px;font-size:.98rem;color:var(--nits-navy)}
.niti-step p{margin:0;font-size:.92rem;color:var(--nits-body)}

/* ---------- Format picker & trust blocks ---------- */
.niti-format-cards{display:grid;grid-template-columns:1fr;gap:12px;margin:8px 0 4px}
@media(min-width:640px){.niti-format-cards{grid-template-columns:1fr 1fr}}
.niti-format-card{border:1px solid #D7DEEC;border-radius:10px;padding:16px 18px;cursor:pointer;background:#fff;display:block;transition:border-color 150ms ease,background-color 150ms ease}
.niti-format-card input{position:absolute;opacity:0}
.niti-format-card h4{margin:0 0 4px;color:var(--nits-navy)}
.niti-format-card p{margin:0;font-size:.88rem;color:var(--nits-body);font-weight:400}
.niti-format-card.is-selected{border-color:var(--nits-indigo);background:var(--nits-lavender)}
.niti-trust{display:grid;grid-template-columns:1fr;gap:0;margin:14px 0}
@media(min-width:640px){.niti-trust{grid-template-columns:1fr 1fr;gap:0 24px}}
.niti-trust-block{background:transparent;border:none;border-top:1px solid var(--nits-hairline);border-radius:0;padding:16px 4px 12px}
.niti-trust-block h4{margin:0 0 6px;color:var(--nits-navy)}
.niti-trust-block p{margin:0;font-size:.9rem;font-weight:400}

/* ---------- Tutor hero (personalised enquiry) ---------- */
.niti-tutor-hero{display:flex;gap:20px;align-items:flex-start;background:var(--nits-lavender);border:none;border-radius:10px;padding:20px;margin-bottom:8px;flex-wrap:wrap}
.niti-tutor-hero h3{margin:0 0 6px;color:var(--nits-navy);border-top:none;padding-top:0}
.niti-profile{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap}
.niti-photo{width:120px;height:120px;object-fit:cover;border-radius:12px;flex:none}
.niti-profile-photo{width:200px;height:200px;object-fit:cover;border-radius:12px;float:right;margin:0 0 18px 20px}
@media(max-width:560px){.niti-profile-photo{float:none;display:block;margin:0 0 16px;width:140px;height:140px}}

/* ---------- Spinner (status lives inside the button) ---------- */
.niti-spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(17,41,91,.25);border-top-color:var(--nits-navy);border-radius:50%;animation:nitispin .7s linear infinite;vertical-align:-2px;margin-left:6px}
.niti-btn-indigo .niti-spinner{border-color:rgba(255,255,255,.35);border-top-color:#fff}
@keyframes nitispin{to{transform:rotate(360deg)}}

/* ---------- Tutor dashboard ---------- */
.niti-dash-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap;border-bottom:1px solid var(--nits-hairline);padding-bottom:14px;margin-bottom:8px}
.niti-dash-head .links{font-size:.88rem;display:flex;gap:16px;flex-wrap:wrap}
.niti-dash-head .links a{margin:0}
.niti-dash-stats{display:flex;gap:0;flex-wrap:wrap;margin:18px 0 6px}
.niti-stat-mini{background:transparent;border:none;border-right:1px solid var(--nits-hairline);border-radius:0;padding:4px 22px 4px 0;margin:0 22px 10px 0;font-size:.88rem;color:var(--nits-muted)}
.niti-stat-mini:last-child{border-right:none}
.niti-stat-mini strong{display:block;font-family:var(--nits-font-head);font-size:1.35rem;font-weight:600;color:var(--nits-navy);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.niti-dash-card{margin:0 0 2px;border:none;border-radius:0;border-top:1px solid var(--nits-hairline);box-shadow:none;padding:20px 4px 18px;background:transparent}
.niti-dash-card h4{margin:0 0 6px}
.niti-dash-green{background:transparent;border-color:var(--nits-hairline)}
.niti-dash-green h4::before{content:"✓ ";color:#1E7F4F}
.niti-green{color:#1E7F4F}
.niti-inline-form input[type=text],.niti-inline-form input[type=url]{display:inline-block;width:auto;min-width:260px;margin:4px 8px 8px 0;padding:10px 12px;border:1px solid #D7DEEC;border-radius:8px;font:inherit;color:var(--nits-body)}
.niti-slots-grid td{text-align:center;border-bottom:1px solid var(--nits-hairline)}
.niti-slots-grid th{font-size:.82rem}
.niti-slots-grid input{width:18px;height:18px;accent-color:var(--nits-indigo-soft)}
.niti-contract-box{max-height:220px;overflow-y:auto;background:#FBFBFE;border:1px solid var(--nits-hairline);border-radius:8px;padding:14px 16px;font-size:.9rem;white-space:pre-wrap;color:var(--nits-body);margin:8px 0}

/* ---------- Directory ---------- */
.niti-directory{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px;margin:20px 0}
.niti-dir-card{background:#fff;border:none;border-radius:10px;padding:22px 18px;text-align:center;box-shadow:var(--nits-card-shadow)}
@media(hover:hover) and (pointer:fine){
	.niti-dir-card{transition:transform 160ms var(--nits-ease-out),box-shadow 160ms var(--nits-ease-out);will-change:transform}
	.niti-dir-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(1,38,76,.11)}
}
.niti-dir-card .niti-photo,.niti-dir-card .niti-avatar{margin:0 auto 10px}
.niti-dir-card h4{margin:6px 0 4px;font-size:1.02rem}
.niti-dir-card h4 a{color:var(--nits-navy)}
.niti-dir-closed{opacity:.75}
.niti-dir-card.is-filtered{display:none}
/* Initials placeholder when a tutor has no photo yet. */
.niti-avatar{width:120px;height:120px;border-radius:12px;background:var(--nits-chip);color:var(--nits-navy);display:flex;align-items:center;justify-content:center;font-family:var(--nits-font-head);font-weight:600;font-size:2rem;letter-spacing:.02em}
/* Level filter — glass segmented control, default "All". */
.niti-filter{display:flex;gap:4px;flex-wrap:wrap;justify-content:center;width:fit-content;margin:6px auto 2px;padding:4px;background:rgba(255,255,255,.65);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);border-radius:999px;box-shadow:var(--nits-card-shadow)}
.niti-filter button{border:none;background:transparent;border-radius:999px;padding:8px 18px;font:inherit;font-size:.9rem;font-weight:600;color:var(--nits-navy);cursor:pointer;transition:background-color 150ms ease,color 150ms ease}
.niti-filter button.is-active{background:var(--nits-navy);color:#fff}
@media(hover:hover) and (pointer:fine){.niti-filter button:not(.is-active):hover{background:var(--nits-chip)}}

/* ---------- Login (wp_login_form restyle) ---------- */
.niti-login{max-width:420px;margin:0 auto}
.niti-login p{margin:12px 0}
.niti-login label{display:block;font-weight:600;font-size:.95rem;color:var(--nits-navy)}
.niti-login input[type=text],.niti-login input[type=password]{display:block;width:100%;box-sizing:border-box;margin-top:5px;padding:11px 12px;border:1px solid #D7DEEC;border-radius:8px;font:inherit;color:var(--nits-body)}
.niti-login input[type=text]:focus,.niti-login input[type=password]:focus{outline:2px solid var(--nits-purple);outline-offset:1px;border-color:var(--nits-purple)}
.niti-login .login-remember label{font-weight:400;color:var(--nits-body)}
.niti-login input[type=checkbox]{accent-color:var(--nits-indigo-soft)}
.niti-login #wp-submit{display:inline-block;background:var(--nits-yellow);color:var(--nits-navy);border:none;border-radius:999px;padding:12px 26px;font:inherit;font-weight:700;cursor:pointer;transition:transform 120ms var(--nits-ease-out),filter 150ms ease}
.niti-login #wp-submit:active{transform:scale(.97)}
@media(hover:hover) and (pointer:fine){.niti-login #wp-submit:hover{filter:brightness(.96)}}

/* ---------- Reduced motion (non-negotiable) ---------- */
@media(prefers-reduced-motion:reduce){
	.niti-btn,.niti-login #wp-submit,.niti-format-card{transition:none}
	.niti-btn:active,.niti-login #wp-submit:active{transform:none}
	.niti-spinner{animation-duration:1.6s}
	*{scroll-behavior:auto !important}
}
