/*
 * Tekimu platform-wide presentation layer.
 * Canonical references: INDEX_PAGE_DESIGN_SYSTEM.md and
 * PLATFORM_UI_REVAMP_INSTRUCTIONS.txt.
 */
:root {
    --tk-gold: #EF9F27;
    --tk-gold-deep: #C87E10;
    --tk-gold-soft: rgba(239,159,39,.14);
    --tk-green: #0F6E56;
    --tk-green-bright: #3DD68C;
    --tk-green-soft: rgba(15,110,86,.16);
    --tk-bg: #070A0E;
    --tk-surface: rgba(255,255,255,.04);
    --tk-surface-strong: rgba(13,17,23,.88);
    --tk-border: rgba(255,255,255,.09);
    --tk-text: #F2F2F2;
    --tk-muted: rgba(242,242,242,.68);
    --tk-danger: #FF5A5A;
    --tk-radius: 12px;
    --tk-shadow: 0 18px 55px rgba(0,0,0,.28);
    --tk-focus: 0 0 0 3px rgba(239,159,39,.18);
    --tk-entry-duration: .72s;
    --tk-entry-distance: 22px;
    --tk-entry-rotate: .35deg;
    --tk-entry-blur: 7px;
    --tk-entry-delay: 40ms;
}

[data-theme="light"] {
    --tk-bg: #F0EDE8;
    --tk-surface: rgba(255,255,255,.68);
    --tk-surface-strong: rgba(255,255,255,.9);
    --tk-border: rgba(13,13,13,.11);
    --tk-text: #0D0D0D;
    --tk-muted: rgba(10,10,10,.66);
    --tk-shadow: 0 16px 42px rgba(15,30,24,.1);
    --tk-focus: 0 0 0 3px rgba(15,110,86,.18);
}

html {
    color-scheme: dark;
    scroll-behavior: smooth;
}
[data-theme="light"] { color-scheme: light; }

body {
    font-family: 'Inter', sans-serif;
    background-color: var(--tk-bg);
    color: var(--tk-text);
    text-rendering: optimizeLegibility;
}

