/*
Theme Name: TUSD District Network
Description: District design system for the TUSD multisite demo — one theme, per-school branding through district-approved palettes, mobile-first, WCAG 2.2 AA.
Version: 1.0.0
Author: Cloud Recipe
Text Domain: tusd-district
*/

:root {
	--cr-primary: #1a3a5f;
	--cr-secondary: #0b6f63;
	--cr-accent: #b3541e;
	--cr-ink: #1c1c1c;
	--cr-paper: #ffffff;
	--cr-paper-2: #f4f4f0;
	--cr-radius: 8px;
	--cr-maxw: 72rem;
}

* { box-sizing: border-box; }

body {
	margin: 0;
	font-family: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	color: var(--cr-ink);
	background: var(--cr-paper);
	font-size: 1rem;
	line-height: 1.65;
	-webkit-text-size-adjust: 100%;
}

img { max-width: 100%; height: auto; }

a { color: var(--cr-primary); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover, a:focus { color: var(--cr-secondary); }

:focus-visible { outline: 3px solid var(--cr-accent); outline-offset: 2px; }

.skip-link {
	position: absolute; left: -9999px; top: 0; z-index: 1000;
	background: var(--cr-primary); color: #fff; padding: .6rem 1rem;
}
.skip-link:focus { left: 0; color: #fff; }

h1, h2, h3, h4, h5, h6 { line-height: 1.25; color: var(--cr-primary); font-weight: 700; }
h1 { font-size: clamp(1.7rem, 4vw, 2.4rem); }
h2 { font-size: clamp(1.35rem, 3vw, 1.8rem); }
h3 { font-size: clamp(1.15rem, 2.4vw, 1.4rem); }

/* ------- district identity bar (network-wide) ------- */
.cr-district-bar {
	background: #10233c; color: #fff;
	font-size: .85rem; padding: .35rem 1rem;
	display: flex; gap: 1rem; align-items: center; flex-wrap: wrap;
}
.cr-district-bar a { color: #fff; }
.cr-district-bar nav { display: flex; gap: .85rem; flex-wrap: wrap; }

/* ------- header ------- */
.cr-header {
	background: var(--cr-primary); color: #fff; padding: 1rem;
}
.cr-header-inner {
	max-width: var(--cr-maxw); margin: 0 auto;
	display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
}
.cr-header a { color: #fff; text-decoration: none; }
.cr-site-title { font-size: 1.35rem; font-weight: 800; }
.cr-mascot { font-size: .85rem; opacity: .92; }
.cr-header nav { margin-left: auto; }
.cr-header nav ul { list-style: none; display: flex; gap: 1.1rem; margin: 0; padding: 0; flex-wrap: wrap; }
.cr-header nav a { padding: .4rem .15rem; border-bottom: 3px solid transparent; }
.cr-header nav a:hover, .cr-header nav a:focus { border-bottom-color: #fff; }
.cr-header .cr-search-mini { display: flex; gap: .4rem; }
.cr-header .cr-search-mini input { border: 0; border-radius: var(--cr-radius); padding: .45rem .6rem; min-width: 9rem; }
.cr-header .cr-search-mini button { border: 0; border-radius: var(--cr-radius); background: var(--cr-accent); color: #fff; padding: .45rem .8rem; cursor: pointer; }

/* ------- hero ------- */
.cr-hero {
	background: linear-gradient(120deg, var(--cr-primary), var(--cr-secondary));
	color: #fff; padding: clamp(2rem, 6vw, 4.5rem) 1rem;
}
.cr-hero-inner { max-width: var(--cr-maxw); margin: 0 auto; }
.cr-hero h1, .cr-hero h2, .cr-hero p { color: #fff; }
.cr-hero .cr-button { background: #fff; color: var(--cr-primary); }

/* ------- layout ------- */
.cr-main { max-width: var(--cr-maxw); margin: 0 auto; padding: 1.5rem 1rem 3rem; }
.cr-grid { display: grid; gap: 1.25rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .cr-grid-2, .cr-grid-3 { grid-template-columns: 1fr 1fr; } }
@media (min-width: 960px) { .cr-grid-3 { grid-template-columns: 1fr 1fr 1fr; } }

.cr-card {
	background: var(--cr-paper); border: 1px solid #ddd; border-radius: var(--cr-radius);
	padding: 1.1rem 1.2rem; box-shadow: 0 1px 2px rgb(0 0 0 / 6%);
}
.cr-card h3 { margin-top: 0; }

.cr-button {
	display: inline-block; background: var(--cr-primary); color: #fff;
	padding: .6rem 1.2rem; border-radius: var(--cr-radius); text-decoration: none; font-weight: 600; border: 0; cursor: pointer;
}
.cr-button:hover, .cr-button:focus { background: var(--cr-secondary); color: #fff; }

/* ------- announcements / strip ------- */
.cr-district-strip {
	background: var(--cr-paper-2); border-left: 5px solid var(--cr-accent);
	padding: .65rem 1rem; font-size: .95rem;
}
.cr-announcements .cr-announcement { border-bottom: 1px solid #e2e2e2; padding: .75rem 0; }
.cr-announcement-date { color: #555; font-size: .88rem; margin: .1rem 0; }

/* ------- events ------- */
.cr-events-list { list-style: none; padding: 0; }
.cr-events-list li { display: flex; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid #e2e2e2; }
.cr-event-date {
	background: var(--cr-primary); color: #fff; border-radius: var(--cr-radius);
	min-width: 3.6rem; text-align: center; padding: .35rem .3rem; font-weight: 700; align-self: flex-start;
}
.cr-event-date span { display: block; font-size: .78rem; font-weight: 400; }

/* ------- staff directory ------- */
.cr-staff-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); }
.cr-staff-card { border: 1px solid #ddd; border-radius: var(--cr-radius); padding: 1rem; }
.cr-staff-card .cr-staff-role { color: var(--cr-secondary); font-weight: 600; font-size: .92rem; }
.cr-staff-card .cr-staff-dept { color: #555; font-size: .88rem; }

/* ------- tables ------- */
.cr-main table { border-collapse: collapse; width: 100%; }
.cr-main th, .cr-main td { border: 1px solid #cfcfcf; padding: .55rem .7rem; text-align: left; }
.cr-main th { background: var(--cr-paper-2); }

/* ------- search page ------- */
.cr-search-form { display: flex; gap: .6rem; flex-wrap: wrap; align-items: end; margin-bottom: 1rem; }
.cr-search-form label { display: block; font-size: .85rem; font-weight: 600; }
.cr-search-form input[type="search"], .cr-search-form select { padding: .45rem .55rem; border: 1px solid #999; border-radius: var(--cr-radius); }
.cr-search-results li { margin-bottom: .9rem; }
.cr-search-meta { color: #555; font-size: .88rem; }

/* ------- footer ------- */
.cr-footer { background: #10233c; color: #fff; margin-top: 2rem; }
.cr-footer-inner { max-width: var(--cr-maxw); margin: 0 auto; padding: 2rem 1rem; display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 720px) { .cr-footer-inner { grid-template-columns: 2fr 1fr 1fr; } }
.cr-footer a { color: #fff; }
.cr-footer h2 { color: #fff; font-size: 1.05rem; }
.cr-footer-legal { background: #0b1828; text-align: center; padding: .6rem 1rem; font-size: .85rem; }

/* ------- alert banner spacing ------- */
.cr-alert-banner a { font-weight: 700; }

/* ------- language switcher ------- */
.cr-lang-switch { display: inline-flex; gap: .5rem; align-items: center; }
.cr-lang-switch select { border-radius: var(--cr-radius); padding: .2rem .3rem; }

@media (max-width: 640px) {
	.cr-header-inner { flex-direction: column; align-items: flex-start; }
	.cr-header nav { margin-left: 0; }
}

@media print {
	.cr-district-bar, .cr-header nav, .cr-footer, .cr-alert-banner { display: none; }
}