/* Gestema Academy - blue menu and clear workspace layer - 2026-05-07 */
:root{
  --ga-navy:#07264b;
  --ga-navy-2:#061a35;
  --ga-navy-3:#0b315f;
  --ga-gold:#d8ae34;
  --ga-gold-2:#f2c94c;
  --ga-bg:#f4f7fb;
  --ga-bg-2:#eef3f8;
  --ga-card:#ffffff;
  --ga-card-2:#f8fafc;
  --ga-border:#dbe4ee;
  --ga-border-2:#c8d5e4;
  --ga-text:#102033;
  --ga-muted:#5f7087;
  --ga-muted-2:#7b8aa0;
  --ga-shadow:0 16px 36px rgba(7,38,75,.08);
}

body{
  background:var(--ga-bg)!important;
  color:var(--ga-text)!important;
}

#screen-app,
.app-layout,
.main,
.content{
  background:var(--ga-bg)!important;
  color:var(--ga-text)!important;
}

.content{
  background:
    radial-gradient(circle at 8% 0%, rgba(216,174,52,.08), transparent 28%),
    linear-gradient(180deg,#f8fbff 0%,var(--ga-bg) 34%,#eef4fb 100%)!important;
}

/* Keep the Academy menu clearly separated and institutional. */
.sidebar{
  background:linear-gradient(180deg,var(--ga-navy-2) 0%,#071d3a 52%,#05152b 100%)!important;
  border-right:1px solid rgba(255,255,255,.08)!important;
  box-shadow:none!important;
}
.sidebar-logo{
  background:rgba(255,255,255,.035)!important;
  border-bottom:1px solid rgba(255,255,255,.10)!important;
}
.s-logo-icon{
  background:rgba(216,174,52,.16)!important;
  border:1px solid rgba(216,174,52,.46)!important;
  box-shadow:none!important;
  color:var(--ga-gold-2)!important;
}
.s-logo-text{color:#fff!important}
.s-logo-text small{color:rgba(255,255,255,.62)!important}
.nav-section{color:rgba(255,255,255,.45)!important}
.nav-item{
  color:rgba(255,255,255,.72)!important;
  background:transparent!important;
}
.nav-item:hover{
  background:rgba(255,255,255,.08)!important;
  color:#fff!important;
  transform:translateX(2px);
}
.nav-item.active{
  background:rgba(216,174,52,.16)!important;
  color:#fff!important;
  border-radius:12px!important;
  box-shadow:inset 3px 0 0 var(--ga-gold)!important;
}
.nav-divider{background:rgba(255,255,255,.10)!important}
.sidebar-user{border-top:1px solid rgba(255,255,255,.10)!important}
.user-card{background:rgba(255,255,255,.08)!important}
.user-card:hover{background:rgba(255,255,255,.12)!important}
.user-name{color:#fff!important}
.user-role{color:rgba(255,255,255,.62)!important}

.topbar{
  background:rgba(255,255,255,.94)!important;
  border-bottom:1px solid var(--ga-border)!important;
  box-shadow:0 10px 24px rgba(7,38,75,.06)!important;
  backdrop-filter:blur(16px)!important;
}
.topbar-title,
.topbar-title span{
  color:var(--ga-navy)!important;
}
.topbar-search{
  background:var(--ga-card-2)!important;
  border:1px solid var(--ga-border)!important;
  box-shadow:none!important;
}
.topbar-search input{color:var(--ga-text)!important}

/* Shared content surfaces. */
.card,
.chart-card,
.stat-card,
.settings-section,
.gdpr-section,
.verify-card,
.ticket-admin-row,
.ticket-list-item,
.pricing-card,
.aff-stat,
.progress-hero,
.module-item,
.cert-gallery-card,
.checkout-step,
.checkout-summary,
.notes-panel{
  background:var(--ga-card)!important;
  border:1px solid var(--ga-border)!important;
  box-shadow:var(--ga-shadow)!important;
  color:var(--ga-text)!important;
}
.card:hover,
.course-card:hover,
.module-item:hover,
.ticket-admin-row:hover,
.ticket-list-item:hover{
  background:#fff!important;
  border-color:rgba(216,174,52,.44)!important;
}

.page-header h1,
.page-header h1 span,
.card-title,
.chart-title,
.section-title,
.soft-entry-panel-title,
.module-item-title,
.settings-section-title,
.pricing-name,
.cert-gallery-title,
.progress-hero-title,
.ticket-admin-subject,
.lb-name,
.course-name{
  color:var(--ga-navy)!important;
}
.page-header p,
.soft-entry-panel-copy,
.course-description,
.course-meta,
.course-meta span,
.stat-label,
.stat-sub,
.module-item-desc,
.pricing-desc,
.pricing-features li,
.gdpr-section p,
.ticket-admin-body,
.ticket-admin-meta,
.activity-text,
.account-avatar-wrap,
.progress-hero-sub,
.review-text,
.cert-gallery-date{
  color:var(--ga-muted)!important;
}
.eyebrow,
.page-header .eyebrow,
.soft-entry-panel-head .eyebrow,
.catalog-kicker,
.my-courses-kicker,
.reading-kicker,
.section-eyebrow,
.stat-sub{
  color:#9b7413!important;
}

.soft-entry-panel{
  background:linear-gradient(135deg,#fffdf7 0%,#ffffff 62%,#f3f7fb 100%)!important;
  border:1px solid rgba(216,174,52,.30)!important;
  box-shadow:var(--ga-shadow)!important;
}
.soft-entry-pill,
.badge,
.chip{
  background:#f5f8fb!important;
  border:1px solid var(--ga-border)!important;
  color:var(--ga-navy)!important;
}
.chip.active,
.btn-accent,
.auth-tab.active{
  background:var(--ga-gold)!important;
  color:#1b2430!important;
  border-color:var(--ga-gold)!important;
}
.btn-outline,
.btn-ghost{
  background:#fff!important;
  border:1px solid var(--ga-border-2)!important;
  color:var(--ga-navy)!important;
}
.btn-outline:hover,
.btn-ghost:hover{
  border-color:var(--ga-gold)!important;
  color:var(--ga-navy)!important;
  background:#fff9e8!important;
}

/* Dashboard and catalog blocks. */
.welcome-hero,
.catalog-hero,
.my-courses-hero,
.player-course-hero{
  background:linear-gradient(135deg,#ffffff 0%,#f7fbff 54%,#edf4fb 100%)!important;
  border:1px solid var(--ga-border)!important;
  box-shadow:var(--ga-shadow)!important;
}
.welcome-hero::before,
.catalog-hero::before,
.catalog-hero::after,
.my-courses-hero::before,
.player-course-hero::before{
  opacity:.35!important;
}
.welcome-hero-text h2,
.welcome-hero-text h2 em,
.welcome-hero-text p,
.welcome-hero-eyebrow,
.welcome-hero-standing-label,
.welcome-hero-standing-val,
.catalog-title,
.catalog-title em,
.catalog-subtitle,
.catalog-metric-label,
.catalog-metric-value,
.catalog-metric-note,
.my-courses-title,
.my-courses-subtitle,
.my-courses-summary-label,
.my-courses-summary-value,
.my-courses-summary-note,
.player-course-hero-title,
.player-course-hero-summary,
.player-course-kicker,
.player-course-pill,
.player-course-sidecard-label,
.player-course-sidecard-value{
  color:var(--ga-navy)!important;
}
.catalog-metric,
.my-courses-summary-card,
.player-course-pill,
.player-course-sidecard{
  background:#fff!important;
  border:1px solid var(--ga-border)!important;
}

.courses-grid{gap:22px!important}
.course-card{
  background:#fff!important;
  border:1px solid var(--ga-border)!important;
  box-shadow:0 14px 32px rgba(7,38,75,.08)!important;
}
.course-thumb{background:#e8eef6!important}
.course-thumb::after{
  background:linear-gradient(to bottom,rgba(255,255,255,0) 40%,rgba(255,255,255,.82) 100%)!important;
}
.course-price{color:#9b7413!important}
.course-trustline{
  color:var(--ga-muted)!important;
  border-top:1px solid var(--ga-border)!important;
}

/* Premium value blocks injected by the commercial Academy layer. */
.ga-premium-value-panel,
.ga-premium-value-panel *{
  color:var(--ga-text)!important;
}
.ga-premium-value-panel{
  background:linear-gradient(135deg,#fffdf8 0%,#ffffff 62%,#f3f7fb 100%)!important;
  border:1px solid rgba(216,174,52,.28)!important;
  box-shadow:var(--ga-shadow)!important;
}
.ga-premium-value-title,
.ga-premium-value-panel h2,
.ga-premium-value-panel h3{
  color:var(--ga-navy)!important;
}
.ga-premium-value-copy,
.ga-premium-value-panel p,
.ga-premium-value-panel li{
  color:var(--ga-muted)!important;
}
.ga-premium-value-kicker,
.ga-premium-value-panel .eyebrow{
  color:#9b7413!important;
}

/* Tools hub, forms and tables. */
.hub-view-container,
.hub-controls,
.tool-card,
.tool-grid .tool-card{
  color:var(--ga-text)!important;
}
.hub-controls,
.tool-card{
  background:#fff!important;
  border-color:var(--ga-border)!important;
}
.hub-search input,
.form-input,
.notes-textarea,
.form-select,
select.form-input{
  background:#fff!important;
  border:1px solid var(--ga-border)!important;
  color:var(--ga-text)!important;
}
.form-input::placeholder,
.notes-textarea::placeholder{color:var(--ga-muted-2)!important}
.form-label{color:var(--ga-navy)!important}
.data-table th{
  background:#f4f8fc!important;
  color:var(--ga-navy)!important;
  border-bottom:1px solid var(--ga-border)!important;
}
.data-table td{
  color:var(--ga-text)!important;
  border-bottom:1px solid var(--ga-border)!important;
}

/* Lesson player: keep study navigation legible, but make reading area clear. */
.player-topbar{
  background:rgba(255,255,255,.94)!important;
  border-bottom:1px solid var(--ga-border)!important;
  box-shadow:0 10px 22px rgba(7,38,75,.06)!important;
}
.player-topbar-btn{
  background:#fff!important;
  border:1px solid var(--ga-border)!important;
  color:var(--ga-navy)!important;
}
.player-topbar-btn.primary{
  background:var(--ga-gold)!important;
  color:#1b2430!important;
}
.player-topbar-pct{color:#9b7413!important}
.player-body{background:var(--ga-bg)!important}
.syllabus-wrap{
  background:#fff!important;
  border-right:1px solid var(--ga-border)!important;
}
.syllabus-header,
.notes-header{
  background:#f6f9fc!important;
  border-bottom:1px solid var(--ga-border)!important;
}
.lesson-content-box,
.reading-tab-body,
.rich-tabs,
.rich-tab-body{
  background:#fff!important;
  border:1px solid var(--ga-border)!important;
  color:var(--ga-text)!important;
  box-shadow:var(--ga-shadow)!important;
}
.lesson-content-box h3,
.lesson-content-box p,
.lesson-content-box div,
.reading-title,
.reading-subtitle,
.reading-pill,
.rich-tab-body,
.rich-tab-body em{
  color:var(--ga-text)!important;
}
.reading-header{
  border-bottom:1px solid var(--ga-border)!important;
}
.video-box,
.lesson-reading-stage{
  background:linear-gradient(135deg,var(--ga-navy) 0%,#0e3a6b 100%)!important;
}

/* Auth screen remains premium, but with cleaner right panel. */
.auth-right{background:var(--ga-navy-2)!important}
.auth-box{background:rgba(255,255,255,.06)!important}

@media(max-width:768px){
  .sidebar{box-shadow:18px 0 38px rgba(5,21,43,.26)!important}
  .content{padding:16px!important}
  .topbar{
    background:#fff!important;
    height:60px!important;
    min-height:60px!important;
    padding:0 12px!important;
    align-items:center!important;
    overflow:hidden!important;
  }
  .topbar-title{
    font-family:'Inter',sans-serif!important;
    font-size:15px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    min-width:0!important;
  }
  #sidebar-toggle{
    color:var(--ga-navy)!important;
    width:32px!important;
    height:40px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
}