
:root{--yellow:#ffc400;--black:#11100e;--cream:#f7f2e8;--muted:#746d63;--red:#c9362b;--white:#fff;--line:#ded6c9}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,Arial,sans-serif;background:var(--cream);color:var(--black)}button,input,textarea,select{font:inherit}button{cursor:pointer}.hidden{display:none!important}.topbar{height:76px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;background:#11100ef2;color:#fff;position:sticky;top:0;z-index:30;backdrop-filter:blur(10px)}.brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:1000;letter-spacing:1px}.brand img{width:55px;height:55px;object-fit:contain}.topbar nav{display:flex;gap:28px}.topbar nav a{color:#fff;text-decoration:none;font-weight:800}.top-actions{display:flex;gap:10px}.ghost,.cartBtn,.dark,.danger{border:0;border-radius:12px;padding:11px 15px;font-weight:900}.ghost{background:#ffffff18;color:#fff}.cartBtn,.primary{background:var(--yellow);color:#111;border:0;border-radius:12px;padding:12px 18px;font-weight:1000}.hero{height:610px;position:relative;overflow:hidden;background:#111;color:#fff}.hero video{position:absolute;width:100%;height:100%;object-fit:cover;opacity:.45}.overlay{position:absolute;inset:0;background:linear-gradient(90deg,#000 5%,#000c 42%,transparent 75%)}.heroCopy{position:absolute;z-index:2;left:8vw;top:50%;transform:translateY(-50%);max-width:650px}.kicker,.eyebrow{font-weight:1000;letter-spacing:2px;color:var(--yellow);font-size:.82rem}.hero h1{font-size:clamp(3rem,6vw,6rem);line-height:.88;margin:18px 0}.hero h1 em{color:var(--yellow);font-style:normal}.hero p{font-size:1.2rem;max-width:520px;line-height:1.6}.heroBurger{position:absolute;right:4vw;bottom:-80px;width:min(48vw,700px);filter:drop-shadow(0 30px 25px #000)}.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:28px 8vw;background:#fff}.benefits article{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:1.8rem}.benefits b{font-size:1rem}.benefits span{font-size:.9rem;color:var(--muted);grid-column:2}.menuSection{padding:80px 7vw}.sectionHead{display:flex;align-items:end;justify-content:space-between;gap:20px}.sectionHead h2,.contact h2{font-size:clamp(2rem,4vw,4rem);margin:8px 0}.sectionHead input{padding:15px 18px;border:1px solid var(--line);border-radius:13px;min-width:280px}.categories{display:flex;gap:10px;flex-wrap:wrap;margin:28px 0}.categories button{border:1px solid var(--line);background:#fff;border-radius:100px;padding:10px 18px;font-weight:900}.categories button.active{background:#111;color:#fff}.productGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px}.productCard{background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 10px 35px #352b1b12;position:relative}.productImage{height:230px;background:linear-gradient(145deg,#f5ead8,#e5d5ba);display:grid;place-items:center;overflow:hidden}.productImage img{width:100%;height:100%;object-fit:contain}.noImage{color:#8a7f6f;font-weight:900}.productBody{padding:20px}.productBody small{color:var(--red);font-weight:1000}.productBody h3{font-size:1.35rem;margin:8px 0}.productBody p{color:var(--muted);min-height:45px}.productFoot{display:flex;justify-content:space-between;align-items:center}.productFoot strong{font-size:1.45rem}.productFoot button{background:#111;color:#fff;border:0;border-radius:10px;padding:10px 13px;font-weight:900}.featured{position:absolute;z-index:2;top:14px;left:14px;background:var(--yellow);padding:7px 10px;border-radius:8px;font-weight:1000}.notice{text-align:center;padding:30px;color:var(--muted)}.contact{margin:20px 7vw 70px;background:#111;color:#fff;border-radius:28px;padding:55px;display:flex;align-items:center;justify-content:space-between}.drawer{position:fixed;right:-460px;top:0;width:min(460px,100%);height:100%;z-index:60;background:#fff;box-shadow:-20px 0 60px #0003;padding:25px;overflow:auto;transition:.25s}.drawer.open{right:0}.drawerHead{display:flex;justify-content:space-between}.drawerHead button,.close{border:0;background:none;font-size:2rem}.cartItem{display:grid;grid-template-columns:65px 1fr auto;gap:12px;align-items:center;border-bottom:1px solid var(--line);padding:14px 0}.cartItem img{width:65px;height:60px;object-fit:contain;background:#eee;border-radius:8px}.qty{display:flex;align-items:center;gap:8px}.qty button{border:0;border-radius:7px;width:28px;height:28px}.totals{border-top:2px solid #111;margin-top:20px}.totals p{display:flex;justify-content:space-between}.grand{font-size:1.25rem}.drawer form,.loginCard form{display:grid;gap:11px}.drawer input,.drawer textarea,.drawer select,.loginCard input{padding:13px;border:1px solid var(--line);border-radius:10px}.modal{position:fixed;inset:0;background:#000b;z-index:80;display:grid;place-items:center;padding:20px}.modalCard{background:#fff;border-radius:22px;padding:30px;width:min(420px,100%);position:relative}.loginCard{text-align:center}.loginCard img{width:125px}.close{position:absolute;right:15px;top:10px}.adminShell{min-height:100vh;display:grid;grid-template-columns:240px 1fr;background:#f4f0e8}.sidebar{background:#111;color:#fff;padding:24px;display:flex;flex-direction:column;gap:8px;position:sticky;top:0;height:100vh}.sidebar img{width:140px;margin:0 auto 25px}.sidebar button{border:0;text-align:left;border-radius:10px;padding:12px;background:transparent;color:#fff;font-weight:900}.sidebar button.active{background:var(--yellow);color:#111}.adminContent{padding:40px;min-width:0}.adminTop{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.adminTop h1{font-size:2.8rem;margin:5px 0}.cloudStatus{background:#e4f7e9;color:#187033;border-radius:100px;padding:9px 14px;font-weight:900}.panel{background:#fff;padding:22px;border-radius:18px;box-shadow:0 8px 24px #0000000d;margin-bottom:25px}.formGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.formGrid label{display:grid;gap:6px;font-weight:900}.formGrid input,.formGrid textarea,.formGrid select,.inlineForm input{padding:12px;border:1px solid var(--line);border-radius:9px}.wide{grid-column:1/-1}.check{display:flex!important;align-items:center;gap:7px}.previewBox{height:120px;border:1px dashed var(--line);border-radius:10px;display:grid;place-items:center;overflow:hidden}.previewBox img{width:100%;height:100%;object-fit:contain}.actions{display:flex;gap:10px}.dark{background:#222;color:#fff}.danger{background:#a72118;color:#fff}.inlineForm{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.adminList{display:grid;gap:12px}.adminRow{background:#fff;border-radius:14px;padding:13px;display:grid;grid-template-columns:70px 1fr auto auto;align-items:center;gap:12px}.adminRow img{width:70px;height:60px;object-fit:contain;background:#eee;border-radius:9px}.adminRow small{display:block;color:var(--muted)}.adminRow button{border:0;border-radius:8px;padding:9px 12px;font-weight:900}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.metrics article{background:#fff;padding:25px;border-radius:18px}.metrics span{display:block;color:var(--muted)}.metrics b{font-size:2rem}.ordersGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:15px}.orderCard{background:#fff;border-radius:16px;padding:18px}.orderCard select{width:100%;padding:9px;border-radius:8px}.toast{position:fixed;left:50%;bottom:25px;transform:translateX(-50%) translateY(100px);background:#111;color:#fff;padding:13px 20px;border-radius:10px;z-index:100;transition:.2s}.toast.show{transform:translateX(-50%) translateY(0)}
@media(max-width:800px){.topbar nav{display:none}.hero{height:650px}.heroBurger{width:95vw;right:-20vw;opacity:.6}.benefits{grid-template-columns:1fr}.sectionHead{align-items:stretch;flex-direction:column}.sectionHead input{min-width:0;width:100%}.contact{padding:30px;flex-direction:column;align-items:flex-start}.adminShell{display:block}.sidebar{position:relative;height:auto;flex-direction:row;overflow:auto;width:100%}.sidebar img{width:70px;margin:0}.adminContent{padding:20px}.formGrid{grid-template-columns:1fr}.wide{grid-column:auto}.metrics{grid-template-columns:repeat(2,1fr)}.adminRow{grid-template-columns:60px 1fr}.adminRow button{grid-row:2}.cloudStatus{display:none}}

.adminToolbar,.toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:0 0 18px}
.adminToolbar input,.adminToolbar select,.toolbar select{padding:12px;border:1px solid var(--line);border-radius:10px;background:#fff}
.adminToolbar input{min-width:260px;flex:1}
#adminProductCount{font-weight:900;color:var(--muted)}
.adminRowActions{display:flex;gap:8px;flex-wrap:wrap}
.adminRowActions button{white-space:nowrap}
.success{background:#16783b!important;color:#fff!important}
.warning{background:#d99000!important;color:#111!important}
.dashboardGrid{display:grid;grid-template-columns:2fr 1fr;gap:18px;margin-top:18px}
.panelTitle{display:flex;align-items:center;justify-content:space-between;gap:10px}
.miniOrder,.miniProduct{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.miniOrder:last-child,.miniProduct:last-child{border-bottom:0}
.statusBadge{display:inline-block;border-radius:999px;padding:5px 9px;font-size:.78rem;font-weight:900}
.status-pending{background:#fff0bd;color:#785900}
.status-confirmed{background:#dceeff;color:#0b4d86}
.status-preparing{background:#ffe1bf;color:#914900}
.status-ready{background:#dff7e5;color:#176a31}
.status-delivered{background:#e6e6e6;color:#333}
.status-cancelled{background:#ffe0df;color:#8f1e16}
.emptySmall{color:var(--muted);padding:12px 0}
@media(max-width:900px){.dashboardGrid{grid-template-columns:1fr}.adminRow{grid-template-columns:60px 1fr}.adminRowActions{grid-column:1/-1}}

.kitchenToolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px}
.kitchenToolbar h2{margin:0 0 4px;font-size:1.8rem}.kitchenToolbar p{margin:0;color:var(--muted)}
.kitchenActions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.kitchenBoard{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.kitchenColumn{background:#eee8de;border-radius:18px;padding:12px;min-height:520px}
.kitchenColumn>header{display:flex;align-items:center;gap:9px;padding:6px 5px 14px}
.kitchenColumn>header h3{margin:0;flex:1}.kitchenColumn>header b{background:#111;color:#fff;border-radius:999px;min-width:30px;height:30px;display:grid;place-items:center}
.statusDot{width:13px;height:13px;border-radius:50%}.pendingDot{background:#d99a00}.preparingDot{background:#e56819}.readyDot{background:#16843d}
.kitchenCards{display:grid;gap:12px}
.kitchenCard{background:#fff;border-radius:15px;padding:14px;box-shadow:0 8px 22px rgba(30,20,8,.08);border:2px solid transparent}
.kitchenCard.isLate{border-color:#c62828}
.kitchenCardHead{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.kitchenCardHead h3{font-size:1.35rem;margin:0}.kitchenTimer{font-weight:950;border-radius:8px;padding:6px 8px;background:#f2ede4}
.kitchenCustomer{font-weight:800;margin:8px 0 4px}.kitchenMeta{font-size:.86rem;color:var(--muted);margin:0 0 10px}
.kitchenItems{list-style:none;padding:0;margin:0 0 12px;display:grid;gap:7px}
.kitchenItems li{background:#f7f4ee;border-radius:9px;padding:9px;font-weight:800}
.kitchenNotes{border-left:4px solid var(--gold);padding:8px 10px;background:#fff7d9;border-radius:5px;margin:9px 0}
.kitchenCardActions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.kitchenCardActions button:only-child{grid-column:1/-1}
.kitchenEmpty{padding:35px 12px;text-align:center;color:var(--muted);font-weight:800}
.kitchenBoard:fullscreen{background:#161412;padding:18px;overflow:auto}
.kitchenBoard:fullscreen .kitchenColumn{min-height:calc(100vh - 36px)}
@media(max-width:1100px){.kitchenBoard{grid-template-columns:1fr}.kitchenColumn{min-height:200px}}
@media(max-width:700px){.kitchenToolbar{align-items:flex-start;flex-direction:column}.kitchenActions{width:100%}.kitchenActions button{flex:1}}

/* POS / CAJA */
.posHeader{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:18px}
.posHeader h2{margin:0 0 5px;font-size:1.8rem}.posHeader p{margin:0;color:var(--muted)}
.posHeaderStats{background:#111;color:#fff;padding:12px 18px;border-radius:14px;min-width:170px;text-align:right}
.posHeaderStats span{display:block;font-size:.8rem;opacity:.7}.posHeaderStats strong{font-size:1.45rem;color:var(--gold)}
.posLayout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(340px,.8fr);gap:18px;align-items:start}
.posCatalog{min-height:690px}.posCatalogTop{display:grid;grid-template-columns:1fr 220px;gap:10px;margin-bottom:15px}
.posProductGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.posProduct{border:1px solid #e7dfd2;border-radius:14px;background:#fff;padding:0;overflow:hidden;text-align:left;cursor:pointer;transition:.16s transform,.16s box-shadow}
.posProduct:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(20,15,8,.11)}
.posProduct img,.posProductNoImage{width:100%;height:120px;object-fit:cover;background:#eee8de;display:grid;place-items:center;color:#81786b;font-weight:800}
.posProductInfo{padding:11px}.posProductInfo small{display:block;color:var(--muted);margin-bottom:4px}
.posProductInfo b{display:block;min-height:38px}.posProductInfo strong{display:block;margin-top:8px;font-size:1.15rem}
.posTicket{position:sticky;top:18px}.posTicketTitle{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px dashed #d8cfbf;padding-bottom:12px}
.posTicketTitle h3{margin:3px 0 0;font-size:1.5rem}.posClearBtn{padding:8px 10px}
.posCart{display:grid;gap:9px;max-height:300px;overflow:auto;padding:12px 0}
.posCartRow{display:grid;grid-template-columns:1fr auto;gap:8px;border-bottom:1px solid #eee8df;padding-bottom:9px}
.posCartRowMain b{display:block}.posCartRowMain small{color:var(--muted)}
.posQty{display:flex;align-items:center;gap:6px;margin-top:6px}.posQty button{width:29px;height:29px;padding:0;border-radius:8px}
.posCartPrice{text-align:right;font-weight:900}.posRemove{border:0;background:transparent;color:#b22222;padding:2px;display:block;margin-left:auto}
.posEmpty{text-align:center;color:var(--muted);padding:36px 8px;font-weight:800}
.posTotals{border-top:2px solid #111;border-bottom:2px solid #111;padding:11px 0;margin-bottom:14px;display:grid;gap:7px}
.posTotals div{display:flex;justify-content:space-between}.posTotals strong{font-size:1.55rem}
.posForm{display:grid;grid-template-columns:1fr 1fr;gap:10px}.posForm label{font-weight:800;font-size:.84rem}.posForm input,.posForm select,.posForm textarea{margin-top:5px;width:100%}
.posForm .wide{grid-column:1/-1}.posChange{border-radius:10px;background:#f1ede6;padding:10px;display:flex;justify-content:space-between;align-items:end}.posChange span{font-size:.8rem}.posChange strong{font-size:1.2rem}
.posChargeBtn{width:100%;font-size:1.08rem;padding:15px;margin-top:14px}
.receiptModalCard{max-width:480px}.receiptPaper{background:#fff;padding:22px;color:#111;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.receiptPaper h2,.receiptPaper p{text-align:center;margin:4px 0}.receiptLine{border-top:1px dashed #222;margin:12px 0}
.receiptItem{display:grid;grid-template-columns:1fr auto;gap:10px;margin:7px 0}.receiptSummary div{display:flex;justify-content:space-between;margin:5px 0}
.receiptSummary .receiptGrand{font-size:1.18rem;font-weight:900;border-top:1px dashed #222;padding-top:8px}
.receiptActions{display:flex;gap:8px;margin-top:12px}.receiptActions button{flex:1}
@media(max-width:1200px){.posProductGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.posLayout{grid-template-columns:1fr}.posTicket{position:static}.posProductGrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.posHeader{align-items:flex-start;flex-direction:column}.posHeaderStats{width:100%;text-align:left}.posCatalogTop{grid-template-columns:1fr}.posProductGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.posForm{grid-template-columns:1fr}.posForm .wide{grid-column:auto}}
@media print{
 body *{visibility:hidden!important}
 #receiptContent,#receiptContent *{visibility:visible!important}
 #receiptContent{position:absolute;left:0;top:0;width:80mm;padding:5mm}
}

/* INVENTARIO */
.inventoryHeader{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:16px}
.inventoryHeader h2{font-size:1.8rem;margin:0 0 5px}.inventoryHeader p{margin:0;color:var(--muted)}
.inventorySummary{display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));gap:9px}
.inventorySummary div{background:#111;color:#fff;border-radius:13px;padding:10px 13px}
.inventorySummary span{display:block;font-size:.76rem;opacity:.72}.inventorySummary strong{display:block;color:var(--gold);font-size:1.25rem;margin-top:3px}
.inventoryTabs{display:flex;gap:8px;margin-bottom:15px;flex-wrap:wrap}
.inventoryTabs button{background:#e8e1d7}.inventoryTabs button.active{background:var(--gold);color:#111}
.inventoryGrid{display:grid;grid-template-columns:minmax(300px,.72fr) minmax(0,1.4fr);gap:16px;align-items:start}
.inventoryListPanel{min-height:520px}.panelToolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}
.panelToolbar h3{margin:0 0 3px}.panelToolbar small{color:var(--muted)}.panelToolbar input,.panelToolbar select{max-width:260px}
.ingredientList,.movementList,.recipeList{display:grid;gap:9px}
.ingredientRow{display:grid;grid-template-columns:minmax(0,1.3fr) .7fr .7fr auto;align-items:center;gap:10px;border:1px solid #e6ddd0;border-radius:12px;padding:11px;background:#fff}
.ingredientRow.lowStock{border-color:#d24737;background:#fff5f2}
.ingredientName b{display:block}.ingredientName small{color:var(--muted)}
.stockBadge{font-weight:900}.stockBadge.low{color:#b42318}.ingredientValue{text-align:right}
.rowActions{display:flex;gap:5px;flex-wrap:wrap}.rowActions button{padding:7px 9px;font-size:.78rem}
.movementRow{display:grid;grid-template-columns:1fr auto;gap:8px;padding:11px;border-bottom:1px solid #eee4d8}
.movementRow h4{margin:0 0 3px}.movementRow p{margin:0;color:var(--muted);font-size:.84rem}
.movementAmount{text-align:right;font-weight:900}.movementAmount.in{color:#147a38}.movementAmount.out{color:#b42318}
.recipeCard{border:1px solid #e6ddd0;border-radius:12px;background:#fff;overflow:hidden}
.recipeCardHead{display:flex;justify-content:space-between;align-items:center;padding:11px 13px;background:#f4efe7}
.recipeCardHead h4{margin:0}.recipeItems{padding:8px 13px}
.recipeItem{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid #eee8df}
.recipeItem:last-child{border-bottom:0}.recipeCost{color:var(--muted);font-size:.84rem}
.helperText{background:#fff7d9;padding:10px;border-radius:9px;color:#6f5510}
.inventoryEmpty{text-align:center;color:var(--muted);padding:35px 10px;font-weight:800}
@media(max-width:1050px){.inventoryHeader{align-items:flex-start;flex-direction:column}.inventorySummary{width:100%}.inventoryGrid{grid-template-columns:1fr}}
@media(max-width:650px){.inventorySummary{grid-template-columns:1fr}.panelToolbar{align-items:flex-start;flex-direction:column}.panelToolbar input,.panelToolbar select{max-width:none;width:100%}.ingredientRow{grid-template-columns:1fr 1fr}.rowActions{grid-column:1/-1}.ingredientValue{text-align:left}}


/* =========================================================
   MORDISCO OS V6 — REDISEÑO PROFESIONAL Y CORRECCIÓN DE CACHÉ
   ========================================================= */
:root{
  --gold:#ffc400;
  --yellow:#ffc400;
  --black:#11100e;
  --cream:#f5f1e9;
  --surface:#ffffff;
  --surface-soft:#f0ebe2;
  --muted:#736b60;
  --red:#c9362b;
  --green:#16783b;
  --line:#e3dbcf;
  --shadow:0 14px 38px rgba(35,28,18,.08);
  --shadow-soft:0 6px 20px rgba(35,28,18,.06);
  --radius:18px;
}
body{background:linear-gradient(135deg,#f7f3ec 0%,#f1ece3 100%);min-height:100vh}
button{transition:transform .15s ease,box-shadow .15s ease,filter .15s ease}
button:hover{filter:brightness(.98)}
button:active{transform:scale(.98)}
input,select,textarea{outline:none;transition:border-color .15s ease,box-shadow .15s ease}
input:focus,select:focus,textarea:focus{border-color:var(--gold)!important;box-shadow:0 0 0 3px rgba(255,196,0,.18)}

.adminShell{grid-template-columns:232px minmax(0,1fr);background:transparent}
.sidebar{
  background:linear-gradient(180deg,#111 0%,#171512 100%);
  padding:22px 14px;
  gap:6px;
  box-shadow:10px 0 35px rgba(0,0,0,.08);
  z-index:5;
}
.sidebar img{width:128px;margin:0 auto 28px;filter:drop-shadow(0 8px 14px rgba(255,196,0,.12))}
.sidebar button{
  display:flex;
  align-items:center;
  gap:11px;
  min-height:46px;
  padding:11px 13px;
  border:1px solid transparent;
  border-radius:13px;
  font-size:.94rem;
}
.sidebar button span{display:inline-grid;place-items:center;width:22px;font-size:1rem}
.sidebar button:hover{background:#ffffff0e;border-color:#ffffff12}
.sidebar button.active{
  background:linear-gradient(135deg,#ffd21f,#ffbc00);
  box-shadow:0 9px 22px rgba(255,196,0,.22);
  color:#111;
}
#logoutBtn{margin-top:auto;color:#ffd9d5!important}
#backToStore{border:1px solid #ffffff18!important}

.adminContent{padding:28px clamp(20px,3vw,44px) 50px;max-width:1720px;width:100%;margin:auto}
.adminTop{margin-bottom:24px;padding-bottom:18px;border-bottom:1px solid rgba(85,71,50,.1)}
.adminTop h1{font-size:clamp(2.15rem,3vw,3.15rem);letter-spacing:-1.5px}
.cloudStatus{background:#e8f8ec;border:1px solid #ccebd4;box-shadow:var(--shadow-soft)}

.panel{
  border:1px solid rgba(110,91,61,.09);
  border-radius:20px;
  box-shadow:var(--shadow);
  padding:22px;
}
.primary{box-shadow:0 8px 18px rgba(255,196,0,.18)}
.dark{background:linear-gradient(135deg,#252525,#151515)}
.danger{background:linear-gradient(135deg,#c43b30,#96241c)}
.success{background:linear-gradient(135deg,#218f4a,#126a34)!important}

.metrics{gap:14px}
.metrics article{
  position:relative;
  overflow:hidden;
  min-height:124px;
  border:1px solid rgba(98,79,48,.08);
  box-shadow:var(--shadow-soft);
}
.metrics article:after{
  content:"";
  position:absolute;
  right:-25px;
  top:-30px;
  width:95px;
  height:95px;
  border-radius:50%;
  background:rgba(255,196,0,.10);
}
.metrics span{font-size:.86rem;font-weight:700}
.metrics b{display:block;margin-top:8px;letter-spacing:-1px}

.inventoryHeader{
  background:linear-gradient(135deg,#171512 0%,#24201a 100%);
  color:#fff;
  padding:22px;
  border-radius:22px;
  box-shadow:var(--shadow);
  margin-bottom:16px;
}
.inventoryHeader p{color:#cfc7bb}
.inventorySummary{min-width:min(100%,520px)}
.inventorySummary div{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.11);
  backdrop-filter:blur(8px);
  min-height:76px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.inventorySummary strong{color:var(--gold)!important;font-size:1.35rem}

.inventoryTabs{
  background:#e9e3d9;
  width:max-content;
  max-width:100%;
  padding:5px;
  border-radius:14px;
  gap:4px;
}
.inventoryTabs button{
  border:0;
  border-radius:10px;
  padding:10px 15px;
  font-weight:850;
  background:transparent;
}
.inventoryTabs button.active{
  background:#fff;
  color:#111;
  box-shadow:0 5px 14px rgba(27,21,13,.09);
}

.inventoryGrid{grid-template-columns:minmax(330px,.78fr) minmax(480px,1.35fr);gap:18px}
#ingredientForm,#movementForm,#recipeForm{
  position:sticky;
  top:18px;
  border-top:5px solid var(--gold);
}
.formGrid h3{font-size:1.35rem;margin:0 0 4px}
.formGrid label{font-size:.83rem;color:#2e2923}
.formGrid input,.formGrid textarea,.formGrid select,.inlineForm input{
  background:#fcfbf8;
  border:1px solid #ded5c8;
  min-height:44px;
}
.formActions{display:flex;gap:8px;flex-wrap:wrap}
.inventoryListPanel{background:rgba(255,255,255,.9)}
.panelToolbar{padding-bottom:13px;border-bottom:1px solid #eee6da}
.panelToolbar h3{font-size:1.25rem}

.ingredientRow{
  border:1px solid #e7dfd3;
  box-shadow:0 3px 10px rgba(31,24,15,.03);
  transition:transform .14s ease,box-shadow .14s ease;
}
.ingredientRow:hover{transform:translateY(-1px);box-shadow:var(--shadow-soft)}
.ingredientRow.lowStock{
  border-left:5px solid #d24737;
  background:linear-gradient(90deg,#fff2ef,#fff 35%);
}
.stockBadge{font-size:1.04rem}
.rowActions button{border:0;border-radius:9px}

.movementRow{border-radius:10px;border-bottom:0;background:#faf8f4}
.recipeCard{box-shadow:0 5px 15px rgba(28,21,12,.04)}
.recipeCardHead{background:linear-gradient(90deg,#f4efe7,#faf8f4)}

.posHeader,.kitchenToolbar{background:#fff;padding:18px 20px;border-radius:20px;box-shadow:var(--shadow-soft)}
.posCatalog,.posTicket,.kitchenColumn{border:1px solid rgba(90,72,46,.08)}
.posProduct{box-shadow:0 5px 15px rgba(31,24,14,.04)}
.kitchenColumn{background:#ebe5dc}
.kitchenCard{border-radius:16px}

.adminRow{border:1px solid rgba(100,80,50,.08);box-shadow:var(--shadow-soft)}
.orderCard{border:1px solid rgba(100,80,50,.08);box-shadow:var(--shadow-soft)}
.statusBadge{border:1px solid rgba(0,0,0,.04)}

@media(max-width:1050px){
  .inventoryGrid{grid-template-columns:1fr}
  #ingredientForm,#movementForm,#recipeForm{position:static}
}
@media(max-width:800px){
  .adminShell{display:block}
  .sidebar{
    height:auto;
    position:sticky;
    top:0;
    padding:8px;
    align-items:center;
    z-index:50;
  }
  .sidebar img{width:58px;height:48px;margin:0 5px 0 0;flex:none}
  .sidebar button{min-width:max-content;min-height:40px;padding:8px 11px}
  #logoutBtn{margin-top:0}
  .adminContent{padding:20px 14px 40px}
}
@media(max-width:600px){
  .inventoryHeader{padding:18px}
  .inventorySummary{grid-template-columns:1fr}
  .inventoryTabs{width:100%}
  .inventoryTabs button{flex:1}
  .metrics{grid-template-columns:1fr 1fr}
}

/* PERSONAL */
.staffHeader{
  display:flex;justify-content:space-between;align-items:center;gap:18px;
  background:linear-gradient(135deg,#171512,#2a241b);
  color:#fff;padding:22px;border-radius:22px;box-shadow:var(--shadow);margin-bottom:17px
}
.staffHeader h2{margin:0 0 5px;font-size:1.8rem}.staffHeader p{margin:0;color:#cfc7bb}
.staffStats{display:grid;grid-template-columns:repeat(3,minmax(105px,1fr));gap:8px}
.staffStats div{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.11);border-radius:13px;padding:10px 13px}
.staffStats span{display:block;font-size:.76rem;opacity:.72}.staffStats strong{display:block;color:var(--gold);font-size:1.3rem}
.staffLayout{display:grid;grid-template-columns:minmax(320px,.72fr) minmax(0,1.35fr);gap:18px;align-items:start}
.staffForm{position:sticky;top:18px;border-top:5px solid var(--gold)}
.staffListPanel{min-height:520px}.staffFilters{display:flex;gap:8px}.staffFilters input{min-width:210px}
.staffList{display:grid;gap:10px}
.staffCard{
  display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:14px;align-items:center;
  padding:14px;border:1px solid #e6ddd0;border-radius:14px;background:#fff;
  box-shadow:0 4px 14px rgba(28,21,12,.04)
}
.staffIdentity{display:flex;align-items:center;gap:12px}
.staffAvatar{width:46px;height:46px;border-radius:13px;background:#f2ede4;display:grid;place-items:center;font-size:1.35rem}
.staffIdentity h4{margin:0 0 3px}.staffIdentity p{margin:0;color:var(--muted);font-size:.84rem}
.staffRoleBadge{padding:7px 10px;border-radius:999px;font-weight:900;font-size:.8rem;background:#f0ebe2}
.staffRoleBadge.waiter{background:#e9f0ff;color:#2351a3}.staffRoleBadge.cashier{background:#e8f7ed;color:#176b39}.staffRoleBadge.kitchen{background:#fff0dd;color:#a55500}
.staffInactive{opacity:.58}.staffActions{display:flex;gap:6px}
.staffActions button{padding:8px 10px;font-size:.8rem}
@media(max-width:1000px){.staffLayout{grid-template-columns:1fr}.staffForm{position:static}}
@media(max-width:700px){.staffHeader{align-items:flex-start;flex-direction:column}.staffStats{width:100%;grid-template-columns:1fr}.staffFilters{width:100%;flex-direction:column}.staffFilters input{min-width:0}.staffCard{grid-template-columns:1fr}.staffActions{grid-column:1/-1}}

/* V9 — ACCESO PERSONAL, MESAS Y COMANDAS */
.employeeAccessBtn{background:#fff1;border:1px solid #fff3;color:#fff;border-radius:11px;padding:10px 13px;font-weight:900}
.employeeLoginCard{max-width:430px;text-align:center}.employeeLoginLogo img{width:105px;height:90px;object-fit:contain}
.employeeLoginCard label{display:block;text-align:left;font-weight:850;margin:12px 0}.employeeLoginCard input,.employeeLoginCard select{width:100%;margin-top:5px}
.full{width:100%}
.tablesHeader{display:flex;justify-content:space-between;align-items:center;gap:18px;background:linear-gradient(135deg,#171512,#2b241b);color:#fff;padding:22px;border-radius:22px;box-shadow:var(--shadow);margin-bottom:16px}
.tablesHeader h2{margin:0 0 5px}.tablesHeader p{margin:0;color:#cec5b7}
.tablesStats{display:grid;grid-template-columns:repeat(3,minmax(100px,1fr));gap:8px}.tablesStats div{background:#fff1;border:1px solid #fff2;border-radius:13px;padding:10px 13px}.tablesStats span{display:block;font-size:.76rem;opacity:.7}.tablesStats strong{color:var(--gold);font-size:1.3rem}
.tablesToolbar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:15px}.tablesToolbar .inlineForm{display:flex;gap:8px}.tablesToolbar input{max-width:180px}
.tableLegend{display:flex;gap:12px;flex-wrap:wrap;font-size:.82rem;font-weight:800}.tableLegend span{display:flex;align-items:center;gap:5px}.tableLegend i{width:11px;height:11px;border-radius:50%}.tableLegend .free{background:#23a354}.tableLegend .occupied{background:#d9a400}.tableLegend .preparing{background:#e56a1b}.tableLegend .payment{background:#c9362b}
.tablesGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.tableCard{border:0;border-radius:18px;padding:18px;text-align:left;min-height:150px;box-shadow:var(--shadow-soft);position:relative;overflow:hidden}.tableCard:after{content:"";position:absolute;right:-25px;bottom:-25px;width:90px;height:90px;border-radius:50%;background:#fff4}
.tableCard.free{background:#eaf8ef}.tableCard.occupied{background:#fff5d7}.tableCard.preparing{background:#ffeadc}.tableCard.payment{background:#ffe4e1}.tableCard h3{font-size:1.35rem;margin:0 0 5px}.tableCard p{margin:0;color:#665d51}.tableCard strong{display:block;margin-top:17px}.tableCard .tableMeta{font-size:.78rem;margin-top:7px}
.tableOrderCard{width:min(1250px,96vw);max-width:none}.tableOrderHead{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.tableOrderHead h2{margin:3px 0}.tableOrderLayout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,.75fr);gap:16px}.tableTicket{background:#f5f1e9;border-radius:16px;padding:15px}.tableTicket label{display:block;font-weight:850;font-size:.83rem;margin-top:10px}.tableTicket input,.tableTicket textarea{width:100%;margin-top:5px}.tableTicket button{margin-top:8px}
.roleRestricted{display:none!important}
@media(max-width:1050px){.tablesGrid{grid-template-columns:repeat(3,minmax(0,1fr))}.tableOrderLayout{grid-template-columns:1fr}.tablesHeader{align-items:flex-start;flex-direction:column}.tablesStats{width:100%}}
@media(max-width:700px){.tablesGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.tablesToolbar{align-items:flex-start;flex-direction:column}.tablesToolbar .inlineForm{width:100%;flex-direction:column}.tablesToolbar input{max-width:none}.tablesStats{grid-template-columns:1fr}.tableOrderCard{width:100%;height:100%;max-height:100%;border-radius:0}}

/* V10 — IDENTIFICACIÓN DE CAJERO */
.posHeaderStats b{display:block;color:#fff;margin:2px 0 9px;font-size:.95rem}
.orderStaff{margin:5px 0;color:var(--muted);font-size:.84rem}
.clientAppLink{display:inline-flex;align-items:center;gap:6px;background:#ffc400;color:#111;text-decoration:none;font-weight:900;padding:10px 13px;border-radius:11px}

/* V11 — TURNOS Y COMANDAS */
.shiftToolbar{display:flex;gap:10px;margin-bottom:15px;flex-wrap:wrap}
.currentShiftCard{margin-bottom:15px}
.currentShiftCard.active{border-left:6px solid #23a354;background:#effaf3}
.currentShiftCard.closed{border-left:6px solid #999}
.shiftSummaryGrid{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:10px;margin-top:12px}
.shiftSummaryGrid div{background:#fff;border-radius:12px;padding:12px;border:1px solid #e7e0d5}
.shiftSummaryGrid span{display:block;color:var(--muted);font-size:.78rem}
.shiftSummaryGrid strong{font-size:1.1rem}
.dataTable{width:100%;border-collapse:collapse}.dataTable th,.dataTable td{padding:11px;border-bottom:1px solid #ece5da;text-align:left;font-size:.88rem}.dataTable th{font-size:.76rem;text-transform:uppercase;color:var(--muted)}
.tableWrap{overflow:auto}
@media(max-width:700px){.shiftSummaryGrid{grid-template-columns:repeat(2,1fr)}}

/* V12 — PLATAFORMA COMPLETA */
.publicFooter{background:#11100e;color:#a9a197;padding:22px 4vw;display:flex;justify-content:space-between;align-items:center}
.privateAccess{display:flex;gap:10px;align-items:center;opacity:.28;transition:.2s}.privateAccess:hover{opacity:.9}
.privateAccess a,.privateAccess button{font-size:.7rem;color:#fff;background:transparent;border:0;text-decoration:none;cursor:pointer;padding:5px}
.publicLinkButton{text-decoration:none;display:inline-flex;align-items:center}
.promoHomeSection{padding:70px 5vw;background:#f3eee6}
.promotionGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.promotionCard{background:#171512;color:#fff;border-radius:22px;overflow:hidden;position:relative;min-height:280px;display:flex;flex-direction:column}
.promotionCard img{width:100%;height:165px;object-fit:cover}.promotionCardBody{padding:18px;flex:1}.promotionCard h3{margin:7px 0;font-size:1.35rem}
.promotionCard p{color:#d6cfc5}.promotionBadge{display:inline-block;background:#ffc400;color:#111;padding:5px 9px;border-radius:999px;font-size:.72rem;font-weight:900}
.promotionCard a{color:#ffc400;font-weight:900;text-decoration:none}.promotionPrice{font-size:1.35rem;color:#ffc400}
.financeGrid,.customersGrid{grid-template-columns:minmax(320px,.75fr) minmax(500px,1.25fr)}
.customerAdminList{display:grid;gap:10px;max-height:720px;overflow:auto}
.customerCardAdmin{border:1px solid #e6ded2;border-radius:14px;padding:14px;display:grid;grid-template-columns:1fr auto;gap:8px}
.customerCardAdmin small{display:block;color:var(--muted);margin-top:4px}.customerTag{display:inline-block;padding:4px 8px;border-radius:999px;background:#f2eadc;font-size:.7rem;font-weight:800}
.pagePublicHero{min-height:430px;background:#171512;color:#fff;display:grid;place-items:center;text-align:center;padding:70px 8vw;background-size:cover;background-position:center;position:relative}
.pagePublicHero:before{content:"";position:absolute;inset:0;background:#0009}.pagePublicHero>div{position:relative;max-width:800px}.pagePublicHero h1{font-size:clamp(2.4rem,6vw,5rem);margin:0 0 18px}.pageContent{max-width:900px;margin:auto;padding:60px 24px;line-height:1.8;white-space:pre-wrap}
@media(max-width:900px){.promotionGrid{grid-template-columns:1fr 1fr}.financeGrid,.customersGrid{grid-template-columns:1fr}}
@media(max-width:600px){.promotionGrid{grid-template-columns:1fr}.privateAccess{opacity:.18}}

/* V13.2 — CORRECCIÓN FINAL DEL MENÚ LATERAL */
:root{
  --sidebar-width:232px;
}

.adminShell,
.dashboardShell,
.appShell{
  min-height:100vh;
}

.sidebar{
  position:fixed !important;
  top:0;
  left:0;
  bottom:0;
  width:var(--sidebar-width) !important;
  height:100vh !important;
  min-height:100vh !important;
  background:#11100f !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  z-index:1000;
}

.sidebar .brand,
.sidebarBrand{
  flex:0 0 auto;
}

.sidebar nav,
.sidebarMenu{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-bottom:14px !important;
  scrollbar-width:thin;
  scrollbar-color:#4a453f transparent;
}

.sidebar nav::-webkit-scrollbar,
.sidebarMenu::-webkit-scrollbar{
  width:5px;
}
.sidebar nav::-webkit-scrollbar-thumb,
.sidebarMenu::-webkit-scrollbar-thumb{
  background:#4a453f;
  border-radius:999px;
}

.sidebarFooter,
.sidebar .sidebarBottom{
  flex:0 0 auto !important;
  margin-top:auto !important;
  position:relative !important;
  bottom:auto !important;
  left:auto !important;
  right:auto !important;
  width:100% !important;
  background:#11100f !important;
  border-top:1px solid rgba(255,255,255,.08);
  padding:10px 14px 14px !important;
}

.sidebarFooter button,
.sidebarFooter a,
.sidebar .sidebarBottom button,
.sidebar .sidebarBottom a,
#logoutBtn{
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  justify-content:flex-start !important;
  padding:12px 14px !important;
  border-radius:11px !important;
  color:#ffd7d2 !important;
  background:rgba(255,255,255,.04) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  font-weight:800 !important;
  cursor:pointer;
}

.sidebarFooter button:hover,
.sidebarFooter a:hover,
#logoutBtn:hover{
  background:rgba(198,54,43,.18) !important;
  color:#fff !important;
}

.adminMain,
.mainContent,
.dashboardMain{
  margin-left:var(--sidebar-width) !important;
  min-height:100vh;
}

@media(max-width:850px){
  .sidebar{
    width:220px !important;
    transform:translateX(-100%);
    transition:transform .22s ease;
  }
  .sidebar.open{
    transform:translateX(0);
  }
  .adminMain,
  .mainContent,
  .dashboardMain{
    margin-left:0 !important;
  }
}

@media(max-height:760px){
  .sidebar nav button,
  .sidebarMenu button{
    padding-top:9px !important;
    padding-bottom:9px !important;
  }
}

/* V13.3 — ACCESO ADMINISTRATIVO FINAL */
.adminLoginVisible{
  display:grid !important;
  position:fixed;
  inset:0;
  z-index:5000;
  background:
    radial-gradient(circle at 20% 10%,rgba(255,196,0,.13),transparent 35%),
    rgba(10,9,8,.94);
  place-items:center;
  padding:20px;
}
.adminLoginVisible.hidden{
  display:none !important;
}
.adminLoginVisible .loginCard{
  width:min(430px,100%);
  border-radius:24px;
  padding:30px;
  box-shadow:0 30px 90px rgba(0,0,0,.55);
}
.adminLoginVisible .loginCard>img{
  width:105px;
  height:85px;
  object-fit:contain;
}
.adminLoginVisible .loginCard h2{
  margin:8px 0;
  font-size:1.8rem;
}
.adminLoginVisible .loginCard form{
  display:grid;
  gap:10px;
  margin-top:18px;
}
.adminLoginVisible .loginCard input{
  width:100%;
  padding:14px;
  border:1px solid #ddd3c6;
  border-radius:11px;
  font-size:1rem;
}

/* V13.4 — PANEL ADMINISTRATIVO FINAL, ADAPTADO A LA ESTRUCTURA REAL */
#adminView.adminShell{
  display:block !important;
  min-height:100vh !important;
  background:#f4f0e8 !important;
}

#adminView.hidden{
  display:none !important;
}

#adminView .sidebar{
  position:fixed !important;
  inset:0 auto 0 0 !important;
  width:240px !important;
  height:100vh !important;
  min-height:100vh !important;
  padding:20px 14px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  gap:6px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  background:#11100f !important;
  z-index:1000 !important;
  scrollbar-width:thin;
  scrollbar-color:#4b463f transparent;
}

#adminView .sidebar::-webkit-scrollbar{
  width:5px;
}
#adminView .sidebar::-webkit-scrollbar-thumb{
  background:#4b463f;
  border-radius:99px;
}

#adminView .sidebar img{
  flex:0 0 auto !important;
  display:block !important;
  width:115px !important;
  height:82px !important;
  object-fit:contain !important;
  margin:0 auto 14px !important;
}

#adminView .sidebar button{
  flex:0 0 auto !important;
  width:100% !important;
  min-height:43px !important;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  padding:10px 13px !important;
  margin:0 !important;
  border-radius:11px !important;
  white-space:nowrap !important;
  font-size:.92rem !important;
  line-height:1.15 !important;
}

#adminView .sidebar button span{
  flex:0 0 22px !important;
}

#adminView .sidebar #logoutBtn{
  margin-top:14px !important;
  background:rgba(201,54,43,.12) !important;
  color:#ffd8d2 !important;
  border:1px solid rgba(201,54,43,.2) !important;
}

#adminView .sidebar #backToStore{
  margin-bottom:8px !important;
  border:1px solid rgba(255,255,255,.12) !important;
}

#adminView .adminContent{
  display:block !important;
  margin-left:240px !important;
  width:calc(100% - 240px) !important;
  min-width:0 !important;
  min-height:100vh !important;
  padding:34px 38px 60px !important;
  background:#f4f0e8 !important;
}

#adminView .adminTop{
  display:flex !important;
}

#adminView .tab:not(.hidden){
  display:block !important;
}

#adminView .tab.hidden{
  display:none !important;
}

@media(max-width:900px){
  #adminView .sidebar{
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    flex-direction:row !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    padding:10px !important;
  }

  #adminView .sidebar img{
    width:58px !important;
    height:45px !important;
    margin:0 5px 0 0 !important;
  }

  #adminView .sidebar button{
    width:auto !important;
    min-width:max-content !important;
    min-height:42px !important;
  }

  #adminView .sidebar #logoutBtn{
    margin-top:0 !important;
  }

  #adminView .adminContent{
    margin-left:0 !important;
    width:100% !important;
    padding:20px !important;
  }
}

/* V13.5 — ACCESO POR ROL Y ELIMINACIÓN DE EMPLEADOS */
.roleRestricted{
  display:none !important;
}
.staffActions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:7px;
}
.staffActions .warning{
  background:#f0a800;
  color:#171512;
}
.staffActions .danger{
  background:#bd3028;
  color:#fff;
}
@media(max-width:700px){
  .staffActions{
    justify-content:flex-start;
  }
}

/* V13.6 — ELIMINAR VENTAS SOLO ADMIN */
.deleteSaleBtn{
  margin-left:auto;
  background:#b42318 !important;
  color:#fff !important;
  border:0 !important;
}
.orderDeleteArea{
  display:flex;
  justify-content:flex-end;
  margin-top:10px;
}
body.employeeMode .deleteSaleBtn{
  display:none !important;
}

/* V13.7 — PERSONAL SIEMPRE VISIBLE */
.staffSearchBox{display:flex;gap:8px;align-items:center}
.staffSearchBox input{min-width:230px;flex:1}
.staffSearchBox button{flex:0 0 auto}
#staffList{min-height:180px}
.staffCard{display:grid;grid-template-columns:minmax(220px,1fr) auto auto;gap:14px;align-items:center}
@media(max-width:760px){
  .staffSearchBox{width:100%}
  .staffSearchBox input{min-width:0}
  .staffCard{grid-template-columns:1fr}
}

/* V13.11 — VENTAS SOLO ADMIN Y CONTABILIDAD AUTOMÁTICA */
.orderActions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:10px;
}
.orderActions select{
  flex:1;
  min-width:150px;
}
.deleteSaleBtn{
  margin-left:auto;
  background:#b42318 !important;
  color:#fff !important;
  border:0 !important;
}
body.employeeMode .deleteSaleBtn{
  display:none !important;
}

/* V13.12 — COBRO POSTERIOR */
.paymentLaterNotice{
  grid-column:1/-1;
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:13px;
  border-radius:12px;
  background:#fff4cf;
  border:1px solid #f0d67b;
}
.paymentLaterNotice span{font-size:.8rem;color:#6f5b18}
.orderPaymentStatus{
  display:inline-flex;
  width:max-content;
  padding:5px 9px;
  margin:6px 0;
  border-radius:999px;
  font-size:.72rem;
  font-weight:900;
}
.orderPaymentStatus.paid{background:#dff5e6;color:#176b36}
.orderPaymentStatus.unpaid{background:#fff0c7;color:#846000}
.chargeOrderCard{max-width:440px}
.chargeOrderTotal{
  display:flex;
  justify-content:space-between;
  align-items:center;
  background:#171512;
  color:#fff;
  padding:16px;
  border-radius:13px;
  margin:14px 0;
}
.chargeOrderTotal strong{font-size:1.5rem;color:#ffc400}
.chargeChange{
  display:flex;
  justify-content:space-between;
  padding:12px;
  margin:10px 0;
  background:#f3eee5;
  border-radius:10px;
}

/* V13.13 — COBRO DIRECTO DESDE POS / CAJA */
.posPendingPanel{
  margin-top:18px;
  padding:20px;
}
.posPendingHeader{
  align-items:center;
  margin-bottom:14px;
}
.posPendingHeader h3{
  margin:3px 0;
  font-size:1.35rem;
}
.posPendingHeader p{
  margin:0;
  color:var(--muted);
  font-size:.84rem;
}
.posPendingActions{
  display:flex;
  align-items:center;
  gap:10px;
}
.pendingCount{
  padding:9px 12px;
  border-radius:999px;
  background:#fff1bd;
  color:#6d5200;
  font-size:.78rem;
  font-weight:800;
}
.posPendingOrders{
  display:grid;
  gap:10px;
}
.posPendingCard{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:14px;
  border:1px solid #e5ddd1;
  border-radius:15px;
  background:#fff;
}
.posPendingMain{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}
.posPendingNumber{
  flex:0 0 70px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  min-height:67px;
  border-radius:12px;
  background:#171512;
  color:#fff;
}
.posPendingNumber small{
  color:#ffc400;
  font-size:.58rem;
  font-weight:900;
  letter-spacing:1px;
}
.posPendingNumber strong{
  font-size:1.15rem;
}
.posPendingInfo{
  min-width:0;
}
.posPendingInfo h4{
  margin:0 0 4px;
  font-size:1rem;
}
.posPendingInfo p{
  margin:0 0 5px;
  color:#554e46;
  font-size:.83rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:650px;
}
.posPendingInfo small{
  color:var(--muted);
}
.posPendingPayment{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:auto auto auto;
  align-items:center;
  gap:12px;
}
.posPendingPayment>span{
  padding:5px 9px;
  border-radius:999px;
  background:#fff0c7;
  color:#846000;
  font-size:.7rem;
  font-weight:900;
}
.posPendingPayment>strong{
  font-size:1.2rem;
}
.posPayNowBtn{
  min-width:125px;
}
.posPendingEmpty{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:120px;
  color:#4f6654;
  background:#eff8f1;
  border-radius:14px;
  text-align:left;
}
.posPendingEmpty>span{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border-radius:50%;
  background:#24894a;
  color:#fff;
  font-size:1.25rem;
}
.posPendingEmpty p{
  margin:4px 0 0;
  color:#6b776e;
  font-size:.8rem;
}
@media(max-width:850px){
  .posPendingCard{
    align-items:flex-start;
    flex-direction:column;
  }
  .posPendingPayment{
    width:100%;
    grid-template-columns:1fr auto;
  }
  .posPendingPayment>span{
    display:none;
  }
  .posPayNowBtn{
    min-width:140px;
  }
}
@media(max-width:520px){
  .posPendingHeader,
  .posPendingActions{
    align-items:flex-start;
    flex-direction:column;
  }
  .posPendingMain{
    align-items:flex-start;
  }
  .posPendingInfo p{
    white-space:normal;
  }
  .posPendingPayment{
    grid-template-columns:1fr;
  }
  .posPayNowBtn{
    width:100%;
  }
}

/* V15.2 — DESCUENTOS Y MÉTODOS DE PAGO EN CAJA */
.chargeSummary{
  display:grid;
  gap:8px;
  margin:14px 0;
}
.chargeSummary>div{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 12px;
  border-radius:10px;
  background:#f5f0e8;
}
.chargeSummary .chargeOrderTotal{
  background:#171512;
  color:#fff;
  margin:0;
}
.chargeSummary .chargeOrderTotal strong{
  color:#ffc400;
  font-size:1.45rem;
}
.discountControls{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-bottom:10px;
}
.discountControls label{
  margin:0;
}
.discountControls input:disabled{
  opacity:.55;
  background:#eee9e1;
}
.receiptDiscount{
  color:#a32118;
}
@media(max-width:560px){
  .discountControls{
    grid-template-columns:1fr;
  }
}

/* V15.3 — PRODUCTOS CON IMÁGENES, EDICIÓN Y ELIMINACIÓN */
.productFormTitle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  border-bottom:1px solid #e8dfd3;
  padding-bottom:12px;
}
.productFormTitle h2{
  margin:3px 0 0;
}
.editBadge{
  padding:7px 11px;
  border-radius:999px;
  background:#fff0bd;
  color:#725400;
  font-size:.72rem;
  font-weight:900;
}
.productImagePicker{
  border:1px dashed #cfc2b2;
  border-radius:13px;
  padding:13px;
  background:#faf7f2;
}
.productImagePicker input{
  margin-top:8px;
}
.productImagePicker small{
  display:block;
  margin-top:7px;
  color:#786f65;
  font-size:.72rem;
}
.previewBox{
  min-height:150px;
  overflow:hidden;
}
.previewBox img{
  width:100%;
  height:180px;
  object-fit:contain;
  border-radius:12px;
  background:#f2ede5;
}
#saveProductBtn:disabled{
  opacity:.65;
  cursor:wait;
}

/* V16 — BASE ESTABLE */
#loginForm button:disabled,
button:disabled{
  opacity:.65;
  cursor:wait;
}

/* MORDISCO OS V18 */
#loginForm button:disabled,
button:disabled{
  opacity:.65;
  cursor:wait;
}

/* MORDISCO OS V18 — PANEL ÚNICO */
#v18VersionMarker{
  position:fixed;
  right:10px;
  bottom:8px;
  z-index:9999;
  padding:5px 9px;
  border:1px solid #e0bc25;
  border-radius:999px;
  background:#fff3b2;
  color:#665000;
  font:800 11px system-ui,sans-serif;
  user-select:none;
}

/* V18.4 — PEDIDOS WEB Y PROMOCIONES */
.orderFilters{
  display:flex;
  justify-content:flex-end;
  margin-bottom:16px;
}
.orderFilters label{
  width:min(260px,100%);
}
.promotionImagePicker{
  border:1px dashed #cfc2b2;
  border-radius:13px;
  padding:13px;
  background:#faf7f2;
}
.promotionImagePicker input{
  margin-top:8px;
}
.promotionImagePicker small{
  display:block;
  margin-top:7px;
  color:#786f65;
}
.promotionPreview{
  min-height:150px;
  border:1px dashed #d8cdbc;
  border-radius:13px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#faf7f2;
}
.promotionPreview img{
  width:100%;
  height:180px;
  object-fit:contain;
}

/* V18.5 — DESCUENTO AUTOMÁTICO EN CAJA */
.preDiscountBox{
  border:1px solid #e8cb72;
  background:#fff7d8;
  border-radius:14px;
  padding:12px;
  margin:10px 0;
  display:grid;
  gap:9px;
}
.preDiscountBox label{
  display:grid;
  gap:5px;
  font-size:.82rem;
}
.preDiscountBox select,
.preDiscountBox input{
  width:100%;
  padding:9px;
  border:1px solid #d8c69b;
  border-radius:9px;
  background:#fff;
}
.quickDiscounts{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:6px;
}
.quickDiscounts button{
  border:1px solid #d9ad00;
  background:#fff;
  border-radius:9px;
  padding:8px 4px;
  font-weight:900;
  cursor:pointer;
}
.quickDiscounts button:hover{
  background:#ffc400;
}

/* Subida de imágenes desde la computadora - Páginas */
.page-upload-box{
  display:grid;
  grid-template-columns:max-content max-content 1fr;
  gap:10px;
  align-items:center;
  margin-top:10px;
  padding:12px;
  border:1px dashed #d7c7aa;
  border-radius:12px;
  background:#fffaf0;
}
.page-upload-box .secondary{
  border:1px solid #d7c7aa;
  background:#fff;
  color:#33270f;
  padding:10px 13px;
  border-radius:9px;
  font-weight:800;
  cursor:pointer;
}
.page-upload-box .secondary:disabled{
  opacity:.5;
  cursor:not-allowed;
}
.page-upload-status{
  font-size:12px;
  color:#6d6252;
}
.page-image-preview{
  grid-column:1/-1;
  width:min(360px,100%);
  max-height:220px;
  object-fit:cover;
  border-radius:10px;
  border:1px solid #e2d7c3;
  background:#fff;
}
@media(max-width:700px){
  .page-upload-box{grid-template-columns:1fr}
  .page-upload-box .secondary{width:100%}
  .page-image-preview{grid-column:1}
}

.settingsGrid{grid-template-columns:minmax(360px,.8fr) minmax(520px,1.2fr)}
.businessHoursEditor{display:grid;gap:9px;margin-top:16px}
.businessHourRow{
  display:grid;
  grid-template-columns:110px 90px 1fr 25px 1fr;
  gap:9px;
  align-items:center;
  padding:10px;
  border:1px solid #e5dac7;
  border-radius:11px;
  background:#fffaf1;
}
.businessHourRow strong{font-size:13px}
.businessHourRow label{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:800}
.businessHourRow input[type="time"]{width:100%;padding:9px;border:1px solid #dfd3bf;border-radius:8px}
.accountsHeader{margin:22px 0 12px}
.accountsGrid{grid-template-columns:minmax(360px,.75fr) minmax(700px,1.4fr)}
.accountOverdue{color:#b3261e;font-weight:900}
.accountPaid{color:#167636;font-weight:900}
.accountPending{color:#a66b00;font-weight:900}
@media(max-width:1050px){
  .settingsGrid,.accountsGrid{grid-template-columns:1fr}
}
@media(max-width:650px){
  .businessHourRow{grid-template-columns:1fr 1fr}
  .businessHourRow strong{grid-column:1/-1}
}

/* EXTRAS Y EMPAQUES */
.extrasGrid{grid-template-columns:minmax(360px,.75fr) minmax(520px,1.25fr)}
.extraOptionsList{display:grid;gap:12px;margin-top:16px}
.extraOptionCard{
  display:grid;
  grid-template-columns:1fr auto;
  gap:14px;
  align-items:center;
  padding:15px;
  border:1px solid #e5dac7;
  border-radius:14px;
  background:#fffaf1;
}
.extraOptionCard h4{margin:0 0 5px}
.extraOptionCard small{display:block;color:#756957}
.extraOptionMeta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:8px;
}
.extraOptionMeta span{
  padding:5px 8px;
  border-radius:999px;
  background:#fff;
  border:1px solid #eadfce;
  font-size:10px;
  font-weight:800;
}
.extraOptionActions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:950px){
  .extrasGrid{grid-template-columns:1fr}
}
@media(max-width:620px){
  .extraOptionCard{grid-template-columns:1fr}
  .extraOptionActions{justify-content:flex-start}
}

/* SEGURIDAD DE CUENTA */
.passwordPanel{margin-bottom:20px}
.passwordPanel .formGrid{margin-top:14px}

/* PERMISOS ESTRICTOS PARA EMPLEADOS */
body.employeeMode .sidebar [data-tab].roleRestricted,
body.employeeMode .sidebar [data-tab][hidden]{
  display:none!important;
}

/* PERMISOS PERSONALIZADOS Y CONTROL DE CAJA */
.staffPermissionsBox{
  margin:4px 0 0;
  padding:14px;
  border:1px solid #dfd0b8;
  border-radius:14px;
  background:#fffaf0;
}
.staffPermissionsBox legend{font-weight:900;padding:0 7px}
.staffPermissionsBox p{margin:0 0 10px;color:#766a58;font-size:12px}
.staffPermissionGrid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px 12px;
}
.staffPermissionGrid .check{
  margin:0;padding:9px;border-radius:9px;background:#fff;
  border:1px solid #eadfce;
}
.adminCashControl{
  display:flex;align-items:center;justify-content:space-between;
  gap:18px;margin-bottom:18px;
}
.adminCashControl h3{margin:5px 0}
.cashControlActions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.cashRegisterBadge{
  padding:9px 13px;border-radius:999px;font-weight:900;
  background:#eee;color:#444;
}
.cashRegisterBadge.open{background:#dff7e7;color:#12642d}
.cashRegisterBadge.closed{background:#ffe2de;color:#8f241b}
.cashRegisterClosedNotice{
  display:flex;gap:10px;align-items:center;
  margin-bottom:14px;padding:14px 16px;border-radius:13px;
  background:#ffe2de;color:#821e17;border:1px solid #f2b9b3;
}
.cashRegisterClosedNotice strong{white-space:nowrap}
body.employeeMode .sidebar [data-tab]{
  display:none!important;
}
body.employeeMode .sidebar [data-tab].employeeAllowed{
  display:flex!important;
}
body.cashRegisterClosed[data-employee-role="cashier"] #tab-pos .posLayout{
  pointer-events:none;opacity:.42;filter:grayscale(.35);
}
body.employeeMode #adminCashControl{display:none!important}
@media(max-width:700px){
  .staffPermissionGrid{grid-template-columns:1fr}
  .adminCashControl{align-items:flex-start;flex-direction:column}
}

/* V21 — VISIBILIDAD ESTRICTA DE EMPLEADOS */
body.employeeMode .sidebar [data-tab]{
  display:none!important;
}
body.employeeMode .sidebar [data-tab].employeeAllowed{
  display:flex!important;
}

/* ADMINISTRADOR ABRE Y CIERRA TURNOS */
.adminShiftManager{margin-bottom:18px}
.adminShiftManager .panelTitle p{margin:6px 0 0;color:var(--muted)}
.adminShiftGrid{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:12px;
  align-items:end;
}
.adminShiftGrid label{display:grid;gap:7px;font-weight:800}
.adminShiftGrid select,
.adminShiftGrid input{
  min-height:44px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
}
.adminShiftActions{
  grid-column:1/-1;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.adminShiftStatus{
  margin-top:12px;
  padding:12px 14px;
  border-radius:10px;
  background:#f6f1e8;
  font-weight:800;
}
body:not(.employeeMode) .employeeShiftToolbar{display:none!important}
body.employeeMode #adminShiftManager{display:none!important}
@media(max-width:800px){
  .adminShiftGrid{grid-template-columns:1fr}
  .adminShiftActions{grid-column:auto}
}

/* CORRECCIÓN MODAL DE COBRO */
.modal.hidden,
.overlay.hidden,
.dialogBackdrop.hidden{
  display:none!important;
  pointer-events:none!important;
}
body:not(.modal-open){overflow:auto!important}

/* CLIENTES REGISTRADOS EN POS */
#posCustomer{background:#fff}

/* ACCIONES DE COCINA */
.kitchenCardActions button:disabled{
  opacity:.65;
  cursor:wait;
}

/* COCINA: DETALLE DE ORDEN Y ACTUALIZACIÓN AUTOMÁTICA */
.kitchenItems{
  display:grid;
  gap:7px;
  margin:14px 0;
  padding:0;
  list-style:none;
}
.kitchenItems li{
  padding:10px 12px;
  border-radius:9px;
  background:#f6f1e8;
  line-height:1.25;
}
.kitchenItems small{display:block;margin-top:4px}
.kitchenNoItems{color:#8a7863;font-style:italic}

/* COMPROBANTE LIMPIO */
#receiptModal.hidden{display:none!important;pointer-events:none!important}
#receiptModal:not(.hidden){display:grid!important;pointer-events:auto!important}
.receiptModalCard{
  max-height:calc(100vh - 32px);
  overflow:auto;
}
#receiptCloseBtn{
  position:absolute;
  top:10px;
  right:10px;
  z-index:4;
}
.receiptActions{
  position:sticky;
  bottom:0;
  background:#fff;
  padding:12px 0 2px;
}

/* CATEGORÍAS COMPACTAS */
.categoryNativeHidden{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
}
.posCatalogTop{
  grid-template-columns:minmax(180px,1fr)!important;
}
.categoryChips{
  grid-column:1/-1;
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding:3px 2px 8px;
  scrollbar-width:thin;
  scroll-snap-type:x proximity;
}
.categoryChip{
  flex:0 0 auto;
  scroll-snap-align:start;
  border:1px solid #d8c9b4;
  background:#fff;
  color:#16120d;
  border-radius:999px;
  padding:9px 14px;
  font-weight:900;
  white-space:nowrap;
  box-shadow:none;
}
.categoryChip.active{
  background:#111;
  color:#fff;
  border-color:#111;
}
.categoryChip:hover{
  transform:none;
  box-shadow:none;
}
@media(max-width:650px){
  .categoryChips{padding-bottom:10px}
  .categoryChip{padding:10px 15px}
  .receiptActions{flex-direction:column}
  .receiptActions button{width:100%}
}

/* ===== MESAS: VENTANA LIMPIA Y ORDENADA ===== */
#tableOrderModal{
  align-items:center!important;
  justify-content:center!important;
  padding:18px!important;
  overflow:hidden!important;
}

#tableOrderModal .tableOrderCard{
  width:min(1180px,calc(100vw - 280px))!important;
  max-width:1180px!important;
  height:min(820px,calc(100vh - 36px))!important;
  max-height:calc(100vh - 36px)!important;
  padding:22px!important;
  border-radius:22px!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  box-shadow:0 30px 90px rgba(0,0,0,.32)!important;
}

#tableOrderModal .close{
  width:42px!important;
  height:42px!important;
  display:grid!important;
  place-items:center!important;
  top:14px!important;
  right:14px!important;
  border:2px solid #111!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#111!important;
  font-size:28px!important;
  line-height:1!important;
  z-index:20!important;
}

#tableOrderModal .tableOrderHead{
  flex:0 0 auto!important;
  min-height:62px!important;
  padding:0 58px 14px 2px!important;
  margin:0 0 14px!important;
  border-bottom:1px solid #e8dfd2!important;
}

#tableOrderModal .tableOrderHead h2{
  font-size:1.8rem!important;
  margin:2px 0 0!important;
}

#tableOrderModal .tableOrderLayout{
  flex:1 1 auto!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr)!important;
  gap:18px!important;
  overflow:hidden!important;
}

#tableOrderModal .tableCatalog{
  min-width:0!important;
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}

#tableOrderModal .tableCatalogToolbar{
  flex:0 0 auto!important;
  display:grid!important;
  grid-template-columns:minmax(180px,1fr) minmax(180px,260px)!important;
  gap:10px!important;
  margin-bottom:12px!important;
}

#tableOrderModal .tableCatalogToolbar input,
#tableOrderModal .tableCatalogToolbar select{
  width:100%!important;
  min-height:44px!important;
  padding:10px 12px!important;
  border:1px solid #cfc2b0!important;
  border-radius:10px!important;
  background:#fff!important;
  font-size:.95rem!important;
}

#tableOrderModal #tableProducts{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  padding:2px 6px 16px 2px!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-content:start!important;
}

#tableOrderModal #tableProducts .posProduct img,
#tableOrderModal #tableProducts .posProductNoImage{
  height:105px!important;
}

#tableOrderModal .tableTicket{
  min-width:0!important;
  min-height:0!important;
  overflow-y:auto!important;
  background:#f7f2e9!important;
  border:1px solid #e3d8c8!important;
  border-radius:16px!important;
  padding:16px!important;
}

#tableOrderModal .tableTicket .posCart{
  max-height:210px!important;
  overflow-y:auto!important;
  margin-bottom:10px!important;
}

#tableOrderModal .tableTicket textarea{
  min-height:72px!important;
  resize:vertical!important;
}

#tableOrderModal .tableTicket button{
  min-height:44px!important;
  border-radius:10px!important;
}

#tableOrderModal .tableCloseBottom{
  background:#fff!important;
  color:#111!important;
  border:1px solid #c8baa6!important;
}

@media(max-width:1180px){
  #tableOrderModal .tableOrderCard{
    width:calc(100vw - 32px)!important;
  }
  #tableOrderModal #tableProducts{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:760px){
  #tableOrderModal{
    padding:0!important;
    align-items:stretch!important;
  }
  #tableOrderModal .tableOrderCard{
    width:100vw!important;
    height:100vh!important;
    max-height:100vh!important;
    border-radius:0!important;
    padding:16px!important;
  }
  #tableOrderModal .tableOrderLayout{
    grid-template-columns:1fr!important;
    overflow-y:auto!important;
  }
  #tableOrderModal .tableCatalog{
    min-height:520px!important;
  }
  #tableOrderModal .tableCatalogToolbar{
    grid-template-columns:1fr!important;
  }
  #tableOrderModal #tableProducts{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    max-height:460px!important;
  }
  #tableOrderModal .tableTicket{
    overflow:visible!important;
  }
}

@media(max-width:430px){
  #tableOrderModal #tableProducts{
    grid-template-columns:1fr 1fr!important;
  }
  #tableOrderModal #tableProducts .posProduct img,
  #tableOrderModal #tableProducts .posProductNoImage{
    height:90px!important;
  }
}

/* ===== MESAS: TARJETAS COMPLETAS, SIN FRANJAS ===== */
#tableOrderModal .tableOrderCard{
  width:min(1160px,calc(100vw - 36px))!important;
  height:min(780px,calc(100vh - 30px))!important;
  padding:20px!important;
}

#tableOrderModal .tableOrderLayout{
  grid-template-columns:minmax(520px,1.45fr) minmax(300px,.75fr)!important;
  gap:16px!important;
}

#tableOrderModal #tableProducts{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(155px,1fr))!important;
  grid-auto-rows:max-content!important;
  align-items:start!important;
  align-content:start!important;
  gap:12px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:4px 8px 20px 2px!important;
}

#tableOrderModal #tableProducts .posProduct{
  display:flex!important;
  flex-direction:column!important;
  width:100%!important;
  min-width:0!important;
  min-height:205px!important;
  height:auto!important;
  overflow:hidden!important;
  border-radius:14px!important;
  background:#fff!important;
  border:1px solid #e1d7c8!important;
}

#tableOrderModal #tableProducts .posProduct img,
#tableOrderModal #tableProducts .posProductNoImage{
  display:block!important;
  flex:0 0 112px!important;
  width:100%!important;
  height:112px!important;
  min-height:112px!important;
  max-height:112px!important;
  object-fit:contain!important;
  background:#f3eee5!important;
}

#tableOrderModal #tableProducts .posProductInfo{
  display:flex!important;
  flex-direction:column!important;
  flex:1 1 auto!important;
  min-height:90px!important;
  padding:10px 11px!important;
  overflow:visible!important;
}

#tableOrderModal #tableProducts .posProductInfo small{
  display:block!important;
  margin:0 0 4px!important;
  color:#776d61!important;
}

#tableOrderModal #tableProducts .posProductInfo b{
  display:block!important;
  min-height:38px!important;
  line-height:1.15!important;
  white-space:normal!important;
  overflow:visible!important;
}

#tableOrderModal #tableProducts .posProductInfo strong{
  display:block!important;
  margin-top:auto!important;
  padding-top:8px!important;
  font-size:1.05rem!important;
}

#tableOrderModal .tableTicket{
  max-height:100%!important;
}

@media(max-width:1050px){
  #tableOrderModal .tableOrderLayout{
    grid-template-columns:minmax(420px,1.2fr) minmax(280px,.8fr)!important;
  }
  #tableOrderModal #tableProducts{
    grid-template-columns:repeat(2,minmax(165px,1fr))!important;
  }
}

@media(max-width:760px){
  #tableOrderModal .tableOrderLayout{
    grid-template-columns:1fr!important;
  }
  #tableOrderModal #tableProducts{
    grid-template-columns:repeat(2,minmax(135px,1fr))!important;
    max-height:none!important;
  }
  #tableOrderModal #tableProducts .posProduct{
    min-height:190px!important;
  }
}

/* V21 — SELECTOR DE TURNOS */
#adminShiftEmployee:disabled{
  opacity:.7;
  cursor:wait;
}

/* V21 — TURNO ABIERTO DE FECHAS ANTERIORES */
#adminShiftStatus strong{font-weight:900}

/* ===== MESAS: PRODUCTOS COMPACTOS Y CATÁLOGO COMPLETO ===== */
#tableOrderModal .tableOrderCard{
  height:min(760px,calc(100vh - 24px))!important;
  max-height:calc(100vh - 24px)!important;
}

#tableOrderModal .tableOrderLayout{
  min-height:0!important;
  overflow:hidden!important;
}

#tableOrderModal .tableCatalog{
  min-height:0!important;
  overflow:hidden!important;
}

#tableOrderModal #tableProducts{
  min-height:0!important;
  height:100%!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(125px,1fr))!important;
  grid-auto-rows:max-content!important;
  gap:9px!important;
  padding:2px 8px 28px 2px!important;
  align-content:start!important;
  scroll-behavior:smooth;
  overscroll-behavior:contain;
}

#tableOrderModal #tableProducts .posProduct{
  min-height:155px!important;
  height:auto!important;
  border-radius:12px!important;
}

#tableOrderModal #tableProducts .posProduct img,
#tableOrderModal #tableProducts .posProductNoImage{
  flex:0 0 76px!important;
  width:100%!important;
  height:76px!important;
  min-height:76px!important;
  max-height:76px!important;
  object-fit:contain!important;
}

#tableOrderModal #tableProducts .posProductInfo{
  min-height:76px!important;
  padding:7px 8px!important;
}

#tableOrderModal #tableProducts .posProductInfo small{
  margin-bottom:2px!important;
  font-size:.72rem!important;
}

#tableOrderModal #tableProducts .posProductInfo b{
  min-height:30px!important;
  font-size:.84rem!important;
  line-height:1.08!important;
}

#tableOrderModal #tableProducts .posProductInfo strong{
  padding-top:4px!important;
  font-size:.92rem!important;
}

#tableOrderModal .tableCatalogToolbar{
  margin-bottom:8px!important;
}

#tableOrderModal .tableCatalogToolbar input,
#tableOrderModal .tableCatalogToolbar select{
  min-height:38px!important;
  padding:7px 10px!important;
}

#tableOrderModal .tableTicket{
  min-height:0!important;
  height:100%!important;
  overflow-y:auto!important;
}

@media(max-width:1250px){
  #tableOrderModal #tableProducts{
    grid-template-columns:repeat(3,minmax(135px,1fr))!important;
  }
}

@media(max-width:980px){
  #tableOrderModal #tableProducts{
    grid-template-columns:repeat(2,minmax(135px,1fr))!important;
  }
}

@media(max-width:760px){
  #tableOrderModal .tableOrderCard{
    height:100vh!important;
    max-height:100vh!important;
  }

  #tableOrderModal .tableOrderLayout{
    overflow-y:auto!important;
  }

  #tableOrderModal .tableCatalog{
    min-height:520px!important;
  }

  #tableOrderModal #tableProducts{
    height:430px!important;
    max-height:430px!important;
    grid-template-columns:repeat(2,minmax(125px,1fr))!important;
  }
}

/* ===== PRODUCCIÓN: MESAS MÁS COMPACTAS ===== */
#tableOrderModal .tableOrderCard{
  width:min(1240px,calc(100vw - 28px))!important;
  height:min(790px,calc(100vh - 20px))!important;
  max-height:calc(100vh - 20px)!important;
  padding:16px!important;
}

#tableOrderModal .tableOrderLayout{
  grid-template-columns:minmax(620px,1.75fr) minmax(270px,.65fr)!important;
  gap:12px!important;
}

#tableOrderModal .tableOrderHead{
  min-height:48px!important;
  padding-bottom:8px!important;
  margin-bottom:8px!important;
}

#tableOrderModal .tableCatalogToolbar{
  grid-template-columns:minmax(170px,1fr) minmax(160px,230px)!important;
  gap:7px!important;
  margin-bottom:7px!important;
}

