/* ============================================================================
 * GreenVisuaLED — theme greenvisualednv
 * product.css — FICHE PRODUIT uniquement, priorite 210.
 *
 * PHASE 1 : habillage de BASE de la fiche produit HERITEE de classic, pour que
 * la page soit deja coherente "Nature Vivante" (galerie, buybox, prix, onglets,
 * quantite, add-to-cart) en attendant la fiche detaillee de la PHASE 2
 * (templates/catalog/product.tpl + _partials, double parcours achat/devis,
 * onglets enrichis, reassurance produit). Voir README "Reste pour la phase 2".
 *
 * Depend des tokens --gvl-* (theme-global.css). On habille le markup natif de
 * classic, on ne le recode pas ici.
 * ============================================================================ */

/* ---- En-tete produit / titre ---- */
.product-prices,.product-information{color:var(--gvl-ink);}
#main .page-header h1,
.product-detail-name,
h1[itemprop="name"]{font-family:var(--gvl-display);color:var(--gvl-green-deep);font-weight:800;letter-spacing:-.01em;}
.product-reference,.product-manufacturer{font-family:var(--gvl-mono);color:var(--gvl-muted);font-size:13px;}

/* ---- Galerie / images ---- */
.product-cover{border-radius:var(--r-lg);overflow:hidden;background:#fff;border:1px solid var(--gvl-line);box-shadow:var(--sh-1);}
.product-cover img{border-radius:var(--r-lg);}
.product-images li.thumb-container .thumb,
.images-container .product-images img{border-radius:var(--r-md);border:2px solid var(--gvl-line);}
.product-images li.thumb-container .thumb.selected,
.product-images li.thumb-container .thumb:hover{border-color:var(--gvl-green);}
.product-flags li.product-flag{box-shadow:var(--sh-1);}

/* ---- Buybox / prix ---- */
.product-prices .current-price,
.product-price,
.current-price span[itemprop="price"]{font-family:var(--gvl-display);font-weight:800;font-size:30px;color:var(--gvl-green-deep);}
.product-prices .regular-price{color:var(--gvl-muted);text-decoration:line-through;font-weight:600;}
.product-prices .discount{background:var(--gvl-green);color:#0F1F12;border-radius:var(--r-pill);font-family:var(--gvl-mono);}
.has-discount .product-prices .tax-shipping-delivery-label,
.product-prices .tax-shipping-delivery-label{color:var(--gvl-muted);font-size:12.5px;}

/* ---- Declinaisons / quantite ---- */
.product-variants .product-variants-item select,
.product-variants .input-color+span,
.product-quantity .qty .input-group{border-radius:var(--r-md);}
.product-quantity #quantity_wanted{border:2px solid var(--gvl-line);border-radius:var(--r-md);}
.product-variants .control-label{font-family:var(--gvl-display);color:var(--gvl-green-deep);}

/* ---- Add to cart (parcours achat) : bouton signature plein ---- */
.product-add-to-cart .add-to-cart,
.btn.add-to-cart{
  background:var(--gvl-green);border:2px solid var(--gvl-green);color:#0F1F12;
  border-radius:var(--r-pill);font-family:var(--gvl-display);font-weight:700;
  box-shadow:var(--sh-1);transition:background .15s ease, transform .15s ease, box-shadow .15s ease, color .15s ease;
}
.product-add-to-cart .add-to-cart:hover,
.btn.add-to-cart:hover{background:var(--gvl-green-700);border-color:var(--gvl-green-700);color:#fff;transform:translateY(-2px);box-shadow:var(--sh-2);}

/* ---- Bouton devis (parcours B2B) injecte par le module gvldevis
   (hook displayProductActions / displayProductButtons). On lui donne le
   style contour signature pour qu'il soit aussi visible que l'achat. ---- */
.product-actions .gvl-devis-btn,
.product-additional-info .gvl-devis-btn,
.gvl-product-devis a{
  display:inline-flex;align-items:center;gap:10px;justify-content:center;
  border:2px solid var(--gvl-green);background:var(--gvl-surface);color:var(--gvl-green-deep);
  border-radius:var(--r-pill);font-family:var(--gvl-display);font-weight:700;padding:12px 22px;
  transition:background .15s ease, border-color .15s ease, transform .15s ease;
}
.product-actions .gvl-devis-btn:hover,
.gvl-product-devis a:hover{background:var(--gvl-accent);border-color:var(--gvl-green-700);transform:translateY(-2px);}

/* ---- Reassurance produit (blockreassurance) ---- */
.product-additional-info .blockreassurance__item,
#main .reassurance-item{border-radius:var(--r-md);border:1px solid var(--gvl-line);background:#fff;}
.blockreassurance__item .blockreassurance__icon svg,
.blockreassurance__item .blockreassurance__icon img{color:var(--gvl-green-700);}

/* ---- Onglets description / details (nav-tabs natif) ---- */
.product-tabs .nav-tabs,
.tabs .nav-tabs{border-bottom:2px solid var(--gvl-line);}
.product-tabs .nav-tabs .nav-link,
.tabs .nav-tabs .nav-link{
  font-family:var(--gvl-display);font-weight:700;color:var(--gvl-muted);border:0;border-bottom:3px solid transparent;background:transparent;
}
.product-tabs .nav-tabs .nav-link.active,
.tabs .nav-tabs .nav-link.active{color:var(--gvl-green-deep);border-bottom-color:var(--gvl-green);background:transparent;}
.product-tabs .tab-content,
.tabs .tab-content{color:var(--gvl-ink);}

/* ---- Bloc "produits similaires / accessoires" : herite des cartes globales ---- */
.product-accessories .products,
.featured-products .products{gap:22px;}

/* ============================================================================
 * MARKUP THEME #gvl-product (templates/catalog/product.tpl)
 * Le wrapper #gvl-product redefinit la mise en page (galerie + buybox + onglets)
 * tout en HERITANT les _partials de classic. Ces regles scopees habillent le
 * markup propre du theme (classes .gvl-*). Meme demarche que bloomled-spectre.
 * ============================================================================ */
#gvl-product .gvl-wrap{width:100%;max-width:var(--gvl-wrap);margin-inline:auto;padding-inline:24px;}
#gvl-product .gvl-breadcrumb{padding:14px 0;margin:0;font-family:var(--gvl-mono);font-size:12.5px;letter-spacing:.04em;}
#gvl-product .gvl-breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;}
#gvl-product .gvl-breadcrumb li{display:flex;align-items:center;gap:8px;color:var(--gvl-muted);}
#gvl-product .gvl-breadcrumb li:not(:last-child)::after{content:"\203A";color:var(--gvl-line);}
#gvl-product .gvl-breadcrumb a{color:var(--gvl-green-text);}
#gvl-product .gvl-breadcrumb a:hover{text-decoration:underline;}
#gvl-product .gvl-breadcrumb [aria-current="page"]{color:var(--gvl-ink);font-weight:600;}
#gvl-product .gvl-product-top{display:grid;grid-template-columns:1.05fr .95fr;gap:46px;align-items:flex-start;margin-top:6px;}
#gvl-product .gvl-gallery-col{margin:0;}
#gvl-product .gvl-buy{background:var(--gvl-surface);border:1px solid var(--gvl-line);border-radius:var(--r-lg);padding:clamp(20px,2.4vw,30px);box-shadow:var(--sh-1);}
#gvl-product .gvl-reviews{margin-top:48px;}
#gvl-product .gvl-cross{margin-top:48px;}

#gvl-product .gvl-head .eyebrow{margin-bottom:8px;}
#gvl-product .gvl-brand-line{margin:6px 0 8px;font-family:var(--gvl-mono);font-size:12.5px;color:var(--gvl-muted);}
#gvl-product .gvl-brand-line img{max-height:34px;width:auto;}
#gvl-product .gvl-title{font-family:var(--gvl-display);font-size:clamp(26px,3.2vw,38px);font-weight:800;line-height:1.1;letter-spacing:-.02em;color:var(--gvl-green-deep);margin:0 0 10px;}
#gvl-product .gvl-meta{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:16px;}
#gvl-product .gvl-ref{font-family:var(--gvl-mono);font-size:12.5px;color:var(--gvl-muted);}
#gvl-product .gvl-ref b{color:var(--gvl-green-deep);}
#gvl-product .gvl-desc-short{color:var(--gvl-muted);font-size:16px;line-height:1.65;margin:6px 0 18px;}

/* reassurance (hook + repli) */
#gvl-product .gvl-reassurance{margin-top:22px;}
#gvl-product .gvl-reass-fb{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
#gvl-product .gvl-reass-fb .it{display:flex;align-items:flex-start;gap:12px;background:var(--gvl-surface);border:1px solid var(--gvl-line);border-radius:var(--r-md);padding:14px;}
#gvl-product .gvl-reass-fb .ic{width:38px;height:38px;flex:none;border-radius:12px;background:var(--gvl-accent);display:flex;align-items:center;justify-content:center;color:var(--gvl-green-deep);}
#gvl-product .gvl-reass-fb .ic svg{width:20px;height:20px;}
#gvl-product .gvl-reass-fb .tt{display:block;font-family:var(--gvl-display);font-weight:700;font-size:14px;color:var(--gvl-green-deep);}
#gvl-product .gvl-reass-fb .ds{display:block;font-size:12.5px;color:var(--gvl-muted);}

/* onglets theme */
#gvl-product .gvl-tabs{margin-top:48px;}
#gvl-product .gvl-tabs .nav-tabs{border-bottom:2px solid var(--gvl-line);gap:6px;display:flex;flex-wrap:wrap;}
#gvl-product .gvl-tabs .nav-tabs .nav-link{font-family:var(--gvl-display);font-weight:700;color:var(--gvl-muted);border:0;border-bottom:3px solid transparent;border-radius:0;padding:12px 18px;background:transparent;}
#gvl-product .gvl-tabs .nav-tabs .nav-link.active{color:var(--gvl-green-deep);border-bottom-color:var(--gvl-green);}
#gvl-product .gvl-tabs .tab-content{padding:26px 2px;color:var(--gvl-ink);line-height:1.7;}
/* repli sans JS : montrer tous les panneaux (a11y) */
#gvl-product.gvl-no-js .gvl-tabs .tab-pane{display:block !important;opacity:1 !important;}

/* avis / cross-sell */
#gvl-product .gvl-section-head{max-width:760px;margin:48px 0 24px;}
#gvl-product .gvl-section-head h2{font-family:var(--gvl-display);font-size:clamp(24px,2.8vw,34px);font-weight:800;margin:8px 0 0;}
#gvl-product .gvl-products-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
#gvl-product .gvl-products-grid .product-miniature{margin:0;}

/* barre d'achat sticky mobile */
.gvl-sticky-buy{position:fixed;left:0;right:0;bottom:0;z-index:1090;display:none;align-items:center;justify-content:space-between;gap:14px;
  background:#fff;border-top:1px solid var(--gvl-line);box-shadow:0 -8px 24px rgba(31,61,43,.12);padding:10px 16px;}
.gvl-sticky-buy.is-visible{display:flex;}
.gvl-sticky-buy .sb-name{font-family:var(--gvl-display);font-weight:700;font-size:13.5px;color:var(--gvl-green-deep);line-height:1.2;max-width:48vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gvl-sticky-buy .sb-price{font-family:var(--gvl-display);font-weight:800;color:var(--gvl-green-deep);}
.gvl-sticky-buy .sb-btn{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 20px;border-radius:var(--r-pill);background:var(--gvl-green);color:#0F1F12;border:0;font-family:var(--gvl-display);font-weight:700;cursor:pointer;}
.gvl-sticky-buy .sb-btn:disabled{opacity:.5;cursor:not-allowed;}

@media (max-width:980px){
  #gvl-product .gvl-product-top{grid-template-columns:1fr;gap:28px;}
  #gvl-product .gvl-products-grid{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:760px){
  #gvl-product .gvl-products-grid{grid-template-columns:repeat(2,1fr);}
  #gvl-product .gvl-reass-fb{grid-template-columns:1fr;}
}
@media (min-width:981px){ .gvl-sticky-buy{display:none !important;} }

/* ---- Responsive : barre d'achat plus aeree sur mobile ---- */
@media (max-width:767px){
  .product-prices .current-price,
  .product-price{font-size:26px;}
}
