/* Detail layout only. Load before /brand.css; shared tokens and components belong to code E. */
#products .product-detail-image { display:block; width:100%; padding:0; border:0; border-radius:var(--radius-input); background:var(--white); cursor:pointer; }
#products .product-detail-name { display:block; padding:0; border:0; background:none; color:var(--ink); font:inherit; text-align:left; cursor:pointer; }
#products .product-card-price { display:block; margin-top:8px; font-size:12px; font-weight:400; line-height:1.5; color:var(--muted); }
#products .product-card-note { display:block; font-size:11px; color:var(--muted); }
#products .product-customize { display:flex; align-items:center; justify-content:space-between; min-height:44px; width:100%; padding:8px 0; border:0; background:none; color:var(--accent); text-align:left; font-size:12px; cursor:pointer; }
.mpoi.product-detail { padding:0 var(--space-2) var(--space-8); margin-block:var(--space-6); }
.product-detail .detail-crumb { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:64px; margin-bottom:var(--space-4); border-bottom:1px solid var(--line); }
.product-detail .detail-crumb a,.product-detail .detail-back { display:inline-flex; align-items:center; min-height:44px; color:var(--accent); font-size:12px; text-decoration:none; }
.product-detail .detail-back { background:none; border:0; padding:0; cursor:pointer; }
.product-detail .detail-grid,.product-detail .detail-info,.product-detail .detail-media { min-width:0; }
.product-detail .detail-media { padding:0; overflow:hidden; margin-bottom:var(--space-6); }
.product-detail .detail-gallery { display:flex; width:100%; overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain; scrollbar-width:none; }
.product-detail .detail-gallery::-webkit-scrollbar { display:none; }
.product-detail .detail-gallery-pane { flex:0 0 100%; min-width:0; margin:0; height:320px; padding:var(--space-4); display:grid; place-items:center; scroll-snap-align:start; }
.product-detail .detail-gallery-pane img { width:100%; height:100%; max-height:288px; object-fit:contain; }
.product-detail .detail-gallery-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:4px 12px; }
.product-detail .detail-gallery-controls button { min-width:44px; }
.product-detail .detail-gallery-status { font-size:12px; color:var(--muted); }
.product-detail .detail-gallery-thumbs { display:flex; overflow-x:auto; gap:var(--space-2); padding:var(--space-3); }
.product-detail .detail-gallery-thumb { flex:0 0 72px; height:72px; padding:4px; border:1px solid var(--line); border-radius:var(--radius-input); background:var(--white); cursor:pointer; }
.product-detail .detail-gallery-thumb[aria-pressed=true] { border-color:var(--accent); background:var(--selection); }
.product-detail .detail-gallery-thumb img { width:100%; height:100%; object-fit:contain; }
.product-detail .detail-eyebrow { margin:0 0 12px; color:var(--muted); text-transform:uppercase; font-size:10px; letter-spacing:1px; }
.mpoi.product-detail .detail-title { font-size:32px; line-height:1.08; letter-spacing:-1.1px; margin:0 0 20px; }
.product-detail .detail-price-row { display:flex; align-items:baseline; flex-wrap:wrap; gap:6px 12px; margin-bottom:var(--space-4); }
.product-detail .detail-price { font-size:22px; font-weight:600; }
.product-detail .detail-shipping { font-size:11px; color:var(--muted); }
.product-detail .detail-description { margin:0; color:var(--muted); line-height:1.7; }
.product-detail .detail-personalization { padding:var(--space-4) 0; margin:var(--space-6) 0; border-block:1px solid var(--line); }
.product-detail .detail-personalization strong { font-size:13px; }
.product-detail .detail-personalization p { margin:4px 0 0; font-size:12px; color:var(--muted); }
.product-detail .detail-variants fieldset { min-width:0; margin:0 0 24px; padding:0; border:0; }
.product-detail .detail-variants legend { font-size:16px; margin-bottom:12px; font-weight:600; }
.product-detail .detail-choices { display:flex; flex-wrap:wrap; gap:8px; }
.product-detail .detail-choices button { min-width:54px; }
.product-detail .detail-specification { color:var(--muted); font-size:11px; line-height:1.7; margin:0 0 24px; }
.product-detail .detail-accordion { border-block:1px solid var(--line); }
.product-detail .detail-accordion summary { min-height:52px; padding:16px 0; cursor:pointer; font-weight:600; }
.product-detail .detail-accordion p { font-size:13px; color:var(--muted); margin:0 0 12px; }
.product-detail .detail-accordion a { display:inline-flex; align-items:center; min-height:44px; color:var(--accent); font-size:12px; }
.product-detail .detail-actions { position:sticky; bottom:0; padding:20px 0 max(12px,env(safe-area-inset-bottom)); margin-top:20px; background:var(--paper); z-index:1; }
.product-detail .detail-action-row { display:flex; align-items:stretch; gap:12px; }
.product-detail .detail-quantity { display:flex; align-items:center; flex:0 0 114px; border:1px solid var(--selection-line); border-radius:var(--radius-pill); min-height:56px; }
.product-detail .detail-quantity button { flex:0 0 44px; width:44px; height:52px; padding:0; border:0; color:var(--accent); background:none; font-size:20px; cursor:pointer; }
.product-detail .detail-quantity output { flex:1; text-align:center; min-width:24px; font-size:14px; }
.product-detail .detail-action-row>.mpoi-button { flex:1; min-width:0; }
.product-detail .detail-message { min-height:20px; margin:12px 0 0; font-size:12px; line-height:1.6; color:var(--muted); }
.product-detail button:disabled { opacity:.45; }
@media(min-width:760px) {
 .product-detail .detail-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:24px 40px; align-items:start; }
 .product-detail .detail-media { grid-column:1; grid-row:1/3; position:sticky; top:24px; margin:0; }
 .product-detail .detail-info { grid-column:2; grid-row:1; }
 .product-detail .detail-actions { grid-column:2; grid-row:2; position:static; margin:0; padding:0; }
 .product-detail .detail-gallery-pane { height:auto; aspect-ratio:1; padding:24px; }
 .product-detail .detail-gallery-pane img { max-height:520px; }
 .mpoi.product-detail .detail-title { font-size:40px; letter-spacing:-1.5px; }
}
@media(min-width:900px) { .mpoi.product-detail { position:relative; left:50%; width:min(calc(100vw - 2 * var(--page-gutter)),var(--content-width)); transform:translateX(-50%); } }
@media(max-width:359px) {
 .product-detail .detail-action-row { gap:8px; }
 .product-detail .detail-action-row>.mpoi-button { padding-inline:14px; font-size:12px; }
 .product-detail .detail-gallery-pane { height:300px; }
 .product-detail .detail-gallery-pane img { max-height:268px; }
 .mpoi.product-detail .detail-title { font-size:29px; }
}
