/* ============================================
   ASTERION THEME DARK - Standard Officiel
   Source: Asterion-Auditeur/standards/ui-styleguide.html
   Version: 1.1.0
   Date: 2025-12-21
   ============================================ */

body.theme-dark {
  /* ============================================
     BACKGROUNDS
     ============================================ */
  --background-body: #10141a;
  --background-primary: rgba(30, 38, 50, 0.6);
  --background-secondary: rgba(36, 45, 60, 0.5);
  --background-tertiary: rgba(42, 52, 70, 0.4);
  --background-navbar: rgba(26, 32, 44, 0.5);
  --background-sidebar: rgba(26, 32, 44, 0.92);
  --background-input: rgba(42, 52, 70, 0.4);
  --background-input-focus: rgba(50, 60, 80, 0.6);
  --background-dropdown: rgba(22, 28, 38, 0.95);
  --background-card: rgba(30, 38, 50, 0.6);
  --background-card-solid: #1e2632;
  --background-hover: rgba(255, 255, 255, 0.05);

  /* ============================================
     TEXT
     ============================================ */
  --text-primary: #e0e0e0;
  --text-secondary: #bdbdbd;
  --text-muted: #9e9e9e;
  --text-dim: #6c757d;
  --text-inverted: #ffffff;
  --text-placeholder: #757575;

  /* ============================================
     BORDERS
     ============================================ */
  --border-primary: rgba(255, 255, 255, 0.1);
  --border-secondary: rgba(255, 255, 255, 0.08);
  --border-light: rgba(255, 255, 255, 0.04);
  --border-focus: #bb86fc;
  --border-left-accent: var(--module-color);

  /* ============================================
     SHADOWS
     ============================================ */
  --shadow-color: rgba(0, 0, 0, 0.3);
  --shadow-sm: 0 1px 2px var(--shadow-color);
  --shadow-md: 0 4px 6px var(--shadow-color);
  --shadow-lg: 0 10px 15px var(--shadow-color);
  --shadow-xl: 0 20px 25px var(--shadow-color);
  --shadow-glow: 0 0 20px rgba(90, 122, 158, 0.2);

  /* ============================================
     BADGES - Dark Mode
     ============================================ */
  --badge-success-bg: #1a3a1b;
  --badge-success-fg: #a5d6a7;
  --badge-success-border: #2e7d32;

  --badge-warning-bg: #403200;
  --badge-warning-fg: #fff59d;
  --badge-warning-border: #f9a825;

  --badge-danger-bg: #4b1010;
  --badge-danger-fg: #ef9a9a;
  --badge-danger-border: #c62828;

  --badge-info-bg: #2a4050;
  --badge-info-fg: #a8c8d8;
  --badge-info-border: #3a5a70;

  /* ============================================
     FORM ELEMENTS
     ============================================ */
  --input-bg: var(--background-input);
  --input-border: var(--border-primary);
  --input-focus-border: var(--module-color);
  --input-focus-shadow: 0 0 0 3px rgba(var(--module-color-rgb), 0.2);

  /* ============================================
     BUTTONS
     ============================================ */
  --btn-primary-bg: var(--module-color);
  --btn-primary-fg: #ffffff;
  --btn-primary-hover: var(--module-color-light);

  --btn-secondary-bg: rgba(255, 255, 255, 0.08);
  --btn-secondary-fg: var(--text-primary);
  --btn-secondary-border: var(--border-primary);

  /* Button action colors - Dark Mode */
  --color-save-bg: #1b5e20;
  --color-save-fg: #66bb6a;
  --color-save-border: #2e7d32;

  --color-create-bg: #2a4050;
  --color-create-fg: #a8c8d8;
  --color-create-border: #3a5a70;

  --color-reset-bg: #e53e3e;
  --color-reset-fg: #ffffff;
  --color-reset-border: #c53030;

  --color-secondary-bg: #37474f;
  --color-secondary-fg: #eceff1;
  --color-secondary-border: #546e7a;

  /* ============================================
     RISK LEVEL BADGES - Dark Mode
     ============================================ */
  --badge-risk-faible-bg: #1a3a1b;
  --badge-risk-faible-fg: #a5d6a7;
  --badge-risk-faible-border: #2e7d32;

  --badge-risk-moyen-bg: #403200;
  --badge-risk-moyen-fg: #fff59d;
  --badge-risk-moyen-border: #f9a825;

  --badge-risk-eleve-bg: #5d2b00;
  --badge-risk-eleve-fg: #ffcc80;
  --badge-risk-eleve-border: #ef6c00;

  --badge-risk-critique-bg: #4b1010;
  --badge-risk-critique-fg: #ef9a9a;
  --badge-risk-critique-border: #c62828;

  /* ============================================
     STATUS BADGES - Dark Mode
     ============================================ */
  --badge-status-complete-bg: #1b5e20;
  --badge-status-complete-fg: #c8e6c9;
  --badge-status-complete-border: #2e7d32;

  --badge-status-encours-bg: #2a4050;
  --badge-status-encours-fg: #a8c8d8;
  --badge-status-encours-border: #3a5a70;

  --badge-status-retard-bg: #b71c1c;
  --badge-status-retard-fg: #ffcdd2;
  --badge-status-retard-border: #d32f2f;

  --badge-status-afaire-bg: #37474f;
  --badge-status-afaire-fg: #eceff1;
  --badge-status-afaire-border: #546e7a;

  /* ============================================
     SCROLLBAR - Dark Mode
     ============================================ */
  --scrollbar-track: rgba(0, 0, 0, 0.2);
  --scrollbar-thumb: rgba(255, 255, 255, 0.15);
  --scrollbar-thumb-hover: rgba(255, 255, 255, 0.25);

  /* ============================================
     OVERLAY
     ============================================ */
  --overlay-light: rgba(30, 38, 50, 0.8);
  --overlay-dark: rgba(0, 0, 0, 0.7);

  /* ============================================
     LINKS
     ============================================ */
  --color-link: #8ab4f8;
  --color-link-hover: #a1c9ff;
}

