/* Retaining Wall Designer - additions to the box culvert stylesheet (culvert/style.css) */
.rw-preview .pv-water { stroke: #1e88e5; stroke-width: 1.6; stroke-dasharray: 5 3; }
.rw-preview .pv-arrow { stroke: #1d4ed8; stroke-width: 1.2; }
.field.dim { opacity: .45; }

/* CAD view */
.container-full { max-width: none; padding: 0; }
.rw-cad { display: flex; flex-direction: column; height: calc(100vh - 118px); min-height: 520px; background: #1e2228; color: #d6dbe1; }
.rw-bar { display: flex; align-items: center; gap: 6px; padding: 6px 10px; background: #2b3138; border-bottom: 1px solid #3c444e; flex-wrap: wrap; }
.rw-bar .sp { flex: 1; }
.rw-title { margin-right: 10px; color: #fff; font-size: 14px; }
.rw-tabs { display: flex; gap: 3px; }
.rw-tabs button, .rw-bar .tb { background: #3a424d; border: 1px solid #56606c; color: #d6dbe1; border-radius: 3px; padding: 4px 10px; font-size: 13px; cursor: pointer; text-decoration: none; }
.rw-tabs button.on { background: #2f4f73; border-color: #3c8dde; color: #fff; }
.rw-bar .tb:hover, .rw-tabs button:hover { background: #46505c; }
.rw-body { flex: 1; display: grid; grid-template-columns: 210px 1fr 330px; min-height: 0; }
.rw-side, .rw-checks { background: #252a31; overflow: auto; padding: 6px 8px; font-size: 12.5px; }
.rw-side { border-right: 1px solid #3c444e; }
.rw-checks { border-left: 1px solid #3c444e; }
.rw-h { font-weight: 600; color: #fff; margin: 8px 0 6px; display: flex; justify-content: space-between; align-items: center; }
.rw-only { font-weight: 400; color: #aab3bd; font-size: 12px; }
.ly-row { display: grid; grid-template-columns: 18px 14px 1fr; gap: 4px 6px; align-items: center; margin: 3px 0; cursor: pointer; }
.ly-row small { grid-column: 3; color: #8d97a2; margin-top: -3px; }
.ly-row .sw { width: 12px; height: 12px; border: 1px solid #777; }
.ly-row .nm { font-family: Consolas, monospace; }
.ck-grp { margin: 10px 0 4px; font-weight: 600; color: #e8edf2; border-bottom: 1px solid #3c444e; padding-bottom: 2px; }
.ck-grp a { color: #8fd3ff; font-weight: 400; margin-left: 4px; }
.ck-row { display: grid; grid-template-columns: 58px 1fr; gap: 6px; padding: 3px 0; }
.ck-row.bad { color: #ffc9a8; }
.ck-row .badge { font-size: 10.5px; text-align: center; align-self: start; }
.rw-cad .muted { color: #8d97a2; }
.vp { position: relative; overflow: hidden; background: #1a1d22; cursor: crosshair; }
.vp.panning { cursor: grabbing; }
.vp .cad-svg { width: 100%; height: 100%; display: block; }
.vp .cad-svg .paper { fill: #23272e; }
.vp.light { background: #8b939c; }
.vp.light .cad-svg .paper { fill: var(--paper, #ffffff); }
.vp .cad-svg .ly { color: var(--dc); }
.vp.light .cad-svg .ly { color: var(--lc); }
.vp .cad-svg .ly polyline, .vp .cad-svg .ly polygon { fill: none; stroke: currentColor; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.vp .cad-svg .ly circle { stroke: currentColor; vector-effect: non-scaling-stroke; }
.vp .cad-svg .ly text { fill: currentColor; stroke: none; }
.vp .cad-svg .ly-fill { opacity: .55; }
.vp.light .cad-svg .ly-fill { opacity: 1; }
.vp .cad-svg [data-layer].hide { display: none; }
.rw-status { display: flex; gap: 18px; padding: 3px 10px; background: #2b3138; border-top: 1px solid #3c444e; font: 12px Consolas, monospace; }
@media (max-width: 900px) { .rw-body { grid-template-columns: 1fr; } .rw-side, .rw-checks { max-height: 180px; } }