/* /assets/css/shop_cart.css */

.crt{ padding:18px; }
.crt-top{ display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; align-items:center; }
.crt-actions{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.crt-muted{ color: var(--ac-muted); }

.crt-list{ margin-top:14px; display:grid; gap:12px; }
.crt-item{ display:grid; grid-template-columns: 120px 1fr; gap:12px; padding:12px; border:1px solid var(--ac-line); border-radius: var(--ac-radius); background: rgba(255,255,255,.04); }
@media (max-width: 620px){ .crt-item{ grid-template-columns: 1fr; } }

.crt-img{ display:block; border-radius: 14px; overflow:hidden; border:1px solid var(--ac-line); }
.crt-img img{ width:100%; height:100%; object-fit:cover; display:block; }

.crt-info{ display:grid; gap:10px; }
.crt-title{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.crt-controls{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }

.crt-inline{ display:flex; gap:10px; align-items:center; }
.crt-qty{ width: 90px; }
.crt-spacer{ flex: 1; min-width: 10px; }
.crt-line{ font-family: var(--ac-font-h3); }

.crt-total{ margin-top:14px; }
.crt-kv{ display:flex; justify-content:space-between; gap:10px; align-items:center; }
/* /assets/css/shop_cart.css
   Panier
   (même classes, rendu plus propre)
*/

.crt{ padding: 20px; }

.crt-top{
  display:flex;
  justify-content:space-between;
  gap: 12px;
  flex-wrap:wrap;
  align-items:center;
  padding: 14px;
  border: 1px solid var(--ac-line);
  border-radius: var(--ac-radius);
  background:
    radial-gradient(120% 120% at 0% 0%, rgba(122,60,255,.14), transparent 65%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03));
  box-shadow: var(--ac-shadow);
}
.crt-actions{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.crt-muted{ color: var(--ac-muted); }

/* list */
.crt-list{
  margin-top: 14px;
  display:grid;
  gap: 12px;
}

.crt-item{
  display:grid;
  grid-template-columns: 120px 1fr;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--ac-line);
  border-radius: calc(var(--ac-radius) + 2px);
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03));
  box-shadow: 0 14px 40px rgba(0,0,0,.35);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.crt-item:hover{
  transform: translateY(-2px);
  border-color: rgba(243,210,123,.40);
  box-shadow: 0 20px 55px rgba(0,0,0,.45);
}
@media (max-width: 620px){
  .crt-item{ grid-template-columns: 1fr; }
}

/* image */
.crt-img{
  display:block;
  border-radius: 14px;
  overflow:hidden;
  border: 1px solid var(--ac-line);
  background: rgba(0,0,0,.18);
}
.crt-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* info */
.crt-info{
  display:grid;
  gap: 10px;
  align-content:start;
}
.crt-title{
  display:flex;
  gap: 10px;
  flex-wrap:wrap;
  align-items:center;
}
.crt-title a{
  text-decoration: none;
}
.crt-title a:hover{
  text-decoration: underline;
  text-decoration-color: rgba(243,210,123,.55);
  text-underline-offset: 3px;
}

.crt-controls{
  display:flex;
  gap: 10px;
  flex-wrap:wrap;
  align-items:center;
  padding-top: 8px;
  border-top: 1px dashed rgba(255,255,255,.12);
}

.crt-inline{ display:flex; gap:10px; align-items:center; }
.crt-qty{ width: 96px; }

.crt-qty input,
.crt-controls input[type="number"]{
  width: 96px;
  height: 40px;
  padding: 0 10px;
  border-radius: 12px;
  border: 1px solid var(--ac-line);
  background: rgba(0,0,0,.18);
  color: var(--ac-text);
  outline: none;
}
.crt-qty input:focus{
  border-color: rgba(243,210,123,.55);
  box-shadow: 0 0 0 4px rgba(122,60,255,.18);
}

.crt-spacer{ flex:1; min-width: 10px; }
.crt-line{
  font-family: var(--ac-font-h3);
  font-size: 1.05rem;
}

