/* Modern App Shell Enhancements for AIREP */
:root {
  --shell-bg: var(--color-bg-base,#14161a);
  --shell-bg-accent: var(--color-bg-surface,#1e2127);
  --shell-border: var(--color-border,#2b3036);
  --shell-border-strong: color-mix(in srgb, var(--color-border,#2b3036) 85%, #ffffff);
  --shell-text: var(--color-fg-primary,#f5f7fa);
  --shell-text-dim: var(--color-fg-secondary,#b2b8c2);
  --shell-primary: var(--color-accent,#3d7eff);
  --shell-primary-rgb: 61 126 255; /* keep raw RGB for alpha usages */
  --shell-primary-accent: var(--color-accent-alt,#6aa4ff);
  --shell-danger: var(--color-danger,#ef476f);
  --shell-warning: var(--color-warning,#ffd166);
  --shell-success: var(--color-success,#06d6a0);
  --grad-1: linear-gradient(145deg,#1e2530,#161a20 60%); /* base panels */
  --blur: 8px;
  --transition: 140ms cubic-bezier(.4,.0,.2,1);
  --radius: 14px;
  --focus-ring: 0 0 0 2px rgba(var(--shell-primary-rgb)/.5);
}

body.app-body { background: radial-gradient(circle at 25% 15%, var(--color-bg-alt,#1d2530), var(--color-bg-base,#121417) 60%) fixed; color: var(--shell-text); font-feature-settings: "calt" 1, "ss01" 1; }
html[data-theme='light'] body.app-body { background: radial-gradient(circle at 25% 15%, var(--color-bg-base,#f2f6fb), var(--color-bg-alt,#dde3ea) 60%) fixed; color:var(--color-fg-primary,#1e252c); }

/* Sidebar */
.app-sidebar { width: 250px; background: var(--grad-1); border-right: 1px solid var(--shell-border); backdrop-filter: blur(var(--blur)); -webkit-backdrop-filter: blur(var(--blur)); position: sticky; top:0; height:100dvh; z-index: 1030; transition: width var(--transition); background-color: var(--shell-bg-accent); }
html[data-theme='light'] .app-sidebar { background:linear-gradient(145deg,var(--color-bg-surface,#ffffff),var(--color-bg-alt,#eef2f7) 60%); border-right:1px solid var(--color-border,#d5dbe2); }
.sidebar-collapsed .app-sidebar { width: 84px; }
.sidebar-collapsed .app-sidebar .logo-text { display:none; }
.sidebar-collapsed .app-sidebar .app-nav-list .nav-link .nav-label { opacity:0; width:0; overflow:hidden; }
.sidebar-collapsed .app-sidebar .accordion-toggle .rotate-icon { display:none; }
.sidebar-collapsed .app-sidebar .app-nav-list .nav-link { justify-content:center; }
.app-sidebar .brand-row { border-bottom:1px solid var(--shell-border); }
.app-logo .logo-icon { width:34px; height:34px; border-radius:8px; background:linear-gradient(135deg,var(--shell-primary),color-mix(in srgb,var(--shell-primary) 70%, #2b69e8)); color:#fff; }
.toggle-btn { color: var(--shell-text-dim); }
.toggle-btn:hover { color: var(--shell-text); background:rgba(255,255,255,.05); }

/* Nav List */
.app-nav-list { list-style:none; margin:0; padding: .75rem 0 2rem; }
.app-nav-list .nav-item { margin-bottom:2px; }
.app-nav-list .nav-link { display:flex; align-items:center; gap:.85rem; padding:.65rem .95rem; color:var(--shell-text-dim); font-size:.875rem; font-weight:500; border-radius:8px; position:relative; transition: background var(--transition), color var(--transition); text-decoration:none; }
html[data-theme='light'] .app-nav-list .nav-link { color:#5a6672; }
.app-nav-list .nav-link i { font-size:1.05rem; width:1.4rem; text-align:center; }
.app-nav-list .nav-link:hover { color:var(--shell-text); background:rgba(255,255,255,0.09); }
html[data-theme='light'] .app-nav-list .nav-link:hover { color:#111; background:rgba(0,0,0,.05); }
.app-nav-list .nav-link.active { color:#fff; background:linear-gradient(135deg, rgba(var(--shell-primary-rgb)/.4), rgba(var(--shell-primary-rgb)/.15)); box-shadow: inset 0 0 0 1px rgba(var(--shell-primary-rgb)/.35), 0 4px 14px -4px rgba(var(--shell-primary-rgb)/.45); }
html[data-theme='light'] .app-nav-list .nav-link.active { color:#0d1420; }
.app-nav-list .nav-link.active::before { content:""; position:absolute; inset:0; border:1px solid rgba(var(--shell-primary-rgb)/.5); border-radius:8px; pointer-events:none; }
.app-nav-list .nav-item .nav-link:focus-visible { outline:none; box-shadow: var(--focus-ring); }

/* Header */
.app-header { height:60px; border-bottom:1px solid var(--shell-border); background:rgba(20 22 26 / .85); backdrop-filter:blur(var(--blur)); -webkit-backdrop-filter:blur(var(--blur)); position:sticky; top:0; z-index:1020; }
html[data-theme='light'] .app-header { background:rgba(255 255 255 / .8); border-bottom:1px solid var(--color-border,#d6dce3); }
.app-header .search-wrapper input[disabled] { opacity:.5; }
/* Enabled quick search styling */
.quick-search-input { background:rgba(255,255,255,.08); color:var(--shell-text); border:1px solid var(--shell-border); }
.quick-search-input:focus { outline:none; box-shadow:0 0 0 2px rgba(var(--shell-primary-rgb)/.5); background:rgba(255,255,255,.12); }
html[data-theme='light'] .quick-search-input { background:#f1f4f8; color:#1e252c; border:1px solid var(--color-border,#c8d0d8); }
html[data-theme='light'] .quick-search-input:focus { background:#ffffff; }
/* Placeholder contrast adjustments */
.quick-search-input::placeholder { color: color-mix(in srgb, var(--shell-text-dim) 70%, #ffffff); opacity:.85; }
html[data-theme='light'] .quick-search-input::placeholder { color: #6d7782; opacity:.9; }

/* Footer version meta contrast */
.system-meta { color: var(--shell-text-dim); letter-spacing:.5px; font-weight:500; opacity:.9; }
html[data-theme='light'] .system-meta { color:#5a6672; opacity:1; }

/* Main Content */
.app-main { min-height:100dvh; }
.app-content { animation: fadeIn .4s ease; }
@keyframes fadeIn { from { opacity:0; transform:translateY(4px);} to { opacity:1; transform:none;} }

/* Card Tile Base (shared between dashboard + marketing feature cards) */
/* Combine dash-card + feature-card future usage under shared base .card-tile */
.card-tile, .dash-card { position:relative; padding:1.1rem 1rem 1rem; border-radius: var(--radius, var(--radius-lg,14px)); text-decoration:none; display:block; overflow:hidden; isolation:isolate; border:1px solid var(--shell-border, var(--color-border)); color: var(--shell-text, var(--color-fg-primary)); background: linear-gradient(165deg,var(--color-bg-alt,#242b33),var(--color-bg-base,#1a1f24) 55%,#161a1e); transition: border-color var(--transition, var(--dur-base) var(--ease-standard)), transform var(--transition, var(--dur-base) var(--ease-standard)), background var(--transition, var(--dur-base) var(--ease-standard)); }
html[data-theme='light'] .card-tile, html[data-theme='light'] .dash-card { background:linear-gradient(165deg,#ffffff,#eef2f5 55%,#e6eaee); border-color: var(--color-border,#d2d9e1); color: var(--color-fg-primary,#1e252c); }
.card-tile::before, .dash-card::before { content:""; position:absolute; inset:0; background: radial-gradient(circle at 30% 10%, rgba(var(--shell-primary-rgb,61 126 255)/.35), transparent 60%); opacity:.35; transition:opacity var(--transition,160ms ease); z-index:-1; }
.card-tile:hover, .dash-card:hover { border-color: var(--shell-primary,var(--color-accent)); transform: translateY(-3px); }
.card-tile:hover::before, .dash-card:hover::before { opacity:.6; }
.card-tile:active, .dash-card:active { transform:translateY(0); }
.card-tile h3, .dash-card h3 { font-size:1rem; margin:0.75rem 0 .35rem; font-weight:600; letter-spacing:.5px; }
.card-tile p, .dash-card p { font-size:.7rem; line-height:1.1rem; margin:0; color: var(--shell-text-dim,var(--color-fg-secondary)); }
.card-tile .icon-wrap, .dash-card .icon-wrap { width:40px; height:40px; border-radius:12px; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,var(--shell-primary,var(--color-accent)),var(--shell-primary-accent,var(--color-accent-alt))); color:#fff; box-shadow:0 4px 10px -2px rgba(var(--shell-primary-rgb,61 126 255)/.6); font-size:1.25rem; }
.card-tile small.badge, .dash-card small.badge { position:absolute; top:.65rem; right:.65rem; background:rgba(var(--shell-primary-rgb,61 126 255)/.15); color:var(--shell-primary-accent,var(--color-accent-alt)); border:1px solid rgba(var(--shell-primary-rgb,61 126 255)/.35); backdrop-filter:blur(4px); font-weight:500; }

/* Dashboard grid + variant */
.dash-grid { display:grid; gap:1.25rem; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); }

/* Section separators */
.dash-section-title { font-size:.72rem; letter-spacing:1.5px; text-transform:uppercase; color: var(--shell-text-dim); font-weight:600; margin:2.25rem 0 .75rem; position:relative; }
.dash-section-title::after { content:""; position:absolute; left:0; bottom:-6px; width:42px; height:2px; background:linear-gradient(90deg,var(--shell-primary), transparent); border-radius:3px; }

/* Utility */
.glass-panel { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); backdrop-filter:blur(14px); border-radius: var(--radius); }
.text-dim { color: var(--shell-text-dim) !important; }
/* Stronger readable muted text (ensures >= 4.5:1 contrast on dark) */
.text-muted, .muted { color: var(--color-fg-muted,#8a9098) !important; }
.text-disabled { color: var(--color-fg-disabled,#5a6169) !important; }

/* High contrast helper */
.hc-border-focus:focus-visible { outline:none; box-shadow:0 0 0 2px #000, 0 0 0 4px rgba(var(--shell-primary-rgb)/.75); }

/* Accent buttons override for better contrast */
.btn-outline-secondary { color: var(--shell-text); border-color: color-mix(in srgb,var(--shell-text) 55%, transparent); }
.btn-outline-secondary:hover { background:rgba(255,255,255,.08); color:#fff; }
html[data-theme='light'] .btn-outline-secondary { color:#2e3135; }
html[data-theme='light'] .btn-outline-secondary:hover { background:rgba(0,0,0,.05); }

/* Scrollbars (WebKit) */
::-webkit-scrollbar { width:10px; height:10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: color-mix(in srgb,var(--color-border,#2e3339) 85%, #000); border-radius:6px; border:2px solid var(--color-bg-base,#181b1f); }
::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb,var(--color-border,#3a4149) 75%, #fff); }

/* Collapsed overrides */
.sidebar-collapsed .dash-card h3 { font-size:.95rem; }

/* Sidebar Accordion / Submenus */
.sidebar-accordion .accordion-section { position:relative; }
.sidebar-accordion .accordion-toggle { cursor:pointer; background:none; border:none; width:100%; text-align:left; }
.sidebar-accordion .accordion-toggle .rotate-icon { transition: transform var(--transition); }
.sidebar-accordion .accordion-section.open > .accordion-toggle .rotate-icon { transform: rotate(180deg); }
.sidebar-accordion .submenu { max-height:0; overflow:hidden; padding-left:0; margin:0; transition: max-height 240ms cubic-bezier(.4,0,.2,1), opacity 180ms ease; opacity:0; }
.sidebar-accordion .submenu li { margin:0; }
.sidebar-accordion .submenu .nav-link { padding:.4rem .65rem; font-size:.74rem; gap:.5rem; border-radius:6px; }
.sidebar-accordion .submenu .nav-link.active { box-shadow: inset 0 0 0 1px rgba(var(--shell-primary-rgb)/.5), 0 2px 6px -2px rgba(var(--shell-primary-rgb)/.4); }
.sidebar-accordion .accordion-section.open > .submenu { opacity:1; padding-top:.15rem; padding-bottom:.4rem; }
/* Use JS to set max-height dynamically to enable transition; provide large fallback for no-JS */
.no-js .sidebar-accordion .submenu { max-height: 800px; opacity:1; }
.sidebar-collapsed .sidebar-accordion .submenu { display:none !important; }

/* Light theme minor adjustments */
html[data-theme='light'] .sidebar-accordion .submenu .nav-link.active { background:linear-gradient(135deg, rgba(var(--shell-primary-rgb)/.25), rgba(var(--shell-primary-rgb)/.15)); }

@media (max-width: 992px) {
  .app-sidebar { position:fixed; left:0; top:0; transform:translateX(0); transition: transform var(--transition); }
  body.sidebar-hidden .app-sidebar { transform:translateX(-100%); }
}