/* WoodEvo Cladding Estimator — extends assets/deck-estimator/deck-estimator.css (de-* components) */

/* Brand range colours: CLADDING = Red 2, Earth 2, White */
.blk-clad-est { --de-accent: var(--red-2, #7D3E22); --de-soft: #EEDFBF; --de-cta-bg: var(--red-2, #7D3E22); }

.blk-clad-est .ce-small { font-size: 14px; }
.blk-clad-est .ce-state[hidden] { display: none; }
.blk-clad-est .ce-loc-ok { color: var(--de-ink); font-weight: 590; margin-right: 4px; }

.blk-clad-est .ce-build-note { padding: 14px 16px; background: var(--de-soft); border-left: 3px solid var(--de-accent); border-radius: var(--de-radius); font-size: 14px; line-height: 1.5; }
.blk-clad-est .ce-build-note[hidden] { display: none; }
.blk-clad-est .ce-build-note p { margin: 4px 0 0; font-size: 14px; color: var(--de-muted); }
.blk-clad-est [data-use-field][hidden], .blk-clad-est [data-bottom-field][hidden], .blk-clad-est [data-options][hidden], .blk-clad-est [data-trims-cta][hidden] { display: none; }

/* Size rows: allow 3 dimensions + qty to wrap on small screens */
.blk-clad-est .ce-dims { flex-wrap: wrap; row-gap: 12px; }
.blk-clad-est .ce-dims .de-dim { min-width: 72px; }
.blk-clad-est .ce-dim--qty { flex: 0 0 88px; }
.blk-clad-est .ce-dims--sm .de-dim__input { font-size: 22px; }
@media (max-width: 480px) {
    .blk-clad-est .ce-dims .de-area__x { display: none; }
    .blk-clad-est .ce-dims .de-dim { flex: 1 1 40%; }
}

.blk-clad-est .ce-openings { display: flex; flex-direction: column; gap: 10px; padding-top: 6px; border-top: 1px dashed rgba(0,0,0,.15); }
.blk-clad-est .ce-opening { display: flex; flex-direction: column; gap: 6px; }
.blk-clad-est .ce-opening__label { font-size: 13px; font-weight: 600; }
.blk-clad-est .ce-opening .de-area__remove { align-self: flex-start; }

.blk-clad-est .ce-counts { display: flex; gap: 24px; flex-wrap: wrap; }
.blk-clad-est .ce-counts .de-dim { flex: 0 0 140px; }

/* Preview */
.blk-clad-est .ce-canvas { aspect-ratio: 16 / 10; }
.blk-clad-est .ce-svg-open { fill: var(--off-white, #fafaf9); }
.blk-clad-est .de-preview__legend i.ce-lg-batten { background: none; box-shadow: none; border-top: 2px dashed var(--de-muted); height: 0; width: 16px; }
.blk-clad-est .de-preview__legend i.ce-lg-open { background: var(--off-white, #fafaf9); }

/* Result */
.blk-clad-est .ce-list-body { display: flex; flex-direction: column; gap: 16px; }
.blk-clad-est .ce-battens { padding: 12px 14px; background: var(--de-soft); border-radius: var(--de-radius); font-size: 14px; line-height: 1.5; }