:root{--red:#e21d2c;--red2:#b90f1d;--dark:#0b1324;--side:#192538;--panel:#1c2a40;--panel2:#24344d;--line:#34445c;--text:#f5f6f8;--muted:#8fa0b8;--green:#20c77a;--blue:#19aae4}*{box-sizing:border-box}body{margin:0;background:var(--dark);color:var(--text);font-family:Inter,"Segoe UI",Arial,sans-serif;display:flex;min-height:100vh}aside{width:275px;background:var(--side);border-right:1px solid #29374c;position:fixed;inset:0 auto 0 0;display:flex;flex-direction:column}.brand{height:70px;display:flex;align-items:center;border-bottom:1px solid #29374c;padding:0 18px;gap:10px;font-size:21px;color:var(--blue)}.brand b{background:var(--red);color:white;padding:10px;border-radius:50%}.profile{display:flex;align-items:center;gap:11px;padding:19px 18px;border-bottom:1px solid #29374c}.profile small,.profile strong{display:block}.profile small,.version{color:var(--muted)}.avatar,.user{width:39px;height:39px;border-radius:50%;background:linear-gradient(135deg,var(--red),#77121a);display:grid;place-items:center;font-weight:800;cursor:pointer}nav{padding:10px 8px;overflow:auto}nav button{width:100%;border:0;background:transparent;color:#aebbd0;padding:11px 13px;border-radius:7px;text-align:left;font-size:15px;margin:2px 0;cursor:pointer}nav button:hover,nav button.active{background:#263650;color:#fff;border-left:3px solid var(--blue)}.version{margin-top:auto;padding:17px;text-align:center;border-top:1px solid #29374c;font-size:12px}main{margin-left:0;width:100%}header{height:55px;background:#1a2639;border-bottom:1px solid #28364c;display:flex;align-items:center;padding:0 20px;position:sticky;top:0;z-index:3}header small,header b{display:block}.hamb{display:none}.head-actions{margin-left:auto;display:flex;align-items:center;gap:12px}.head-actions button{background:#111b2d;color:white;border:0;border-radius:50%;padding:10px}#app{padding:20px 15px}.page-title{display:flex;align-items:center;margin-bottom:20px}.page-title h1{font-size:27px;margin:0 0 5px}.page-title p{margin:0;color:var(--muted)}.actions{margin-left:auto;display:flex;gap:8px}.btn{border:0;background:var(--red);color:#fff;padding:10px 15px;border-radius:7px;font-weight:700;cursor:pointer}.btn:hover{background:var(--red2)}.btn.gray{background:#344158}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.card{background:var(--panel);border:1px solid #263750;border-radius:14px;padding:19px;position:relative;overflow:hidden}.card:after{content:"";position:absolute;right:-20px;top:-20px;width:80px;height:80px;background:#19aae40e;border-radius:50%}.card small{color:var(--muted)}.card h2{font-size:27px;margin:10px 0 0}.card .up{color:var(--green);font-size:12px}.panel{background:var(--panel);border:1px solid #263750;border-radius:14px;margin-bottom:18px;overflow:hidden}.panel-head{display:flex;align-items:center;padding:17px 19px;border-bottom:1px solid var(--line)}.panel-head h3{margin:0}.search{margin-left:auto;background:#111b2b;border:1px solid var(--line);color:white;padding:9px 12px;border-radius:7px;min-width:250px}table{width:100%;border-collapse:collapse;font-size:13px}th{background:#25354d;color:#cdd8e8;text-align:left;padding:13px 15px}td{padding:12px 15px;border-top:1px solid #2d3d54}tr:hover td{background:#24344c}.badge{display:inline-block;padding:5px 8px;border-radius:20px;background:#e21d2c22;color:#ff7380;font-weight:700}.badge.ok{background:#20c77a22;color:#45df98}.empty{text-align:center;color:var(--muted);padding:50px}.pos{display:grid;grid-template-columns:1fr 380px;gap:18px}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:15px}.product{background:var(--panel2);border:1px solid #3a4b64;border-radius:10px;padding:15px;cursor:pointer}.product:hover{border-color:var(--blue);transform:translateY(-1px)}.product h4{margin:0 0 8px}.product b{color:#36bced}.cart{padding:16px}.cart-row{display:grid;grid-template-columns:1fr 35px 90px;gap:8px;padding:12px 0;border-bottom:1px solid var(--line)}.total{background:linear-gradient(90deg,var(--red2),var(--red));padding:18px;margin:15px -16px;font-size:22px;font-weight:800;display:flex;justify-content:space-between}.modal{position:fixed;inset:0;background:#000a;z-index:10;display:grid;place-items:center}.hidden{display:none!important}.modal-box{width:min(650px,92vw);max-height:90vh;overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:24px;position:relative}.x{position:absolute;right:16px;top:12px;background:transparent;border:0;color:white;font-size:25px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field label{display:block;color:var(--muted);font-size:12px;margin-bottom:6px}.field input,.field select{width:100%;background:#121b2b;color:white;border:1px solid var(--line);padding:11px;border-radius:7px}.form-actions{grid-column:1/-1;text-align:right;margin-top:10px}#toast{position:fixed;right:22px;bottom:22px;background:#202d42;border-left:4px solid var(--green);padding:14px 20px;border-radius:7px;display:none}.dashboard-banner{background:var(--panel);border-radius:15px;padding:27px 30px;display:grid;grid-template-columns:1.7fr repeat(4,1fr);align-items:center;gap:22px;margin-bottom:20px}.dashboard-banner .intro h1{color:var(--blue);margin:0 0 6px}.metric strong{display:block;font-size:19px}.metric small{color:var(--muted)}.charts{display:grid;grid-template-columns:2.3fr 1fr;gap:14px}.chart{min-height:355px;padding:22px}.chart-head{display:flex;justify-content:space-between}.chart-area{height:240px;border-bottom:1px solid var(--line);background:repeating-linear-gradient(to bottom,transparent 0,transparent 58px,#34445c55 59px);display:flex;align-items:flex-end;gap:12px;padding:0 15px}.hour{flex:1;text-align:center;font-size:10px;color:var(--muted)}.dot{display:block;width:10px;height:10px;border:2px solid white;border-radius:50%;margin:0 auto 9px;background:#50637e}.week-bars{height:240px;display:flex;align-items:flex-end;justify-content:space-around;border-bottom:1px solid var(--line)}.week-bar{width:13%;min-height:6px;background:linear-gradient(var(--blue),#24528a);position:relative}.week-bar span{position:absolute;top:100%;margin-top:8px;font-size:11px;color:var(--muted)}.login-screen{position:fixed;inset:0;background:radial-gradient(circle at 75% 20%,#1d4268,#081220 60%);z-index:50;display:grid;place-items:center;padding:20px}.login-card{width:min(920px,96vw);min-height:560px;background:#f8fafc;color:#182235;border-radius:18px;box-shadow:0 25px 80px #0008;overflow:hidden;display:grid;grid-template-columns:43% 57%}.login-info{background:linear-gradient(155deg,#0e83d8,#055a9a);color:white;padding:38px;display:flex;flex-direction:column}.license{font-size:15px}.login-contact{margin:auto 0}.login-contact h2{font-size:35px;margin:0}.login-contact p{opacity:.85}.socials{font-size:28px;margin-top:35px}.login-form{padding:50px 65px;display:flex;flex-direction:column;justify-content:center}.login-logo{display:flex;align-items:center;gap:14px;color:#098cd7}.login-logo>b{font-size:45px}.login-logo strong,.login-logo small{display:block}.login-form h1{font-size:32px;margin:30px 0 5px}.login-form p{color:#718096}.login-form label{display:block;margin:15px 0 6px;color:#4a5568;font-weight:600}.login-form input{width:100%;padding:13px;border:1px solid #cbd5e0;border-radius:7px;font-size:16px}.password{display:flex}.password input{border-radius:7px 0 0 7px}.password button{width:50px;border:1px solid #cbd5e0;background:white;border-left:0;border-radius:0 7px 7px 0}.login-btn{margin-top:24px;width:100%;padding:14px;background:#0b8ed9;color:white;border:0;border-radius:7px;font-weight:800;font-size:16px}.server-status{margin-top:25px;color:#68768a;font-size:13px}.server-status i{display:inline-block;width:9px;height:9px;border-radius:50%;background:#18b96d}#loginError{color:#d52b3b;font-size:13px;margin-top:10px}@media(max-width:1000px){.cards{grid-template-columns:1fr 1fr}.pos,.charts{grid-template-columns:1fr}.product-grid{grid-template-columns:1fr 1fr}.dashboard-banner{grid-template-columns:1fr 1fr}.login-card{grid-template-columns:1fr}.login-info{display:none}}@media(max-width:720px){aside{display:none}main{margin:0;width:100%}.cards{grid-template-columns:1fr}.product-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.hamb{display:block}.search{min-width:120px}.dashboard-banner{grid-template-columns:1fr}.login-form{padding:35px 25px}}
/* AMB Productos - filtro de fechas profesional */
.r19-product-toolbar .product-date-filter{display:grid;grid-template-columns:minmax(145px,1fr) minmax(145px,1fr) auto;gap:8px 12px;align-items:end;padding:12px 14px;border:1px solid rgba(148,163,184,.25);border-radius:14px;background:rgba(15,23,42,.32);min-width:410px}
.r19-product-toolbar .product-filter-title{grid-column:1/-1;font-weight:800;font-size:13px;letter-spacing:.02em;color:#e5e7eb}
.r19-product-toolbar .product-date-filter label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:700;color:#cbd5e1}
.r19-product-toolbar .product-date-filter input[type=date]{width:100%;min-height:40px;padding:8px 10px;border:1px solid rgba(148,163,184,.35);border-radius:9px;background:#111827;color:#f8fafc;color-scheme:dark}
.r19-product-toolbar .product-date-clear{min-height:40px;padding:0 13px;border-radius:9px;white-space:nowrap}
@media(max-width:900px){.r19-product-toolbar .product-date-filter{grid-template-columns:1fr 1fr;min-width:100%;width:100%}.r19-product-toolbar .product-date-clear{grid-column:1/-1}.r19-product-toolbar{flex-wrap:wrap}}


/* AMB_FINANCE_MODAL_FIXED_R1 */
/* Mejora visual segura para formularios de Gastos e Ingresos */
#modal{align-items:center;justify-items:center;padding:18px;overflow:hidden;z-index:1000000!important}
#modal .modal-box{width:min(1050px,96vw);max-height:92vh;overflow:auto;padding:26px 28px 0;box-shadow:0 24px 70px rgba(0,0,0,.55)}
#modalTitle{font-size:28px;line-height:1.2;margin:0 42px 20px 0}
#modalForm .field label{font-size:14px;font-weight:800;letter-spacing:.02em;margin-bottom:7px}
#modalForm .field input,#modalForm .field select,#modalForm .field textarea{font-size:16px;line-height:1.35;min-height:46px}
#modalForm textarea[name="description"]{display:block;width:100%;min-height:132px;resize:vertical;background:#fff!important;color:#172033!important;border:2px solid #dce4ec!important;border-radius:8px;padding:13px 15px;font-size:17px!important;font-weight:600}
#modalForm .full-field{grid-column:1/-1}
#modalForm .form-actions{position:sticky;bottom:0;z-index:5;margin:18px -28px 0;padding:15px 28px;background:#1c2a40;border-top:1px solid #34445c;box-shadow:0 -10px 22px rgba(7,14,26,.35)}
#modalForm .form-actions .btn{font-size:16px;min-width:112px;padding:12px 18px}
@media(max-width:720px){#modal{padding:8px}#modal .modal-box{width:98vw;max-height:96vh;padding:20px 16px 0}#modalTitle{font-size:23px}#modalForm .field label{font-size:13px}#modalForm .field input,#modalForm .field select,#modalForm .field textarea{font-size:16px}#modalForm .form-actions{margin:16px -16px 0;padding:12px 16px}}

/* AMB POS - Alertas prominentes y control de productos sin existencia */
#toast.error-toast{border-left-color:#ef4444!important;background:#3b1117!important;color:#fee2e2!important;box-shadow:0 8px 24px rgba(239,68,68,.35)!important;font-weight:700}
.product.compact-card{position:relative}
.product-out-of-stock{opacity:.72!important;border:1px solid rgba(239,68,68,.45)!important;background:rgba(239,68,68,.05)!important}
.product-out-of-stock:hover{border-color:#ef4444!important}
.badge-out-stock{position:absolute;top:6px;right:6px;background:#dc2626;color:#fff;font-size:9.5px;font-weight:800;padding:2px 6px;border-radius:4px;letter-spacing:.03em;z-index:2;box-shadow:0 2px 6px rgba(0,0,0,.35)}
.stock-zero-text{color:#ef4444!important;font-weight:800!important}

/* ================= AMB POS: PANTALLA COMPLETA EN VENTAS (OCULTAR MENU LATERAL CON TOGGLE) ================= */
body.amb-pos-fullscreen aside#sidebar,
body.amb-r83-pos aside#sidebar {
  position: fixed !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 320px !important;
  max-width: 88vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  z-index: 999999 !important;
  background: #071a2b !important;
  transform: translateX(-100%) !important;
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
  box-shadow: none !important;
}

body.amb-pos-fullscreen aside#sidebar.open,
body.amb-pos-fullscreen aside#sidebar.mobile-open,
body.amb-r83-pos aside#sidebar.open,
body.amb-r83-pos aside#sidebar.mobile-open {
  transform: translateX(0) !important;
  box-shadow: 14px 0 55px rgba(0, 0, 0, 0.9) !important;
}

body.amb-pos-fullscreen main,
body.amb-r83-pos main {
  margin-left: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
}

body.amb-pos-fullscreen header .hamb,
body.amb-r83-pos header .hamb {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  padding: 8px 14px !important;
  background: linear-gradient(135deg, #1b2c45, #111e30) !important;
  border: 1px solid #2e4d73 !important;
  border-radius: 8px !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.25) !important;
}

body.amb-pos-fullscreen header .hamb:hover,
body.amb-r83-pos header .hamb:hover {
  background: #243c5e !important;
  border-color: #38bdf8 !important;
}

.pos-modules-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  font-weight: 800 !important;
  background: #1e2e42 !important;
  border: 1px solid #334d6e !important;
  color: #e2e8f0 !important;
  padding: 8px 14px !important;
  border-radius: 7px !important;
  cursor: pointer !important;
  font-size: 13px !important;
}
.pos-modules-btn:hover {
  background: #273b54 !important;
  border-color: #38bdf8 !important;
  color: #fff !important;
}

body.amb-pos-fullscreen .mobile-close-sidebar,
body.amb-r83-pos .mobile-close-sidebar {
  display: block !important;
}

.pos-menu-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(4, 11, 20, 0.7);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  z-index: 999990;
}
.pos-menu-backdrop.visible {
  display: block !important;
}

/* =========================================================================
   TECNOLOGÍA AMBIORIS - FORMATO VISUAL PROFESIONAL DE FECHA Y HORA
   ========================================================================= */
.amb-dt-box {
  display: inline-flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  line-height: 1.25 !important;
  text-align: left !important;
  vertical-align: middle !important;
  min-width: 125px;
}
.amb-dt-date {
  font-weight: 700 !important;
  color: #f8fafc !important;
  font-size: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  white-space: nowrap !important;
}
.amb-dt-today {
  background: #10b981 !important;
  color: #ffffff !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  padding: 1px 5px !important;
  border-radius: 4px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  line-height: 1.3 !important;
}
.amb-dt-yesterday {
  background: #64748b !important;
  color: #ffffff !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  padding: 1px 5px !important;
  border-radius: 4px !important;
  text-transform: uppercase !important;
  line-height: 1.3 !important;
}
.amb-dt-time {
  font-size: 11px !important;
  color: #38bdf8 !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  white-space: nowrap !important;
  background: rgba(56, 189, 248, 0.12) !important;
  padding: 2px 7px !important;
  border-radius: 4px !important;
  border: 1px solid rgba(56, 189, 248, 0.28) !important;
  width: fit-content !important;
}
.amb-dt-icon {
  font-size: 11px !important;
  line-height: 1 !important;
}
.amb-dt-empty {
  color: #94a3b8;
}

/* Modo claro (Light mode) */
body.light-mode .amb-dt-date,
[data-theme="light"] .amb-dt-date {
  color: #0f172a !important;
}
body.light-mode .amb-dt-time,
[data-theme="light"] .amb-dt-time {
  color: #0369a1 !important;
  background: #e0f2fe !important;
  border-color: #bae6fd !important;
}

/* =========================================================================
   TECNOLOGÍA AMBIORIS - NOTIFICADOR FLOTANTE (TOAST) DE MÁXIMA VISIBILIDAD
   ========================================================================= */
#toast {
  position: fixed !important;
  top: 24px !important;
  right: 24px !important;
  bottom: auto !important;
  left: auto !important;
  z-index: 10000000 !important;
  background: #0f1c30 !important;
  color: #ffffff !important;
  border: 1px solid rgba(16, 185, 129, 0.45) !important;
  border-left: 6px solid #10b981 !important;
  padding: 13px 22px !important;
  border-radius: 9px !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.65), 0 0 16px rgba(16, 185, 129, 0.25) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.2px !important;
  pointer-events: auto !important;
  max-width: 90vw !important;
  display: none;
  animation: ambToastSlideIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

#toast.error-toast {
  border-color: rgba(239, 68, 68, 0.45) !important;
  border-left: 6px solid #ef4444 !important;
  background: #2b0e14 !important;
  color: #fee2e2 !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.65), 0 0 16px rgba(239, 68, 68, 0.35) !important;
}

@keyframes ambToastSlideIn {
  from {
    transform: translateY(-20px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}







/* ==================== FACTURACIÓN ELECTRÓNICA e-CF / NCF POS ==================== */
.pos-ecf-badge-active {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: #059669;
  color: #ffffff;
  border: 1px solid #10b981;
  border-radius: 6px;
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .3px;
  cursor: pointer;
  transition: all .15s ease-in-out;
}
.pos-ecf-badge-active:hover {
  background: #047857;
  transform: translateY(-1px);
}
.pos-ecf-badge-cta {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  color: #ffffff;
  border: 1px solid #fbbf24;
  border-radius: 6px;
  padding: 5px 11px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .4px;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(245, 158, 11, 0.35);
  animation: pulse-ecf-glow 2s infinite;
  transition: all .15s ease-in-out;
}
.pos-ecf-badge-cta:hover {
  background: linear-gradient(135deg, #d97706, #b45309);
  transform: translateY(-1px);
}
@keyframes pulse-ecf-glow {
  0% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.4); }
  70% { box-shadow: 0 0 0 8px rgba(245, 158, 11, 0); }
  100% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0); }
}