/* totals */
.crt-total{
  margin-top: 14px;
  padding: 14px;
  border: 1px solid var(--ac-line);
  border-radius: var(--ac-radius);
  background:
    radial-gradient(120% 120% at 100% 0%, rgba(243,210,123,.12), transparent 60%),
    rgba(255,255,255,.03);
  box-shadow: 0 16px 45px rgba(0,0,0,.35);
}

.crt-kv{
  display:flex;
  justify-content:space-between;
  gap: 10px;
  align-items:center;
  padding: 8px 0;
  border-bottom: 1px dashed rgba(255,255,255,.10);
}
.crt-kv:last-child{
  border-bottom: none;
}
.crt-kv strong{
  font-family: var(--ac-font-h3);
  letter-spacing: .2px;
}

/* promo field inside totals (si présent) */
.crt-total input[type="text"]{
  height: 40px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid var(--ac-line);
  background: rgba(0,0,0,.18);
  color: var(--ac-text);
  outline: none;
}
.crt-total input[type="text"]:focus{
  border-color: rgba(243,210,123,.55);
  box-shadow: 0 0 0 4px rgba(122,60,255,.18);
}
/* ============================================================
   SHOP BUTTONS LAYER (safe)
   -> uniformise les boutons/links dans Boutique / Produit / Panier
   -> n’écrase pas ton core.css global, uniquement dans .sh* / .shp* / .crt*
============================================================ */

/* Base: capte la plupart des boutons/links “action” */
.sh-head__actions .btn,
.sh-head__actions button,
.sh-head__actions a.btn,
.sh-actions .btn,
.sh-actions button,
.sh-actions a.btn,
.sh-field--btn .btn,
.sh-field--btn button,
.sh-field--btn a.btn,
.shp-buy .btn,
.shp-buy button,
.shp-buy a.btn,
.crt-actions .btn,
.crt-actions button,
.crt-actions a.btn,
.crt-controls .btn,
.crt-controls button,
.crt-controls a.btn,
.crt-total .btn,
.crt-total button,
.crt-total a.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  height: 40px;
  padding: 0 14px;
  border-radius: 12px;
  border: 1px solid rgba(243,210,123,.28);
  background:
    radial-gradient(120% 220% at 20% 0%, rgba(122,60,255,.22), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  color: var(--ac-text);
  text-decoration:none;
  cursor:pointer;
  user-select:none;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, filter .16s ease;
  box-shadow: 0 12px 34px rgba(0,0,0,.35);
}

.sh-head__actions .btn:hover,
.sh-head__actions button:hover,
.sh-head__actions a.btn:hover,
.sh-actions .btn:hover,
.sh-actions button:hover,
.sh-actions a.btn:hover,
.sh-field--btn .btn:hover,
.sh-field--btn button:hover,
.sh-field--btn a.btn:hover,
.shp-buy .btn:hover,
.shp-buy button:hover,
.shp-buy a.btn:hover,
.crt-actions .btn:hover,
.crt-actions button:hover,
.crt-actions a.btn:hover,
.crt-controls .btn:hover,
.crt-controls button:hover,
.crt-controls a.btn:hover,
.crt-total .btn:hover,
.crt-total button:hover,
.crt-total a.btn:hover{
  transform: translateY(-2px);
  border-color: rgba(243,210,123,.55);
  box-shadow: 0 18px 50px rgba(0,0,0,.52);
  filter: saturate(1.05);
}

.sh-head__actions .btn:active,
.sh-head__actions button:active,
.sh-head__actions a.btn:active,
.sh-actions .btn:active,
.sh-actions button:active,
.sh-actions a.btn:active,
.sh-field--btn .btn:active,
.sh-field--btn button:active,
.sh-field--btn a.btn:active,
.shp-buy .btn:active,
.shp-buy button:active,
.shp-buy a.btn:active,
.crt-actions .btn:active,
.crt-actions button:active,
.crt-actions a.btn:active,
.crt-controls .btn:active,
.crt-controls button:active,
.crt-controls a.btn:active,
.crt-total .btn:active,
.crt-total button:active,
.crt-total a.btn:active{
  transform: translateY(0px);
  box-shadow: 0 10px 28px rgba(0,0,0,.40);
}