#tableOrderModal .tableCatalogToolbar input,
#tableOrderModal .tableCatalogToolbar select{
  min-height:36px!important;
  padding:6px 9px!important;
}

#tableOrderModal #tableProducts{
  grid-template-columns:repeat(5,minmax(108px,1fr))!important;
  grid-auto-rows:max-content!important;
  gap:7px!important;
  padding:2px 7px 24px 2px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  align-content:start!important;
}

#tableOrderModal #tableProducts .posProduct{
  min-height:132px!important;
  height:auto!important;
  border-radius:10px!important;
}

#tableOrderModal #tableProducts .posProduct img,
#tableOrderModal #tableProducts .posProductNoImage{
  flex:0 0 58px!important;
  width:100%!important;
  height:58px!important;
  min-height:58px!important;
  max-height:58px!important;
  object-fit:contain!important;
}

#tableOrderModal #tableProducts .posProductInfo{
  min-height:68px!important;
  padding:6px 7px!important;
}

#tableOrderModal #tableProducts .posProductInfo small{
  font-size:.65rem!important;
  margin-bottom:1px!important;
}

#tableOrderModal #tableProducts .posProductInfo b{
  min-height:27px!important;
  font-size:.77rem!important;
  line-height:1.05!important;
}

#tableOrderModal #tableProducts .posProductInfo strong{
  padding-top:3px!important;
  font-size:.86rem!important;
}

