/*****************************
 * VARIABLES GLOBALES (THEME CLAIR)
 *****************************/
:root {
  --color-background: #f9fafb;
  --color-text: #222;
  --color-ul: #000;
  --color-link: #004080;
  --color-link-hover: yellow;
  --color-accent-red: #b71c1c;
  --color-border: #888; /* gris visible */
  --color-border-dark: #555; /* si tu veux un autre gris pour le sombre */

  --color-section-bg: #fff;
  --color-section-shadow: rgba(0, 0, 0, 0.08);

  --color-btn-primary-bg: #004080;
  --color-btn-primary-bg-hover: #417199;
  --color-btn-primary-color: white;
  --color-btn-primary-hover-color: yellow;

  --color-header-bg: #004080;
  --color-header-color: white;
  --color-header-menu-span: white;

  --color-nav-ul-bg: #004080;
  --color-nav-ul-li-a-color: white;
  --color-nav-ul-li-a-hover: #ffd54f;

  --color-footer-bg: #002b55;
  --color-footer-color: white;
  --color-footer-link: #a3c7ff;
  --color-footer-link-hover: yellow;

  --color-card-actu-bg: transparent;
  --color-card-actu-color: #000;
  --color-card-actu-hover-bg: #004080;
  --color-card-actu-hover-color: #fff;

  --color-btn-actu-bg: #005daa;
  --color-btn-actu-color: white;

  --color-btn-share-bg: #eee;
  --color-btn-share-color: #333;
  --color-btn-share-hover-bg: #ccc;
  --color-btn-share-linkedin-bg: #0077b5;
  --color-btn-share-twitter-bg: #1da1f2;
  --color-btn-share-email-bg: #666;
  --color-btn-share-social-color: white;

  --color-chatbot-bg: #004080;
  --color-chatbot-color: black;
  --color-chatbot-window-bg: #fff;
  --color-chatbot-border: #ccc;
  --color-chatbot-header-bg: #004080;
  --color-chatbot-message-bg: #f0f0f0;
  --color-chatbot-button-bg: #004080;
  --color-chatbot-button-hover-bg: #0066cc;

  --color-form-bg: #fff;
  --color-form-border: #ccc;
  --color-form-btn-bg: #b80000;
  --color-form-btn-hover-bg: #8a0000;
  --color-form-btn-color: #fff;

  --color-hero-bg: #004080;
  --color-hero-color: white;

  --color-table-of-contents-bg: #004080;
  --color-table-of-contents-color: #ffffff;
  --color-table-of-contents-highlight-bg: #ffd54f;
  --color-table-of-contents-highlight-color: #000;

  /* Responsive and misc */
  --color-menu-burger-span-bg: white;
  --color-submenu-bg: #fff;
  --color-submenu-hover-bg: #f2f2f2;
}

/*****************************
 * DARK-MODE.CSS
 *****************************/
@media (prefers-color-scheme: dark) {
  :root {
    --color-background: #2c2c2c;
    --color-text: #e0e0e0;
    --color-ul: #fff;
    --color-link: #82b1ff;
    --color-link-hover: yellow;
    --color-accent-red: #ff6b6b;
    --color-border: #ccc; /* gris clair sur fond sombre */

    --color-section-bg: #1e1e1e;
    --color-section-shadow: rgba(255, 255, 255, 0.08);

    --color-btn-primary-bg: #1a73e8;
    --color-btn-primary-bg-hover: #2c84f6;
    --color-btn-primary-color: #fff;
    --color-btn-primary-hover-color: yellow;

    --color-header-bg: #1a1a1a;
    --color-header-color: white;
    --color-header-menu-span: white;

    --color-nav-ul-bg: #1f1f1f;
    --color-nav-ul-li-a-color: #fff;
    --color-nav-ul-li-a-hover: #ffd54f;
    
    --primary-color: #4CAF50;
	--secondary-color: #f2f2f2;
    --text-color: #333;
    --table-bg: #f9f9f9;
    --table-padding: 10px;
    --table-font: Arial, sans-serif;

    --color-footer-bg: #0d0d0d;
    --color-footer-color: #eee;
    --color-footer-link: #a3c7ff;
    --color-footer-link-hover: yellow;

    --color-card-actu-bg: #1a1a1a;
    --color-card-actu-color: #eee;
    --color-card-actu-hover-bg: #004080;
    --color-card-actu-hover-color: #fff;

    --color-btn-actu-bg: #005daa;
    --color-btn-actu-color: #fff;

    --color-btn-share-bg: #444;
    --color-btn-share-color: #ddd;
    --color-btn-share-hover-bg: #666;
    --color-btn-share-linkedin-bg: #0077b5;
    --color-btn-share-twitter-bg: #1da1f2;
    --color-btn-share-email-bg: #888;
    --color-btn-share-social-color: white;

    --color-chatbot-bg: #1a1a1a;
    --color-chatbot-color: white;
    --color-chatbot-window-bg: #2c2c2c;
    --color-chatbot-border: #444;
    --color-chatbot-header-bg: #222;
    --color-chatbot-message-bg: #333;
    --color-chatbot-button-bg: #1a73e8;
    --color-chatbot-button-hover-bg: #2c84f6;

    --color-form-bg: #2b2b2b;
    --color-form-border: #555;
    --color-form-btn-bg: #ff5252;
    --color-form-btn-hover-bg: #d32f2f;
    --color-form-btn-color: #fff;

    --color-hero-bg: #004080;
    --color-hero-color: white;

    --color-table-of-contents-bg: #1a1a1a;
    --color-table-of-contents-color: #ffffff;
    --color-table-of-contents-highlight-bg: #ffd54f;
    --color-table-of-contents-highlight-color: #000;

    --color-menu-burger-span-bg: white;
    --color-submenu-bg: #1e1e1e;
    --color-submenu-hover-bg: #2c2c2c;
  }
}