.ecf-quick-card {
  background: #192538;
  border: 1px solid #2a3b53;
  border-radius: 10px;
  padding: 14px 16px;
  margin-bottom: 12px;
}
.ecf-quick-seq-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.ecf-seq-box {
  background: #111a29;
  border: 1px solid #28394f;
  border-radius: 8px;
  padding: 10px 12px;
}
.ecf-seq-box h4 {
  margin: 0 0 8px 0;
  font-size: 12px;
  color: #38bdf8;
  font-weight: 800;
}

/* =========================================================================
   TECNOLOGÍA AMBIORIS - MÓDULO DE CAJA MÓVIL ESTILO APP NATIVA (V2 COMPACTO)
   Cierres y Cortes de Caja organizados por Tarjetas (Mobile-First)
   ========================================================================= */

/* Por defecto en PC / Escritorio */
.shifts-desktop-table {
  display: block !important;
}
.shifts-mobile-cards {
  display: none !important;
}

/* Solo en Celulares y Tablets / Pantallas Móviles */
@media (max-width: 768px) {
  .shifts-desktop-table {
    display: none !important;
  }
  .shifts-mobile-cards {
    display: block !important;
  }

  /* Ocultar elementos de escritorio que ensucian la pantalla en celular */
  .cash-v2 > .page-title,
  .cash-v2 > .cash-toolbar,
  .cash-v2 > .cash-table-panel,
  .cash-v2 > .cash-payments,
  .cash-v2 > .cash-kpis {
    display: none !important;
  }

  /* Contenedor principal de cortes en móvil */
  .amb-mobile-shifts-wrapper {
    margin-top: 2px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
  }

  /* Cabecera Móvil: CIERRES Y CORTES DE CAJA */
  .amb-shifts-mobile-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 2px 2px 4px;
    width: 100%;
    box-sizing: border-box;
  }
  .amb-shifts-title {
    font-size: 14.5px !important;
    font-weight: 900 !important;
    color: #ffffff !important;
    margin: 0 !important;
    letter-spacing: 0.3px;
    text-transform: uppercase;
  }
  .amb-shifts-sub {
    font-size: 10.5px !important;
    color: #94a3b8 !important;
    margin: 2px 0 0 !important;
    font-weight: 500;
  }
  .amb-shifts-count-badge {
    background: rgba(0, 136, 255, 0.15);
    border: 1px solid rgba(0, 136, 255, 0.35);
    color: #38bdf8;
    font-size: 10.5px;
    font-weight: 800;
    padding: 3px 8px;
    border-radius: 16px;
    white-space: nowrap;
    flex-shrink: 0;
  }

  /* Buscador móvil de cortes */
  .amb-shifts-search-wrap {
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 2px;
  }
  .amb-shifts-search-input {
    width: 100% !important;
    height: 38px !important;
    background: #091728 !important;
    border: 1px solid #1e3d60 !important;
    border-radius: 8px !important;
    color: #ffffff !important;
    font-size: 12.5px !important;
    padding: 0 12px !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s, box-shadow 0.2s;
  }
  .amb-shifts-search-input:focus {
    outline: none !important;
    border-color: #00e5ff !important;
    box-shadow: 0 0 0 2px rgba(0, 229, 255, 0.2) !important;
  }

  /* =========================================================================
     TARJETA HERO: ÚLTIMO CIERRE DE CAJA
     ========================================================================= */
  .amb-shift-hero-card {
    background: linear-gradient(135deg, #0d2847 0%, #081a30 100%);
    border: 1px solid #1e4a77;
    border-radius: 14px;
    padding: 12px 14px;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35), 0 0 16px rgba(0, 136, 255, 0.08);
    position: relative;
    overflow: hidden;
    cursor: pointer;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    transition: transform 0.15s, border-color 0.15s;
  }
  .amb-shift-hero-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #0088ff, #00e5ff);
  }
  .amb-shift-hero-card:active {
    transform: scale(0.985);
    border-color: #00e5ff;
  }

  .amb-hero-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    min-width: 0;
  }
  .amb-hero-tag {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #38bdf8;
    font-size: 11.5px;
    font-weight: 900;
    letter-spacing: 0.2px;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .amb-hero-icon {
    font-size: 14px;
    flex-shrink: 0;
  }
  .amb-hero-time {
    background: rgba(56, 189, 248, 0.16);
    border: 1px solid rgba(56, 189, 248, 0.35);
    color: #7dd3fc;
    font-size: 10px;
    font-weight: 800;
    padding: 2px 7px;
    border-radius: 12px;
    font-family: Consolas, monospace;
    flex-shrink: 0;
    white-space: nowrap;
  }

  .amb-hero-mid {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 8px;
    gap: 6px;
    min-width: 0;
  }
  .amb-hero-sublabel {
    font-size: 11px;
    font-weight: 600;
    color: #94a3b8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* Píldoras de estado en Hero */
  .amb-hero-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.2px;
    flex-shrink: 0;
    white-space: nowrap;
  }
  .amb-hero-pill.ok {
    background: rgba(16, 185, 129, 0.18);
    border: 1px solid rgba(16, 185, 129, 0.45);
    color: #34d399;
  }
  .amb-hero-pill.minus {
    background: rgba(239, 68, 68, 0.18);
    border: 1px solid rgba(239, 68, 68, 0.45);
    color: #f87171;
  }
  .amb-hero-pill.plus {
    background: rgba(0, 229, 255, 0.18);
    border: 1px solid rgba(0, 229, 255, 0.45);
    color: #38bdf8;
  }
  .amb-hero-pill.open {
    background: rgba(16, 185, 129, 0.18);
    border: 1px solid rgba(16, 185, 129, 0.45);
    color: #6ee7b7;
  }

  .amb-hero-amount {
    font-size: 24px !important;
    font-weight: 900;
    color: #ffffff;
    margin: 6px 0 10px;
    letter-spacing: -0.5px;
    line-height: 1.1;
  }

  .amb-hero-bot {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding-top: 9px;
    min-width: 0;
  }
  .amb-hero-cashier {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11.5px;
    color: #cbd5e1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1 1 auto;
    min-width: 0;
  }
  .amb-hero-cashier strong {
    color: #ffffff;
    font-weight: 800;
  }
  .amb-hero-branch {
    color: #8da4be;
    font-size: 10.5px;
  }
  .amb-hero-link {
    background: none;
    border: none;
    color: #00e5ff;
    font-size: 11.5px;
    font-weight: 800;
    cursor: pointer;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 0;
    flex-shrink: 0;
  }

  /* Divisor de Sección: HISTORIAL DE CORTES ANTERIORES */
  .amb-shifts-section-divider {
    margin: 6px 0 2px;
  }
  .amb-shifts-section-divider h3 {
    margin: 0 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    color: #ffffff !important;
    letter-spacing: 0.4px;
    text-transform: uppercase;
  }

  /* =========================================================================
     LISTA DE TARJETAS DE CORTES ANTERIORES (COMPACTAS)
     ========================================================================= */
  .amb-mobile-shifts-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .amb-corte-card {
    background: linear-gradient(135deg, #0a2038 0%, #07172b 100%);
    border: 1px solid #1a3c63;
    border-radius: 12px;
    padding: 10px 12px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.22);
    cursor: pointer;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    transition: transform 0.15s, border-color 0.15s, box-shadow 0.15s;
  }
  .amb-corte-card:active {
    transform: scale(0.985);
    border-color: #00e5ff;
  }

  .amb-corte-top {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 6px !important;
    margin-bottom: 8px !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  .amb-corte-id-badge {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
  }
  .amb-corte-icon {
    width: 28px !important;
    height: 28px !important;
    background: rgba(0, 136, 255, 0.14);
    border: 1px solid rgba(0, 136, 255, 0.3);
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    flex-shrink: 0;
  }
  .amb-corte-lbl {
    font-size: 9px;
    font-weight: 700;
    color: #8fa5bd;
    text-transform: uppercase;
    line-height: 1;
  }
  .amb-corte-num {
    font-size: 12.5px;
    font-weight: 900;
    color: #ffffff;
    font-family: Consolas, monospace;
    line-height: 1.2;
  }

  /* Centro: Fecha y hora */
  .amb-corte-datetime {
    display: flex;
    flex-direction: column;
    gap: 0;
    text-align: center;
    flex: 1 1 auto;
    min-width: 0;
  }
  .amb-corte-d {
    font-size: 10.5px;
    font-weight: 600;
    color: #94a3b8;
  }
  .amb-corte-t {
    font-size: 10.5px;
    font-weight: 800;
    color: #e2e8f0;
    font-family: Consolas, monospace;
  }

  /* Derecha: Píldora de estado */
  .amb-corte-pill-wrap {
    text-align: right;
    flex-shrink: 0;
  }
  .amb-corte-pill {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2px 7px;
    border-radius: 6px;
    font-size: 10px;
    font-weight: 800;
    line-height: 1.15;
    text-align: center;
    white-space: nowrap;
  }
  .amb-corte-pill small {
    font-size: 9px;
    font-weight: 700;
  }
  .amb-corte-pill.ok {
    background: rgba(16, 185, 129, 0.14);
    border: 1px solid rgba(16, 185, 129, 0.4);
    color: #34d399;
  }
  .amb-corte-pill.minus {
    background: rgba(239, 68, 68, 0.14);
    border: 1px solid rgba(239, 68, 68, 0.4);
    color: #f87171;
  }
  .amb-corte-pill.plus {
    background: rgba(0, 229, 255, 0.14);
    border: 1px solid rgba(0, 229, 255, 0.4);
    color: #38bdf8;
  }
  .amb-corte-pill.open {
    background: rgba(16, 185, 129, 0.14);
    border: 1px solid rgba(16, 185, 129, 0.4);
    color: #6ee7b7;
  }

  /* Fila inferior: Cajero y Monto */
  .amb-corte-body {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    gap: 8px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.07) !important;
    padding-top: 8px !important;
    min-width: 0 !important;
    width: 100% !important;
  }
  .amb-corte-left {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }
  .amb-corte-cashier {
    font-size: 11px;
    color: #94a3b8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .amb-corte-cashier strong {
    color: #ffffff;
    font-weight: 800;
  }
  .amb-corte-meta {
    font-size: 9.5px;
    color: #8da4be;
    text-transform: uppercase;
    letter-spacing: 0.2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 1px;
  }

  .amb-corte-right {
    text-align: right;
    flex-shrink: 0;
  }
  .amb-corte-val {
    font-size: 14.5px;
    font-weight: 900;
    color: #ffffff;
    line-height: 1.1;
    margin-bottom: 2px;
    letter-spacing: -0.3px;
  }
  .amb-corte-action-link {
    background: none;
    border: none;
    color: #00e5ff;
    font-size: 10.5px;
    font-weight: 800;
    cursor: pointer;
    padding: 0;
    display: inline-flex;
    align-items: center;
    gap: 2px;
  }

  .amb-shifts-empty, .amb-shifts-search-empty {
    text-align: center;
    padding: 20px 14px;
    color: #8da5bf;
    background: #091a2d;
    border: 1px dashed #1b3859;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
  }
}