#tableOrderModal .tableTicket{
  padding:12px!important;
}

#tableOrderModal .tableTicket textarea{
  min-height:58px!important;
}

#tableOrderModal .tableTicket button{
  min-height:39px!important;
}

@media(max-width:1180px){
  #tableOrderModal #tableProducts{
    grid-template-columns:repeat(4,minmax(112px,1fr))!important;
  }
}

@media(max-width:930px){
  #tableOrderModal #tableProducts{
    grid-template-columns:repeat(3,minmax(120px,1fr))!important;
  }
}

@media(max-width:760px){
  #tableOrderModal .tableOrderLayout{
    grid-template-columns:1fr!important;
  }
  #tableOrderModal #tableProducts{
    grid-template-columns:repeat(2,minmax(125px,1fr))!important;
    height:420px!important;
  }
}

/* ============================================================
   MESAS — DISEÑO REAL FINAL
   Aislado únicamente a #tableOrderModal
   ============================================================ */

#tableOrderModal.modal{
  position:fixed!important;
  inset:0!important;
  z-index:9999!important;
  display:flex!important;
  align-items:stretch!important;
  justify-content:flex-end!important;
  padding:10px 10px 10px 198px!important;
  overflow:hidden!important;
  background:rgba(10,9,7,.48)!important;
}

