/*!
 * SuperNet Core CSS - Foundation & Layout
 * 
 * Fichier consolidé contenant :
 * - Variables CSS globales
 * - Reset et normalisation
 * - Layout de base et conteneurs
 * - Protection FOUC (Flash of Unstyled Content)
 * - Pagination Premium 2025
 * 
 * Sources consolidées :
 * ├── anti-flash-protection.css (88L)
 * ├── container-full-width.css (140L)
 * ├── fix-before-elements.css (92L)
 * ├── fix-before-elements-production.css (86L) [DOUBLON SUPPRIMÉ]
 * └── pagination-premium-2025.css [NOUVEAU]
 */

/* Pagination styles are now loaded via theme.yml for better priority control */

/* =============================================================================
   VARIABLES CSS GLOBALES SUPERNET
   ========================================================================== */

:root {
  /* === PALETTE CARREFOUR-STYLE === */
  /* Couleurs principales — bleu Carrefour pour CTA, vert pour accents */
  --supernet-primary: #4CAF50;          /* Boutons CTA "Acheter", liens actifs (bleu Carrefour) */
  --supernet-primary-hover: #388E3C;    /* Hover boutons */
  --supernet-primary-light: #E8F5E9;    /* Fonds sections mises en avant */
  --supernet-primary-lighter: #C8E6C9;  /* Hover fonds, bordures actives */
  --supernet-primary-dark: #2E7D32;     /* Texte accent */
  --supernet-accent-green: #4CAF50;     /* Topbar, accents verts */
  --supernet-accent-green-dark: #2E7D32; /* Footer */

  /* Couleurs secondaires */
  --supernet-secondary: #1E5B8C;
  --supernet-tertiary: #6366F1;

  /* Couleurs de base */
  --supernet-bg-main: #F5F5F5;          /* Fond page global */
  --supernet-bg-card: #FFFFFF;          /* Fond cartes produits */
  --supernet-text-main: #1A1A1A;        /* Texte principal (noir sur fonds pâles) */
  --supernet-text-secondary: #666666;   /* Texte secondaire, prix au kg */
  --supernet-text-on-primary: #FFFFFF;  /* Texte blanc sur boutons verts */
  --supernet-bg-header: #FFFFFF;         /* Fond header (blanc comme Carrefour) */
  --supernet-bg-topbar: #4CAF50;        /* Bandeau info en haut (vert conservé) */

  /* Bordures */
  --supernet-border: #E5E7EB;           /* Bordures cartes, séparateurs */
  --supernet-border-active: #C8E6C9;    /* Bordures actives/focus */

  /* États interactifs */
  --supernet-primary-active: #1B5E20;
  --supernet-secondary-hover: #164A75;

  /* Badges et états */
  --supernet-badge-new: #6366F1;
  --supernet-badge-stock: #6B7280;
  --supernet-badge-promo: #DC2626;

  /* Couleurs utilitaires */
  --supernet-success: #16A34A;
  --supernet-warning: #CA8A04;
  --supernet-error: #DC2626;

  /* Spacing system */
  --supernet-space-xs: 0.25rem;   /* 4px */
  --supernet-space-sm: 0.5rem;    /* 8px */
  --supernet-space-md: 1rem;      /* 16px */
  --supernet-space-lg: 1.5rem;    /* 24px */
  --supernet-space-xl: 2rem;      /* 32px */
  --supernet-space-2xl: 3rem;     /* 48px */

  /* Typography */
  --supernet-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --supernet-font-size-xs: 0.75rem;   /* 12px */
  --supernet-font-size-sm: 0.875rem;  /* 14px */
  --supernet-font-size-base: 1rem;    /* 16px */
  --supernet-font-size-lg: 1.125rem;  /* 18px */
  --supernet-font-size-xl: 1.25rem;   /* 20px */

  /* Shadows */
  --supernet-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --supernet-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07);
  --supernet-shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
  --supernet-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.08);
  --supernet-shadow-card-hover: 0 4px 12px rgba(0, 0, 0, 0.12);

  /* Border radius */
  --supernet-radius-sm: 0.25rem;  /* 4px */
  --supernet-radius-md: 0.5rem;   /* 8px */
  --supernet-radius-lg: 0.75rem;  /* 12px */
  --supernet-radius-xl: 1rem;     /* 16px */

  /* Transitions */
  --supernet-transition-fast: 0.15s ease-out;
  --supernet-transition-base: 0.3s ease-out;
  --supernet-transition-slow: 0.5s ease-out;

  /* Layout - Sidebar filtres */
  --supernet-sidebar-width: 260px;
  --supernet-grid-gap: 16px;
}

/* =============================================================================
   PROTECTION ANTI-FOUC - MINIMALISTE
   ========================================================================== */

/* Protection légère contre les sauts de layout seulement */

/* Protection contre les sauts de layout */
.product-card,
.filter-group,
.pagination {
  min-height: 1rem;
  contain: layout style paint;
}

/* =============================================================================
   RESET ET NORMALISATION
   ========================================================================== */

