/* Cita online CEDIV v2 · móvil primero; en escritorio, pasos 1 y 2 en tres columnas */
:root {
  --co-ink: #15232c;
  --co-muted: #4e626d;
  --co-soft: #6b7e88;
  --co-bg: #f2f6f8;
  --co-surface: #ffffff;
  --co-line: #dce6eb;
  --co-line-strong: #c9d7de;
  --co-brand: #1aa3db;
  --co-brand-tint: #e4f4fb;
  --co-action: #0a6a94;
  --co-action-hover: #07506f;
  --co-focus: #7ccbec;
  --co-warn-bg: #fff6e8;
  --co-warn-line: #f1d9b0;
  --co-warn-ink: #5c3405;
  --co-error: #b42318;
  --co-ok-bg: #ddf3e6;
  --co-ok-ink: #146c43;
  --co-radius: 12px;
  --co-font: Figtree, "Segoe UI", system-ui, -apple-system, sans-serif;
  --co-display: Outfit, Figtree, "Segoe UI", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  font-family: var(--co-font);
  font-size: 16px;
  line-height: 1.45;
  color: var(--co-ink);
  background: var(--co-bg);
  -webkit-text-size-adjust: 100%;
}
a { color: var(--co-action); font-weight: 600; }
a:hover { color: var(--co-action-hover); }
button { font: inherit; color: inherit; cursor: pointer; }
button:disabled { cursor: not-allowed; }
:focus-visible { outline: 3px solid var(--co-focus); outline-offset: 2px; }
[hidden] { display: none !important; }
h1, h2, h3, p { margin: 0; }
.co-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Cabecera */
.co-top { background: var(--co-surface); border-bottom: 1px solid var(--co-line); }
.co-top-inner {
  max-width: 640px; margin: 0 auto; padding: 14px 20px 12px;
  display: flex; flex-direction: column; gap: 12px;
}
.co-top-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 36px; }
.co-logo { height: 34px; width: auto; display: block; }
.co-top-title { font-size: 13px; font-weight: 600; color: var(--co-muted); }
.co-back {
  display: inline-flex; align-items: center; gap: 4px; padding: 6px 8px 6px 0;
  background: none; border: 0; color: var(--co-action); font-size: 14px; font-weight: 600; text-decoration: none;
}
.co-lang { display: flex; gap: 2px; padding: 3px; margin-left: auto; background: #e3ebef; border-radius: 9px; }
.co-lang button {
  min-width: 38px; height: 30px; padding: 0 8px; border: 0; border-radius: 7px; background: transparent;
  color: var(--co-muted); font-size: 13px; font-weight: 700; letter-spacing: 0.03em;
}
.co-lang button[aria-pressed="true"] { background: var(--co-surface); color: var(--co-ink); box-shadow: 0 1px 3px rgba(21, 35, 44, 0.14); }
.co-top-row .co-logo + .co-lang { margin-left: auto; }
.co-steps b { font-weight: inherit; }
.co-progress { display: flex; flex-direction: column; gap: 6px; }
.co-progress-bar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; }
.co-progress-bar span { height: 4px; border-radius: 2px; background: var(--co-line); }
.co-progress-bar span.on { background: var(--co-brand); }
.co-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--co-muted); }