#tableOrderModal.modal.hidden{
  display:none!important;
}

#tableOrderModal .tableOrderCard{
  position:relative!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  max-height:none!important;
  margin:0!important;
  padding:13px!important;
  border-radius:18px!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  background:#fff!important;
  box-shadow:0 24px 80px rgba(0,0,0,.30)!important;
}

#tableOrderModal .close{
  position:absolute!important;
  top:10px!important;
  right:12px!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  border:2px solid #15120e!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#111!important;
  font-size:28px!important;
  line-height:1!important;
  z-index:20!important;
}

#tableOrderModal .tableOrderHead{
  flex:0 0 48px!important;
  min-height:48px!important;
  height:48px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  padding:0 58px 8px 3px!important;
  margin:0 0 8px!important;
  border-bottom:1px solid #eadfce!important;
  overflow:hidden!important;
}

#tableOrderModal .tableOrderHead .eyebrow{
  font-size:.68rem!important;
}

#tableOrderModal .tableOrderHead h2{
  margin:0!important;
  font-size:1.25rem!important;
  line-height:1.1!important;
}

#tableOrderModal .tableOrderLayout{
  flex:1 1 auto!important;
  min-height:0!important;
  height:auto!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 282px!important;
  gap:10px!important;
  overflow:hidden!important;
}