/* Suppression des pseudo-éléments problématiques */
.top-menu::after,
ul.top-menu::after,
.header-nav .top-menu::after,
nav .top-menu::after,
#top-menu::after,
.js-top-menu::after,
.top-menu > *::after,
.top-menu li::after,
.header-nav *::after,
#top-menu > *::after,
#top-menu li::after {
  content: none !important;
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Suppression des éléments "Plus..." indésirables */
*[class*="more"],
*[class*="plus"],
*[id*="more"],
*[id*="plus"],
.more,
.plus,
.show-more,
.view-more,
*[title*="Plus"],
*[title*="More"],
*[aria-label*="Plus"],
*[aria-label*="More"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

/* Reset box-sizing pour tout */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* =============================================================================
   RESETS CIBLÉS — Override parent theme (191KB compiled Bootstrap)
   ========================================================================== */

/* Reset sidebar elements from parent theme — top-level only */
#left-column .block-categories,
#left-column .block-categories li {
  list-style: none !important;
}

#left-column .block-categories > .category-top-menu {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* Sub-menus keep their list-style reset but NOT margin/padding (needed for indentation) */
#left-column .block-categories .category-sub-menu {
  list-style: none !important;
}

/* Reset product display from parent theme */
#products .products,
#js-product-list .products,
.featured-products .products {
  display: grid !important;
  float: none !important;
}

/* Reset parent theme product card styles */
.product-miniature .thumbnail-container,
.product-miniature .product-description {
  all: unset !important;
  display: block !important;
}

/* Reset parent theme product title/price centering */
.product-miniature .product-title,
.product-miniature .product-price-and-shipping,
.product-miniature .product-description {
  text-align: left !important;
}

/* Hide parent theme's duplicate elements */
#_desktop_top_menu,
.header-top .menu,
#header .header-top,
#header .header-nav,
#header > .banner,
#header > nav {
  display: none !important;
}

/* Ensure our header is visible and unstacked */
.sn-header {
  display: block !important;
  visibility: visible !important;
}

/* Bootstrap dropdown override (needed for sort dropdown) */
.dropdown-toggle::after {
  display: none !important;
}

/* =============================================================================
   LAYOUT ET CONTENEURS GLOBAUX
   ========================================================================== */

/* Body et HTML foundation */
html {
  font-size: 16px;
  line-height: 1.5;
  scroll-behavior: smooth;
}

body {
  font-family: var(--supernet-font-family);
  font-size: var(--supernet-font-size-base);
  line-height: 1.6;
  color: var(--supernet-text-main);
  background-color: var(--supernet-bg-main);
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Conteneurs principaux full-width */
.container-fluid,
#wrapper,
.page-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow-x: hidden !important;
}

/* Conteneurs de contenu — pleine largeur */
.container,
.content-wrapper {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0 24px;
}

/* Layout principal responsive */
#main {
  min-height: calc(100vh - 200px);
  width: 100%;
  margin: 0;
  padding: var(--supernet-space-lg) 0;
}

/* Conteneur produits full-width */
.products-section-container,
#js-product-list-header,
#js-product-list,
#products,
.featured-products,
.product-list {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 var(--supernet-space-md) !important;
}

/* Grid responsive pour produits */
.products.row,
.featured-products .products.row {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
  gap: var(--supernet-space-lg) !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

/* =============================================================================
   UTILITAIRES RESPONSIVE
   ========================================================================== */

/* Masquage responsive */
@media (max-width: 767px) {
  .hidden-mobile { display: none !important; }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .hidden-tablet { display: none !important; }
}

@media (min-width: 1024px) {
  .hidden-desktop { display: none !important; }
}

/* Espacement responsive */
@media (max-width: 767px) {
  .container {
    padding: 0 var(--supernet-space-sm);
  }
  
  #main {
    padding: var(--supernet-space-md) 0;
  }
}

/* =============================================================================
   ACCESSIBILITÉ
   ========================================================================== */

/* Focus visible amélioré */
*:focus-visible {
  outline: 2px solid var(--supernet-primary) !important;
  outline-offset: 2px !important;
  border-radius: var(--supernet-radius-sm) !important;
}

/* Respect des préférences utilisateur */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* =============================================================================
   DEBUG ET DÉVELOPPEMENT
   ========================================================================== */

/* Debug mode (activé avec .debug sur body) */
body.debug .container {
  outline: 2px dashed var(--supernet-primary);
}

body.debug .product-card {
  outline: 1px solid var(--supernet-secondary);
}

/* Performance hints */
.will-change-transform {
  will-change: transform;
}

.will-change-opacity {
  will-change: opacity;
}

/* Containment pour optimiser le rendu */
.contain-layout {
  contain: layout;
}

.contain-style {
  contain: style;
}

.contain-paint {
  contain: paint;
}

/* === PRODUCT TABS FIX === */
/* Fix pour les onglets produits non-cliquables */
@import url("product-tabs-fix.css");

/* === PRODUCT PAGE MODERN === */
/* Chargé directement via <link> dans product.tpl — ne pas dupliquer ici */