/* Product page (2026-11-08): price + Purchase first, then a collapsible description and feature list.
   Linked from app/views/product.php. Works with the storefront palette in light and dark mode and in RTL. */
html[data-theme] .detail-info .product-buy-first{margin-top:4px!important}
html[data-theme] .detail-info .product-buy-first .buy-actions{display:flex;flex-wrap:wrap;gap:10px}
html[data-theme] .detail-info .product-buy-hints{margin:10px 0 0}
html[data-theme] .detail-info .product-buy-hints .hint{margin:0 0 4px!important;font-size:12px!important;line-height:1.6!important;color:var(--shop-muted)!important}

/* Rendered description */
html[data-theme] .product-rich-text{margin:0!important;font-size:14px!important;font-weight:400!important;line-height:1.85!important;color:var(--shop-muted)!important}
.product-rich-text>:first-child{margin-top:0!important}
html[data-theme] .product-rich-text h2,html[data-theme] .product-rich-text h3,html[data-theme] .product-rich-text h4{margin:24px 0 8px!important;padding:0!important;color:var(--shop-text)!important;-webkit-text-fill-color:var(--shop-text)!important;background:none!important;line-height:1.3!important;letter-spacing:-.02em!important;font-weight:700!important;text-transform:none!important;text-shadow:none!important}
html[data-theme] .product-rich-text h2{font-size:20px!important}
html[data-theme] .product-rich-text h3{font-size:16px!important}
html[data-theme] .product-rich-text h4{font-size:12px!important;letter-spacing:.09em!important;text-transform:uppercase!important;color:var(--momu-accent-text,var(--shop-accent))!important;-webkit-text-fill-color:var(--momu-accent-text,var(--shop-accent))!important}
.product-rich-text p{margin:0 0 12px}
.product-rich-text ul,.product-rich-text ol{margin:0 0 14px;padding-inline-start:20px}
.product-rich-text li{margin:0 0 5px}
.product-rich-text strong{color:var(--shop-text);font-weight:650}
.product-rich-text code{padding:1px 6px;border:1px solid var(--shop-line);border-radius:4px;background:var(--shop-soft);font-size:12px;color:var(--shop-text)}

/* Collapse: a soft fade into the page background, then the Read more button */
.product-collapsible{position:relative}
.product-collapsible.is-collapsed{max-height:var(--collapse-height,340px);overflow:hidden}
.product-collapsible.is-collapsed::after{content:"";position:absolute;inset:auto 0 0;height:120px;background:linear-gradient(to bottom,rgba(0,0,0,0),var(--shop-bg) 88%);pointer-events:none}
html[data-theme] .product-readmore{display:inline-flex;align-items:center;gap:8px;margin:12px 0 0;padding:9px 14px;border:1px solid var(--shop-line);border-radius:6px;background:var(--shop-surface);color:var(--shop-text);font:650 12.5px/1.2 Inter,"Segoe UI",Arial,sans-serif;cursor:pointer;transition:border-color .15s,color .15s,background .15s}
html[data-theme] .product-readmore:hover{border-color:var(--momu-accent,var(--shop-accent));color:var(--momu-accent-text,var(--shop-accent))}
.product-readmore svg{flex:none;transition:transform .2s}
.product-readmore[aria-expanded="true"] svg{transform:rotate(180deg)}
.product-readmore b{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--momu-accent-soft,var(--shop-soft));color:var(--momu-accent-text,var(--shop-accent));font-size:10.5px;font-weight:750}
.product-readmore[aria-expanded="true"] b{display:none}
.product-readmore[hidden]{display:none!important}

/* Feature list: first six rows, the rest behind the toggle */
html[data-theme] .feature-list.is-collapsed .feature-extra{display:none!important}
html[data-theme] .feature-list .product-features-toggle{margin-top:14px}
@media(prefers-reduced-motion:reduce){.product-readmore svg{transition:none}}
