/*
Theme Name: Agence CC - Base Theme
Author: AgenceCC
Author URI: https://agencecc.ca
Version: 1.0.0
Text Domain: instapresse
*/

/* Mega Menu Styles */

/* Remove arrows from top menu items */
header .menu__container .menu > li.has-mega-menu > a::after,
header .menu__container .menu > li.menu-item-has-children > a::after {
   content: none !important;
}

/* Bold active menu item like hover */
header .menu > li.current-menu-item > a {
   font-weight: 500 !important;
   color: #000 !important;
}
header .menu > .has-mega-menu .c-mega_menu {
   display: none;
   position: absolute;
   left: 0;
   top: 100%;
   width: 100%;
   background-color: #fff;
   border-top: 1px solid #eee;
   border-bottom: 1px solid #eee;
   box-shadow: 0 4px 8px rgba(0,0,0,0.1);
   padding: 20px 0;
   z-index: 1000;

   /* Transition/visibility for classic submenu feel */
   opacity: 0;
   visibility: hidden;
   transform: translateY(-6px);
   transition: opacity .25s ease, transform .20s ease, visibility .25s ease;
   pointer-events: none; /* disabled until visible */
}

header .menu > li.has-mega-menu > a:after,
header .menu > li.menu-item-has-children > a:after {
   content: "\f061" !important;
   color: #e74c3c !important; /* red like sub-menu hover */
   transform: none !important;
}

/* Ensure the top-level menu item doesn't clip the absolute submenu */
header .menu > .has-mega-menu { position: static; }

header .menu > .has-mega-menu:hover > .c-mega_menu {
    display: block;
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

header .c-mega_menu__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 15px;
}

header .c-mega_menu__grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 30px;
}

header .c-mega_menu__family-column {
    border-right: 1px solid #f0f0f0;
}

header .c-mega_menu__family-column:last-child {
	border-right: none;
}

header .c-mega_menu__family-column {
    padding: 0 15px;
}

header .c-mega_menu__family-title {
    font-weight: 700;
    color: #222;
    margin-bottom: 12px;
    font-size: 16px;
}

header .c-mega_menu__product-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

header .c-mega_menu__product-list li a {
    display: inline-block;
    padding: 3px 0;
    color: #666;
    text-decoration: none;
    font-size: 0.66rem; /* align with classic sub-menu */
    position: relative;
    padding-right: 14px;
    transition: all .25s ease;
}
header .c-mega_menu__product-list li a::after {
  content: "\f061" !important;
  position: absolute !important;
  top: 50% !important;
  right: -10px !important;
  width: 10px !important;
  height: 10px !important;
  color: #D02931 !important;
  transform: translateY(-50%) !important;
  font-family: "Font Awesome 5 Pro" !important;
  line-height: 1 !important;
  opacity: 0 !important;
  transition: all .25s ease !important;
}