/* Estructura */
.co-main { max-width: 640px; margin: 0 auto; padding: 22px 20px 32px; display: flex; flex-direction: column; gap: 22px; }
.co-stack { display: flex; flex-direction: column; gap: 6px; }
.co-h1 { font-family: var(--co-display); font-size: 27px; line-height: 1.15; font-weight: 600; text-wrap: balance; }
.co-h2 { font-family: var(--co-display); font-size: 20px; font-weight: 600; }
.co-lead { font-size: 15px; color: var(--co-muted); }
.co-label-caps { font-size: 13px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--co-muted); }
.co-section { display: flex; flex-direction: column; gap: 10px; }
.co-card { background: var(--co-surface); border: 1px solid var(--co-line); border-radius: 14px; }
.co-card-pad { padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.co-small { font-size: 13px; color: var(--co-muted); }

/* Controles */
.co-search {
  display: flex; align-items: center; gap: 10px; height: 50px; padding: 0 14px;
  background: var(--co-surface); border: 1px solid var(--co-line-strong); border-radius: var(--co-radius);
}
.co-search input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; font: inherit; font-size: 16px; }
.co-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.co-tile {
  min-height: 60px; padding: 12px 14px; text-align: left; font-size: 15px; font-weight: 600; line-height: 1.25;
  background: var(--co-surface); border: 0; border-radius: var(--co-radius); box-shadow: inset 0 0 0 1px #d2dfe6;
}
.co-tile[aria-pressed="true"] { background: var(--co-brand-tint); box-shadow: inset 0 0 0 2px var(--co-brand); }
.co-list { max-height: min(60vh, 520px); overflow-y: auto; display: flex; flex-direction: column; background: var(--co-surface); border: 1px solid var(--co-line); border-radius: 14px; }
.co-option {
  display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 10px 16px; text-align: left;
  font-size: 15px; font-weight: 500; background: var(--co-surface); border: 0; border-top: 1px solid #e6edf1;
}
.co-option:first-child { border-top: 0; }
.co-option::before {
  content: ""; flex: 0 0 18px; height: 18px; border-radius: 50%; border: 2px solid #9ab0bb; background: var(--co-surface);
}
.co-option[aria-pressed="true"] { background: var(--co-brand-tint); font-weight: 600; }
.co-option[aria-pressed="true"]::before { border: 6px solid var(--co-action); }
.co-option small { display: block; font-size: 12px; font-weight: 600; color: var(--co-muted); }
.co-empty { padding: 16px; text-align: center; font-size: 14px; color: var(--co-muted); }

.co-seg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; padding: 4px; background: #e3ebef; border-radius: var(--co-radius); }
.co-seg button { height: 42px; border: 0; border-radius: 9px; background: transparent; color: var(--co-muted); font-size: 15px; font-weight: 600; }
.co-seg button[aria-pressed="true"] { background: var(--co-surface); color: var(--co-ink); box-shadow: 0 1px 3px rgba(21, 35, 44, 0.14); }
.co-seg[data-invalid="true"] { box-shadow: inset 0 0 0 2px var(--co-error); }
.co-seg-mini { display: flex; gap: 4px; padding: 3px; background: #e3ebef; border-radius: 10px; flex-shrink: 0; }
.co-seg-mini button { min-width: 46px; height: 36px; border: 0; border-radius: 8px; background: transparent; color: var(--co-muted); font-size: 14px; font-weight: 600; }
.co-seg-mini button[aria-pressed="true"] { background: var(--co-surface); color: var(--co-ink); box-shadow: 0 1px 3px rgba(21, 35, 44, 0.14); }
.co-question { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 15px; }

.co-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.co-field > label, .co-legend { font-size: 14px; font-weight: 600; }
.co-input, .co-select {
  width: 100%; height: 50px; padding: 0 14px; font: inherit; font-size: 16px; color: var(--co-ink);
  background: var(--co-surface); border: 1px solid var(--co-line-strong); border-radius: var(--co-radius);
}
.co-input[aria-invalid="true"] { border: 2px solid var(--co-error); }
.co-error { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--co-error); }
.co-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.co-phone { display: flex; height: 50px; border: 1px solid var(--co-line-strong); border-radius: var(--co-radius); background: var(--co-surface); overflow: hidden; }
.co-phone[data-invalid="true"] { border: 2px solid var(--co-error); }
.co-phone span { display: flex; align-items: center; padding: 0 12px; font-weight: 600; color: var(--co-muted); background: var(--co-bg); border-right: 1px solid var(--co-line); }
.co-phone input { flex: 1; min-width: 0; border: 0; outline: none; padding: 0 14px; font: inherit; font-size: 16px; background: transparent; font-variant-numeric: tabular-nums; }
.co-check { display: flex; align-items: flex-start; gap: 12px; padding: 14px; font-size: 14px; background: var(--co-surface); border: 1px solid var(--co-line); border-radius: var(--co-radius); }
.co-check input { width: 22px; height: 22px; margin: 0; flex-shrink: 0; accent-color: var(--co-action); }
fieldset.co-field { margin: 0; padding: 0; border: 0; }

