/* Extraído de includes/cotizador-displays.php (17/10/2026) para que el navegador lo guarde en caché. Editar AQUÍ. */
/* 2026-10-07 · Varios materiales: cantidad en cada tarjeta */
.rsd-op-q{ display:block; margin-top:8px; }
.rsd-op-q:empty{ display:none; }
.rsd-mq{ display:inline-flex; align-items:center; border:1.5px solid #111; border-radius:10px; overflow:hidden; background:#fff; }
.rsd-mq button{ width:34px; height:32px; border:0; background:#fff; font:inherit; font-size:1.1rem; font-weight:700; cursor:pointer; color:#111; }
.rsd-mq button:hover{ background:#f1f1ee; }
.rsd-mq button[data-mq="+"]{ background:#111; color:#fff; }
.rsd-mq b{ min-width:34px; text-align:center; font-size:.95rem; }
.rsd-mq-add{ padding:7px 12px; border:1.5px dashed #9aa08f; border-radius:10px; background:transparent; font:inherit; font-size:.8rem; font-weight:700; color:#3f6212; cursor:pointer; }
.rsd-mq-add:hover{ border-color:#111; color:#111; background:#fff; }
.rsd.rsd-multi #rsd-f-cant > .rsd-etq, .rsd.rsd-multi #rsd-f-cant > .rsd-step, .rsd.rsd-multi #rsd-f-cant > .rsd-cant-u{ display:none !important; }
.rsd.rsd-multi #rsd-f-cant{ margin-top:-4px; }
.rsd.rsd-multi .rsd-op.en{ border-color:#111; }
.rsd-res-lin{ display:none; }
.rsd-cierre .rsd-res-lin{ display:block; margin:8px 0 0; font-size:.8rem; line-height:1.45; color:#d6d6d6; }
#rs-cq .rs-cq-tot.rsd-tic b{ animation:rsdTic .35s ease; }
@keyframes rsdTic{ 0%{ opacity:.55; } 100%{ opacity:1; } }
#rs-cq .rsd-mq b{ font-variant-numeric:tabular-nums; }
#rs-cq .rs-cq-tot b{ font-variant-numeric:tabular-nums; }
.rsd-mm{ display:inline-flex; align-items:center; gap:10px; }
.rsd-mm small{ font-size:.8rem; font-weight:600; color:#555; white-space:nowrap; }
#rs-cq .rsd-mq button{ width:32px; height:30px; }
#rs-cq .rsd-mm-add dt{ color:#999; }
#rs-cq .rs-cq-fila dd .rsd-mm, #rs-cq .rs-cq-fila dd .rsd-mq-add{ vertical-align:middle; }
.rsd-op-ayuda{ margin:8px 0 0; font-size:.78rem; color:#6b6b64; }
.rsd{ --rsd-tx:#1b1b1b; --rsd-sf:#666; --rsd-bd:#e2e2e2; --rsd-ac:#25D366; --rsd-bg:#fff;
  box-sizing:border-box; width:100%; margin:18px 0; padding:18px 18px 16px; background:var(--rsd-bg); color:var(--rsd-tx);
  border:1px solid var(--rsd-bd); border-radius:14px; box-shadow:0 6px 22px rgba(0,0,0,.06); font-family:inherit; text-align:left; }
.rsd *{ box-sizing:border-box; }
.rsd-tit{ margin:0 0 4px; font-size:1.15rem; font-weight:800; line-height:1.25; color:var(--rsd-tx); }
.rsd-sub{ margin:0 0 14px; font-size:.86rem; line-height:1.45; color:var(--rsd-sf); }
.rsd-campo{ margin:0 0 14px; padding:0; border:0; min-width:0; }
.rsd-etq{ display:block; margin:0 0 7px; padding:0; font-size:.8rem; font-weight:800; letter-spacing:.03em; text-transform:uppercase; color:#444; }
.rsd-ops{ display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:8px; }
.rsd-op{ position:relative; display:flex; flex-direction:column; gap:2px; padding:10px 12px; border:2px solid var(--rsd-bd); border-radius:10px;
  background:#fff; cursor:pointer; transition:border-color .15s, background .15s; line-height:1.3; }
.rsd-op input{ position:absolute; opacity:0; pointer-events:none; }
.rsd-op b{ font-size:.9rem; color:var(--rsd-tx); }
.rsd-op small{ font-size:.76rem; color:var(--rsd-sf); }
.rsd-op em{ font-style:normal; font-size:.8rem; font-weight:700; color:#0a7a3a; }
.rsd-op:hover{ border-color:#bdbdbd; }
.rsd-op.on{ border-color:var(--rsd-tx); background:#f6f7f4; }
.rsd-op:focus-within{ outline:3px solid #0a66c2; outline-offset:2px; }
.rsd-step{ display:inline-flex; align-items:stretch; border:2px solid var(--rsd-bd); border-radius:10px; overflow:hidden; background:#fff; }
.rsd-step button{ width:46px; min-height:46px; border:0; background:#f3f3f3; color:var(--rsd-tx); font-size:1.35rem; font-weight:700; cursor:pointer; line-height:1; }
.rsd-step button:hover{ background:#e7e7e7; }
.rsd-step button:disabled{ opacity:.4; cursor:default; }
.rsd-step input{ width:78px; border:0; border-left:1px solid var(--rsd-bd); border-right:1px solid var(--rsd-bd); text-align:center;
  font-size:1.08rem; font-weight:800; color:var(--rsd-tx); background:#fff; -moz-appearance:textfield; }
.rsd-step input:focus{ outline:none; background:#fafff5; }
.rsd-cant-u{ margin-left:10px; font-size:.86rem; color:var(--rsd-sf); vertical-align:middle; }
.rsd-tabla-w{ margin:0 0 14px; overflow-x:auto; }
.rsd-tabla{ width:100%; border-collapse:separate; border-spacing:0; border:1px solid var(--rsd-bd); border-radius:10px; overflow:hidden; font-size:.84rem; background:#fff; }
.rsd-tabla caption{ caption-side:top; text-align:left; padding:0 0 7px; font-size:.8rem; font-weight:800; letter-spacing:.03em; text-transform:uppercase; color:#444; }
.rsd-tabla th, .rsd-tabla td{ padding:8px 10px; border-bottom:1px solid var(--rsd-bd); text-align:center; white-space:nowrap; }
.rsd-tabla tr:last-child th, .rsd-tabla tr:last-child td{ border-bottom:0; }
.rsd-tabla thead th{ background:#f3f3f3; font-size:.76rem; color:#555; font-weight:700; }
.rsd-tabla tbody th{ text-align:left; white-space:normal; font-weight:700; color:var(--rsd-tx); cursor:pointer; }
.rsd-tabla tbody td{ font-weight:700; color:var(--rsd-tx); cursor:pointer; }
.rsd-tabla .rsd-cot{ font-weight:600; color:#888; }
.rsd-tabla tr.on th, .rsd-tabla tr.on td{ background:#f6f7f4; }
.rsd-tabla td.on, .rsd-tabla span.on{ background:var(--rsd-tx) !important; color:#fff !important; border-radius:6px; }
.rsd-tabla td.rsd-lst{ text-align:left; white-space:normal; line-height:1.9; }
.rsd-tabla td.rsd-lst span{ display:inline-block; padding:1px 7px; margin-right:4px; }
.rsd-tramos{ display:flex; flex-wrap:wrap; gap:6px; margin:9px 0 0; padding:0; list-style:none; }
.rsd-tramos[hidden]{ display:none; }
.rsd-tramos li{ list-style:none !important; margin:0 !important; padding:4px 9px; border:1px solid var(--rsd-bd); border-radius:999px; font-size:.76rem; color:#444; background:#fafafa; }
.rsd-tramos li::before, .rsd-tramos li::marker{ content:none !important; display:none !important; }
.rsd-tramos li.on{ border-color:var(--rsd-tx); background:var(--rsd-tx); color:#fff; }
.rsd-arte{ display:flex; flex-wrap:wrap; gap:8px; }
.rsd-chip{ display:inline-flex; align-items:center; padding:8px 12px; border:2px solid var(--rsd-bd); border-radius:999px; font-size:.84rem;
  cursor:pointer; background:#fff; color:var(--rsd-tx); }
.rsd-chip input{ position:absolute; opacity:0; pointer-events:none; }
.rsd-chip.on{ border-color:var(--rsd-tx); background:#f6f7f4; font-weight:700; }
.rsd-chip:focus-within{ outline:3px solid #0a66c2; outline-offset:2px; }
.rsd-opc{ font-weight:400; text-transform:none; letter-spacing:0; color:#888; }
.rsd-res{ margin:4px 0 14px; padding:12px 14px; border-radius:10px; background:#f6f7f4; }
.rsd-res dl{ margin:0; }
.rsd-fila{ display:flex; justify-content:space-between; gap:12px; padding:3px 0; font-size:.9rem; }
.rsd-fila dt{ margin:0; color:var(--rsd-sf); }
.rsd-fila dd{ margin:0; font-weight:700; text-align:right; }
.rsd-fila.rsd-total{ margin-top:6px; padding-top:8px; border-top:2px solid var(--rsd-tx); font-size:1.06rem; }
.rsd-fila.rsd-total dt, .rsd-fila.rsd-total dd{ color:var(--rsd-tx); font-weight:800; }
.rsd-aviso{ margin:0; font-size:.86rem; line-height:1.5; color:#444; }
.rsd-aviso b{ color:var(--rsd-tx); }
.rsd-btn{ display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:50px; padding:12px 16px; border:0; border-radius:10px;
  background:var(--rsd-ac); color:#fff; font-size:1rem; font-weight:800; cursor:pointer; font-family:inherit; }
.rsd-btn:hover{ background:#1ebe5a; }
.rsd-btn:focus-visible{ outline:3px solid #0a66c2; outline-offset:2px; }
.rsd-nota{ margin:10px 0 0; font-size:.74rem; line-height:1.45; color:#777; text-align:center; }
.rsd-nota a{ color:inherit; text-decoration:underline; }
/* ── Usabilidad: pasos numerados, selección visible, total destacado ── */
.rsd-n{ display:inline-flex; align-items:center; justify-content:center; width:21px; height:21px; margin-right:7px; border-radius:50%;
  background:#111; color:#b6f23c; font-size:.72rem; font-weight:800; vertical-align:1px; letter-spacing:0; }
.rsd-etq{ display:flex; align-items:center; }
.rsd-op{ padding-right:34px; }
.rsd-op::after{ content:""; position:absolute; top:10px; right:10px; width:18px; height:18px; border-radius:50%; border:2px solid #cfcfcf; background:#fff;
  transition:all .15s; }
.rsd-op.on{ border-color:#5f9a00; background:#f3fae6; box-shadow:0 0 0 3px rgba(125,201,0,.18); }
.rsd-op.on::after{ border-color:#5f9a00; background:#7DC900 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/12px no-repeat; }
.rsd-op-fijo{ cursor:default; max-width:340px; }
.rsd-alerta{ animation:rsdSacude .45s ease; }
.rsd-alerta .rsd-op{ border-color:#f59e0b; }
@keyframes rsdSacude{ 0%,100%{ transform:none; } 20%{ transform:translateX(-6px); } 40%{ transform:translateX(6px); } 60%{ transform:translateX(-4px); } 80%{ transform:translateX(3px); } }
.rsd-step{ border-color:#111; }
.rsd-step button{ background:#111; color:#fff; }
.rsd-step button:hover{ background:#333; }
.rsd-step button:disabled{ background:#e9e9e9; color:#999; opacity:1; }
.rsd-step input{ width:84px; font-size:1.25rem; border-color:#111; }
.rsd-nudge{ margin:9px 0 0; padding:7px 11px; border-radius:9px; background:#f3fae6; color:#3d6200; font-size:.82rem; font-weight:600; line-height:1.4; }
.rsd-nudge[hidden]{ display:none; }
.rsd-res{ background:#111; color:#fff; padding:14px 16px; border-radius:12px; transition:box-shadow .3s; }
.rsd-res .rsd-fila dt{ color:#b5b5b5; }
.rsd-res .rsd-fila dd{ color:#fff; }
.rsd-res .rsd-fila.rsd-total{ border-top-color:#7DC900; margin-top:8px; padding-top:10px; }
.rsd-res .rsd-fila.rsd-total dt{ color:#fff; font-size:1rem; align-self:flex-end; }
.rsd-res .rsd-fila.rsd-total dd{ color:#b6f23c; font-size:1.55rem; line-height:1; }
.rsd-res .rsd-aviso{ color:#e6e6e6; }
.rsd-res .rsd-aviso b{ color:#b6f23c; }
.rsd-res.flash{ animation:rsdFlash .55s ease; }
@keyframes rsdFlash{ 0%{ box-shadow:0 0 0 0 rgba(125,201,0,.7); } 100%{ box-shadow:0 0 0 12px rgba(125,201,0,0); } }
@media (prefers-reduced-motion: reduce){ .rsd-alerta, .rsd-res.flash{ animation:none; } }
@media (max-width:480px){ .rsd{ padding:15px 14px 14px; } .rsd-tabla{ font-size:.76rem; } .rsd-tabla th, .rsd-tabla td{ padding:7px 5px; } .rsd-tabla thead th{ white-space:normal; } .rsd-tabla tbody th{ min-width:84px; } .rsd-ops{ grid-template-columns:1fr; } }
/* 2026-10-07 · tabla de precios debajo del botón (plegable en el celular) */
.rsd-tabla-d{ margin:14px 0 0; }
.rsd-tabla-d > summary{ cursor:pointer; list-style:none; font-size:.8rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; padding:6px 0; }
.rsd-tabla-d > summary::-webkit-details-marker{ display:none; }
.rsd-tabla-d > summary::before{ content:'▸ '; }
.rsd-tabla-d[open] > summary::before{ content:'▾ '; }
.rsd-tabla-d .rsd-tabla caption{ display:none; }
/* 2026-10-16 · Precio con IGV como importe principal; base sin IGV como dato secundario */
.rsd-op em{ font-size:.92rem; font-weight:800; color:#111; }
.rsd-op em span{ font-size:.74rem; font-weight:600; color:#4d7a00; }
.rsd-op-base{ font-size:.72rem; color:#7a7a74; }
.rsd-tabla td small.rsd-tb-base{ display:block; font-size:.68rem; font-weight:500; color:#8a8a84; }
.rsd-fila dt small, .rsd-fila dd small{ font-size:.74rem; font-weight:500; color:#8a8a84; }
.rsd-otros-p small{ font-weight:500; color:#7a7a74; }
.rsd-res-base{ margin:6px 0 0 !important; font-size:.8rem; line-height:1.4; color:#6b6b65; }
.rsd-cierre .rsd-res-base{ color:#cfcfcf; }
.rsd-arte-n{ margin:8px 0 0; font-size:.78rem; line-height:1.45; color:#6b6b64; }
/* ¿Cuál es la diferencia entre ambos materiales? */
.rsd-cmp{ margin:10px 0 0; }
.rsd-cmp > summary{ display:inline; cursor:pointer; list-style:none; font-size:.82rem; font-weight:700; color:#3f6212; text-decoration:underline; text-underline-offset:3px; }
.rsd-cmp > summary::-webkit-details-marker{ display:none; }
.rsd-cmp > summary:focus-visible{ outline:3px solid #0a66c2; outline-offset:2px; border-radius:4px; }
.rsd-cmp[open] > summary{ color:#111; }
.rsd-cmp-g{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:10px 0 0; }
.rsd-cmp-c{ padding:12px 14px; border:1px solid #e4e4de; border-radius:12px; background:#fafaf7; min-width:0; }
.rsd-cmp-c--pro{ border-color:#111; background:#fff; }
.rsd-cmp-t{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:2px 8px; margin:0 0 4px !important; }
.rsd-cmp-t b{ font-size:.9rem !important; color:#111; }
.rsd-cmp-t span{ font-size:.7rem !important; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:#4d7a00; }
.rsd-cmp-d{ margin:0 0 6px !important; font-size:.8rem !important; line-height:1.4; color:#444; }
.rsd-cmp-c ul{ margin:0 !important; padding:0 0 0 16px !important; }
.rsd-cmp-c li{ margin:0 0 3px !important; font-size:.78rem !important; line-height:1.4; color:#333; list-style:disc; }
.rsd-cmp-n{ margin:8px 0 0 !important; font-size:.76rem !important; line-height:1.45; color:#6b6b64; }
@media (max-width:560px){ .rsd-cmp-g{ grid-template-columns:1fr; } }
