/*
Theme Name: AuraCommerce
Theme URI: https://auracommerce.example.com
Author: AuraCommerce Team
Author URI: https://auracommerce.example.com
Description: Thème WordPress e-commerce ultra-rapide Rouge, Blanc & Noir (Red White Black Design System), 100% compatible avec Elementor et WooCommerce, optimisé pour la conversion et la vente en ligne.
Version: 1.4.1
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: auracommerce
Tags: e-commerce, elementor-ready, woocommerce, grid-layout, custom-colors, custom-menu, featured-images, full-width-template, translation-ready
*/

/* ==========================================================================
   CSS CUSTOM PROPERTIES (RED, WHITE & BLACK LUXURY E-COMMERCE DESIGN SYSTEM)
   ========================================================================== */
:root {
  /* Brand Primary: High-Converting Ruby Red */
  --color-primary: #E11D48;        /* Rouge Vif Énergique */
  --color-primary-hover: #BE123C;  /* Rouge Rubis Profond */
  --color-primary-dark: #881337;   /* Rouge Grenat */
  --color-accent: #EF4444;         /* Rouge Alerte / Promo */
  --color-accent-hover: #DC2626;

  /* Secondary: Pure Jet Black & Charcoal */
  --color-secondary: #0A0A0A;      /* Noir Profond Onyx */
  --color-secondary-hover: #171717;
  --color-dark: #0A0A0A;           /* Noir Sombre */
  --color-dark-surface: #171717;

  /* Neutrals: Pure White & Crisp Light Greys */
  --color-bg: #FFFFFF;             /* Blanc Pur Fond Principal */
  --color-bg-alt: #F8FAFC;         /* Blanc Gris Ultra Épuré */
  --color-bg-card: #FFFFFF;        /* Carte Blanche */
  --color-bg-red-tint: #FFF1F2;    /* Doux Reflet Rose/Rouge */
  --color-surface: #FFFFFF;

  /* Text Hierarchy */
  --color-text: #0A0A0A;           /* Texte Noir Intense Contraste Maximal */
  --color-text-muted: #52525B;     /* Gris Ardoise Neutre */
  --color-text-light: #A1A1AA;     /* Gris Clair Discret */
  --color-text-white: #FFFFFF;     /* Blanc Titres sur Fond Noir */

  /* Borders */
  --color-border: #E4E4E7;         /* Bordure Gris Clair Nette */
  --color-border-dark: #27272A;    /* Bordure Noire Épurée */
  --color-border-red: #FECDD3;     /* Bordure Rouge Douce */

  /* Conversion Colors */
  --color-success: #16A34A;
  --color-warning: #F59E0B;
  --color-danger: #EF4444;

  /* Layout & Geometry */
  --container-width: 1280px;
  --container-padding: 1.5rem;
  --header-height: 72px;
  --bottom-nav-height: 58px;
  --radius-sm: 6px;
  --radius: 12px;
  --radius-lg: 20px;
  --radius-full: 9999px;

  /* High-End Shadows */
  --shadow-soft: 0 2px 12px rgba(0, 0, 0, 0.06);
  --shadow-hover: 0 10px 25px rgba(0, 0, 0, 0.12);
  --shadow-drawer: -5px 0 30px rgba(0, 0, 0, 0.25);
  --shadow-modal: 0 20px 50px rgba(0, 0, 0, 0.35);

  /* Typography */
  --font-heading: 'Sora', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* Transitions */
  --transition-fast: 0.15s ease-in-out;
  --transition-base: 0.25s ease-in-out;
  --transition-slow: 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ==========================================================================
   CSS RESET & BASE TYPOGRAPHY
   ========================================================================== */
*, *::before, *::after {
  box-sizing: border-box;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-body);
  background-color: var(--color-bg);
  color: var(--color-text);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  color: var(--color-text);
  font-weight: 700;
  line-height: 1.25;
  margin-top: 0;
}

a {
  color: var(--color-primary);
  text-decoration: none;
  transition: color var(--transition-fast);
}

a:hover {
  color: var(--color-primary-hover);
}

/* Button & Link Hover Color Protection (Never Disappear on Hover) */
.btn, .button, a.btn, a.button, button.btn, button.button, input[type="submit"] {
  color: #FFFFFF;
}
.btn:hover, .button:hover, a.btn:hover, a.button:hover, button.btn:hover, button.button:hover, input[type="submit"]:hover {
  color: #FFFFFF;
}
.btn-primary, .btn-accent, a.btn-primary, a.btn-accent {
  background-color: var(--color-primary) !important;
  color: #FFFFFF !important;
}
.btn-primary:hover, .btn-accent:hover, a.btn-primary:hover, a.btn-accent:hover {
  background-color: var(--color-primary-hover) !important;
  color: #FFFFFF !important;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

ul, ol {
  list-style: none;
  padding: 0;
  margin: 0;
}

li {
  list-style: none;
}
