/* Rediseño visual del formulario "Nuevo servicio": breadcrumb, wizard de
   pasos, panel lateral de resumen/validaciones/notas, y selects HH:MM. */
.breadcrumb{font-size:12px;color:var(--ink3);margin-bottom:10px;display:flex;align-items:center;gap:6px}
.breadcrumb b{color:var(--ink);font-weight:600}

.wiz-layout{display:grid;grid-template-columns:1fr 300px;gap:16px;align-items:start}
@media(max-width:900px){.wiz-layout{grid-template-columns:1fr}}
/* Los 4 pasos del wizard tenían min-width:120px cada uno (480px solo para
   los indicadores) — en un celular angosto eso se salía de la pantalla. Se
   encogen los puntos y se esconde el subtítulo para que los 4 quepan en
   una fila sin scroll horizontal. */
@media(max-width:640px){
  .wiz-dotwrap{min-width:0;flex:1;gap:4px}
  .wiz-dotlbl span{display:none}
  .wiz-dotlbl b{font-size:9.5px;line-height:1.15}
  .wiz-dot{width:24px;height:24px;font-size:11px}
  .wiz-line{margin-top:11px}
}
.wiz-side{display:flex;flex-direction:column}

.wiz-steps{display:flex;align-items:flex-start;margin-bottom:20px}
.wiz-dotwrap{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:120px;text-align:center}
.wiz-dot{width:30px;height:30px;border-radius:50%;background:#e2e8f0;color:var(--ink3);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex-shrink:0;transition:.15s;cursor:pointer}
.wiz-dot:hover{filter:brightness(.96)}
.wiz-dot.active{background:var(--p);color:#fff}
.wiz-dot.done{background:var(--p3);color:var(--p)}
.wiz-dotlbl b{display:block;font-size:11.5px;font-weight:700;color:var(--ink)}
.wiz-dotlbl span{font-size:10px;color:var(--ink3)}
.wiz-line{flex:1;height:2px;background:#e2e8f0;margin-top:15px;transition:.15s}
.wiz-line.done{background:var(--p)}

.wiz-step{display:none}
.wiz-step.active{display:block}
.wiz-nav{display:flex;justify-content:space-between;gap:8px;padding-top:14px;margin-top:14px;border-top:1px solid var(--border)}


.rs-card-title{font-size:12px;font-weight:700;display:flex;align-items:center;gap:6px;margin-bottom:10px;color:var(--ink)}
.rs-card-title svg{width:15px;height:15px;stroke:var(--p);fill:none;stroke-width:2}
.rs-row{display:flex;justify-content:space-between;align-items:center;padding:5px 0;font-size:12px;gap:8px}
.rs-row .rl{color:var(--ink3)}
.rs-row .rv{font-weight:600;color:var(--ink);text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:170px}

.val-item{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:12px;color:var(--ink3)}
.val-item .val-dot{width:16px;height:16px;border-radius:50%;border:2px solid var(--border);flex-shrink:0;display:flex;align-items:center;justify-content:center;position:relative}
.val-item.val-ok{color:var(--ink)}
.val-item.val-ok .val-dot{background:var(--green);border-color:var(--green)}
.val-item.val-ok .val-dot::after{content:'✓';color:#fff;font-size:10px;font-weight:700;position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
