/* ViraTel dark (default) — original TeleCleaner/ViraTel palette */

:root,
[data-theme="dark"] {
  color-scheme: dark;

  /* Brand palette */
  --tc-teal: #14B8A6;
  --tc-teal-light: #2DD4BF;
  --tc-indigo: #6366F1;
  --tc-indigo-deep: #4F46E5;
  --tc-rose: #F43F5E;
  --tc-amber: #F59E0B;
  --tc-bg: #0B0F1A;
  --tc-layer: #10182C;
  --tc-surface: #12182A;
  --tc-surface-elevated: #1A2238;
  --tc-surface-muted: #0E1424;
  --tc-surface-hover: #172038;
  --tc-surface-pressed: #0F1628;
  --tc-surface-card: #1A2238;
  --tc-stroke: #2A3555;
  --tc-stroke-strong: #445578;
  --tc-backdrop-top: #080C16;
  --tc-input-border: #2E3A5C;
  --tc-shell-pane-border: #24304D;
  --tc-layer-alt: #121A2E;

  /* Soft accents — CSS #RRGGBBAA (~20% opacity) */
  --tc-teal-soft: #14B8A633;
  --tc-indigo-soft: #6366F133;
  --tc-rose-soft: #F43F5E33;
  --tc-amber-soft: #F59E0B33;
  --tc-selected: #14B8A633;
  --tc-on-accent: #FFFFFF;
  --tc-overlay: #0B0F1ACC;

  /* Text */
  --tc-text-primary: #F8FAFC;
  --tc-text-secondary: #94A3B8;
  --tc-text-tertiary: #64748B;

  /* Gradients */
  --tc-brand-gradient: linear-gradient(135deg, var(--tc-teal) 0%, var(--tc-indigo) 100%);
  --tc-hero-gradient: linear-gradient(90deg, #14B8A61A 0%, #1A2238 55%, #6366F11A 100%);
  --tc-hero-border: linear-gradient(135deg, #14B8A655 0%, #6366F155 100%);
  --tc-card-shine: linear-gradient(180deg, #FFFFFF18 0%, #FFFFFF08 8%, #FFFFFF00 100%);
  --tc-shell-titlebar: linear-gradient(180deg, #121A2E 0%, #0E1424 100%);
  --tc-backdrop-overlay: linear-gradient(180deg, #080C16 0%, #080C1600 100%);

  /* Glow */
  --tc-glow-teal: radial-gradient(circle, #14B8A666 0%, #14B8A600 100%);
  --tc-glow-indigo: radial-gradient(circle, #6366F155 0%, #6366F100 100%);

  /* Elevation */
  --tc-shadow-soft: 0 10px 28px rgba(0, 0, 0, 0.35);
  --tc-shadow-card: 0 1px 0 rgba(255, 255, 255, 0.04) inset, 0 12px 36px rgba(0, 0, 0, 0.32);
  --tc-focus-ring: 0 0 0 3px rgba(20, 184, 166, 0.22);
  --tc-help-tip-bg: #151E34;
  --tc-sidebar-footer-fade: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.12));

  /* Layout */
  --tc-page-margin: 28px 22px 24px 28px;
  --tc-sidebar-width: 240px;
  --tc-titlebar-height: 48px;
  --tc-mobile-status-height: 0px;
  --tc-safe-top: env(safe-area-inset-top, 0px);
  --tc-safe-right: env(safe-area-inset-right, 0px);
  --tc-safe-bottom: env(safe-area-inset-bottom, 0px);
  --tc-safe-left: env(safe-area-inset-left, 0px);
  --tc-font: "Vazirmatn", "Segoe UI", Tahoma, sans-serif;
  --tc-radius-sm: 12px;
  --tc-radius-md: 14px;
  --tc-radius-lg: 18px;
  --tc-radius-xl: 20px;
  --tc-radius-badge: 16px;
}

/* Light theme — same structure, daylight surfaces */
[data-theme="light"] {
  color-scheme: light;

  --tc-teal: #0D9488;
  --tc-teal-light: #14B8A6;
  --tc-indigo: #4F46E5;
  --tc-indigo-deep: #4338CA;
  --tc-rose: #E11D48;
  --tc-amber: #D97706;

  --tc-bg: #F4F7FB;
  --tc-layer: #FFFFFF;
  --tc-surface: #FFFFFF;
  --tc-surface-elevated: #FFFFFF;
  --tc-surface-muted: #EEF2F7;
  --tc-surface-hover: #E8EEF6;
  --tc-surface-pressed: #E2E8F0;
  --tc-surface-card: #FFFFFF;
  --tc-stroke: #D5DEEA;
  --tc-stroke-strong: #B6C3D6;
  --tc-backdrop-top: #E8EEF6;
  --tc-input-border: #C9D4E3;
  --tc-shell-pane-border: #D5DEEA;
  --tc-layer-alt: #F8FAFC;

  --tc-teal-soft: #0D948822;
  --tc-indigo-soft: #4F46E522;
  --tc-rose-soft: #E11D4822;
  --tc-amber-soft: #D9770622;
  --tc-selected: #0D948822;
  --tc-on-accent: #FFFFFF;
  --tc-overlay: #F4F7FBCC;

  --tc-text-primary: #0F172A;
  --tc-text-secondary: #475569;
  --tc-text-tertiary: #64748B;

  --tc-brand-gradient: linear-gradient(135deg, var(--tc-teal) 0%, var(--tc-indigo) 100%);
  --tc-hero-gradient: linear-gradient(90deg, #0D948814 0%, #FFFFFF 50%, #4F46E514 100%);
  --tc-hero-border: linear-gradient(135deg, #0D948855 0%, #4F46E555 100%);
  --tc-card-shine: linear-gradient(180deg, #FFFFFFAA 0%, #FFFFFF00 100%);
  --tc-shell-titlebar: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%);
  --tc-backdrop-overlay: linear-gradient(180deg, #E8EEF6 0%, #E8EEF600 100%);

  --tc-glow-teal: radial-gradient(circle, #14B8A633 0%, #14B8A600 100%);
  --tc-glow-indigo: radial-gradient(circle, #6366F122 0%, #6366F100 100%);

  --tc-shadow-soft: 0 10px 28px rgba(15, 23, 42, 0.08);
  --tc-shadow-card: 0 1px 0 rgba(255, 255, 255, 0.8) inset, 0 10px 28px rgba(15, 23, 42, 0.08);
  --tc-focus-ring: 0 0 0 3px rgba(13, 148, 136, 0.2);
  --tc-help-tip-bg: #FFFFFF;
  --tc-sidebar-footer-fade: linear-gradient(180deg, transparent, rgba(15, 23, 42, 0.04));
}