/* =========================================================================
   MODAL DE DETALLE DE CORTE DE CAJA (ESTILO BOTTOM SHEET / MODAL NATIVO)
   ========================================================================= */
.amb-corte-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  z-index: 100005;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 0;
  animation: ambFadeIn 0.2s ease-out;
}
@media (min-width: 600px) {
  .amb-corte-modal-backdrop {
    align-items: center;
    padding: 16px;
  }
}
@keyframes ambFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.amb-corte-sheet-card {
  width: 100%;
  max-width: 460px;
  max-height: 90vh;
  background: #ffffff;
  color: #0f172a;
  border-radius: 22px 22px 0 0;
  box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.4);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  animation: ambSlideUp 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
@media (min-width: 600px) {
  .amb-corte-sheet-card {
    border-radius: 20px;
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.5);
  }
}
@keyframes ambSlideUp {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}

.amb-corte-sheet-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px 12px;
  border-bottom: 1px solid #f1f5f9;
}
.amb-corte-sheet-icon {
  width: 38px;
  height: 38px;
  background: #e0f2fe;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 19px;
  flex-shrink: 0;
}
.amb-corte-sheet-titles {
  flex: 1;
  min-width: 0;
}
.amb-corte-sheet-title {
  margin: 0;
  font-size: 15px;
  font-weight: 900;
  color: #0f172a;
  letter-spacing: 0.3px;
  text-transform: uppercase;
}
.amb-corte-sheet-sub {
  font-size: 11.5px;
  font-weight: 700;
  color: #2563eb;
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.amb-corte-sheet-close {
  width: 32px;
  height: 32px;
  background: #f1f5f9;
  border: none;
  border-radius: 50%;
  color: #475569;
  font-size: 14px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.15s;
}
.amb-corte-sheet-close:hover {
  background: #e2e8f0;
  color: #0f172a;
}

.amb-corte-sheet-body {
  padding: 14px 18px 24px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Bloques redondeados estilo Image 3 */
.amb-corte-sheet-box {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.amb-corte-sheet-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 2px 0;
  font-size: 12px;
}
.amb-corte-sheet-lbl {
  color: #64748b;
  font-weight: 500;
}
.amb-corte-sheet-val {
  color: #0f172a;
  font-weight: 600;
  font-family: Consolas, monospace;
}
.amb-corte-sheet-val.dark {
  font-weight: 800;
  font-family: inherit;
}
.amb-corte-sheet-val.link {
  color: #2563eb;
  font-weight: 800;
}

/* Desglose Financiero */
.amb-corte-sheet-breakdown {
  padding: 2px 6px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.amb-corte-sheet-val.green {
  color: #16a34a;
  font-weight: 800;
}
.amb-corte-sheet-val.blue {
  color: #2563eb;
  font-weight: 800;
}
.amb-corte-sheet-val.purple {
  color: #7c3aed;
  font-weight: 800;
}
.amb-corte-sheet-val.orange {
  color: #ea580c;
  font-weight: 800;
}
.amb-corte-sheet-val.red {
  color: #dc2626;
  font-weight: 800;
}

/* Cuadro de Arqueo destacado */
.amb-corte-sheet-box.arqueo-box {
  border-color: #cbd5e1;
}
.amb-corte-sheet-box .highlight-row {
  padding: 8px 0;
  border-top: 1px dashed #cbd5e1;
  border-bottom: 1px dashed #cbd5e1;
  margin: 4px 0;
}
.amb-corte-sheet-lbl-bold {
  font-size: 12.5px;
  font-weight: 900;
  color: #0f172a;
}
.amb-corte-sheet-val-highlight {
  font-size: 16.5px;
  font-weight: 900;
  color: #2563eb;
}

/* Pildoras de cuadratura en el modal */
.amb-corte-sheet-diff-pill-wrap {
  text-align: right;
}
.amb-corte-sheet-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 6px;
  font-size: 11.5px;
  font-weight: 800;
}
.amb-corte-sheet-pill.ok {
  background: #dcfce7;
  border: 1px solid #86efac;
  color: #15803d;
}
.amb-corte-sheet-pill.plus {
  background: #e0f2fe;
  border: 1px solid #7dd3fc;
  color: #0369a1;
}
.amb-corte-sheet-pill.minus {
  background: #fee2e2;
  border: 1px solid #fca5a5;
  color: #b91c1c;
}
.amb-corte-sheet-pill.open {
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  color: #059669;
}

/* Botones de acción */
.amb-corte-sheet-actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}
.amb-corte-sheet-btn-print {
  flex: 1;
  height: 42px;
  background: linear-gradient(135deg, #0284c7, #0369a1);
  color: #ffffff;
  border: none;
  border-radius: 10px;
  font-size: 12.5px;
  font-weight: 800;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: opacity 0.15s;
}
.amb-corte-sheet-btn-print:active {
  opacity: 0.85;
}
.amb-corte-sheet-btn-close {
  height: 42px;
  padding: 0 18px;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  color: #475569;
  border-radius: 10px;
  font-size: 12.5px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s;
}
.amb-corte-sheet-btn-close:active {
  background: #e2e8f0;
}

/* =========================================================================
   COMPATIBILIDAD CON TEMA CLARO (LIGHT MODE)
   ========================================================================= */
body.light-mode .amb-shifts-title,
[data-theme="light"] .amb-shifts-title,
body.light-mode .amb-shifts-section-divider h3,
[data-theme="light"] .amb-shifts-section-divider h3 {
  color: #0f172a !important;
}

body.light-mode .amb-shift-hero-card,
[data-theme="light"] .amb-shift-hero-card {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06) !important;
}
body.light-mode .amb-hero-amount,
[data-theme="light"] .amb-hero-amount {
  color: #0f172a !important;
}
body.light-mode .amb-hero-cashier strong,
[data-theme="light"] .amb-hero-cashier strong {
  color: #0f172a !important;
}
body.light-mode .amb-hero-link,
[data-theme="light"] .amb-hero-link,
body.light-mode .amb-corte-action-link,
[data-theme="light"] .amb-corte-action-link {
  color: #0284c7 !important;
}

body.light-mode .amb-corte-card,
[data-theme="light"] .amb-corte-card {
  background: #ffffff !important;
  border-color: #e2e8f0 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
}
body.light-mode .amb-corte-num,
[data-theme="light"] .amb-corte-num,
body.light-mode .amb-corte-val,
[data-theme="light"] .amb-corte-val,
body.light-mode .amb-corte-cashier strong,
[data-theme="light"] .amb-corte-cashier strong {
  color: #0f172a !important;
}
body.light-mode .amb-corte-t,
[data-theme="light"] .amb-corte-t {
  color: #334155 !important;
}
body.light-mode .amb-shifts-search-input,
[data-theme="light"] .amb-shifts-search-input {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}



/* =========================================================================
   TECNOLOGÍA AMBIORIS - MÓDULO DE PRODUCTOS MÓVIL Y MODALES NATIVOS
   ========================================================================= */

/* Por defecto en PC / Escritorio */
.products-mobile-cards {
  display: none !important;
}

/* Solo en Celulares y Tablets / Pantallas Móviles */
@media (max-width: 768px) {
  /* Ocultar tabla ancha que requería arrastrar a los lados */
  .pb-table-wrap {
    display: none !important;
  }
  .products-mobile-cards {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Compactar cabecera de productos */
  .pb-head {
    display: flex !important;
    flex-direction: column !important;
    padding: 10px 12px !important;
    gap: 8px !important;
    border-radius: 12px !important;
  }
  .pb-title {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
  }
  .pb-title h1 {
    font-size: 16px !important;
    margin: 0 !important;
  }
  .pb-title p {
    font-size: 10.5px !important;
    margin: 2px 0 0 !important;
  }
  .pb-cube {
    width: 36px !important;
    height: 36px !important;
    font-size: 17px !important;
    border-radius: 8px !important;
    flex-shrink: 0 !important;
  }
  .pb-head-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    width: 100% !important;
  }
  .pb-top-search {
    width: 100% !important;
    height: 38px !important;
    margin-bottom: 2px !important;
  }
  .pb-head-actions .pb-btn {
    flex: 1 1 auto !important;
    padding: 7px 10px !important;
    font-size: 11.5px !important;
    border-radius: 7px !important;
    text-align: center !important;
  }

  /* KPIs compactos en celular (2x2) */
  .pb-kpis {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 6px !important;
    margin-bottom: 6px !important;
  }
  .pb-kpis article {
    min-height: auto !important;
    padding: 7px 9px !important;
    gap: 8px !important;
    border-radius: 8px !important;
  }
  .pb-kpis article i {
    width: 30px !important;
    height: 30px !important;
    font-size: 13px !important;
    border-radius: 6px !important;
    flex-shrink: 0 !important;
  }
  .pb-kpis small {
    font-size: 9.5px !important;
    font-weight: 700 !important;
  }
  .pb-kpis strong {
    font-size: 15px !important;
    line-height: 1.1 !important;
    margin: 1px 0 !important;
  }
  .pb-kpis span {
    font-size: 8.5px !important;
    margin-top: 1px !important;
  }

  /* Filtros compactos */
  .pb-filters {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    padding: 8px 10px !important;
    border-radius: 10px !important;
  }
  .pb-filters .pb-date,
  .pb-filters .pb-export {
    display: none !important;
  }
  .pb-filters label b {
    font-size: 10.5px !important;
  }
  .pb-filters input, .pb-filters select {
    height: 36px !important;
    font-size: 12px !important;
    border-radius: 7px !important;
  }
  .pb-filter-actions {
    display: flex !important;
    gap: 6px !important;
  }
  .pb-filter-actions .pb-btn {
    flex: 1 !important;
    padding: 6px 10px !important;
    font-size: 11px !important;
  }

  /* Tarjeta Móvil de Producto */
  .product-catalog-card {
    background: linear-gradient(135deg, #0a2038 0%, #07172b 100%);
    border: 1px solid #1a3c63;
    border-radius: 12px;
    padding: 10px 12px;
    display: flex;
    gap: 12px;
    align-items: center;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.22);
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    transition: transform 0.15s, border-color 0.15s;
  }
  .product-catalog-card:active {
    transform: scale(0.985);
    border-color: #00e5ff;
  }
  .product-catalog-card.is-deactivated {
    background: rgba(239, 68, 68, 0.05);
    border-color: rgba(239, 68, 68, 0.35);
  }

  .amb-pcard-thumb {
    width: 52px;
    height: 52px;
    border-radius: 8px;
    object-fit: contain;
    background: #ffffff;
    flex-shrink: 0;
    border: 1px solid rgba(255, 255, 255, 0.1);
  }
  .amb-pcard-thumb.placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0d2238;
    color: #38bdf8;
    font-size: 22px;
    border: 1px solid #1a3c63;
  }

  .amb-pcard-body {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .amb-pcard-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
  }
  .amb-pcard-cat {
    font-size: 9.5px;
    font-weight: 700;
    color: #7dd3fc;
    background: #0c2540;
    border: 1px solid #1e4570;
    padding: 1px 6px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 55%;
  }
  .amb-pcard-stock-pill {
    font-size: 9.5px;
    font-weight: 800;
    padding: 2px 6px;
    border-radius: 5px;
    white-space: nowrap;
    flex-shrink: 0;
  }
  .amb-pcard-stock-pill.activo {
    background: rgba(16, 185, 129, 0.15);
    border: 1px solid rgba(16, 185, 129, 0.4);
    color: #34d399;
  }
  .amb-pcard-stock-pill.bajo {
    background: rgba(245, 158, 11, 0.15);
    border: 1px solid rgba(245, 158, 11, 0.4);
    color: #fbbf24;
  }
  .amb-pcard-stock-pill.agotado {
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid rgba(239, 68, 68, 0.4);
    color: #f87171;
  }

  .amb-pcard-title {
    font-size: 13.5px;
    font-weight: 800;
    color: #f8fafc;
    line-height: 1.25;
    margin: 2px 0 1px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .amb-pcard-meta {
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .amb-pcard-code {
    font-size: 10px;
    color: #94a3b8;
    background: rgba(0, 0, 0, 0.25);
    padding: 1px 4px;
    border-radius: 4px;
  }
  .amb-pcard-box-tag {
    font-size: 9.5px;
    font-weight: 700;
    color: #c4b5fd;
    background: rgba(109, 40, 217, 0.25);
    border: 1px solid rgba(109, 40, 217, 0.4);
    padding: 1px 5px;
    border-radius: 4px;
  }

  .amb-pcard-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 4px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding-top: 5px;
  }
  .amb-pcard-price {
    font-size: 14.5px;
    font-weight: 900;
    color: #38bdf8;
    font-family: Consolas, monospace;
    line-height: 1;
  }
  .amb-pcard-price small {
    font-size: 10px;
    color: #94a3b8;
    font-family: inherit;
    font-weight: normal;
  }
  .amb-pcard-action-hint {
    font-size: 10.5px;
    font-weight: 800;
    color: #00e5ff;
    display: flex;
    align-items: center;
    gap: 3px;
  }
}

/* =========================================================================
   ESTILOS GENERALES DE MODALES BOTTOM-SHEET NATIVOS (PRODUCTOS Y VENTAS)
   ========================================================================= */
.amb-modal-sheet-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  z-index: 100010;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 0;
  animation: ambFadeIn 0.2s ease-out;
}
@media (min-width: 600px) {
  .amb-modal-sheet-backdrop {
    align-items: center;
    padding: 16px;
  }
}

