/* ============================================================================
   OmniPos site.css — Sprint 8 / Entrega A.2
   REGLA: No se tocan variables --bs-* de Bootstrap. Solo clases concretas.
   ============================================================================ */
:root {
  --omni-coral:     #ED6A5A;
  --omni-coral-d:   #C85A4A;
  --omni-blue:      #0EA5E9;
  --omni-blue-d:    #0284C7;
  --omni-emerald:   #10B981;
  --omni-emerald-d: #059669;
  --omni-red:       #EF4444;
  --omni-red-d:     #DC2626;
  --omni-amber:     #F59E0B;
  --omni-slate:     #1E293B;
  --omni-slate-d:   #0F172A;
  --omni-page-bg:   #F1F5F9;
  --omni-card-bg:   #FFFFFF;
  --omni-card-b:    #E2E8F0;
  --omni-card-r:    10px;
  --omni-input-r:   6px;
  --omni-input-b:   #CBD5E1;
  --omni-input-f:   #0EA5E9;
  --sb-bg:          #0F172A;
  --sb-w:           256px;
  --sb-col:         66px;
  --sb-bar:         56px;
  --sb-text:        #94A3B8;
  --sb-text-h:      #E2E8F0;
  --sb-hover:       rgba(255,255,255,.06);
  --sb-act-bg:      rgba(237,106,90,.13);
  --sb-act:         #ED6A5A;
  --sb-sect:        #475569;
}

