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

/* Light theme is the default - applies to :root */
:root,
body,
body.theme-light {
  /* ============================================
     BACKGROUNDS
     ============================================ */
  --background-body: #f0f2f5;
  --background-primary: rgba(255, 255, 255, 0.95);
  --background-secondary: rgba(248, 249, 250, 0.9);
  --background-tertiary: rgba(233, 236, 239, 0.8);
  --background-navbar: rgba(255, 255, 255, 0.75);
  --background-sidebar: rgba(255, 255, 255, 0.95);
  --background-input: #ffffff;
  --background-input-focus: #ffffff;
  --background-dropdown: #ffffff;
  --background-card: rgba(255, 255, 255, 0.95);
  --background-card-solid: #ffffff;
  --background-hover: rgba(0, 0, 0, 0.04);

  /* ============================================
     TEXT
     ============================================ */
  --text-primary: #212529;
  --text-secondary: #495057;
  --text-muted: #6c757d;
  --text-dim: #9e9e9e;
  --text-inverted: #ffffff;
  --text-placeholder: #adb5bd;

  /* ============================================
     BORDERS
     ============================================ */
  --border-primary: rgba(0, 0, 0, 0.1);
  --border-secondary: rgba(0, 0, 0, 0.08);
  --border-light: rgba(0, 0, 0, 0.05);
  --border-focus: #86b7fe;
  --border-left-accent: var(--module-color);

  /* ============================================
     SHADOWS
     ============================================ */
  --shadow-color: rgba(0, 0, 0, 0.1);
  --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.15);

  /* ============================================
     BADGES - Light Mode
     ============================================ */
  --badge-success-bg: #d1e7dd;
  --badge-success-fg: #0f5132;
  --badge-success-border: #badbcc;

  --badge-warning-bg: #fff3cd;
  --badge-warning-fg: #664d03;
  --badge-warning-border: #ffecb5;

  --badge-danger-bg: #f8d7da;
  --badge-danger-fg: #842029;
  --badge-danger-border: #f5c2c7;

  --badge-info-bg: #d8e8f0;
  --badge-info-fg: #3a5a70;
  --badge-info-border: #c0d8e8;

  /* ============================================
     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.12);

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

  --btn-secondary-bg: rgba(0, 0, 0, 0.05);
  --btn-secondary-fg: var(--text-primary);
  --btn-secondary-border: var(--border-primary);

  /* Button action colors - Light Mode */
  --color-save-bg: #d4edda;
  --color-save-fg: #155724;
  --color-save-border: #c3e6cb;

  --color-create-bg: #d4e5f0;
  --color-create-fg: #3a5a70;
  --color-create-border: #b8d0e0;

  --color-reset-bg: #f8d7da;
  --color-reset-fg: #721c24;
  --color-reset-border: #f5c6cb;

  --color-secondary-bg: #e2e3e5;
  --color-secondary-fg: #383d41;
  --color-secondary-border: #d6d8db;

  /* ============================================
     RISK LEVEL BADGES - Light Mode
     ============================================ */
  --badge-risk-faible-bg: #d1e7dd;
  --badge-risk-faible-fg: #0f5132;
  --badge-risk-faible-border: #badbcc;

  --badge-risk-moyen-bg: #fff3cd;
  --badge-risk-moyen-fg: #664d03;
  --badge-risk-moyen-border: #ffecb5;

  --badge-risk-eleve-bg: #ffe5d0;
  --badge-risk-eleve-fg: #984c0c;
  --badge-risk-eleve-border: #fecba1;

  --badge-risk-critique-bg: #f8d7da;
  --badge-risk-critique-fg: #842029;
  --badge-risk-critique-border: #f5c2c7;

  /* ============================================
     STATUS BADGES - Light Mode
     ============================================ */
  --badge-status-complete-bg: #d1e7dd;
  --badge-status-complete-fg: #0f5132;
  --badge-status-complete-border: #badbcc;

  --badge-status-encours-bg: #d8e8f0;
  --badge-status-encours-fg: #3a5a70;
  --badge-status-encours-border: #c0d8e8;

  --badge-status-retard-bg: #f8d7da;
  --badge-status-retard-fg: #842029;
  --badge-status-retard-border: #f5c2c7;

  --badge-status-afaire-bg: #e2e3e5;
  --badge-status-afaire-fg: #41464b;
  --badge-status-afaire-border: #d3d6d8;

  /* ============================================
     SCROLLBAR - Light Mode
     ============================================ */
  --scrollbar-track: rgba(0, 0, 0, 0.05);
  --scrollbar-thumb: rgba(0, 0, 0, 0.15);
  --scrollbar-thumb-hover: rgba(0, 0, 0, 0.25);

  /* ============================================
     OVERLAY
     ============================================ */
  --overlay-light: rgba(255, 255, 255, 0.8);
  --overlay-dark: rgba(0, 0, 0, 0.5);

  /* ============================================
     LINKS
     ============================================ */
  --color-link: #1976d2;
  --color-link-hover: #115293;
}

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

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

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

body.theme-light::-webkit-scrollbar,
body:not(.theme-dark)::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

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

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

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

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

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

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

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

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

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