/* ═══════════════════════════════════════════════════════════════
   MEPSO ACCESO — estilos propios (sobre el Design System de Mepso Plus)
   ═══════════════════════════════════════════════════════════════ */

/* ── Zona de escaneo ───────────────────────────────────────── */
.ac-scan { padding: 26px 24px; text-align: center; }

.ac-scan-label {
    font-size: 13px; font-weight: 700; letter-spacing: .08em;
    text-transform: uppercase; color: var(--mp-text-muted); margin-bottom: 10px;
}

.ac-scan-input {
    width: 100%; max-width: 560px;
    font-size: 30px; font-weight: 700; letter-spacing: 4px; text-align: center;
    padding: 16px 20px; border: 2px solid var(--mp-primary); border-radius: 14px;
    outline: none; color: var(--mp-text); background: #fff;
}
.ac-scan-input:focus { box-shadow: 0 0 0 5px var(--mp-primary-light); }
.ac-scan-hint { font-size: 12.5px; color: #94a3b8; margin-top: 10px; }

/* ── Resultado de la verificación ──────────────────────────── */
.ac-result {
    display: flex; gap: 22px; align-items: flex-start;
    border: 2px solid; border-radius: 16px; padding: 24px 28px; margin-top: 18px;
}
.ac-ok  { background: #f0fdf4; border-color: #86efac; }
.ac-sin { background: #fef2f2; border-color: #fca5a5; }
.ac-wait{ background: #f8fafc; border-color: #e2e8f0; color: #64748b; }

.ac-icon { font-size: 60px; line-height: 1; flex-shrink: 0; }
.ac-ok  .ac-icon { color: #16a34a; }
.ac-sin .ac-icon { color: #dc2626; }

.ac-body { flex: 1; min-width: 0; }

.ac-title { font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.ac-ok  .ac-title { color: #15803d; }
.ac-sin .ac-title { color: #b91c1c; }

.ac-paciente { font-size: 26px; font-weight: 800; color: var(--mp-text); margin: 4px 0 2px; }
.ac-msg { font-size: 15px; color: #475569; margin-top: 4px; }

.ac-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 12px 26px; margin-top: 14px;
}
.ac-field-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: #94a3b8; }
.ac-field-value { font-size: 15px; font-weight: 600; color: var(--mp-text); }

/* ── Cronómetro y acciones ─────────────────────────────────── */
.ac-actions {
    display: flex; align-items: center; gap: 28px; flex-wrap: wrap;
    margin-top: 20px; padding-top: 18px; border-top: 1px dashed #bbf7d0;
}

.ac-chrono {
    font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
    font-variant-numeric: tabular-nums; font-weight: 800;
}
.ac-chrono-big { font-size: 58px; color: var(--mp-primary); line-height: 1; }
.ac-chrono-done { color: #15803d; }
.ac-chrono-sub { font-size: 12px; color: #64748b; margin-top: 4px; }

.ac-btn { font-size: 18px; padding: 14px 34px; border-radius: 12px; font-weight: 700; cursor: pointer; border: none; display: inline-flex; align-items: center; gap: 8px; }
.ac-btn-start { background: #16a34a; color: #fff; }
.ac-btn-start:hover { background: #15803d; }
.ac-btn-stop  { background: #dc2626; color: #fff; }
.ac-btn-stop:hover  { background: #b91c1c; }
.ac-btn[disabled] { opacity: .6; cursor: wait; }

.ac-btn-mini { font-size: 12.5px; padding: 6px 12px; border-radius: 8px; font-weight: 600; cursor: pointer; border: none; background: #dc2626; color: #fff; }
.ac-btn-mini:hover { background: #b91c1c; }

.ac-flag {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 12.5px; font-weight: 600; padding: 4px 10px; border-radius: 999px;
}
.ac-flag-ok   { background: #dcfce7; color: #15803d; }
.ac-flag-warn { background: #fef3c7; color: #92400e; }

.ac-td-chrono { font-family: ui-monospace, Consolas, monospace; font-weight: 700; color: var(--mp-primary); }

@media (max-width: 640px) {
    .ac-result { flex-direction: column; padding: 18px; }
    .ac-scan-input { font-size: 22px; letter-spacing: 2px; }
    .ac-chrono-big { font-size: 44px; }
}
