/* MiPlato - identidad visual propia. Compacta, legible y rápida en celulares. */
:root {
    --mp-primary: #c2410c;
    --mp-primary-dark: #9a3412;
    --mp-primary-soft: #fff1e8;
    --mp-ink: #1c1917;
    --mp-muted: #6b6560;
    --mp-bg: #f6f4f1;
    --mp-surface: #ffffff;
    --mp-line: #e7e2dc;
    --mp-ok: #15803d;
    --mp-warn: #b45309;

    --bs-primary: var(--mp-primary);
    --bs-primary-rgb: 194, 65, 12;
    --bs-link-color: var(--mp-primary-dark);
    --bs-link-color-rgb: 154, 52, 18;
    --bs-link-hover-color: var(--mp-primary);
    --bs-body-color: var(--mp-ink);
    --bs-body-bg: var(--mp-bg);
    --bs-border-color: var(--mp-line);
    --bs-body-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --bs-body-font-size: .9375rem;
    --bs-border-radius: .5rem;
}

body { background: var(--mp-bg); color: var(--mp-ink); }

.btn-primary {
    --bs-btn-bg: var(--mp-primary); --bs-btn-border-color: var(--mp-primary);
    --bs-btn-hover-bg: var(--mp-primary-dark); --bs-btn-hover-border-color: var(--mp-primary-dark);
    --bs-btn-active-bg: var(--mp-primary-dark); --bs-btn-active-border-color: var(--mp-primary-dark);
    --bs-btn-disabled-bg: var(--mp-primary); --bs-btn-disabled-border-color: var(--mp-primary);
}
.btn-outline-primary {
    --bs-btn-color: var(--mp-primary-dark); --bs-btn-border-color: var(--mp-primary);
    --bs-btn-hover-bg: var(--mp-primary); --bs-btn-hover-border-color: var(--mp-primary);
    --bs-btn-active-bg: var(--mp-primary-dark);
}
.text-primary { color: var(--mp-primary) !important; }
.bg-primary-soft { background: var(--mp-primary-soft) !important; }
.form-control:focus, .form-select:focus, .form-check-input:focus {
    border-color: #fb923c; box-shadow: 0 0 0 .2rem rgba(194, 65, 12, .15);
}
.form-check-input:checked { background-color: var(--mp-primary); border-color: var(--mp-primary); }

/* Componentes de Bootstrap con el color de la marca */
.nav-pills { --bs-nav-pills-link-active-bg: var(--mp-primary); --bs-nav-link-color: var(--mp-primary-dark); --bs-nav-link-hover-color: var(--mp-primary); }
.pagination { --bs-pagination-active-bg: var(--mp-primary); --bs-pagination-active-border-color: var(--mp-primary); --bs-pagination-color: var(--mp-primary-dark); --bs-pagination-hover-color: var(--mp-primary); --bs-pagination-focus-box-shadow: 0 0 0 .2rem rgba(194,65,12,.15); }
.btn-link { --bs-btn-color: var(--mp-primary-dark); --bs-btn-hover-color: var(--mp-primary); }

/* Barra superior */
.mp-topbar { background: var(--mp-ink); }
.mp-topbar .navbar-brand { font-weight: 800; letter-spacing: -.02em; color: #fff; }
.mp-topbar .navbar-brand .mp-dot { color: #fb923c; }
.mp-topbar .nav-link { color: rgba(255,255,255,.75); font-size: .9rem; }
.mp-topbar .nav-link:hover, .mp-topbar .nav-link.active { color: #fff; }
.mp-topbar .nav-link.active { box-shadow: inset 0 -2px 0 #fb923c; }

.mp-logo { font-weight: 800; letter-spacing: -.03em; }
.mp-logo .mp-dot { color: var(--mp-primary); }

/* Superficies */
.card { border-color: var(--mp-line); box-shadow: 0 1px 2px rgba(28,25,23,.04); }
.card-header { background: var(--mp-surface); font-weight: 600; }
.page-head { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.page-head h1 { font-size: 1.35rem; font-weight: 700; margin: 0; }
.kpi { padding: .9rem 1rem; }
.kpi .kpi-label { font-size: .78rem; color: var(--mp-muted); text-transform: uppercase; letter-spacing: .04em; }
.kpi .kpi-value { font-size: 1.6rem; font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; }

.table { --bs-table-bg: transparent; }
.table > :not(caption) > * > * { padding: .55rem .6rem; }
.table thead th { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--mp-muted); font-weight: 600; white-space: nowrap; }
.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }

.badge-status { font-weight: 600; }
.badge-active { background: #dcfce7; color: #166534; }
.badge-suspended { background: #fee2e2; color: #991b1b; }
.badge-inactive, .badge-disabled { background: #e7e5e4; color: #44403c; }

.form-label { font-weight: 600; font-size: .85rem; margin-bottom: .25rem; }
.form-text { font-size: .78rem; }
.secret-box { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; background: #fffbeb; border: 1px dashed #f59e0b; padding: .5rem .75rem; border-radius: .375rem; word-break: break-all; }

/* Horarios */
.hours-row { display: grid; grid-template-columns: 5.2rem 1fr 1fr; gap: .35rem .5rem; align-items: center; padding: .25rem 0; border-bottom: 1px dashed var(--mp-line); }
.hours-shift { display: flex; align-items: center; gap: .25rem; min-width: 0; }
.hours-shift input { min-width: 0; padding-left: .35rem; padding-right: .2rem; }
@media (max-width: 575.98px) {
    .hours-row { grid-template-columns: 1fr; gap: .25rem; }
}

/* Central de pedidos */
.ob-col { background: #efebe6; border-radius: .75rem; padding: .6rem; min-height: 120px; }
.ob-col-head { font-weight: 700; font-size: .85rem; text-transform: uppercase; letter-spacing: .03em; color: var(--mp-muted); margin: .1rem .2rem .5rem; display: flex; justify-content: space-between; align-items: center; }
.ob-empty { text-align: center; color: var(--mp-muted); font-size: .85rem; padding: 1rem 0; }
.ob-card { background: #fff; border: 1px solid var(--mp-line); border-radius: .6rem; padding: .6rem .7rem; margin-bottom: .5rem; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.ob-card.is-new { border-color: #16a34a; box-shadow: 0 0 0 2px rgba(22,163,74,.18); animation: obPulse 1.6s ease-in-out 3; }
.ob-card-link { color: inherit; text-decoration: none; display: block; }
.ob-num { font-weight: 800; font-size: 1.05rem; }
@keyframes obPulse { 50% { box-shadow: 0 0 0 6px rgba(22,163,74,.12); } }
@media (prefers-reduced-motion: reduce) { .ob-card.is-new { animation: none; } }
.ob-status { font-weight: 600; vertical-align: middle; font-size: .72rem; }
.ob-status-pending { background: #dcfce7; color: #166534; }
.ob-status-accepted, .ob-status-preparing { background: #ffedd5; color: #9a3412; }
.ob-status-ready, .ob-status-out_for_delivery { background: #dbeafe; color: #1e40af; }
.ob-status-completed { background: #e7e5e4; color: #44403c; }
.ob-status-rejected, .ob-status-cancelled { background: #fee2e2; color: #991b1b; }

/* Acceso */
.auth-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.auth-card { width: 100%; max-width: 380px; }

@media (max-width: 575.98px) {
    .page-head h1 { font-size: 1.15rem; }
    .kpi .kpi-value { font-size: 1.3rem; }
    .container-xl { padding-left: .75rem; padding-right: .75rem; }
}
