.oai-cc-v2{--cc-blue:#0ea5e9;--cc-blue-dark:#0284c7;--cc-blue-soft:#eef8ff;--cc-text:#172033;--cc-muted:#687386;--cc-line:#dbe4ee;--cc-card:#fff;--cc-shadow:0 5px 18px rgba(15,23,42,.06);font-family:inherit;color:var(--cc-text);max-width:980px;margin:20px 0 28px}
.oai-cc-v2>h3{font-size:clamp(26px,3vw,38px);line-height:1.1;margin:0 0 22px;font-weight:750;letter-spacing:-.02em}
.oai-cc-v2-top{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:14px;padding:18px;background:#fff;border:1px solid var(--cc-line);border-radius:16px;box-shadow:var(--cc-shadow);margin-bottom:22px}
.oai-cc-v2-field{min-width:0}.oai-cc-v2-field label,.oai-cc-v2-endpoint>h4,.oai-cc-terminal-options h5,.oai-cc-accessories h5{display:block;margin:0 0 8px;font-size:16px;line-height:1.3;font-weight:700;color:var(--cc-text)}
.oai-cc-v2-field select,.oai-cc-v2-field input[type=number]{width:100%;min-height:46px;border:1px solid #cbd5e1;border-radius:10px;background:#fff;padding:8px 12px;font-size:15px;box-shadow:none}.oai-cc-v2-field select:focus,.oai-cc-v2-field input:focus{border-color:var(--cc-blue);outline:2px solid rgba(14,165,233,.14);outline-offset:1px}
.oai-cc-v2-field small{display:block;margin-top:6px;color:var(--cc-muted);font-size:13px}.oai-cc-v2-colors{display:flex;gap:8px}.oai-cc-v2-colors button{min-height:46px;border:1px solid #cbd5e1;border-radius:10px;background:#fff;padding:8px 13px;font-size:14px;font-weight:650;color:var(--cc-text);display:inline-flex;align-items:center;gap:8px;cursor:pointer;transition:.16s ease}.oai-cc-v2-colors button:hover{border-color:#94a3b8}.oai-cc-v2-colors button.selected{border-color:var(--cc-blue);background:var(--cc-blue-soft);box-shadow:0 0 0 2px rgba(14,165,233,.12)}.oai-cc-v2-colors .dot{width:13px;height:13px;border-radius:50%;border:1px solid rgba(0,0,0,.18)}.oai-cc-v2-colors .red{background:#e11d48}.oai-cc-v2-colors .black{background:#111827}
.oai-cc-v2-endpoint{padding:22px 0;border-top:1px solid var(--cc-line)}.oai-cc-v2-endpoint>h4{font-size:21px;margin-bottom:14px}.oai-cc-v2-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.oai-cc-v2-card{position:relative;appearance:none;border:1px solid #ced8e3;border-radius:14px;background:var(--cc-card);padding:11px;min-height:0;cursor:pointer;box-shadow:0 2px 8px rgba(15,23,42,.03);transition:border-color .15s,box-shadow .15s,background .15s,transform .15s;text-align:center;color:var(--cc-text)}.oai-cc-v2-card:hover{border-color:#9db2c7;transform:translateY(-1px);box-shadow:0 5px 14px rgba(15,23,42,.06)}.oai-cc-v2-card.selected{border-color:var(--cc-blue);background:var(--cc-blue-soft);box-shadow:0 0 0 2px rgba(14,165,233,.14)}.oai-cc-v2-card.selected:after,.oai-cc-option.selected:after{content:'✓';position:absolute;right:-7px;top:-8px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--cc-blue);color:#fff;font-size:17px;font-weight:800;box-shadow:0 4px 10px rgba(2,132,199,.25)}.oai-cc-v2-card img{display:block;width:100%;height:130px;object-fit:contain;border-radius:10px;background:#fff;margin:0 auto 10px}.oai-cc-v2-card>span{display:block;font-size:15px;line-height:1.3;font-weight:680}.oai-cc-v2-card>small{display:block;margin-top:5px;color:#526277;font-size:13px;font-weight:650}
.oai-cc-terminal-options,.oai-cc-accessories{margin-top:18px}.oai-cc-v2-options{display:flex;flex-wrap:wrap;gap:10px}.oai-cc-option{position:relative;appearance:none;border:1px solid #cbd5e1;border-radius:10px;background:#fff;padding:10px 16px;min-width:110px;cursor:pointer;color:var(--cc-text);transition:.15s ease}.oai-cc-option:hover{border-color:#94a3b8}.oai-cc-option.selected{border-color:var(--cc-blue);background:var(--cc-blue-soft);box-shadow:0 0 0 2px rgba(14,165,233,.1)}.oai-cc-option .option-label{display:block;font-size:14px;font-weight:700}.oai-cc-option small{display:block;margin-top:3px;font-size:12px;color:#65758b;font-weight:600}.oai-cc-accessories .accessory-cards{grid-template-columns:repeat(4,minmax(0,1fr));max-width:760px}.oai-cc-hint{margin:-2px 0 10px;color:var(--cc-muted);font-size:13px}
.oai-cc-loading{min-height:48px;display:flex;align-items:center;gap:9px;color:var(--cc-muted);font-size:14px;padding:8px 2px}.oai-cc-spinner{width:18px;height:18px;border:2px solid #cbd5e1;border-top-color:var(--cc-blue);border-radius:50%;animation:oaiSpin .7s linear infinite;display:inline-block;vertical-align:-3px}.oai-cc-spinner.small{width:15px;height:15px}@keyframes oaiSpin{to{transform:rotate(360deg)}}.oai-cc-message{padding:10px 12px;border-radius:9px;background:#f8fafc;color:#64748b;border:1px solid #e2e8f0;font-size:13px}.oai-cc-message.error{color:#b42318;background:#fff7f7;border-color:#ffd5d2}
.oai-cc-v2-summary-panel{margin-top:22px;border:1px solid var(--cc-line);border-radius:16px;background:#fff;box-shadow:var(--cc-shadow);overflow:hidden}.oai-cc-v2-summary-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:16px 18px;border-bottom:1px solid var(--cc-line);background:#fbfdff}.oai-cc-v2-summary-head .eyebrow{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:#748397;font-weight:750;margin-bottom:2px}.oai-cc-v2-summary-head h4{margin:0;font-size:20px}.oai-cc-v2-summary-head .total{text-align:right}.oai-cc-v2-summary-head .total span{display:block;font-size:12px;color:var(--cc-muted)}.oai-cc-v2-summary-head .total strong{font-size:22px;line-height:1.1}.oai-cc-v2-summary-table-wrap{overflow:auto}.oai-cc-v2-summary-table{width:100%;border-collapse:collapse;margin:0}.oai-cc-v2-summary-table th,.oai-cc-v2-summary-table td{padding:11px 14px;border-bottom:1px solid #edf2f7;text-align:left;font-size:13px}.oai-cc-v2-summary-table th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#718096;background:#fff}.oai-cc-v2-summary-table td:last-child,.oai-cc-v2-summary-table th:last-child{text-align:right;white-space:nowrap}.oai-cc-v2-summary-note{padding:11px 14px;color:var(--cc-muted);font-size:12px}.oai-cc-v2-summary-head #oai_cc_total.is-loading{color:#64748b;font-size:14px;font-weight:650}
@media(max-width:820px){.oai-cc-v2-top{grid-template-columns:1fr 1fr}.oai-cc-v2-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.oai-cc-v2-card img{height:110px}}
@media(max-width:620px){.oai-cc-v2{margin-top:10px}.oai-cc-v2-top{grid-template-columns:1fr;padding:14px}.oai-cc-v2-endpoint{padding:18px 0}.oai-cc-v2-endpoint>h4{font-size:18px}.oai-cc-v2-cards,.oai-cc-accessories .accessory-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.oai-cc-v2-card{padding:8px;border-radius:12px}.oai-cc-v2-card img{height:105px;margin-bottom:7px}.oai-cc-v2-card>span{font-size:13px}.oai-cc-v2-summary-head{align-items:center}.oai-cc-v2-summary-table th,.oai-cc-v2-summary-table td{padding:9px 10px}.oai-cc-v2-summary-note{display:none}}


/* v3.1 visual refinement: full width, neutral cards, theme-proof buttons */
.oai-cc-v2{
  max-width:none !important;
  width:100% !important;
  margin:18px 0 28px !important;
  --cc-blue:#0ea5e9;
  --cc-blue-dark:#0284c7;
  --cc-blue-soft:#f3f7fa;
  --cc-selected:#f1f5f9;
  --cc-text:#1f2937;
  --cc-muted:#6b7280;
  --cc-line:#d9e0e7;
}
.oai-cc-v2-top{width:100%;box-sizing:border-box}
.oai-cc-v2-cards{
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr)) !important;
  width:100%;
}
.oai-cc-v2-card,
.oai-cc-option,
.oai-cc-v2-colors button{
  background:#fff !important;
  color:var(--cc-text) !important;
  border-color:#cfd8e3 !important;
  box-shadow:none !important;
  text-shadow:none !important;
}
.oai-cc-v2-card:hover,
.oai-cc-option:hover,
.oai-cc-v2-colors button:hover{
  background:#fafbfc !important;
  border-color:#9aa8b8 !important;
  transform:none !important;
}
.oai-cc-v2-card.selected,
.oai-cc-option.selected,
.oai-cc-v2-colors button.selected{
  background:var(--cc-selected) !important;
  border:2px solid var(--cc-blue) !important;
  box-shadow:0 0 0 3px rgba(14,165,233,.08) !important;
}
.oai-cc-v2-card{padding:12px !important;border-radius:14px !important}
.oai-cc-v2-card img{height:125px !important;background:#fff !important}
.oai-cc-v2-card>span{font-size:14px !important;line-height:1.28 !important;font-weight:650 !important}
.oai-cc-v2-card>small{font-size:12px !important;color:#64748b !important}
.oai-cc-v2-card.selected:after,.oai-cc-option.selected:after{
  width:25px;height:25px;right:-7px;top:-8px;font-size:15px;
}
.oai-cc-v2-options{gap:8px}
.oai-cc-option{min-width:105px;padding:9px 14px !important;border-radius:9px !important}
.oai-cc-accessories .accessory-cards{max-width:none !important}
.oai-cc-v2-endpoint{padding:20px 0}
.oai-cc-v2-endpoint>h4{font-size:20px}
.oai-cc-terminal-options h5,.oai-cc-accessories h5{font-size:16px}
.oai-cc-v2-summary-panel{width:100%}
@media(min-width:1180px){
  .oai-cc-v2-card img{height:145px !important}
  .oai-cc-v2-card>span{font-size:15px !important}
}
@media(max-width:820px){
  .oai-cc-v2-cards{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
}
@media(max-width:620px){
  .oai-cc-v2-cards,.oai-cc-accessories .accessory-cards{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .oai-cc-v2-card img{height:105px !important}
}


/* v3.2: selección limpia + estados de carga claramente visibles */
.oai-cc-v2-card.selected,
.oai-cc-option.selected,
.oai-cc-v2-colors button.selected{
  background:#fff !important;
  border:2px solid var(--cc-blue) !important;
  box-shadow:0 0 0 3px rgba(14,165,233,.08) !important;
}
.oai-cc-v2-card.selected:hover,
.oai-cc-option.selected:hover,
.oai-cc-v2-colors button.selected:hover{
  background:#fff !important;
}

.oai-cc-loading{
  position:relative;
  width:100%;
  min-height:78px;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px 18px 20px;
  margin:10px 0 6px;
  border:1px solid #cfe3ef;
  border-radius:12px;
  background:#f8fbfd;
  color:#334155;
  font-size:14px;
  font-weight:650;
  box-shadow:0 2px 10px rgba(15,23,42,.04);
  overflow:hidden;
}
.oai-cc-loading:after{
  content:'';
  position:absolute;
  left:0;
  bottom:0;
  height:3px;
  width:38%;
  border-radius:0 3px 3px 0;
  background:var(--cc-blue);
  animation:oaiLoadingBar 1.15s ease-in-out infinite;
}
.oai-cc-spinner{
  width:24px;
  height:24px;
  flex:0 0 24px;
  border:3px solid #d8e4ec;
  border-top-color:var(--cc-blue);
  box-shadow:none;
}
.oai-cc-spinner.small{
  width:16px;
  height:16px;
  flex-basis:16px;
  border-width:2px;
}
@keyframes oaiLoadingBar{
  0%{transform:translateX(-110%)}
  50%{transform:translateX(110%)}
  100%{transform:translateX(310%)}
}
@media (prefers-reduced-motion:reduce){
  .oai-cc-spinner,.oai-cc-loading:after{animation-duration:2.5s}
}
\n\n/* v3.4: opciones secundarias a ancho completo + responsive refinado */
.oai-cc-v2-options{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(120px,1fr)) !important;
  width:100% !important;
  gap:10px !important;
}
.oai-cc-option{
  width:100% !important;
  min-width:0 !important;
  min-height:68px;
  padding:11px 12px !important;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}

@media (max-width: 900px){
  .oai-cc-v2-top{grid-template-columns:1fr 1fr !important}
  .oai-cc-v2-cards{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .oai-cc-accessories .accessory-cards{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}
@media (max-width: 640px){
  .oai-cc-v2-top{grid-template-columns:1fr !important}
  .oai-cc-v2-cards{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .oai-cc-v2-card img{height:96px !important}
  .oai-cc-v2-card>span{font-size:12.5px !important}
  .oai-cc-v2-options{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .oai-cc-option{min-height:62px}
  .oai-cc-v2-summary-head{flex-direction:column;align-items:flex-start !important}
  .oai-cc-v2-summary-head .total{text-align:left !important}
}
@media (max-width: 380px){
  .oai-cc-v2-cards,.oai-cc-accessories .accessory-cards{grid-template-columns:1fr !important}
  .oai-cc-v2-options{grid-template-columns:1fr !important}
}

/* v3.5 — compact layout + consistent option grids */
.oai-cc-v2{
  --cc-text:#202938;
  --cc-muted:#667085;
  --cc-line:#d8e0e8;
  font-size:14px;
}
.oai-cc-v2>h3{
  font-size:clamp(25px,2.4vw,34px) !important;
  margin-bottom:18px !important;
}
.oai-cc-v2-top{
  gap:12px !important;
  padding:15px !important;
  border-radius:14px !important;
  margin-bottom:18px !important;
}
.oai-cc-v2-field label,
.oai-cc-v2-endpoint>h4,
.oai-cc-terminal-options h5,
.oai-cc-accessories h5{
  font-size:14px !important;
  margin-bottom:7px !important;
}
.oai-cc-v2-field select,
.oai-cc-v2-field input[type=number]{
  min-height:42px !important;
  padding:7px 10px !important;
  font-size:14px !important;
}
.oai-cc-v2-colors button{
  min-height:42px !important;
  padding:7px 11px !important;
  font-size:13px !important;
}
.oai-cc-v2-field small,
.oai-cc-hint{font-size:12px !important}

.oai-cc-v2-endpoint{
  padding:17px 0 !important;
}
.oai-cc-v2-endpoint>h4{
  font-size:18px !important;
  margin-bottom:11px !important;
}
.oai-cc-v2-cards{
  gap:10px !important;
  grid-template-columns:repeat(auto-fit,minmax(155px,1fr)) !important;
}
.oai-cc-v2-card{
  padding:9px !important;
  border-radius:12px !important;
}
.oai-cc-v2-card img{
  height:112px !important;
  margin-bottom:7px !important;
  border-radius:8px !important;
}
.oai-cc-v2-card>span{
  font-size:13px !important;
  line-height:1.24 !important;
  font-weight:650 !important;
}
.oai-cc-v2-card>small{
  margin-top:3px !important;
  font-size:11.5px !important;
}
.oai-cc-v2-card.selected:after,
.oai-cc-option.selected:after{
  width:23px !important;
  height:23px !important;
  right:-6px !important;
  top:-7px !important;
  font-size:14px !important;
}

/* Secondary choices: exactly 4 columns on desktop, spanning 100% of the row. */
.oai-cc-v2-options{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  width:100% !important;
  gap:9px !important;
}
.oai-cc-option{
  width:100% !important;
  min-width:0 !important;
  min-height:56px !important;
  padding:8px 10px !important;
  border-radius:9px !important;
}
.oai-cc-option .option-label{
  font-size:13px !important;
  line-height:1.15 !important;
}
.oai-cc-option small{
  margin-top:2px !important;
  font-size:11.5px !important;
}

.oai-cc-terminal-options,
.oai-cc-accessories{margin-top:14px !important}
.oai-cc-accessories .accessory-cards{
  max-width:none !important;
  width:100% !important;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr)) !important;
}

.oai-cc-v2-summary-panel{margin-top:18px !important;border-radius:14px !important}
.oai-cc-v2-summary-head{padding:13px 15px !important}
.oai-cc-v2-summary-head h4{font-size:18px !important}
.oai-cc-v2-summary-head .total strong{font-size:20px !important}
.oai-cc-v2-summary-table th,.oai-cc-v2-summary-table td{padding:9px 11px !important;font-size:12.5px !important}

/* Tablet: two columns for all selectable blocks. */
@media(max-width:760px){
  .oai-cc-v2-top{grid-template-columns:1fr 1fr !important}
  .oai-cc-v2-cards,
  .oai-cc-accessories .accessory-cards,
  .oai-cc-v2-options{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .oai-cc-v2-card img{height:98px !important}
}

/* Mobile: keep 2 columns where usable; top fields stack. */
@media(max-width:560px){
  .oai-cc-v2{font-size:13px}
  .oai-cc-v2-top{grid-template-columns:1fr !important;padding:12px !important}
  .oai-cc-v2>h3{font-size:25px !important}
  .oai-cc-v2-endpoint>h4{font-size:17px !important}
  .oai-cc-v2-cards,
  .oai-cc-accessories .accessory-cards,
  .oai-cc-v2-options{gap:8px !important}
  .oai-cc-v2-card{padding:7px !important}
  .oai-cc-v2-card img{height:90px !important}
  .oai-cc-v2-card>span{font-size:12px !important}
  .oai-cc-option{min-height:52px !important;padding:7px 8px !important}
}

/* Very narrow phones: one column only when two columns become genuinely cramped. */
@media(max-width:360px){
  .oai-cc-v2-cards,
  .oai-cc-accessories .accessory-cards,
  .oai-cc-v2-options{grid-template-columns:1fr !important}
}


/* v3.5.1 — preserve PNG/WebP transparency in selector images */
.oai-cc-v2-card img,
.oai-cc-v2-card:hover img,
.oai-cc-v2-card.selected img,
.oai-cc-v2-card.selected:hover img{
  background:transparent !important;
}
.oai-cc-v2-card:hover{
  background:#fff !important;
}
.oai-cc-accessory-group{margin-top:14px}.oai-cc-accessory-group:first-child{margin-top:0}.oai-cc-accessory-product-title{font-size:.86rem;font-weight:700;color:#64748b;margin:-2px 0 4px}.oai-cc-accessory-group h5{margin:0 0 4px;font-size:1rem}.oai-cc-accessory-group .oai-cc-hint{margin:0 0 10px}

/* v3.7: variación única compatible, aplicada automáticamente */
.oai-cc-auto-option{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  width:100%;
  box-sizing:border-box;
  padding:12px 16px;
  margin:6px 0 2px;
  border:1px solid #d9e2ec;
  border-radius:12px;
  background:#f8fafc;
  color:#1f2937;
  font-size:14px;
  line-height:1.35;
}
.oai-cc-auto-option span{font-weight:600;}
.oai-cc-auto-option strong{white-space:nowrap;font-size:14px;color:#475569;}
@media (max-width: 520px){
  .oai-cc-auto-option{align-items:flex-start;flex-direction:column;gap:4px;padding:10px 12px;}
}


/* v3.9.4 — terminales en flex: 4 por fila en escritorio */
.oai-cc-v2-endpoint > .oai-cc-v2-cards.terminal-cards{
  display:flex !important;
  flex-wrap:wrap !important;
  width:100% !important;
  gap:12px !important;
}
.oai-cc-v2-endpoint > .oai-cc-v2-cards.terminal-cards > .oai-cc-v2-card{
  flex:0 0 calc((100% - 36px) / 4) !important;
  width:calc((100% - 36px) / 4) !important;
  max-width:none !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}
@media(max-width:900px){
  .oai-cc-v2-endpoint > .oai-cc-v2-cards.terminal-cards > .oai-cc-v2-card{
    flex-basis:calc((100% - 12px) / 2) !important;
    width:calc((100% - 12px) / 2) !important;
  }
}
@media(max-width:520px){
  .oai-cc-v2-endpoint > .oai-cc-v2-cards.terminal-cards > .oai-cc-v2-card{
    flex-basis:100% !important;
    width:100% !important;
  }
}


/* v3.9.10 — aviso visible y límite de longitud */
#oai_cc_length_cm.oai-cc-input-error{
  border-color:#dc2626 !important;
  box-shadow:0 0 0 2px rgba(220,38,38,.10) !important;
}
.oai-cc-length-warning{
  display:none;
  margin-top:7px;
  color:#b91c1c;
  font-size:13px;
  font-weight:700;
  line-height:1.35;
}


/* v3.9.11 — mantener ancho de 1/4 para grupos con menos de 4 opciones */
@media(min-width:901px){
  .oai-cc-accessories .accessory-cards{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    width:100% !important;
    max-width:none !important;
  }
  .oai-cc-v2-options{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }
}
/* Igualar el comportamiento responsive al bloque de terminales. */
@media(max-width:900px){
  .oai-cc-accessories .accessory-cards,
  .oai-cc-v2-options{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media(max-width:520px){
  .oai-cc-accessories .accessory-cards{
    grid-template-columns:1fr !important;
  }
}