/* rc165 — Unified Color Premium UIX */
:root{
  --ux-bg:#0b1020;
  --ux-canvas:#f4f7fb;
  --ux-text:#101828;
  --ux-text-2:#344054;
  --ux-muted:#667085;
  --ux-line:#d9e2ef;
  --ux-white:#fff;
  --ux-shadow:0 12px 32px rgba(15,23,42,.10);
  --ux-shadow-hover:0 22px 48px rgba(15,23,42,.14);
  --ux-radius:20px;
  --ux-radius-sm:13px;
  --ux-ease:220ms cubic-bezier(.2,.8,.2,1);

  --tone-1:#5b5bd6; --tone-1-soft:#eeeeff; --tone-1-dark:#35358f;
  --tone-2:#2477c8; --tone-2-soft:#eaf4ff; --tone-2-dark:#15538f;
  --tone-3:#168579; --tone-3-soft:#e9f8f5; --tone-3-dark:#0d5e56;
  --tone-4:#25895e; --tone-4-soft:#ecf8f1; --tone-4-dark:#176443;
  --tone-5:#b8791e; --tone-5-soft:#fff6e6; --tone-5-dark:#805314;
  --tone-6:#8253b5; --tone-6-soft:#f4edfb; --tone-6-dark:#5d3885;
  --tone-7:#b84d69; --tone-7-soft:#fff0f4; --tone-7-dark:#88354c;
  --tone-8:#3d647e; --tone-8-soft:#edf4f8; --tone-8-dark:#274a60;
}

