/* Cycles Blain — cbavailability 1.9.24 (maquette validée le 31 oct. 2026)
   1. Description / Caractéristiques : deux boutons ronds centrés juste sous le produit, fermés au départ.
   2. Dispo en magasin en vert quand le vélo est en stock (la règle verte existait mais le bleu passait devant). */

/* ---------- 1. Les deux boutons ---------- */
body#product .cb-onglets.cb-onglets-boutons { margin-top: 32px; border-top: 0; padding-top: 0; }
body#product .cb-onglets-boutons .cb-onglets-barre { display: flex !important; justify-content: center; gap: 12px; width: auto; max-width: 100%;
  margin: 0 auto; padding: 0; border: 0; border-radius: 0; background: transparent; }
body#product .cb-onglets-boutons .cb-onglet { display: inline-flex; align-items: center; gap: 10px; min-width: 0; margin: 0; padding: 14px 24px;
  border: 2px solid #cfdcec; border-radius: 999px; background: #ffffff; color: #0b4f9c; font: inherit; font-size: 16px; text-align: left;
  cursor: pointer; box-shadow: 0 4px 14px rgba(20, 20, 20, .06); transition: background .15s, border-color .15s, color .15s; }
body#product .cb-onglets-boutons .cb-onglet:hover { border-color: #0b5cad; color: #0b5cad; }
body#product .cb-onglets-boutons .cb-onglet:focus-visible { outline: 2px solid #0b5cad; outline-offset: 3px; }
body#product .cb-onglets-boutons .cb-onglet.actif { background: #0b5cad; border-color: #0b5cad; color: #ffffff; }
body#product .cb-onglets-boutons #cb-onglet-desc { order: -1; }   /* Description d'abord, comme sur la maquette */
body#product .cb-onglets-boutons .cb-onglet svg { flex: none; }
body#product .cb-onglets-boutons .cb-onglet-t { display: flex; flex-direction: column; line-height: 1.2; }
body#product .cb-onglets-boutons .cb-onglet-t strong { font-size: 16px; font-weight: 800; }
body#product .cb-onglets-boutons .cb-onglet-t span { font-size: 12px; font-weight: 600; opacity: .75; }
body#product .cb-onglets-boutons .cb-onglet-f::before { content: "⌄"; font-size: 16px; font-weight: 800; }
body#product .cb-onglets-boutons .cb-onglet.actif .cb-onglet-f::before { content: "⌃"; }
/* Le contenu ouvert : une carte blanche arrondie sous les boutons */
body#product .cb-onglets-boutons .cb-panneau:not([hidden]) { margin-top: 16px; padding: 22px 24px; border: 1px solid #e3ddd2; border-radius: 18px; background: #ffffff; }
body#product .cb-onglets-boutons .cb-panneau[hidden] { display: none !important; }
body#product .cb-onglets-boutons .cb-accordeon { border: 0; margin: 0; }
body#product .cb-onglets-boutons .cb-accordeon > summary { display: none !important; }
body#product .cb-onglets-boutons .cb-accordeon-contenu { padding: 0; }
/* Téléphone : les deux boutons se partagent la largeur, sans sous-titre */
@media (max-width: 767px) {
  body#product .cb-onglets.cb-onglets-boutons { margin-top: 24px; padding: 0; }
  body#product .cb-onglets-boutons .cb-onglets-barre { gap: 10px; }
  body#product .cb-onglets-boutons .cb-onglet { flex: 1 1 0; justify-content: center; padding: 13px 10px; }
  body#product .cb-onglets-boutons .cb-onglet-t span { display: none; }
  body#product .cb-onglets-boutons .cb-onglet-t strong { font-size: 15px; }
  body#product .cb-onglets-boutons .cb-panneau:not([hidden]) { margin-top: 12px; padding: 16px; border-radius: 16px; }
}

/* ---------- 2. Dispo en vert quand c'est en stock ---------- */
#product-availability.cb-availability-card[data-cb-availability-kind="stock"],
[data-product-availability].cb-availability-card[data-cb-availability-kind="stock"] { border-color: #2f9e5a !important; background: #e7f6ec !important; color: #145c2e !important; }
#product-availability.cb-availability-card[data-cb-availability-kind="none"],
[data-product-availability].cb-availability-card[data-cb-availability-kind="none"] { border-color: #c9d1dc; background: #f1f3f6; color: var(--cb-texte) !important; }