#tableOrderModal .tableCatalog{
  min-width:0!important;
  min-height:0!important;
  height:100%!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}

#tableOrderModal .tableCatalogToolbar{
  flex:0 0 38px!important;
  height:38px!important;
  display:grid!important;
  grid-template-columns:minmax(140px,1fr) 210px!important;
  gap:7px!important;
  margin:0 0 7px!important;
}

#tableOrderModal .tableCatalogToolbar input,
#tableOrderModal .tableCatalogToolbar select{
  width:100%!important;
  height:38px!important;
  min-height:38px!important;
  margin:0!important;
  padding:6px 10px!important;
  border:1px solid #ccbda8!important;
  border-radius:10px!important;
  background:#fff!important;
  font-size:.88rem!important;
}

#tableOrderModal #tableProducts{
  flex:1 1 auto!important;
  min-height:0!important;
  height:auto!important;
  max-height:none!important;
  width:100%!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  grid-auto-rows:122px!important;
  gap:6px!important;
  align-content:start!important;
  align-items:stretch!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:1px 6px 18px 1px!important;
  scroll-behavior:smooth!important;
  overscroll-behavior:contain!important;
}

#tableOrderModal #tableProducts .posProduct{
  width:100%!important;
  min-width:0!important;
  height:122px!important;
  min-height:122px!important;
  max-height:122px!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border:1px solid #e0d5c5!important;
  border-radius:10px!important;
  background:#fff!important;
  box-shadow:none!important;
  text-align:left!important;
}

#tableOrderModal #tableProducts .posProduct:hover{
  transform:none!important;
  border-color:#f0ad00!important;
  box-shadow:0 3px 10px rgba(0,0,0,.08)!important;
}

#tableOrderModal #tableProducts .posProduct img,
#tableOrderModal #tableProducts .posProductNoImage{
  flex:0 0 52px!important;
  display:block!important;
  width:100%!important;
  height:52px!important;
  min-height:52px!important;
  max-height:52px!important;
  margin:0!important;
  object-fit:contain!important;
  background:#f4efe6!important;
}

#tableOrderModal #tableProducts .posProductInfo{
  flex:1 1 auto!important;
  min-width:0!important;
  min-height:0!important;
  height:70px!important;
  padding:5px 6px!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}

#tableOrderModal #tableProducts .posProductInfo small{
  display:block!important;
  margin:0 0 1px!important;
  color:#817568!important;
  font-size:.60rem!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

#tableOrderModal #tableProducts .posProductInfo b{
  display:-webkit-box!important;
  min-height:25px!important;
  max-height:25px!important;
  margin:0!important;
  overflow:hidden!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  font-size:.70rem!important;
  line-height:1.02!important;
  white-space:normal!important;
}

#tableOrderModal #tableProducts .posProductInfo strong{
  display:block!important;
  margin-top:auto!important;
  padding-top:2px!important;
  font-size:.82rem!important;
  line-height:1!important;
}

#tableOrderModal .tableTicket{
  min-width:0!important;
  min-height:0!important;
  height:100%!important;
  max-height:none!important;
  margin:0!important;
  padding:10px!important;
  display:flex!important;
  flex-direction:column!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  border:1px solid #e3d7c7!important;
  border-radius:13px!important;
  background:#f7f2e9!important;
}

#tableOrderModal .tableTicket .posCart{
  flex:1 1 auto!important;
  min-height:76px!important;
  max-height:none!important;
  overflow-y:auto!important;
  margin:0 0 4px!important;
}

#tableOrderModal .tableTicket label{
  flex:0 0 auto!important;
  margin-top:5px!important;
  font-size:.76rem!important;
}

#tableOrderModal .tableTicket input{
  min-height:34px!important;
  height:34px!important;
  margin-top:3px!important;
  padding:5px 7px!important;
}

#tableOrderModal .tableTicket textarea{
  min-height:50px!important;
  height:50px!important;
  max-height:70px!important;
  margin-top:3px!important;
  padding:6px 7px!important;
  resize:vertical!important;
}

#tableOrderModal .tableTicket .posTotals{
  flex:0 0 auto!important;
  margin:5px 0!important;
  padding:6px 0!important;
}

#tableOrderModal .tableTicket .posTotals strong{
  font-size:1.55rem!important;
}

#tableOrderModal .tableTicket button{
  flex:0 0 38px!important;
  min-height:38px!important;
  height:38px!important;
  margin-top:5px!important;
  padding:6px 8px!important;
  border-radius:9px!important;
  font-size:.88rem!important;
}

#tableOrderModal .tableCloseBottom{
  background:#fff!important;
  color:#111!important;
  border:1px solid #cdbfae!important;
}

/* Portátil pequeño */
@media(max-width:1100px){
  #tableOrderModal.modal{
    padding-left:170px!important;
  }

  #tableOrderModal .tableOrderLayout{
    grid-template-columns:minmax(0,1fr) 270px!important;
  }

  #tableOrderModal #tableProducts{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
}

/* Tableta y teléfono */
@media(max-width:760px){
  #tableOrderModal.modal{
    padding:0!important;
  }

  #tableOrderModal .tableOrderCard{
    border-radius:0!important;
  }

  #tableOrderModal .tableOrderLayout{
    display:flex!important;
    flex-direction:column!important;
    overflow-y:auto!important;
  }

  #tableOrderModal .tableCatalog{
    flex:0 0 500px!important;
    min-height:500px!important;
  }

  #tableOrderModal .tableCatalogToolbar{
    grid-template-columns:1fr!important;
    flex-basis:82px!important;
    height:82px!important;
  }

  #tableOrderModal #tableProducts{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }

  #tableOrderModal .tableTicket{
    flex:0 0 auto!important;
    height:auto!important;
    min-height:480px!important;
  }
}

@media(max-width:480px){
  #tableOrderModal #tableProducts{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

/* ===== CONTROL DE MESAS Y BARRA ===== */
.tableManagerCreate{
  display:grid!important;
  grid-template-columns:140px minmax(180px,1fr) 110px auto!important;
  gap:8px!important;
  align-items:center!important;
}

.tableManagerCreate select,
.tableManagerCreate input{
  min-height:42px!important;
}

.tablesGrid{
  align-items:start!important;
}

.tableCardWrap{
  position:relative;
  min-width:0;
}

.tableCardWrap .tableCard{
  width:100%;
}

.tableTypeBadge{
  display:inline-flex;
  align-items:center;
  gap:5px;
  margin-bottom:8px;
  padding:5px 9px;
  border-radius:999px;
  background:#f3eadc;
  color:#6f4c14;
  font-size:.70rem;
  font-weight:900;
  text-transform:uppercase;
}

.tableTypeBadge.bar{
  background:#17130e;
  color:#ffc400;
}

.tableEditBtn{
  position:absolute;
  right:9px;
  bottom:9px;
  z-index:3;
  min-height:30px!important;
  padding:5px 10px!important;
  border:1px solid #cbbba4!important;
  border-radius:8px!important;
  background:#fff!important;
  color:#111!important;
  font-size:.72rem!important;
  font-weight:900!important;
}

.tableEditBtn:hover{
  background:#111!important;
  color:#fff!important;
}

.tableManageCard{
  width:min(460px,calc(100vw - 30px))!important;
  padding:24px!important;
}

.tableManageCard label{
  display:grid;
  gap:6px;
  margin-top:14px;
  font-weight:900;
}

.tableManageCard input,
.tableManageCard select{
  width:100%;
  min-height:44px;
  padding:9px 11px;
  border:1px solid #cdbda8;
  border-radius:10px;
  background:#fff;
}

.tableManageActions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
  margin-top:20px;
}

.tableManageActions .ghost{
  grid-column:1/-1;
}

@media(max-width:760px){
  .tableManagerCreate{
    grid-template-columns:1fr 1fr!important;
  }

  .tableManagerCreate #newTableName{
    grid-column:1/-1;
  }

  .tableManagerCreate #createTableBtn{
    grid-column:1/-1;
  }
}

/* ============================================================
   POS / CAJA — DISEÑO COMPACTO Y ORDENADO
   Solo afecta #tab-pos
   ============================================================ */

#tab-pos{
  min-height:0!important;
}

#tab-pos .posLayout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 330px!important;
  gap:14px!important;
  align-items:stretch!important;
  min-height:calc(100vh - 250px)!important;
}

#tab-pos .posCatalog{
  min-width:0!important;
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}

#tab-pos .posCatalogTop{
  flex:0 0 auto!important;
  display:grid!important;
  grid-template-columns:minmax(180px,1fr) 220px!important;
  gap:8px!important;
  margin-bottom:8px!important;
}

#tab-pos .posCatalogTop input,
#tab-pos .posCatalogTop select{
  width:100%!important;
  min-height:40px!important;
  height:40px!important;
  padding:7px 10px!important;
  border-radius:9px!important;
  font-size:.9rem!important;
}

#tab-pos .categoryChips{
  margin-bottom:7px!important;
  padding-bottom:5px!important;
}

#tab-pos #posProducts{
  flex:1 1 auto!important;
  min-height:0!important;
  max-height:calc(100vh - 340px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  grid-auto-rows:150px!important;
  gap:8px!important;
  align-content:start!important;
  padding:2px 7px 22px 2px!important;
  overscroll-behavior:contain!important;
}

#tab-pos #posProducts .posProduct{
  width:100%!important;
  min-width:0!important;
  height:150px!important;
  min-height:150px!important;
  max-height:150px!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border-radius:11px!important;
  margin:0!important;
}

