/* Product details uses the same page background as category listings.
   This stylesheet is loaded only by ProductDetails.cshtml. */
body { background: var(--listing-bg, #fbfbf9); }

.product-page{max-width:1280px;margin:auto;padding:32px 28px 90px;color:var(--text,#17201d)}
.product-breadcrumb{display:flex;gap:10px;align-items:center;margin-bottom:35px;color:var(--muted,#697572);font-size:13px}.product-breadcrumb a{text-decoration:none}
.product-detail-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:55px;align-items:start}
.product-media-main{min-height:510px;border:1px solid var(--line,#e1e7e4);border-radius:24px;display:flex;justify-content:center;align-items:center;padding:34px;background:#fff}
.product-media-main img{max-width:100%;max-height:460px;object-fit:contain}.product-media-caption{text-align:center;font-size:12px;color:var(--muted,#697572);padding:14px}
.product-manufacturer{font-size:12px;text-transform:uppercase;letter-spacing:.12em;font-weight:850;color:var(--brand2,#34675e)}.product-info h1{font-size:clamp(30px,4vw,48px);line-height:1.1;letter-spacing:-.04em;margin:12px 0}
.product-spec{color:var(--muted,#697572);font-size:14px}.product-price-line{display:flex;gap:10px;align-items:baseline;margin:24px 0}.product-price-line strong{color:var(--brand,#193d36);font-size:36px}.product-price-line span{font-size:13px;color:var(--muted,#697572)}
.product-recovery{border:1px solid #d7e6df;background:#edf6f2;padding:18px;border-radius:17px;display:flex;flex-direction:column;gap:5px;font-size:13px}.product-recovery>strong{color:var(--brand,#193d36)}.product-recovery>span{color:var(--muted,#697572)}.product-points{margin-top:8px;font-weight:750;color:var(--brand,#193d36)}
.product-section-heading{margin:28px 0 13px;text-transform:uppercase;font-size:12px;font-weight:850;letter-spacing:.07em}.product-supplies{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.product-supply{background:#fff;border:1px solid var(--line,#e1e7e4);padding:18px 10px;border-radius:15px;text-align:center;cursor:pointer}.product-supply.is-selected{border:2px solid var(--brand,#193d36);background:#f3f8f6}.product-supply span{display:block;color:var(--muted,#697572);font-size:12px}.product-supply strong{display:block;font-size:13px;margin-top:4px}
/* Eye quantities: matching white cards and independent white steppers. */
.product-eyes {
    border: 1px solid var(--line, #e1e7e4);
    border-radius: 16px;
    overflow: hidden;
    margin-top: 18px;
    background-color: #fff;
}
.product-eyes .product-eye {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 16px;
    background-color: #fff;
}
.product-eyes .product-eye + .product-eye {
    border-top: 1px solid var(--line, #e1e7e4);
}
.product-eye strong, .product-eye span { display: block; }
.product-eye span { color: var(--muted, #697572); font-size: 12px; }
.product-eyes .product-stepper {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    border: 1px solid var(--line, #e1e7e4);
    border-radius: 999px;
    background-color: #fff;
}
.product-eyes .product-stepper button {
    width: 38px;
    height: 38px;
    border: 0;
    background-color: transparent;
    color: var(--text, #17201d);
    cursor: pointer;
}
.product-eyes .product-stepper span {
    min-width: 60px;
    text-align: center;
    color: var(--text, #17201d);
    font-weight: 700;
}

.product-summary {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    border: 1px solid var(--line, #e1e7e4);
    border-radius: 16px;
    padding: 18px;
    margin-top: 18px;
    background-color: #fff;
}.product-summary>div:last-child{text-align:right}.product-summary span,.product-reward-summary span{display:block;color:var(--muted,#697572);font-size:12px}.product-summary strong{display:block;color:var(--brand,#193d36);font-size:21px;margin-top:4px}
.product-reward-summary{display:flex;justify-content:space-between;gap:18px;align-items:center;margin:18px 0}.product-reward-summary strong{display:block;color:var(--brand,#193d36);margin-top:5px}.product-reward-summary small{max-width:240px;color:var(--muted,#697572);font-size:11px;line-height:1.4}
.product-continue{display:block;width:100%;border:0;background:var(--brand,#193d36);border-radius:13px;padding:17px;color:#fff;font-weight:800}.product-continue:disabled{opacity:.55;cursor:not-allowed}.product-flow-note{color:var(--muted,#697572);font-size:11px;text-align:center}

.product-continue:not(:disabled) {
    cursor: pointer;
}

.product-continue:disabled {
    cursor: not-allowed;
}

.product-load-error{padding:18px;border:1px solid #c88683;border-radius:12px;margin-bottom:20px}.product-load-error button{margin-left:10px}.pd-skeleton{background:#eef2f0;border-radius:13px;animation:pd-pulse 1.4s infinite alternate}.pd-skeleton-image{height:510px}.pd-skeleton-fields{display:grid;gap:18px}.pd-skeleton-heading{height:16px;width:35%}.pd-skeleton-title{height:50px;width:82%}.pd-skeleton-line{height:20px;width:55%}.pd-skeleton-box{height:180px;margin-top:20px}@keyframes pd-pulse{to{opacity:.5}}
[hidden]{display:none!important}@media(max-width:850px){.product-detail-shell{grid-template-columns:1fr;gap:24px}.product-media-main{min-height:330px}.product-page{padding:22px 18px 60px}.product-supplies{grid-template-columns:repeat(3,minmax(0,1fr))}}

@media (max-width: 420px) {
    .product-eyes .product-eye { padding: 12px; }
    .product-eyes .product-stepper button { width: 32px; height: 36px; }
    .product-eyes .product-stepper span { min-width: 52px; }
}

/* Product-type shell: simple product quantity UI */
.product-simple-quantity { display:flex;align-items:center;min-height:60px;margin:14px 0 22px; }
.product-simple-quantity .product-stepper { background:#fff; }
.product-simple-quantity .product-stepper span { min-width:44px;font-size:17px; }
.product-simple-quantity .product-stepper button { width:44px;height:44px;font-size:22px; }
.product-simple-quantity .product-stepper {display:flex;align-items:center;gap:4px;border:1px solid var(--line,#e1e7e4);border-radius:999px;padding:0 4px;}
.product-simple-quantity .product-stepper button {border:0;background:transparent;cursor:pointer;}
#productContent:not([hidden]) {display:block;}
