.material-calculator{max-width:1100px;margin:24px auto;padding:24px;border:1px solid var(--line);border-radius:12px;background:var(--bg)}.material-calculator label{display:flex;flex-direction:column;gap:8px;margin-block:12px}.material-calculator input,.material-calculator select{width:100%;min-width:0;min-height:48px;font-size:16px}.material-calculator fieldset{min-width:0;border:1px solid var(--line);border-radius:8px;margin-block:18px;padding:18px;background:#fff}.material-calculator legend{font-weight:bold;padding-inline:8px}.mc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.mc-openings{margin-block:12px}.mc-opening{display:flex;align-items:end;gap:12px}.mc-opening label{flex:1}.mc-opening button{margin-block-end:12px}.material-calculator .btn{min-height:48px;margin-block:6px}.mc-designs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.mc-design{padding:10px;border:2px solid var(--line);border-radius:8px;cursor:pointer}.mc-design:has(input:checked){border-color:var(--gold);background:#fbf5ea}.mc-design input{min-height:20px;height:20px}.mc-design svg{width:100%;height:auto}.material-calculator svg rect{fill:none;stroke:var(--gold);stroke-width:1;vector-effect:non-scaling-stroke}.material-calculator svg .mc-wall{fill:#f6f0e8;stroke:#aaa}#mcPreview svg{display:block;width:100%;max-height:360px;margin-block:20px}#mcResult{padding:24px;margin-block:24px;border:1px solid #d8c2a2;border-radius:10px;background:white}.mc-recommendation{display:block;font-size:38px;color:var(--green);margin-block:12px}.mc-catalog{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}#mcError{color:var(--red)}.material-calculator [hidden]{display:none!important}.material-calculator button:disabled{opacity:.5;cursor:not-allowed}.material-calculator .summary-row{gap:16px;flex-wrap:wrap}.material-calculator .qty input{min-width:0}.main-nav{height:auto;min-height:48px;flex-wrap:wrap;gap:20px;padding:12px}#productCalculator>summary{list-style:none;cursor:pointer}@media(max-width:650px){.material-calculator{padding:14px}.mc-grid,.mc-catalog{grid-template-columns:1fr}.mc-designs{grid-template-columns:repeat(2,minmax(0,1fr))}.mc-opening{align-items:center}.material-calculator .btn{white-space:normal}.material-calculator .mc-recommendation{font-size:30px}}

/* Keep native form controls readable with browser/OS dark themes. */
.material-calculator input,
.material-calculator select {
    color-scheme: light;
    color: #20242a;
    background-color: #fff;
}
.material-calculator select option,
.material-calculator select optgroup {
    color: #20242a;
    background-color: #fff;
}

/* Visible radio choices avoid native dropdown popup rendering differences. */
.material-calculator .mc-choices {margin-block:12px;padding:10px 12px}
.mc-choice-row {display:flex;flex-wrap:wrap;gap:10px}
.material-calculator label.mc-choice {display:flex;flex-direction:row;align-items:center;gap:10px;margin:0;padding:12px 16px;min-height:48px;border:1px solid #b8b1a6;border-radius:6px;background:#fff;color:#20242a;cursor:pointer}
.material-calculator .mc-choice input {width:18px;height:18px;min-height:18px;flex:0 0 18px;margin:0;padding:0;accent-color:#805817}
.material-calculator .mc-choice:has(input:checked) {border-color:#805817;background:#f6ecd9;color:#20242a}
.material-calculator .mc-choice:focus-within {outline:2px solid #805817;outline-offset:2px}