#tab-pos #posProducts .posProduct img,
#tab-pos #posProducts .posProductNoImage{
  flex:0 0 72px!important;
  width:100%!important;
  height:72px!important;
  min-height:72px!important;
  max-height:72px!important;
  object-fit:contain!important;
  background:#f4efe6!important;
}

#tab-pos #posProducts .posProductInfo{
  flex:1 1 auto!important;
  min-height:0!important;
  padding:7px 8px!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}

#tab-pos #posProducts .posProductInfo small{
  margin:0 0 2px!important;
  font-size:.66rem!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

#tab-pos #posProducts .posProductInfo b{
  display:-webkit-box!important;
  min-height:31px!important;
  max-height:31px!important;
  overflow:hidden!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  font-size:.82rem!important;
  line-height:1.05!important;
}

#tab-pos #posProducts .posProductInfo strong{
  margin-top:auto!important;
  padding-top:4px!important;
  font-size:.95rem!important;
}

#tab-pos .posTicket{
  min-width:0!important;
  min-height:0!important;
  max-height:calc(100vh - 250px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:15px!important;
  border-radius:16px!important;
}

#tab-pos .posTicket h2,
#tab-pos .posTicket h3{
  margin-top:0!important;
}

#tab-pos .posCart{
  max-height:170px!important;
  overflow-y:auto!important;
  margin-bottom:8px!important;
}

#tab-pos .discountBox{
  display:grid!important;
  grid-template-columns:110px 1fr!important;
  gap:7px!important;
  align-items:end!important;
  padding:10px!important;
}

#tab-pos .discountBox .discountQuick{
  grid-column:1/-1!important;
  display:grid!important;
  grid-template-columns:repeat(4,1fr)!important;
  gap:6px!important;
}

#tab-pos .discountBox button{
  min-width:0!important;
  padding:8px 4px!important;
}

#tab-pos .posCustomerGrid,
#tab-pos .posStaffGrid{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
}

#tab-pos .posTicket label{
  font-size:.78rem!important;
  font-weight:900!important;
}

#tab-pos .posTicket input,
#tab-pos .posTicket select,
#tab-pos .posTicket textarea{
  width:100%!important;
  min-width:0!important;
  min-height:36px!important;
  padding:7px 9px!important;
  border-radius:8px!important;
}

#tab-pos .posTicket textarea{
  min-height:58px!important;
}

#tab-pos .posTicket .primary,
#tab-pos .posTicket .success,
#tab-pos .posTicket .dark{
  min-height:44px!important;
  border-radius:10px!important;
}

#tab-pos .pendingPaymentSection{
  margin-top:14px!important;
}

@media(max-width:1250px){
  #tab-pos .posLayout{
    grid-template-columns:minmax(0,1fr) 310px!important;
  }

  #tab-pos #posProducts{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
}

@media(max-width:980px){
  #tab-pos .posLayout{
    grid-template-columns:minmax(0,1fr) 290px!important;
  }

  #tab-pos #posProducts{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }

  #tab-pos .posCustomerGrid,
  #tab-pos .posStaffGrid{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:760px){
  #tab-pos .posLayout{
    display:flex!important;
    flex-direction:column!important;
  }

  #tab-pos #posProducts{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    max-height:430px!important;
  }

  #tab-pos .posTicket{
    max-height:none!important;
  }
}

/* ============================================================
   POS / CAJA — VENTANA PROFESIONAL SIN PANEL LATERAL
   ============================================================ */

html.posFocusModeRoot,
body.posFocusMode{
  overflow:hidden!important;
}

body.posFocusMode .sidebar,
body.posFocusMode .topbar{
  display:none!important;
}

body.posFocusMode .adminShell{
  display:block!important;
  min-height:100vh!important;
}

body.posFocusMode .adminMain,
body.posFocusMode main{
  width:100vw!important;
  max-width:none!important;
  height:100vh!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  background:#eee8de!important;
}

body.posFocusMode #tab-pos{
  position:fixed!important;
  inset:0!important;
  z-index:7000!important;
  display:flex!important;
  flex-direction:column!important;
  width:100vw!important;
  height:100vh!important;
  min-height:0!important;
  padding:10px!important;
  overflow:hidden!important;
  background:#eee8de!important;
}

body.posFocusMode #tab-pos.hidden{
  display:none!important;
}

body.posFocusMode #adminCashControl{
  flex:0 0 auto!important;
  margin:0 0 7px!important;
  padding:8px 13px!important;
  min-height:54px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  border-radius:13px!important;
}

body.posFocusMode #adminCashControl h3{
  margin:0!important;
  font-size:.95rem!important;
}

body.posFocusMode #adminCashControl p{
  margin:2px 0 0!important;
  font-size:.75rem!important;
}

body.posFocusMode .cashControlActions button{
  min-height:34px!important;
  padding:6px 10px!important;
}

body.posFocusMode .posHeader{
  flex:0 0 72px!important;
  min-height:72px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  margin:0 0 8px!important;
  padding:9px 13px!important;
  border-radius:15px!important;
  background:#fff!important;
  box-shadow:0 8px 24px rgba(0,0,0,.06)!important;
}

.posHeaderIntro{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}

.posFocusLogo{
  width:58px;
  height:58px;
  object-fit:contain;
  flex:0 0 58px;
}

body.posFocusMode .posHeader h2{
  margin:0!important;
  font-size:1.45rem!important;
}

body.posFocusMode .posHeader p{
  margin:2px 0 0!important;
  font-size:.78rem!important;
}

.posHeaderActions{
  display:flex;
  align-items:center;
  gap:10px;
}

body.posFocusMode .posHeaderStats{
  min-width:175px!important;
  padding:7px 12px!important;
  border-radius:11px!important;
}

.posExitBtn{
  min-height:42px;
  padding:8px 13px;
  border:1px solid #cabba5;
  border-radius:10px;
  background:#fff;
  color:#111;
  font-weight:900;
  white-space:nowrap;
}

.posExitBtn:hover{
  background:#111;
  color:#fff;
}

body.posFocusMode #cashRegisterClosedNotice{
  flex:0 0 auto!important;
  margin:0 0 7px!important;
}

body.posFocusMode #tab-pos .posLayout{
  flex:1 1 auto!important;
  min-height:0!important;
  height:auto!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 350px!important;
  gap:9px!important;
  overflow:hidden!important;
}

body.posFocusMode #tab-pos .posCatalog{
  height:100%!important;
  min-height:0!important;
  padding:10px!important;
  border-radius:15px!important;
}

body.posFocusMode #tab-pos .posCatalogTop{
  grid-template-columns:minmax(180px,1fr) 220px!important;
  margin-bottom:6px!important;
}

body.posFocusMode #tab-pos #posProducts{
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  grid-auto-rows:132px!important;
  gap:7px!important;
}

body.posFocusMode #tab-pos #posProducts .posProduct{
  height:132px!important;
  min-height:132px!important;
  max-height:132px!important;
}

body.posFocusMode #tab-pos #posProducts .posProduct img,
body.posFocusMode #tab-pos #posProducts .posProductNoImage{
  flex-basis:62px!important;
  height:62px!important;
  min-height:62px!important;
  max-height:62px!important;
}

body.posFocusMode #tab-pos #posProducts .posProductInfo{
  padding:5px 7px!important;
}

body.posFocusMode #tab-pos #posProducts .posProductInfo b{
  min-height:27px!important;
  max-height:27px!important;
  font-size:.76rem!important;
}

body.posFocusMode #tab-pos .posTicket{
  height:100%!important;
  max-height:none!important;
  padding:11px!important;
  border-radius:15px!important;
  display:flex!important;
  flex-direction:column!important;
}

body.posFocusMode #tab-pos .posTicketTitle{
  flex:0 0 auto!important;
}

body.posFocusMode #tab-pos .posCart{
  flex:1 1 auto!important;
  min-height:65px!important;
  max-height:none!important;
  overflow-y:auto!important;
}

body.posFocusMode #tab-pos .posTotals{
  flex:0 0 auto!important;
  margin-top:4px!important;
}

body.posFocusMode #tab-pos .preDiscountBox{
  padding:7px!important;
}

body.posFocusMode #tab-pos .quickDiscounts{
  gap:4px!important;
}

body.posFocusMode #tab-pos .quickDiscounts button{
  min-height:31px!important;
  padding:4px!important;
}

body.posFocusMode #tab-pos .posForm{
  flex:0 0 auto!important;
  gap:5px!important;
}

body.posFocusMode #tab-pos .posForm input,
body.posFocusMode #tab-pos .posForm select{
  min-height:32px!important;
  height:32px!important;
  padding:4px 7px!important;
}

body.posFocusMode #tab-pos .posForm textarea{
  min-height:43px!important;
  height:43px!important;
}

body.posFocusMode #tab-pos .paymentLaterNotice{
  padding:6px 8px!important;
  min-height:42px!important;
}

body.posFocusMode #tab-pos .posChargeBtn{
  flex:0 0 48px!important;
  min-height:48px!important;
  height:48px!important;
  margin-top:7px!important;
  font-size:1rem!important;
  position:sticky!important;
  bottom:0!important;
}

body.posFocusMode #tab-pos .posPendingPanel{
  flex:0 0 128px!important;
  min-height:128px!important;
  max-height:128px!important;
  margin:8px 0 0!important;
  padding:9px 12px!important;
  overflow:hidden!important;
  border-radius:14px!important;
}

body.posFocusMode #tab-pos .posPendingHeader{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  margin:0 0 5px!important;
}

body.posFocusMode #tab-pos .posPendingHeader h3{
  margin:0!important;
  font-size:.92rem!important;
}

body.posFocusMode #tab-pos .posPendingHeader p{
  display:none!important;
}

body.posFocusMode #tab-pos .posPendingOrders{
  display:flex!important;
  gap:7px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  padding-bottom:4px!important;
}

body.posFocusMode #tab-pos .posPendingOrder{
  flex:0 0 235px!important;
  min-height:70px!important;
  padding:8px!important;
}

@media(max-width:1120px){
  body.posFocusMode #tab-pos .posLayout{
    grid-template-columns:minmax(0,1fr) 325px!important;
  }

  body.posFocusMode #tab-pos #posProducts{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
}

@media(max-width:820px){
  html.posFocusModeRoot,
  body.posFocusMode{
    overflow:auto!important;
  }

  body.posFocusMode #tab-pos{
    position:relative!important;
    height:auto!important;
    min-height:100vh!important;
    overflow:visible!important;
  }

  body.posFocusMode .posHeader{
    height:auto!important;
    flex-wrap:wrap!important;
  }

  body.posFocusMode .posHeaderActions{
    width:100%;
    justify-content:space-between;
  }

  body.posFocusMode #tab-pos .posLayout{
    display:flex!important;
    flex-direction:column!important;
  }

  body.posFocusMode #tab-pos #posProducts{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    height:430px!important;
  }

  body.posFocusMode #tab-pos .posTicket{
    height:auto!important;
  }

  body.posFocusMode #tab-pos .posPendingPanel{
    max-height:none!important;
    height:auto!important;
  }
}

/* ============================================================
   POS / CAJA — CORRECCIÓN FUNCIONAL DE LA VENTANA PROFESIONAL
   ============================================================ */

html.posFocusModeRoot,
body.posFocusMode{
  overflow:auto!important;
  height:auto!important;
  min-height:100%!important;
}

body.posFocusMode .adminMain,
body.posFocusMode main{
  width:100%!important;
  height:auto!important;
  min-height:100vh!important;
  overflow:visible!important;
}

body.posFocusMode #tab-pos{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  height:auto!important;
  min-height:100vh!important;
  padding:8px!important;
  overflow:visible!important;
}

/* Caja administrativa más compacta */
body.posFocusMode #adminCashControl{
  min-height:46px!important;
  margin-bottom:6px!important;
  padding:6px 11px!important;
}

body.posFocusMode #adminCashControl .eyebrow{
  font-size:.63rem!important;
}

body.posFocusMode #adminCashControl h3{
  font-size:.88rem!important;
}

body.posFocusMode #adminCashControl p{
  font-size:.68rem!important;
}

/* Encabezado compacto */
body.posFocusMode .posHeader{
  min-height:62px!important;
  height:auto!important;
  flex-wrap:wrap!important;
  padding:7px 10px!important;
}

body.posFocusMode .posFocusLogo{
  width:45px!important;
  height:45px!important;
  flex-basis:45px!important;
}

body.posFocusMode .posHeader h2{
  font-size:1.2rem!important;
}

body.posFocusMode .posHeader p{
  font-size:.72rem!important;
}

body.posFocusMode .posHeaderActions{
  margin-left:auto!important;
}

body.posFocusMode .posHeaderStats{
  min-width:160px!important;
  padding:6px 9px!important;
}

body.posFocusMode .posExitBtn{
  min-height:38px!important;
}

/* Área principal totalmente utilizable */
body.posFocusMode #tab-pos .posLayout{
  height:calc(100vh - 145px)!important;
  min-height:560px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 365px!important;
  gap:9px!important;
  overflow:hidden!important;
}

/* Catálogo */
body.posFocusMode #tab-pos .posCatalog{
  min-height:0!important;
  height:100%!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}

body.posFocusMode #tab-pos #posProducts{
  flex:1 1 auto!important;
  min-height:0!important;
  height:auto!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  pointer-events:auto!important;
}

body.posFocusMode #tab-pos #posProducts .posProduct{
  pointer-events:auto!important;
  cursor:pointer!important;
}

/* Orden derecha: su propio scroll */
body.posFocusMode #tab-pos .posTicket{
  min-height:0!important;
  height:100%!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  pointer-events:auto!important;
  padding-bottom:18px!important;
}

body.posFocusMode #tab-pos .posTicket > *{
  flex-shrink:0!important;
}

body.posFocusMode #tab-pos .posCart{
  flex:0 1 auto!important;
  min-height:90px!important;
  max-height:210px!important;
  overflow-y:auto!important;
}

/* Botón principal siempre accesible */
body.posFocusMode #tab-pos .posChargeBtn{
  position:sticky!important;
  bottom:0!important;
  z-index:6!important;
  width:100%!important;
  margin-top:8px!important;
  box-shadow:0 -8px 16px rgba(255,255,255,.92)!important;
}

/* Pedidos pendientes debajo, sin bloquear */
body.posFocusMode #tab-pos .posPendingPanel{
  width:100%!important;
  height:auto!important;
  min-height:110px!important;
  max-height:none!important;
  margin-top:8px!important;
  overflow:visible!important;
}

body.posFocusMode #tab-pos .posPendingOrders{
  max-height:90px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
}

/* No permitir capas invisibles sobre el POS */
body.posFocusMode #tab-pos::before,
body.posFocusMode #tab-pos::after{
  pointer-events:none!important;
}

@media(max-width:1100px){
  body.posFocusMode #tab-pos .posLayout{
    grid-template-columns:minmax(0,1fr) 335px!important;
  }
}

@media(max-width:820px){
  body.posFocusMode #tab-pos .posLayout{
    height:auto!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:visible!important;
  }

  body.posFocusMode #tab-pos .posCatalog{
    height:520px!important;
    min-height:520px!important;
  }

  body.posFocusMode #tab-pos .posTicket{
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }

  body.posFocusMode #tab-pos .posChargeBtn{
    position:relative!important;
  }
}

/* ============================================================
   POS / CAJA — COBRO RÁPIDO PROFESIONAL
   ============================================================ */

body.posFocusMode #tab-pos .posTicket{
  overflow:hidden!important;
}

.posDetailsToggle{
  width:100%;
  min-height:36px;
  margin:6px 0;
  border:1px solid #d5c6b2;
  border-radius:9px;
  background:#fff;
  color:#17130f;
  font-weight:900;
  text-align:left;
  padding:7px 10px;
}

.posOptionalDetails{
  display:grid;
  gap:6px;
  overflow:hidden;
  transition:max-height .2s ease,opacity .2s ease;
  max-height:430px;
  opacity:1;
}

.posOptionalDetails.collapsed{
  max-height:0!important;
  opacity:0;
  pointer-events:none;
  margin:0!important;
}

.posQuickCheckoutBtn{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:54px!important;
  margin:7px 0 5px!important;
  padding:10px 13px!important;
  border:0!important;
  border-radius:12px!important;
  background:#111!important;
  color:#fff!important;
  font-size:1rem!important;
  font-weight:900!important;
  box-shadow:0 8px 18px rgba(0,0,0,.16)!important;
}

.posQuickCheckoutBtn strong{
  color:#ffc400;
  font-size:1.25rem;
}

.posQuickCheckoutBtn:hover{
  transform:translateY(-1px);
}

.quickCheckoutCard{
  width:min(470px,calc(100vw - 28px))!important;
  max-height:calc(100vh - 24px)!important;
  overflow-y:auto!important;
  padding:24px!important;
  border-radius:20px!important;
}

.quickCheckoutCard h2{
  margin:4px 0 14px;
  font-size:1.55rem;
}

.quickCheckoutSummary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  padding:14px 16px;
  margin-bottom:14px;
  border-radius:13px;
  background:#14110d;
  color:#fff;
}

.quickCheckoutSummary strong{
  color:#ffc400;
  font-size:1.65rem;
}

.quickCheckoutGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}

.quickCheckoutCard label{
  display:grid;
  gap:6px;
  font-weight:900;
}

.quickCheckoutCard input,
.quickCheckoutCard select{
  width:100%;
  min-height:43px;
  padding:8px 10px;
  border:1px solid #cdbda8;
  border-radius:9px;
  background:#fff;
}

.quickDiscountButtons{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:7px;
  margin:10px 0 15px;
}

