/* Component scoped to avoid inheriting dark WordPress theme input styles. */
.ecsv-root{--ecsv-blue:#315b91;--ecsv-ink:#182536;--ecsv-muted:#526174;--ecsv-stroke:#d9e1ea;--ecsv-wash:#f4f7fb;box-sizing:border-box;display:block;max-width:1050px;margin:24px auto;padding:clamp(16px,3vw,30px);background:#fff;color:var(--ecsv-ink);border:1px solid var(--ecsv-stroke);border-radius:18px;font-family:inherit;line-height:1.5;overflow-wrap:anywhere}
.ecsv-root *, .ecsv-root *:before,.ecsv-root *:after{box-sizing:border-box}
.ecsv-root [hidden]{display:none!important}
.ecsv-root .ecsv-eyebrow{font-size:12px;letter-spacing:.09em;color:var(--ecsv-blue);font-weight:750}
.ecsv-root h3,.ecsv-root h4,.ecsv-root p{color:inherit;margin:0}
.ecsv-root h3{font-size:clamp(21px,2.7vw,29px);line-height:1.2;margin:8px 0}
.ecsv-root h4{font-size:17px;line-height:1.3;margin:0 0 15px}
.ecsv-root .ecsv-heading p{font-size:15px;color:var(--ecsv-muted);max-width:740px}
.ecsv-root .ecsv-switch{display:grid;grid-template-columns:1fr 1fr;margin:24px 0 18px;background:var(--ecsv-wash);border:1px solid var(--ecsv-stroke);padding:5px;border-radius:12px;gap:5px}
.ecsv-root button,.ecsv-root input,.ecsv-root select{font-family:inherit}
.ecsv-root .ecsv-tab{appearance:none;background:transparent;border:0;border-radius:8px;padding:12px 9px;color:var(--ecsv-muted);font-size:14px;font-weight:650;line-height:1.3;min-height:47px;cursor:pointer;transition:background .15s ease}
.ecsv-root .ecsv-tab.is-active{background:#fff;color:#203f68;box-shadow:0 1px 5px #1825361a}
.ecsv-root .ecsv-tab:focus-visible,.ecsv-root .ecsv-result:focus-visible,.ecsv-root .ecsv-input:focus-visible,.ecsv-root a:focus-visible,.ecsv-root .ecsv-manual-cta:focus-visible{outline:3px solid #8db9ef;outline-offset:2px}
.ecsv-root .ecsv-label{display:block;font-size:13px;font-weight:700;margin:0 0 7px;color:var(--ecsv-ink)}
.ecsv-root .ecsv-input{display:block;width:100%;min-height:44px;border:1px solid #bfcedd;border-radius:9px;background:#fff;color:var(--ecsv-ink);font-size:15px;padding:10px 12px;box-shadow:none}
.ecsv-root .ecsv-input::placeholder{color:#8290a1;opacity:1}
.ecsv-root .ecsv-found{font-size:12px;color:var(--ecsv-muted);margin:10px 1px}
.ecsv-root .ecsv-result-list{display:grid;max-height:286px;overflow-y:auto;overscroll-behavior:contain;border:1px solid var(--ecsv-stroke);border-radius:11px;background:#fff}
.ecsv-root .ecsv-result{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;min-height:52px;padding:9px 12px;border:0;border-bottom:1px solid #edf1f6;border-radius:0;text-align:left;background:#fff;color:var(--ecsv-ink);cursor:pointer}
.ecsv-root .ecsv-result:last-child{border-bottom:0}
.ecsv-root .ecsv-result:hover{background:var(--ecsv-wash)}
.ecsv-root .ecsv-result-text{display:flex;flex-direction:column;gap:1px;min-width:0}
.ecsv-root .ecsv-result-text>span{font-size:14px;font-weight:650;line-height:1.35}
.ecsv-root .ecsv-result-text small,.ecsv-root .ecsv-result-arrow{font-size:12px;color:var(--ecsv-muted)}
.ecsv-root .ecsv-result-arrow{white-space:nowrap}
.ecsv-root .ecsv-empty{padding:12px;color:var(--ecsv-muted);font-size:14px}
.ecsv-root .ecsv-selected{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:13px 0;padding:12px;background:var(--ecsv-wash);border:1px solid var(--ecsv-stroke);border-radius:12px}
.ecsv-root .ecsv-product-image{height:80px;width:80px;min-width:80px;object-fit:contain;object-position:center;border-radius:7px;background:#fff;border:1px solid var(--ecsv-stroke);padding:4px}
.ecsv-root .ecsv-picked-text{display:flex;flex:1;flex-direction:column;align-items:flex-start;gap:4px;min-width:175px}
.ecsv-root .ecsv-picked-text strong{font-size:14px;line-height:1.35}
.ecsv-root .ecsv-picked-text small{font-size:12px;color:var(--ecsv-muted)}
.ecsv-root .ecsv-product-link{font-size:13px;font-weight:650;color:var(--ecsv-blue);text-decoration:underline}
.ecsv-root .ecsv-manual-cta{width:auto;max-width:100%;background:#fff;border:1px solid var(--ecsv-blue);color:var(--ecsv-blue);border-radius:8px;padding:9px 12px;font-size:13px;min-height:42px;cursor:pointer}
.ecsv-root .ecsv-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.ecsv-root .ecsv-hint,.ecsv-root .ecsv-secondary{font-size:12px;color:var(--ecsv-muted);margin:10px 0 0}
.ecsv-root .ecsv-ocular{margin-top:21px;padding-top:20px;border-top:1px solid var(--ecsv-stroke)}
.ecsv-root .ecsv-metrics{margin-top:24px;border:1px solid #cfdbeb;background:var(--ecsv-wash);border-radius:12px;padding:17px}
.ecsv-root .ecsv-metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.ecsv-root .ecsv-metric-grid>div{min-width:0;padding:12px 10px;border:1px solid var(--ecsv-stroke);border-radius:9px;background:#fff;text-align:center}
.ecsv-root .ecsv-metric-grid strong{display:block;font-size:clamp(19px,2.6vw,25px);font-weight:750;line-height:1.2;color:#18395f;font-variant-numeric:tabular-nums}
.ecsv-root .ecsv-metric-grid span{display:block;margin-top:5px;font-size:12px;color:var(--ecsv-muted);line-height:1.3}
.ecsv-root .ecsv-alert{margin:11px 0 0;padding:10px 13px;border-radius:8px;border:1px solid #efdcb1;background:#fff7e4;color:#694719;font-size:13px}
.ecsv-root .ecsv-notice{margin-top:18px;border-left:3px solid #4177bd;padding:13px 15px;background:#f6f9fd;border-radius:0 9px 9px 0}
.ecsv-root .ecsv-notice>strong{display:block;font-size:13px;color:#26476b}
.ecsv-root .ecsv-notice p{margin:5px 0 0;font-size:13px;color:#435266}
@media(max-width:620px){
 .ecsv-root{margin:14px auto;padding:15px;border-radius:12px}
 .ecsv-root .ecsv-switch{margin-top:18px}
 .ecsv-root .ecsv-form-grid{grid-template-columns:1fr}
 .ecsv-root .ecsv-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .ecsv-root .ecsv-metric-grid strong{font-size:22px}
 .ecsv-root .ecsv-result-arrow{font-size:11px}
 .ecsv-root .ecsv-selected{align-items:flex-start}
}
@media(max-width:390px){
 .ecsv-root .ecsv-tab{font-size:12px;padding:10px 5px}
 .ecsv-root .ecsv-product-image{width:68px;min-width:68px;height:68px}
 .ecsv-root .ecsv-result-arrow{display:none}
}

.ecsv-root .ecsv-manual-warning{font-size:13px;padding:11px 13px;margin:0 0 14px;background:#fff7e4;border:1px solid #ecd8a8;border-radius:9px;color:#694719}

/* v0.2.0: visualizador de escala angular */
.ecsv-root .ecsv-visual{margin-top:23px;padding-top:22px;border-top:1px solid var(--ecsv-stroke)}
.ecsv-root .ecsv-visual-intro{margin:0 0 13px;color:var(--ecsv-muted);font-size:14px;line-height:1.55}
.ecsv-root .ecsv-objects{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:13px 0 16px}
.ecsv-root .ecsv-objects button{appearance:none;display:block;min-width:0;padding:10px 6px;line-height:1.25;min-height:44px;cursor:pointer;background:#fff;color:#264361;border:1px solid #cddbea;border-radius:9px;font-weight:650;font-size:12px;white-space:normal}
.ecsv-root .ecsv-objects button.is-active{background:#244b80;color:#fff;border-color:#244b80}
.ecsv-root .ecsv-objects button:focus-visible{outline:3px solid #8db9ef;outline-offset:2px}
.ecsv-root .ecsv-visual-controls{margin-bottom:16px}
.ecsv-root .ecsv-visual-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,0.9fr);gap:18px;align-items:start}
.ecsv-root .ecsv-sky-figure{background:#0a111b;border-radius:13px;padding:11px;min-width:0;text-align:center;overflow:hidden}
.ecsv-root .ecsv-canvas{display:block;width:100%;max-width:450px;height:auto;aspect-ratio:1/1;margin:0 auto;background:#0a111b}
.ecsv-root .ecsv-canvas-caption{display:block;font-size:11px;line-height:1.45;color:#c3cddd;margin:4px 0 0}
.ecsv-root .ecsv-visual-copy{padding:8px 0;min-width:0}
.ecsv-root .ecsv-visual-copy h5{font-size:clamp(17px,2vw,23px);line-height:1.25;margin:0 0 13px;color:#193d65}
.ecsv-root .ecsv-visual-copy p{font-size:13px;line-height:1.56;margin:0 0 12px;color:#43566a}
.ecsv-root .ecsv-object-fit{background:#f0f5fc;border-radius:8px;padding:10px 12px}
@media(max-width:760px){.ecsv-root .ecsv-visual-grid{grid-template-columns:1fr}.ecsv-root .ecsv-canvas{max-width:360px}.ecsv-root .ecsv-visual-copy{padding:0}}
@media(max-width:510px){.ecsv-root .ecsv-objects{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.ecsv-root .ecsv-objects button{font-size:12px;min-height:45px}}

.ecsv-root .ecsv-sky-figure{position:relative}

/* v0.3.1 - campo del ocular y avisos en columna informativa. */
.ecsv-root .ecsv-visual{margin-top:27px}
.ecsv-root .ecsv-visual h4{font-size:20px;letter-spacing:-.01em}
.ecsv-root .ecsv-visual-intro{max-width:870px;margin-bottom:14px}
.ecsv-root .ecsv-visual-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:20px;align-items:start}
.ecsv-root .ecsv-sky-figure{padding:13px;background:linear-gradient(155deg,#091321,#050b14);border:1px solid #253e5b;border-radius:17px;box-shadow:0 14px 25px -20px #00173280;overflow:hidden}
.ecsv-root .ecsv-figure-kicker{display:flex;gap:8px;align-items:center;justify-content:center;font-size:10px;letter-spacing:.085em;color:#a9c3e1;font-weight:750;padding:7px 0 0}
.ecsv-root .ecsv-figure-dot{width:7px;height:7px;display:inline-block;border-radius:100%;background:#66c8b4;box-shadow:0 0 0 3px #66c8b429}
.ecsv-root .ecsv-canvas{max-width:490px;background:transparent;image-rendering:auto}
.ecsv-root .ecsv-canvas-caption{font-size:11px;color:#b3c8e0;padding:0 2px 5px}
.ecsv-root .ecsv-canvas-caption strong{color:#f1f6ff}
.ecsv-root .ecsv-visual-copy{padding:0 0 5px}
.ecsv-root .ecsv-visual-copy h5{font-size:clamp(20px,2vw,24px);margin:2px 0 4px}
.ecsv-root .ecsv-object-fit{color:#1b456b;font-size:13px}
.ecsv-root .ecsv-object-comment,.ecsv-root .ecsv-object-note{font-size:13px}
.ecsv-root .ecsv-notice{border-radius:11px;border:1px solid #d1e2f3;border-left:4px solid #3374aa;margin-top:20px;padding:16px;background:#f4f8fe}
.ecsv-root .ecsv-notice>strong{font-size:14px}
@media(max-width:810px){
 .ecsv-root .ecsv-visual-grid{grid-template-columns:1fr;gap:16px}
 .ecsv-root .ecsv-sky-figure{width:100%;max-width:520px;margin:0 auto}
 .ecsv-root .ecsv-canvas{max-width:460px}
 .ecsv-root .ecsv-visual-copy{display:block}

}
@media(max-width:550px){
 .ecsv-root .ecsv-visual-copy{display:block}

 .ecsv-root .ecsv-figure-kicker{font-size:9px}
 .ecsv-root .ecsv-objects{gap:7px}
 .ecsv-root .ecsv-sky-figure{padding:8px;border-radius:12px}
}
.ecsv-root .ecsv-locator-note{display:block;font-size:10px;color:#9cb5d2;margin:4px 0 2px;line-height:1.45}

/* v0.3.1: avisos dentro de la columna de explicaciones. */
.ecsv-root .ecsv-visual-copy .ecsv-notice{margin:15px 0 0;padding:14px 15px;border-left:4px solid #3374aa;border-radius:0 10px 10px 0;background:#f3f7fd;box-shadow:none}
.ecsv-root .ecsv-visual-copy .ecsv-notice>strong{display:block;font-size:13px;line-height:1.45;color:#204a74}
.ecsv-root .ecsv-visual-copy .ecsv-notice p{margin:8px 0 0;font-size:12.5px;line-height:1.6;color:#38516b}
@media(max-width:810px){.ecsv-root .ecsv-visual-copy{max-width:720px;margin:0 auto}}
@media(max-width:550px){.ecsv-root .ecsv-visual-copy .ecsv-notice{padding:13px}}

.ecsv-root .ecsv-visual-copy .ecsv-notice p strong{display:inline;font:inherit;font-weight:700;color:inherit}

/* v0.3.2 - verificacion del build para administradores y guardia anti-cache. */
.ecsv-root .ecsv-detail-card{display:none!important}
.ecsv-root .ecsv-build-tag{display:inline-flex;margin-bottom:6px;padding:3px 9px;border-radius:30px;background:#eef4fb;color:#315a85;font-weight:600;font-size:11px;line-height:1.4;font-family:inherit;letter-spacing:.02em}
.ecsv-root .ecsv-build-tag[hidden]{display:none!important}

/* v0.3.3: responsive real segun el ancho disponible dentro de WordPress.
   El limite del visor controla su tamano en monitores de 21/24 pulgadas,
   sin modificar la proporcion fisica de ningun objeto dentro del ocular. */
.ecsv-root{
  width:100%;
  max-width:1050px;
  min-width:0;
  container:ecsv-simulador / inline-size;
}
.ecsv-root .ecsv-visual-grid{
  display:grid;
  grid-template-columns:minmax(0,min(44%,400px)) minmax(0,1fr);
  gap:clamp(14px,1.8cqw,20px);
  align-items:start;
  width:100%;
  min-width:0;
}
.ecsv-root .ecsv-sky-figure{
  width:100%;
  max-width:400px;
  min-width:0;
  justify-self:center;
  padding:clamp(8px,1.2cqw,12px);
}
.ecsv-root .ecsv-canvas{
  width:min(100%,368px,59dvh);
  max-width:100%;
  height:auto;
  aspect-ratio:1/1;
  margin-inline:auto;
}
.ecsv-root .ecsv-visual-copy{
  width:100%;
  min-width:0;
  max-width:none;
  margin:0;
}
.ecsv-root .ecsv-visual-copy p,
.ecsv-root .ecsv-visual-copy .ecsv-notice{
  overflow-wrap:break-word;
}
@container ecsv-simulador (max-width:790px){
  .ecsv-root .ecsv-visual-grid{
    grid-template-columns:minmax(0,1fr);
    gap:16px;
  }
  .ecsv-root .ecsv-sky-figure{
    max-width:400px;
    width:100%;
    justify-self:center;
  }
  .ecsv-root .ecsv-visual-copy{
    max-width:620px;
    margin-inline:auto;
  }
}
@media(max-width:810px){
  .ecsv-root .ecsv-visual-grid{
    grid-template-columns:minmax(0,1fr);
    gap:16px;
  }
  .ecsv-root .ecsv-sky-figure{max-width:400px;margin-inline:auto}
}
@media(orientation:landscape) and (max-height:520px) and (max-width:950px){
  .ecsv-root .ecsv-sky-figure{max-width:345px}
  .ecsv-root .ecsv-canvas{width:min(100%,315px)}
}
@media(max-width:550px){
  .ecsv-root .ecsv-canvas{
    width:min(100%,370px);
    max-width:100%;
  }
  .ecsv-root .ecsv-sky-figure{max-width:100%}
}
