/* Burunduk 005: original school logo and palette from burunduk.center's hero.
   Operational status and grade colors deliberately keep their existing meanings. */
:root {
    --ink: #18394e;
    --muted: #5b6b63;
    --line: #dbe4d5;
    --surface: #fff;
    --canvas: #f7f9f3;
    --soft: #eef3e8;
    --green: #0e5c4b;
    --green-2: #457b4d;
    --admin: #0e5c4b;
    --admin-dark: #18394e;
    --admin-soft: #edf4e9;
    --teacher: #2b564d;
    --student: #457b4d;
    --parent: #18394e;
    --shadow: 0 18px 55px rgba(24, 57, 78, .09);
    --school-leaf: #79a62e;
    --school-leaf-light: #b7c9ad;
    --school-sunlight: #f5ec9d;
}
.app-shell[data-role="teacher"] { --admin: var(--teacher); --admin-dark: #18394e; --admin-soft: #edf4e9; }
.app-shell[data-role="student"] { --admin: var(--student); --admin-dark: #2b564d; --admin-soft: #edf4e9; }
.app-shell[data-role="parent"] { --admin: var(--parent); --admin-dark: #102c3d; --admin-soft: #edf3ef; }

/* The complete supplied PNG is shown in its original aspect ratio and colors. */
.school-logo { display: block; flex: 0 0 auto; height: auto; object-fit: contain; }
.school-logo-sidebar { width: 48px; }
.school-logo-auth { width: 96px; }
.school-logo-mobile { display: none; width: 64px; }
.school-logo-home { width: 64px; align-self: center; }
.school-logo-role { width: 64px; margin-bottom: 18px; }

.app-shell .sidebar,
.app-shell[data-role="teacher"] .sidebar,
.app-shell[data-role="student"] .sidebar,
.app-shell[data-role="parent"] .sidebar {
    background: linear-gradient(165deg, #18394e, #2b564d);
    box-shadow: 12px 0 35px rgba(24, 57, 78, .12);
}
.sidebar .brand { gap: 12px; padding-bottom: 20px; }
.sidebar .brand > span { min-width: 0; }
.sidebar .brand strong { color: #fff; }
.sidebar .brand small { color: #d5e3d2; }
.sidebar .nav-link { color: #e2ecdf; }
.sidebar .nav-link:hover { background: rgba(183, 201, 173, .14); }
.sidebar .nav-link.is-active { color: #fff; background: #0e5c4b; box-shadow: inset 3px 0 #79a62e; }
.sidebar .role-switch small { color: #d5e3d2; }
.app-shell .topbar { background: rgba(247, 249, 243, .96); border-bottom-color: var(--line); }
.button-primary { box-shadow: 0 8px 22px rgba(14, 92, 75, .14); }
.field input:focus, .field select:focus, .field textarea:focus,
.filter-bar input:focus, .filter-bar select:focus, .password-field:focus-within {
    box-shadow: 0 0 0 3px rgba(121, 166, 46, .18);
}
.year-pill { border-color: var(--line); }
.year-pill small { color: #526d5c; }

.auth-page { background: var(--canvas); }
.auth-intro {
    background: radial-gradient(ellipse at 90% 8%, rgba(121, 166, 46, .24), transparent 45%),
                linear-gradient(145deg, #18394e, #2b564d 75%, #0e5c4b);
}
.auth-brand { gap: 20px; }
.auth-brand small { color: #dce8d4; opacity: 1; }
.auth-message { padding: 44px 0; }
.auth-message h1 { font-size: clamp(42px, 5.3vw, 72px); line-height: 1.04; }
.auth-message p { color: #e3eddc; }
.auth-kicker { color: #f5ec9d; }
.auth-page .role-color { color: #edf4e8; border-color: rgba(183, 201, 173, .35); }
.auth-page .role-color::before { background: #b7c9ad; }
.auth-page .button-primary { background: #0e5c4b; box-shadow: 0 8px 22px rgba(14, 92, 75, .15); }
.auth-page .button-primary:hover { background: #18394e; }
.auth-page .password-field:focus-within { border-color: #0e5c4b; box-shadow: 0 0 0 3px rgba(121, 166, 46, .18); }
.auth-page .login-card { border-color: var(--line); }
.role-page { background: radial-gradient(circle at top left, #fff, transparent 45%), var(--canvas); }

.school-home-hero {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr) auto;
    align-items: center;
    gap: 24px;
    padding: clamp(20px, 3vw, 31px);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: radial-gradient(ellipse at top right, rgba(245, 236, 157, .32), transparent 55%), #fff;
    box-shadow: 0 8px 32px rgba(24, 57, 78, .04);
}
.school-home-hero > div { min-width: 0; }
.school-home-hero h1 { color: var(--ink); font-size: clamp(27px, 3.2vw, 38px); }
.school-home-hero p { max-width: 680px; }

@media (max-width: 1100px) {
    .school-home-hero { grid-template-columns: 64px minmax(0, 1fr); }
    .school-home-hero > .year-pill,
    .school-home-hero > .student-context-chip { grid-column: 2; justify-self: start; }
}
@media (max-width: 900px) {
    .school-logo-mobile { display: block; }
}
@media (max-width: 760px) {
    .school-home-hero { grid-template-columns: 44px minmax(0, 1fr); gap: 14px; padding: 17px; }
    .school-logo-home { width: 44px; align-self: start; }
    .school-home-hero h1 { font-size: 27px; }
    .school-home-hero > .year-pill,
    .school-home-hero > .student-context-chip { grid-column: 1 / -1; width: 100%; }
    .school-home-hero p { font-size: 13px; }
    .school-logo-role { width: 52px; }
}
@media print {
    .school-home-hero { background: #fff; box-shadow: none; }
    .school-logo-home { width: 36px; }
}

/* 006: transparent white logo stays white on dark surfaces and becomes ink on light ones. */
.school-logo-home,.school-logo-role,.school-logo-mobile { filter: brightness(0) saturate(100%) invert(17%) sepia(15%) saturate(2000%) hue-rotate(161deg) brightness(94%) contrast(91%); }


/* 008: one school-wide lunch, rendered separately from lessons and results. */
.school-lunch {
    min-width: 0;
    color: var(--ink, #18394e);
    background: #f8f3d3;
    border: 1px solid #e3ddb7;
    text-align: left;
    break-inside: avoid;
}
.school-lunch:not(.tt-card) {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 18px;
    padding: 13px 16px;
    margin: 8px 0;
    border-radius: 12px;
}
.school-lunch .school-lunch-time { font-size: 13px; font-weight: 700; white-space: nowrap; }
.school-lunch strong { font-size: 14px; line-height: 1.4; overflow-wrap: anywhere; }
.student-diary-table .school-lunch-table-row > td {
    width: auto;
    padding: 6px 12px;
    text-align: left;
}
.student-diary-table .school-lunch-table-row .school-lunch { margin: 0; }
@media (max-width: 760px) {
    .school-lunch:not(.tt-card) { gap: 6px 12px; padding: 11px 12px; }
    .student-diary-table tr.school-lunch-table-row { display: block; padding: 0; border: 0; }
    .student-diary-table tr.school-lunch-table-row > td {
        display: block;
        grid-row: auto;
        width: auto;
        padding: 0;
        border: 0;
    }
    .student-diary-table tr.school-lunch-table-row > td::before { display: none; }
}
@media print {
    .school-lunch { color: #000; background: #fff; border-color: #aaa; box-shadow: none; }
}
