@font-face{
  font-family:"Droid Arabic Kufi";
  src:url("../fonts/DroidKufi-Regular.ttf") format("truetype");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Droid Arabic Kufi";
  src:url("../fonts/DroidKufi-Bold.ttf") format("truetype");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Droid Kufi";
  src:url("../fonts/DroidKufi-Regular.ttf") format("truetype");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Droid Kufi";
  src:url("../fonts/DroidKufi-Bold.ttf") format("truetype");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"DroidKufi-Regular";
  src:url("../fonts/DroidKufi-Regular.ttf") format("truetype");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Droid Arabic Kufi";
  src:url("../fonts/Cairo-Regular.ttf") format("truetype");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

.rekaz-ui-icon-svg{
  width:1em;
  height:1em;
  display:inline-block;
  flex:0 0 auto;
  color:currentColor;
  stroke:currentColor;
  fill:none;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  vertical-align:-.125em;
}
.rekaz-ui-icon-text{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:1.75em;
  min-width:1.75em;
  height:1.75em;
  font-family:var(--rekaz-font-family);
  font-size:.72em;
  font-weight:900;
  line-height:1;
  letter-spacing:0;
  color:currentColor;
}
:where(.nav-icon,.nav-group-icon,.nav-group-arrow,.header-icon-btn,.header-school-btn,.search-icon,.header-brand-mark,.kpi-icon,.feature-icon,.stat-icon,.page-intro-icon,.empty-state-icon,.cl36-stat__icon,.cl38-check b,.cl38-viewport > span,.cl39-score-card > span,.cl39-requirement .dot,.cl40-score-card > span,.cl40-check-row .dot) .rekaz-ui-icon-svg{
  width:1em;
  height:1em;
}
:where(.nav-icon,.nav-group-icon,.nav-group-arrow,.header-icon-btn,.header-school-btn,.search-icon,.header-brand-mark,.kpi-icon,.feature-icon,.stat-icon,.page-intro-icon,.empty-state-icon,.cl36-stat__icon,.cl38-check b,.cl38-viewport > span,.cl39-score-card > span,.cl39-requirement .dot,.cl40-score-card > span,.cl40-check-row .dot){
  font-family:inherit!important;
}

/* Local Font Awesome fallback: legacy fa-* markup must render without webfonts. */
body.rekaz-theme-active :where(.fa,.fas,.far,.fab,.fa-solid,.fa-regular,.fa-brands){
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:1em!important;
  min-height:1em!important;
  font-family:var(--rekaz-font-family)!important;
  font-style:normal!important;
  font-weight:900!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-rendering:auto!important;
}

body.rekaz-theme-active :where(.fa,.fas,.far,.fab,.fa-solid,.fa-regular,.fa-brands)::before{
  content:"\25C6";
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:1em!important;
  height:1em!important;
  font-family:var(--rekaz-font-family)!important;
  font-style:normal!important;
  font-weight:900!important;
  line-height:1!important;
  color:currentColor!important;
}

body.rekaz-theme-active :where(.fa-home,.fa-house)::before{content:"\2302";}
body.rekaz-theme-active :where(.fa-school)::before{content:"\25A3";}
body.rekaz-theme-active :where(.fa-star)::before{content:"\2605";}
body.rekaz-theme-active :where(.fa-envelope,.fa-message)::before{content:"\2709";}
body.rekaz-theme-active :where(.fa-bell)::before{content:"\25CF";}
body.rekaz-theme-active :where(.fa-search,.fa-magnifying)::before{content:"\2315";}
body.rekaz-theme-active :where(.fa-bars)::before{content:"\2630";}
body.rekaz-theme-active :where(.fa-lock)::before{content:"\25A1";}
body.rekaz-theme-active :where(.fa-shield)::before{content:"\25C8";}
body.rekaz-theme-active :where(.fa-user-graduate)::before{content:"\25B2";}
body.rekaz-theme-active :where(.fa-user)::before{content:"\25CF";}
body.rekaz-theme-active :where(.fa-users)::before{content:"\25C9";}
body.rekaz-theme-active :where(.fa-chalkboard)::before{content:"\25A3";}
body.rekaz-theme-active :where(.fa-book-open)::before{content:"\25A7";}
body.rekaz-theme-active :where(.fa-book)::before{content:"\25A4";}
body.rekaz-theme-active :where(.fa-folder)::before{content:"\25B7";}
body.rekaz-theme-active :where(.fa-clipboard)::before{content:"\2611";}
body.rekaz-theme-active :where(.fa-question)::before{content:"\003F";}
body.rekaz-theme-active :where(.fa-video)::before{content:"\25B6";}
body.rekaz-theme-active :where(.fa-calendar)::before{content:"\25A6";}
body.rekaz-theme-active :where(.fa-chart)::before{content:"\25A5";}
body.rekaz-theme-active :where(.fa-palette)::before{content:"\25D0";}
body.rekaz-theme-active :where(.fa-credit-card)::before{content:"\25AD";}
body.rekaz-theme-active :where(.fa-plug)::before{content:"\25A7";}
body.rekaz-theme-active :where(.fa-globe)::before{content:"\25CC";}
body.rekaz-theme-active :where(.fa-gear,.fa-cog)::before{content:"\2699";}
body.rekaz-theme-active :where(.fa-database)::before{content:"\25CE";}
body.rekaz-theme-active :where(.fa-cloud)::before{content:"\2601";}
body.rekaz-theme-active :where(.fa-accessible,.fa-wheelchair)::before{content:"\267F";}
body.rekaz-theme-active :where(.fa-right-from-bracket,.fa-sign-out)::before{content:"\21A9";}

:root{
  --rekaz-font-family-ar:"Droid Arabic Kufi", "Droid Kufi", "DroidKufi-Regular", Tahoma, Arial, sans-serif !important;
  --rekaz-font-family-en:Inter, ui-sans-serif, system-ui, Arial, sans-serif;
  --rekaz-font-family:var(--rekaz-font-family-ar);
  --font-family:var(--rekaz-font-family);
  --brand-navy:#0B2D5C;
  --brand-navy-soft:#16519e;
  --brand-blue:#007bb5;
  --brand-cyan:#42D9F4;
  --brand-green:#38D67A;
  --brand-gold:#C5A059;
  --brand-gold-dark:#A88446;
  --brand-orange:#FF8A00;
  --brand-purple:#C93BFF;
  --rekaz-success:#22c55e;
  --rekaz-warning:#f59e0b;
  --rekaz-danger:#ef4444;

  --rekaz-navy:var(--brand-navy);
  --rekaz-navy-soft:var(--brand-navy-soft);
  --rekaz-blue:var(--brand-blue);
  --rekaz-cyan:var(--brand-cyan);
  --rekaz-green:var(--brand-green);
  --rekaz-orange:var(--brand-orange);
  --rekaz-gold:var(--brand-gold);
  --rekaz-gold-dark:var(--brand-gold-dark);
  --rekaz-purple:var(--brand-purple);

  --rekaz-text:#334155;
  --rekaz-text-secondary:#475569;
  --rekaz-text-deep:#0B2D5C;
  --rekaz-text-muted:#64748b;
  --rekaz-bg-identity:#F5F9FF;
  --rekaz-bg-system:#F8FAFC;
  --rekaz-bg-card:#F8FBFF;
  --rekaz-bg-filter:#EEF5FF;
  --rekaz-border:#E5EDF7;
  --rekaz-scrollbar-track:#F5F9FF;
  --rekaz-scrollbar-thumb:#DCEAF8;
  --rekaz-scrollbar-thumb-hover:#C7DBF1;
  --rekaz-scrollbar-corner:transparent;
  --rekaz-table-hover-bg:#F5F9FF;
  --rekaz-table-row-soft:#F8FBFF;
  --rekaz-shadow:0 14px 36px color-mix(in srgb,var(--brand-navy) 8%,transparent);
  --rekaz-shadow-soft:0 8px 20px color-mix(in srgb,var(--brand-navy) 6%,transparent);
  --rekaz-radius:18px;
  --rekaz-radius-sm:12px;
  --rekaz-radius-lg:24px;
  --rekaz-space-1:4px;
  --rekaz-space-2:8px;
  --rekaz-space-3:12px;
  --rekaz-space-4:16px;
  --rekaz-space-5:20px;
  --rekaz-space-6:24px;
  --rekaz-font-size-sm:12px;
  --rekaz-font-size-base:15px;
  --rekaz-font-size-lg:18px;
  --rekaz-font-weight-normal:400;
  --rekaz-font-weight-bold:800;
  --rekaz-control-height:42px;
  --rekaz-table-min-width:760px;
  --rekaz-button-bg:linear-gradient(135deg,var(--brand-blue),var(--brand-navy));
  --rekaz-card-bg:var(--rekaz-bg-card);
  --rekaz-form-bg:var(--rekaz-bg-card);
  --rekaz-badge-bg:var(--rekaz-bg-filter);
  --rekaz-modal-bg:var(--rekaz-bg-card);
  --rekaz-alert-info-bg:color-mix(in srgb,var(--brand-cyan) 14%,var(--rekaz-bg-card));
  --rekaz-alert-success-bg:color-mix(in srgb,var(--brand-green) 14%,var(--rekaz-bg-card));
  --rekaz-alert-error-bg:color-mix(in srgb,var(--brand-purple) 10%,var(--rekaz-bg-card));
  --rekaz-empty-bg:color-mix(in srgb,var(--rekaz-bg-filter) 62%,var(--rekaz-bg-card));
  --rekaz-loading-bg:linear-gradient(90deg,transparent,color-mix(in srgb,#F8FBFF 58%,transparent),transparent);
  --rekaz-error-color:var(--rekaz-danger);
  /* ── Typography Scale (unified) ── */
  /* Base = 15px → comfortable for Arabic & English */
  --fs-base:       15px;
  --fs-xs:         11px;   /* badges, nav-section labels    */
  --fs-sm:         12px;   /* captions, table meta          */
  --fs-ui:         13px;   /* table th, secondary text      */
  --fs-body:       14px;   /* table td, nav labels, buttons */
  --fs-md:         15px;   /* default body text             */
  --fs-h4:         15px;   /* h4, card subtitle             */
  --fs-h3:         17px;   /* h3, card title                */
  --fs-h2:         20px;   /* h2, section headings          */
  --fs-h1:         26px;   /* h1, page titles               */
  --fs-hero:       32px;   /* metric / KPI numbers          */
  --fs-display:    42px;   /* large dashboard metrics       */
  --fs-header-brand:18px;  /* header brand name             */
  --fs-header-crumb:13px;  /* breadcrumb                    */
  --fs-sidebar-brand:14px; /* sidebar brand h2              */
  --fs-sidebar-nav: 13px;  /* sidebar nav labels            */
  --fs-sidebar-section:10px;/* sidebar section headers       */
  --fs-btn:        14px;   /* button text                   */
  --fs-input:      14px;   /* form inputs                   */
  /* Legacy clamp aliases — kept for backward compatibility */
  --rekaz-text-xs:  var(--fs-xs);
  --rekaz-text-sm:  var(--fs-sm);
  --rekaz-text-base:var(--fs-md);
  --rekaz-text-lg:  var(--fs-h3);
  --rekaz-text-xl:  var(--fs-h2);
  --rekaz-text-2xl: var(--fs-h1);
  --rekaz-text-3xl: var(--fs-display);
  --rekaz-sidebar-expanded-width:280px;--rekaz-sidebar-width:var(--rekaz-sidebar-expanded-width);
  --rekaz-sidebar-collapsed-width:80px;
  --rekaz-content-max:1440px;
  --rekaz-shell-gap:20px;

  /* Shell design tokens — single source of truth for header/sidebar/page */
  --shell-sidebar-bg:#f0f4fa;
  --shell-sidebar-border:#dde5ef;
  --shell-sidebar-text:#0B2D5C;
  --shell-sidebar-muted:#475569;
  --shell-sidebar-section-label:#64748b;
  --shell-sidebar-card-bg:#ffffff;
  --shell-sidebar-card-border:#e2e8f0;
  --shell-sidebar-hover-bg:rgba(37,99,235,.09);
  --shell-sidebar-active-bg:rgba(37,99,235,.12);
  --shell-sidebar-active-text:#1e40af;
  --shell-sidebar-active-border:#4f46e5;
  --shell-sidebar-icon-bg:rgba(12,46,92,.08);
  --shell-sidebar-icon-color:#16519e;
  --shell-sidebar-icon-active-bg:rgba(79,70,229,.14);
  --shell-sidebar-icon-active-color:#4f46e5;
  --shell-brand-badge:linear-gradient(135deg,#6d28d9,#4f46e5);
  --shell-school-badge:linear-gradient(135deg,#22c55e,#16a34a);
  --shell-header-bg:linear-gradient(135deg,#0B2D5C 0%,#16519e 52%,#1d6fa9 100%);
  --shell-header-text:#f8fbff;
  --shell-page-bg:#f0f4fa;
  --shell-card-bg:#ffffff;
  --shell-card-border:#e8edf5;
  --shell-card-shadow:0 2px 10px rgba(12,46,92,.06);

  --bg:var(--rekaz-bg-system);
  --bg-soft:var(--rekaz-bg-identity);
  --panel:var(--rekaz-bg-card);
  --panel-2:var(--rekaz-bg-filter);
  --ink:var(--rekaz-text);
  --ink-deep:var(--rekaz-text-deep);
  --muted:var(--rekaz-text-secondary);
  --muted-deep:var(--rekaz-text-muted);
  --line:var(--rekaz-border);
  --danger:var(--rekaz-error-color);
  --ok:var(--rekaz-green);
  --warn:var(--rekaz-orange);
  --info:var(--rekaz-blue);
  --focus:var(--rekaz-blue);
  --radius-sm:var(--rekaz-radius-sm);
  --radius:var(--rekaz-radius);
  --radius-lg:var(--rekaz-radius-lg);
  --radius-pill:999px;
  --shadow-sm:var(--rekaz-shadow-soft);
  --shadow:var(--rekaz-shadow);
  --shadow-md:var(--rekaz-shadow);
  --shadow-card:var(--rekaz-shadow);
  --shadow-strong:0 26px 70px color-mix(in srgb,var(--brand-navy-soft) 18%,transparent);
  --space-1:var(--rekaz-space-1);
  --space-2:var(--rekaz-space-2);
  --space-3:var(--rekaz-space-3);
  --space-4:var(--rekaz-space-4);
  --space-5:var(--rekaz-space-5);
  --space-6:var(--rekaz-space-6);
  --space-7:28px;
  --space-8:32px;
  --color-brand-primary:var(--brand-blue);
  --color-brand-secondary:var(--brand-navy-soft);
  --color-brand-accent:var(--brand-cyan);
  --color-bg:var(--bg);
  --color-surface:var(--panel);
  --color-surface-soft:var(--panel-2);
  --color-border:var(--line);
  --color-text:var(--ink);
  --color-muted:var(--muted);
  --typography-body:var(--rekaz-font-size-base)/1.75 var(--rekaz-font-family);
  --typography-heading-weight:900;
  --typography-small:var(--rekaz-font-size-sm);
  --button-radius:var(--radius-sm);
  --button-height:var(--rekaz-control-height);
  --button-bg:var(--rekaz-button-bg);
  --table-min-width:var(--rekaz-table-min-width);
  --table-border:var(--line);
  --table-header-bg:var(--bg);
  --form-control-height:var(--rekaz-control-height);
  --form-control-bg:var(--rekaz-form-bg);
  --form-control-border:var(--line);
  --card-radius:var(--radius-lg);
  --card-bg:var(--rekaz-card-bg);
  --card-shadow:var(--shadow-card);
  --badge-radius:var(--radius-pill);
  --badge-bg:var(--rekaz-badge-bg);
  --modal-radius:var(--radius-lg);
  --modal-bg:var(--rekaz-modal-bg);
  --alert-radius:var(--radius-sm);
  --alert-info-bg:var(--rekaz-alert-info-bg);
  --alert-success-bg:var(--rekaz-alert-success-bg);
  --alert-error-bg:var(--rekaz-alert-error-bg);
  --empty-state-bg:var(--rekaz-empty-bg);
  --empty-state-border:var(--line);
  --loading-shimmer:var(--rekaz-loading-bg);
  --error-color:var(--rekaz-error-color);

  --rekaz-gradient-main:linear-gradient(135deg,var(--rekaz-navy) 0%,var(--rekaz-navy-soft) 45%,var(--rekaz-blue) 78%,var(--rekaz-cyan) 100%);
  --rekaz-gradient-accent:linear-gradient(135deg,var(--rekaz-blue) 0%,var(--rekaz-cyan) 55%,var(--rekaz-green) 100%);
  --rekaz-gradient-soft:linear-gradient(135deg,color-mix(in srgb,var(--brand-navy) 96%,transparent) 0%,color-mix(in srgb,var(--brand-navy-soft) 94%,transparent) 48%,color-mix(in srgb,var(--brand-blue) 92%,transparent) 100%);
}

/* Phase37: unified Rekaz runtime font contract. */
html,
body,
button,
input,
select,
textarea,
table,
.card,
.rekaz-shell,
.rekaz-page,
.rekaz-sidebar,
.rekaz-header,
.rekaz-table,
.rekaz-form,
.rekaz-btn {
  font-family:var(--rekaz-font-family) !important;
}
code, pre, kbd, samp {
  font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
}

html,body{background:var(--rekaz-bg-system);color:var(--rekaz-text)}
body,button,input,select,textarea,.btn,.input,.select,.table,.sidebar,.header-brand-title,.page-title,.card-title,.auth-card{
  font-family:var(--rekaz-font-family);
}
html[dir="rtl"],
html[dir="rtl"] body,
html[dir="rtl"] button,
html[dir="rtl"] input,
html[dir="rtl"] select,
html[dir="rtl"] textarea{
  font-family:var(--rekaz-font-family-ar);
}
html[dir="ltr"],
html[dir="ltr"] body,
html[dir="ltr"] button,
html[dir="ltr"] input,
html[dir="ltr"] select,
html[dir="ltr"] textarea{
  font-family:var(--rekaz-font-family-en);
}
a{color:var(--rekaz-blue)}
a:hover{color:var(--rekaz-navy-soft)}

body[class*="portal-"]{
  background:
    radial-gradient(circle at top right, color-mix(in srgb,var(--brand-cyan) 14%,transparent), transparent 28%),
    radial-gradient(circle at top left, color-mix(in srgb,var(--brand-blue) 8%,transparent), transparent 22%),
    var(--rekaz-bg-system);
}

.rekaz-top-strip{
  background:linear-gradient(90deg,var(--rekaz-gold-dark),var(--rekaz-gold));
  color:#F8FBFF;
  border-bottom:1px solid color-mix(in srgb,#F8FBFF 18%,transparent);
}
.rekaz-top-strip strong,.rekaz-top-strip span{color:#F8FBFF}

.rekaz-global-header,
.portal-header,
.topbar,
.header{
  background:var(--rekaz-gradient-main);
  color:#F8FBFF;
  border:0;
  box-shadow:var(--shell-header-shadow,0 18px 42px color-mix(in srgb,var(--brand-navy) 16%,transparent));
  border-bottom-left-radius:22px;
  border-bottom-right-radius:22px;
}

.rekaz-global-header{
  display:grid;
  grid-template-columns:var(--shell-header-grid,minmax(280px,1fr) minmax(320px,1.08fr) minmax(240px,.9fr));
  grid-template-areas:
      "brand center tools"
      "breadcrumb breadcrumb breadcrumb";
  gap:16px;
  padding:18px 28px 16px;
  align-items:center;
}
.rekaz-global-header .header-brand{grid-area:brand;justify-self:end;text-align:start}
.rekaz-global-header .header-center{grid-area:center;min-width:0}
.rekaz-global-header .header-tools{grid-area:tools;justify-self:start;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rekaz-global-header .header-breadcrumb{
  grid-area:breadcrumb;
  margin-top:0;
  padding:12px 18px;
  border-radius:999px;
  background:color-mix(in srgb,#F8FBFF 14%,transparent);
  border:1px solid color-mix(in srgb,#F8FBFF 18%,transparent);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
}
.header-brand-title,.header-breadcrumb strong,.header-breadcrumb span,.header-breadcrumb em,.rekaz-global-header small{color:#F8FBFF}
.header-brand-title{font-size:1.2rem;font-weight:800;letter-spacing:.01em}
.header-brand small{opacity:.92}
.header-brand-mark,.header-menu-lines,.clock-sep,.calendar-mark,.search-icon{color:#F8FBFF}
.header-icon-btn,
.header-avatar,
.header-search,
.header-clock,
.language-pill{
  background:color-mix(in srgb,#F8FBFF 12%,transparent);
  border:1px solid color-mix(in srgb,#F8FBFF 22%,transparent);
  color:#F8FBFF;
  box-shadow:none;
}
.header-search{min-width:240px;max-width:100%;border-radius:999px}
.header-search input{background:transparent;color:#F8FBFF}
.header-search input::placeholder{color:color-mix(in srgb,#F8FBFF 80%,transparent)}
.header-icon-btn.accent{background:color-mix(in srgb,var(--brand-green) 18%,transparent);border-color:color-mix(in srgb,var(--brand-green) 30%,transparent)}
.header-avatar{background:color-mix(in srgb,#F8FBFF 20%,transparent)}

.sidebar,
.rekaz-sidebar,
#portal-sidebar{
  background:var(--shell-sidebar-bg,linear-gradient(180deg,var(--brand-navy) 0%,var(--brand-navy-soft) 100%));
  color:var(--shell-sidebar-text,#0B2D5C);
  border-inline-start:0;
  box-shadow:0 18px 40px color-mix(in srgb,var(--brand-navy) 14%,transparent);
}
.sidebar-brand,.school-context,.rekaz-school-card,.user-chip{
  background:var(--shell-sidebar-panel,#ffffff);
  border:1px solid var(--shell-sidebar-card-border,#e2e8f0);
  border-radius:16px;
}
.sidebar h2,.sidebar p,.sidebar strong,.sidebar a,.sidebar .muted,.sidebar-brand h2,.school-context strong,.sidebar-nav .nav-section-label{color:var(--shell-sidebar-text,#0B2D5C)}
.sidebar-brand .brand-mark,.rekaz-school-logo{background:var(--rekaz-gradient-accent);color:var(--rekaz-navy)}
.sidebar-nav a,
.sidebar-nav .nav-link,
.sidebar .nav-link{
  border-radius:14px;
  margin:4px 0;
  color:var(--shell-sidebar-text,#0B2D5C);
  border:1px solid transparent;
}
.sidebar-nav a:hover,
.sidebar-nav .nav-link:hover,
.sidebar-nav a.active,
.sidebar-nav .nav-link.active,
.sidebar-nav .is-active > a{
  background:rgba(37,99,235,.12);
  border-color:rgba(79,70,229,.22);
  color:var(--shell-sidebar-active-text,#1e40af);
}

main, .page-shell, .content-shell, .portal-content{color:var(--rekaz-text)}

.card,.panel,.widget,.table-card,.content-card,.auth-card,.rekaz-school-card,.summary-card,.stat-card,.modal-content,.dropdown-menu,
.cl35-hero,.cl35-filter-panel,.cl35-data-card,.cl35-form-rail,.cl35-form-section,.cl35-question-card,.cl35-timer-card,.cl35-nav-card,.cl35-grade-card,
.phase71-import-panel,.phase72-panel,.phase74-panel{
  background:var(--rekaz-bg-card);
  color:var(--rekaz-text);
  border:1px solid var(--rekaz-border);
  border-radius:var(--rekaz-radius);
  box-shadow:var(--rekaz-shadow);
}

.page-header,.hero-banner,.dashboard-hero,.rekaz-hero{
  background:var(--rekaz-gradient-soft);
  color:#F8FBFF;
  border-radius:22px;
}
.cl35-hero-strip{display:none}
.page-header :where(h1,h2,h3,h4,p,small,strong,.hero-title,.hero-subtitle,.hero-meta),
.hero-banner :where(h1,h2,h3,h4,p,small,strong,.hero-title,.hero-subtitle,.hero-meta),
.dashboard-hero :where(h1,h2,h3,h4,p,small,strong,.hero-title,.hero-subtitle,.hero-meta),
.rekaz-hero :where(h1,h2,h3,h4,p,small,strong,.hero-title,.hero-subtitle,.hero-meta){color:#F8FBFF}
.page-header :where(.card,.panel,.content-card,.table-card,.summary-card,.stat-card,.kpi-card),
.hero-banner :where(.card,.panel,.content-card,.table-card,.summary-card,.stat-card,.kpi-card),
.dashboard-hero :where(.card,.panel,.content-card,.table-card,.summary-card,.stat-card,.kpi-card),
.rekaz-hero :where(.card,.panel,.content-card,.table-card,.summary-card,.stat-card,.kpi-card){color:var(--rekaz-text)}

.filters,.filter-panel,.toolbar,.tabs,.rekaz-tabs,.cl35-toolbar-tabs,.tab-strip,.upload-area,.import-toolbar{
  background:var(--rekaz-bg-filter);
  border:1px solid var(--rekaz-border);
  border-radius:16px;
  box-shadow:none;
}
.cl35-toolbar-tabs a,
.tabs a,
.tab-link,
.tab-button,
.nav-pills .nav-link{
  color:var(--rekaz-text-muted);
  border-radius:999px;
}
.cl35-toolbar-tabs a.active,
.tabs a.active,
.tab-link.active,
.tab-button.active,
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link{
  background:var(--rekaz-gradient-main);
  color:#F8FBFF;
  border-color:transparent;
}

.btn,button,.button,input[type="submit"],input[type="button"]{
  border-radius:999px;
  border:1px solid transparent;
  min-height:42px;
  box-shadow:none;
}
.btn-primary,.btn-primary:hover,.btn.login-btn,.btn:not(.ghost):not(.secondary):not(.outline):not(.danger):not(.warning){
  background:var(--rekaz-gradient-main);
  color:#F8FBFF;
}
.btn.ghost,.btn-outline,.btn.secondary,.btn-light{
  background:var(--rekaz-bg-filter);
  color:var(--rekaz-navy-soft);
  border-color:var(--rekaz-border);
}
.btn-success{background:linear-gradient(135deg,var(--rekaz-green),var(--brand-green));color:var(--brand-navy)}
.btn-warning{background:linear-gradient(135deg,var(--rekaz-orange),var(--brand-orange));color:#0B2D5C}
.btn-danger{background:linear-gradient(135deg,var(--rekaz-purple),var(--brand-purple));color:#F8FBFF}

input,select,textarea,.input,.select,.form-control{
  background:#F8FBFF;
  color:var(--rekaz-text-deep);
  border:1px solid var(--rekaz-border);
  border-radius:14px;
  box-shadow:none;
}
input:focus,select:focus,textarea:focus,.input:focus,.select:focus,.form-control:focus{
  border-color:var(--rekaz-blue);
  outline:none;
  box-shadow:0 0 0 4px color-mix(in srgb,var(--brand-blue) 12%,transparent);
}
label,.form-label,th,.table th,.cl35-table th{color:var(--rekaz-text-deep);font-weight:700}
.text-muted,.muted,small,.help-text,.table-note,.cl35-muted,.page-subtitle{color:var(--rekaz-text-muted)}

.table,.table table,.data-table,.cl35-table{background:#F8FBFF;border-color:var(--rekaz-border)}
.table th,.table td,.data-table th,.data-table td,.cl35-table th,.cl35-table td{border-color:var(--rekaz-border);text-align:start}
.table thead th,.data-table thead th,.cl35-table thead th{background:var(--rekaz-bg-filter)}
.table tbody tr:nth-child(odd) td,.cl35-table tbody tr:nth-child(odd) td{background:#F8FBFF}
.table tbody tr:hover td,.cl35-table tbody tr:hover td{background:#F5F9FF}

.badge,.status,.pill,.tag,.cl35-status{
  border-radius:999px;
  font-weight:700;
}
.cl35-status.ok,.status-success,.badge-success{background:color-mix(in srgb,var(--brand-green) 14%,transparent);color:var(--brand-navy-soft)}
.cl35-status.warn,.status-warning,.badge-warning{background:color-mix(in srgb,var(--brand-orange) 14%,transparent);color:var(--brand-gold-dark)}
.cl35-status.danger,.status-danger,.badge-danger{background:color-mix(in srgb,var(--brand-purple) 12%,transparent);color:var(--brand-navy-soft)}

.upload-area,.dropzone,.file-uploader,.cl35-upload-box{
  background:linear-gradient(180deg,#F8FBFF,var(--rekaz-bg-filter));
  border:2px dashed color-mix(in srgb,var(--brand-blue) 26%,transparent);
  border-radius:18px;
}

.auth-card.login-panel{background:color-mix(in srgb,#F8FBFF 96%,transparent);border:1px solid var(--rekaz-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.login-page{min-height:100vh;background:radial-gradient(circle at top right, color-mix(in srgb,var(--brand-cyan) 16%,transparent), transparent 28%),linear-gradient(135deg,var(--rekaz-navy) 0%,var(--rekaz-navy-soft) 48%,var(--rekaz-blue) 100%)}
.login-visual{background:transparent;color:#F8FBFF}
.login-brand-lockup strong,.login-brand-lockup small,.login-hero-copy span,.login-hero-copy h1{color:#F8FBFF}
.login-logo-mark{background:color-mix(in srgb,#F8FBFF 16%,transparent);border:1px solid color-mix(in srgb,#F8FBFF 20%,transparent)}
.login-btn{min-height:48px}

[class*='classera'], [class*='rekaz'] {
  scrollbar-color:var(--rekaz-scrollbar-thumb) var(--rekaz-scrollbar-track);
}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--rekaz-scrollbar-thumb);border:2px solid var(--rekaz-scrollbar-track);border-radius:999px}
::-webkit-scrollbar-thumb:hover{background:var(--rekaz-scrollbar-thumb-hover)}
::-webkit-scrollbar-track{background:var(--rekaz-scrollbar-track)}
::-webkit-scrollbar-corner{background:var(--rekaz-scrollbar-corner)}

@media (max-width: 1100px){
  .rekaz-global-header{
    grid-template-columns:1fr;
    grid-template-areas:"brand" "center" "tools" "breadcrumb";
    padding:16px 18px;
  }
  .rekaz-global-header .header-brand,
  .rekaz-global-header .header-center,
  .rekaz-global-header .header-tools{justify-self:stretch}
  .header-search{min-width:0;width:100%}
}



/* =====================================================================
   Phase 79C - Rekaz Learn strict visual identity pass
   All visible gradients and key UI surfaces are constrained to the approved palette.
   ===================================================================== */

:root{
  --primary:var(--brand-navy);
  --secondary:var(--brand-navy-soft);
  --accent:var(--brand-blue);
  --info:var(--brand-cyan);
  --success:var(--brand-green);
  --warning:var(--brand-orange);
  --gold:var(--brand-gold);
  --gold-dark:var(--brand-gold-dark);
  --purple:var(--brand-purple);
  --text:#2D3748;
  --text-secondary:#718096;
  --text-deep:#0F172A;
  --text-muted:#5F6B7A;
  --surface:#F8FBFF;
  --body-bg:#F8FAFC;
  --filter-bg:#EEF5FF;
  --line:#E5EDF7;

  --cl-purple:var(--brand-blue);
  --cl-purple-dark:var(--brand-navy);
  --cl-purple-soft:#EEF5FF;
  --cl-ink:#0F172A;
  --cl-muted:#5F6B7A;
  --cl-line:#E5EDF7;
  --cl-card:#F8FBFF;

  --cl35-purple:var(--brand-blue);
  --cl35-purple-dark:var(--brand-navy);
  --cl35-purple-soft:#EEF5FF;
  --cl35-purple-row:#F5F9FF;
  --cl35-ink:#0F172A;
  --cl35-muted:#5F6B7A;
  --cl35-line:#E5EDF7;
}

/* tighter, more disciplined top bar */
.rekaz-top-strip{
  display:none;
}
.rekaz-global-header{
  position:sticky;
  top:0;
  z-index:var(--z-header);
  min-height:82px;
  border-radius:0 0 20px 20px;
  padding:12px 24px 10px;
}
.rekaz-global-header .header-brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
.header-brand-title{
  white-space:nowrap;
  line-height:1.15;
}
.header-brand small{
  display:block;
  font-size:11px;
  line-height:1.2;
}
.header-brand-mark{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:color-mix(in srgb,var(--brand-cyan) 18%,transparent);
  border:1px solid color-mix(in srgb,var(--brand-cyan) 26%,transparent);
}
.header-menu-lines{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:color-mix(in srgb,#F8FBFF 12%,transparent);
  border:1px solid color-mix(in srgb,#F8FBFF 18%,transparent);
}
.header-menu-lines span{
  background:#F8FBFF;
  width:20px;
  height:2px;
  display:block;
  margin:3px 0;
}
.header-center{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
}
.header-clock{
  height:40px;
  padding:0 14px;
  display:flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}
.header-search{
  height:44px;
  display:flex;
  align-items:center;
  padding:0 14px;
}
.header-search input{
  height:40px;
  border:0;
}
.header-tools .header-icon-btn,
.header-tools .header-avatar{
  width:42px;
  height:42px;
  min-width:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
}
.header-tools .has-counter::after{
  background:var(--rekaz-orange);
  color:#F8FBFF;
  border:2px solid #F8FBFF;
}
.header-breadcrumb{
  min-height:40px;
  display:flex;
  align-items:center;
  gap:8px;
  justify-content:flex-start;
  font-size:12px;
}

/* balanced layout width */
.portal-shell .main-content,
.portal-main,
#main-content{
  max-width:none;
  margin-inline:0;
}

/* sidebar compact/fixed quality */
#portal-sidebar.rekaz-sidebar,
.sidebar.rekaz-sidebar{
  position:sticky;
  top:90px;
  max-height:calc(100vh - 104px);
  overflow-y:auto;
  padding:16px 12px;
}
.sidebar-brand{
  padding:14px;
  gap:10px;
}
.sidebar-brand h2{
  font-size:14px;
  line-height:1.35;
  margin:0;
}
.sidebar-brand p{
  font-size:11px;
  margin:2px 0 0;
}
.sidebar-nav{
  display:grid;
  gap:4px;
}
.sidebar-nav a,
.sidebar-nav .nav-link{
  min-height:40px;
  padding:9px 12px;
  display:flex;
  align-items:center;
  gap:9px;
  font-size:12px;
}
.sidebar-nav .nav-section-label,
.sidebar-nav .nav-section{
  color:var(--shell-sidebar-section-label,#64748b);
  font-size:11px;
  margin:12px 8px 4px;
  letter-spacing:0;
}

/* content visual consistency */
.page-header,.hero-banner,.dashboard-hero,.rekaz-hero{
  background:linear-gradient(135deg,var(--brand-navy) 0%,var(--brand-navy-soft) 52%,var(--brand-blue) 100%);
}
.card,.panel,.widget,.content-card,.table-card,.stat-card,.summary-card{
  background:#F8FBFF;
  border-color:#E5EDF7;
}
.kpi-card,.metric-card,.stat-card{
  min-height:92px;
}
.kpi-card .icon,.metric-card .icon,.stat-card .icon,[class*="icon-badge"]{
  background:linear-gradient(135deg,var(--brand-blue),var(--brand-cyan));
  color:var(--brand-navy);
}

/* prevent legacy purple/pink surfaces from leaking */
.progress-bar,.cl35-score-fill,.cl35-progress-fill{
  background:linear-gradient(90deg,var(--brand-blue),var(--brand-cyan),var(--brand-green));
}

/* forms and import pages */
.import-step,.step-card,.preview-card,.error-card,.upload-card,.mapping-card{
  background:#F8FBFF;
  border:1px solid #E5EDF7;
  border-radius:18px;
  box-shadow:0 12px 30px color-mix(in srgb,var(--brand-navy) 7%,transparent);
}
.alert,.notice,.flash-message{
  border-radius:16px;
  border:1px solid #E5EDF7;
}
.alert-success{background:color-mix(in srgb,var(--brand-green) 12%,transparent);color:var(--brand-navy-soft)}
.alert-warning{background:color-mix(in srgb,var(--brand-orange) 12%,transparent);color:var(--brand-gold-dark)}
.alert-danger,.alert-error{background:color-mix(in srgb,var(--brand-purple) 10%,transparent);color:var(--brand-navy-soft)}
.alert-info{background:color-mix(in srgb,var(--brand-cyan) 14%,transparent);color:var(--brand-navy-soft)}

/* mobile discipline */
@media (max-width: 768px){
  .rekaz-global-header{
    min-height:auto;
    border-radius:0 0 16px 16px;
  }
  .header-tools{
    justify-content:center;
  }
  .header-clock{
    width:100%;
    justify-content:center;
  }
  #portal-sidebar.rekaz-sidebar{
    position:fixed;
    top:0;
    max-height:100vh;
  }
  .card,.panel,.widget,.content-card,.table-card{
    border-radius:16px;
  }
}



/* =====================================================================
   Phase 79D - System discipline, responsive rules, unified fields
   ===================================================================== */
:root{
  --rekaz-field-height:44px;
  --rekaz-field-radius:14px;
  --rekaz-content-gap:16px;
}

/* Promotional UI is opt-in only. Server config controls rendering; CSS is extra guard. */
body:not(.show-promotional-strip) .rekaz-top-strip,
body:not(.show-support-tab) .rekaz-support-tab,
body:not(.show-app-store-badges) .rekaz-store-badges,
body:not(.show-social-links) .rekaz-socials{
  display:none;
}

/* Motion discipline */
*,*::before,*::after{
  scroll-behavior:auto;
}
body.enable-motion *{
  transition-duration:.16s;
  transition-timing-function:cubic-bezier(.2,.8,.2,1);
}
body:not(.enable-motion) *,
body:not(.enable-motion) *::before,
body:not(.enable-motion) *::after{
  animation:none;
  transition:none;
  scroll-behavior:auto;
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none;transition:none;scroll-behavior:auto}
}

/* Unified field contract */
.form-row{display:flex;flex-direction:column;gap:7px;margin-bottom:14px}
.form-row label,label.form-label,.field-label{font-size:12px;font-weight:800;color:#0B2D5C;line-height:1.4}
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea,.input,.select,.form-control{
  width:100%;
  min-height:var(--rekaz-field-height);
  padding:10px 14px;
  border-radius:var(--rekaz-field-radius);
  background:#F8FBFF;
  border:1px solid #E5EDF7;
  color:#0B2D5C;
  font-size:13px;
  line-height:1.5;
}
textarea,textarea.input,textarea.form-control{min-height:112px;resize:vertical}
select,.select{appearance:auto}
::placeholder{color:#718096;opacity:1}
.form-grid,.grid-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;align-items:start}
.filters,.filter-panel,.toolbar{display:flex;align-items:end;gap:12px;flex-wrap:wrap}
.filters .form-row,.filter-panel .form-row,.toolbar .form-row{min-width:190px;flex:1 1 190px;margin-bottom:0}
.btn-row,.actions,.page-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

/* Desktop/tablet: avoid overflowing bars */
.layout{display:grid;grid-template-columns:var(--rekaz-sidebar-expanded-width,280px) minmax(0,1fr);gap:18px;align-items:start}
.main{min-width:0;width:100%;overflow-x:hidden}
.table-wrap,.table-responsive,.cl35-table-scroll{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
table{max-width:100%}
.card,.panel,.widget,.content-card,.table-card,.cl35-data-card,.cl35-filter-panel{min-width:0}

/* Header no overlap discipline */
.rekaz-global-header{overflow:visible}
.header-center,.header-brand,.header-tools{min-width:0}
.header-tools{max-width:100%}
.header-search input{min-width:0}
.header-breadcrumb{overflow-x:auto;white-space:nowrap;scrollbar-width:none}
.header-breadcrumb::-webkit-scrollbar{display:none}

/* Mobile app-like layout */
@media (max-width: 820px){
  html,body{overflow-x:hidden}
  .layout{display:block}
  .main,#main-content,.portal-main,.portal-content{width:100%;max-width:100%;padding-inline:12px}
  .rekaz-global-header{
    position:sticky;
    top:0;
    grid-template-columns:1fr;
    gap:10px;
    padding:12px;
    min-height:auto;
  }
  .header-brand{justify-content:space-between;width:100%;flex-wrap:nowrap}
  .header-brand-title{font-size:1rem;max-width:62vw;overflow:hidden;text-overflow:ellipsis}
  .header-brand small{font-size:10px;max-width:62vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .header-center{display:grid;grid-template-columns:1fr;width:100%}
  .header-search,.header-clock{width:100%;max-width:100%}
  .header-tools{justify-content:center;gap:8px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
  .header-tools::-webkit-scrollbar{display:none}
  .header-tools .header-icon-btn,.header-tools .header-avatar{width:38px;height:38px;min-width:38px;border-radius:12px}
  .header-breadcrumb{font-size:11px;padding:8px 12px;width:100%}
  #portal-sidebar.rekaz-sidebar,.sidebar.rekaz-sidebar{
    position:fixed;
    inset-block:0;
    inset-inline-start:0;
    inset-inline-end:auto;
    width:var(--shell-sidebar-mobile-width,min(86vw,348px));
    max-height:100vh;
    transform:translateX(105%);
    transition:transform .18s ease;
    z-index:var(--z-sidebar);
  }
  body.sidebar-open #portal-sidebar.rekaz-sidebar,
  #portal-sidebar.rekaz-sidebar.is-open{
    transform:translateX(0);
  }
  .filters,.filter-panel,.toolbar,.btn-row,.actions,.page-actions{display:grid;grid-template-columns:1fr;align-items:stretch}
  .filters .form-row,.filter-panel .form-row,.toolbar .form-row{min-width:0;width:100%}
  .btn,.button,button,input[type="submit"]{width:100%;justify-content:center;min-height:42px}
  .card,.panel,.widget,.content-card,.table-card{padding:14px;border-radius:16px}
  .table-wrap table,.table-responsive table,.cl35-table{min-width:720px}
  .mobile-card-list .table,.table.mobile-cards{min-width:0}
}

@media (min-width: 821px) and (max-width: 1280px){
  .layout{grid-template-columns:minmax(210px,248px) minmax(0,1fr);gap:14px}
  .main,#main-content{padding-inline:14px}
  .rekaz-global-header{padding-inline:18px}
}

@media (min-width: 1600px){
  .portal-shell .main-content,.portal-main,#main-content,.main{max-width:1680px}
}

/* =====================================================================
   Phase 80 - Final identity lock
   This is the last cascade layer: font, color tokens, sidebar, buttons, tables.
   ===================================================================== */
:root{
  --font-family:var(--rekaz-font-family);
  --bg:#F8FAFC;
  --bg-soft:#F5F9FF;
  --panel:#F8FBFF;
  --panel-2:#EEF5FF;
  --ink:#2D3748;
  --ink-deep:#0F172A;
  --muted:#718096;
  --muted-deep:#5F6B7A;
  --line:#E5EDF7;
  --cl37-purple:var(--brand-blue);
  --cl37-purple-2:var(--brand-cyan);
  --cl37-purple-3:var(--brand-green);
  --cl37-bg:#F8FAFC;
  --cl37-panel:#F8FBFF;
  --cl37-line:#E5EDF7;
  --cl37-muted:#5F6B7A;
  --cl37-ink:#0F172A;
  --cl44-purple:var(--brand-blue);
  --cl44-purple-2:var(--brand-cyan);
  --cl44-soft:#EEF5FF;
  --cl44-border:#E5EDF7;
  --cl44-text:#0F172A;
  --cl44-muted:#5F6B7A;
  --cl46-primary:var(--brand-blue);
  --cl46-accent:var(--brand-cyan);
  --cl46-soft:#EEF5FF;
  --cl46-ink:#0F172A;
  --cl46-muted:#5F6B7A;
  --cl46-border:#E5EDF7;
  --cl47-primary:var(--brand-blue);
  --cl47-accent:var(--brand-cyan);
  --cl47-secondary:var(--brand-navy-soft);
  --cl47-soft:#EEF5FF;
  --cl47-border:#E5EDF7;
  --cl47-text:#0F172A;
  --cl47-muted:#5F6B7A;
  --cl48-primary:var(--brand-blue);
  --cl48-accent:var(--brand-cyan);
  --cl48-soft:#EEF5FF;
  --cl48-ink:#0F172A;
  --cl48-muted:#5F6B7A;
  --cl48-border:#E5EDF7;
  --cl51-primary:var(--brand-blue);
  --cl51-primary-deep:var(--brand-navy);
  --cl51-primary-mid:var(--brand-cyan);
  --cl51-primary-soft:#EEF5FF;
  --cl51-bg:#F8FAFC;
  --cl51-card:#F8FBFF;
  --cl51-border:#E5EDF7;
  --cl56-primary:var(--brand-blue);
  --cl58-primary:var(--brand-blue);
  --cl58-accent:var(--brand-cyan);
  --cl58-soft:#EEF5FF;
  --cl58-border:#E5EDF7;
  --cl58-text:#0F172A;
  --cl59-primary:var(--brand-blue);
  --cl60-primary:var(--brand-blue);
  --cl60-primary2:var(--brand-cyan);
  --cl60-bg:#F8FAFC;
  --cl60-card:#F8FBFF;
  --cl60-border:#E5EDF7;
  --cl60-text:#0F172A;
  --cl60-muted:#5F6B7A;
  --cl63-purple:var(--brand-blue);
  --cl63-purple-dark:var(--brand-navy);
  --cl63-soft:#EEF5FF;
  --cl63-border:#E5EDF7;
  --cl63-text:#0F172A;
  --phase70-purple:var(--brand-blue);
  --phase70-purple-dark:var(--brand-navy);
  --phase70-soft:#EEF5FF;
  --phase70-line:#E5EDF7;
  --phase70-orange:var(--brand-orange);
}
html,body,body *{
  font-family:var(--rekaz-font-family);
  letter-spacing:0;
}
body.portal-shell,
body.auth-shell,
body.rekaz-theme-active{
  background:linear-gradient(180deg,#F5F9FF 0%,#F8FAFC 38%,#F8FAFC 100%);
  color:#334155;
}
.rekaz-global-header,
.topbar.page-header,
.page-header,.hero-banner,.dashboard-hero,.rekaz-hero{
  background:linear-gradient(135deg,var(--brand-navy) 0%,var(--brand-navy-soft) 54%,var(--brand-blue) 100%);
  color:#F8FBFF;
}
.cl37-hero,.cl44-hero,.cl46-hero,.cl47-hero,.cl48-hero,.cl58-hero,.cl60-hero,.cl62-hero,.cl63-hero,
.import70-tabs a.active,.import70-tabs a:hover,.import71-shell .topbar,.phase72-hero,.phase74-hero{
  background:linear-gradient(135deg,var(--brand-navy) 0%,var(--brand-navy-soft) 52%,var(--brand-blue) 100%);
  color:#F8FBFF;
}
#portal-sidebar.rekaz-sidebar,
.sidebar.rekaz-sidebar,
.sidebar{
  border:1px solid var(--shell-sidebar-border,#dde5ef);
  border:1px solid var(--shell-sidebar-border,#dde5ef);
  border-radius:18px;
  color:var(--shell-sidebar-text,#0B2D5C);
  scrollbar-color:var(--rekaz-scrollbar-thumb) var(--rekaz-scrollbar-track);
}
.sidebar-brand,.school-context,.user-chip{
  background:var(--shell-sidebar-panel,#ffffff);
  border:1px solid color-mix(in srgb,#E5EDF7 12%,transparent);
  border-radius:14px;
}
.sidebar-nav a.nav-link,
.sidebar-nav .nav-link{
  color:#F5F9FF;
  border-radius:12px;
  border:1px solid transparent;
  box-shadow:none;
  transform:none;
}
.sidebar-nav a.nav-link:hover,
.sidebar-nav .nav-link:hover,
.sidebar-nav a.nav-link.active,
.sidebar-nav .nav-link.active{
  background:rgba(37,99,235,.12);
  border-color:rgba(79,70,229,.25);
  color:var(--shell-sidebar-active-text,#1e40af);
}
.sidebar-nav a.nav-link.active::before,
.sidebar-nav .nav-link.active::before{
  background:#4f46e5;
  inset-inline-start:10px;
  inset-inline-end:auto;
}
.nav-icon{color:var(--brand-cyan)}
.nav-section{color:color-mix(in srgb,#F5F9FF 68%,transparent)}
.btn,
a.btn,
button.btn,
input[type="submit"],
input[type="button"]{
  min-height:42px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--brand-blue) 0%,var(--brand-navy-soft) 100%);
  border:1px solid transparent;
  color:#F8FBFF;
  box-shadow:0 10px 22px color-mix(in srgb,var(--brand-navy) 12%,transparent);
  font-weight:800;
}
.btn:hover,
a.btn:hover,
button.btn:hover{
  background:linear-gradient(135deg,var(--brand-cyan) 0%,var(--brand-blue) 100%);
  color:var(--brand-navy);
  box-shadow:0 14px 28px color-mix(in srgb,var(--brand-blue) 18%,transparent);
}
.btn.secondary,.btn.ghost,.btn-outline,.button.secondary{
  background:#EEF5FF;
  color:var(--brand-navy-soft);
  border-color:#E5EDF7;
  box-shadow:none;
}
.btn.danger,.btn-danger{
  background:linear-gradient(135deg,var(--brand-purple) 0%,var(--brand-navy-soft) 100%);
  color:#F8FBFF;
}
.card,.panel,.widget,.content-card,.table-card,.stat-card,.summary-card,.auth-card,
.modal-content,.dropdown-menu,.filters,.filter-panel,.toolbar{
  background:#F8FBFF;
  border-color:#E5EDF7;
  color:#334155;
}
.filters,.filter-panel,.toolbar,.table thead th,.data-table thead th{
  background:#EEF5FF;
}
.table,.data-table,table{
  color:#334155;
}
.table th,.table td,.data-table th,.data-table td,table th,table td{
  text-align:start;
  border-color:#E5EDF7;
}
.table tbody tr:nth-child(odd) td,
.data-table tbody tr:nth-child(odd) td{
  background:#F8FBFF;
}
.table tbody tr:hover td,
.data-table tbody tr:hover td{
  background:#F5F9FF;
}

/* =====================================================================
   Phase 81 - runtime design hardening
   Final cross-portal rules for responsive layout, interaction states,
   sidebar behavior, and strict Rekaz palette usage.
   ===================================================================== */
:root{
  --surface-page:var(--bg);
  --surface-identity:var(--bg-soft);
  --surface-card:var(--panel);
  --surface-filter:var(--panel-2);
  --text-main:var(--ink);
  --text-strong:var(--ink-deep);
  --text-muted:var(--muted);
  --text-calm:var(--muted-deep);
  --border-main:var(--line);
  --shadow-card:0 16px 34px color-mix(in srgb,var(--brand-navy) 10%,transparent);
  --shadow-card-hover:0 20px 42px color-mix(in srgb,var(--brand-navy-soft) 14%,transparent);
  --shadow-control:0 10px 22px color-mix(in srgb,var(--brand-blue) 18%,transparent);
  --ring-focus:0 0 0 4px color-mix(in srgb,var(--brand-cyan) 28%,transparent);
  --transition-fast:160ms ease;
  --transition-base:220ms ease;
}

html.sidebar-scroll-locked,
body.sidebar-scroll-locked{
  overflow:hidden;
  overscroll-behavior:contain;
}

body.rekaz-theme-active{
  min-height:100vh;
  background:
    radial-gradient(circle at 92% 0%,color-mix(in srgb,var(--brand-cyan) 13%,transparent),transparent 28%),
    radial-gradient(circle at 12% 8%,color-mix(in srgb,var(--brand-blue) 8%,transparent),transparent 24%),
    linear-gradient(180deg,var(--surface-identity),var(--surface-page) 42%,var(--surface-page));
  color:var(--text-main);
}

body.rekaz-theme-active :where(button,input,select,textarea,a){
  -webkit-tap-highlight-color:transparent;
}

body.rekaz-theme-active :where(a,button,.btn,input,select,textarea,[tabindex]):focus-visible{
  outline:0;
  box-shadow:var(--ring-focus);
}

body.rekaz-theme-active :where(.layout){
  align-items:start;
  gap:18px;
}

body.portal-shell.rekaz-theme-active .main,
body.portal-shell.rekaz-theme-active #main-content{
  width:min(100%,var(--content-max));
  padding-block:22px 30px;
  padding-inline:18px;
}

.rekaz-global-header{
  position:sticky;
  inset-block-start:0;
  z-index:var(--z-header);
  background:linear-gradient(135deg,var(--brand-navy),var(--brand-navy-soft) 54%,var(--brand-blue));
  border:1px solid color-mix(in srgb,var(--line) 14%,transparent);
  border-start-start-radius:0;
  border-start-end-radius:0;
  border-end-start-radius:22px;
  border-end-end-radius:22px;
  box-shadow:var(--shell-header-shadow,0 18px 42px color-mix(in srgb,var(--brand-navy) 16%,transparent));
  color:var(--surface-card);
}

.header-brand,
.header-tools,
.header-center,
.header-breadcrumb{
  min-width:0;
}

.header-brand{
  display:flex;
  align-items:center;
  gap:10px;
}

.header-brand-title,
.header-brand small,
.header-breadcrumb,
.header-clock,
.header-search,
.header-tools .header-icon-btn,
.header-tools .header-avatar{
  color:var(--surface-card);
}

.header-brand-title{
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.header-brand small{
  line-height:1.4;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.header-icon-btn,
.header-avatar,
.header-menu-lines,
.mobile-nav-toggle{
  min-width:42px;
  min-height:42px;
  border-radius:14px;
  transition:transform var(--transition-fast),background var(--transition-fast),border-color var(--transition-fast),box-shadow var(--transition-fast);
}

.header-icon-btn:hover,
.header-menu-lines:hover,
.mobile-nav-toggle:hover{
  transform:translateY(-1px);
  background:color-mix(in srgb,var(--surface-card) 18%,transparent);
  border-color:color-mix(in srgb,var(--surface-card) 34%,transparent);
}

.header-search{
  min-height:44px;
  border-radius:999px;
  background:color-mix(in srgb,var(--surface-card) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--surface-card) 26%,transparent);
}

.header-search:focus-within{
  background:color-mix(in srgb,var(--surface-card) 18%,transparent);
  border-color:color-mix(in srgb,var(--brand-cyan) 80%,var(--surface-card));
  box-shadow:var(--ring-focus);
}

.header-search input{
  min-width:0;
  width:100%;
}

.header-breadcrumb{
  max-width:100%;
  overflow:auto;
  scrollbar-width:none;
}

.header-breadcrumb::-webkit-scrollbar{
  display:none;
}

#portal-sidebar.sidebar{
  position:sticky;
  inset-block-start:18px;
  max-height:calc(100vh - 36px);
  overflow:auto;
  border-radius:18px;
  background:var(--shell-sidebar-bg,linear-gradient(180deg,var(--brand-navy) 0%,var(--brand-navy-soft) 100%));
  box-shadow:0 18px 42px color-mix(in srgb,var(--brand-navy) 16%,transparent);
}

#portal-sidebar .sidebar-brand,
#portal-sidebar .school-context,
#portal-sidebar .user-chip,
#portal-sidebar .rekaz-sidebar-footer{
  background:color-mix(in srgb,var(--surface-card) 7%,transparent);
  border:1px solid color-mix(in srgb,var(--line) 14%,transparent);
}

.nav-accordion-toggle{
  width:100%;
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border:0;
  border-radius:12px;
  background:transparent;
  color:color-mix(in srgb,var(--surface-card) 74%,transparent);
  cursor:pointer;
  font-weight:800;
}

.nav-accordion-toggle:hover,
.nav-accordion-toggle[aria-expanded="true"]{
  background:color-mix(in srgb,var(--brand-blue) 18%,transparent);
  color:var(--surface-card);
}

.nav-accordion-panel{
  display:none;
  padding-block:4px 8px;
}

.nav-accordion-panel.is-open{
  display:grid;
  gap:3px;
}

.nav-accordion-arrow{
  transition:transform var(--transition-fast);
}

.nav-accordion-toggle[aria-expanded="true"] .nav-accordion-arrow{
  transform:rotate(-90deg);
}

.sidebar-nav a.nav-link{
  min-height:42px;
  padding-inline:12px;
}

.sidebar-nav a.nav-link:hover,
.sidebar-nav a.nav-link.active{
  transform:none;
}

body.sidebar-compact #portal-sidebar.sidebar{
  width:92px;
  padding-inline:8px;
}

body.sidebar-compact #portal-sidebar :where(.sidebar-brand,.school-context,.user-chip,.rekaz-sidebar-footer,.nav-accordion-toggle){
  display:none;
}

body.sidebar-compact #portal-sidebar .nav-accordion-panel{
  display:grid;
  background:transparent;
  border:0;
  padding:0;
}

body.sidebar-compact #portal-sidebar .nav-link{
  width:58px;
  min-height:52px;
  justify-content:center;
  padding:0;
}

body.sidebar-compact #portal-sidebar .nav-pinned{
  padding:0;
  border:0;
  background:transparent;
}

body.sidebar-compact #portal-sidebar .nav-label,
body.sidebar-compact #portal-sidebar .nav-link span:not(.nav-icon){
  display:none;
}

.card,
.panel,
.widget,
.content-card,
.table-card,
.summary-card,
.stat-card,
.soft-card,
.empty-state{
  background:var(--surface-card);
  border:1px solid var(--border-main);
  color:var(--text-main);
  box-shadow:var(--shadow-card);
}

@media (hover:hover){
  a.card:hover,
  .card.interactive:hover,
  .soft-card.interactive:hover{
    transform:translateY(-2px);
    box-shadow:var(--shadow-card-hover);
    border-color:color-mix(in srgb,var(--brand-blue) 26%,var(--border-main));
  }
}

.topbar:not(.page-header){
  background:color-mix(in srgb,var(--surface-card) 92%,var(--surface-filter));
  border:1px solid var(--border-main);
  color:var(--text-main);
}

.topbar:not(.page-header) h1,
.section-title h1,
.section-title h2,
.card h1,
.card h2,
.panel h1,
.panel h2{
  color:var(--brand-navy-soft);
  line-height:1.35;
}

.btn,
a.btn,
button.btn,
input[type="submit"],
input[type="button"]{
  border-radius:999px;
  transition:transform var(--transition-fast),box-shadow var(--transition-fast),background var(--transition-fast),border-color var(--transition-fast),opacity var(--transition-fast);
}

.btn:not(.secondary):not(.ghost):not(.outline):not(.danger):not(.warning):not(.btn-light),
.btn-primary,
.login-btn{
  background:linear-gradient(135deg,var(--brand-blue),var(--brand-navy-soft));
  color:var(--surface-card);
  box-shadow:var(--shadow-control);
}

.btn.secondary,
.btn.ghost,
.btn-outline,
.btn-light{
  background:var(--surface-filter);
  border-color:var(--border-main);
  color:var(--brand-navy-soft);
}

.btn.warning,
.btn-warning{
  background:linear-gradient(135deg,var(--brand-orange),var(--brand-gold));
  color:var(--text-strong);
}

.btn.danger,
.btn-danger{
  background:linear-gradient(135deg,var(--brand-purple),var(--brand-navy-soft));
  color:var(--surface-card);
}

:where(.btn,button,input,select,textarea)[disabled],
:where(.btn,button,input,select,textarea)[aria-disabled="true"]{
  cursor:not-allowed;
  opacity:.58;
  transform:none;
}

.input,
.select,
.textarea,
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea,
.form-control{
  min-height:44px;
  background:var(--surface-card);
  border:1px solid var(--border-main);
  color:var(--text-strong);
  border-radius:14px;
}

.input:focus,
.select:focus,
.textarea:focus,
input:not([type="checkbox"]):not([type="radio"]):focus,
select:focus,
textarea:focus,
.form-control:focus{
  border-color:var(--brand-blue);
  box-shadow:var(--ring-focus);
}

::placeholder{
  color:var(--text-muted);
}

.filters,
.filter-panel,
.toolbar,
.tabs,
.tab-strip{
  background:var(--surface-filter);
  border:1px solid var(--border-main);
  box-shadow:none;
}

.table-wrap,
.table-responsive{
  border:1px solid var(--border-main);
  border-radius:18px;
  background:var(--surface-card);
  box-shadow:var(--shadow-card);
}

.table,
.data-table,
.cl35-table{
  background:var(--surface-card);
  color:var(--text-main);
}

.table th,
.table td,
.data-table th,
.data-table td,
.cl35-table th,
.cl35-table td{
  text-align:start;
  border-color:var(--border-main);
}

.table thead th,
.data-table thead th,
.cl35-table thead th{
  background:var(--surface-filter);
  color:var(--text-strong);
  font-weight:800;
  white-space:nowrap;
  word-break:keep-all;
  overflow-wrap:normal;
  line-height:1.35;
}

.table tbody tr:hover td,
.data-table tbody tr:hover td,
.cl35-table tbody tr:hover td{
  background:var(--surface-identity);
}

.badge,
.status,
.pill,
.tag{
  border-radius:999px;
  background:var(--surface-filter);
  color:var(--brand-navy-soft);
  border:1px solid color-mix(in srgb,var(--border-main) 86%,transparent);
}

.badge.ok,
.badge.green,
.status-success,
.badge-success{
  background:color-mix(in srgb,var(--brand-green) 14%,var(--surface-card));
  color:var(--brand-navy-soft);
}

.badge.warn,
.status-warning,
.badge-warning{
  background:color-mix(in srgb,var(--brand-orange) 14%,var(--surface-card));
  color:var(--brand-gold-dark);
}

.badge.danger,
.status-danger,
.badge-danger{
  background:color-mix(in srgb,var(--brand-purple) 12%,var(--surface-card));
  color:var(--brand-navy-soft);
}

.ui-state-loading,
[aria-busy="true"]{
  position:relative;
  overflow:hidden;
}

.ui-state-loading::after,
[aria-busy="true"]::after{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--surface-card) 70%,transparent),transparent);
  animation:uiShimmer 1.2s infinite;
}

@media (max-width: 1180px){
  .rekaz-global-header{
    grid-template-columns:var(--shell-header-grid-tablet,minmax(220px,1fr) minmax(260px,1fr));
    grid-template-areas:
      "brand tools"
      "center center"
      "breadcrumb breadcrumb";
    padding-inline:20px;
  }
  .rekaz-global-header .header-center{
    width:100%;
  }
}

@media (max-width: 980px){
  body.portal-shell.rekaz-theme-active .main,
  body.portal-shell.rekaz-theme-active #main-content{
    padding-block-start:82px;
    padding-inline:14px;
  }
  .rekaz-global-header{
    position:relative;
    display:grid;
    grid-template-columns:var(--shell-header-grid-mobile,1fr auto);
    grid-template-areas:
      "brand tools"
      "center center"
      "breadcrumb breadcrumb";
    gap:10px;
    padding:12px 14px;
    border-radius:0 0 18px 18px;
  }
  .rekaz-global-header .header-brand{grid-area:brand}
  .rekaz-global-header .header-tools{grid-area:tools;justify-content:flex-end}
  .rekaz-global-header .header-center{grid-area:center;display:grid;width:100%}
  .rekaz-global-header .header-breadcrumb{grid-area:breadcrumb}
  .header-clock{
    display:none;
  }
  .header-search{
    width:100%;
  }
  .header-tools .header-icon-btn:not(.accent):not([data-a11y-panel-toggle]),
  .header-tools .header-avatar,
  .header-tools .header-duo{
    display:none;
  }
  .mobile-nav-toggle{
    display:inline-flex;
    position:fixed;
    inset-block-start:12px;
    inset-inline-start:12px;
    z-index:var(--z-modal);
    background:linear-gradient(135deg,var(--brand-blue),var(--brand-navy-soft));
    color:var(--surface-card);
    border:1px solid color-mix(in srgb,var(--surface-card) 30%,transparent);
    box-shadow:0 14px 28px color-mix(in srgb,var(--brand-navy) 20%,transparent);
  }
/* Phase54: removed legacy theme shell geometry rule. */

  html[dir="ltr"] body.portal-shell #portal-sidebar.sidebar{
    transform:translateX(-105%);
  }
  body.sidebar-open #portal-sidebar.sidebar{
    transform:translateX(0);
  }
  body.sidebar-open .sidebar-backdrop{
    display:block;
    position:fixed;
    inset:0;
    z-index:var(--z-backdrop);
    background:color-mix(in srgb,var(--brand-navy) 58%,transparent);
  }
  body.sidebar-compact #portal-sidebar.sidebar{
    width:var(--shell-sidebar-mobile-width,min(86vw,348px));
    padding-inline:16px;
  }
  body.sidebar-compact #portal-sidebar :where(.sidebar-brand,.school-context,.user-chip,.rekaz-sidebar-footer,.nav-accordion-toggle){
    display:flex;
  }
  body.sidebar-compact #portal-sidebar .nav-accordion-toggle{
    display:flex;
  }
  body.sidebar-compact #portal-sidebar .nav-accordion-panel{
    display:none;
  }
  body.sidebar-compact #portal-sidebar .nav-accordion-panel.is-open{
    display:grid;
  }
  body.sidebar-compact #portal-sidebar .nav-label,
  body.sidebar-compact #portal-sidebar .nav-link span:not(.nav-icon){
    display:inline;
  }
  body.sidebar-compact #portal-sidebar .nav-link{
    width:auto;
    min-height:42px;
    justify-content:flex-start;
    padding-inline:12px;
  }
}

@media (max-width: 760px){
  body.portal-shell.rekaz-theme-active{
    font-size:14px;
  }
  .topbar:not(.page-header){
    display:grid;
    gap:12px;
    padding:14px;
    border-radius:16px;
  }
  .topbar h1{
    font-size:clamp(20px,7vw,26px);
  }
  .grid,
  .cards-3,
  .form-grid,
  .split,
  [class*="grid"].two,
  [class*="grid"].three,
  [class*="grid"].four{
    grid-template-columns:1fr;
  }
  .filters,
  .filter-panel,
  .toolbar,
  .actions,
  .btn-row{
    display:grid;
    grid-template-columns:1fr;
    align-items:stretch;
  }
  .filters > *,
  .filter-panel > *,
  .toolbar > *,
  .actions > *,
  .btn-row > *,
  .btn,
  a.btn,
  button.btn{
    width:100%;
  }
  .table-wrap,
  .table-responsive{
    border:0;
    background:transparent;
    box-shadow:none;
    overflow:visible;
  }
  .table,
  .data-table,
  .cl35-table{
    min-width:0;
    border-spacing:0 10px;
    background:transparent;
  }
  .table thead,
  .data-table thead,
  .cl35-table thead{
    display:none;
  }
  .table tbody,
  .table tr,
  .table td,
  .data-table tbody,
  .data-table tr,
  .data-table td,
  .cl35-table tbody,
  .cl35-table tr,
  .cl35-table td{
    display:block;
    width:100%;
  }
  .table tr,
  .data-table tr,
  .cl35-table tr{
    margin-block-end:10px;
    padding:10px;
    border:1px solid var(--border-main);
    border-radius:16px;
    background:var(--surface-card);
    box-shadow:var(--shadow-card);
  }
  .table td,
  .data-table td,
  .cl35-table td{
    border:0;
    padding:8px 6px;
    display:grid;
    grid-template-columns:minmax(98px,34%) minmax(0,1fr);
    gap:8px;
    text-align:start;
  }
  .table td::before,
  .data-table td::before,
  .cl35-table td::before{
    content:attr(data-label);
    color:var(--brand-navy-soft);
    font-weight:800;
  }
  .table td:empty,
  .data-table td:empty,
  .cl35-table td:empty{
    display:none;
  }
}

@media (max-width: 440px){
  .header-brand-title{
    max-width:54vw;
  }
  .header-brand small{
    display:none;
  }
  .header-tools{
    gap:6px;
  }
  .header-icon-btn,
  .header-avatar,
  .header-menu-lines,
  .mobile-nav-toggle{
    min-width:40px;
    min-height:40px;
  }
  .card,
  .panel,
  .widget,
  .content-card,
  .table-card,
  .summary-card,
  .stat-card{
    padding:14px;
    border-radius:14px;
  }
  .table td,
  .data-table td,
  .cl35-table td{
    grid-template-columns:1fr;
    gap:2px;
  }
}

html[data-a11y-motion="reduced"] *,
body.a11y-reduced-motion *{
  animation-duration:.01ms;
  animation-iteration-count:1;
  transition-duration:.01ms;
  scroll-behavior:auto;
}

/* =====================================================================
   Phase 82 - shell contract
   Single active source for header, sidebar, radii, and motion hints.
   ===================================================================== */
:root{
  --shell-header-grid:minmax(280px,1fr) minmax(320px,1.08fr) minmax(240px,.9fr);
  --shell-header-grid-tablet:minmax(220px,1fr) minmax(260px,1fr);
  --shell-header-grid-mobile:1fr auto;
  --shell-header-bg:linear-gradient(135deg,var(--brand-navy) 0%,var(--brand-navy-soft) 54%,var(--brand-blue) 100%);
  --shell-header-shadow:0 18px 42px color-mix(in srgb,var(--brand-navy) 16%,transparent);
  --shell-header-radius:22px;
  --shell-sidebar-bg:#f0f4fa;
  --shell-sidebar-width:var(--rekaz-sidebar-expanded-width);
  --shell-sidebar-compact-width:var(--rekaz-sidebar-collapsed-width);
  --shell-sidebar-mobile-width:min(86vw,348px);
  --shell-radius-card:18px;
  --shell-radius-control:999px;
  --shell-radius-nav:14px;
}

body.portal-shell.rekaz-theme-active{
  --sidebar-w:var(--shell-sidebar-width);
}

body.portal-shell.rekaz-theme-active.sidebar-compact,
body.portal-shell.rekaz-theme-active.sidebar-collapsed{
  --sidebar-w:var(--shell-sidebar-compact-width);
}

body.portal-shell.rekaz-theme-active .rekaz-global-header{
  position:sticky;
  inset-block-start:0;
  display:grid;
  grid-template-columns:var(--shell-header-grid);
  grid-template-areas:
    "brand center tools"
    "breadcrumb breadcrumb breadcrumb";
  grid-template-rows:auto auto;
  align-items:center;
  gap:16px;
  min-height:auto;
  padding:18px 28px 16px;
  overflow:visible;
  color:var(--surface-card);
  background:var(--shell-header-bg);
  border:0;
  border-radius:0 0 var(--shell-header-radius) var(--shell-header-radius);
  box-shadow:var(--shell-header-shadow);
}

body.portal-shell.rekaz-theme-active .rekaz-global-header .header-brand{grid-area:brand;}
body.portal-shell.rekaz-theme-active .rekaz-global-header .header-center{grid-area:center;min-width:0;}
body.portal-shell.rekaz-theme-active .rekaz-global-header .header-tools{grid-area:tools;}
body.portal-shell.rekaz-theme-active .rekaz-global-header .header-breadcrumb{grid-area:breadcrumb;}
/* Phase54: removed legacy theme shell geometry rule. */

/* Phase54: removed legacy theme shell geometry rule. */


body.portal-shell.rekaz-theme-active.sidebar-compact #portal-sidebar :where(.sidebar-brand,.school-context,.user-chip,.rekaz-sidebar-footer,.nav-accordion-toggle),
body.portal-shell.rekaz-theme-active.sidebar-collapsed #portal-sidebar :where(.sidebar-brand,.school-context,.user-chip,.rekaz-sidebar-footer,.nav-accordion-toggle){
  display:none;
}

body.portal-shell.rekaz-theme-active.sidebar-compact #portal-sidebar .nav-accordion-panel,
body.portal-shell.rekaz-theme-active.sidebar-collapsed #portal-sidebar .nav-accordion-panel{
  display:grid;
  background:transparent;
  border:0;
  padding:0;
}

body.portal-shell.rekaz-theme-active.sidebar-compact #portal-sidebar .nav-label,
body.portal-shell.rekaz-theme-active.sidebar-compact #portal-sidebar .nav-link span:not(.nav-icon),
body.portal-shell.rekaz-theme-active.sidebar-collapsed #portal-sidebar .nav-label,
body.portal-shell.rekaz-theme-active.sidebar-collapsed #portal-sidebar .nav-link span:not(.nav-icon){
  display:none;
}

body.rekaz-theme-active :where(.card,.panel,.widget,.content-card,.table-card,.summary-card,.stat-card,.soft-card,.empty-state,.auth-card,.rekaz-school-card){
  border-radius:var(--shell-radius-card);
}

body.rekaz-theme-active :where(.btn,a.btn,button.btn,input[type="submit"],input[type="button"],.tab-button,.nav-pills .nav-link){
  border-radius:var(--shell-radius-control);
}

body.portal-shell.rekaz-theme-active #portal-sidebar :where(.nav-link,.nav-accordion-toggle){
  border-radius:var(--shell-radius-nav);
}

@media (hover:hover) and (prefers-reduced-motion:no-preference){
  body.rekaz-theme-active :where(.header-icon-btn,.header-menu-lines,.mobile-nav-toggle,.btn,a.btn,button.btn,.nav-link){
    will-change:transform;
  }
  body.rekaz-theme-active :where(.card,a.card,.panel,.widget,.content-card,.table-card,.summary-card,.stat-card,.soft-card,.empty-state,.rekaz-school-card){
    will-change:transform,box-shadow;
  }
}

@media (prefers-reduced-motion:no-preference){
  body.portal-shell.rekaz-theme-active #portal-sidebar.sidebar,
  body.portal-shell.rekaz-theme-active .sidebar,
  body.portal-shell.rekaz-theme-active .rekaz-sidebar,
  body.portal-shell.rekaz-theme-active .sidebar-backdrop{
    will-change:transform,opacity;
  }
  body.rekaz-theme-active :where(.ui-state-loading,[aria-busy="true"])::after{
    will-change:transform;
  }
}

html[data-a11y-motion="reduced"] body.rekaz-theme-active *,
body.a11y-reduced-motion.rekaz-theme-active *{
  will-change:auto;
}

@media (max-width: 1180px){
  body.portal-shell.rekaz-theme-active .rekaz-global-header{
    grid-template-columns:var(--shell-header-grid-tablet);
    grid-template-areas:
      "brand tools"
      "center center"
      "breadcrumb breadcrumb";
    padding-inline:20px;
  }
}

@media (max-width: 980px){
  body.portal-shell.rekaz-theme-active{
    --sidebar-w:var(--shell-sidebar-mobile-width);
  }
  body.portal-shell.rekaz-theme-active .rekaz-global-header{
    position:relative;
    grid-template-columns:var(--shell-header-grid-mobile);
    grid-template-areas:
      "brand tools"
      "center center"
      "breadcrumb breadcrumb";
    gap:10px;
    padding:12px 14px;
    border-radius:0 0 18px 18px;
  }
  body.portal-shell.rekaz-theme-active #portal-sidebar.sidebar,
  body.portal-shell.rekaz-theme-active.sidebar-compact #portal-sidebar.sidebar,
  body.portal-shell.rekaz-theme-active.sidebar-collapsed #portal-sidebar.sidebar,
  body.portal-shell.rekaz-theme-active #portal-sidebar.sidebar.is-collapsed{
    width:var(--shell-sidebar-mobile-width);
    padding-inline:16px;
    border-radius:0;
  }
  body.portal-shell.rekaz-theme-active.sidebar-compact #portal-sidebar :where(.sidebar-brand,.school-context,.user-chip,.rekaz-sidebar-footer,.nav-accordion-toggle),
  body.portal-shell.rekaz-theme-active.sidebar-collapsed #portal-sidebar :where(.sidebar-brand,.school-context,.user-chip,.rekaz-sidebar-footer,.nav-accordion-toggle){
    display:flex;
  }
  body.portal-shell.rekaz-theme-active.sidebar-compact #portal-sidebar .nav-accordion-panel,
  body.portal-shell.rekaz-theme-active.sidebar-collapsed #portal-sidebar .nav-accordion-panel{
    display:none;
  }
  body.portal-shell.rekaz-theme-active.sidebar-compact #portal-sidebar .nav-accordion-panel.is-open,
  body.portal-shell.rekaz-theme-active.sidebar-collapsed #portal-sidebar .nav-accordion-panel.is-open{
    display:grid;
  }
  body.portal-shell.rekaz-theme-active.sidebar-compact #portal-sidebar .nav-label,
  body.portal-shell.rekaz-theme-active.sidebar-compact #portal-sidebar .nav-link span:not(.nav-icon),
  body.portal-shell.rekaz-theme-active.sidebar-collapsed #portal-sidebar .nav-label,
  body.portal-shell.rekaz-theme-active.sidebar-collapsed #portal-sidebar .nav-link span:not(.nav-icon){
    display:inline;
  }
  body.portal-shell.rekaz-theme-active.sidebar-compact #portal-sidebar .nav-link,
  body.portal-shell.rekaz-theme-active.sidebar-collapsed #portal-sidebar .nav-link{
    width:auto;
    min-height:42px;
    justify-content:flex-start;
    padding-inline:12px;
  }
}

/* =====================================================================
   Phase 83 - bidirectional shell reset
   Final source of truth for Arabic/English alignment, shell colors,
   header density, sidebar readability, and login contrast.
   ===================================================================== */
:root{
  --shell-page-gutter:clamp(16px,2.2vw,34px);
  --shell-content-max:1760px;
  --shell-header-control:44px;
  --shell-header-gap:14px;
  --shell-sidebar-width:var(--rekaz-sidebar-expanded-width);
  --shell-sidebar-bg:#f0f4fa;
  --shell-sidebar-panel:#ffffff;
  --shell-sidebar-panel-border:#e2e8f0;
  --shell-sidebar-link:#0B2D5C;
  --shell-sidebar-link-muted:#475569;
  --shell-sidebar-active:rgba(37,99,235,.09);
}

html[dir="rtl"] body{
  direction:rtl;
  text-align:start;
}

html[dir="ltr"] body{
  direction:ltr;
  text-align:start;
}

html[dir] body.rekaz-theme-active :where(h1,h2,h3,h4,h5,h6,p,label,li,th,td,.muted,.page-subtitle,.nav-label,.nav-accordion-label){
  letter-spacing:0;
}

body.portal-shell.rekaz-theme-active{
  color:var(--text-main,#2D3748);
  background:
    radial-gradient(circle at 12% 0%,color-mix(in srgb,var(--brand-cyan) 10%,transparent),transparent 26%),
    radial-gradient(circle at 88% 0%,color-mix(in srgb,var(--brand-blue) 10%,transparent),transparent 24%),
    linear-gradient(180deg,#F5F9FF 0%,#F8FAFC 340px,#F8FAFC 100%);
}

body.portal-shell.rekaz-theme-active .rekaz-global-header{
  position:sticky;
  inset-block-start:0;
  z-index:var(--z-header);
  display:grid;
  grid-template-columns:minmax(260px,.9fr) minmax(320px,1fr) minmax(260px,.9fr);
  grid-template-areas:
    "brand center tools"
    "breadcrumb breadcrumb breadcrumb";
  gap:var(--shell-header-gap);
  align-items:center;
  min-height:118px;
  padding:16px var(--shell-page-gutter) 14px;
  direction:ltr;
  color:#F8FBFF;
  background:linear-gradient(135deg,var(--brand-navy) 0%,var(--brand-navy-soft) 48%,var(--brand-blue) 82%,var(--brand-cyan) 100%);
  border:0;
  border-radius:0 0 20px 20px;
  box-shadow:0 18px 42px color-mix(in srgb,var(--brand-navy) 18%,transparent);
  overflow:visible;
}

html[dir="rtl"] body.portal-shell.rekaz-theme-active .rekaz-global-header{
  grid-template-areas:
    "tools center brand"
    "breadcrumb breadcrumb breadcrumb";
}

body.portal-shell.rekaz-theme-active .rekaz-global-header > *{
  direction:inherit;
}

body.portal-shell.rekaz-theme-active .rekaz-global-header .header-brand{
  grid-area:brand;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  align-items:center;
  gap:2px 10px;
  justify-self:start;
  min-width:0;
  text-align:start;
}

html[dir="rtl"] body.portal-shell.rekaz-theme-active .rekaz-global-header .header-brand{
  direction:rtl;
  justify-self:end;
}

html[dir="ltr"] body.portal-shell.rekaz-theme-active .rekaz-global-header .header-brand{
  direction:ltr;
  justify-self:start;
}

body.portal-shell.rekaz-theme-active .header-brand .header-menu-lines{
  grid-row:1/3;
  width:var(--shell-header-control);
  height:var(--shell-header-control);
  min-width:var(--shell-header-control);
  border-radius:14px;
  background:color-mix(in srgb,#F8FBFF 13%,transparent);
  border:1px solid color-mix(in srgb,#F8FBFF 25%,transparent);
}

body.portal-shell.rekaz-theme-active .header-brand .header-brand-mark{
  grid-row:1/3;
  width:var(--shell-header-control);
  height:var(--shell-header-control);
  min-width:var(--shell-header-control);
  border-radius:15px;
  background:linear-gradient(135deg,var(--brand-blue),var(--brand-cyan));
  border:1px solid color-mix(in srgb,#F8FBFF 34%,transparent);
  box-shadow:0 10px 24px color-mix(in srgb,var(--brand-navy) 18%,transparent);
}

body.portal-shell.rekaz-theme-active .header-brand-title{
  max-width:min(34vw,360px);
  color:#F8FBFF;
  font-size:clamp(17px,1.35vw,22px);
  font-weight:900;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

body.portal-shell.rekaz-theme-active .header-brand small{
  color:color-mix(in srgb,#F8FBFF 82%,transparent);
  font-size:11px;
  line-height:1.35;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

body.portal-shell.rekaz-theme-active .rekaz-global-header .header-center{
  grid-area:center;
  display:grid;
  grid-template-columns:minmax(220px,1fr) auto;
  gap:12px;
  align-items:center;
  min-width:0;
  justify-self:stretch;
}

html[dir="rtl"] body.portal-shell.rekaz-theme-active .rekaz-global-header .header-center{
  direction:rtl;
}

html[dir="ltr"] body.portal-shell.rekaz-theme-active .rekaz-global-header .header-center{
  direction:ltr;
}

body.portal-shell.rekaz-theme-active .header-search{
  width:100%;
  min-width:0;
  height:var(--shell-header-control);
  padding-inline:14px;
  color:#F8FBFF;
  background:color-mix(in srgb,#F8FBFF 13%,transparent);
  border:1px solid color-mix(in srgb,#F8FBFF 28%,transparent);
  border-radius:999px;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,#F8FBFF 5%,transparent);
}

body.portal-shell.rekaz-theme-active .header-search input{
  width:100%;
  height:calc(var(--shell-header-control) - 6px);
  direction:inherit;
  color:#F8FBFF;
  background:transparent;
  border:0;
  text-align:start;
}

body.portal-shell.rekaz-theme-active .header-search input::placeholder{
  color:color-mix(in srgb,#F8FBFF 74%,transparent);
  opacity:1;
}

body.portal-shell.rekaz-theme-active .header-clock{
  min-height:var(--shell-header-control);
  height:var(--shell-header-control);
  padding-inline:16px;
  color:#F8FBFF;
  background:color-mix(in srgb,#F8FBFF 12%,transparent);
  border:1px solid color-mix(in srgb,#F8FBFF 24%,transparent);
  border-radius:999px;
  white-space:nowrap;
}

body.portal-shell.rekaz-theme-active .rekaz-global-header .header-tools{
  grid-area:tools;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  justify-self:end;
  gap:8px;
  flex-wrap:nowrap;
  min-width:0;
}

html[dir="rtl"] body.portal-shell.rekaz-theme-active .rekaz-global-header .header-tools{
  direction:rtl;
  justify-self:start;
  justify-content:flex-start;
}

body.portal-shell.rekaz-theme-active .header-icon-btn,
body.portal-shell.rekaz-theme-active .header-avatar,
body.portal-shell.rekaz-theme-active .header-duo{
  color:#F8FBFF;
  background:color-mix(in srgb,#F8FBFF 12%,transparent);
  border:1px solid color-mix(in srgb,#F8FBFF 25%,transparent);
  box-shadow:none;
}

body.portal-shell.rekaz-theme-active .header-icon-btn,
body.portal-shell.rekaz-theme-active .header-avatar{
  width:var(--shell-header-control);
  height:var(--shell-header-control);
  min-width:var(--shell-header-control);
  border-radius:14px;
}

body.portal-shell.rekaz-theme-active .header-avatar{
  background:#F8FBFF;
  color:var(--brand-navy-soft);
  font-weight:900;
}

body.portal-shell.rekaz-theme-active .header-icon-btn:hover,
body.portal-shell.rekaz-theme-active .header-icon-btn:focus,
body.portal-shell.rekaz-theme-active .header-menu-lines:hover,
body.portal-shell.rekaz-theme-active .header-menu-lines:focus{
  color:#F8FBFF;
  background:color-mix(in srgb,#F8FBFF 20%,transparent);
  border-color:color-mix(in srgb,#F8FBFF 42%,transparent);
  outline:none;
  transform:translateY(-1px);
}

body.portal-shell.rekaz-theme-active .header-breadcrumb{
  grid-area:breadcrumb;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  min-width:0;
  max-width:100%;
  min-height:38px;
  padding:8px 14px;
  color:#F8FBFF;
  background:color-mix(in srgb,#F8FBFF 14%,transparent);
  border:1px solid color-mix(in srgb,#F8FBFF 22%,transparent);
  border-radius:999px;
  overflow:auto;
  scrollbar-width:none;
}

html[dir="rtl"] body.portal-shell.rekaz-theme-active .header-breadcrumb{
  direction:rtl;
  justify-content:flex-start;
}

body.portal-shell.rekaz-theme-active .header-breadcrumb::-webkit-scrollbar{
  display:none;
}

body.portal-shell.rekaz-theme-active .header-breadcrumb :where(span,strong,em){
  color:#F8FBFF;
  white-space:nowrap;
}

body.portal-shell.rekaz-theme-active .header-breadcrumb em{
  margin-inline-start:auto;
  padding:5px 12px;
  border-radius:999px;
  background:color-mix(in srgb,#F8FBFF 12%,transparent);
  border:1px solid color-mix(in srgb,#F8FBFF 22%,transparent);
  font-style:normal;
}
/* Phase54: removed legacy theme shell geometry rule. */

/* Phase54: removed legacy theme shell geometry rule. */

/* Phase54: removed legacy theme shell geometry rule. */

/* Phase54: removed legacy theme shell geometry rule. */

/* Phase54: removed legacy theme shell geometry rule. */

/* Phase54: removed legacy theme shell geometry rule. */


body.portal-shell.rekaz-theme-active #portal-sidebar :where(.sidebar-brand,.school-context,.rekaz-school-card,.user-chip,.rekaz-sidebar-footer){
  color:var(--shell-sidebar-text,#0B2D5C);
  background:var(--shell-sidebar-panel);
  border:1px solid var(--shell-sidebar-panel-border);
  border-radius:14px;
  box-shadow:none;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .sidebar-brand{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:10px;
  padding:14px;
  text-align:start;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .brand-mark,
body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-school-logo{
  width:48px;
  height:48px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--brand-navy);
  background:linear-gradient(135deg,var(--brand-cyan),var(--brand-green));
  border:0;
  box-shadow:none;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-head .rekaz-school-logo{
  width:32px;
  height:32px;
  border-radius:8px;
  flex-shrink:0;
}

body.portal-shell.rekaz-theme-active #portal-sidebar :where(h2,p,strong,a,.muted,.nav-section,.nav-accordion-label,.nav-label){
  color:var(--shell-sidebar-text,#0B2D5C);
}

body.portal-shell.rekaz-theme-active #portal-sidebar :where(p,.muted,.nav-section){
  color:var(--shell-sidebar-link-muted);
}

body.portal-shell.rekaz-theme-active #portal-sidebar .school-context{
  margin:6px 0;
  padding:8px 6px;
  text-align:start;
  overflow:hidden;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-card{
  display:grid;
  gap:6px;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-head{
  display:grid;
  grid-template-columns:32px minmax(0,1fr);
  gap:6px;
  align-items:center;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-copy{
  min-width:0;
  display:grid;
  gap:2px;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-copy > span{
  font-size:10px;
  font-weight:800;
  letter-spacing:.02em;
  color:var(--shell-sidebar-link-muted);
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-copy strong{
  font-size:12px;
  line-height:1.3;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-meta,
body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-academic-context-meta{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-meta span,
body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-academic-context-meta span{
  display:inline-flex;
  align-items:center;
  min-height:20px;
  padding:2px 6px;
  border-radius:999px;
  background:color-mix(in srgb,var(--brand-blue) 10%,var(--surface-card));
  border:1px solid color-mix(in srgb,var(--brand-blue) 18%,var(--line));
  color:var(--shell-sidebar-text,#0B2D5C);
  font-size:10px;
  font-weight:800;
  line-height:1;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-form{
  display:grid;
  gap:5px;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-grid{
  display:grid;
  gap:5px;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-field{
  display:flex;
  align-items:center;
  gap:6px;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-field > span{
  font-size:10px;
  font-weight:800;
  color:var(--shell-sidebar-link-muted);
  flex-shrink:0;
  white-space:nowrap;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-select{
  flex:1;
  min-width:0;
  height:16px;
  min-height:16px;
  padding:0 4px 0 16px;
  border-radius:4px;
  appearance:none;
  -webkit-appearance:none;
  background:var(--surface-card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpath d='M4 5L0 0h8z' fill='%23718096'/%3E%3C/svg%3E") no-repeat left 4px center;
  border:1px solid var(--shell-sidebar-panel-border);
  color:var(--shell-sidebar-text,#0B2D5C);
  font-size:10px;
  line-height:1;
  box-shadow:none;
  cursor:pointer;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-select:focus-visible{
  border-color:var(--brand-blue);
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-select:disabled{
  opacity:.72;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-submit{
  min-height:28px;
  padding-inline:10px;
  border:0;
  border-radius:8px;
  background:linear-gradient(135deg,var(--brand-blue),var(--brand-navy));
  color:var(--surface-card);
  font-size:11px;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 6px 16px color-mix(in srgb,var(--brand-navy) 14%,transparent);
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-submit:hover{
  transform:translateY(-1px);
}

body.portal-shell.rekaz-theme-active #portal-sidebar .rekaz-teacher-context-note{
  font-size:10px;
  line-height:1.5;
  color:var(--shell-sidebar-link-muted);
}

body.portal-shell.rekaz-theme-active .main.cl36-page .rekaz-calendar-context,
body.portal-shell.rekaz-theme-active .main.rekaz-gradebook-page .rekaz-calendar-context,
body.portal-shell.rekaz-theme-active .main.rekaz-learning-page .rekaz-calendar-context{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-block-start:12px;
}

body.portal-shell.rekaz-theme-active .main.cl36-page .rekaz-calendar-context .badge,
body.portal-shell.rekaz-theme-active .main.rekaz-gradebook-page .rekaz-calendar-context .badge,
body.portal-shell.rekaz-theme-active .main.rekaz-learning-page .rekaz-calendar-context .badge{
  min-height:28px;
  padding:5px 10px;
  font-size:11px;
  font-weight:900;
  line-height:1.25;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .user-chip{
  margin:0 0 12px;
  padding:10px 12px;
  justify-content:flex-start;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .sidebar-nav{
  display:grid;
  gap:6px;
  padding:0;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .nav-pinned{
  display:grid;
  gap:4px;
  padding:10px;
  border:1px solid color-mix(in srgb,var(--brand-blue) 10%,var(--line));
  border-radius:14px;
  background:color-mix(in srgb,var(--surface-card) 92%,var(--brand-blue) 4%);
}

body.portal-shell.rekaz-theme-active #portal-sidebar .nav-pinned{
  margin:0 0 2px;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .nav-pinned a.nav-link{
  min-height:38px;
  padding-inline:10px;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .nav-group{
  display:grid;
  gap:4px;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .nav-accordion-toggle{
  width:100%;
  min-height:44px;
  display:grid;
  grid-template-columns:26px minmax(0,1fr) 20px;
  align-items:center;
  gap:8px;
  padding:0 12px;
  color:var(--shell-sidebar-link);
  background:transparent;
  border:1px solid transparent;
  border-radius:12px;
  text-align:start;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .nav-accordion-toggle:hover,
body.portal-shell.rekaz-theme-active #portal-sidebar .nav-accordion-toggle[aria-expanded="true"]{
  color:var(--shell-sidebar-text,#0B2D5C);
  background:rgba(37,99,235,.08);
  border-color:transparent;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .nav-accordion-icon,
body.portal-shell.rekaz-theme-active #portal-sidebar .nav-icon{
  color:var(--shell-sidebar-icon-color,#16519e);
  width:26px;
  text-align:center;
  opacity:1;
  filter:none;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .nav-accordion-arrow{
  color:#94a3b8;
  justify-self:end;
}

html[dir="rtl"] body.portal-shell.rekaz-theme-active #portal-sidebar .nav-accordion-arrow{
  transform:scaleX(-1);
}

html[dir="rtl"] body.portal-shell.rekaz-theme-active #portal-sidebar .nav-accordion-toggle[aria-expanded="true"] .nav-accordion-arrow{
  transform:scaleX(-1) rotate(-90deg);
}

body.portal-shell.rekaz-theme-active #portal-sidebar .nav-accordion-panel{
  display:none;
  padding:4px 0 8px;
  background:transparent;
  border:0;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .nav-accordion-panel.is-open{
  display:grid;
  gap:3px;
}

body.portal-shell.rekaz-theme-active #portal-sidebar a.nav-link{
  position:relative;
  min-height:40px;
  padding:0 12px;
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--shell-sidebar-link);
  background:transparent;
  border:1px solid transparent;
  border-radius:12px;
  box-shadow:none;
  transform:none;
}

body.portal-shell.rekaz-theme-active #portal-sidebar a.nav-link:hover,
body.portal-shell.rekaz-theme-active #portal-sidebar a.nav-link:focus{
  color:var(--shell-sidebar-text,#0B2D5C);
  background:rgba(37,99,235,.08);
  border-color:transparent;
  outline:none;
  transform:none;
}

body.portal-shell.rekaz-theme-active #portal-sidebar a.nav-link.active{
  color:var(--shell-sidebar-text,#0B2D5C);
  background:var(--shell-sidebar-active);
  border-color:rgba(79,70,229,.25);
  box-shadow:none;
  font-weight:900;
}

body.portal-shell.rekaz-theme-active #portal-sidebar a.nav-link.active::before{
  content:'';
  position:absolute;
  inset-inline-start:8px;
  inset-inline-end:auto;
  width:5px;
  height:5px;
  border-radius:999px;
  background:#4f46e5;
}

body.portal-shell.rekaz-theme-active #portal-sidebar .nav-label{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* Keep the active state as a filled row only; the old pseudo marker crossed RTL labels. */
body.portal-shell.rekaz-theme-active #portal-sidebar a.nav-link.active::before,
body.portal-shell.rekaz-theme-active #portal-sidebar .sidebar-nav a.nav-link.active::before,
body.portal-shell.rekaz-theme-active #portal-sidebar .sidebar-nav .nav-link.active::before{
  content:none !important;
  display:none !important;
}

body.portal-shell.rekaz-theme-active :where(.card,.panel,.widget,.content-card,.table-card,.summary-card,.stat-card,.rekaz-feature-card){
  color:var(--text-main,#2D3748);
  background:#F8FBFF;
  border:1px solid #E5EDF7;
  box-shadow:0 14px 32px color-mix(in srgb,var(--brand-navy) 7%,transparent);
}

body.portal-shell.rekaz-theme-active :where(h1,h2,h3,.section-title h2,.topbar h1){
  color:var(--text-strong,#0F172A);
}

body.portal-shell.rekaz-theme-active :where(.muted,.page-subtitle,.help,.help-text,small){
  color:var(--text-calm,#5F6B7A);
}

body.portal-shell.rekaz-theme-active .topbar:not(.page-header){
  color:#F8FBFF;
  background:linear-gradient(135deg,var(--brand-navy-soft),var(--brand-blue));
  border:0;
}

body.portal-shell.rekaz-theme-active .topbar:not(.page-header) :where(h1,h2,h3,p,.muted,small){
  color:#F8FBFF;
}

body.portal-shell.rekaz-theme-active :where(input,select,textarea,.input,.select,.textarea,.form-control){
  color:#0B2D5C;
  background:#F8FBFF;
  border:1px solid #E5EDF7;
}

body.portal-shell.rekaz-theme-active :where(input,select,textarea,.input,.select,.textarea,.form-control)::placeholder{
  color:#718096;
  opacity:1;
}

html[dir="rtl"] body.portal-shell.rekaz-theme-active :where(input:not(.ltr):not([dir="ltr"]):not([type="email"]):not([type="url"]):not([type="tel"]):not([type="number"]),textarea,select){
  direction:rtl;
  text-align:start;
}

html[dir="ltr"] body.portal-shell.rekaz-theme-active :where(input:not(.rtl):not([dir="rtl"]),textarea,select){
  direction:ltr;
  text-align:start;
}

body.rekaz-theme-active :where(.ltr,[dir="ltr"],code,pre,input[type="email"],input[type="url"],input[type="tel"],input[type="number"],input[type="date"],input[type="time"]){
  direction:ltr;
  text-align:start;
  unicode-bidi:plaintext;
}

body.auth-shell.rekaz-theme-active,
body.auth-shell{
  color:#334155;
  background:linear-gradient(90deg,var(--brand-navy) 0%,var(--brand-navy-soft) 52%,#F5F9FF 52%,#F8FAFC 100%);
}

body.auth-shell .login-page{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(440px,.95fr);
  grid-template-areas:"visual panel";
  min-height:100vh;
  padding:0;
  overflow:hidden;
  background:transparent;
}

body.auth-shell .login-visual{
  grid-area:visual;
  color:#F8FBFF;
  background:
    radial-gradient(circle at 24% 84%,color-mix(in srgb,var(--brand-cyan) 24%,transparent),transparent 22%),
    linear-gradient(135deg,var(--brand-navy) 0%,var(--brand-navy-soft) 58%,color-mix(in srgb,var(--brand-blue) 78%,var(--brand-navy-soft)) 100%);
}

body.auth-shell .login-panel{
  grid-area:panel;
  direction:inherit;
  text-align:start;
  color:#334155;
  background:#F8FAFC;
  border:0;
  box-shadow:none;
}

body.auth-shell .login-panel::before,
body.auth-shell .login-panel::after{
  opacity:.28;
}

body.auth-shell .login-panel :where(h1,p,label,.muted,.login-extra-row,.login-extra-row a){
  color:#334155;
}

body.auth-shell .login-panel .form-row label,
body.auth-shell .login-panel .login-extra-row,
body.auth-shell .login-panel .login-extra-row a{
  color:#334155;
}

body.auth-shell .login-panel h1{
  direction:inherit;
  text-align:start;
  color:#0B2D5C;
}

body.auth-shell .login-panel .muted{
  color:#5F6B7A;
}

body.auth-shell .language-pill{
  align-self:flex-start;
  color:var(--brand-navy-soft);
  background:#F8FBFF;
  border:1px solid #E5EDF7;
  box-shadow:0 10px 24px color-mix(in srgb,var(--brand-navy) 6%,transparent);
}

body.auth-shell .login-panel .input{
  color:#0B2D5C;
  background:#F8FBFF;
  border:1px solid #E5EDF7;
  box-shadow:0 8px 18px color-mix(in srgb,var(--brand-navy) 4%,transparent);
}

body.auth-shell .login-panel .input::placeholder{
  color:#718096;
  opacity:1;
}

body.auth-shell .login-extra-row span{
  color:#F8FBFF;
  background:var(--brand-blue);
}

body.auth-shell .login-btn{
  color:#F8FBFF;
  background:linear-gradient(135deg,var(--brand-navy) 0%,var(--brand-blue) 72%,var(--brand-cyan) 100%);
}

@media (max-width: 1280px){
  body.portal-shell.rekaz-theme-active .rekaz-global-header{
    grid-template-columns:minmax(220px,.85fr) minmax(280px,1fr) minmax(220px,.85fr);
  }
  body.portal-shell.rekaz-theme-active .header-clock{
    display:none;
  }
  body.portal-shell.rekaz-theme-active .rekaz-global-header .header-center{
    grid-template-columns:minmax(0,1fr);
  }
}

@media (max-width: 980px){
  body.portal-shell.rekaz-theme-active .rekaz-global-header,
  html[dir="rtl"] body.portal-shell.rekaz-theme-active .rekaz-global-header{
    position:relative;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "brand tools"
      "center center"
      "breadcrumb breadcrumb";
    min-height:auto;
    padding:12px 14px;
    gap:10px;
  }
  html[dir="rtl"] body.portal-shell.rekaz-theme-active .rekaz-global-header{
    grid-template-areas:
      "tools brand"
      "center center"
      "breadcrumb breadcrumb";
  }
  html[dir="rtl"] body.portal-shell.rekaz-theme-active .rekaz-global-header .header-brand{
    justify-self:end;
  }
  body.portal-shell.rekaz-theme-active .header-brand-title{
    max-width:52vw;
  }
  body.portal-shell.rekaz-theme-active .header-brand small,
  body.portal-shell.rekaz-theme-active .header-clock,
  body.portal-shell.rekaz-theme-active .header-tools .header-duo,
  body.portal-shell.rekaz-theme-active .header-tools .header-avatar,
  body.portal-shell.rekaz-theme-active .header-tools .header-icon-btn:not(.accent):not([data-a11y-panel-toggle]){
    display:none;
  }
  body.portal-shell.rekaz-theme-active .rekaz-global-header .header-center{
    grid-template-columns:1fr;
  }
  body.portal-shell.rekaz-theme-active .header-breadcrumb{
    justify-content:flex-start;
  }
/* Phase54: removed legacy theme shell geometry rule. */

  body.portal-shell.rekaz-theme-active .main{
    padding-block-start:70px;
  }
/* Phase54: removed legacy theme shell geometry rule. */

  html[dir="rtl"] body.portal-shell.rekaz-theme-active #portal-sidebar.sidebar,
  html[dir="rtl"] body.portal-shell.rekaz-theme-active #portal-sidebar.rekaz-sidebar{
    inset-inline-start:0;
    inset-inline-end:auto;
    transform:translateX(105%);
  }
  body.sidebar-open.portal-shell.rekaz-theme-active #portal-sidebar.sidebar,
  body.sidebar-open.portal-shell.rekaz-theme-active #portal-sidebar.rekaz-sidebar{
    transform:translateX(0);
  }
  body.portal-shell.rekaz-theme-active .mobile-nav-toggle{
    display:inline-flex;
    inset-block-start:12px;
    inset-inline-start:12px;
    z-index:var(--z-modal);
    color:#F8FBFF;
    background:linear-gradient(135deg,var(--brand-navy-soft),var(--brand-blue));
    border:1px solid color-mix(in srgb,#F8FBFF 28%,transparent);
  }
  html[dir="rtl"] body.portal-shell.rekaz-theme-active .mobile-nav-toggle{
    inset-inline-start:auto;
    inset-inline-end:12px;
  }
}

@media (max-width: 760px){
  body.auth-shell .login-page{
    display:block;
    min-height:100vh;
    overflow:auto;
    background:#F8FAFC;
  }
  body.auth-shell .login-visual{
    min-height:280px;
    padding:28px 22px;
  }
  body.auth-shell .login-hero-copy h1{
    font-size:clamp(34px,12vw,52px);
  }
  body.auth-shell .login-hero-copy span{
    font-size:22px;
  }
  body.auth-shell .login-panel{
    min-height:auto;
    padding:34px 20px 48px;
  }
  body.auth-shell .language-pill{
    margin-bottom:26px;
  }
}

/* ================================================================
   Direction correctness - override bundle hardcoded direction:rtl
   ================================================================ */

/* Fix 1: layout grid and its children must follow page direction.
   bundle.css forces direction:rtl on .portal-shell .layout and
   .portal-shell .layout > * regardless of html[dir], which breaks
   English (LTR) pages by keeping the grid and all content in RTL. */
html[dir="ltr"] .portal-shell .layout{
  direction:ltr;
}
html[dir="ltr"] .portal-shell .layout > *{
  direction:ltr;
}
/* Same guard for portal-shell.rekaz-theme-active variant */
html[dir="ltr"] body.portal-shell.rekaz-theme-active .layout{
  direction:ltr;
}
html[dir="ltr"] body.portal-shell.rekaz-theme-active .layout > *{
  direction:ltr;
}

/* Fix 2: login panel direction must follow page direction.
   bundle.css hardcodes direction:rtl on .login-panel; in English
   mode inputs and labels would be right-aligned. */
html[dir="ltr"] body.auth-shell .login-panel{
  direction:ltr;
}

/* Fix 3: auth-shell login page background gradient - for RTL the
   dark brand side should be on the visual-right (inline-start). */
html[dir="rtl"] body.auth-shell{
  background:linear-gradient(270deg,var(--brand-navy) 0%,var(--brand-navy-soft) 52%,#F5F9FF 52%,#F8FAFC 100%);
}

/* =====================================================================
   Phase 5 stabilization - approved Rekaz UI contract
   Legacy rekaz selectors are aliases only; new markup should use
   rekaz-* names while old phase CSS continues to render safely.
   ===================================================================== */
:root{
  --font-family:var(--rekaz-font-family);
}

body.rekaz-theme-active,
body.rekaz-theme-active :where(button,input,select,textarea){
  font-family:var(--rekaz-font-family);
  letter-spacing:0;
}

body.rekaz-theme-active :where(h1,h2,h3,h4,h5,h6,.metric,.kpi,.header-brand-title,.topbar h1,.rekaz-page-head h1,.rekaz-page-header h1){
  letter-spacing:0;
}

body.portal-shell.rekaz-theme-active :where(.rekaz-global-header,.rekaz-global-header){
  background:var(--shell-header-bg);
}

body.portal-shell.rekaz-theme-active :where(.rekaz-sidebar,.rekaz-sidebar)#portal-sidebar{
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
}

body.portal-shell.rekaz-theme-active :where(.rekaz-school-card,.rekaz-school-card),
body.portal-shell.rekaz-theme-active :where(.rekaz-page-header,.rekaz-page-head),
body.portal-shell.rekaz-theme-active :where(.rekaz-page-intro,.rekaz-page-intro),
body.portal-shell.rekaz-theme-active :where(.rekaz-stat-tile,.rekaz-stat-tile){
  border-radius:var(--shell-radius-card,18px);
}

body.portal-shell.rekaz-theme-active :where(.rekaz-page-header,.rekaz-page-head){
  color:var(--text-main,#2D3748);
  background:#F8FBFF;
  border:1px solid #E5EDF7;
  box-shadow:0 14px 32px color-mix(in srgb,var(--brand-navy) 7%,transparent);
  padding:18px;
}

body.portal-shell.rekaz-theme-active :where(.rekaz-page-header,.rekaz-page-head) h1{
  margin:0;
  color:var(--text-strong,#0F172A);
}

body.portal-shell.rekaz-theme-active :where(.rekaz-page-header,.rekaz-page-head) p{
  margin:.35rem 0 0;
  color:var(--text-calm,#5F6B7A);
}


/* Phase37 font contract */
/* Phase37 typography and direction governance */
code,
pre,
kbd,
samp,
.code-block {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
}

.rekaz-dir-rtl,
[dir="rtl"] {
  direction: rtl;
  text-align: start;
}

.rekaz-dir-ltr,
[dir="ltr"] {
  direction: ltr;
  text-align: start;
}

[dir="rtl"] .rekaz-sidebar,
.rekaz-dir-rtl .rekaz-sidebar {
  inset-inline-start: 0;
  inset-inline-end: auto;
}

[dir="ltr"] .rekaz-sidebar,
.rekaz-dir-ltr .rekaz-sidebar {
  inset-inline-start: 0;
  inset-inline-end: auto;
}

/* Phase37: explicit directional shell contracts. */
.rekaz-dir-rtl,
[dir="rtl"] .rekaz-shell,
html[dir="rtl"] body.rekaz-theme-active {
  direction:rtl;
  text-align:start;
}
.rekaz-dir-ltr,
[dir="ltr"] .rekaz-shell,
html[dir="ltr"] body.rekaz-theme-active {
  direction:ltr;
  text-align:start;
}
[dir="rtl"] .rekaz-sidebar {
  inset-inline-start:0;
  inset-inline-end:auto;
}
[dir="ltr"] .rekaz-sidebar {
  inset-inline-start:0;
  inset-inline-end:auto;
}
[dir] :where(.rekaz-table th,.rekaz-table td,.table th,.table td,.filters,.actions,.btn-row) {
  text-align:start;
}


/* Phase37: single runtime typography contract. */
html,
body,
button,
input,
select,
textarea,
table,
.card,
.rekaz-shell,
.rekaz-page,
.rekaz-sidebar,
.rekaz-header,
.rekaz-table,
.rekaz-form,
.rekaz-btn{
  font-family:var(--rekaz-font-family);
}
code,pre,kbd,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;}
.rekaz-dir-rtl,[dir="rtl"]{direction:rtl;text-align:start;}
.rekaz-dir-ltr,[dir="ltr"]{direction:ltr;text-align:start;}
[dir="rtl"] .rekaz-sidebar,[dir="rtl"] #portal-sidebar{inset-inline-start:0;inset-inline-end:auto;}
[dir="ltr"] .rekaz-sidebar,[dir="ltr"] #portal-sidebar{inset-inline-start:0;inset-inline-end:auto;}

/* Phase37 RTL/LTR alignment contract. */
.rekaz-dir-rtl,[dir="rtl"] .rekaz-shell,[dir="rtl"] body{direction:rtl;text-align:start;}
.rekaz-dir-ltr,[dir="ltr"] .rekaz-shell,[dir="ltr"] body{direction:ltr;text-align:start;}
[dir="rtl"] .rekaz-sidebar{inset-inline-start:0;inset-inline-end:auto;}
[dir="ltr"] .rekaz-sidebar{inset-inline-start:0;inset-inline-end:auto;}
[dir="rtl"] .table,[dir="ltr"] .table,[dir="rtl"] .rekaz-table,[dir="ltr"] .rekaz-table{text-align:start;}
[dir="rtl"] .breadcrumb,[dir="ltr"] .breadcrumb,[dir="rtl"] .header-breadcrumb,[dir="ltr"] .header-breadcrumb{direction:inherit;}


/* Phase37: unified Droid Arabic Kufi runtime font contract. */
html,
body,
button,
input,
select,
textarea,
table,
.card,
.rekaz-shell,
.rekaz-page,
.rekaz-sidebar,
.rekaz-header,
.rekaz-table,
.rekaz-form,
.rekaz-btn {
  font-family:var(--rekaz-font-family)!important;
}
code,pre,kbd,samp,.ltr,[dir="ltr"] code,[dir="ltr"] pre{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
}
.rekaz-dir-rtl,[dir="rtl"]{direction:rtl;text-align:start;}
.rekaz-dir-ltr,[dir="ltr"]{direction:ltr;text-align:start;}
[dir="rtl"] .rekaz-sidebar{inset-inline-start:0;inset-inline-end:auto;}
[dir="ltr"] .rekaz-sidebar{inset-inline-start:0;inset-inline-end:auto;}
.rekaz-stack{display:grid;gap:var(--rekaz-space-3);}
.rekaz-stack-padded{display:grid;gap:var(--rekaz-space-3);padding:var(--rekaz-space-4);}
.rekaz-stack-padded-lg{display:grid;gap:14px;padding:18px;}
.rekaz-inline{display:flex;gap:var(--rekaz-space-2);align-items:center;flex-wrap:wrap;}
.rekaz-inline-padded{display:flex;gap:var(--rekaz-space-2);align-items:center;flex-wrap:wrap;padding:var(--rekaz-space-4);}
.rekaz-inline-end{display:flex;gap:var(--rekaz-space-2);align-items:center;justify-content:flex-end;flex-wrap:wrap;}
.rekaz-inline-end-padded{display:flex;gap:var(--rekaz-space-2);justify-content:flex-end;flex-wrap:wrap;padding:var(--rekaz-space-4);}
.rekaz-filter-padded{padding:0 var(--rekaz-space-4) var(--rekaz-space-4);}
.rekaz-mt-2{margin-top:var(--rekaz-space-2)!important;}
.rekaz-mt-3{margin-top:var(--rekaz-space-3)!important;}
.rekaz-mb-4{margin-bottom:var(--rekaz-space-4)!important;}
.rekaz-grid-one{grid-template-columns:1fr!important;}
.rekaz-textarea-tall{min-height:130px;}
.rekaz-textarea-xl{min-height:150px;}
.rekaz-code-scroll{white-space:pre-wrap;max-height:340px;overflow:auto;}
.rekaz-input-xs{inline-size:110px;}
.rekaz-progress-fill,.progress-fill,.cl35-progress-fill,.cl36-progress-fill,.cl35-score-fill,.experience-progress i,.progress span{inline-size:var(--progress,0%);width:var(--progress,0%);}
.rekaz-form-inline,.inline-form{display:inline-flex;align-items:center;gap:var(--rekaz-space-2);flex-wrap:wrap;}
