:root {
  --custom-dark-blue: #1a237e;
  --custom-dark-blue-hover: #0d1754;
  --custom-gray-blue-bg: #c0d5dd;
  --custom-light-blue: #e3f2fd;
  --custom-accent-blue: #2196f3;
  --custom-success: #28a745;
  --custom-warning: #ffc107;
  --custom-danger: #dc3545;
  --custom-info: #17a2b8;
  --white: #ffffff;
  --black: #000000;
  --gray-light: #f8f9fa;
  --gray-dark: #212529;
  --red: #dc3545;
  --red-hover: #c82333;
  --yellow: #ffc107;
  --yellow-hover: #e0a800;
  --green: #28a745;
  --blue: #2196f3;
  --blue-dark: #1a237e;
  --blue-dark-hover: #0d1754;
  --blue-gray-bg: #c0d5dd;
  --blue-light: #e3f2fd;
  --info: #17a2b8;
  --orange: #ff6b35;
  --orange-light: #f7931e;

  --custom-body-bg: #c0d5dd;

  /* Primary Brand Colors */
  --primary-blue: #5067ab;
  --primary-blue-dark: #0d1754;
  --primary-blue-light: #344884ff;
  --primary-blue-variant: #304687ff;
  --primary-blue-accent: #357496ff;

  /* Amazon Brand Colors */
  --amazon-orange: #ff9900;
  --amazon-orange-light: #ffb84d;

  /* UI Element Colors */
  --border-light: #ccd3dc;
  --text-gray: #64748b;
  --text-dark: #333;

  /* Background Colors */
  --bg-overlay-85: rgba(104, 129, 175, 0.85);
  --bg-overlay-90: rgba(74, 102, 186, 0.9);
  --bg-glass-15: rgba(255, 255, 255, 0.15);
  --bg-glass-25: rgba(255, 255, 255, 0.25);
  --bg-glass-80: rgba(255, 255, 255, 0.8);
  --bg-glass-10: rgba(255, 255, 255, 0.1);
  --bg-glass-20: rgba(255, 255, 255, 0.2);

  /* Gradient Colors */
  --gradient-green-dark: #198754;
  --gradient-green-darker: #157347;
  --gradient-blue-light: #0dcaf0;
  --gradient-blue-lighter: #0aa2c0;
  --gradient-yellow-light: #e6ac00;

  /* Special Colors */
  --accent-blue: #317fa9ff;
}

/* ==================== GRADIENTI UTILIZZATI NEL SITO ====================
 *
 * Documentazione di tutti i gradienti utilizzati per futura reference:
 *
 * PRIMARY BRAND GRADIENTS:
 * - linear-gradient(180deg, #5067abff 0%, #0d1754 100%) - Testo titoli principale
 * - linear-gradient(to bottom, var(--primary-blue), var(--primary-blue-dark)) - Pulsanti primari
 * - linear-gradient(90deg, transparent 0%, #0d1754 20%, #5067ab 80%, transparent 100%) - Separatori HR
 *
 * BACKGROUND GRADIENTS:
 * - linear-gradient(180deg, rgba(104, 129, 175, 0.85) 0%, rgba(74, 102, 186, 0.9) 100%) - Sfondo offcanvas
 * - linear-gradient(180deg, rgba(255, 255, 255, 0.8) 60%, rgba(255, 255, 255, 0.5) 100%) - Card prodotti
 * - linear-gradient(135deg, #f8fafb, #e2e8f0) - Placeholder immagini
 * - linear-gradient(to bottom, #f8fafbff, #e2e8f0) - Filtri categoria inattivi
 *
 * BUTTON GRADIENTS:
 * - linear-gradient(100deg, rgba(248, 250, 251, 0.85) 0%, rgba(248, 250, 251, 0.85) 100%) - Pulsante Entrypoint
 * - linear-gradient(100deg, rgba(248, 250, 251, 0.3) 0%, rgba(248, 250, 251, 0.5) 100%) - Pulsante Amazon (chiaro)
 * - linear-gradient(100deg, #ff9900 0%, #ffb84d 100%) - Pulsante Amazon (brand)
 * - linear-gradient(100deg, #ff6b35 0%, #ff8c42 100%) - Pulsante Temu
 *
 * PRICE BADGE GRADIENTS:
 * - linear-gradient(135deg, var(--primary-blue), var(--primary-blue-dark)) - Badge primario
 * - linear-gradient(135deg, #198754, #157347) - Badge successo
 * - linear-gradient(135deg, #0dcaf0, #0aa2c0) - Badge info
 * - linear-gradient(135deg, #ffc107, #e6ac00) - Badge avviso
 *
 * SPECIAL CONTENT GRADIENTS:
 * - linear-gradient(135deg, rgba(76, 113, 202, 0.6) 20%, rgba(177, 153, 93, 0.5) 100%) - Card Beach Club
 * - linear-gradient(135deg, rgba(177, 153, 93, 0.5) 30%, rgba(142, 138, 35, 0.7) 70%) - Card Azienda Olio
 *
 * DYNAMIC GRADIENTS (JavaScript):
 * - linear-gradient(to bottom, rgba(255, 255, 255, ${opacity}), rgba(231, 235, 240, ${opacity})) - Header dinamico
 * ===================================================================== */