.amb-modal-sheet-card {
  width: 100%;
  max-width: 460px;
  max-height: 90vh;
  background: #ffffff;
  color: #0f172a;
  border-radius: 22px 22px 0 0;
  box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.4);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  animation: ambSlideUp 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
@media (min-width: 600px) {
  .amb-modal-sheet-card {
    border-radius: 20px;
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.5);
  }
}

.amb-modal-sheet-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px 12px;
  border-bottom: 1px solid #f1f5f9;
}
.amb-modal-sheet-titles {
  flex: 1;
  min-width: 0;
}
.amb-modal-sheet-title {
  margin: 0;
  font-size: 15px;
  font-weight: 900;
  color: #0f172a;
  letter-spacing: 0.3px;
  text-transform: uppercase;
}
.amb-modal-sheet-sub {
  font-size: 11.5px;
  font-weight: 700;
  color: #2563eb;
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.amb-modal-sheet-close {
  width: 32px;
  height: 32px;
  background: #f1f5f9;
  border: none;
  border-radius: 50%;
  color: #475569;
  font-size: 14px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.15s;
}
.amb-modal-sheet-close:hover {
  background: #e2e8f0;
  color: #0f172a;
}

.amb-modal-sheet-body {
  padding: 14px 18px 24px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.amb-modal-sheet-box {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.amb-modal-sheet-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 2px 0;
  font-size: 12px;
}
.amb-modal-sheet-lbl {
  color: #64748b;
  font-weight: 500;
}
.amb-modal-sheet-val {
  color: #0f172a;
  font-weight: 600;
  font-family: Consolas, monospace;
}
.amb-modal-sheet-val.dark {
  font-weight: 800;
  font-family: inherit;
}
.amb-modal-sheet-val.link {
  color: #2563eb;
  font-weight: 800;
}

/* Adaptación de barra de valorización de inventario en móvil */
@media (max-width: 768px) {
  .pb-totals-summary-bar {
    padding: 10px 12px !important;
    margin-top: 10px !important;
  }
  .pb-totals-summary-bar > div:last-child {
    grid-template-columns: 1fr 1fr !important;
    gap: 6px !important;
  }
  .pb-totals-summary-bar div[style*="background:#0b1d33"] {
    padding: 8px 10px !important;
  }
  .pb-totals-summary-bar b {
    font-size: 14px !important;
  }
}

/* Compatibilidad Light Mode para Tarjetas Móviles de Producto */
body.light-mode .product-catalog-card,
[data-theme="light"] .product-catalog-card {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
}
body.light-mode .amb-pcard-title,
[data-theme="light"] .amb-pcard-title {
  color: #0f172a !important;
}
body.light-mode .amb-pcard-price,
[data-theme="light"] .amb-pcard-price {
  color: #0284c7 !important;
}


/* =========================================================================
   TECNOLOGÍA AMBIORIS · CATÁLOGO MÓVIL ULTRA-COMPACTO DE PRODUCTOS (V3)
   ========================================================================= */

/* Por defecto en PC / Escritorio */
.products-desktop-bar {
  display: block !important;
}
.products-mobile-bar {
  display: none !important;
}

/* En teléfonos y pantallas móviles (<= 768px) */
@media (max-width: 768px) {
  /* Ocultar barra gigante de escritorio en celulares */
  .products-desktop-bar {
    display: none !important;
  }
  .pb-table-wrap {
    display: none !important;
  }
  .pb-totals-summary-bar {
    display: none !important;
  }

  /* Mostrar barra móvil compacta */
  .products-mobile-bar {
    display: flex !important;
    flex-direction: column !important;
    gap: 7px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-bottom: 6px !important;
    padding: 0 2px !important;
  }

  .amb-pmob-head {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 2px 2px 4px 2px !important;
  }
  .amb-pmob-title {
    font-size: 16px !important;
    font-weight: 900 !important;
    color: #f8fafc !important;
    margin: 0 !important;
    letter-spacing: 0.5px !important;
  }
  .amb-pmob-sub {
    font-size: 10px !important;
    color: #94a3b8 !important;
    margin: 1px 0 0 !important;
  }
  .amb-pmob-count {
    background: #0c2540 !important;
    border: 1px solid #1e4570 !important;
    color: #38bdf8 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    padding: 3px 8px !important;
    border-radius: 12px !important;
    white-space: nowrap !important;
  }

  /* Buscador móvil compacto */
  .amb-pmob-search-row {
    display: flex !important;
    gap: 6px !important;
    align-items: center !important;
    width: 100% !important;
  }
  .amb-pmob-search-box {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    background: #091c30 !important;
    border: 1px solid #1e3a5f !important;
    border-radius: 8px !important;
    padding: 0 8px !important;
    height: 38px !important;
    min-width: 0 !important;
  }
  .amb-pmob-search-icon {
    font-size: 13px !important;
    color: #94a3b8 !important;
    margin-right: 6px !important;
    flex-shrink: 0 !important;
  }
  .amb-pmob-input {
    flex: 1 !important;
    border: none !important;
    background: transparent !important;
    color: #fff !important;
    font-size: 12.5px !important;
    outline: none !important;
    padding: 0 !important;
    min-width: 0 !important;
    height: 36px !important;
  }
  .amb-pmob-cam-btn {
    background: #0284c7 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 5px 8px !important;
    font-size: 13px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    line-height: 1 !important;
  }
  .amb-pmob-new-btn {
    background: #16a34a !important;
    color: #fff !important;
    font-weight: 800 !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 0 12px !important;
    height: 38px !important;
    font-size: 12px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
  }

  /* Pestañas Activos / Desactivados & Categoría */
  .amb-pmob-tabs-row {
    display: flex !important;
    gap: 6px !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
  }
  .amb-pmob-tabs {
    display: flex !important;
    gap: 3px !important;
    background: #061426 !important;
    padding: 2px !important;
    border-radius: 7px !important;
    border: 1px solid #1e3a5f !important;
    flex-shrink: 0 !important;
  }
  .amb-pmob-tab {
    border: none !important;
    background: transparent !important;
    color: #94a3b8 !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    padding: 4px 7px !important;
    border-radius: 5px !important;
    cursor: pointer !important;
    white-space: nowrap !important;
  }
  .amb-pmob-tab.active {
    background: #0284c7 !important;
    color: #fff !important;
    font-weight: 800 !important;
  }
  .amb-pmob-tab.danger.active {
    background: #ef4444 !important;
    color: #fff !important;
    font-weight: 800 !important;
  }
  .amb-pmob-select {
    flex: 1 !important;
    max-width: 140px !important;
    background: #091c30 !important;
    border: 1px solid #1e3a5f !important;
    color: #e2e8f0 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    border-radius: 7px !important;
    height: 30px !important;
    padding: 0 6px !important;
    outline: none !important;
  }

  /* Mini Chips KPIs en una sola fila (32px altura) */
  .amb-pmob-chips-row {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 5px !important;
    width: 100% !important;
  }
  .amb-pmob-chip {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 3px 2px !important;
    border-radius: 7px !important;
    border: 1px solid #1e3a5f !important;
    background: #081d33 !important;
    text-align: center !important;
    min-height: 32px !important;
  }
  .amb-pmob-chip.blue { border-color: #0369a1 !important; background: #08213b !important; }
  .amb-pmob-chip.green { border-color: #15803d !important; background: #07261a !important; }
  .amb-pmob-chip.orange { border-color: #b45309 !important; background: #291807 !important; }
  .amb-pmob-chip.red { border-color: #b91c1c !important; background: #2a0b0e !important; }

  .amb-pmob-chip-num {
    font-size: 13px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
  }
  .amb-pmob-chip.blue .amb-pmob-chip-num { color: #38bdf8 !important; }
  .amb-pmob-chip.green .amb-pmob-chip-num { color: #4ade80 !important; }
  .amb-pmob-chip.orange .amb-pmob-chip-num { color: #fbbf24 !important; }
  .amb-pmob-chip.red .amb-pmob-chip-num { color: #f87171 !important; }

  .amb-pmob-chip-lbl {
    font-size: 8.5px !important;
    color: #94a3b8 !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    margin-top: 1px !important;
  }

  /* Tarjetas móviles de producto */
  .products-mobile-cards {
    display: flex !important;
    flex-direction: column !important;
    gap: 7px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 0 2px !important;
  }
}



/* ==========================================================================
   BARRA SUPERIOR DE ACCIONES Y ESTADO EN VIVO ESTILO AKASIA - AMB POS
   ========================================================================== */
.amb-akasia-bar {
  display: none !important;
  background: #ffffff;
  border-bottom: 2px solid #cbd5e1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 14px;
  gap: 12px;
  overflow-x: auto;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  position: relative;
  z-index: 100;
}
[data-theme="dark"] .amb-akasia-bar {
  display: none !important;
  background: #0d1522;
  border-bottom: 2px solid #1e293b;
  box-shadow: 0 2px 6px rgba(0,0,0,0.3);
}
.ak-actions-group {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.ak-btn {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #f8fafc;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  padding: 6px 12px;
  min-width: 86px;
  min-height: 56px;
  cursor: pointer;
  transition: all 0.15s ease;
  color: #1e293b;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}
[data-theme="dark"] .ak-btn {
  background: #152238;
  border: 1px solid #283d5e;
  color: #f1f5f9;
}
.ak-btn:hover {
  background: #f1f5f9;
  border-color: #0284c7;
  transform: translateY(-1px);
  box-shadow: 0 3px 6px rgba(2,132,199,0.15);
}
[data-theme="dark"] .ak-btn:hover {
  background: #1b2d4b;
  border-color: #38bdf8;
  box-shadow: 0 3px 8px rgba(56,189,248,0.2);
}
.ak-btn .ak-icon {
  font-size: 20px;
  line-height: 1.2;
}
.ak-btn .ak-lbl {
  font-size: 10.5px;
  font-weight: 700;
  margin-top: 3px;
  white-space: nowrap;
}
.ak-status-group {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
}
.ak-status-items {
  display: flex;
  flex-direction: column;
  gap: 2.5px;
}
.ak-status-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  color: #1e293b;
}
[data-theme="dark"] .ak-status-item {
  color: #e2e8f0;
}
.ak-status-item .ak-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #10b981;
  color: #ffffff;
  font-size: 9.5px;
  font-weight: 900;
}
.ak-status-item.ak-warn .ak-check {
  background: #ef4444;
}
.ak-status-item.ak-muted .ak-check {
  background: #64748b;
}
.ak-brand-badge {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-left: 12px;
  border-left: 2px solid #cbd5e1;
}
[data-theme="dark"] .ak-brand-badge {
  border-left-color: #334155;
}
.ak-brand-badge img {
  width: 34px;
  height: 34px;
  border-radius: 7px;
  object-fit: cover;
}
.ak-brand-badge div {
  line-height: 1.25;
}
.ak-brand-badge strong {
  font-size: 13px;
  color: #0284c7;
  display: block;
}
[data-theme="dark"] .ak-brand-badge strong {
  color: #38bdf8;
}
.ak-brand-badge small {
  font-size: 9px;
  color: #64748b;
  font-weight: 700;
  letter-spacing: 0.5px;
}
@media (max-width: 900px) {
  .amb-akasia-bar {
  display: none !important;
    padding: 4px 8px;
    gap: 8px;
  }
  .ak-btn {
    min-width: 70px;
    min-height: 48px;
    padding: 4px 6px;
  }
  .ak-btn .ak-icon {
    font-size: 16px;
  }
  .ak-btn .ak-lbl {
    font-size: 9px;
  }
  .ak-brand-badge {
    display: none;
  }
}