/* Focus visible (accessibilité) */
.sh-head__actions .btn:focus-visible,
.sh-head__actions button:focus-visible,
.sh-head__actions a.btn:focus-visible,
.sh-actions .btn:focus-visible,
.sh-actions button:focus-visible,
.sh-actions a.btn:focus-visible,
.sh-field--btn .btn:focus-visible,
.sh-field--btn button:focus-visible,
.sh-field--btn a.btn:focus-visible,
.shp-buy .btn:focus-visible,
.shp-buy button:focus-visible,
.shp-buy a.btn:focus-visible,
.crt-actions .btn:focus-visible,
.crt-actions button:focus-visible,
.crt-actions a.btn:focus-visible,
.crt-controls .btn:focus-visible,
.crt-controls button:focus-visible,
.crt-controls a.btn:focus-visible,
.crt-total .btn:focus-visible,
.crt-total button:focus-visible,
.crt-total a.btn:focus-visible{
  outline: none;
  box-shadow: 0 0 0 4px rgba(122,60,255,.22), 0 18px 50px rgba(0,0,0,.52);
}

/* ------------------------------------------------------------
   Variantes automatiques (sans classes à ajouter)
   - Primary: “payer / checkout / acheter / ajouter”
   - Danger: “retirer / supprimer / vider”
------------------------------------------------------------ */

/* Primary (boutons submit + libellés fréquents) */
.shp-buy button[type="submit"],
.crt-total button[type="submit"],
.crt-actions a[href*="checkout"],
.crt-actions a[href*="pay"],
.crt-actions a[href*="payer"],
.sh-actions a[href*="cart"],
.sh-actions a[href*="panier"]{
  border-color: rgba(243,210,123,.55);
  background:
    radial-gradient(140% 260% at 25% 0%, rgba(243,210,123,.22), transparent 55%),
    radial-gradient(120% 220% at 15% 0%, rgba(122,60,255,.24), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.03));
}

/* Danger: retirer / vider (si ce sont des buttons ou liens identifiables par href) */
.crt-controls a[href*="remove"],
.crt-controls a[href*="retirer"],
.crt-actions a[href*="clear"],
.crt-actions a[href*="vider"],
.crt-actions button[name*="clear"],
.crt-actions button[name*="vider"]{
  border-color: rgba(255,120,120,.40);
  background:
    radial-gradient(120% 220% at 20% 0%, rgba(255,120,120,.18), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
}

/* ------------------------------------------------------------
   Petits boutons (ex: “Appliquer” promo)
------------------------------------------------------------ */
.crt-total button,
.crt-total .btn{
  height: 38px;
  padding: 0 12px;
}

/* Liens “Voir”/“Panier” qui sont des <a> sans .btn:
   on leur donne un look bouton soft si tu veux */
.sh-actions a:not(.btn),
.sh-head__actions a:not(.btn),
.crt-actions a:not(.btn){
  padding: 0 12px;
  height: 38px;
  border-radius: 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.03);
  text-decoration:none;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.sh-actions a:not(.btn):hover,
.sh-head__actions a:not(.btn):hover,
.crt-actions a:not(.btn):hover{
  transform: translateY(-1px);
  border-color: rgba(243,210,123,.35);
  box-shadow: 0 14px 40px rgba(0,0,0,.40);
}

/* ------------------------------------------------------------
   Disabled states
------------------------------------------------------------ */
.sh-head__actions button:disabled,
.sh-actions button:disabled,
.sh-field--btn button:disabled,
.shp-buy button:disabled,
.crt-actions button:disabled,
.crt-controls button:disabled,
.crt-total button:disabled{
  opacity: .55;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.25);
}