/* Portal de repartidores — layout. Componentes comunes en shared/pidomi-brand.css */

.rider-main {
  max-width: 480px;
  margin: 0 auto;
  padding: 18px 16px calc(40px + env(safe-area-inset-bottom));
}
.rider-head { text-align: center; margin-bottom: 18px; }
.rider-head h1 { margin: 0 0 6px; font-size: 22px; }
.rider-head p { margin: 0; color: var(--pidomi-muted); font-size: 14px; }

/* ---- pasos ---- */
.steps { display: flex; gap: 8px; margin-bottom: 18px; }
.step-dot { flex: 1; height: 5px; border-radius: 999px; background: var(--pidomi-line); }
.step-dot.active { background: var(--pidomi-orange); }
.step-dot.done { background: var(--pidomi-dark); }

.step-pane { animation: fade .2s ease; }
@keyframes fade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.row2 { display: flex; gap: 12px; }
.row2 > * { flex: 1; }

.nav-btns { display: flex; gap: 12px; margin-top: 8px; }
.nav-btns .btn-primary, .nav-btns .btn-ghost { width: auto; flex: 1; }

/* ---- carga de archivos (foto de documento) ---- */
.uploader { margin-bottom: 14px; }
.uploader > span { display: block; font-size: 13px; color: var(--pidomi-muted); margin-bottom: 6px; }
.uploader input[type=file] { display: none; }
.drop {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  border: 1.5px dashed var(--pidomi-line); border-radius: 12px;
  padding: 22px 14px; color: var(--pidomi-muted); font-size: 14px; font-weight: 600;
  cursor: pointer; background: #fff; text-align: center;
}
.drop.has-file { border-style: solid; border-color: var(--ok); color: var(--ok); background: rgba(31,157,107,.06); }
.drop .drop-ico { font-size: 22px; }
.drop .thumb { width: 42px; height: 42px; border-radius: 8px; object-fit: cover; }

/* aviso: el repartidor entra vía un comercio */
.rider-via-merchant { max-width: 520px; margin: 0 auto 18px; text-align: center; }
.via-merchant-link { display: inline-block; font-weight: 800; color: var(--pidomi-orange); text-decoration: none; }