body::after {
    content: '';
    position: fixed;
    inset: 80px 0 0;
    z-index: -1;
    pointer-events: none;
    background:
        linear-gradient(rgba(239,159,39,.018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(15,110,86,.018) 1px, transparent 1px),
        radial-gradient(circle at 12% 22%, rgba(239,159,39,.07), transparent 31%),
        radial-gradient(circle at 88% 72%, rgba(15,110,86,.07), transparent 33%);
    background-size: 72px 72px, 72px 72px, auto, auto;
}

::selection { background: rgba(239,159,39,.3); color: var(--tk-text); }
[data-theme="light"] ::selection { background: rgba(15,110,86,.25); }

:where(main, [class$="-main"], [class*="-content"], .container, .wrapper) {
    min-width: 0;
}

:where(h1,h2,h3,h4,h5,h6) {
    font-family: 'Inter', sans-serif;
    color: var(--tk-text);
    text-wrap: balance;
}

:where(p,li,dd,td,.muted,.subtitle,.description) {
    line-height: 1.55;
}

:where(a,button,input,select,textarea) {
    -webkit-tap-highlight-color: transparent;
}

:where(a,button,input,select,textarea):focus-visible {
    outline: 2px solid var(--tk-gold);
    outline-offset: 2px;
}
[data-theme="light"] :where(a,button,input,select,textarea):focus-visible {
    outline-color: var(--tk-green);
}

/* Unified controls; selectors preserve original classes, IDs, and behavior. */
:where(
    button:not(.tkm-theme-btn):not(.tkm-burger),
    input[type="submit"],
    input[type="button"],
    input[type="reset"],
    [class*="btn"],
    [class*="button"]
) {
    font-family: 'Inter', sans-serif;
    font-weight: 750;
    transition:
        transform .22s cubic-bezier(.16,1,.3,1),
        box-shadow .22s ease,
        border-color .22s ease,
        background-color .22s ease,
        color .22s ease;
}

:where(
    button:not(:disabled):not(.tkm-theme-btn):not(.tkm-burger),
    input[type="submit"]:not(:disabled),
    input[type="button"]:not(:disabled),
    [class*="btn"]:not(.disabled),
    [class*="button"]:not(.disabled)
):hover {
    transform: translateY(-2px);
}

:where(
    button,
    input[type="submit"],
    input[type="button"],
    .btn-primary,
    .primary-btn,
    [class*="btn-primary"],
    [class*="primary-btn"]
):not(.tkm-theme-btn):not(.tkm-burger) {
    border-radius: 8px;
}

:where(.btn-primary,.primary-btn,[class*="btn-primary"],[class*="primary-btn"]) {
    background: linear-gradient(135deg, var(--tk-gold), var(--tk-gold-deep));
    border-color: rgba(239,159,39,.55);
    color: #0D0D0D;
    box-shadow: 0 8px 24px rgba(239,159,39,.2);
}
[data-theme="light"] :where(.btn-primary,.primary-btn,[class*="btn-primary"],[class*="primary-btn"]) {
    background: linear-gradient(135deg, var(--tk-green), #0A4F3E);
    border-color: rgba(15,110,86,.55);
    color: #FFF;
    box-shadow: 0 8px 24px rgba(15,110,86,.2);
}

/* Forms */
:where(
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
    select,
    textarea
) {
    max-width: 100%;
    min-height: 40px;
    border: 1px solid var(--tk-border);
    border-radius: 9px;
    background: var(--tk-surface);
    color: var(--tk-text);
    font-family: 'Inter', sans-serif;
    transition: border-color .22s ease, box-shadow .22s ease, background .22s ease;
}
:where(input,select,textarea):focus {
    border-color: rgba(239,159,39,.7);
    box-shadow: var(--tk-focus);
}
[data-theme="light"] :where(input,select,textarea):focus {
    border-color: rgba(15,110,86,.72);
}
:where(input,textarea)::placeholder { color: var(--tk-muted); opacity: .72; }
:where(label,.form-label,[class*="label"]) { font-weight: 650; }

/* Broad component normalization for existing page naming conventions. */
:where(
    [class$="-card"],
    [class*="-card "],
    [class$="-panel"],
    [class*="-panel "],
    [class$="-widget"],
    [class*="-widget "],
    [class*="stat-card"],
    [class*="metric-card"],
    [class*="form-container"],
    [class*="table-wrap"]
) {
    border-color: var(--tk-border);
    box-shadow: var(--tk-shadow);
}

:where(
    [class$="-card"],
    [class$="-panel"],
    [class$="-widget"],
    [class*="stat-card"],
    [class*="metric-card"]
) {
    transition:
        transform .34s cubic-bezier(.16,1,.3,1),
        border-color .34s ease,
        box-shadow .34s ease;
}
:where(
    [class$="-card"],
    [class$="-panel"],
    [class$="-widget"],
    [class*="stat-card"],
    [class*="metric-card"]
):hover {
    border-color: rgba(239,159,39,.38);
}
[data-theme="light"] :where(
    [class$="-card"],
    [class$="-panel"],
    [class$="-widget"],
    [class*="stat-card"],
    [class*="metric-card"]
):hover {
    border-color: rgba(15,110,86,.38);
}

/* Tables */
:where(.table-responsive,[class*="table-wrap"],[class*="table-container"]) {
    overflow-x: auto;
    border-radius: var(--tk-radius);
    scrollbar-width: thin;
    scrollbar-color: rgba(239,159,39,.35) transparent;
}
table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}
th {
    font-family: 'Courier New', monospace;
    font-size: .68rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}
:where(th,td) { border-color: var(--tk-border); }
tbody tr { transition: background-color .2s ease; }
tbody tr:hover { background: var(--tk-gold-soft); }
[data-theme="light"] tbody tr:hover { background: var(--tk-green-soft); }

/* Alerts and badges */
:where(.alert,.notice,[class*="alert"],[class*="notice"],[class*="message"]) {
    border-radius: 10px;
    border-width: 1px;
    backdrop-filter: blur(14px);
}
:where(.badge,[class$="-badge"],[class*="-badge "]) {
    font-family: 'Courier New', monospace;
    letter-spacing: .04em;
}

/* Shared site chrome */
.tkm-site-header {
    box-shadow: 0 12px 38px rgba(0,0,0,.18);
}
.tkm-desktop-nav a,
.tkm-mobile-drawer a {
    position: relative;
}

/* General and LMS sidebars receive the same premium shell. */
:where(
    #tkm-sidebar,
    .tkm-student-sidebar,
    .tkm-ins-sidebar,
    .tkm-admin-sidebar
) {
    border-right-color: var(--tk-border);
    box-shadow: 14px 0 45px rgba(0,0,0,.2);
}

:where(.ssb-link,.isb-link,.asb-link,.tkm-sb-link) {
    border-radius: 8px;
    transition:
        transform .28s cubic-bezier(.16,1,.3,1),
        color .28s ease,
        background .28s ease,
        border-color .28s ease;
}
[data-theme="light"] :where(.ssb-link,.isb-link,.asb-link,.tkm-sb-link).active {
    color: var(--tk-green);
    border-color: rgba(15,110,86,.25);
    background: linear-gradient(90deg, rgba(15,110,86,.15), rgba(15,110,86,.025));
}

/* Compact dashboards and portal regions. */
body:has(:where(#tkm-sidebar,.tkm-student-sidebar,.tkm-ins-sidebar,.tkm-admin-sidebar))
:where(main,[class$="-main"]) {
    padding-top: clamp(14px,2vw,24px);
}

:where(
    [class*="dashboard-grid"],
    [class*="stats-grid"],
    [class*="cards-grid"],
    [class*="course-grid"],
    [class*="metric-grid"]
) {
    gap: clamp(10px,1.4vw,16px);
}

/* Deterministic page-entry animation families. */
.tkm-entry-ready .tkm-entry-target {
    animation-duration: var(--tk-entry-duration);
    animation-delay: calc(var(--tk-entry-delay) + var(--tk-stagger, 0ms));
    animation-timing-function: cubic-bezier(.16,1,.3,1);
    animation-fill-mode: both;
    will-change: transform, opacity, filter;
}
.tkm-entry-ready[data-entry-family="0"] .tkm-entry-target { animation-name: tk-rise; }
.tkm-entry-ready[data-entry-family="1"] .tkm-entry-target { animation-name: tk-slide-left; }
.tkm-entry-ready[data-entry-family="2"] .tkm-entry-target { animation-name: tk-slide-right; }
.tkm-entry-ready[data-entry-family="3"] .tkm-entry-target { animation-name: tk-focus; }
.tkm-entry-ready[data-entry-family="4"] .tkm-entry-target { animation-name: tk-fold; transform-origin: top center; }
.tkm-entry-ready[data-entry-family="5"] .tkm-entry-target { animation-name: tk-zoom; }
.tkm-entry-ready[data-entry-family="6"] .tkm-entry-target { animation-name: tk-diagonal; }
.tkm-entry-ready[data-entry-family="7"] .tkm-entry-target { animation-name: tk-lift-tilt; }
.tkm-entry-ready[data-entry-family="8"] .tkm-entry-target { animation-name: tk-reveal-down; }
.tkm-entry-ready[data-entry-family="9"] .tkm-entry-target { animation-name: tk-depth; }
.tkm-entry-ready[data-entry-family="10"] .tkm-entry-target { animation-name: tk-soft-spin; }
.tkm-entry-ready[data-entry-family="11"] .tkm-entry-target { animation-name: tk-aurora-in; }

@keyframes tk-rise {
    from { opacity:0; transform:translateY(var(--tk-entry-distance)); filter:blur(var(--tk-entry-blur)); }
}
@keyframes tk-slide-left {
    from { opacity:0; transform:translateX(calc(var(--tk-entry-distance) * -1)); filter:blur(var(--tk-entry-blur)); }
}
@keyframes tk-slide-right {
    from { opacity:0; transform:translateX(var(--tk-entry-distance)); filter:blur(var(--tk-entry-blur)); }
}
@keyframes tk-focus {
    from { opacity:0; transform:scale(.975); filter:blur(calc(var(--tk-entry-blur) * 1.4)) brightness(1.25); }
}
@keyframes tk-fold {
    from { opacity:0; transform:perspective(1000px) rotateX(7deg) translateY(calc(var(--tk-entry-distance) * -.5)); filter:blur(var(--tk-entry-blur)); }
}
@keyframes tk-zoom {
    from { opacity:0; transform:scale(.94); filter:blur(var(--tk-entry-blur)); }
}
@keyframes tk-diagonal {
    from { opacity:0; transform:translate(calc(var(--tk-entry-distance) * -.65),var(--tk-entry-distance)); filter:blur(var(--tk-entry-blur)); }
}
@keyframes tk-lift-tilt {
    from { opacity:0; transform:translateY(var(--tk-entry-distance)) rotate(var(--tk-entry-rotate)); filter:blur(var(--tk-entry-blur)); }
}
@keyframes tk-reveal-down {
    from { opacity:0; transform:translateY(calc(var(--tk-entry-distance) * -1)); clip-path:inset(0 0 100%); filter:blur(calc(var(--tk-entry-blur) * .5)); }
}
@keyframes tk-depth {
    from { opacity:0; transform:perspective(1200px) translateZ(-90px) translateY(var(--tk-entry-distance)); filter:blur(var(--tk-entry-blur)); }
}
@keyframes tk-soft-spin {
    from { opacity:0; transform:scale(.965) rotate(calc(var(--tk-entry-rotate) * -1)); filter:blur(var(--tk-entry-blur)); }
}
@keyframes tk-aurora-in {
    from { opacity:0; transform:translateY(calc(var(--tk-entry-distance) * .6)) scale(.98); filter:blur(var(--tk-entry-blur)) saturate(.65) brightness(1.35); }
}

@media (max-width: 768px) {
    :root { --tk-entry-distance: 14px; --tk-entry-blur: 4px; }
    :where([class*="page-header"],[class*="content-header"]) { margin-bottom: 14px; }
    :where(.table-responsive,[class*="table-wrap"],[class*="table-container"]) {
        max-width: calc(100vw - 24px);
    }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *,*::before,*::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
    .tkm-entry-target { opacity:1 !important; transform:none !important; filter:none !important; }
}