*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body{font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-size:14px;background:var(--omni-page-bg);color:#334155;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6{font-family:'Outfit','Plus Jakarta Sans',sans-serif;font-weight:600;color:#0F172A}

.omni-wrapper{display:flex;min-height:100vh}

/* ── SIDEBAR ──────────────────────────────────────────────────────────────── */
.omni-sidebar{width:var(--sb-w);background:var(--sb-bg);display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;z-index:1030;transition:width .25s ease,transform .25s ease;overflow:hidden}
.omni-sidebar.collapsed{width:var(--sb-col)}
.sidebar-brand{display:flex;align-items:center;gap:10px;padding:0 15px;height:var(--sb-bar);background:linear-gradient(135deg,var(--omni-coral) 0%,var(--omni-coral-d) 100%);flex-shrink:0;text-decoration:none;box-shadow:0 2px 8px rgba(237,106,90,.4)}
.sidebar-brand-icon{width:32px;height:32px;flex-shrink:0;border-radius:7px;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;font-size:16px;color:#fff}
.sidebar-brand-text{font-family:'Outfit',sans-serif;font-weight:700;font-size:14px;color:#fff;white-space:nowrap;overflow:hidden;line-height:1.2}
.sidebar-brand-sub{font-size:10px;font-weight:400;opacity:.7;display:block}
.sidebar-nav{flex:1;overflow-y:auto;overflow-x:hidden;padding:4px 0 10px;scrollbar-width:thin;scrollbar-color:#475569 transparent}
.sidebar-nav::-webkit-scrollbar{width:6px}
.sidebar-nav::-webkit-scrollbar-thumb{background:#475569;border-radius:6px}.sidebar-nav::-webkit-scrollbar-track{background:rgba(255,255,255,.04)}.sidebar-nav::-webkit-scrollbar-thumb:hover{background:#64748B}
.sb-section{padding:14px 15px 4px;font-size:10px;font-weight:700;letter-spacing:.9px;text-transform:uppercase;color:var(--sb-sect);white-space:nowrap;overflow:hidden}
.sb-divider{height:1px;background:rgba(255,255,255,.07);margin:5px 13px}

/* Link base: funciona para <a> y <button> */
.sidebar-link{display:flex;align-items:center;gap:10px;padding:7px 12px 7px 13px;margin:1px 6px;border-radius:7px;color:var(--sb-text);text-decoration:none;font-size:13px;font-weight:500;transition:background .14s,color .14s;white-space:nowrap;background:transparent;border:none;width:calc(100% - 14px);text-align:left;cursor:pointer}
.sidebar-link i{font-size:15px;min-width:17px;flex-shrink:0}
.sidebar-link .lk-text{flex:1;overflow:hidden}
.sidebar-link .sb-arrow{font-size:11px;margin-left:auto;flex-shrink:0}
.sidebar-link:hover{background:var(--sb-hover);color:var(--sb-text-h)}
.sidebar-link.active{background:var(--sb-act-bg);color:var(--sb-act)!important;font-weight:600;border-left:3px solid var(--sb-act);padding-left:12px}

/* Grupos colapsables — max-height CSS, SIN Bootstrap Collapse */
.sb-group-items{max-height:0;overflow:hidden;transition:max-height .28s ease-out}
.sb-group.open>.sb-group-items{max-height:800px}

.sb-group-items .sidebar-link{padding-left:32px;font-size:12.5px;color:#64748B}
.sb-group-items .sidebar-link:hover{color:var(--sb-text-h)}
.sb-group-items .sidebar-link.active{color:var(--sb-act)!important;background:var(--sb-act-bg);border-left:3px solid var(--sb-act);padding-left:29px}
.sb-sub-label{padding:8px 12px 2px 32px;font-size:10px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:#334155}

/* Colapsado */
.omni-sidebar.collapsed .lk-text,
.omni-sidebar.collapsed .sidebar-brand-text,
.omni-sidebar.collapsed .sb-section,
.omni-sidebar.collapsed .sb-group-items,
.omni-sidebar.collapsed .sb-arrow,
.omni-sidebar.collapsed .sb-sub-label,
.omni-sidebar.collapsed .sb-divider,
.omni-sidebar.collapsed .sb-user-info,
.omni-sidebar.collapsed .sb-logout{display:none}
.omni-sidebar.collapsed .sidebar-link{justify-content:center;padding:9px 8px;margin:1px 6px}
.omni-sidebar.collapsed .sidebar-link.active{border-left:3px solid var(--sb-act);padding-left:5px}
.omni-sidebar.collapsed .sidebar-brand{justify-content:center;padding:0 8px}
.omni-sidebar.collapsed .sb-footer{padding:10px 6px}
.omni-sidebar.collapsed .sb-user{justify-content:center}
.omni-sidebar.collapsed .sidebar-link{position:relative}
.omni-sidebar.collapsed .sidebar-link::after{content:attr(data-label);position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%);background:#1E293B;color:#E2E8F0;padding:5px 12px;border-radius:6px;font-size:12px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .13s;z-index:9999;box-shadow:0 4px 12px rgba(0,0,0,.35)}
.omni-sidebar.collapsed .sidebar-link:hover::after{opacity:1}

/* Footer */
.sb-footer{border-top:1px solid rgba(255,255,255,.07);padding:9px;flex-shrink:0}
.sb-user{display:flex;align-items:center;gap:9px;padding:7px;border-radius:7px;text-decoration:none;transition:background .15s}
.sb-user:hover{background:var(--sb-hover)}
.sb-avatar{width:30px;height:30px;border-radius:50%;flex-shrink:0;background:linear-gradient(135deg,#36C9C6,#9BC1BC);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff}
.sb-user-info{overflow:hidden}
.sb-user-name{font-size:12px;font-weight:600;color:#E2E8F0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-user-role{font-size:10.5px;color:var(--sb-sect)}
.sb-logout{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:5px;margin-left:auto;flex-shrink:0;background:none;border:none;color:var(--sb-sect);cursor:pointer;transition:all .15s}
.sb-logout:hover{background:rgba(239,68,68,.15);color:#EF4444}

/* ── MAIN ─────────────────────────────────────────────────────────────────── */
.omni-main{margin-left:var(--sb-w);flex:1;min-height:100vh;display:flex;flex-direction:column;transition:margin-left .25s ease}
.omni-main.expanded{margin-left:var(--sb-col)}
.omni-topbar{height:var(--sb-bar);background:#fff;border-bottom:1px solid var(--omni-card-b);display:flex;align-items:center;padding:0 22px;gap:12px;position:sticky;top:0;z-index:1020;box-shadow:0 1px 4px rgba(15,23,42,.06);flex-shrink:0}
.topbar-toggle{background:none;border:none;padding:6px 7px;border-radius:6px;cursor:pointer;color:#64748B;font-size:20px;line-height:1;display:flex;align-items:center;transition:all .15s}
.topbar-toggle:hover{background:#F1F5F9;color:#0F172A}
.topbar-title{font-family:'Outfit',sans-serif;font-size:15px;font-weight:600;color:#0F172A;flex:1}
.topbar-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:20px;background:#F8FAFC;border:1px solid var(--omni-card-b);font-size:12px;font-weight:600;color:#475569}
.omni-content{flex:1}
.page-content{padding:22px}
.omni-overlay{display:none;position:fixed;inset:0;background:rgba(15,23,42,.55);z-index:1029;backdrop-filter:blur(2px)}
.omni-overlay.show{display:block}

/* ── BOTONES ──────────────────────────────────────────────────────────────── */
.btn{font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:12.5px;padding:6px 14px;border-radius:6px;border:1.5px solid transparent;cursor:pointer;display:inline-flex;align-items:center;gap:7px;transition:all .17s ease;white-space:nowrap;line-height:1.4}
.btn:focus-visible{outline:3px solid rgba(14,165,233,.4);outline-offset:2px}
.btn-primary{background:var(--omni-blue);border-color:var(--omni-blue);color:#fff!important}
.btn-primary:hover{background:var(--omni-blue-d);border-color:var(--omni-blue-d);color:#fff;box-shadow:0 4px 14px rgba(14,165,233,.35);transform:translateY(-1px)}
.btn-success{background:var(--omni-emerald);border-color:var(--omni-emerald);color:#fff!important}
.btn-success:hover{background:var(--omni-emerald-d);border-color:var(--omni-emerald-d);color:#fff;box-shadow:0 4px 14px rgba(16,185,129,.35);transform:translateY(-1px)}
.btn-danger{background:var(--omni-red);border-color:var(--omni-red);color:#fff!important}
.btn-danger:hover{background:var(--omni-red-d);border-color:var(--omni-red-d);color:#fff;box-shadow:0 4px 14px rgba(239,68,68,.3);transform:translateY(-1px)}
.btn-dark{background:var(--omni-slate);border-color:var(--omni-slate);color:#fff!important}
.btn-dark:hover{background:var(--omni-slate-d);border-color:var(--omni-slate-d);color:#fff;transform:translateY(-1px)}
.btn-warning{background:var(--omni-amber);border-color:var(--omni-amber);color:#fff!important}
.btn-warning:hover{background:#D97706;color:#fff}
.btn-secondary{background:#F1F5F9;border-color:#CBD5E1;color:#475569!important}
.btn-secondary:hover{background:#E2E8F0;border-color:#94A3B8;color:#1E293B}
.btn-outline-primary{background:transparent;border-color:var(--omni-blue);color:var(--omni-blue)!important}
.btn-outline-primary:hover{background:var(--omni-blue);color:#fff!important}
.btn-outline-danger{background:transparent;border-color:var(--omni-red);color:var(--omni-red)!important}
.btn-outline-danger:hover{background:var(--omni-red);color:#fff!important}
.btn-outline-secondary{background:transparent;border-color:#CBD5E1;color:#475569!important}
.btn-outline-secondary:hover{background:#F1F5F9}
.btn-outline-dark{background:transparent;border-color:#CBD5E1;color:var(--omni-slate)!important}
.btn-outline-dark:hover{background:var(--omni-slate);color:#fff!important;border-color:var(--omni-slate)}
.btn-sm{font-size:12px;padding:6px 14px;border-radius:6px}
.btn-lg{font-size:15px;padding:12px 26px;border-radius:8px}

/* ── FORMULARIOS ──────────────────────────────────────────────────────────── */
.form-control,.form-select{border:1.5px solid var(--omni-input-b);border-radius:var(--omni-input-r);padding:9px 13px;font-size:14px;font-family:'Plus Jakarta Sans',sans-serif;color:#0F172A;background:#fff;transition:border-color .15s,box-shadow .15s;line-height:1.5}
.form-control:focus,.form-select:focus{border-color:var(--omni-input-f);box-shadow:0 0 0 3px rgba(14,165,233,.14);outline:none}
.form-control.is-invalid{border-color:var(--omni-red)}
.form-control::placeholder{color:#94A3B8}
.form-control-lg,.form-select-lg{padding:11px 14px;font-size:15px}
.form-control-sm,.form-select-sm{padding:6px 10px;font-size:12.5px}
.form-label{font-weight:600;font-size:13px;color:#0F172A;margin-bottom:5px;display:block}
.form-text{font-size:12px;color:#94A3B8;margin-top:4px}
.form-control[type="file"]{padding:7px 10px}
.form-control[type="file"]::file-selector-button{padding:6px 13px;margin-right:11px;background:#F1F5F9;border:1.5px solid #CBD5E1;border-radius:5px;font-size:12.5px;font-weight:600;color:#475569;cursor:pointer;transition:background .14s}
.form-control[type="file"]::file-selector-button:hover{background:#E2E8F0}
.form-check-input{border:1.5px solid #CBD5E1;border-radius:4px;width:15px;height:15px}
.form-check-input:checked{background-color:var(--omni-blue);border-color:var(--omni-blue)}
.form-check-label{font-size:13.5px;font-weight:500;color:#334155}

/* Componentes custom de formulario */
.omni-info-bar{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-radius:8px;background:#F8FAFC;border:1.5px solid var(--omni-card-b);border-left:4px solid var(--omni-blue);gap:16px}
.omni-info-bar.ok{border-left-color:var(--omni-emerald)}
.omni-info-bar.bajo{border-left-color:var(--omni-red)}
.omni-calc{padding:9px 13px;min-height:42px;border:1.5px solid var(--omni-card-b);border-radius:var(--omni-input-r);background:#F8FAFC;color:#475569;font-size:14px;display:flex;align-items:center}
.omni-total{padding:9px 14px;min-height:42px;border:2px solid var(--omni-emerald);border-radius:var(--omni-input-r);background:rgba(16,185,129,.06);color:#065F46;font-size:16px;font-weight:700;display:flex;align-items:center}
.omni-callout{padding:10px 14px;border-radius:6px;font-size:13px;font-weight:500;display:flex;align-items:flex-start;gap:8px}
.omni-callout-danger{background:rgba(239,68,68,.08);border-left:3px solid var(--omni-red);color:#B91C1C}
.omni-callout-warning{background:rgba(245,158,11,.08);border-left:3px solid var(--omni-amber);color:#92400E}
.omni-callout-info{background:rgba(14,165,233,.08);border-left:3px solid var(--omni-blue);color:#0369A1}
.omni-search-card{padding:12px 14px;border-radius:8px;cursor:pointer;border:1.5px solid var(--omni-card-b);background:#fff;transition:all .17s;height:100%}
.omni-search-card:hover{border-color:var(--omni-blue);transform:translateY(-2px);box-shadow:0 4px 16px rgba(14,165,233,.18)}
.omni-search-card.bajo{border-color:rgba(239,68,68,.4)}
.omni-form-sec{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:#64748B;padding-bottom:8px;margin:16px 0 12px;border-bottom:1.5px solid var(--omni-card-b)}

/* ── CARDS ────────────────────────────────────────────────────────────────── */
.card{background:var(--omni-card-bg);border:1px solid var(--omni-card-b);border-radius:var(--omni-card-r);box-shadow:0 1px 4px rgba(15,23,42,.06)}
.card-body{padding:20px}
.card-header{padding:13px 20px;background:#F8FAFC;border-bottom:1px solid var(--omni-card-b);font-family:'Outfit',sans-serif;font-size:14px;font-weight:600;color:#1E293B;border-radius:var(--omni-card-r) var(--omni-card-r) 0 0!important}

/* ── TABLAS ───────────────────────────────────────────────────────────────── */
.table{font-size:13.5px}
.table thead th{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#64748B;background:#F8FAFC;border-bottom:2px solid var(--omni-card-b);padding:10px 12px;white-space:nowrap}
.table tbody td{padding:10px 12px;vertical-align:middle;color:#334155}
.table-hover tbody tr:hover{background:rgba(14,165,233,.05)}

/* ── MODAL ────────────────────────────────────────────────────────────────── */
.modal-content{border:none;border-radius:12px;box-shadow:0 20px 60px rgba(15,23,42,.3)}
.modal-header{padding:16px 22px;border-bottom:1px solid var(--omni-card-b);background:#F8FAFC;border-radius:12px 12px 0 0}
.modal-title{font-family:'Outfit',sans-serif;font-weight:600;font-size:16px;color:#0F172A}
.modal-body{padding:22px}
.modal-footer{padding:14px 22px;border-top:1px solid var(--omni-card-b);gap:10px}

/* ── SWEETALERT2 ──────────────────────────────────────────────────────────── */
.swal2-popup{border-radius:12px!important;font-family:'Plus Jakarta Sans',sans-serif!important}
.swal2-title{font-family:'Outfit',sans-serif!important;color:#0F172A!important}
.omni-toast{border-radius:9px!important;box-shadow:0 8px 24px rgba(15,23,42,.2)!important}

/* ── LOGIN ────────────────────────────────────────────────────────────────── */
.login-wrapper{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(140deg,#0F172A 0%,#1E293B 100%)}
.login-card{width:100%;max-width:420px;background:#fff;border-radius:14px;padding:38px;box-shadow:0 20px 60px rgba(15,23,42,.45)}
.login-logo{text-align:center;margin-bottom:26px}
.login-logo-icon{width:54px;height:54px;margin-bottom:12px;background:linear-gradient(135deg,var(--omni-coral),var(--omni-coral-d));border-radius:13px;display:inline-flex;align-items:center;justify-content:center;font-size:23px;color:#fff}
.login-title{font-family:'Outfit',sans-serif;font-size:21px;font-weight:700;color:#0F172A}
.login-sub{font-size:13px;color:#94A3B8;margin:4px 0 0}
.btn-login{background:linear-gradient(135deg,var(--omni-coral),var(--omni-coral-d));border:none;color:#fff;font-weight:600;padding:.55rem 1rem;border-radius:8px;transition:filter .15s,transform .05s}
.btn-login:hover{filter:brightness(1.08);color:#fff}
.btn-login:active{filter:brightness(.95);transform:scale(.99)}
@media (max-width:480px){.login-card{padding:26px 20px;margin:0 12px}}

/* ── RESPONSIVE ───────────────────────────────────────────────────────────── */
@media(max-width:991.98px){
  .omni-sidebar{transform:translateX(-100%);width:var(--sb-w)!important}
  .omni-sidebar.mobile-open{transform:translateX(0)}
  .omni-main{margin-left:0!important}
  .omni-topbar{padding:0 14px}
  .page-content{padding:14px}
}
@media(max-width:575px){
  .btn{font-size:12.5px;padding:8px 14px}
  .card-body{padding:14px}
}

/* ── Sin subrayado en botones ─────────────────────────────────────────────── */
.btn,a.btn{text-decoration:none!important}

/* ── Botones de accion en tablas ──────────────────────────────────────────── */
.btn-icon-action{width:30px;height:30px;padding:0;border:1.5px solid #E2E8F0;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;background:transparent;color:#94A3B8;transition:all .14s;cursor:pointer;text-decoration:none!important;vertical-align:middle;line-height:1}
.btn-icon-action:hover{background:#F8FAFC;color:#475569}
.btn-icon-action.view:hover,.btn-icon-action.edit:hover{color:var(--omni-blue);border-color:var(--omni-blue);background:rgba(14,165,233,.07)}
.btn-icon-action.del:hover{color:var(--omni-red);border-color:var(--omni-red);background:rgba(239,68,68,.07)}
.btn-icon-action.print:hover{color:var(--omni-slate);border-color:var(--omni-slate);background:rgba(30,41,59,.07)}
.btn-icon-action.ticket:hover{color:var(--omni-emerald);border-color:var(--omni-emerald);background:rgba(16,185,129,.07)}
.btn-icon-action.rev:hover,.btn-icon-action.key:hover{color:var(--omni-amber);border-color:var(--omni-amber);background:rgba(245,158,11,.07)}
.btn-icon-action[disabled],.btn-icon-action:disabled{opacity:.35;cursor:not-allowed;pointer-events:none}

/* ── Tablas compactas 100% ancho ──────────────────────────────────────────── */
.table{width:100%!important}
.table thead th{padding:7px 10px!important;font-size:11px}
.table tbody td{padding:6px 10px!important;font-size:13px}
.table td.acciones,.table th.acciones{white-space:nowrap;width:1%}
.table-responsive{border-radius:var(--omni-card-r)}

/* Badges de estado inline */
.badge-on{background:rgba(16,185,129,.12);color:#065F46;font-size:11px;padding:3px 9px;border-radius:20px;font-weight:600}
.badge-off{background:rgba(100,116,139,.12);color:#475569;font-size:11px;padding:3px 9px;border-radius:20px;font-weight:600}
