/*
 * Calculadora de bodas. Todo cuelga de #hc-bodas, con all:initial en la raiz, asi que no
 * hereda nada del tema ni se escapa a el. Origen: bloque autonomo de la auditoria Webpositer.
 */
#hc-bodas{
    --hc-marca:#F2B416;
    --hc-marca-suave:#FFF8C2;
    --hc-marca-oscura:#B8850C;
    --hc-titular:#3A3A3A;
    --hc-texto:#434343;
    --hc-parrafo:#525252;
    --hc-tenue:#8C8C8C;
    --hc-surface:#FFFFFF;
    --hc-sunk:#FAF9F6;
    --hc-line:#E6E4DE;
    --hc-line-fuerte:#CFCCC4;
    --hc-ok:#2E7D5B;    --hc-ok-bg:#EAF4EF;
    --hc-aviso:#C2681A; --hc-aviso-bg:#FBF0E5;
    --hc-tope:#B3392F;  --hc-tope-bg:#FBECEA;

    all:initial;
    display:block;
    box-sizing:border-box;
    width:100%;
    font-family:Roboto,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
    font-size:14px;
    line-height:1.7;
    color:var(--hc-texto);
    background:var(--hc-surface);
    border:1px solid var(--hc-line);
    border-radius:14px;
    padding:22px 24px;
    margin:34px 0;
    box-shadow:0 -7px 14px rgba(0,0,0,.08);
    -webkit-font-smoothing:antialiased;
    text-align:left;
    /* 'all:initial' resetea también el ajuste de texto del móvil: hay que
       devolverlo, o iOS y Android reescalan el tamaño por su cuenta. */
    -webkit-text-size-adjust:100%;
    text-size-adjust:100%;
  }
  #hc-bodas *,#hc-bodas *::before,#hc-bodas *::after{box-sizing:border-box}
  #hc-bodas p,#hc-bodas span,#hc-bodas label,#hc-bodas div,#hc-bodas summary{
    margin:0;padding:0;font-family:inherit;color:inherit;text-transform:none;letter-spacing:normal
  }

  #hc-bodas .hc-eyebrow{
    font-family:Poppins,Roboto,sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.08em;
    text-transform:uppercase;color:var(--hc-marca-oscura);display:block;margin-bottom:4px}
  #hc-bodas .hc-title{
    font-family:Poppins,Roboto,sans-serif;font-weight:600;color:var(--hc-titular);
    font-size:19px;line-height:1.3;margin-bottom:18px}

  #hc-bodas .hc-lab{
    font-family:Poppins,Roboto,sans-serif;font-weight:600;font-size:13.5px;
    color:var(--hc-titular);display:block;margin-bottom:8px}

  /* 1 · deslizador */
  #hc-bodas .hc-slider-fila{display:flex;align-items:center;gap:14px}
  #hc-bodas .hc-slider-val{
    font-family:Poppins,Roboto,sans-serif;font-weight:600;font-size:19px;
    font-variant-numeric:tabular-nums;color:var(--hc-marca-oscura);white-space:nowrap;min-width:80px}
  #hc-bodas input[type=range]{
    -webkit-appearance:none;appearance:none;flex:1;min-width:0;height:20px;
    background:transparent;cursor:pointer;margin:0;padding:0;border:0}
  #hc-bodas input[type=range]::-webkit-slider-runnable-track{
    height:5px;border-radius:99px;background:var(--hc-marca-suave);border:1px solid var(--hc-line)}
  #hc-bodas input[type=range]::-moz-range-track{
    height:5px;border-radius:99px;background:var(--hc-marca-suave);border:1px solid var(--hc-line)}
  #hc-bodas input[type=range]::-webkit-slider-thumb{
    -webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--hc-marca);
    border:3px solid var(--hc-surface);margin-top:-7.5px;box-shadow:0 1px 4px rgba(0,0,0,.25)}
  #hc-bodas input[type=range]::-moz-range-thumb{
    width:18px;height:18px;border-radius:50%;background:var(--hc-marca);
    border:3px solid var(--hc-surface);box-shadow:0 1px 4px rgba(0,0,0,.25)}
  #hc-bodas input[type=range]:focus-visible{outline:2px solid var(--hc-marca);outline-offset:3px;border-radius:99px}

  /* 2 · servicio */
  #hc-bodas .hc-campo2{margin-top:20px;padding-top:18px;border-top:1px solid var(--hc-line)}
  #hc-bodas .hc-chips{display:flex;flex-wrap:wrap;gap:8px}
  #hc-bodas .hc-chip{
    position:relative;display:inline-flex;flex-direction:column;gap:1px;
    border:1px solid var(--hc-line);border-radius:14px;padding:9px 16px;cursor:pointer;
    background:var(--hc-surface);line-height:1.35;
    transition:border-color .13s,background .13s}
  #hc-bodas .hc-chip:hover{border-color:var(--hc-line-fuerte)}
  #hc-bodas .hc-chip.is-on{border-color:var(--hc-marca);background:var(--hc-marca-suave)}
  #hc-bodas .hc-chip.is-focus{outline:2px solid var(--hc-marca);outline-offset:2px}
  #hc-bodas .hc-chip input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
  #hc-bodas .hc-chip-v{
    font-family:Poppins,Roboto,sans-serif;font-weight:600;font-size:15px;
    color:var(--hc-titular);font-variant-numeric:tabular-nums}
  #hc-bodas .hc-chip.is-on .hc-chip-v{color:var(--hc-marca-oscura)}
  #hc-bodas .hc-chip-t{font-size:12px;color:var(--hc-tenue)}
  #hc-bodas .hc-ayuda{
    display:block;margin-top:9px;font-size:11.5px;line-height:1.5;color:var(--hc-tenue)}

  /* resultado */
  #hc-bodas .hc-res{
    margin-top:20px;border-radius:12px;background:var(--hc-sunk);
    border:1px solid var(--hc-line);border-top:3px solid var(--hc-marca);
    padding:16px 18px;display:flex;align-items:center;gap:14px}
  #hc-bodas .hc-res-n{
    font-family:Poppins,Roboto,sans-serif;font-weight:700;color:var(--hc-marca-oscura);
    font-size:38px;line-height:1;font-variant-numeric:tabular-nums}
  #hc-bodas .hc-res-u{
    font-family:Poppins,Roboto,sans-serif;font-weight:600;font-size:15px;
    color:var(--hc-titular);line-height:1.35}
  #hc-bodas .hc-res-u small{display:block;font-family:Roboto,sans-serif;font-weight:400;
    font-size:12.5px;color:var(--hc-tenue)}

  /* semáforo */
  #hc-bodas .hc-season{
    margin-top:9px;border-radius:10px;padding:10px 14px;border:1px solid;
    font-size:12.5px;line-height:1.5;display:flex;gap:9px;align-items:flex-start}
  #hc-bodas .hc-season.is-ok{background:var(--hc-ok-bg);border-color:var(--hc-ok)}
  #hc-bodas .hc-season.is-warn{background:var(--hc-aviso-bg);border-color:var(--hc-aviso)}
  #hc-bodas .hc-season.is-stop{background:var(--hc-tope-bg);border-color:var(--hc-tope)}
  #hc-bodas .hc-dot{width:8px;height:8px;border-radius:50%;flex:none;margin-top:5px}
  #hc-bodas .hc-season.is-ok .hc-dot{background:var(--hc-ok)}
  #hc-bodas .hc-season.is-warn .hc-dot{background:var(--hc-aviso)}
  #hc-bodas .hc-season.is-stop .hc-dot{background:var(--hc-tope)}
  #hc-bodas .hc-season b{font-family:Poppins,Roboto,sans-serif;font-weight:600;color:var(--hc-titular)}
  #hc-bodas .hc-season span{color:var(--hc-parrafo)}

  /* desglose */
  #hc-bodas details{margin-top:12px;border-top:1px solid var(--hc-line);padding-top:10px}
  #hc-bodas summary{
    cursor:pointer;list-style:none;font-size:12.5px;font-weight:500;
    color:var(--hc-marca-oscura);display:flex;align-items:center;gap:6px}
  #hc-bodas summary::-webkit-details-marker{display:none}
  #hc-bodas summary::before{content:"▸";font-size:10px;transition:transform .15s}
  #hc-bodas details[open] summary::before{transform:rotate(90deg)}
  #hc-bodas summary:focus-visible{outline:2px solid var(--hc-marca);outline-offset:2px;border-radius:4px}
  #hc-bodas .hc-rows{margin-top:9px}
  #hc-bodas .hc-row{
    display:flex;justify-content:space-between;align-items:baseline;gap:16px;
    padding:6px 0;border-bottom:1px dotted var(--hc-line);font-size:12.5px}
  #hc-bodas .hc-row:last-child{border-bottom:0}
  #hc-bodas .hc-row.is-total{
    border-top:1.5px solid var(--hc-marca);border-bottom:0;margin-top:4px;padding-top:9px;
    font-family:Poppins,Roboto,sans-serif;font-weight:600;font-size:13.5px}
  #hc-bodas .hc-k{color:var(--hc-parrafo)}
  #hc-bodas .hc-row.is-total .hc-k{color:var(--hc-titular)}
  #hc-bodas .hc-v{font-variant-numeric:tabular-nums;font-weight:500;white-space:nowrap;color:var(--hc-texto)}
  #hc-bodas .hc-row.is-total .hc-v{color:var(--hc-marca-oscura);font-weight:600}
  #hc-bodas .hc-row.is-sub .hc-k{padding-left:12px;color:var(--hc-tenue);font-size:12px}
  #hc-bodas .hc-row.is-sub .hc-v{font-weight:400;color:var(--hc-tenue);font-size:12px}

  #hc-bodas .hc-foot{margin-top:12px;font-size:11.5px;color:var(--hc-tenue);line-height:1.55}
  #hc-bodas .hc-foot b{color:var(--hc-parrafo);font-weight:500}
  #hc-bodas .hc-foot p + p{margin-top:6px}

  /* --- móvil --------------------------------------------------------------
     Los tres botones pasan a ancho completo y se leen como una lista: en una
     pantalla estrecha, tres píldoras partidas en dos líneas se leen fatal.  */
  @media (max-width:560px){
    #hc-bodas{padding:18px 16px;border-radius:12px;margin:26px 0}
    #hc-bodas .hc-title{font-size:18px}
    #hc-bodas .hc-chips{gap:6px}
    #hc-bodas .hc-chip{
      flex:1 1 100%;flex-direction:row;align-items:baseline;gap:8px;
      justify-content:flex-start;padding:11px 16px}
    #hc-bodas .hc-chip-v{font-size:15px;min-width:62px}
    #hc-bodas .hc-chip-t{font-size:12.5px}
    #hc-bodas .hc-slider-val{font-size:18px;min-width:72px}
    #hc-bodas .hc-res{padding:14px 16px;gap:12px}
    #hc-bodas .hc-res-n{font-size:32px}
    #hc-bodas .hc-res-u{font-size:14px}
  }
  /* pantallas muy estrechas (320-360 px): el resultado se apila */
  @media (max-width:360px){
    #hc-bodas{padding:16px 14px}
    #hc-bodas .hc-slider-fila{flex-wrap:wrap;gap:6px}
    #hc-bodas .hc-slider-val{min-width:0;width:100%}
    #hc-bodas input[type=range]{flex:1 1 100%}
    #hc-bodas .hc-res{flex-direction:column;align-items:flex-start;gap:2px}
    #hc-bodas .hc-res-n{font-size:34px}
  }
  @media (prefers-reduced-motion:reduce){#hc-bodas *{transition:none !important}}