.quickDiscountButtons button{
  min-height:40px;
  border:1px solid #e0a900;
  border-radius:9px;
  background:#fff8dc;
  font-weight:900;
}

.quickPaymentMethods{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:7px;
  margin-top:6px;
}

.quickPaymentMethods button{
  min-height:45px;
  padding:6px;
  border:1px solid #cdbda8;
  border-radius:9px;
  background:#fff;
  font-weight:900;
}

.quickPaymentMethods button.active{
  background:#111;
  color:#fff;
  border-color:#111;
}

.quickCashFields{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
  margin-top:14px;
  align-items:end;
}

.quickCashFields.hidden{
  display:none!important;
}

.quickChangeBox{
  min-height:68px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:9px 12px;
  border-radius:10px;
  background:#f3eee5;
}

.quickChangeBox span{
  font-size:.75rem;
  font-weight:800;
}

.quickChangeBox strong{
  font-size:1.25rem;
}

.quickConfirmBtn{
  min-height:52px!important;
  margin-top:16px!important;
  font-size:1rem!important;
  border-radius:11px!important;
}

@media(max-width:560px){
  .quickCheckoutGrid,
  .quickCashFields{
    grid-template-columns:1fr;
  }

  .quickPaymentMethods{
    grid-template-columns:1fr 1fr;
  }
}

/* ============================================================
   CLIENTES — PANTALLA PROFESIONAL SIN PANEL LATERAL
   ============================================================ */

html.customersFocusModeRoot,
body.customersFocusMode{
  overflow:hidden!important;
}

body.customersFocusMode .sidebar,
body.customersFocusMode .topbar{
  display:none!important;
}

body.customersFocusMode .adminShell{
  display:block!important;
  min-height:100vh!important;
}

body.customersFocusMode .adminMain,
body.customersFocusMode main{
  width:100vw!important;
  max-width:none!important;
  height:100vh!important;
  min-height:100vh!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  background:#eee8de!important;
}

body.customersFocusMode #tab-customers{
  position:fixed!important;
  inset:0!important;
  z-index:7000!important;
  display:flex!important;
  flex-direction:column!important;
  width:100vw!important;
  height:100vh!important;
  min-height:0!important;
  padding:12px!important;
  overflow:hidden!important;
  background:#eee8de!important;
}

body.customersFocusMode #tab-customers.hidden{
  display:none!important;
}

.customersFocusHeader{
  flex:0 0 86px!important;
  min-height:86px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  margin:0 0 10px!important;
  padding:12px 15px!important;
  border-radius:16px!important;
  background:#211b14!important;
  color:#fff!important;
  box-shadow:0 9px 25px rgba(0,0,0,.12)!important;
}

.customersHeaderIntro{
  display:flex;
  align-items:center;
  gap:13px;
  min-width:0;
}

.customersFocusLogo{
  width:62px;
  height:62px;
  object-fit:contain;
  flex:0 0 62px;
  border-radius:12px;
  background:#fff;
  padding:4px;
}

.customersFocusHeader h2{
  margin:1px 0 2px!important;
  color:#fff!important;
  font-size:1.45rem!important;
}

.customersFocusHeader p{
  margin:0!important;
  color:#e8ddce!important;
  font-size:.8rem!important;
}

.customersHeaderRight{
  display:flex;
  align-items:center;
  gap:12px;
}

.customersFocusHeader .tablesStats{
  display:grid!important;
  grid-template-columns:repeat(3,95px)!important;
  gap:7px!important;
}

.customersFocusHeader .tablesStats > div{
  padding:7px 9px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:10px!important;
  background:rgba(255,255,255,.07)!important;
}

.customersFocusHeader .tablesStats span{
  color:#e7ddcf!important;
  font-size:.66rem!important;
}

.customersFocusHeader .tablesStats strong{
  color:#ffc400!important;
  font-size:1.15rem!important;
}

.customersExitBtn{
  min-height:42px;
  padding:8px 13px;
  border:1px solid #cdbda8;
  border-radius:10px;
  background:#fff;
  color:#111;
  font-weight:900;
  white-space:nowrap;
}

.customersExitBtn:hover{
  background:#ffc400;
  border-color:#ffc400;
}

body.customersFocusMode #tab-customers .customersGrid{
  flex:1 1 auto!important;
  min-height:0!important;
  height:auto!important;
  display:grid!important;
  grid-template-columns:minmax(360px,430px) minmax(0,1fr)!important;
  gap:11px!important;
  overflow:hidden!important;
}

body.customersFocusMode #tab-customers .customersGrid > .panel{
  height:100%!important;
  min-height:0!important;
  margin:0!important;
  padding:16px!important;
  border-radius:16px!important;
  overflow:hidden!important;
  background:#fff!important;
  box-shadow:0 8px 22px rgba(0,0,0,.06)!important;
}

body.customersFocusMode #customerFormAdmin{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:9px!important;
  align-content:start!important;
  overflow-y:auto!important;
  padding-right:10px!important;
}

body.customersFocusMode #customerFormAdmin h3{
  margin:0 0 3px!important;
  font-size:1.2rem!important;
}

body.customersFocusMode #customerFormAdmin label{
  display:grid!important;
  gap:4px!important;
  margin:0!important;
  font-size:.76rem!important;
  font-weight:900!important;
}

body.customersFocusMode #customerFormAdmin input,
body.customersFocusMode #customerFormAdmin select,
body.customersFocusMode #customerFormAdmin textarea{
  width:100%!important;
  min-height:37px!important;
  padding:7px 9px!important;
  border:1px solid #cebfa9!important;
  border-radius:9px!important;
  background:#fff!important;
}

body.customersFocusMode #customerFormAdmin textarea{
  min-height:60px!important;
  max-height:85px!important;
  resize:vertical!important;
}

body.customersFocusMode #customerFormAdmin .check{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  min-height:36px!important;
}

body.customersFocusMode #customerFormAdmin .check input{
  width:18px!important;
  min-height:18px!important;
}

.customerFormActions{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
  position:sticky!important;
  bottom:0!important;
  padding-top:7px!important;
  background:#fff!important;
}

.customerFormActions button{
  min-height:43px!important;
  border-radius:10px!important;
}

body.customersFocusMode #tab-customers .customersGrid > section.panel{
  display:flex!important;
  flex-direction:column!important;
}

body.customersFocusMode #tab-customers .panelTitle{
  flex:0 0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin-bottom:8px!important;
}

body.customersFocusMode #tab-customers .panelTitle h3{
  margin:0!important;
  font-size:1.15rem!important;
}

body.customersFocusMode #customerAdminSearch{
  width:min(340px,48%)!important;
  min-height:39px!important;
  padding:7px 10px!important;
  border-radius:9px!important;
}

body.customersFocusMode #customerAdminList{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:9px!important;
  align-content:start!important;
  padding-right:5px!important;
}

body.customersFocusMode #customerAdminList .customerAdminCard,
body.customersFocusMode #customerAdminList > article,
body.customersFocusMode #customerAdminList > div{
  min-width:0!important;
}

@media(max-width:1050px){
  body.customersFocusMode #tab-customers .customersGrid{
    grid-template-columns:360px minmax(0,1fr)!important;
  }

  body.customersFocusMode #customerAdminList{
    grid-template-columns:1fr!important;
  }

  .customersFocusHeader .tablesStats{
    grid-template-columns:repeat(3,78px)!important;
  }
}

@media(max-width:760px){
  html.customersFocusModeRoot,
  body.customersFocusMode{
    overflow:auto!important;
  }

  body.customersFocusMode #tab-customers{
    position:relative!important;
    height:auto!important;
    min-height:100vh!important;
    overflow:visible!important;
  }

  .customersFocusHeader{
    height:auto!important;
    flex-wrap:wrap!important;
  }

  .customersHeaderRight{
    width:100%!important;
    justify-content:space-between!important;
  }

  body.customersFocusMode #tab-customers .customersGrid{
    display:flex!important;
    flex-direction:column!important;
    overflow:visible!important;
  }

  body.customersFocusMode #tab-customers .customersGrid > .panel{
    height:auto!important;
    overflow:visible!important;
  }

  body.customersFocusMode #customerFormAdmin{
    grid-template-columns:1fr!important;
    overflow:visible!important;
  }

  body.customersFocusMode #customerAdminList{
    grid-template-columns:1fr!important;
    max-height:none!important;
    overflow:visible!important;
  }

  body.customersFocusMode #customerAdminSearch{
    width:100%!important;
  }
}


/* ============================================================
   V22 — POS / CAJA A PANTALLA COMPLETA Y COBRO SIEMPRE VISIBLE
   ============================================================ */
html.posFocusModeRoot,body.posFocusMode{height:100%!important;min-height:0!important;overflow:hidden!important}
body.posFocusMode .adminMain,body.posFocusMode main{height:100vh!important;min-height:0!important;overflow:hidden!important}
body.posFocusMode #tab-pos{height:100vh!important;min-height:0!important;overflow:hidden!important;padding:5px!important;display:flex!important;flex-direction:column!important;gap:5px!important}
body.posFocusMode #adminCashControl{flex:0 0 66px!important;min-height:66px!important;margin:0!important;padding:7px 12px!important}
body.posFocusMode .posHeader{flex:0 0 84px!important;min-height:84px!important;margin:0!important;padding:7px 10px!important}
body.posFocusMode #tab-pos .posLayout{flex:1 1 auto!important;height:auto!important;min-height:0!important;overflow:hidden!important;grid-template-columns:minmax(0,1fr) minmax(350px,36vw)!important;gap:7px!important}
body.posFocusMode #tab-pos .posCatalog{height:100%!important;min-height:0!important;padding:8px!important;overflow:hidden!important}
body.posFocusMode #tab-pos .posCatalogTop{flex:0 0 auto!important;margin-bottom:5px!important}
body.posFocusMode #tab-pos #posProducts{flex:1 1 auto!important;height:auto!important;min-height:0!important;overflow-y:auto!important;grid-auto-rows:128px!important}
body.posFocusMode #tab-pos #posProducts .posProduct{height:128px!important;min-height:128px!important;max-height:128px!important}
body.posFocusMode #tab-pos .posTicket{height:100%!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;padding:8px 9px 10px!important;display:flex!important;flex-direction:column!important;gap:4px!important}
body.posFocusMode #tab-pos .posTicketTitle{padding-bottom:6px!important}
body.posFocusMode #tab-pos .posCart{flex:0 1 92px!important;min-height:44px!important;max-height:92px!important;padding:5px 0!important}
body.posFocusMode #tab-pos .posTotals{padding:6px 0!important;margin:0!important;gap:4px!important}
body.posFocusMode #tab-pos .preDiscountBox{padding:5px!important}
body.posFocusMode #tab-pos .posEssentialData{display:grid!important;grid-template-columns:1fr 1fr!important;gap:4px!important}
body.posFocusMode #tab-pos .posEssentialData label{font-size:.68rem!important}
body.posFocusMode #tab-pos .posEssentialData input,body.posFocusMode #tab-pos .posEssentialData select{height:30px!important;min-height:30px!important;padding:3px 6px!important}
body.posFocusMode #tab-pos .posDetailsToggle{min-height:30px!important;margin:2px 0!important;padding:4px 8px!important}
body.posFocusMode #tab-pos .compactPaymentNotice{min-height:34px!important;padding:4px 7px!important;margin:1px 0!important;font-size:.7rem!important}
body.posFocusMode #tab-pos .posPendingInsideTicket{order:20!important;flex:0 0 auto!important;width:100%!important;min-height:104px!important;max-height:132px!important;margin:2px 0!important;padding:6px 7px!important;overflow:hidden!important;background:#fff9e8!important;border:2px solid #f4b000!important}
body.posFocusMode #tab-pos .posPendingHeader{margin:0 0 4px!important;align-items:center!important}
body.posFocusMode #tab-pos .posPendingHeader h3{font-size:.88rem!important;margin:0!important}
body.posFocusMode #tab-pos .posPendingHeader p{display:none!important}
body.posFocusMode #tab-pos .posPendingActions{display:flex!important;align-items:center!important;gap:5px!important}
body.posFocusMode #tab-pos .posPendingActions button{min-height:28px!important;padding:3px 7px!important;font-size:.7rem!important}
body.posFocusMode #tab-pos .posPendingOrders{display:flex!important;gap:5px!important;max-height:78px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:0 0 3px!important}
body.posFocusMode #tab-pos .posPendingCard{flex:0 0 245px!important;min-height:68px!important;padding:6px!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:5px!important}
body.posFocusMode #tab-pos .posPendingCard.fromTable{border:2px solid #f4a900!important;background:#fff7dc!important}
body.posFocusMode #tab-pos .posPendingInfo p{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:125px!important;margin:2px 0!important}
body.posFocusMode #tab-pos .posPendingPayment strong{font-size:1rem!important}
body.posFocusMode #tab-pos .posPayNowBtn{min-height:30px!important;padding:4px 7px!important;font-size:.72rem!important;white-space:nowrap!important}
body.posFocusMode #tab-pos .posPrimaryActions{order:30!important;position:sticky!important;bottom:0!important;z-index:20!important;background:#fff!important;padding-top:3px!important}
body.posFocusMode #tab-pos .posChargeBtn{position:relative!important;bottom:auto!important;width:100%!important;min-height:44px!important;height:44px!important;margin:0!important;box-shadow:0 -4px 12px rgba(255,255,255,.95)!important}

@media(max-height:720px) and (min-width:821px){
  body.posFocusMode #adminCashControl{flex-basis:58px!important;min-height:58px!important}
  body.posFocusMode .posHeader{flex-basis:76px!important;min-height:76px!important}
  body.posFocusMode #tab-pos #posProducts{grid-auto-rows:118px!important}
  body.posFocusMode #tab-pos #posProducts .posProduct{height:118px!important;min-height:118px!important;max-height:118px!important}
  body.posFocusMode #tab-pos .posPendingInsideTicket{min-height:94px!important;max-height:112px!important}
  body.posFocusMode #tab-pos .posPendingOrders{max-height:66px!important}
  body.posFocusMode #tab-pos .posCart{max-height:72px!important}
}

@media(max-width:820px){
  html.posFocusModeRoot,body.posFocusMode{overflow:auto!important;height:auto!important}
  body.posFocusMode .adminMain,body.posFocusMode main{height:auto!important;overflow:visible!important}
  body.posFocusMode #tab-pos{height:auto!important;min-height:100vh!important;overflow:visible!important}
  body.posFocusMode #tab-pos .posLayout{display:flex!important;flex-direction:column!important;overflow:visible!important}
  body.posFocusMode #tab-pos .posCatalog{height:510px!important}
  body.posFocusMode #tab-pos .posTicket{height:auto!important;overflow:visible!important}
  body.posFocusMode #tab-pos .posPendingInsideTicket{max-height:none!important}
  body.posFocusMode #tab-pos .posPrimaryActions{position:sticky!important;bottom:0!important}
}


/* ============================================================
   V23 — PEDIDOS POR COBRAR ARRIBA Y BOTÓN SIEMPRE VISIBLE
   ============================================================ */