.co-btn {
  display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 52px; padding: 0 18px;
  border: 0; border-radius: var(--co-radius); background: var(--co-action); color: #fff; font-size: 16px; font-weight: 700; text-decoration: none;
}
.co-btn:hover { background: var(--co-action-hover); color: #fff; }
.co-btn:disabled { background: var(--co-line-strong); color: var(--co-muted); }
.co-btn-ghost {
  display: flex; align-items: center; justify-content: center; gap: 8px; height: 50px; padding: 0 14px;
  border: 1px solid var(--co-line-strong); border-radius: var(--co-radius); background: var(--co-surface); color: var(--co-ink);
  font-size: 15px; font-weight: 600; text-decoration: none;
}
.co-btn-ghost:hover { color: var(--co-ink); border-color: #9ab0bb; }
.co-btn-small { height: 40px; padding: 0 14px; border: 1px solid var(--co-line-strong); border-radius: 10px; background: var(--co-surface); font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; }
.co-btn-small:disabled { background: var(--co-bg); color: var(--co-soft); border-color: var(--co-line); }
.co-link { padding: 0; border: 0; background: none; color: var(--co-action); font-size: 14px; font-weight: 600; }
.co-icon-btn {
  width: 38px; height: 38px; display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--co-line-strong); border-radius: 10px; background: var(--co-surface); color: var(--co-ink);
}
.co-icon-btn:disabled { color: #a8b8c0; border-color: var(--co-line); }

/* Avisos */
.co-note { display: flex; gap: 10px; padding: 14px; border-radius: var(--co-radius); font-size: 14px; }
.co-note svg { flex-shrink: 0; }
.co-note-warn { background: var(--co-warn-bg); border: 1px solid var(--co-warn-line); color: var(--co-warn-ink); }
.co-note-info { background: var(--co-brand-tint); border: 1px solid #bfe3f3; color: #07506f; }
.co-note-error { background: #fdecea; border: 1px solid #f5c2bd; color: var(--co-error); font-weight: 600; }

/* Paso 2: días y horas */
.co-chip-sum { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; }
.co-days { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.co-day {
  display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 8px 0 7px; border: 0; border-radius: var(--co-radius);
  background: var(--co-surface); box-shadow: inset 0 0 0 1px #d2dfe6;
}
.co-day b { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.03em; }
.co-day strong { font-family: var(--co-display); font-size: 22px; font-weight: 600; font-variant-numeric: tabular-nums; }
.co-day em { font-style: normal; font-size: 11px; font-weight: 600; color: var(--co-action); }
.co-day[aria-pressed="true"] { background: var(--co-action); color: #fff; box-shadow: none; }
.co-day[aria-pressed="true"] em { color: #cdebf8; }
.co-day:disabled { background: #e9eff2; color: #8fa2ac; box-shadow: none; }
.co-day:disabled em { color: #8fa2ac; }
.co-slots { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.co-slot {
  height: 44px; border: 0; border-radius: 10px; font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums;
  background: var(--co-surface); box-shadow: inset 0 0 0 1px #d2dfe6;
}
.co-slot[aria-pressed="true"] { background: var(--co-brand-tint); color: #07506f; box-shadow: inset 0 0 0 2px var(--co-brand); }
.co-week { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.co-week-nav { display: flex; gap: 6px; }
.co-cols { display: none; }
.co-loading { display: flex; align-items: center; gap: 10px; padding: 18px 0; font-size: 14px; color: var(--co-muted); }
.co-spinner { width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--co-line); border-top-color: var(--co-action); animation: co-spin 0.8s linear infinite; }
@keyframes co-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .co-spinner { animation-duration: 2.4s; } }

/* Selección / pie fijo en móvil */
.co-summary {
  position: sticky; bottom: 0; z-index: 5; padding: 14px 20px calc(18px + env(safe-area-inset-bottom, 0px));
  background: var(--co-surface); border-top: 1px solid var(--co-line); box-shadow: 0 -6px 18px rgba(21, 35, 44, 0.06);
  display: flex; flex-direction: column; gap: 12px;
}
.co-summary-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.co-summary-list { display: flex; flex-direction: column; gap: 8px; }
.co-summary-item { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; }
.co-summary-item b { display: block; font-size: 15px; }
.co-summary-item span { color: var(--co-muted); font-variant-numeric: tabular-nums; }
.co-summary .co-summary-title { display: none; }
.co-summary > * { width: 100%; max-width: 600px; margin-inline: auto; }
legend.co-legend { padding: 0; }
.co-footer-bar {
  position: sticky; bottom: 0; z-index: 5; padding: 14px 20px calc(18px + env(safe-area-inset-bottom, 0px));
  background: var(--co-surface); border-top: 1px solid var(--co-line); box-shadow: 0 -6px 18px rgba(21, 35, 44, 0.06);
}
.co-footer-bar > * { max-width: 600px; margin: 0 auto; }

/* Móvil: un paso cada vez */
.co-buscar[data-step="prueba"] #panelHora,
.co-buscar[data-step="prueba"] #panelSeleccion { display: none; }
.co-buscar[data-step="hora"] #panelPrueba { display: none; }
.co-desktop-only { display: none; }
.co-elegida { display: none; }

/* Petición médica adjunta */
.co-attach { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border-top: 1px solid #e6edf1; }
.co-attach:first-child { border-top: 0; }
.co-attach-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 14px; }
.co-attach-info b { font-size: 15px; }
.co-attach-info span { color: var(--co-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.co-attach-info .co-error { white-space: normal; }
.co-attach-btn { position: relative; display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; cursor: pointer; }
.co-attach-btn input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.co-attach-btn:focus-within { outline: 3px solid var(--co-focus); outline-offset: 2px; }

/* Código SMS */
.co-otp { position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.co-otp span {
  display: flex; align-items: center; justify-content: center; height: 58px; border-radius: var(--co-radius);
  background: var(--co-surface); box-shadow: inset 0 0 0 1px #d2dfe6;
  font-family: var(--co-display); font-size: 26px; font-weight: 600; font-variant-numeric: tabular-nums;
}
.co-otp span.filled { box-shadow: inset 0 0 0 1px #9ab0bb; }
.co-otp input:focus ~ span.active { box-shadow: inset 0 0 0 2px var(--co-brand); }
.co-otp input {
  position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; border: 0; font-size: 16px;
  color: transparent; caret-color: transparent; background: transparent;
}
.co-otp[data-error="true"] span { box-shadow: inset 0 0 0 2px var(--co-error); }
.co-resend { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px; }

/* Gestión de citas */
.co-pill { display: inline-flex; align-self: flex-start; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; background: rgba(255, 255, 255, 0.18); color: #fff; }
.co-ticket[data-estado="anulada"] .co-ticket-head { background: #6b7e88; }
.co-ticket[data-estado="cerrada"] .co-ticket-head { background: #4e626d; }
.co-ticket-pie { display: flex; flex-direction: column; gap: 10px; padding: 0 18px 18px; }
.co-confirmar { display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: var(--co-radius); background: #fdecea; border: 1px solid #f5c2bd; color: #7a1a12; font-size: 14px; }
.co-confirmar-botones { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.co-btn-peligro { height: 46px; border: 0; border-radius: var(--co-radius); background: var(--co-error); color: #fff; font-size: 15px; font-weight: 700; }
.co-btn-peligro:disabled { opacity: 0.6; }

/* Confirmación */
.co-done { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.co-done-icon { display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 50%; background: var(--co-ok-bg); color: var(--co-ok-ink); }
.co-ticket { overflow: hidden; }
.co-ticket-head { display: flex; flex-direction: column; gap: 4px; padding: 18px; background: var(--co-action); color: #fff; }
.co-ticket-head small { font-size: 13px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: #cdebf8; }
.co-ticket-head strong { font-family: var(--co-display); font-size: 44px; line-height: 1; font-weight: 600; font-variant-numeric: tabular-nums; }
.co-ticket-head span { font-size: 14px; color: #cdebf8; }
.co-dl { margin: 0; padding: 4px 18px; }
.co-dl div { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid #e6edf1; }
.co-dl div:last-child { border-bottom: 0; }
.co-dl dt { font-size: 14px; color: var(--co-muted); }
.co-dl dd { margin: 0; font-size: 15px; font-weight: 600; text-align: right; }
.co-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }

/* Escritorio */
@media (min-width: 900px) {
  .co-top-inner { max-width: 1280px; flex-direction: row; align-items: center; justify-content: space-between; padding: 0 48px; height: 72px; }
  .co-top-row { gap: 20px; }
  .co-logo { height: 38px; }
  .co-progress { display: none; }
  .co-top .co-steps { display: flex; gap: 28px; margin: 0; padding: 0; list-style: none; font-size: 14px; font-weight: 600; color: var(--co-soft); }
  .co-steps li { display: flex; align-items: center; gap: 8px; }
  .co-steps li span { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: #e3ebef; font-size: 13px; }
  .co-steps li.on { color: var(--co-ink); }
  .co-steps li.on span { background: var(--co-action); color: #fff; }
  .co-desktop-only { display: initial; }
  .co-mobile-only { display: none !important; }

  /* Prueba arriba a todo el ancho; debajo, horas y selección */
  .co-buscar {
    max-width: 1280px; margin: 0 auto; padding: 28px 48px; display: grid; gap: 24px; align-items: start;
    grid-template-columns: minmax(0, 1fr) 300px;
    grid-template-areas: "prueba prueba" "hora seleccion";
  }
  .co-buscar[data-step] #panelHora,
  .co-buscar[data-step] #panelSeleccion { display: flex; }
  .co-buscar > .co-main { max-width: none; margin: 0; padding: 22px 24px; background: var(--co-surface); border: 1px solid var(--co-line); border-radius: 16px; }
  #panelHora { grid-area: hora; }
  #panelSeleccion { grid-area: seleccion; }

  .co-buscar[data-step] #panelPrueba {
    grid-area: prueba; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px 28px; align-items: start;
  }
  #panelPrueba > * { grid-column: 1 / -1; }
  #panelPrueba > .co-p-titulo { grid-column: 1; }
  #panelPrueba > .co-p-buscar { grid-column: 2; align-self: center; }
  #panelPrueba > #bloquePago { grid-column: 1; }
  #panelPrueba > #bloquePreguntas { grid-column: 2; }
  #panelPrueba .co-h1 { font-size: 24px; }
  #panelPrueba #bloqueSeleccion { gap: 14px !important; }

  /* Tipos de prueba en una fila de pestañas */
  #panelPrueba .co-tiles { display: flex; flex-wrap: wrap; gap: 8px; }
  #panelPrueba .co-tile { min-height: 40px; padding: 8px 16px; border-radius: 999px; font-size: 14px; }

  /* Exploraciones a lo ancho, en columnas y sin caja con desplazamiento */
  #panelPrueba .co-list {
    display: block; max-height: none; overflow: visible; border: 0; border-radius: 0; background: transparent;
    columns: 4 230px; column-gap: 12px;
  }
  #panelPrueba .co-option {
    width: 100%; min-height: 34px; padding: 6px 10px; gap: 10px; border: 0; border-radius: 8px;
    font-size: 14px; background: transparent; break-inside: avoid;
  }
  #panelPrueba .co-option:hover { background: var(--co-bg); }
  #panelPrueba .co-option::before { flex-basis: 14px; height: 14px; }
  #panelPrueba .co-option[aria-pressed="true"] { background: var(--co-brand-tint); }
  #panelPrueba .co-option[aria-pressed="true"]::before { border-width: 4px; }

  /* Con la prueba elegida el bloque se pliega a una línea */
  #panelPrueba[data-plegado="true"] > .co-plegable { display: none; }
  #panelPrueba[data-plegado="true"] > .co-elegida {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
  }
  .co-elegida b { font-family: var(--co-display); font-size: 20px; font-weight: 600; }
  .co-elegida span { font-size: 14px; color: var(--co-muted); }
  #panelHora .co-days, #panelHora .co-franjas { display: none; }
  #panelHora .co-cols { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
  .co-col { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
  .co-col-head { display: flex; flex-direction: column; align-items: center; padding: 8px 0 10px; border-bottom: 1px solid #e6edf1; }
  .co-col-head b { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: var(--co-muted); }
  .co-col-head strong { font-family: var(--co-display); font-size: 20px; font-weight: 600; }
  .co-col .co-slot { height: 40px; font-size: 14px; background: var(--co-bg); box-shadow: inset 0 0 0 1px var(--co-line); }
  .co-col .co-slot[aria-pressed="true"] { background: var(--co-action); color: #fff; box-shadow: none; }
  .co-col .co-empty { padding: 12px 4px; font-size: 13px; }
  .co-summary {
    position: sticky; top: 24px; bottom: auto; padding: 22px; border: 1px solid var(--co-line); border-radius: 16px; box-shadow: none; gap: 16px;
  }
  .co-summary .co-summary-title { display: block; }
  .co-summary-list { gap: 10px; }
  .co-summary-item { flex-direction: column; gap: 2px; padding: 12px 14px; background: var(--co-brand-tint); border-radius: var(--co-radius); }
  .co-summary-row { flex-direction: column; align-items: stretch; }
  .co-main { padding-top: 36px; }
  .co-footer-bar { position: static; background: transparent; border: 0; box-shadow: none; padding-top: 0; }
}