/* The Quran Tuition — Premium Ever Theme Integrity Layer v18.8.0
   Loaded after v18.7 and before administrator CSS variables.
   Goals:
   - eliminate hard-coded light-surface remnants that can pair white text with white cards;
   - keep every semantic surface readable under custom light or dark palettes;
   - preserve existing layout/functionality while adding a refined visual finish;
   - style the expanded coloured inline-SVG decoration system from v18.8 JS.
*/

:root {
  --pe-shadow-1: 0 8px 24px rgba(7,31,48,.07);
  --pe-shadow-2: 0 18px 48px rgba(7,31,48,.11);
  --pe-shadow-3: 0 30px 80px rgba(7,31,48,.16);
  --pe-glass-line: rgba(255,255,255,.17);
  --pe-glass-fill: rgba(255,255,255,.09);
}

/* --------------------------------------------------------------------------
   1) Absolute semantic canvas safety
   -------------------------------------------------------------------------- */
html,
body.public-body,
body.admin-body,
body.portal-body,
.admin-shell,
.portal-shell,
.admin-main,
.portal-content,
.admin-content {
  background-color: var(--theme-body-bg) !important;
}

body.public-body,
body.admin-body,
body.portal-body,
.admin-content,
.portal-content {
  color: var(--theme-body-text) !important;
}

body.public-body :is(h1,h2,h3,h4,h5,h6),
body.admin-body :is(h1,h2,h3,h4,h5,h6),
body.portal-body :is(h1,h2,h3,h4,h5,h6) {
  color: var(--theme-body-heading) !important;
}

body.public-body :is(.muted,.form-hint,.field-help,.form-help,.panel-head p,.admin-page-head p,.section-heading p),
body.admin-body :is(.muted,.form-hint,.field-help,.form-help,.panel-head p,.admin-page-head p,.section-heading p),
body.portal-body :is(.muted,.form-hint,.field-help,.form-help,.panel-head p,.admin-page-head p,.section-heading p) {
  color: var(--theme-body-muted) !important;
}

/* Links must never inherit an old hard-coded teal that disappears on a dark body. */
body.public-body main a:not(.btn):not(.text-arrow):not([class*="status-"]),
body.admin-body .admin-content a:not(.btn):not(.text-arrow):not([class*="status-"]),
body.portal-body .portal-content a:not(.btn):not(.text-arrow):not([class*="status-"]) {
  color: var(--theme-body-heading);
}

/* --------------------------------------------------------------------------
   2) Hard reset of legacy white card backgrounds
   The background shorthand intentionally clears v18.5/v18.6 !important
   gradients such as linear-gradient(#fff,#fff) on feature cards.
   -------------------------------------------------------------------------- */
.public-body :is(
  .feature-card,.course-card,.teacher-card,.blog-card,.price-card,.testimonial,.testimonial-card,
  .content-card,.form-card,.auth-card,.contact-panel,.aside-panel,.note-card,.notice-card,
  .trial-policy-card,.invoice-card,.premium-choice-panel,.split-callout,.premium-split-callout,
  .article-share,.faq-card,.method-card,.process-card,.course-summary:not(.hero .course-summary)
),
.admin-body :is(
  .admin-panel,.detail-card,.admin-stat-card,.statistics-card,.admin-form,.form-card,.settings-nav,
  .maintenance-action-card,.maintenance-manual-card,.maintenance-section,.health-summary-card,
  .danger-zone,.notice-card,.admin-filterbar,.file-current,.search-field
),
.portal-body :is(
  .admin-panel,.detail-card,.admin-stat-card,.statistics-card,.admin-form,.form-card,.invoice-card,
  .note-card,.notice-card,.ticket-message,.opening-message,.admin-filterbar,.file-current,.search-field
) {
  color: var(--theme-surface-text) !important;
  background: var(--theme-surface) !important;
  border-color: var(--line) !important;
}

/* Legacy gradient specifically responsible for light-card/dark-text mismatch. */
.public-body .feature-card {
  background-image: none !important;
  border-top: 3px solid var(--gold) !important;
}