/* -------------------------------------------------------------------------- */
/* HOME - AMELIORATIONS MOBILE                                                */
/* -------------------------------------------------------------------------- */
@media (max-width: 768px) {
  .home .section.c-hero--slider {
    min-height: 520px !important;
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }

  .home .c-hero__container {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    text-align: center;
    align-items: center;
  }

  .home .c-hero__content {
    max-width: 720px;
    width: 100%;
  }

  .home .c-hero__content h1 {
    font-size: clamp(1.8rem, 6vw, 2.2rem);
    line-height: 1.2;
  }

  .home .c-hero__content p {
    font-size: 1rem;
    line-height: 1.5;
  }

  .home .c-hero__slider img {
    width: 100%;
    max-height: 320px;
    object-fit: contain;
  }

  .home .section {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .home .c-cards {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .home .c-cards .c-card {
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 1rem 1.25rem;
    gap: 0.75rem;
  }

  .home .c-cards .c-card .card__img {
    width: 100%;
    display: flex;
    justify-content: center;
  }

  .home .c-cards .c-card .card__img img {
    max-height: 160px !important;
    width: 100%;
    object-fit: contain;
  }
}

header .c-mega_menu__product-list li a:hover::after {
  opacity: 1 !important;
  right: -20px !important;
}
header .c-mega_menu__product-list li a:hover:after {
    opacity: 1;
    transform: translateX(0);
}

header .c-mega_menu__product-list li a:hover {
    color: #007bff;
}

/* Robust selectors to ensure mega-menu columns render regardless of UL class */
header .menu__container li.has-mega-menu > .c-mega_menu,
header nav .menu li.has-mega-menu > .c-mega_menu,
header .menu li.has-mega-menu > .c-mega_menu {
    display: none;
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    background-color: #fff;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    padding: 20px 0;
    z-index: 1000;
}

/* Show on hover (desktop) */
header .menu__container li.has-mega-menu:hover > .c-mega_menu,
header nav .menu li.has-mega-menu:hover > .c-mega_menu,
header .menu li.has-mega-menu:hover > .c-mega_menu {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Ensure the li is not the positioning context so the dropdown spans the header width */
header .menu__container li.has-mega-menu,
header nav .menu li.has-mega-menu,
header .menu li.has-mega-menu {
    position: static !important;
}

/* Defensive: enforce grid layout for the columns */
header .c-mega_menu__grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    gap: 15px;
}

/* Defensive: column sizing */
header .c-mega_menu__family-column {
    border-right: 1px solid #f0f0f0;
}
header .c-mega_menu__family-column:last-child {
    border-right: none;
}
header .c-mega_menu__family-column {
    padding: 0 15px;
}
/* Sub-columns for families with many products */
@media (min-width: 1200px) {
  header .c-mega_menu__product-list--multicol-2 {
    column-count: 2;
    column-gap: 24px;
  }
  header .c-mega_menu__product-list--multicol-3 {
    column-count: 3;
    column-gap: 24px;
  }
  header .c-mega_menu__product-list--multicol-2 li,
  header .c-mega_menu__product-list--multicol-3 li {
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
  }
}

/* Fallback on large tablets: 2 sub-columns */
@media (min-width: 992px) and (max-width: 1199.98px) {
  header .c-mega_menu__product-list--multicol-3 {
    column-count: 2;
  }
}
/* Ensure UL is not flex so CSS columns apply */
header .c-mega_menu__product-list {
  display: block !important;
  width: 100%;
}

/* Make sub-columns active on >=992px, with 3->2 fallback under 1200px */
@media (min-width: 992px) {
  header .c-mega_menu__product-list--multicol-2 {
    column-count: 2;
    column-gap: 24px;
    column-fill: balance;
  }
  header .c-mega_menu__product-list--multicol-3 {
    column-count: 3;
    column-gap: 24px;
    column-fill: balance;
  }
  header .c-mega_menu__product-list--multicol-2 li,
  header .c-mega_menu__product-list--multicol-3 li {
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
  }
}

/* On 992–1199px, reduce 3 sub-columns to 2 to fit */
@media (min-width: 992px) and (max-width: 1199.98px) {
  header .c-mega_menu__product-list--multicol-3 {
    column-count: 2;
  }
}
/* Force sub-columns to render: neutralize floats and widths that would block column layout */
@media (min-width: 992px) {
  header .c-mega_menu__product-list--multicol-2 li,
  header .c-mega_menu__product-list--multicol-3 li {
    float: none !important;
    width: auto !important;
    display: block !important;
  }
}
/* Internal sub-columns grid for families (ensures multiple ULs render as columns) */
@media (min-width: 992px) {
  header .c-mega_menu__product-subgrid {
    display: grid !important;
    gap: 24px !important;
    align-items: start;
  }
  header .c-mega_menu__product-subgrid.columns-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  header .c-mega_menu__product-subgrid.columns-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  header .c-mega_menu__product-subgrid .c-mega_menu__product-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: block !important; /* ensure stacked inside each sub-column */
  }
  header .c-mega_menu__product-subgrid .c-mega_menu__product-list li {
    float: none !important;
    width: auto !important;
    display: block !important;
  }
}
/* Persistent open state: keep mega-menu visible when .is-open is set (hover OR locked open) */
header .menu li.has-mega-menu.is-open > .c-mega_menu {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Optional: while a mega-menu is open, ensure it overlays correctly */
body.mega-open header .c-mega_menu {
  z-index: 1000;
}
/* Fix liens non cliquables après sortie/re‑entrée + état verrouillé */
header .menu li.has-mega-menu.is-open > .c-mega_menu {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important; /* autorise les clics à l'intérieur */
  z-index: 1002 !important;
}
/* Empêche le pseudo-overlay d'intercepter les clics quand verrouillé ouvert */
header .menu li.has-mega-menu.is-open > .c-mega_menu:before {
  pointer-events: none !important;
}

/* Couleur hover demandée: noir medium, pas de bleu */
header .c-mega_menu__product-list li a:hover {
  color: #2F2F2F !important;   /* noir medium */
  font-weight: 500 !important; /* medium */
  text-decoration: none !important;
}
/* Fix overlay intercepting clicks: disable pointer events on the pseudo element in all states */
header .c-mega_menu:before {
  pointer-events: none !important;
}
/* Always allow clicking links inside the mega menu, even after hover leave/return */
header .c-mega_menu,
header .c-mega_menu * {
  pointer-events: auto !important;
}

/* Home values cards: ne pas forcer le contenu à s'étirer */
.home section.section__values .values__cards.c-cards .c-card .card__content {
  flex: 0 1 auto;
}

/* Home sliders - fallback quand Slick n'est pas initialisé */
.js--promos-slider:not(.slick-initialized) .promotion {
  display: none;
}
.js--promos-slider:not(.slick-initialized) .promotion:first-child {
  display: block;
}

/* Clients - montrer les logos même sans slider */
.section__partners .js--slider__clients:not(.slick-initialized) {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2rem;
}
.section__partners .js--slider__clients:not(.slick-initialized) .client {
  flex: 0 1 180px;
  text-align: center;
}

/* Section formulaire - styles sans rebuild SCSS */
.section__form {
  text-align: left;
}
.section__form .form__wrapper {
  margin-top: 1.25rem;
}
@media screen and (max-width: 767px) {
  .section__form {
    text-align: center;
  }
  .section__form .form__wrapper {
    margin-top: 1.5rem;
  }
}

/* =============================
   Palette boutons InstaPresse
   ============================= */
:root {
  --ip-teal: #009468;
}

/* Boutons verts retirés - désormais uniquement dans product-builder.css */