:root{
    --orange-950:#073116; --orange-900:#09441f; --orange-800:#0d5f2b; --orange-700:#117f3a; --orange-600:#16a34a; --orange-500:#40b46b; --orange-100:#e1f3e7;
    --gold:#f2b53e; --gold-soft:#fdf1d2;
    --paper:#fffaf5; --surface:#ffffff; --ink:#2b211b; --muted2:#8a7b6f; --line:#f1e3d5;
    --ok:#3fa66a; --danger:#c0392b; --sidebar-w:270px; --sidebar-w-collapsed:78px;
  }
  [data-theme="dark"]{ --paper:#160f0a; --surface:#20160f; --ink:#f5ece3; --muted2:#c2ab98; --line:#3a2a1e; }

  *{ font-family:"Vazirmatn", "Noto Naskh Arabic", "Segoe UI", Tahoma, sans-serif; }
  html,body{ height:100%; }
  body{ background: var(--paper); color: var(--ink); min-height:100vh; transition: background .25s ease, color .25s ease; }
  a{ text-decoration:none; }
  [lang="ckb"] * { font-family: "Vazirmatn", "Noto Naskh Arabic", Tahoma, sans-serif; }
  [dir="ltr"] body{ font-family:"Segoe UI","Vazirmatn",sans-serif; }

  /* ============ Auth Modal & Blur Overlay ============ */
  #appWrapper {
    transition: filter 0.35s ease, opacity 0.35s ease, transform 0.35s ease;
  }
  #appWrapper.blurred {
    filter: blur(14px) brightness(0.92);
    pointer-events: none;
    user-select: none;
    transform: scale(0.985);
  }

  .auth-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1060;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(35, 15, 5, 0.45);
    backdrop-filter: blur(8px);
    transition: opacity 0.3s ease, visibility 0.3s ease;
  }
  .auth-modal-backdrop.hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  .auth-card{
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 24px;
    width: 100%;
    max-width: 440px;
    box-shadow: 0 30px 80px rgba(58,26,8,.4);
    padding: 32px 30px;
    position: relative;
    overflow: hidden;
    animation: modalPop .3s ease-out;
  }
  @keyframes modalPop {
    from { opacity: 0; transform: scale(0.92) translateY(20px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
  }

  .auth-brand{ display:flex; align-items:center; gap:10px; margin-bottom:20px; }
  .auth-brand .brand-mark{ width:36px; height:36px; border-radius:10px; background:linear-gradient(135deg,var(--gold),var(--orange-600)); display:flex; align-items:center; justify-content:center; color:#3a1a08; font-size:16px; }
  .auth-brand b{ font-size:1.05rem; }
  .auth-form h2{ font-size:1.25rem; font-weight:800; margin-bottom:4px; }
  .auth-form .sub{ font-size:.82rem; color:var(--muted2); margin-bottom:18px; }
  .auth-form .form-control{ background: var(--paper); border:1px solid var(--line); font-size:.9rem; }
  .auth-form .form-control:focus{ border-color: var(--orange-500); box-shadow: 0 0 0 .2rem rgba(232,99,44,.15); }
  .auth-error{ background:#fdeceb; color:var(--danger); font-size:.8rem; padding:8px 12px; border-radius:8px; margin-bottom:14px; display:none; }
  .auth-error.show{ display:block; }
  .auth-note{ background: var(--gold-soft); color:#8a5a10; font-size:.78rem; padding:10px 12px; border-radius:8px; margin-bottom:14px; }
  .btn-brand{ background: linear-gradient(135deg, var(--orange-500), var(--orange-700)); border:none; color:#fff; font-weight:700; box-shadow: 0 8px 20px rgba(200,83,28,.3); }
  .btn-brand:hover{ color:#fff; filter:brightness(1.05); }
  .auth-switch{ text-align:center; font-size:.84rem; color:var(--muted2); margin-top:16px; }
  .auth-switch a{ color: var(--orange-700); font-weight:600; }

  /* ============ Language switcher ============ */
  .lang-switch-modal{ position:absolute; top:20px; inset-inline-end:20px; z-index:5; }
  .lang-switch-modal .btn{ font-size:.78rem; border:1px solid var(--line); background:var(--paper); color:var(--ink); border-radius:20px; padding:4px 10px; }
  .lang-menu-item.active{ font-weight:700; color:var(--orange-700); }

  /* ============ Collapsible Solid Sidebar ============ */
  .sidebar{ 
    width: var(--sidebar-w); 
    background: linear-gradient(195deg, var(--orange-800), var(--orange-950) 78%); 
    color:#f3e3d6; 
    position:fixed; 
    inset-inline-start:0; 
    top:0; 
    bottom:0; 
    display:flex; 
    flex-direction:column; 
    z-index:1030; 
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  }
  .sidebar.collapsed {
    width: var(--sidebar-w-collapsed);
  }
  .sidebar .brand{ display:flex; align-items:center; gap:11px; padding: 24px 18px 16px; overflow: hidden; white-space: nowrap; }
  .sidebar.collapsed .brand-texts { display: none; }
  
  .brand-mark{ width:38px; height:38px; border-radius:11px; background: linear-gradient(135deg, var(--gold), var(--orange-600)); display:flex; align-items:center; justify-content:center; color: var(--orange-950); font-size:17px; flex-shrink:0; box-shadow: 0 6px 16px rgba(242,129,74,.4); }
  .brand-title{ font-weight:800; font-size:1.04rem; color:#fff; line-height:1.2; }
  .brand-sub{ font-size:.68rem; color:#e0b89b; margin-top:2px; font-weight: 600; letter-spacing: 0.03em; }
  
  .sidebar-nav{ padding: 8px 10px; flex:1; overflow-y:auto; overflow-x:hidden; }
  .sidebar-nav .nav-section-label{ font-size:.64rem; color:#c69777; text-transform:uppercase; letter-spacing:.08em; padding: 12px 10px 6px; white-space: nowrap; }
  .sidebar.collapsed .sidebar-nav .nav-section-label { display: none; }

  .sidebar-nav .nav-link{ color:#eccdb6; font-size:.88rem; padding:10px 12px; border-radius:12px; display:flex; align-items:center; gap:12px; margin-bottom:3px; cursor:pointer; position:relative; transition: background .18s ease, color .18s ease; white-space: nowrap; }
  .sidebar-nav .nav-link .nav-ic{ width:28px; height:28px; border-radius:8px; background: rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; font-size:.9rem; flex-shrink:0; }
  .sidebar-nav .nav-link .nav-badge{ margin-inline-start:auto; background: rgba(255,255,255,.12); color:#f3e3d6; font-size:.68rem; padding:1px 8px; border-radius:20px; }
  .sidebar.collapsed .sidebar-nav .nav-link span:not(.nav-ic), 
  .sidebar.collapsed .sidebar-nav .nav-link .nav-badge { display: none; }
  
  .sidebar-nav .nav-link:hover{ background: rgba(255,255,255,.07); color:#fff; }
  .sidebar-nav .nav-link.active{ background: linear-gradient(90deg, rgba(232,99,44,.9), rgba(232,99,44,.15)); color:#fff; }
  .sidebar-nav .nav-link.active::before{ content:""; position:absolute; inset-inline-start:-10px; top:8px; bottom:8px; width:4px; border-radius:4px; background: var(--gold); }
  .sidebar-nav .nav-link.active .nav-ic{ background: var(--gold); color: var(--orange-950); }

  /* Sidebar Theme Palette */
  .sidebar-palette-box {
    padding: 10px 12px;
    border-top: 1px solid rgba(255,255,255,.1);
    background: rgba(0,0,0,0.12);
  }
  .sidebar-palette-box .label { font-size: 0.68rem; color: #c69777; margin-bottom: 6px; white-space: nowrap; }
  .sidebar.collapsed .sidebar-palette-box { display: none; }
  .sidebar-swatch-list { display: flex; gap: 5px; flex-wrap: wrap; align-items: center; }
  .sidebar-swatch { width: 20px; height: 20px; border-radius: 50%; cursor: pointer; border: 2px solid transparent; transition: transform .15s; }
  .sidebar-swatch:hover { transform: scale(1.15); }
  .sidebar-swatch.selected { border-color: #fff; transform: scale(1.15); }

  .sidebar-foot{ padding: 12px 14px; border-top:1px solid rgba(255,255,255,.1); font-size:.72rem; color:#c69777; display:flex; align-items:center; gap:8px; white-space: nowrap; overflow: hidden; }
  .sidebar.collapsed .sidebar-foot span { display: none; }

  .main-area{ margin-inline-start: var(--sidebar-w); min-height:100vh; display:flex; flex-direction:column; transition: margin-inline-start 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
  .main-area.expanded { margin-inline-start: var(--sidebar-w-collapsed); }

  .topbar{ background: var(--surface); border-bottom:1px solid var(--line); padding: 12px 24px; display:flex; align-items:center; gap:10px; position:sticky; top:0; z-index:1020; flex-wrap:wrap; }
  .topbar .page-title{ font-weight:800; font-size:1.12rem; }
  .topbar .page-sub{ font-size:.78rem; color:var(--muted2); }
  .icon-btn{ width:38px; height:38px; border-radius:11px; border:1px solid var(--line); background: var(--surface); color: var(--ink); display:flex; align-items:center; justify-content:center; flex-shrink:0; cursor: pointer; }
  .icon-btn:hover{ background: var(--orange-100); border-color: var(--orange-600); }
  .btn-ghost-orange{ background: var(--orange-100); border:1px solid var(--line); color:var(--orange-700); font-weight:600; font-size:.85rem; }
  .btn-ghost-orange:hover{ background: var(--gold-soft); color:var(--orange-700); }
  .balance-chip{ display:flex; align-items:center; gap:6px; background:var(--orange-100); border:1px solid var(--line); border-radius:20px; padding:5px 12px; font-size:.8rem; font-weight:700; color:var(--orange-700); cursor:pointer; flex-shrink:0; }
  
  /* Avatar styles */
  .avatar-circle{ width:38px; height:38px; border-radius:50%; background: linear-gradient(135deg,var(--gold),var(--orange-600)); color:#3a1a08; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:.95rem; flex-shrink:0; cursor:pointer; background-size: cover; background-position: center; border: 2px solid transparent; }
  .avatar-preview{ width:76px; height:76px; border-radius:50%; background: linear-gradient(135deg,var(--gold),var(--orange-600)); color:#3a1a08; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:1.8rem; background-size: cover; background-position: center; border: 2px solid var(--line); }

  .content-scroll{ padding: 24px; flex:1; }
  
  /* Modern Dashboard Balance & Stats Glow Cards */
  .dashboard-balance-card {
    background: linear-gradient(135deg, var(--orange-700) 0%, var(--orange-950) 100%);
    color: #fff;
    border-radius: 20px;
    padding: 24px 28px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 12px 30px rgba(58,26,8,.18);
  }
  .dashboard-balance-card::before {
    content: "";
    position: absolute;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(242,181,62,0.25) 0%, rgba(255,255,255,0) 70%);
    top: -60px;
    inset-inline-end: -40px;
  }
  .dashboard-balance-card .balance-amount {
    font-size: 2.2rem;
    font-weight: 800;
    line-height: 1.1;
    color: #fff;
  }

  .stat-card{ background: var(--surface); border:1px solid var(--line); border-radius:16px; padding: 18px 20px; height:100%; transition: transform 0.2s ease, box-shadow 0.2s ease; }
  .stat-card:hover{ transform: translateY(-3px); box-shadow: 0 10px 22px rgba(107,49,16,.08); }
  .stat-icon{ width:42px; height:42px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:1.1rem; margin-bottom:10px; }
  .stat-value{ font-size:1.5rem; font-weight:800; line-height:1; }
  .stat-label{ font-size:.8rem; color:var(--muted2); margin-top:4px; }
  
  /* Hover Glow Panels for Stats */
  .glow-panel {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 18px;
    overflow: hidden;
    position: relative;
    transition: all 0.28s ease;
  }
  .glow-panel:hover {
    border-color: var(--orange-500);
    box-shadow: 0 14px 34px rgba(200,83,28,.12);
    transform: translateY(-2px);
  }
  .stat-box-modern {
    padding: 14px 10px;
    border-radius: 14px;
    transition: transform 0.2s ease, background 0.2s ease;
    border: 1px solid var(--line);
    background: var(--paper);
  }
  .stat-box-modern:hover {
    transform: translateY(-2px);
    background: var(--surface);
  }

  .panel{ background: var(--surface); border:1px solid var(--line); border-radius:16px; overflow:hidden; }
  .panel-head{ padding: 16px 20px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; }
  .panel-head h6{ margin:0; font-weight:700; font-size:.92rem; }
  .bar-row{ display:flex; align-items:center; gap:10px; padding: 9px 0; }
  .bar-row .bar-label{ width:120px; font-size:.8rem; color:var(--muted2); flex-shrink:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .bar-track{ flex:1; height:8px; background:var(--orange-100); border-radius:6px; overflow:hidden; }
  .bar-fill{ height:100%; background: linear-gradient(90deg, var(--gold), var(--orange-600)); border-radius:6px; }
  .bar-value{ font-size:.75rem; color:var(--muted2); width:56px; text-align:end; flex-shrink:0; }
  .doc-row{ display:flex; align-items:center; gap:12px; padding:12px 20px; border-bottom:1px solid var(--line); cursor:pointer; }
  .doc-row:last-child{ border-bottom:none; }
  .doc-row:hover{ background: var(--orange-100); }
  .doc-icon{ width:38px; height:38px; border-radius:10px; background:var(--gold-soft); color:#a8681a; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
  .doc-title-txt{ font-weight:600; font-size:.88rem; }
  .doc-meta{ font-size:.74rem; color:var(--muted2); }
  .doc-card{ background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:16px; cursor:pointer; transition: box-shadow .15s ease, transform .1s ease; height:100%; }
  .doc-card:hover{ box-shadow:0 10px 24px rgba(107,49,16,.12); transform: translateY(-2px); border-color: var(--orange-500); }
  .doc-card .snippet{ font-size:.8rem; color: var(--muted2); height:38px; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }

  /* ============ Advanced Rich Text Editor Toolbar ============ */
  .editor-toolbar{ background: var(--orange-100); border-bottom:1px solid var(--line); padding:8px 12px; display:flex; flex-wrap:wrap; gap:4px; align-items:center; }
  .editor-toolbar .btn{ --bs-btn-padding-x:.45rem; --bs-btn-padding-y:.28rem; font-size:.82rem; border-color: var(--line); color:var(--ink); background:var(--surface); border-radius:6px; }
  .editor-toolbar .btn:hover{ background: var(--gold-soft); color: var(--orange-800); }
  .editor-toolbar .btn.active,.editor-toolbar .btn:active{ background: var(--orange-600) !important; border-color: var(--orange-600) !important; color:#fff !important; }
  .editor-toolbar select.form-select-sm{ font-size:.8rem; max-width:130px; border-color:var(--line); padding-top: .2rem; padding-bottom: .2rem; }
  .editor-color-btn{ position:relative; overflow:hidden; display:inline-flex; align-items:center; justify-content:center; }
  .editor-color-btn input[type="color"]{ position:absolute; opacity:0; width:100%; height:100%; cursor:pointer; inset:0; }
  .vr-soft{ width:1px; height:20px; background:var(--line); margin:0 3px; }
  
  #editor, #asrEditor, #ocrEditor, #ticketEditor{ min-height:220px; max-height:55vh; overflow-y:auto; padding:20px 24px; font-size:1.02rem; line-height:2; outline:none; background: var(--surface); color: var(--ink); border-radius: 0 0 14px 14px; }
  #editor, #ocrEditor, #asrEditor{ min-height:360px; font-size:1.05rem; }
  #editor:empty::before, #asrEditor:empty::before, #ocrEditor:empty::before, #ticketEditor:empty::before{ content:attr(data-placeholder); color:var(--muted2); }
  #editor h1, #asrEditor h1, #ocrEditor h1, #ticketEditor h1{ font-weight:800; font-size:1.6rem; margin:.6em 0 .3em; color:var(--orange-700); }
  #editor h2, #asrEditor h2, #ocrEditor h2, #ticketEditor h2{ font-weight:700; font-size:1.25rem; margin:.6em 0 .3em; }
  #editor h3, #asrEditor h3, #ocrEditor h3, #ticketEditor h3{ font-weight:600; font-size:1.1rem; margin:.5em 0 .3em; }
  #editor blockquote, #asrEditor blockquote, #ocrEditor blockquote, #ticketEditor blockquote{ border-inline-start:3px solid var(--gold); padding:6px 16px; color:var(--muted2); margin:1em 0; background: rgba(242,181,62,0.06); border-radius:0 8px 8px 0; }
  #editor table, #asrEditor table, #ocrEditor table, #ticketEditor table{ border-collapse:collapse; width:100%; margin:1em 0; }
  #editor table td, #editor table th, #asrEditor table td, #asrEditor table th, #ocrEditor table td, #ocrEditor table th, #ticketEditor table td, #ticketEditor table th{ border:1px solid var(--line); padding:8px 12px; }
  #editor hr, #asrEditor hr, #ocrEditor hr, #ticketEditor hr{ border:0; border-top:2px dashed var(--line); margin:1.5em 0; }

  .speech-dock{ background: var(--orange-100); border-top:1px solid var(--line); padding:16px 20px; }
  .eq{ display:flex; align-items:flex-end; gap:3px; height:30px; }
  .eq span{ width:4px; background: linear-gradient(180deg, var(--gold), var(--orange-600)); border-radius:2px; height:6px; }
  .eq.playing span{ animation: eqbounce .9s ease-in-out infinite; }
  .eq.playing span:nth-child(1){ animation-delay:0s; } .eq.playing span:nth-child(2){ animation-delay:.1s; }
  .eq.playing span:nth-child(3){ animation-delay:.2s; } .eq.playing span:nth-child(4){ animation-delay:.3s; }
  .eq.playing span:nth-child(5){ animation-delay:.15s; } .eq.playing span:nth-child(6){ animation-delay:.25s; }
  .eq.playing span:nth-child(7){ animation-delay:.05s; }
  @keyframes eqbounce{ 0%,100%{height:6px;} 50%{height:28px;} }
  .play-fab{ width:52px; height:52px; border-radius:50%; background: linear-gradient(135deg, var(--orange-500), var(--orange-700)); border:none; color:#fff; font-size:1.25rem; display:flex; align-items:center; justify-content:center; box-shadow: 0 10px 22px rgba(200,83,28,.4); flex-shrink:0; }
  .dock-btn{ width:40px; height:40px; border-radius:50%; border:1px solid var(--line); background:var(--surface); color:var(--orange-700); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
  .dock-btn:hover{ background: var(--gold-soft); }
  .progress-track{ height:6px; border-radius:4px; background:var(--line); overflow:hidden; flex:1; }
  .progress-fill{ height:100%; width:0%; background: linear-gradient(90deg, var(--gold), var(--orange-600)); transition: width .15s linear; }
  .range-mini{ width:96px; }
  .status-pill{ font-size:.76rem; color:var(--muted2); display:flex; align-items:center; gap:6px; }
  .status-dot{ width:7px; height:7px; border-radius:50%; background:#c9b6a5; }
  .status-dot.live{ background:var(--ok); box-shadow:0 0 0 3px rgba(63,166,106,.18); }
  .statusbar{ padding:8px 20px; border-top:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; font-size:.76rem; color:var(--muted2); }

  .section{ display:none; } .section.active{ display:block; }
  .doc-title-input{ background:transparent; border:none; border-bottom:1px solid transparent; font-weight:700; font-size:1rem; outline:none; color:var(--ink); width:100%; max-width:320px; }
  .doc-title-input:focus{ border-bottom-color: var(--orange-600); }
  .upload-drop{ border:2px dashed var(--line); border-radius:14px; padding:26px 18px; text-align:center; color:var(--muted2); cursor:pointer; transition: border-color .15s ease, background .15s ease; }
  .upload-drop:hover, .upload-drop.dragover{ border-color: var(--orange-500); background: var(--orange-100); }
  .upload-drop i{ font-size:1.6rem; color: var(--orange-600); }

  .balance-hero{ border-radius:18px; padding:28px 26px; color:#fff; background: linear-gradient(135deg, var(--orange-600), var(--orange-900)); }
  .balance-hero .amount{ font-size:2.1rem; font-weight:800; }
  .balance-hero .label{ font-size:.85rem; opacity:.85; }
  .topup-chip{ border:1px solid var(--line); background:var(--surface); border-radius:10px; padding:10px 8px; text-align:center; cursor:pointer; font-weight:700; font-size:.88rem; }
  .topup-chip:hover, .topup-chip.selected{ border-color: var(--orange-600); background: var(--orange-100); color:var(--orange-700); }
  .tx-row{ display:flex; align-items:center; gap:12px; padding:12px 20px; border-bottom:1px solid var(--line); }
  .tx-row:last-child{ border-bottom:none; }
  .tx-icon{ width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
  .tx-icon.up{ background:#e5f6ea; color:var(--ok); }
  .tx-icon.down{ background:#fdeceb; color:var(--danger); }
  .tx-amount.up{ color:var(--ok); font-weight:700; }
  .tx-amount.down{ color:var(--danger); font-weight:700; }

  /* Recording Pulse Effect */
  .rec-btn.recording {
    background-color: var(--danger) !important;
    color: #fff !important;
    animation: pulseRed 1.2s infinite;
  }
  @keyframes pulseRed {
    0% { box-shadow: 0 0 0 0 rgba(192, 57, 43, 0.7); }
    70% { box-shadow: 0 0 0 14px rgba(192, 57, 43, 0); }
    100% { box-shadow: 0 0 0 0 rgba(192, 57, 43, 0); }
  }

  /* File attachment chips */
  .attach-preview-item {
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 4px 10px;
    font-size: .8rem;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 3px;
  }

  .sidebar-backdrop{ position:fixed; inset:0; background:rgba(35,15,5,.5); z-index:1025; display:none; }
  .sidebar-backdrop.show{ display:block; }

  @media (max-width: 991.98px){
    .sidebar{ inset-inline-start: calc(-1 * var(--sidebar-w)); transition: inset-inline-start .3s ease; }
    .sidebar.show{ inset-inline-start:0; }
    .main-area{ margin-inline-start:0 !important; }
  }
  @media (max-width: 575.98px){
    .content-scroll{ padding:14px; } #editor, #asrEditor, #ocrEditor, #ticketEditor{ padding:16px; } .range-mini{ width:60px; }
    .topbar{ padding:10px 14px; } .doc-row .doc-meta{ display:none; }
    .btn-ghost-orange span, .balance-chip span.chip-label{ display:none; }
  }

/* ===== Extracted stylesheet block ===== */

/* ==========================================================
   Kurdish Speech — Premium Dashboard Redesign
   Visual-only enhancement: existing IDs / JS behavior preserved.
   ========================================================== */
:root{
  --paper:#f6f7fb;
  --surface:#ffffff;
  --ink:#182230;
  --muted2:#667085;
  --line:#e7eaf0;
  --sidebar-w:286px;
  --sidebar-w-collapsed:82px;
  --ks-radius-sm:10px;
  --ks-radius:16px;
  --ks-radius-lg:22px;
  --ks-shadow-sm:0 2px 8px rgba(16,24,40,.04);
  --ks-shadow:0 12px 34px rgba(16,24,40,.08);
  --ks-shadow-lg:0 24px 60px rgba(16,24,40,.14);
  --ks-sidebar:#101828;
  --ks-sidebar-2:#0b1220;
}
[data-theme="dark"]{
  --paper:#0d1117;
  --surface:#151b23;
  --ink:#f2f4f7;
  --muted2:#98a2b3;
  --line:#28313d;
  --ks-sidebar:#090e15;
  --ks-sidebar-2:#070b10;
  --ks-shadow-sm:0 2px 10px rgba(0,0,0,.16);
  --ks-shadow:0 14px 38px rgba(0,0,0,.26);
  --ks-shadow-lg:0 26px 70px rgba(0,0,0,.38);
}

html{scroll-behavior:smooth;}
body{
  background:
    radial-gradient(circle at 88% -10%, color-mix(in srgb, var(--orange-600) 10%, transparent), transparent 32%),
    radial-gradient(circle at 5% 45%, color-mix(in srgb, var(--gold) 7%, transparent), transparent 28%),
    var(--paper);
  letter-spacing:-.01em;
}
::selection{background:color-mix(in srgb,var(--orange-600) 24%, transparent); color:var(--ink);}
*{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--muted2) 35%, transparent) transparent;}
*::-webkit-scrollbar{width:8px;height:8px}
*::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--muted2) 30%, transparent);border-radius:999px}
*::-webkit-scrollbar-track{background:transparent}

/* ---------- Sidebar ---------- */
.sidebar{
  background:
    radial-gradient(circle at 25% 0%, color-mix(in srgb,var(--orange-600) 26%, transparent), transparent 28%),
    linear-gradient(180deg,var(--ks-sidebar),var(--ks-sidebar-2));
  border-inline-end:1px solid rgba(255,255,255,.055);
  box-shadow:8px 0 40px rgba(16,24,40,.08);
  padding:10px 8px 8px;
}
.sidebar .brand{
  min-height:76px;
  padding:14px 12px 16px;
  margin:0 2px 7px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.sidebar .brand-mark,
.auth-brand .brand-mark{
  width:44px;height:44px;border-radius:14px;
  background:#fff url('https://kurdishspeech.com/KurdishSpeechIcon.png') center/78% no-repeat !important;
  box-shadow:0 10px 26px color-mix(in srgb,var(--orange-600) 28%, transparent);
  border:1px solid rgba(255,255,255,.45);
  color:transparent;
}
.sidebar .brand-mark i,.auth-brand .brand-mark i{display:none}
.brand-title{font-size:1.05rem;letter-spacing:-.025em}
.brand-sub{font-size:.62rem;text-transform:uppercase;letter-spacing:.11em;color:#98a2b3;margin-top:5px}
.sidebar-nav{padding:7px 4px 6px}
.sidebar-nav .nav-section-label{
  color:#667085;
  font-size:.64rem;
  font-weight:700;
  letter-spacing:.09em;
  padding:17px 13px 7px;
}
.sidebar-nav .nav-link{
  min-height:46px;
  margin:3px 2px;
  padding:8px 10px;
  border-radius:13px;
  color:#c6ccd5;
  font-size:.875rem;
  font-weight:500;
  gap:10px;
  transition:transform .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease;
}
.sidebar-nav .nav-link .nav-ic{
  width:34px;height:34px;border-radius:10px;
  background:rgba(255,255,255,.055);
  color:#aeb7c5;
  font-size:.95rem;
}
.sidebar-nav .nav-link:hover{
  background:rgba(255,255,255,.065);
  color:#fff;
  transform:translateX(-2px);
}
[dir="ltr"] .sidebar-nav .nav-link:hover{transform:translateX(2px)}
.sidebar-nav .nav-link.active{
  background:linear-gradient(135deg,color-mix(in srgb,var(--orange-600) 92%, #fff 8%),color-mix(in srgb,var(--orange-700) 84%, #111827 16%));
  color:#fff;
  box-shadow:0 10px 24px color-mix(in srgb,var(--orange-700) 25%, transparent);
}
.sidebar-nav .nav-link.active::before{display:none}
.sidebar-nav .nav-link.active .nav-ic{background:rgba(255,255,255,.18);color:#fff}
.sidebar-nav .nav-link .nav-badge{
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.08);
  min-width:26px;text-align:center;padding:2px 7px;
}
.sidebar-palette-box{
  margin:6px 4px;
  padding:12px 13px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:rgba(255,255,255,.035);
}
.sidebar-palette-box .label{color:#8c96a7;margin-bottom:9px}
.sidebar-swatch{width:22px;height:22px;border:3px solid transparent;box-shadow:0 0 0 1px rgba(255,255,255,.16)}
.sidebar-swatch.selected{border-color:#fff;box-shadow:0 0 0 2px rgba(255,255,255,.16)}
.sidebar-foot{
  margin:2px 4px 0;
  padding:12px 11px 9px;
  border-top:1px solid rgba(255,255,255,.075);
  color:#7f8a9a;
}
.sidebar.collapsed .brand{justify-content:center;padding-inline:7px}
.sidebar.collapsed .sidebar-nav .nav-link{justify-content:center;padding-inline:7px}
.sidebar.collapsed .sidebar-nav .nav-link .nav-ic{width:40px;height:40px}

/* ---------- Main / Topbar ---------- */
.main-area{background:transparent}
.topbar{
  min-height:76px;
  padding:13px 28px;
  gap:10px;
  background:color-mix(in srgb,var(--surface) 91%, transparent);
  border-bottom:1px solid color-mix(in srgb,var(--line) 88%, transparent);
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  box-shadow:0 5px 18px rgba(16,24,40,.025);
}
.topbar .page-title{font-size:1.17rem;font-weight:800;letter-spacing:-.03em}
.topbar .page-sub{font-size:.76rem;margin-top:2px;color:var(--muted2)}
.icon-btn{
  width:40px;height:40px;border-radius:12px;
  border:1px solid var(--line);
  background:var(--surface);
  box-shadow:var(--ks-shadow-sm);
  transition:.18s ease;
}
.icon-btn:hover{background:color-mix(in srgb,var(--orange-600) 7%,var(--surface));border-color:color-mix(in srgb,var(--orange-600) 30%,var(--line));transform:translateY(-1px)}
.balance-chip{
  min-height:40px;
  border-radius:12px;
  padding:6px 12px;
  background:color-mix(in srgb,var(--orange-600) 8%,var(--surface));
  border:1px solid color-mix(in srgb,var(--orange-600) 18%,var(--line));
  color:var(--orange-700);
  box-shadow:none;
}
.btn-ghost-orange{
  border-radius:11px!important;
  background:color-mix(in srgb,var(--orange-600) 7%,var(--surface));
  border-color:color-mix(in srgb,var(--orange-600) 17%,var(--line));
}
.btn-brand{
  border-radius:11px;
  background:linear-gradient(135deg,var(--orange-500),var(--orange-700));
  box-shadow:0 8px 20px color-mix(in srgb,var(--orange-700) 22%,transparent);
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
}
.btn-brand:hover{transform:translateY(-1px);box-shadow:0 11px 26px color-mix(in srgb,var(--orange-700) 28%,transparent)}
.avatar-circle{width:40px;height:40px;border:3px solid var(--surface);box-shadow:0 0 0 1px var(--line),0 6px 18px rgba(16,24,40,.10)}
.content-scroll{padding:28px;max-width:1600px;width:100%;margin-inline:auto}
.section.active{animation:ksSectionIn .28s ease both}
@keyframes ksSectionIn{from{opacity:.2;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ---------- Cards / Panels ---------- */
.panel,.glow-panel,.stat-card,.doc-card{
  border:1px solid var(--line);
  box-shadow:var(--ks-shadow-sm);
}
.panel,.glow-panel{border-radius:var(--ks-radius-lg)}
.panel{overflow:hidden}
.panel-head{
  min-height:62px;
  padding:16px 19px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 98%,#fff),color-mix(in srgb,var(--paper) 30%,var(--surface)));
  border-bottom:1px solid var(--line);
}
[data-theme="dark"] .panel-head{background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--surface) 86%,#000))}
.panel-head h6{font-size:.9rem;font-weight:750;letter-spacing:-.015em}
.glow-panel{box-shadow:var(--ks-shadow-sm);transition:.2s ease}
.glow-panel:hover{transform:translateY(-3px);box-shadow:var(--ks-shadow);border-color:color-mix(in srgb,var(--orange-600) 25%,var(--line))}
.glow-panel .panel-head.bg-light{background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--paper) 50%,var(--surface)))!important}
.stat-box-modern{
  min-height:84px;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  border-radius:14px;
  border:1px solid var(--line);
  background:color-mix(in srgb,var(--paper) 65%,var(--surface));
}
.stat-box-modern:hover{background:var(--surface);box-shadow:0 8px 18px rgba(16,24,40,.055)}
.stat-box-modern .small{font-size:.72rem!important;margin-top:5px}
.doc-icon{border-radius:11px}
.doc-card{border-radius:18px;padding:18px;box-shadow:var(--ks-shadow-sm)}
.doc-card:hover{box-shadow:var(--ks-shadow);transform:translateY(-3px);border-color:color-mix(in srgb,var(--orange-600) 26%,var(--line))}
.doc-row{padding:13px 18px;transition:.16s ease}
.doc-row:hover{background:color-mix(in srgb,var(--orange-600) 5%,var(--surface))}

/* ---------- Dashboard hero ---------- */
.dashboard-balance-card{
  min-height:178px;
  padding:28px 30px;
  border-radius:26px;
  background:
    radial-gradient(circle at 88% 18%,rgba(255,255,255,.18),transparent 21%),
    radial-gradient(circle at 14% 120%,rgba(255,255,255,.10),transparent 28%),
    linear-gradient(125deg,var(--orange-700),color-mix(in srgb,var(--orange-950) 68%,#111827 32%));
  box-shadow:0 20px 46px color-mix(in srgb,var(--orange-950) 23%,transparent);
  border:1px solid rgba(255,255,255,.12);
}
.dashboard-balance-card::before{
  width:260px;height:260px;top:-90px;inset-inline-end:-45px;
  background:radial-gradient(circle,rgba(255,255,255,.17),rgba(255,255,255,0) 68%);
}
.dashboard-balance-card::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,.08),transparent 36%);
}
.dashboard-balance-card .balance-amount{font-size:2.45rem;letter-spacing:-.04em}
.dashboard-balance-card .btn-warning{
  color:#7a3f00;background:#fff;border:0;box-shadow:0 10px 28px rgba(0,0,0,.15)!important;
}
.dashboard-balance-card .btn-warning:hover{transform:translateY(-2px);background:#fff7ed}
#section-dashboard>.row.g-3.mb-4>.col-lg-4:nth-child(1) .glow-panel{border-top:3px solid color-mix(in srgb,var(--orange-600) 76%,#fff)}
#section-dashboard>.row.g-3.mb-4>.col-lg-4:nth-child(2) .glow-panel{border-top:3px solid #12b76a}
#section-dashboard>.row.g-3.mb-4>.col-lg-4:nth-child(3) .glow-panel{border-top:3px solid #7f56d9}
#section-dashboard .panel.mb-3 .p-2.rounded{border-radius:14px!important;padding:13px 8px!important;background:color-mix(in srgb,var(--paper) 60%,var(--surface))!important;border-color:var(--line)!important}
#section-dashboard .panel.mb-3 .p-2.rounded .fs-4{font-size:1.45rem!important}
.bar-track{height:9px;background:color-mix(in srgb,var(--orange-600) 7%,var(--paper));border:1px solid color-mix(in srgb,var(--orange-600) 7%,var(--line))}
.bar-fill{background:linear-gradient(90deg,var(--orange-500),var(--orange-700))}

/* ---------- Forms ---------- */
.form-control,.form-select,.input-group-text{
  min-height:42px;
  border-radius:11px;
  border-color:var(--line);
  background-color:var(--surface);
  color:var(--ink);
  font-size:.86rem;
}
.form-control:focus,.form-select:focus{
  border-color:color-mix(in srgb,var(--orange-600) 62%,var(--line));
  box-shadow:0 0 0 4px color-mix(in srgb,var(--orange-600) 10%,transparent);
  background-color:var(--surface);color:var(--ink);
}
.form-control:disabled{background:color-mix(in srgb,var(--paper) 70%,var(--surface));color:var(--muted2)}
.form-label{font-weight:650;color:color-mix(in srgb,var(--ink) 78%,var(--muted2))}
.upload-drop{
  border:1.5px dashed color-mix(in srgb,var(--muted2) 35%,var(--line));
  background:linear-gradient(180deg,color-mix(in srgb,var(--paper) 58%,var(--surface)),var(--surface));
  border-radius:18px;padding:30px 20px;
}
.upload-drop:hover,.upload-drop.dragover{
  border-color:var(--orange-500);
  background:color-mix(in srgb,var(--orange-600) 4%,var(--surface));
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--orange-600) 8%,transparent);
}
.upload-drop i{font-size:1.85rem}

/* ---------- Rich editors ---------- */
.editor-toolbar{
  background:color-mix(in srgb,var(--paper) 74%,var(--surface));
  padding:9px 12px;
  gap:5px;
}
.editor-toolbar .btn{
  min-width:32px;min-height:32px;
  background:var(--surface);border-color:var(--line);border-radius:8px;
  box-shadow:0 1px 2px rgba(16,24,40,.025);
}
.editor-toolbar .btn:hover{background:color-mix(in srgb,var(--orange-600) 7%,var(--surface));border-color:color-mix(in srgb,var(--orange-600) 20%,var(--line))}
#editor,#asrEditor,#ocrEditor,#ticketEditor{
  background:var(--surface);
  line-height:2.05;
}
#editor,#asrEditor,#ocrEditor{min-height:400px}
.speech-dock{
  background:linear-gradient(180deg,color-mix(in srgb,var(--paper) 65%,var(--surface)),color-mix(in srgb,var(--orange-600) 3%,var(--surface)));
  padding:17px 20px;
}
.play-fab{width:54px;height:54px;box-shadow:0 12px 28px color-mix(in srgb,var(--orange-700) 32%,transparent)}
.dock-btn{width:42px;height:42px}
.statusbar{background:color-mix(in srgb,var(--paper) 55%,var(--surface));padding:9px 20px}

/* ---------- Balance / Transactions ---------- */
.balance-hero{
  border-radius:24px;
  padding:30px 28px;
  background:
    radial-gradient(circle at 88% 22%,rgba(255,255,255,.16),transparent 24%),
    linear-gradient(130deg,var(--orange-600),color-mix(in srgb,var(--orange-950) 70%,#111827 30%));
  box-shadow:0 16px 34px color-mix(in srgb,var(--orange-950) 18%,transparent);
}
.topup-chip{border-radius:12px;padding:12px 8px;background:color-mix(in srgb,var(--paper) 60%,var(--surface))}
.tx-row{padding:14px 20px}
.tx-icon{width:40px;height:40px}

/* ---------- Settings ---------- */
#settingsTabs{gap:7px;background:color-mix(in srgb,var(--paper) 60%,var(--surface));padding:6px;border:1px solid var(--line);border-radius:14px;width:max-content;max-width:100%;overflow:auto}
#settingsTabs .nav-link{border-radius:10px;color:var(--muted2);font-size:.84rem;font-weight:650;padding:8px 14px;white-space:nowrap}
#settingsTabs .nav-link.active{background:var(--surface);color:var(--orange-700);box-shadow:0 2px 7px rgba(16,24,40,.08)}
.avatar-preview{width:84px;height:84px;border:4px solid var(--surface);box-shadow:0 0 0 1px var(--line),0 10px 28px rgba(16,24,40,.12)}

/* ---------- Auth ---------- */
.auth-modal-backdrop{
  background:
    radial-gradient(circle at 70% 20%,color-mix(in srgb,var(--orange-600) 25%,transparent),transparent 32%),
    rgba(9,14,21,.70);
  backdrop-filter:blur(18px);
}
.auth-card{
  max-width:460px;
  border-radius:26px;
  padding:34px 32px;
  border:1px solid color-mix(in srgb,var(--line) 72%,#fff);
  box-shadow:0 32px 80px rgba(0,0,0,.34);
}
.auth-card::before{
  content:"";position:absolute;inset-inline-start:0;top:0;width:100%;height:4px;
  background:linear-gradient(90deg,var(--gold),var(--orange-600),var(--orange-700));
}
.auth-brand{padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:24px}
.auth-brand b{font-size:1.12rem}
.auth-form h2{font-size:1.36rem;letter-spacing:-.03em}
.auth-form .sub{margin-top:6px;margin-bottom:20px}
.auth-form .form-control{min-height:46px;border-radius:12px;padding-inline:13px;background:color-mix(in srgb,var(--paper) 52%,var(--surface))}
.lang-switch-modal .btn{background:var(--surface);border-radius:999px!important;padding:5px 11px}

/* ---------- Dark-mode fixes for Bootstrap utility surfaces ---------- */
[data-theme="dark"] .bg-light,
[data-theme="dark"] .bg-white{background-color:color-mix(in srgb,var(--surface) 90%,#000)!important}
[data-theme="dark"] .text-muted{color:var(--muted2)!important}
[data-theme="dark"] .dropdown-menu{background:var(--surface);border-color:var(--line);box-shadow:var(--ks-shadow)}
[data-theme="dark"] .dropdown-item{color:var(--ink)}
[data-theme="dark"] .dropdown-item:hover{background:color-mix(in srgb,var(--orange-600) 9%,var(--surface));color:var(--ink)}
[data-theme="dark"] .btn-light{background:color-mix(in srgb,var(--surface) 88%,#000);border-color:var(--line);color:var(--ink)}

/* ---------- Responsive ---------- */
@media (max-width:1199.98px){
  .content-scroll{padding:22px}
  .dashboard-balance-card{padding:24px}
}
@media (max-width:991.98px){
  .sidebar{width:286px;inset-inline-start:-298px;padding-top:8px}
  .sidebar.show{inset-inline-start:0;box-shadow:24px 0 70px rgba(0,0,0,.28)}
  .topbar{padding:11px 18px;min-height:68px}
  #sidebarCollapseBtn{display:none}
  .content-scroll{padding:18px}
}
@media (max-width:767.98px){
  .dashboard-balance-card{min-height:auto;border-radius:20px;padding:22px}
  .dashboard-balance-card .balance-amount{font-size:2rem}
  .panel,.glow-panel{border-radius:18px}
  .panel-head{min-height:56px;padding:13px 15px}
  #section-dashboard .panel.mb-3 .row>.col-3{width:50%}
}
@media (max-width:575.98px){
  .topbar{padding:9px 12px;gap:7px}
  .topbar .page-sub{display:none}
  .topbar .page-title{font-size:1rem}
  .content-scroll{padding:12px}
  .dashboard-balance-card{padding:20px}
  .dashboard-balance-card .balance-amount{font-size:1.78rem}
  .auth-card{padding:30px 22px;border-radius:22px}
  #settingsTabs{width:100%}
  #editor,#asrEditor,#ocrEditor{min-height:330px}
}

/* =========================================================
   Dashboard Clean Layout — calmer, less crowded hierarchy
   ========================================================= */
.dashboard-clean{max-width:1440px;margin:0 auto}
.dash-overview{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,410px);gap:18px;align-items:stretch}
.dash-overview-main{border:1px solid var(--line);background:var(--surface);border-radius:22px;padding:26px 28px;display:flex;flex-direction:column;justify-content:center;min-height:164px;position:relative;overflow:hidden}
.dash-overview-main::after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;inset-inline-end:-72px;top:-82px;background:color-mix(in srgb,var(--orange-600) 8%,transparent);pointer-events:none}
.dash-eyebrow{display:inline-flex;align-items:center;gap:7px;width:max-content;color:var(--orange-700);font-size:.74rem;font-weight:800;margin-bottom:10px}
.dash-eyebrow i{font-size:.9rem}
.dash-welcome{font-size:1.55rem;font-weight:900;margin:0 0 7px;letter-spacing:-.02em;color:var(--ink)}
.dash-welcome-sub{margin:0;color:var(--muted2);font-size:.85rem;line-height:1.8;max-width:580px}
.dash-wallet-card{border-radius:22px;padding:22px 24px;background:linear-gradient(135deg,var(--orange-800),var(--orange-950));color:#fff;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;box-shadow:0 12px 30px color-mix(in srgb,var(--orange-950) 16%,transparent)}
.dash-wallet-card::after{content:"";position:absolute;width:170px;height:170px;border-radius:50%;inset-inline-end:-70px;top:-70px;background:radial-gradient(circle,rgba(255,255,255,.16),transparent 68%)}
.dash-wallet-label{display:flex;align-items:center;gap:8px;position:relative;z-index:1;font-size:.78rem;color:rgba(255,255,255,.74)}
.dash-wallet-value{position:relative;z-index:1;font-size:1.9rem;line-height:1.2;font-weight:900;margin:10px 0 15px}
.dash-wallet-value small{font-size:.76rem;font-weight:600;color:rgba(255,255,255,.7)}
.dash-wallet-action{position:relative;z-index:1;width:max-content;border:0;border-radius:10px;background:rgba(255,255,255,.12);color:#fff;padding:7px 11px;font-size:.77rem;font-weight:700;display:inline-flex;align-items:center;gap:7px;transition:.2s ease}
.dash-wallet-action:hover{background:#fff;color:var(--orange-900);transform:translateY(-1px)}

.dash-service-card{--service:#64748b;height:100%;border:1px solid var(--line);border-radius:20px;background:var(--surface);padding:18px 18px 15px;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.dash-service-card:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(29,41,57,.07);border-color:color-mix(in srgb,var(--service) 28%,var(--line))}
.service-tts{--service:var(--orange-600)}
.service-asr{--service:#0f9f6e}
.service-ocr{--service:#7c5ce5}
.dash-service-head{display:flex;align-items:center;gap:11px;margin-bottom:18px}
.dash-service-icon{width:42px;height:42px;border-radius:13px;background:color-mix(in srgb,var(--service) 11%,var(--surface));color:var(--service);display:flex;align-items:center;justify-content:center;font-size:1.05rem;flex:0 0 auto}
.dash-service-kicker{font-size:.63rem;font-weight:900;letter-spacing:.12em;color:var(--service);margin-bottom:2px}
.dash-service-head h3{font-size:.88rem;font-weight:800;margin:0;color:var(--ink)}
.dash-open-btn{width:34px;height:34px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--muted2);display:flex;align-items:center;justify-content:center;transition:.18s ease}
.dash-open-btn:hover{background:color-mix(in srgb,var(--service) 9%,var(--surface));border-color:color-mix(in srgb,var(--service) 25%,var(--line));color:var(--service)}
[dir="ltr"] .dash-open-btn i,[dir="ltr"] .dash-ticket-action i{transform:rotate(180deg)}
.dash-service-primary{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:13px}
.dash-service-primary>div{border-inline-start:2px solid color-mix(in srgb,var(--service) 40%,var(--line));padding-inline-start:11px;min-width:0}
.dash-service-primary strong{display:block;font-size:1.35rem;font-weight:900;line-height:1.15;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dash-service-primary span{display:block;font-size:.7rem;color:var(--muted2);margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dash-service-meta{border-top:1px solid var(--line);padding-top:11px;display:flex;gap:14px;align-items:center;justify-content:space-between;color:var(--muted2);font-size:.69rem}
.dash-service-meta span{display:flex;align-items:center;gap:6px;min-width:0}
.dash-service-meta i{color:var(--service)}
.dash-service-meta b{font-weight:700;color:var(--muted2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}

.dash-ticket-strip{border:1px solid var(--line);background:var(--surface);border-radius:18px;padding:13px 16px;display:flex;align-items:center;gap:18px}
.dash-ticket-title{display:flex;align-items:center;gap:10px;min-width:220px}
.dash-ticket-icon{width:38px;height:38px;border-radius:12px;background:color-mix(in srgb,var(--orange-600) 9%,var(--surface));color:var(--orange-700);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.dash-ticket-title strong{display:block;font-size:.8rem;color:var(--ink)}
.dash-ticket-title small{display:block;font-size:.65rem;color:var(--muted2);margin-top:2px}
.dash-ticket-metrics{display:flex;align-items:center;justify-content:center;flex:1;gap:0}
.dash-ticket-metrics span{display:flex;align-items:baseline;gap:5px;padding:2px 16px;border-inline-start:1px solid var(--line)}
.dash-ticket-metrics span:first-child{border-inline-start:0}
.dash-ticket-metrics b{font-size:1rem;color:var(--ink);font-weight:900}
.dash-ticket-metrics small{font-size:.65rem;color:var(--muted2);white-space:nowrap}
.dash-ticket-action{border:0;background:transparent;color:var(--orange-700);font-size:.72rem;font-weight:800;display:inline-flex;align-items:center;gap:6px;padding:7px 3px;white-space:nowrap}
.dash-ticket-action:hover{color:var(--orange-600)}

.dash-detail-panel{border-radius:20px}
.dash-detail-panel .panel-head{padding:15px 18px}
.dash-detail-panel .panel-head h6{font-size:.82rem}
.dash-view-all{font-size:.7rem;font-weight:700;color:var(--orange-700)!important}
.dashboard-clean .bar-row{padding:7px 0}
.dashboard-clean .bar-track{height:6px;background:color-mix(in srgb,var(--line) 75%,var(--surface))}
.dashboard-clean .doc-row{padding:11px 18px}
.dashboard-clean .doc-icon{width:34px;height:34px;border-radius:10px}

@media (max-width:991.98px){
  .dash-overview{grid-template-columns:1fr}
  .dash-wallet-card{min-height:145px}
  .dash-ticket-strip{align-items:flex-start;flex-wrap:wrap}
  .dash-ticket-title{min-width:0;flex:1 1 240px}
  .dash-ticket-metrics{order:3;flex:1 0 100%;justify-content:flex-start;overflow-x:auto;padding-top:9px;border-top:1px solid var(--line)}
}
@media (max-width:575.98px){
  .dash-overview-main,.dash-wallet-card{border-radius:17px;padding:19px 18px;min-height:auto}
  .dash-welcome{font-size:1.25rem}
  .dash-service-card{border-radius:17px;padding:15px}
  .dash-ticket-strip{border-radius:16px;padding:12px}
  .dash-ticket-metrics{justify-content:space-between;gap:6px}
  .dash-ticket-metrics span{padding:2px 8px;border-inline-start:0;flex-direction:column;align-items:center;gap:1px}
  .dash-ticket-metrics b{font-size:.95rem}
  .dash-ticket-title small{display:none}
}

/* ============ Auth password policy ============ */
.password-requirements{
  display:flex;
  align-items:flex-start;
  gap:8px;
  padding:9px 11px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--paper);
  color:var(--muted2);
  font-size:.74rem;
  line-height:1.7;
}
.password-requirements.valid{
  border-color:rgba(22,163,74,.35);
  background:rgba(22,163,74,.07);
  color:#15803d;
}
.password-requirements.invalid{
  border-color:rgba(192,57,43,.25);
  background:rgba(192,57,43,.05);
  color:var(--danger);
}

/* ============ ASR / OCR resource archives ============ */
.resource-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.resource-header h5{font-weight:800;}
.resource-list{min-height:120px;}
.resource-empty{
  padding:30px 18px;
  text-align:center;
  color:var(--muted2);
  font-size:.84rem;
}
.resource-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:13px 16px;
  border-bottom:1px solid var(--line);
}
.resource-item:last-child{border-bottom:none;}
.resource-item:hover{background:var(--paper);}
.resource-item-icon{
  width:40px;
  height:40px;
  border-radius:11px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  background:var(--orange-100);
  color:var(--orange-700);
}
.resource-item-main{min-width:0; flex:1;}
.resource-item-title{
  font-weight:700;
  font-size:.86rem;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.resource-item-meta{
  display:flex;
  flex-wrap:wrap;
  gap:6px 12px;
  margin-top:3px;
  color:var(--muted2);
  font-size:.72rem;
}
.resource-actions{display:flex; align-items:center; gap:5px; flex:0 0 auto;}
.job-status{
  display:inline-flex;
  align-items:center;
  padding:3px 8px;
  border-radius:999px;
  font-size:.68rem;
  font-weight:700;
  border:1px solid transparent;
}
.job-status.queued{background:#fff7ed;color:#c2410c;border-color:#fed7aa;}
.job-status.processing{background:#eff6ff;color:#1d4ed8;border-color:#bfdbfe;}
.job-status.completed{background:#f0fdf4;color:#15803d;border-color:#bbf7d0;}
.job-status.failed{background:#fef2f2;color:#b91c1c;border-color:#fecaca;}
.job-status.cancelled{background:#f8fafc;color:#64748b;border-color:#e2e8f0;}
[data-theme="dark"] .job-status.queued,
[data-theme="dark"] .job-status.processing,
[data-theme="dark"] .job-status.completed,
[data-theme="dark"] .job-status.failed,
[data-theme="dark"] .job-status.cancelled{background:var(--paper);}
@media (max-width:575.98px){
  .resource-item{align-items:flex-start;}
  .resource-actions{flex-direction:column;}
}


/* ============ Global bottom toast notifications ============ */
.dash-thankyou{margin:13px 0 0;max-width:760px;color:var(--muted2);font-size:.86rem;line-height:1.9;padding-inline-start:14px;border-inline-start:3px solid color-mix(in srgb,var(--orange-600) 55%,transparent)}
.app-toast-region{position:fixed;inset-inline:0;bottom:22px;z-index:2000;display:flex;flex-direction:column;align-items:center;gap:10px;padding:0 14px;pointer-events:none}
.app-toast{width:min(520px,calc(100vw - 28px));display:grid;grid-template-columns:42px minmax(0,1fr) 30px;align-items:center;gap:10px;background:color-mix(in srgb,var(--surface) 96%,transparent);color:var(--ink);border:1px solid var(--line);border-radius:16px;padding:11px 12px;box-shadow:0 18px 48px rgba(24,20,16,.18);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);pointer-events:auto;opacity:0;transform:translateY(18px) scale(.98);transition:opacity .22s ease,transform .22s ease,border-color .22s ease;overflow:hidden;position:relative}
.app-toast.show{opacity:1;transform:translateY(0) scale(1)}
.app-toast.hide{opacity:0;transform:translateY(12px) scale(.98)}
.app-toast::after{content:"";position:absolute;inset-inline-start:0;bottom:0;height:3px;width:100%;background:var(--toast-accent);transform-origin:inline-start;animation:toastLife var(--toast-duration,4200ms) linear forwards}
.app-toast-icon{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--toast-accent) 13%,transparent);color:var(--toast-accent);font-size:1.05rem}
.app-toast-message{font-size:.84rem;line-height:1.75;font-weight:600;overflow-wrap:anywhere;white-space:pre-line}
.app-toast-close{width:28px;height:28px;border:0;border-radius:9px;background:transparent;color:var(--muted2);display:flex;align-items:center;justify-content:center;cursor:pointer}
.app-toast-close:hover{background:var(--paper);color:var(--ink)}
.app-toast-success{--toast-accent:#16a34a;border-color:color-mix(in srgb,#16a34a 24%,var(--line))}
.app-toast-error{--toast-accent:#dc2626;border-color:color-mix(in srgb,#dc2626 24%,var(--line))}
.app-toast-warning{--toast-accent:#d97706;border-color:color-mix(in srgb,#d97706 24%,var(--line))}
.app-toast-info{--toast-accent:#2563eb;border-color:color-mix(in srgb,#2563eb 24%,var(--line))}
@keyframes toastLife{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@media (max-width:575.98px){.app-toast-region{bottom:12px}.app-toast{grid-template-columns:38px minmax(0,1fr) 28px;border-radius:14px;padding:10px}.app-toast-icon{width:34px;height:34px;border-radius:10px}.dash-thankyou{font-size:.8rem}}

/* ================= Admin Console ================= */
.admin-console{--admin-accent:#2563eb;--admin-soft:rgba(37,99,235,.08)}
.admin-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:26px 28px;border-radius:22px;background:linear-gradient(135deg,var(--orange-950),var(--orange-800));color:#fff;position:relative;overflow:hidden;box-shadow:0 16px 34px rgba(23,36,30,.16)}
.admin-hero:after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;inset-inline-end:-60px;top:-100px;background:radial-gradient(circle,rgba(255,255,255,.16),transparent 68%)}
.admin-hero>div,.admin-refresh-btn{position:relative;z-index:1}.admin-hero h2{font-size:1.5rem;font-weight:800;margin:5px 0}.admin-hero p{margin:0;color:rgba(255,255,255,.72);font-size:.88rem}.admin-eyebrow{font-size:.72rem;font-weight:700;letter-spacing:.04em;display:flex;align-items:center;gap:7px;color:#d9f99d}
.admin-refresh-btn{display:flex;align-items:center;gap:7px;border:0;border-radius:12px;font-weight:700;padding:9px 14px}
.admin-stat-card{height:100%;min-height:126px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:4px;position:relative;overflow:hidden;transition:.2s ease}
.admin-stat-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(0,0,0,.07);border-color:var(--orange-500)}
.admin-stat-card>i{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:var(--orange-100);color:var(--orange-700);font-size:1rem}.admin-stat-card strong{font-size:1.45rem;font-weight:850;line-height:1.15;margin-top:5px}.admin-stat-card span{font-size:.78rem;font-weight:700}.admin-stat-card small{font-size:.68rem;color:var(--muted2)}
.admin-panel{overflow:hidden}.admin-tabs{display:flex;gap:4px;padding:8px;background:var(--paper);border-bottom:1px solid var(--line);overflow-x:auto}.admin-tabs button{border:0;background:transparent;color:var(--muted2);padding:9px 14px;border-radius:10px;font-size:.82rem;font-weight:700;display:flex;align-items:center;gap:7px;white-space:nowrap}.admin-tabs button:hover{background:var(--surface);color:var(--ink)}.admin-tabs button.active{background:var(--surface);color:var(--orange-700);box-shadow:0 3px 12px rgba(0,0,0,.05)}
.admin-tab-pane{min-height:300px}.admin-toolbar{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line);flex-wrap:wrap}.admin-toolbar .form-select{max-width:190px}.admin-search{max-width:430px;min-width:240px}.admin-search .input-group-text{background:var(--surface);border-color:var(--line);color:var(--muted2)}
.admin-table{font-size:.79rem;color:var(--ink)}.admin-table thead th{font-size:.7rem;text-transform:none;letter-spacing:.01em;color:var(--muted2);font-weight:700;background:var(--paper);border-bottom:1px solid var(--line);padding:11px 14px;white-space:nowrap}.admin-table tbody td{padding:12px 14px;border-color:var(--line);vertical-align:middle}.admin-table tbody tr:hover{background:var(--orange-100)}
.admin-user-cell{display:flex;align-items:center;gap:9px;min-width:160px}.admin-mini-avatar{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,var(--orange-100),var(--gold-soft));color:var(--orange-700);font-weight:800;flex-shrink:0}.admin-user-cell strong{display:block;font-size:.8rem}.admin-user-cell small{display:block;color:var(--muted2);font-size:.68rem}.admin-role-badge{display:inline-flex;padding:2px 7px;border-radius:999px;background:var(--paper);border:1px solid var(--line);font-size:.65rem;margin:1px}.admin-role-badge.admin{background:#fef2f2;color:#b91c1c;border-color:#fecaca}.admin-role-badge.support{background:#eff6ff;color:#1d4ed8;border-color:#bfdbfe}
.admin-status{display:inline-flex;align-items:center;gap:5px;font-size:.69rem;font-weight:700;padding:4px 8px;border-radius:999px}.admin-status.active{background:#ecfdf3;color:#15803d}.admin-status.inactive{background:#fef2f2;color:#b91c1c}.admin-status:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.admin-actions{display:flex;gap:5px;flex-wrap:wrap}.admin-actions .btn{padding:.25rem .45rem;font-size:.7rem}
.admin-table-footer{padding:9px 16px;border-top:1px solid var(--line);font-size:.72rem;color:var(--muted2);background:var(--paper)}
.admin-modal{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:18px}.admin-modal .modal-header,.admin-modal .modal-footer{border-color:var(--line)}.admin-user-summary{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;background:var(--paper);border:1px solid var(--line)}.admin-user-avatar{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:var(--orange-100);color:var(--orange-700);font-size:1.1rem}.admin-management-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.admin-management-box{border:1px solid var(--line);background:var(--paper);border-radius:14px;padding:14px}.admin-management-box h6{font-size:.8rem;font-weight:800;display:flex;gap:7px;align-items:center;margin-bottom:12px}
.admin-ticket-messages{display:flex;flex-direction:column;gap:10px}.admin-ticket-message{max-width:88%;border:1px solid var(--line);border-radius:14px;padding:11px 13px;background:var(--paper);font-size:.8rem;line-height:1.8}.admin-ticket-message.support{margin-inline-start:auto;background:var(--orange-100);border-color:var(--orange-500)}.admin-ticket-message .meta{font-size:.65rem;color:var(--muted2);margin-bottom:5px}.admin-ticket-attachment{display:inline-flex;gap:4px;align-items:center;margin-top:5px;font-size:.68rem;color:var(--orange-700)}
.admin-job-status{font-size:.66rem;padding:3px 8px;border-radius:999px;background:var(--paper);border:1px solid var(--line);font-weight:700}.admin-job-status.completed{background:#ecfdf3;color:#15803d}.admin-job-status.failed{background:#fef2f2;color:#b91c1c}.admin-job-status.processing{background:#eff6ff;color:#1d4ed8}.admin-job-status.queued{background:#fffbeb;color:#a16207}.admin-job-status.cancelled{background:#f3f4f6;color:#4b5563}
[data-theme="dark"] .admin-status.active{background:rgba(22,163,74,.16)}[data-theme="dark"] .admin-status.inactive{background:rgba(220,38,38,.16)}[data-theme="dark"] .admin-role-badge.admin{background:rgba(220,38,38,.14);border-color:rgba(220,38,38,.28)}[data-theme="dark"] .admin-role-badge.support{background:rgba(37,99,235,.14);border-color:rgba(37,99,235,.28)}
@media(max-width:767.98px){.admin-hero{align-items:flex-start;flex-direction:column;padding:20px}.admin-hero h2{font-size:1.2rem}.admin-management-grid{grid-template-columns:1fr}.admin-toolbar>*{max-width:none!important;width:100%}.admin-search{min-width:0}.admin-stat-card{min-height:112px}.admin-table{min-width:760px}}
.admin-job-detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}.admin-job-detail-item{border:1px solid var(--line);background:var(--paper);border-radius:12px;padding:10px}.admin-job-detail-item small{display:block;color:var(--muted2);font-size:.65rem;margin-bottom:3px}.admin-job-detail-item strong{font-size:.78rem;word-break:break-word}.admin-job-content{border:1px solid var(--line);background:var(--paper);border-radius:14px;padding:14px;margin-top:12px}.admin-job-content h6{font-size:.78rem;font-weight:800;margin-bottom:8px}.admin-job-text{white-space:pre-wrap;word-break:break-word;max-height:320px;overflow:auto;margin:0;font-family:inherit;font-size:.8rem;line-height:1.8;color:var(--ink)}
@media(max-width:767.98px){.admin-job-detail-grid{grid-template-columns:1fr 1fr}}

/* =========================================================
   v6.3 — Auth usability: scrollable signup, password reveal,
   and independent Admin Login surface
   ========================================================= */
.auth-modal-backdrop{
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
.auth-card{
  max-height:calc(100dvh - 40px);
  overflow-x:hidden;
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb,var(--orange-600) 42%,var(--line)) transparent;
}
.auth-card::-webkit-scrollbar{width:7px}
.auth-card::-webkit-scrollbar-track{background:transparent}
.auth-card::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--orange-600) 38%,var(--line));border-radius:999px}
.auth-card::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--orange-600) 55%,var(--line))}

.password-field{position:relative;width:100%}
.password-field>.form-control{padding-inline-end:46px!important;margin-bottom:0!important}
.password-toggle{
  position:absolute;
  inset-inline-end:7px;
  top:50%;
  transform:translateY(-50%);
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:9px;
  background:transparent;
  color:var(--muted2);
  z-index:3;
  transition:background .16s ease,color .16s ease,transform .16s ease;
}
.password-toggle:hover,.password-toggle:focus-visible{
  color:var(--orange-700);
  background:color-mix(in srgb,var(--orange-600) 10%,transparent);
  outline:none;
}
.password-toggle:active{transform:translateY(-50%) scale(.94)}
.password-toggle i{font-size:1rem;pointer-events:none}

.auth-admin-entry{
  margin-top:14px;
  padding-top:13px;
  border-top:1px dashed var(--line);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  font-size:.82rem;
}
.auth-admin-entry i{color:var(--orange-700)}
.auth-admin-entry a{color:var(--ink);font-weight:750}
.auth-admin-entry a:hover{color:var(--orange-700)}

.admin-login-form{padding-top:2px}
.admin-login-heading{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:22px;
  padding:14px;
  border:1px solid color-mix(in srgb,var(--orange-600) 18%,var(--line));
  border-radius:16px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--orange-600) 8%,var(--surface)),var(--surface));
}
.admin-login-heading h2{margin:0 0 2px!important;font-size:1.18rem!important}
.admin-login-heading .sub{font-size:.76rem!important}
.admin-login-icon{
  width:46px;
  height:46px;
  flex:0 0 46px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:1.15rem;
  background:linear-gradient(145deg,var(--orange-600),var(--orange-800));
  box-shadow:0 9px 22px color-mix(in srgb,var(--orange-700) 25%,transparent);
}
.admin-login-submit{min-height:46px}
.admin-security-note{
  display:flex;
  align-items:flex-start;
  gap:7px;
  margin-top:12px;
  padding:9px 11px;
  border-radius:10px;
  background:color-mix(in srgb,var(--orange-600) 6%,var(--surface));
  color:var(--muted2);
  font-size:.73rem;
  line-height:1.7;
}
.admin-security-note i{color:var(--orange-700);margin-top:2px}

@media (max-height:720px){
  .auth-modal-backdrop{align-items:flex-start;padding-block:14px}
  .auth-card{max-height:calc(100dvh - 28px)}
  .auth-brand{margin-bottom:18px;padding-bottom:12px}
}
@media (max-width:575.98px){
  .auth-modal-backdrop{padding:10px;align-items:flex-start}
  .auth-card{max-height:calc(100dvh - 20px);padding:24px 18px;border-radius:20px}
  .lang-switch-modal{top:14px;inset-inline-end:14px}
  .admin-login-heading{margin-top:4px}
}

/* =========================================================
   v6.7 — Payment purpose / optional payer description
   ========================================================= */
.payment-metadata-card{
  border:1px solid var(--line);
  background:color-mix(in srgb,var(--paper) 58%,var(--surface));
  border-radius:14px;
  padding:14px;
}
.payment-metadata-card .form-label{color:var(--ink);margin-bottom:6px}
.payment-metadata-card .form-select,.payment-metadata-card .form-control{background:var(--surface);border-color:var(--line)}
.payment-metadata-card textarea{resize:vertical;min-height:88px}
.payment-metadata-card .form-text{color:var(--muted2);font-size:.69rem;line-height:1.7}
.payment-purpose-badge{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;background:color-mix(in srgb,var(--orange-600) 9%,var(--surface));border:1px solid color-mix(in srgb,var(--orange-600) 18%,var(--line));color:var(--orange-700);font-size:.68rem;font-weight:750;white-space:nowrap}
.admin-payments-table{min-width:1080px}
.admin-payment-description{min-width:180px;max-width:340px;white-space:normal;word-break:break-word;line-height:1.65}
.payment-authority{display:block;max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:ltr;text-align:start}
.admin-job-status.verified{background:#ecfdf3;color:#15803d}.admin-job-status.pending{background:#fffbeb;color:#a16207}.admin-job-status.redirected{background:#eff6ff;color:#1d4ed8}
[data-theme="dark"] .admin-job-status.verified{background:rgba(22,163,74,.16)}[data-theme="dark"] .admin-job-status.pending{background:rgba(217,119,6,.16)}[data-theme="dark"] .admin-job-status.redirected{background:rgba(37,99,235,.16)}