/* Reset fixed white page-head/table gradients from earlier releases. */
.admin-page-head,
.portal-body .admin-page-head,
.admin-table-wrap,
.portal-table-wrap,
.responsive-table,
.maintenance-table-wrap,
.admin-table,
.portal-table,
.maintenance-table,
.responsive-table table {
  color: var(--theme-surface-text) !important;
  background: var(--theme-surface) !important;
  border-color: var(--line) !important;
}

/* Every surface gets surface-specific typography, including less common pages. */
.public-body :is(
  .feature-card,.course-card,.teacher-card,.blog-card,.price-card,.testimonial,.testimonial-card,
  .content-card,.form-card,.auth-card,.contact-panel,.aside-panel,.note-card,.notice-card,
  .trial-policy-card,.invoice-card,.premium-choice-panel,.split-callout,.premium-split-callout,.article-share
) :is(h1,h2,h3,h4,h5,h6,strong:not([class*="status-"])),
.admin-body :is(
  .admin-panel,.detail-card,.admin-stat-card,.statistics-card,.admin-form,.form-card,.settings-nav,
  .maintenance-action-card,.maintenance-manual-card,.maintenance-section,.health-summary-card,.danger-zone,.notice-card
) :is(h1,h2,h3,h4,h5,h6,strong:not([class*="status-"])),
.portal-body :is(
  .admin-panel,.detail-card,.admin-stat-card,.statistics-card,.admin-form,.form-card,.invoice-card,
  .note-card,.notice-card,.ticket-message,.opening-message
) :is(h1,h2,h3,h4,h5,h6,strong:not([class*="status-"])) {
  color: var(--theme-surface-heading) !important;
}

.public-body :is(
  .feature-card,.course-card,.teacher-card,.blog-card,.price-card,.testimonial,.testimonial-card,
  .content-card,.form-card,.auth-card,.contact-panel,.aside-panel,.note-card,.notice-card,
  .trial-policy-card,.invoice-card,.premium-choice-panel,.split-callout,.premium-split-callout,.article-share
) :is(p,li,small,.muted,.form-hint,.field-help,.form-help),
.admin-body :is(
  .admin-panel,.detail-card,.admin-stat-card,.statistics-card,.admin-form,.form-card,.settings-nav,
  .maintenance-action-card,.maintenance-manual-card,.maintenance-section,.health-summary-card,.danger-zone,.notice-card
) :is(p,li,small,.muted,.form-hint,.field-help,.form-help),
.portal-body :is(
  .admin-panel,.detail-card,.admin-stat-card,.statistics-card,.admin-form,.form-card,.invoice-card,
  .note-card,.notice-card,.ticket-message,.opening-message
) :is(p,li,small,.muted,.form-hint,.field-help,.form-help) {
  color: var(--theme-surface-muted) !important;
}

/* Nested card/body text must not fall back to v18.5 fixed slate colours. */
.public-body :is(.card-body,.teacher-card-body,.rich-content,.cms-content,.article-content) {
  color: inherit;
}
.public-body :is(.course-card,.blog-card,.teacher-card,.feature-card,.price-card) .card-body :is(h2,h3,h4,strong) {
  color: var(--theme-surface-heading) !important;
}
.public-body :is(.course-card,.blog-card,.teacher-card,.feature-card,.price-card) .card-body :is(p,small,.muted) {
  color: var(--theme-surface-muted) !important;
}

/* --------------------------------------------------------------------------
   3) Soft/ivory surfaces
   -------------------------------------------------------------------------- */
.section-ivory,
.pricing-light,
.permission-row,
.quick-actions a,
.calendar-weekday,
.admin-table th,
.portal-table th,
.maintenance-table th,
.responsive-table th {
  color: var(--theme-soft-text) !important;
  background: var(--ivory) !important;
  border-color: var(--line) !important;
}

.section-ivory :is(h1,h2,h3,h4,h5,h6,strong),
.pricing-light :is(h1,h2,h3,h4,h5,h6,strong),
.permission-row strong,
.admin-table th,
.portal-table th,
.maintenance-table th,
.responsive-table th {
  color: var(--theme-soft-heading) !important;
}

.section-ivory :is(p,li,small,.muted,.section-heading p),
.pricing-light :is(p,li,small,.muted,.section-heading p),
.permission-row small {
  color: var(--theme-soft-muted) !important;
}

