/**
 * Tema jenjang sekolah — shell portal admin, guru, siswa + login tenant.
 * Warna dasar diinjeksi via #school-theme-vars (--school-primary*).
 */

/* ─── Shell background ───────────────────────────────────────── */

[data-portal="admin"] .admin-shell,
[data-portal="guru"] .admin-shell,
[data-portal="siswa"] .admin-shell {
    background: linear-gradient(
        160deg,
        var(--portal-shell-tint, #f0f7ff) 0%,
        color-mix(in srgb, var(--school-surface, #fff) 92%, var(--school-primary-light, #2563eb)) 42%,
        var(--school-surface, #fff) 100%
    );
    --ui-scroll-thumb-rest: color-mix(in srgb, var(--school-primary-light, #93c5fd) 58%, transparent);
    --ui-scroll-thumb-hover: color-mix(in srgb, var(--school-primary, #3b82f6) 82%, transparent);
    --ui-scroll-thumb-active: color-mix(in srgb, var(--school-primary-dark, #2563eb) 92%, transparent);
}

/* ─── Sidebar ────────────────────────────────────────────────── */

[data-portal="admin"] .ui-sidebar,
[data-portal="guru"] .ui-sidebar,
[data-portal="siswa"] .ui-sidebar {
    --sb-bg: linear-gradient(
        180deg,
        var(--portal-sidebar-brand, #1e3354) 0%,
        color-mix(in srgb, var(--school-primary-dark, #172a45) 88%, #000) 48%,
        color-mix(in srgb, var(--school-primary-dark, #122038) 95%, #000) 100%
    );
    --sb-border: color-mix(in srgb, var(--school-primary-light, #60a5fa) 14%, transparent);
    --sb-text: #ffffff;
    --sb-text-muted: #f8fafc;
    --sb-text-strong: #ffffff;
    --sb-hover: color-mix(in srgb, var(--school-primary-light, #60a5fa) 11%, transparent);
    --sb-active-bg: linear-gradient(
        90deg,
        color-mix(in srgb, var(--school-primary, #3b82f6) 28%, transparent) 0%,
        color-mix(in srgb, var(--school-primary, #3b82f6) 10%, transparent) 100%
    );
    --sb-active-text: #ffffff;
    --sb-active-accent: var(--school-primary-light, #60a5fa);
    --sb-icon-bg: rgba(255, 255, 255, 0.06);
    --sb-icon-active-bg: color-mix(in srgb, var(--school-primary, #3b82f6) 32%, transparent);
    --sb-logout: #fca5a5;
    box-shadow: 2px 0 28px rgba(15, 23, 42, 0.28);
}

[data-portal="admin"] .ui-sidebar-brand,
[data-portal="guru"] .ui-sidebar-brand,
[data-portal="siswa"] .ui-sidebar-brand {
    background: var(--portal-sidebar-brand, #1e3354);
}

[data-portal="admin"] .ui-sidebar-brand-icon,
[data-portal="guru"] .ui-sidebar-brand-icon,
[data-portal="siswa"] .ui-sidebar-brand-icon {
    background: linear-gradient(
        145deg,
        color-mix(in srgb, var(--school-primary, #3b82f6) 35%, transparent),
        color-mix(in srgb, var(--school-primary-dark, #2563eb) 20%, transparent)
    );
    color: var(--school-primary-light, #93c5fd);
    border: 1px solid color-mix(in srgb, var(--school-primary-light, #60a5fa) 28%, transparent);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

[data-portal="admin"] .ui-sidebar-brand-text span,
[data-portal="guru"] .ui-sidebar-brand-text span,
[data-portal="siswa"] .ui-sidebar-brand-text span {
    color: var(--portal-sidebar-muted, #7da3d4);
}

[data-portal="admin"] .ui-sidebar-link:hover .ui-sidebar-link-icon,
[data-portal="guru"] .ui-sidebar-link:hover .ui-sidebar-link-icon,
[data-portal="siswa"] .ui-sidebar-link:hover .ui-sidebar-link-icon {
    background: color-mix(in srgb, var(--school-primary-light, #60a5fa) 16%, transparent);
    color: #ffffff;
}

[data-portal="admin"] .ui-sidebar-link.active,
[data-portal="guru"] .ui-sidebar-link.active,
[data-portal="siswa"] .ui-sidebar-link.active {
    border-color: color-mix(in srgb, var(--school-primary-light, #60a5fa) 22%, transparent);
    box-shadow: inset 3px 0 0 var(--school-primary-light, #60a5fa);
}

[data-portal="admin"] .ui-sidebar-link.active .ui-sidebar-link-icon,
[data-portal="guru"] .ui-sidebar-link.active .ui-sidebar-link-icon,
[data-portal="siswa"] .ui-sidebar-link.active .ui-sidebar-link-icon {
    background: var(--portal-sidebar-glow-strong, rgba(59, 130, 246, 0.38));
    color: color-mix(in srgb, var(--school-accent-soft, #dbeafe) 85%, #fff);
}

/* ─── Topbar admin sekolah ───────────────────────────────────── */

[data-portal="admin"] .ui-topbar {
    --tb-text: #fff;
    --tb-muted: rgba(255, 255, 255, 0.72);
    --tb-border: rgba(255, 255, 255, 0.14);
    --tb-glass: rgba(255, 255, 255, 0.1);
    --tb-glass-hover: rgba(255, 255, 255, 0.16);
    --tb-glass-border: rgba(255, 255, 255, 0.2);
    background: linear-gradient(
        90deg,
        var(--portal-topbar-grad-start, #0c1940) 0%,
        var(--portal-topbar-grad-mid, #1e3a8a) 52%,
        var(--portal-topbar-grad-end, #2f4f94) 100%
    );
    border-bottom-color: var(--tb-border);
    box-shadow: 0 4px 24px rgba(15, 23, 42, 0.14);
}

[data-portal="admin"] .ui-topbar::before {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, transparent 42%),
        radial-gradient(ellipse 55% 120% at 100% 0%, var(--portal-sidebar-glow, rgba(147, 197, 253, 0.18)) 0%, transparent 62%);
}

[data-portal="admin"] .ui-topbar::after {
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255, 255, 255, 0.16) 28%,
        color-mix(in srgb, var(--school-primary-light, #bfdbfe) 38%, transparent) 50%,
        rgba(255, 255, 255, 0.16) 72%,
        transparent 100%
    );
}

/* ─── Topbar guru & siswa (terang) ───────────────────────────── */

[data-portal="guru"] .ui-topbar,
[data-portal="siswa"] .ui-topbar {
    background: color-mix(in srgb, var(--school-surface, #fff) 94%, var(--school-primary-light, #93c5fd));
    border-bottom-color: color-mix(in srgb, var(--school-primary-light, #93c5fd) 35%, transparent);
}

[data-portal="guru"] .ui-topbar-toggle,
[data-portal="siswa"] .ui-topbar-toggle {
    border-color: color-mix(in srgb, var(--school-primary-light, #93c5fd) 50%, transparent);
    color: var(--school-primary, #2563eb);
}

[data-portal="guru"] .ui-topbar-eyebrow,
[data-portal="siswa"] .ui-topbar-eyebrow {
    color: var(--school-primary-light, #60a5fa);
}

[data-portal="guru"] .ui-topbar-title,
[data-portal="siswa"] .ui-topbar-title {
    color: var(--school-primary-dark, #1e3a8a);
}

[data-portal="guru"] .sa-page-hero,
[data-portal="siswa"] .sa-page-hero {
    border-color: color-mix(in srgb, var(--school-primary-light, #93c5fd) 45%, transparent);
}

[data-portal="siswa"] .sa-siswa-welcome {
    background: var(--school-accent-soft, #eff6ff);
    border-color: color-mix(in srgb, var(--school-primary-light, #93c5fd) 45%, transparent);
    color: var(--school-primary-dark, #1e40af);
}

/* ─── Login tenant ───────────────────────────────────────────── */

body[data-portal="auth_admin"].auth-asc,
body[data-portal="auth_guru"].auth-guru,
body[data-portal="auth_siswa"].auth-siswa {
    --asc-blue-100: var(--school-accent-soft, #eff6ff);
    --asc-blue-500: var(--school-primary-light, #3b82f6);
    --asc-blue-600: var(--school-primary, #2563eb);
    --asc-blue-700: var(--school-primary-dark, #1d4ed8);
}

body[data-portal="auth_admin"] .auth-asc-mark,
body[data-portal="auth_guru"] .auth-guru-logo,
body[data-portal="auth_siswa"] .auth-siswa-logo {
    color: var(--school-primary, #2563eb);
}

body[data-portal="auth_admin"] .auth-asc-mark,
body[data-portal="auth_guru"] .auth-guru-logo-media:not(.has-photo),
body[data-portal="auth_siswa"] .auth-siswa-logo-media:not(.has-photo) {
    background: var(--school-accent-soft, #eff6ff);
}

body[data-portal="auth_admin"] .auth-asc-submit,
body[data-portal="auth_guru"] .auth-guru-submit,
body[data-portal="auth_siswa"] .auth-siswa-submit {
    background: linear-gradient(
        135deg,
        var(--school-primary-light, #3b82f6),
        var(--school-primary, #2563eb)
    );
    border-color: var(--school-primary, #2563eb);
    color: var(--school-on-primary, #fff);
}

body[data-portal="auth_admin"] .auth-asc-submit:hover,
body[data-portal="auth_admin"] .auth-asc-submit:focus-visible,
body[data-portal="auth_guru"] .auth-guru-submit:hover,
body[data-portal="auth_guru"] .auth-guru-submit:focus-visible,
body[data-portal="auth_siswa"] .auth-siswa-submit:hover,
body[data-portal="auth_siswa"] .auth-siswa-submit:focus-visible {
    background: linear-gradient(
        135deg,
        var(--school-primary, #2563eb),
        var(--school-primary-dark, #1d4ed8)
    );
    border-color: var(--school-primary-dark, #1d4ed8);
    color: var(--school-on-primary, #fff);
}

body[data-portal="auth_admin"] .auth-asc-foot a:hover,
body[data-portal="auth_guru"] .auth-guru-foot a:hover,
body[data-portal="auth_siswa"] .auth-siswa-foot a:hover {
    color: var(--school-primary-dark, #1d4ed8);
}

body[data-portal="auth_guru"] .auth-guru-orb-1 {
    background: color-mix(in srgb, var(--school-primary, #3b82f6) 22%, transparent);
}

body[data-portal="auth_guru"] .auth-guru-orb-2 {
    background: color-mix(in srgb, var(--school-primary-light, #60a5fa) 18%, transparent);
}

body[data-portal="auth_siswa"] .auth-siswa-orb-1 {
    background: color-mix(in srgb, var(--school-primary, #3b82f6) 22%, transparent);
}

body[data-portal="auth_siswa"] .auth-siswa-orb-2 {
    background: color-mix(in srgb, var(--school-primary-light, #60a5fa) 18%, transparent);
}

/* ─── Bootstrap & ui-btn — hover teks kontras (tenant portals) ─ */

[data-portal="public"] .btn-primary,
[data-portal="admin"] .btn-primary,
[data-portal="guru"] .btn-primary,
[data-portal="siswa"] .btn-primary,
[data-portal="pmb"] .btn-primary,
[data-portal="pmb_portal"] .btn-primary,
[data-portal="public"] .ui-btn-primary,
[data-portal="admin"] .ui-btn-primary,
[data-portal="guru"] .ui-btn-primary,
[data-portal="siswa"] .ui-btn-primary,
[data-portal="pmb"] .ui-btn-primary,
[data-portal="pmb_portal"] .ui-btn-primary {
    --bs-btn-color: var(--school-on-primary, #fff);
    --bs-btn-hover-color: var(--school-on-primary, #fff);
    --bs-btn-active-color: var(--school-on-primary, #fff);
    --bs-btn-disabled-color: var(--school-on-primary, #fff);
    --bs-btn-bg: var(--school-primary, #2563eb);
    --bs-btn-border-color: var(--school-primary, #2563eb);
    --bs-btn-hover-bg: var(--school-primary-dark, #1d4ed8);
    --bs-btn-hover-border-color: var(--school-primary-dark, #1d4ed8);
    --bs-btn-active-bg: var(--school-primary-dark, #1e40af);
    --bs-btn-active-border-color: var(--school-primary-dark, #1e40af);
}

[data-portal="public"] .btn-primary:hover,
[data-portal="public"] .btn-primary:focus-visible,
[data-portal="admin"] .btn-primary:hover,
[data-portal="admin"] .btn-primary:focus-visible,
[data-portal="guru"] .btn-primary:hover,
[data-portal="guru"] .btn-primary:focus-visible,
[data-portal="siswa"] .btn-primary:hover,
[data-portal="siswa"] .btn-primary:focus-visible,
[data-portal="pmb"] .btn-primary:hover,
[data-portal="pmb"] .btn-primary:focus-visible,
[data-portal="pmb_portal"] .btn-primary:hover,
[data-portal="pmb_portal"] .btn-primary:focus-visible {
    color: var(--school-on-primary, #fff) !important;
}

[data-portal="public"] .btn-outline-primary,
[data-portal="admin"] .btn-outline-primary,
[data-portal="guru"] .btn-outline-primary,
[data-portal="siswa"] .btn-outline-primary,
[data-portal="pmb"] .btn-outline-primary,
[data-portal="pmb_portal"] .btn-outline-primary {
    --bs-btn-color: var(--school-primary, #2563eb);
    --bs-btn-border-color: color-mix(in srgb, var(--school-primary, #2563eb) 55%, transparent);
    --bs-btn-hover-color: var(--school-on-primary, #fff);
    --bs-btn-hover-bg: var(--school-primary, #2563eb);
    --bs-btn-hover-border-color: var(--school-primary, #2563eb);
    --bs-btn-active-color: var(--school-on-primary, #fff);
    --bs-btn-active-bg: var(--school-primary-dark, #1d4ed8);
    --bs-btn-active-border-color: var(--school-primary-dark, #1d4ed8);
    --bs-btn-focus-shadow-rgb: var(--school-primary-rgb, 37, 99, 235);
}

[data-portal="public"] .btn-outline-primary:hover,
[data-portal="public"] .btn-outline-primary:focus-visible,
[data-portal="admin"] .btn-outline-primary:hover,
[data-portal="admin"] .btn-outline-primary:focus-visible,
[data-portal="guru"] .btn-outline-primary:hover,
[data-portal="guru"] .btn-outline-primary:focus-visible,
[data-portal="siswa"] .btn-outline-primary:hover,
[data-portal="siswa"] .btn-outline-primary:focus-visible,
[data-portal="pmb"] .btn-outline-primary:hover,
[data-portal="pmb"] .btn-outline-primary:focus-visible,
[data-portal="pmb_portal"] .btn-outline-primary:hover,
[data-portal="pmb_portal"] .btn-outline-primary:focus-visible {
    color: var(--school-on-primary, #fff) !important;
}

[data-portal="public"] .btn-secondary:hover,
[data-portal="public"] .btn-secondary:focus-visible,
[data-portal="admin"] .btn-secondary:hover,
[data-portal="admin"] .btn-secondary:focus-visible,
[data-portal="guru"] .btn-secondary:hover,
[data-portal="guru"] .btn-secondary:focus-visible,
[data-portal="siswa"] .btn-secondary:hover,
[data-portal="siswa"] .btn-secondary:focus-visible {
    color: var(--school-text, #0f172a);
}

[data-portal="public"] .text-primary,
[data-portal="admin"] .text-primary,
[data-portal="guru"] .text-primary,
[data-portal="siswa"] .text-primary {
    color: var(--school-primary, #2563eb) !important;
}

/* Link konten — jangan timpa nav/sidebar/tombol */
[data-portal="public"] .pub-prose a:hover,
[data-portal="public"] .pub-section-desc a:hover,
[data-portal="public"] .pub-news-card-title a:hover,
[data-portal="public"] .pub-news-card-link:hover,
[data-portal="public"] .pub-detail-sidebar-link:hover,
[data-portal="public"] .pub-detail-sidebar-foot-link:not(.is-logout):hover,
[data-portal="public"] .pub-breadcrumb .breadcrumb-item a:hover,
[data-portal="admin"] .admin-content a:not([class*="btn"]):not(.ui-sidebar-link):not(.ui-btn):hover,
[data-portal="guru"] .admin-content a:not([class*="btn"]):not(.ui-sidebar-link):not(.ui-btn):hover,
[data-portal="siswa"] .admin-content a:not([class*="btn"]):not(.ui-sidebar-link):not(.ui-btn):hover {
    color: var(--school-primary-dark, #1d4ed8);
}

[data-portal="admin"] .ui-topbar-action:hover,
[data-portal="admin"] .ui-topbar-action:focus-visible,
[data-portal="admin"] .ui-topbar-user-link:hover,
[data-portal="admin"] .ui-topbar-user-link:focus-visible {
    color: var(--school-on-primary, #fff);
}

[data-portal="guru"] .ui-topbar-toggle:hover,
[data-portal="guru"] .ui-topbar-toggle:focus-visible,
[data-portal="siswa"] .ui-topbar-toggle:hover,
[data-portal="siswa"] .ui-topbar-toggle:focus-visible {
    color: var(--school-primary-dark, #1e3a8a);
    background: color-mix(in srgb, var(--school-accent-soft, #eff6ff) 80%, #fff);
}

[data-portal="admin"] .ui-sidebar-link:hover,
[data-portal="admin"] .ui-sidebar-link:focus-visible,
[data-portal="guru"] .ui-sidebar-link:hover,
[data-portal="guru"] .ui-sidebar-link:focus-visible,
[data-portal="siswa"] .ui-sidebar-link:hover,
[data-portal="siswa"] .ui-sidebar-link:focus-visible {
    color: var(--school-on-primary, #fff);
}

[data-portal="admin"] .ui-sidebar-link.active,
[data-portal="admin"] .ui-sidebar-link.active:hover,
[data-portal="guru"] .ui-sidebar-link.active,
[data-portal="guru"] .ui-sidebar-link.active:hover,
[data-portal="siswa"] .ui-sidebar-link.active,
[data-portal="siswa"] .ui-sidebar-link.active:hover {
    color: var(--school-on-primary, #fff);
}