html,body{background:var(--ux-canvas)!important}
body{
  color:var(--ux-text)!important;
  background:
    radial-gradient(circle at 0 0,rgba(91,91,214,.07),transparent 31rem),
    radial-gradient(circle at 100% 0,rgba(22,133,121,.06),transparent 27rem),
    linear-gradient(180deg,#eef3f9 0,#f7f9fc 260px,#f2f5f9 100%)!important;
}
body :where(h1,h2,h3,h4,h5,h6){color:#101828!important;font-weight:800!important;letter-spacing:-.025em}
body :where(p,td,li,label,dd){color:#344054!important}
body :where(small,.muted,.subtle,.meta,.hint,.helper){color:#667085!important}

/* Premium dark navigation */
body :where(.sidebar,.teacher-sidebar,.student-sidebar,.portal-sidebar){
  background:
    linear-gradient(180deg,#11182a 0%,#172036 58%,#121a2c 100%)!important;
  border-right:1px solid rgba(255,255,255,.06)!important;
  box-shadow:12px 0 35px rgba(16,24,40,.16)!important;
}
body :where(.sidebar-brand,.teacher-brand,.student-brand,.portal-brand){
  color:#fff!important;border-bottom-color:rgba(255,255,255,.08)!important
}
body :where(.sidebar a,.teacher-sidebar a,.student-sidebar a,.portal-sidebar a){
  color:#b8c4d8!important;
  border:1px solid transparent!important;
  border-radius:12px!important;
  transition:all var(--ux-ease)!important;
}
body :where(.sidebar a,.teacher-sidebar a,.student-sidebar a,.portal-sidebar a):hover{
  color:#fff!important;
  background:rgba(255,255,255,.075)!important;
  border-color:rgba(255,255,255,.06)!important;
  transform:translateX(3px)!important;
}
body :where(.sidebar a.active,.teacher-sidebar a.active,.student-sidebar a.active,.portal-sidebar a.active,[aria-current="page"]){
  color:#fff!important;
  background:linear-gradient(135deg,#5b5bd6,#4775d1)!important;
  box-shadow:0 10px 22px rgba(70,80,200,.28)!important;
}
body :where(.nav-icon){filter:saturate(1.1) brightness(1.08)}

body :where(.topbar,.admin-topbar,.teacher-topbar,.student-topbar,.portal-topbar){
  background:rgba(247,249,252,.88)!important;
  border-bottom:1px solid #d8e1ec!important;
  box-shadow:0 7px 24px rgba(16,24,40,.055)!important;
  backdrop-filter:blur(18px) saturate(140%);
}

/* Page heroes */
body :where([class*="-hero"],.page-hero,.hero){
  background:linear-gradient(135deg,#273550,#354c73 54%,#326d70)!important;
  color:#fff!important;
  border:0!important;
  border-radius:26px!important;
  box-shadow:0 18px 42px rgba(31,42,68,.18)!important;
  position:relative;overflow:hidden;
}
body :where([class*="-hero"],.page-hero,.hero) :where(h1,h2,h3,p,span,small,strong){color:#fff!important}
body :where([class*="-hero"],.page-hero,.hero)::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(circle at 85% 15%,rgba(255,255,255,.13),transparent 18rem),
    linear-gradient(105deg,rgba(91,91,214,.16),transparent 42%);
  pointer-events:none;
}

/* Rich segmented tabs */
body :where(nav[data-page-tabs],.tabs,[role="tablist"],.ng-premium-tabs){
  display:flex!important;gap:7px!important;padding:7px!important;
  background:#dfe7f1!important;border:1px solid #d2dce9!important;border-radius:17px!important;
  box-shadow:inset 0 1px 2px rgba(16,24,40,.06),0 8px 22px rgba(16,24,40,.06)!important;
  overflow-x:auto;
}
body :where(nav[data-page-tabs],.tabs,[role="tablist"],.ng-premium-tabs) :where(a,button,[role="tab"]){
  min-height:41px!important;padding:9px 14px!important;border-radius:12px!important;
  color:#4b5c73!important;background:rgba(255,255,255,.42)!important;border:1px solid transparent!important;
  font-weight:750!important;transition:all var(--ux-ease)!important;
}
body :where(nav[data-page-tabs],.tabs,[role="tablist"],.ng-premium-tabs) :where(a,button,[role="tab"]):hover{
  color:#172033!important;background:#fff!important;border-color:#d3ddea!important;transform:translateY(-1px)!important;
}
body .uix-tabs-tone-1 :where(.active,[aria-selected="true"],[aria-current="page"]){background:linear-gradient(135deg,#5b5bd6,#7474e7)!important}
body .uix-tabs-tone-2 :where(.active,[aria-selected="true"],[aria-current="page"]){background:linear-gradient(135deg,#2477c8,#4b91d5)!important}
body .uix-tabs-tone-3 :where(.active,[aria-selected="true"],[aria-current="page"]){background:linear-gradient(135deg,#168579,#2b9e91)!important}
body .uix-tabs-tone-4 :where(.active,[aria-selected="true"],[aria-current="page"]){background:linear-gradient(135deg,#8253b5,#9a70c8)!important}
body :where(nav[data-page-tabs],.tabs,[role="tablist"],.ng-premium-tabs) :where(.active,[aria-selected="true"],[aria-current="page"]){
  color:#fff!important;border-color:transparent!important;box-shadow:0 8px 18px rgba(42,55,90,.20)!important;
}

/* Every card gets a tone */
body :where(.card,.panel,.widget,.tile,.stat-card,.metric-card,.kpi-card,.dashboard-card,.ng-premium-surface,[class*="-panel"],[class*="-card"]){
  border-radius:var(--ux-radius)!important;
  border:1px solid var(--uix-line,#d7e0eb)!important;
  background:var(--uix-soft,#f7f9fc)!important;
  box-shadow:var(--ux-shadow)!important;
  color:#172033!important;
  position:relative;overflow:hidden;
  transition:transform var(--ux-ease),box-shadow var(--ux-ease),border-color var(--ux-ease)!important;
}
body :where(.card,.panel,.widget,.tile,.stat-card,.metric-card,.kpi-card,.dashboard-card,.ng-premium-surface,[class*="-panel"],[class*="-card"])::before{
  content:"";position:absolute;left:0;top:0;right:0;height:4px;background:var(--uix-accent,#64748b);z-index:1;
}
body :where(.card,.panel,.widget,.tile,.stat-card,.metric-card,.kpi-card,.dashboard-card,.ng-premium-surface,[class*="-panel"],[class*="-card"])::after{
  content:"";position:absolute;width:130px;height:130px;border-radius:50%;
  right:-56px;top:-63px;background:var(--uix-glow,rgba(100,116,139,.10));pointer-events:none;
}
body :where(.card,.panel,.widget,.tile,.stat-card,.metric-card,.kpi-card,.dashboard-card,.ng-premium-surface,[class*="-panel"],[class*="-card"]):hover{
  transform:translateY(-4px)!important;box-shadow:var(--ux-shadow-hover)!important;border-color:var(--uix-accent,#b8c4d4)!important;
}

/* tone assignments via utility classes */
.uix-tone-1{--uix-accent:var(--tone-1);--uix-soft:var(--tone-1-soft);--uix-line:#d9d9fb;--uix-glow:rgba(91,91,214,.11)}
.uix-tone-2{--uix-accent:var(--tone-2);--uix-soft:var(--tone-2-soft);--uix-line:#d1e7f9;--uix-glow:rgba(36,119,200,.10)}
.uix-tone-3{--uix-accent:var(--tone-3);--uix-soft:var(--tone-3-soft);--uix-line:#cfe9e4;--uix-glow:rgba(22,133,121,.10)}
.uix-tone-4{--uix-accent:var(--tone-4);--uix-soft:var(--tone-4-soft);--uix-line:#d3eadc;--uix-glow:rgba(37,137,94,.10)}
.uix-tone-5{--uix-accent:var(--tone-5);--uix-soft:var(--tone-5-soft);--uix-line:#eedfc4;--uix-glow:rgba(184,121,30,.11)}
.uix-tone-6{--uix-accent:var(--tone-6);--uix-soft:var(--tone-6-soft);--uix-line:#e2d5ef;--uix-glow:rgba(130,83,181,.11)}
.uix-tone-7{--uix-accent:var(--tone-7);--uix-soft:var(--tone-7-soft);--uix-line:#efd4dc;--uix-glow:rgba(184,77,105,.11)}
.uix-tone-8{--uix-accent:var(--tone-8);--uix-soft:var(--tone-8-soft);--uix-line:#d7e4eb;--uix-glow:rgba(61,100,126,.10)}

body :where(.stat-card,.metric-card,.kpi-card,[class*="-metrics"] article,[class*="-stats"] article) strong{font-size:1.78rem!important;font-weight:850!important;color:#142033!important}
body :where(.stat-card,.metric-card,.kpi-card,[class*="-metrics"] article,[class*="-stats"] article) span{color:#526278!important;font-weight:700!important}

/* Tables get colored identity */
body :where(.table-wrap,.ng-responsive-table,[class*="-table-wrap"]){
  --table-accent:#5b5bd6;--table-soft:#f6f6ff;--table-head:#e9e9ff;
  border:1px solid #d8e1ec!important;border-radius:19px!important;background:var(--table-soft)!important;
  box-shadow:var(--ux-shadow)!important;overflow:auto;
}
.uix-table-tone-1{--table-accent:#5b5bd6;--table-soft:#f8f7ff;--table-head:#e9e8ff}
.uix-table-tone-2{--table-accent:#2477c8;--table-soft:#f4f9fe;--table-head:#e4f0fb}
.uix-table-tone-3{--table-accent:#168579;--table-soft:#f3faf8;--table-head:#e1f1ee}
.uix-table-tone-4{--table-accent:#8253b5;--table-soft:#f8f4fc;--table-head:#eee4f7}
.uix-table-tone-5{--table-accent:#b8791e;--table-soft:#fcf8ef;--table-head:#f6ead2}
body :where(.table-wrap,.ng-responsive-table,[class*="-table-wrap"]) table{background:transparent!important}
body :where(.table-wrap,.ng-responsive-table,[class*="-table-wrap"]) th{
  background:var(--table-head)!important;color:#334155!important;font-weight:850!important;
  border-bottom:2px solid color-mix(in srgb,var(--table-accent) 28%,#d8e1ec)!important;
}
body :where(.table-wrap,.ng-responsive-table,[class*="-table-wrap"]) td{
  background:rgba(255,255,255,.60)!important;color:#344054!important;border-bottom:1px solid #e1e7ef!important;
}
body :where(.table-wrap,.ng-responsive-table,[class*="-table-wrap"]) tbody tr:nth-child(even) td{background:rgba(248,250,252,.76)!important}
body :where(.table-wrap,.ng-responsive-table,[class*="-table-wrap"]) tbody tr:hover td{
  background:color-mix(in srgb,var(--table-head) 55%,#fff)!important;
}
body :where(.table-wrap,.ng-responsive-table,[class*="-table-wrap"]) tbody tr:hover{box-shadow:inset 4px 0 0 var(--table-accent)!important}

/* Charts */
body :where(.ng-chart-surface,.chart-card,.chart-panel,[class*="chart-wrap"],[class*="chart-container"]){
  --chart-accent:#5b5bd6;--chart-soft:#f4f4ff;
  background:
    linear-gradient(180deg,var(--chart-soft),rgba(255,255,255,.78))!important;
  border:1px solid #d7e0eb!important;border-radius:20px!important;box-shadow:var(--ux-shadow)!important;
  position:relative;
}
.uix-chart-tone-1{--chart-accent:#5b5bd6;--chart-soft:#f0f0ff}
.uix-chart-tone-2{--chart-accent:#2477c8;--chart-soft:#edf6fe}
.uix-chart-tone-3{--chart-accent:#168579;--chart-soft:#edf9f7}
.uix-chart-tone-4{--chart-accent:#8253b5;--chart-soft:#f5effb}
.uix-chart-tone-5{--chart-accent:#b8791e;--chart-soft:#fff7e9}
body :where(.ng-chart-surface,.chart-card,.chart-panel,[class*="chart-wrap"],[class*="chart-container"])::before{
  content:"";position:absolute;left:18px;right:18px;top:0;height:4px;border-radius:0 0 6px 6px;background:var(--chart-accent)!important;
}

/* Forms */
body :where(.filters,.filter-bar,.toolbar,.table-tools,.search-bar){
  background:#e9eef5!important;border:1px solid #d9e2ec!important;border-radius:16px!important;box-shadow:0 7px 18px rgba(16,24,40,.045)!important;
}
body :where(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea){
  background:#fff!important;color:#172033!important;border:1px solid #cbd6e3!important;border-radius:12px!important;
}
body :where(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea):focus{
  border-color:#6d6ddd!important;box-shadow:0 0 0 4px rgba(91,91,214,.12)!important;
}
body :where(label){color:#344054!important;font-weight:750!important}

/* Buttons */
body :where(.btn-primary,.primary-action,[data-variant="primary"]){
  color:#fff!important;background:linear-gradient(135deg,#4f52c9,#6673db)!important;border-color:transparent!important;
  box-shadow:0 8px 18px rgba(79,82,201,.22)!important;
}
body :where(.btn-success,[data-variant="success"]){color:#fff!important;background:linear-gradient(135deg,#177c6c,#269486)!important}
body :where(.btn-danger,[data-variant="danger"]){color:#fff!important;background:linear-gradient(135deg,#b74661,#d25a74)!important}

/* Status chips */
body :where(.badge,.pill,.chip,.status,[class*="-badge"]){font-weight:800!important;border-radius:999px!important}
body :where(.badge-success,.status-success,.success-badge){background:#daf4e7!important;color:#17633f!important}
body :where(.badge-warning,.status-warning,.warning-badge){background:#fbeac7!important;color:#815514!important}
body :where(.badge-danger,.status-danger,.danger-badge,.error-badge){background:#f8dce4!important;color:#87364c!important}
body :where(.badge-info,.status-info,.info-badge){background:#dcecfb!important;color:#225d94!important}

/* animated premium feel */
@keyframes uix-enter{
  from{opacity:0;transform:translateY(12px) scale(.992)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes uix-pulse{
  0%,100%{box-shadow:0 0 0 0 rgba(91,91,214,0)}
  50%{box-shadow:0 0 0 5px rgba(91,91,214,.06)}
}
.uix-reveal{opacity:0;animation:uix-enter .46s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:var(--uix-delay,0ms)}
body :where(.btn-primary,.primary-action):hover{transform:translateY(-2px)!important}
body :where(.badge,.pill,.chip,.status,[class*="-badge"]){transition:transform var(--ux-ease)}
body :where(.badge,.pill,.chip,.status,[class*="-badge"]):hover{transform:translateY(-1px)}

/* Modal / empty / alerts */
body :where(dialog,.modal,.drawer,.sheet){background:#f8fafc!important;border:1px solid #d7e0eb!important;border-radius:22px!important;box-shadow:0 30px 80px rgba(15,23,42,.24)!important}
body :where(.empty,.empty-state,[class*="-empty"]){background:linear-gradient(180deg,#f8fafc,#eef3f8)!important;border:1px dashed #c9d5e3!important;color:#667085!important}
body :where(.alert,.notice,.flash,.notification,.callout){border-radius:15px!important;box-shadow:0 7px 18px rgba(16,24,40,.05)!important}

/* Dark mode */
body.theme-dark,html[data-theme="dark"] body{background:#0b1020!important;color:#eef2f7!important}
body.theme-dark :where(h1,h2,h3,h4,h5,h6,p,td,li,label),html[data-theme="dark"] body :where(h1,h2,h3,h4,h5,h6,p,td,li,label){color:#e8eef8!important}
body.theme-dark :where(.card,.panel,.widget,.tile,.stat-card,.metric-card,.kpi-card,.dashboard-card,[class*="-panel"],[class*="-card"]),
html[data-theme="dark"] body :where(.card,.panel,.widget,.tile,.stat-card,.metric-card,.kpi-card,.dashboard-card,[class*="-panel"],[class*="-card"]){
  background:#152033!important;border-color:#2c3a51!important;color:#eef2f7!important;
}
body.theme-dark :where(.table-wrap,.ng-responsive-table,[class*="-table-wrap"]),
html[data-theme="dark"] body :where(.table-wrap,.ng-responsive-table,[class*="-table-wrap"]){background:#111b2d!important;border-color:#2b3950!important}
body.theme-dark :where(.table-wrap,.ng-responsive-table,[class*="-table-wrap"]) :where(td,th),
html[data-theme="dark"] body :where(.table-wrap,.ng-responsive-table,[class*="-table-wrap"]) :where(td,th){background:#152033!important;color:#dbe5f1!important;border-color:#2a384d!important}
body.theme-dark :where(input,select,textarea),html[data-theme="dark"] body :where(input,select,textarea){background:#111b2d!important;color:#eef2f7!important;border-color:#394a64!important}

/* responsive */
@media(max-width:760px){
  body :where([class*="-hero"],.page-hero,.hero){border-radius:20px!important}
  body :where(nav[data-page-tabs],.tabs,[role="tablist"],.ng-premium-tabs){padding:5px!important}
  body :where(.card,.panel,.widget,.tile,[class*="-panel"],[class*="-card"]){border-radius:16px!important}
  body :where(.table-wrap,.ng-responsive-table,[class*="-table-wrap"]){border-radius:15px!important}
}
@media(prefers-reduced-motion:reduce){
  .uix-reveal{opacity:1!important;animation:none!important}
  body :where(.card,.panel,.widget,.tile,[class*="-panel"],[class*="-card"],a,button){transition:none!important}
}