/* Zebra rows use transparent/soft surfaces, never a fixed white shade. */
.admin-table tbody tr:nth-child(even),
.portal-table tbody tr:nth-child(even),
.maintenance-table tbody tr:nth-child(even) {
  background: transparent !important;
}
.admin-table tbody tr:hover,
.portal-table tbody tr:hover,
.maintenance-table tbody tr:hover {
  background: var(--ivory) !important;
}

/* --------------------------------------------------------------------------
   4) Dark/hero surfaces — use one guaranteed contrast base colour.
   Decorative gradients live in pseudo-elements rather than changing the
   semantic background used by the PHP contrast calculation.
   -------------------------------------------------------------------------- */
.hero,
.page-hero,
.course-hero,
.article-hero,
.trial-page-hero,
.premium-page-hero,
.section-navy,
.final-cta,
.maintenance-hero {
  color: var(--theme-on-hero) !important;
  background: var(--navy) !important;
  border-color: rgba(255,255,255,.14) !important;
}

.hero :is(h1,h2,h3,h4,h5,h6,strong,b),
.page-hero :is(h1,h2,h3,h4,h5,h6,strong,b),
.course-hero :is(h1,h2,h3,h4,h5,h6,strong,b),
.article-hero :is(h1,h2,h3,h4,h5,h6,strong,b),
.trial-page-hero :is(h1,h2,h3,h4,h5,h6,strong,b),
.premium-page-hero :is(h1,h2,h3,h4,h5,h6,strong,b),
.section-navy :is(h1,h2,h3,h4,h5,h6,strong,b),
.final-cta :is(h1,h2,h3,h4,h5,h6,strong,b),
.maintenance-hero :is(h1,h2,h3,h4,h5,h6,strong,b,code) {
  color: var(--theme-on-hero) !important;
}

.hero :is(p,li,small,.lead,.muted,.eyebrow),
.page-hero :is(p,li,small,.lead,.muted,.eyebrow),
.course-hero :is(p,li,small,.lead,.muted,.eyebrow),
.article-hero :is(p,li,small,.lead,.muted,.eyebrow),
.trial-page-hero :is(p,li,small,.lead,.muted,.eyebrow),
.premium-page-hero :is(p,li,small,.lead,.muted,.eyebrow),
.section-navy :is(p,li,small,.lead,.muted,.eyebrow),
.final-cta :is(p,li,small,.lead,.muted,.eyebrow),
.maintenance-hero :is(p,li,small,.lead,.muted,.maintenance-kicker) {
  color: var(--theme-on-hero-muted) !important;
}

.hero a:not(.btn),
.page-hero a:not(.btn),
.course-hero a:not(.btn),
.article-hero a:not(.btn),
.trial-page-hero a:not(.btn),
.premium-page-hero a:not(.btn),
.section-navy a:not(.btn),
.final-cta a:not(.btn) {
  color: var(--theme-on-hero) !important;
}

/* Glass content inside dark areas stays glass and readable. */
.hero :is(.hero-card,.hero-card-glass,.course-summary,.statistics-card),
.course-hero :is(.course-summary,.hero-card,.hero-card-glass),
.trial-page-hero :is(.trial-info-panel,.hero-card,.hero-card-glass),
.section-navy :is(.statistics-card,.testimonial,.testimonial-card,.content-card) {
  color: var(--theme-on-hero) !important;
  background: var(--pe-glass-fill) !important;
  border-color: var(--pe-glass-line) !important;
  box-shadow: 0 24px 64px rgba(0,0,0,.18) !important;
  backdrop-filter: blur(16px);
}
.hero :is(.hero-card,.hero-card-glass,.course-summary,.statistics-card) :is(h1,h2,h3,h4,strong,b),
.course-hero :is(.course-summary,.hero-card,.hero-card-glass) :is(h1,h2,h3,h4,strong,b),
.trial-page-hero :is(.trial-info-panel,.hero-card,.hero-card-glass) :is(h1,h2,h3,h4,strong,b),
.section-navy :is(.statistics-card,.testimonial,.testimonial-card,.content-card) :is(h1,h2,h3,h4,strong,b) {
  color: var(--theme-on-hero) !important;
}
.hero :is(.hero-card,.hero-card-glass,.course-summary,.statistics-card) :is(p,li,small,.muted),
.course-hero :is(.course-summary,.hero-card,.hero-card-glass) :is(p,li,small,.muted),
.trial-page-hero :is(.trial-info-panel,.hero-card,.hero-card-glass) :is(p,li,small,.muted),
.section-navy :is(.statistics-card,.testimonial,.testimonial-card,.content-card) :is(p,li,small,.muted) {
  color: var(--theme-on-hero-muted) !important;
}