body.posFocusMode #tab-pos .posTicket{
  overflow:hidden!important;
}
body.posFocusMode #tab-pos .posPendingTopV23{
  order:1!important;
  flex:0 0 auto!important;
  min-height:108px!important;
  max-height:142px!important;
  margin:0 0 4px!important;
  padding:7px!important;
  overflow:hidden!important;
  border:2px solid #f4b000!important;
  background:#fff9e8!important;
}
body.posFocusMode #tab-pos .posTicketTitle{order:0!important;flex:0 0 auto!important}
body.posFocusMode #tab-pos .posCart{order:2!important;flex:0 1 62px!important;max-height:62px!important;min-height:30px!important;overflow:auto!important}
body.posFocusMode #tab-pos .posTotals{order:3!important;flex:0 0 auto!important}
body.posFocusMode #tab-pos .preDiscountBox{order:4!important}
body.posFocusMode #tab-pos .posEssentialData{order:5!important}
body.posFocusMode #tab-pos .posDetailsToggle{order:6!important}
body.posFocusMode #tab-pos .posOptionalDetails{order:7!important}
body.posFocusMode #tab-pos .compactPaymentNotice{order:8!important}
body.posFocusMode #tab-pos .posPrimaryActions{order:9!important;margin-top:auto!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingOrders{
  display:flex!important;
  gap:6px!important;
  max-height:78px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingCard{
  flex:0 0 100%!important;
  min-height:68px!important;
  max-height:76px!important;
  padding:6px 7px!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingPayment{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-end!important;
  justify-content:center!important;
  gap:2px!important;
}
body.posFocusMode #tab-pos .posPendingTopV23 .posPayNowBtn{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  min-width:132px!important;
  min-height:34px!important;
  height:34px!important;
  padding:4px 10px!important;
  font-size:.78rem!important;
  font-weight:900!important;
  white-space:nowrap!important;
}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingInfo h4,
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingInfo p,
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingInfo small{margin:0!important;line-height:1.15!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingHeader{margin-bottom:3px!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingHeader h3{font-size:.95rem!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingHeader p{display:none!important}

@media(max-height:680px) and (min-width:821px){
  body.posFocusMode #adminCashControl{flex-basis:54px!important;min-height:54px!important;padding:5px 10px!important}
  body.posFocusMode .posHeader{flex-basis:72px!important;min-height:72px!important;padding:5px 8px!important}
  body.posFocusMode #tab-pos .posPendingTopV23{min-height:100px!important;max-height:112px!important}
  body.posFocusMode #tab-pos .posPendingTopV23 .posPendingOrders{max-height:66px!important}
  body.posFocusMode #tab-pos .posCart{max-height:42px!important;min-height:24px!important}
  body.posFocusMode #tab-pos .posTotals{padding:3px 0!important;gap:2px!important}
  body.posFocusMode #tab-pos .preDiscountBox{padding:3px!important}
  body.posFocusMode #tab-pos .compactPaymentNotice{display:none!important}
  body.posFocusMode #tab-pos .posDetailsToggle{display:none!important}
  body.posFocusMode #tab-pos .posOptionalDetails{display:none!important}
}

/* ============================================================
   V24 — CAJA LEGIBLE: TAMAÑO NORMAL + SCROLL DONDE CORRESPONDE
   ============================================================ */
body.posFocusMode{
  font-size:16px!important;
}
body.posFocusMode #tab-pos{
  padding:8px!important;
  gap:8px!important;
}
body.posFocusMode #adminCashControl{
  flex:0 0 72px!important;
  min-height:72px!important;
  padding:10px 16px!important;
}
body.posFocusMode #adminCashControl .eyebrow{font-size:.72rem!important}
body.posFocusMode #adminCashControl h3{font-size:1rem!important;margin:2px 0!important}
body.posFocusMode #adminCashControl p{font-size:.78rem!important;margin:2px 0!important}
body.posFocusMode .posHeader{
  flex:0 0 96px!important;
  min-height:96px!important;
  padding:10px 14px!important;
}
body.posFocusMode .posFocusLogo{width:52px!important;height:52px!important;flex-basis:52px!important}
body.posFocusMode .posHeader .eyebrow{font-size:.75rem!important}
body.posFocusMode .posHeader h2{font-size:1.45rem!important;margin:2px 0 4px!important}
body.posFocusMode .posHeader p{font-size:.82rem!important}
body.posFocusMode .posHeaderStats{min-width:175px!important;padding:9px 12px!important}
body.posFocusMode .posHeaderStats span{font-size:.78rem!important}
body.posFocusMode .posHeaderStats b{font-size:.9rem!important}
body.posFocusMode .posHeaderStats strong{font-size:1.35rem!important}
body.posFocusMode #tab-pos .posLayout{
  grid-template-columns:minmax(0,1fr) minmax(360px,38vw)!important;
  gap:10px!important;
}
body.posFocusMode #tab-pos .posCatalog{padding:10px!important}
body.posFocusMode #tab-pos .posCatalogTop input{height:42px!important;font-size:.95rem!important;padding:8px 12px!important}
body.posFocusMode #tab-pos .categoryChips button{font-size:.84rem!important;min-height:38px!important;padding:7px 13px!important}
body.posFocusMode #tab-pos #posProducts{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  grid-auto-rows:172px!important;
  gap:10px!important;
  overflow-y:auto!important;
  align-content:start!important;
}
body.posFocusMode #tab-pos #posProducts .posProduct{
  height:172px!important;
  min-height:172px!important;
  max-height:172px!important;
}
body.posFocusMode #tab-pos #posProducts .posProduct img,
body.posFocusMode #tab-pos #posProducts .posProductNoImage{
  height:88px!important;
  min-height:88px!important;
  max-height:88px!important;
  flex-basis:88px!important;
}
body.posFocusMode #tab-pos #posProducts .posProductInfo{padding:7px 9px!important}
body.posFocusMode #tab-pos #posProducts .posProductInfo small{font-size:.72rem!important;margin-bottom:2px!important}
body.posFocusMode #tab-pos #posProducts .posProductInfo b{
  min-height:31px!important;
  max-height:31px!important;
  font-size:.88rem!important;
  line-height:1.08!important;
  overflow:hidden!important;
}
body.posFocusMode #tab-pos #posProducts .posProductInfo strong{font-size:1rem!important;margin-top:5px!important}

body.posFocusMode #tab-pos .posTicket{
  padding:11px 12px!important;
  gap:7px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}
body.posFocusMode #tab-pos .posTicketTitle h3{font-size:1.45rem!important}
body.posFocusMode #tab-pos .posTicketTitle .eyebrow{font-size:.72rem!important}
body.posFocusMode #tab-pos .posClearBtn{font-size:.85rem!important;padding:8px 10px!important}
body.posFocusMode #tab-pos .posPendingTopV23{
  min-height:138px!important;
  max-height:158px!important;
  padding:9px 10px!important;
  overflow:hidden!important;
}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingHeader h3{font-size:1rem!important}
body.posFocusMode #tab-pos .posPendingTopV23 .pendingCount{font-size:.78rem!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingOrders{max-height:104px!important;gap:8px!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingCard{
  min-height:92px!important;
  max-height:100px!important;
  padding:8px 9px!important;
}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingInfo h4{font-size:.95rem!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingInfo p{font-size:.78rem!important;max-width:175px!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingInfo small{font-size:.72rem!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingPayment strong{font-size:1.15rem!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPayNowBtn{
  min-width:145px!important;
  min-height:42px!important;
  height:42px!important;
  font-size:.9rem!important;
  padding:7px 12px!important;
}
body.posFocusMode #tab-pos .posCart{min-height:56px!important;max-height:95px!important;font-size:.84rem!important}
body.posFocusMode #tab-pos .posTotals{font-size:.9rem!important;padding:7px 0!important}
body.posFocusMode #tab-pos .posTotals strong{font-size:1.35rem!important}
body.posFocusMode #tab-pos .preDiscountBox{font-size:.82rem!important;padding:7px!important}
body.posFocusMode #tab-pos .quickDiscounts button{font-size:.82rem!important;min-height:36px!important}
body.posFocusMode #tab-pos .posEssentialData label{font-size:.78rem!important}
body.posFocusMode #tab-pos .posEssentialData input,
body.posFocusMode #tab-pos .posEssentialData select{height:36px!important;min-height:36px!important;font-size:.82rem!important}
body.posFocusMode #tab-pos .posChargeBtn{min-height:48px!important;height:48px!important;font-size:1rem!important}

@media(max-width:1100px) and (min-width:821px){
  body.posFocusMode #tab-pos .posLayout{grid-template-columns:minmax(0,1fr) 350px!important}
  body.posFocusMode #tab-pos #posProducts{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-height:700px) and (min-width:821px){
  body.posFocusMode #adminCashControl{flex-basis:64px!important;min-height:64px!important}
  body.posFocusMode .posHeader{flex-basis:84px!important;min-height:84px!important}
  body.posFocusMode #tab-pos #posProducts{grid-auto-rows:160px!important}
  body.posFocusMode #tab-pos #posProducts .posProduct{height:160px!important;min-height:160px!important;max-height:160px!important}
  body.posFocusMode #tab-pos #posProducts .posProduct img,
  body.posFocusMode #tab-pos #posProducts .posProductNoImage{height:78px!important;min-height:78px!important;max-height:78px!important}
}


/* ===== V26: POS LEGIBLE, SCROLL NORMAL ===== */
html.posFocusModeRoot,body.posFocusMode{height:auto!important;min-height:100%!important;overflow-y:auto!important;overflow-x:hidden!important}
body.posFocusMode .adminMain,body.posFocusMode main{height:auto!important;min-height:100vh!important;overflow:visible!important}
body.posFocusMode #tab-pos{height:auto!important;min-height:100vh!important;overflow:visible!important;padding:12px!important;display:block!important}
body.posFocusMode #adminCashControl{min-height:86px!important;height:auto!important;margin-bottom:12px!important;padding:14px 18px!important}
body.posFocusMode .posHeader{min-height:112px!important;height:auto!important;margin-bottom:12px!important;padding:14px 18px!important}
body.posFocusMode #tab-pos .posLayout{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(380px,420px)!important;gap:14px!important;height:auto!important;min-height:760px!important;overflow:visible!important;align-items:start!important}
body.posFocusMode #tab-pos .posCatalog{height:760px!important;min-height:760px!important;overflow:hidden!important;padding:14px!important;display:flex!important;flex-direction:column!important}
body.posFocusMode #tab-pos #posProducts{grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-auto-rows:184px!important;gap:10px!important;overflow-y:auto!important;overflow-x:hidden!important;padding-right:5px!important}
body.posFocusMode #tab-pos #posProducts .posProduct{height:184px!important;min-height:184px!important;max-height:184px!important}
body.posFocusMode #tab-pos #posProducts .posProduct img,body.posFocusMode #tab-pos #posProducts .posProductNoImage{height:92px!important;min-height:92px!important;max-height:92px!important}
body.posFocusMode #tab-pos #posProducts .posProductInfo small{font-size:.82rem!important}
body.posFocusMode #tab-pos #posProducts .posProductInfo b{font-size:.98rem!important;line-height:1.15!important}
body.posFocusMode #tab-pos #posProducts .posProductInfo strong{font-size:1.1rem!important}
body.posFocusMode #tab-pos .posCatalogTop input{height:46px!important;font-size:1rem!important}
body.posFocusMode #tab-pos .categoryChips button{font-size:.9rem!important;min-height:40px!important}
body.posFocusMode #tab-pos .posTicket{height:auto!important;max-height:none!important;min-height:760px!important;overflow:visible!important;padding:15px!important;position:sticky!important;top:10px!important;display:block!important}
body.posFocusMode #tab-pos .posPendingTopV23{min-height:150px!important;max-height:none!important;height:auto!important;overflow:visible!important;margin:10px 0!important;padding:10px!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingOrders{display:block!important;max-height:250px!important;overflow-y:auto!important;overflow-x:hidden!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingCard{width:100%!important;min-height:96px!important;margin-bottom:8px!important;padding:10px!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingInfo h4{font-size:1rem!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPendingInfo p{font-size:.86rem!important;max-width:none!important;white-space:normal!important}
body.posFocusMode #tab-pos .posPendingTopV23 .posPayNowBtn{min-height:42px!important;font-size:.9rem!important;padding:8px 12px!important}
body.posFocusMode #tab-pos .posCart{min-height:90px!important;max-height:220px!important;overflow-y:auto!important;font-size:.9rem!important}
body.posFocusMode #tab-pos .posTotals{font-size:.95rem!important;padding:10px 0!important}
body.posFocusMode #tab-pos .preDiscountBox{font-size:.9rem!important;padding:10px!important}
body.posFocusMode #tab-pos .posEssentialData{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
body.posFocusMode #tab-pos .posEssentialData label{font-size:.86rem!important}
body.posFocusMode #tab-pos .posEssentialData input,body.posFocusMode #tab-pos .posEssentialData select{height:42px!important;min-height:42px!important;font-size:.9rem!important}
body.posFocusMode #tab-pos .posPrimaryActions{position:static!important;margin-top:12px!important}
body.posFocusMode #tab-pos .posChargeBtn{min-height:52px!important;height:52px!important;font-size:1rem!important;position:static!important}
.cashControlActions{flex-wrap:wrap!important}
.cashExpenseBtn{background:#fff1f0!important;color:#a3261d!important;border:1px solid #e7a39d!important;font-weight:800!important}
.cashReportBtn{font-weight:800!important}
.cashExpenseModalCard{max-width:520px!important}
.cashExpenseModalCard label{display:block;margin:10px 0;font-weight:800}
.cashExpenseModalCard input,.cashExpenseModalCard select,.cashExpenseModalCard textarea{width:100%;margin-top:5px}
.cashExpenseModalCard textarea{min-height:90px}
.cashReportModalCard{width:min(960px,94vw)!important;max-width:960px!important;max-height:92vh!important;overflow:auto!important}
.cashReportPaper{background:#fff;padding:22px;color:#111}
.cashReportHeader{text-align:center;border-bottom:2px solid #111;padding-bottom:12px;margin-bottom:16px}
.cashReportHeader h2{font-size:1.8rem;margin:5px 0}
.cashReportTotals{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0 22px}
.cashReportTotals>div{border:1px solid #ddd;border-radius:12px;padding:12px}.cashReportTotals span{display:block;font-size:.82rem;color:#666}.cashReportTotals strong{font-size:1.25rem}
.cashReportTable{width:100%;border-collapse:collapse;margin:8px 0 22px}.cashReportTable th,.cashReportTable td{border-bottom:1px solid #ddd;padding:9px;text-align:left;font-size:.9rem}.cashReportTable th{background:#f6f1e7}
@media(max-width:900px){body.posFocusMode #tab-pos .posLayout{display:flex!important;flex-direction:column!important}.cashReportTotals{grid-template-columns:1fr}.cashReportTable{font-size:.82rem}}
@media print{body *{visibility:hidden!important}#cashReportModal,#cashReportModal *{visibility:visible!important}#cashReportModal{position:absolute!important;inset:0!important;background:#fff!important}.cashReportModalCard{box-shadow:none!important;border:0!important;max-width:none!important;width:100%!important}.cashReportModalCard>.close,.cashReportModalCard>.receiptActions{display:none!important}}

/* V29 PUBLIC - marcador de archivo correcto */
#v18VersionMarker{z-index:99999!important}


/* ===== V35 CAJERO LIMPIO SIN TOCAR PANTALLA AMPLIA ===== */
body.employeeMode[data-employee-role="cashier"] #adminView.adminShell{
  grid-template-columns:minmax(0,1fr)!important;
}
body.employeeMode[data-employee-role="cashier"] #adminView>.sidebar,
body.employeeMode[data-employee-role="cashier"] #adminView .adminTop{
  display:none!important;
}
body.employeeMode[data-employee-role="cashier"] #adminView .adminContent{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:18px clamp(16px,2.2vw,30px) 30px!important;
}
body.employeeMode[data-employee-role="cashier"] #tab-pos{
  width:100%!important;
}
body.employeeMode[data-employee-role="cashier"] .posHeader{
  margin-top:0!important;
}
body.employeeMode[data-employee-role="cashier"] #exitPosFocusBtn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  white-space:nowrap!important;
}
@media(max-width:760px){
  body.employeeMode[data-employee-role="cashier"] #adminView .adminContent{padding:10px!important;}
}


/* ===== V37 PANTALLA AMPLIA CON REGRESO VISIBLE ===== */
body.moduleFocusV21 #adminView.adminV21 .sidebar{
  display:none!important;
}
body.moduleFocusV21 #adminView.adminV21 .adminTop{
  display:flex!important;
  position:sticky!important;
  top:0!important;
  z-index:5000!important;
  min-height:54px!important;
  margin:0 0 8px!important;
  padding:8px 10px!important;
  justify-content:flex-end!important;
  background:rgba(244,240,232,.97)!important;
  border-bottom:1px solid #ded6c8!important;
}
body.moduleFocusV21 #adminView.adminV21 .adminTopTitle,
body.moduleFocusV21 #adminView.adminV21 .cloudStatus{
  display:none!important;
}
body.moduleFocusV21 #adminView.adminV21 .adminTopActions{
  display:flex!important;
  margin-left:auto!important;
}
body.moduleFocusV21 #adminView.adminV21 #toggleModuleFocus{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:38px!important;
  padding:8px 14px!important;
  border:1px solid #cfbea3!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#111!important;
  font-weight:900!important;
  cursor:pointer!important;
}
body.moduleFocusV21 #adminView.adminV21 .adminContent{
  margin-left:0!important;
  width:100%!important;
  max-width:none!important;
  padding:10px!important;
}
body.moduleFocusV21 #adminView.adminV21 .tab:not(.hidden){
  min-height:calc(100vh - 72px)!important;
}


/* ===== V38 INFORME DE CAJA POR CAJERO + EGRESOS VISIBLES ===== */
.cashQuickActionsV27{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
  margin:10px 0 12px!important;
}
.cashExpenseBtnV27,.cashReportBtnV27{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  min-height:48px!important;
  border:0!important;
  border-radius:12px!important;
  font-weight:900!important;
  font-size:14px!important;
  padding:10px 12px!important;
}
.cashExpenseBtnV27{background:#c9362b!important;color:#fff!important}
.cashReportBtnV27{background:#11100e!important;color:#fff!important}
.cashReportControlsV38{
  display:grid;
  grid-template-columns:minmax(230px,1fr) 150px minmax(190px,240px) auto;
  gap:12px;
  align-items:end;
  padding:18px 20px;
  border-bottom:1px solid #e7dfd2;
  background:#fffaf0;
}
.cashReportControlsV38 h2{margin:3px 0 2px;font-size:1.45rem}
.cashReportControlsV38 p{margin:0}
.cashReportControlsV38 label{font-weight:800;font-size:.86rem}
.cashReportControlsV38 input,.cashReportControlsV38 select{width:100%;margin-top:5px;min-height:42px}
.cashReportControlsV38 button{min-height:42px;white-space:nowrap}
.cashReportSubtitleV38{text-align:center;margin:-6px 0 14px;color:#555;font-weight:700}
.cashReportPaymentGridV38{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:10px 0 20px}
.cashReportPaymentGridV38>div{border:1px solid #e6dfd3;border-radius:10px;padding:9px;background:#faf7f0}
.cashReportPaymentGridV38 span{display:block;font-size:.75rem;color:#666}
.cashReportPaymentGridV38 strong{font-size:1rem}
@media(max-width:850px){
  .cashQuickActionsV27{grid-template-columns:1fr!important}
  .cashReportControlsV38{grid-template-columns:1fr!important}
  .cashReportPaymentGridV38{grid-template-columns:repeat(2,1fr)}
}
@media print{
  .cashReportControlsV38{display:none!important}
}


/* ===== V40 INFORME POR PERIODO ===== */
.cashReportControlsV38 label{min-width:150px}


/* V42 — Fondo inicial / sueltos al abrir caja */
#openCashRegisterModal{z-index:10020!important;}
#openCashRegisterModal .modalCard{max-width:440px!important;}
#cashRegisterOpeningCash{font-size:1.35rem!important;font-weight:900!important;text-align:center!important;}