/* ============================================
   BODY BACKGROUND WITH GRADIENT
   ============================================ */

body.theme-dark {
  background: var(--background-body);
  background-image:
    radial-gradient(ellipse at 20% 20%, rgba(90, 122, 158, 0.06) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 80%, rgba(90, 122, 158, 0.04) 0%, transparent 50%);
  background-attachment: fixed;
  color: var(--text-primary);
}

/* ============================================
   SCROLLBAR STYLING
   ============================================ */

body.theme-dark::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

body.theme-dark::-webkit-scrollbar-track {
  background: var(--scrollbar-track);
}

body.theme-dark::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb);
  border-radius: var(--radius-full);
}

body.theme-dark::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover);
}

/* ============================================
   GLASS EFFECT FOR CARDS (Dark Mode)
   ============================================ */

body.theme-dark .ast-card {
  background: var(--background-card);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* ============================================
   NAVBAR GLASS EFFECT
   ============================================ */

body.theme-dark .ast-navbar {
  background: var(--background-navbar);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* ============================================
   SIDEBAR STYLING
   ============================================ */

body.theme-dark .ast-sidebar {
  background: var(--background-sidebar);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* ============================================
   ENHANCED BUTTON GLOW (Dark Mode)
   ============================================ */

body.theme-dark .ast-btn-primary:hover {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    0 4px 12px rgba(var(--module-color-rgb), 0.3),
    0 0 20px rgba(var(--module-color-rgb), 0.15);
}

/* ============================================
   LINK STYLING (Dark Mode)
   ============================================ */

body.theme-dark a {
  color: var(--color-link);
}

body.theme-dark a:hover {
  color: var(--color-link-hover);
}

/* ============================================
   FOCUS RING (Dark Mode)
   ============================================ */

body.theme-dark :focus-visible {
  outline-color: var(--module-color);
  outline-offset: 2px;
}

/* ============================================
   SELECTION (Dark Mode)
   ============================================ */

body.theme-dark ::selection {
  background: rgba(var(--module-color-rgb), 0.4);
  color: var(--text-primary);
}