/* --------------------------------------------------------------------------
   5) Header, menus, sidebars and footer — exact background/text pairing
   -------------------------------------------------------------------------- */
.topbar {
  color: var(--theme-topbar-text) !important;
  background: var(--theme-topbar-bg) !important;
}
.topbar :is(a,span,small) { color: var(--theme-topbar-text) !important; }

.site-header {
  color: var(--theme-header-text) !important;
  background: var(--theme-header-bg) !important;
  border-color: var(--theme-header-border) !important;
}
.site-header :is(.brand strong,.site-nav > .nav-item > a,.text-link,.nav-logout) { color: var(--theme-header-text) !important; }
.site-header .brand small { color: var(--theme-header-muted) !important; }

.nav-submenu,
.header-more-menu,
body.public-nav-open .site-nav,
.site-nav.open,
.site-nav.is-open {
  color: var(--theme-surface-text) !important;
  background: var(--theme-surface) !important;
  border-color: var(--line) !important;
}
.nav-submenu a,
.header-more-links a,
body.public-nav-open .site-nav a,
.site-nav.open a,
.site-nav.is-open a {
  color: var(--theme-surface-text) !important;
}
.nav-submenu a:hover,
.header-more-links a:hover,
body.public-nav-open .site-nav a:hover,
.site-nav.open a:hover,
.site-nav.is-open a:hover {
  color: var(--theme-soft-heading) !important;
  background: var(--ivory) !important;
}

.header-more-heading {
  color: var(--theme-on-hero) !important;
  background: var(--navy) !important;
}
.header-more-heading :is(span,small,strong) { color: var(--theme-on-hero) !important; }

.nav-toggle,
.header-more-toggle {
  color: var(--theme-header-text) !important;
  background: var(--theme-header-bg) !important;
  border-color: var(--theme-header-border) !important;
}

.admin-sidebar,
.portal-sidebar {
  color: var(--theme-sidebar-text) !important;
  background: var(--theme-sidebar-bg) !important;
  border-color: rgba(255,255,255,.10) !important;
}
.admin-brand :is(a,b,strong),
.portal-sidebar .admin-brand :is(a,b,strong),
.sidebar-user strong,
.admin-nav .nav-group-toggle,
.admin-nav .nav-group-links a,
.portal-sidebar .admin-nav > a {
  color: var(--theme-sidebar-text) !important;
}
.admin-brand small,.sidebar-user small { color: var(--theme-sidebar-muted) !important; }
.admin-nav .nav-group-links a.active,
.portal-sidebar .admin-nav > a.active {
  color: var(--theme-sidebar-active-text) !important;
  background: var(--theme-sidebar-active-bg) !important;
  border-color: transparent !important;
}
.admin-nav .nav-group-links a:hover,
.portal-sidebar .admin-nav > a:hover,
.admin-nav .nav-group-toggle:hover {
  color: var(--theme-sidebar-text) !important;
  background: rgba(255,255,255,.09) !important;
}
.admin-brand > button {
  color: var(--theme-sidebar-text) !important;
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.14) !important;
}

.admin-topbar,
.portal-topbar,
.sidebar-collapse,
.sidebar-toggle {
  color: var(--theme-surface-heading) !important;
  background: var(--theme-surface) !important;
  border-color: var(--line) !important;
}
.topbar-title strong,.topbar-actions a,.topbar-signout-button { color: var(--theme-surface-heading) !important; }
.topbar-title span { color: var(--theme-surface-muted) !important; }

.site-footer {
  color: var(--theme-footer-text) !important;
  background: var(--theme-footer-bg) !important;
  border-color: rgba(255,255,255,.12) !important;
}
.site-footer :is(h1,h2,h3,h4,h5,h6,strong,.brand-light) { color: var(--theme-footer-link) !important; }
.site-footer :is(p,small,span) { color: var(--theme-footer-text) !important; }
.site-footer a { color: var(--theme-footer-link) !important; }
.site-footer a:hover { color: var(--theme-footer-link) !important; opacity: .84; }

