/* Page boutique — s'appuie sur les tokens de style.css */

.product{
  display:grid;grid-template-columns:minmax(0,420px) 1fr;gap:40px;align-items:center;
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow-1);padding:24px;
}
.product-photo{width:100%;height:auto;border-radius:var(--radius-sm);background:var(--cream);display:block;}
.product-info h3{font-size:1.8rem;margin-bottom:.2em;}
.product-price{margin:0 0 .8em;}
.product-price strong{font-family:var(--font-display);font-size:2.4rem;color:var(--court-green-deep);font-weight:600;}

.order-form,.order-done{margin-top:28px;max-width:640px;}
.order-line{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px;}
.order-line .order-recap{margin:0;}
.order-qty{width:auto;min-width:72px;margin-left:auto;padding:10px 14px;font-family:var(--font-body);font-size:.95rem;font-weight:600;color:var(--ink);background:var(--cream);border:1px solid var(--line-strong);border-radius:var(--radius-sm);cursor:pointer;text-align:right;}
.order-qty:focus{outline:2px solid var(--court-green);outline-offset:1px;background:var(--white);}
.pay{border:0;padding:0;margin:0 0 20px;}
.pay legend{font-size:.82rem;font-weight:700;color:var(--ink);margin-bottom:8px;padding:0;}
.pay-opt{
  display:inline-flex;align-items:center;gap:8px;margin:0 10px 0 0;padding:11px 18px;
  border:1.5px solid var(--line-strong);border-radius:var(--radius-sm);
  background:var(--cream);color:var(--ink);font-weight:600;cursor:pointer;
}
.pay-opt input{width:auto;margin:0;accent-color:var(--court-green-deep);}
.pay-opt:has(input:checked){border-color:var(--court-green-deep);background:var(--lime-soft);}
.order-form .btn{margin-right:8px;}
.order-form[hidden],.order-done[hidden],.product .btn[hidden]{display:none;}
.order-form .field[hidden]{display:none;}
.field-hint{margin:6px 0 0;font-size:.82rem;opacity:.8;}
.order-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

@media (max-width:760px){
  .product{grid-template-columns:1fr;gap:20px;padding:16px;}
}