/* --------------------------------------------------------------------------
   6) Forms and controls
   -------------------------------------------------------------------------- */
input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
select,
textarea,
option {
  color: var(--theme-input-text) !important;
  background-color: var(--theme-input-bg) !important;
  border-color: var(--theme-input-border) !important;
}
input::placeholder,textarea::placeholder { color: var(--theme-surface-muted) !important; opacity: .78; }
input:focus,select:focus,textarea:focus {
  border-color: var(--gold) !important;
  box-shadow: 0 0 0 4px rgba(217,180,74,.16) !important;
}
label,legend { color: inherit; }
.theme-color-field output,.file-current,.settings-intro,.smtp-test-result { color: var(--theme-surface-text) !important; }

/* Keep switches intentionally high contrast independent of palette. */
.switch { background: #a8b6bf !important; }
.switch:checked { background: var(--gold) !important; }
.switch::before { background: #fff !important; }

/* --------------------------------------------------------------------------
   7) Buttons and actions
   -------------------------------------------------------------------------- */
.btn-gold,input[type="submit"].btn-gold {
  color: var(--theme-on-accent) !important;
  background: var(--gold) !important;
  border-color: var(--gold) !important;
}
.btn-navy,input[type="submit"].btn-navy {
  color: var(--theme-on-primary) !important;
  background: var(--navy) !important;
  border-color: var(--navy) !important;
}
.btn-outline,.btn-ghost {
  color: var(--theme-surface-heading) !important;
  background: var(--theme-surface) !important;
  border-color: var(--line) !important;
}
.btn-outline:hover,.btn-ghost:hover {
  color: var(--theme-soft-heading) !important;
  background: var(--ivory) !important;
  border-color: var(--line) !important;
}
.btn-outline-light {
  color: var(--theme-on-hero) !important;
  background: transparent !important;
  border-color: currentColor !important;
}
.btn-danger { color:#fff !important; background:var(--danger) !important; border-color:var(--danger) !important; }
.text-arrow { color: var(--theme-body-heading) !important; }
:is(.hero,.page-hero,.course-hero,.article-hero,.trial-page-hero,.premium-page-hero,.section-navy,.final-cta) .text-arrow {
  color: var(--theme-on-hero) !important;
}

/* --------------------------------------------------------------------------
   8) Admin/portal details and less-common components
   -------------------------------------------------------------------------- */
.panel-head { border-color: var(--line) !important; }
.panel-head :is(h2,h3,strong) { color: var(--theme-surface-heading) !important; }
.panel-head p { color: var(--theme-surface-muted) !important; }

.detail-grid dt,.detail-list dt,.invoice-meta dt { color: var(--theme-surface-muted) !important; }
.detail-grid dd,.detail-list dd,.invoice-meta dd { color: var(--theme-surface-text) !important; }
.timeline-list > div,.plain-list li,.module-list li,.lesson-list li,.resource-list li { border-color: var(--line) !important; }
.timeline-list :is(strong,p),.plain-list li,.module-list li,.lesson-list li,.resource-list li { color: var(--theme-surface-text) !important; }
.timeline-list p { color: var(--theme-surface-muted) !important; }

.calendar-day,.slot-choice,.plan-choice {
  color: var(--theme-surface-text) !important;
  background: var(--theme-surface) !important;
  border-color: var(--line) !important;
}
.calendar-day strong,.slot-choice strong,.plan-choice strong { color: var(--theme-surface-heading) !important; }
.calendar-weekday { color: var(--theme-soft-muted) !important; }
.slot-choice.is-selected {
  color: var(--theme-soft-heading) !important;
  background: var(--ivory) !important;
  border-color: var(--gold) !important;
}

.empty-state,.premium-empty-state,.admin-empty,.availability-empty {
  color: var(--theme-surface-text) !important;
  background: var(--theme-surface) !important;
  border-color: var(--line) !important;
}
.empty-state :is(h2,h3,strong),.premium-empty-state :is(h2,h3,strong),.admin-empty :is(h2,h3,strong) { color:var(--theme-surface-heading) !important; }
.empty-state :is(p,small),.premium-empty-state :is(p,small),.admin-empty :is(p,small) { color:var(--theme-surface-muted) !important; }

.settings-nav a { color: var(--theme-surface-text) !important; }
.settings-nav a:hover { color:var(--theme-soft-heading) !important; background:var(--ivory) !important; }
.settings-nav a.active,.pagination a.active {
  color: var(--theme-on-primary) !important;
  background: var(--navy) !important;
  border-color: var(--navy) !important;
}
.pagination a,.file-current,.admin-filterbar,.search-field {
  color:var(--theme-surface-text) !important;
  background:var(--theme-surface) !important;
  border-color:var(--line) !important;
}

/* --------------------------------------------------------------------------
   9) Premium visual refinement without changing layout geometry
   -------------------------------------------------------------------------- */
.public-body :is(.feature-card,.course-card,.teacher-card,.blog-card,.price-card,.testimonial,.testimonial-card,.content-card,.form-card,.contact-panel,.aside-panel),
.admin-body :is(.admin-panel,.detail-card,.admin-stat-card,.statistics-card,.admin-form,.health-summary-card),
.portal-body :is(.admin-panel,.detail-card,.admin-stat-card,.statistics-card,.form-card,.invoice-card) {
  border-radius: var(--theme-radius) !important;
  box-shadow: var(--pe-shadow-1) !important;
}

@media (hover:hover) {
  .public-body :is(.feature-card,.course-card,.teacher-card,.blog-card,.price-card,.testimonial,.testimonial-card):hover,
  .admin-body :is(.admin-panel,.detail-card,.admin-stat-card,.statistics-card):hover,
  .portal-body :is(.admin-panel,.detail-card,.admin-stat-card,.statistics-card):hover {
    transform: translateY(-3px);
    box-shadow: var(--pe-shadow-2) !important;
  }
}

.admin-page-head {
  position: relative;
  overflow: hidden;
  background: var(--theme-surface) !important;
  border: 1px solid var(--line) !important;
  border-left: 5px solid var(--gold) !important;
  box-shadow: var(--pe-shadow-2) !important;
}
.admin-page-head::after {
  content:"";
  position:absolute;
  width:180px;height:180px;
  right:-90px;top:-100px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(217,180,74,.14),transparent 67%);
  pointer-events:none;
}
.admin-page-head > * { position:relative; z-index:1; }

/* Existing coloured SVG system, strengthened for light and dark surfaces. */
.nav-svg-chip,
.trust-svg-icon,
.card-watermark-icon,
.feature-icon,
.section-svg-chip,
.heading-svg-chip,
.footer-heading-svg-chip,
.action-svg-icon-wrap {
  color: var(--icon-tone, var(--gold));
  background: var(--icon-soft, rgba(217,180,74,.13));
  border: 1px solid rgba(127,127,127,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 7px 18px rgba(7,31,48,.07);
}

.section-svg-chip,
.heading-svg-chip,
.footer-heading-svg-chip {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: inline-grid;
  place-items: center;
  border-radius: 11px;
  vertical-align: middle;
}
.section-svg-chip .premium-svg-icon,
.heading-svg-chip .premium-svg-icon,
.footer-heading-svg-chip .premium-svg-icon { width:18px; height:18px; }

/* Public section badges inserted by v18.8 JS. */
.section-heading .premium-section-kicker,
.hero-copy .premium-section-kicker,
.page-hero .premium-section-kicker,
.course-hero .premium-section-kicker,
.article-hero .premium-section-kicker,
.trial-page-hero .premium-section-kicker,
.premium-page-hero .premium-section-kicker {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 10px;
}

.premium-section-kicker .section-svg-chip { width:32px;height:32px;flex-basis:32px; }
.premium-section-kicker .section-svg-chip .premium-svg-icon { width:16px;height:16px; }

/* Heading chips do not disturb existing flex/panel layouts. */
.panel-head h2,
.panel-head h3,
.form-card > h2,
.detail-card > h2,
.health-summary-card > h2,
.footer-grid section > h3,
.footer-grid section > h4 {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.heading-svg-chip { width:30px;height:30px;flex-basis:30px;border-radius:9px; }
.heading-svg-chip .premium-svg-icon { width:15px;height:15px; }
.footer-heading-svg-chip { width:29px;height:29px;flex-basis:29px;border-radius:9px; background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.12); box-shadow:none; }
.site-footer .footer-heading-svg-chip { color:var(--icon-tone,var(--gold)); }

/* Hero/dark SVG chips always use a translucent backing. */
:is(.hero,.page-hero,.course-hero,.article-hero,.trial-page-hero,.premium-page-hero,.section-navy,.final-cta,.maintenance-hero,.site-footer,.admin-sidebar,.portal-sidebar) :is(.section-svg-chip,.heading-svg-chip,.nav-svg-chip,.trust-svg-icon) {
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.14);
  box-shadow: none;
}

/* Feature icons must adapt to the selected surface instead of fixed pale yellow. */
.feature-icon {
  color: var(--icon-tone,var(--theme-surface-heading)) !important;
  background: var(--ivory) !important;
  border-color: var(--line) !important;
}

/* --------------------------------------------------------------------------
   10) Responsive integrity
   -------------------------------------------------------------------------- */
@media (max-width: 1100px) {
  body.public-nav-open .site-nav,
  .site-nav.open,
  .site-nav.is-open {
    background: var(--theme-surface) !important;
    border-left-color: var(--line) !important;
    box-shadow: -20px 0 60px rgba(7,31,48,.22) !important;
  }
}

@media (max-width: 920px) {
  .admin-sidebar.open,.portal-sidebar.open {
    background: var(--theme-sidebar-bg) !important;
    box-shadow: 22px 0 70px rgba(0,0,0,.28) !important;
  }
  .section-svg-chip { width:30px;height:30px;flex-basis:30px; }
}

@media (max-width: 720px) {
  table.responsive-table tr {
    color: var(--theme-surface-text) !important;
    background: var(--theme-surface) !important;
    border-color: var(--line) !important;
  }
  table.responsive-table td::before { color: var(--theme-surface-muted) !important; }
  .panel-head h2,.panel-head h3 { align-items:flex-start; }
  .heading-svg-chip { margin-top:1px; }
}

@media (prefers-reduced-motion: reduce) {
  .public-body *, .admin-body *, .portal-body * {
    scroll-behavior: auto !important;
  }
  .public-body :is(.feature-card,.course-card,.teacher-card,.blog-card,.price-card,.testimonial,.testimonial-card),
  .admin-body :is(.admin-panel,.detail-card,.admin-stat-card,.statistics-card),
  .portal-body :is(.admin-panel,.detail-card,.admin-stat-card,.statistics-card) {
    transition: none !important;
  }
}

/* Print remains intentionally fixed white for legibility and paper output. */
@media print {
  html,body,.premium-print-document,.print-document,.invoice-print {
    color:#1f2937 !important;
    background:#fff !important;
  }
  .section-svg-chip,.heading-svg-chip,.footer-heading-svg-chip,.card-watermark-icon { display:none !important; }
}

/* v18.8 section-completeness fallback: headings without a standard section-heading
   receive an inline chip; visual-only CMS sections receive a faint corner SVG. */
.premium-icon-heading {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.premium-section-corner {
  position: absolute;
  top: 16px;
  right: max(16px, calc((100vw - 1220px) / 2));
  z-index: 1;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  color: var(--icon-tone,var(--gold));
  background: var(--icon-soft,rgba(217,180,74,.12));
  border: 1px solid rgba(127,127,127,.12);
  opacity: .55;
  pointer-events: none;
}
.premium-section-corner .premium-svg-icon { width:20px;height:20px; }
:is(.hero,.page-hero,.course-hero,.article-hero,.trial-page-hero,.premium-page-hero,.section-navy,.final-cta) .premium-section-corner {
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.14);
}
.admin-page-head .premium-section-kicker {
  display:inline-flex;
  align-items:center;
  margin-bottom:10px;
}
@media (max-width:720px) {
  .premium-section-corner { right:14px;top:14px;width:34px;height:34px; }
  .premium-section-corner .premium-svg-icon { width:17px;height:17px; }
}
.public-body main section.premium-section-has-corner { position: relative; }