:root{--bg:#09090a;--panel:#171719;--panel2:#1d1d20;--line:#2d2d32;--text:#f5f5f6;--muted:#9b9da4;--yellow:#ffc400;--red:#ee1f29;--green:#57ce69;--orange:#ff942f;--sidebar:246px;--radius:14px;--shadow:0 12px 34px rgba(0,0,0,.2)}
*{box-sizing:border-box}html,body{margin:0;width:100%;max-width:100%;overflow-x:hidden}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--text);font:14px/1.45 Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}img{max-width:100%;display:block}.app-shell{display:flex;min-height:100dvh;min-width:0}.sidebar{position:fixed;inset:0 auto 0 0;z-index:80;width:var(--sidebar);overflow:auto;background:#050506;border-right:1px solid #222226}.sidebar-head{position:relative}.logo{height:96px;display:flex;align-items:center;justify-content:center;padding:13px 16px;border-bottom:1px solid #222226}.logo img{width:100%;max-height:70px;object-fit:contain}.sidebar-close{display:none}.nav{padding:9px}.nav-link{display:flex;align-items:center;gap:12px;min-height:47px;margin:2px 0;padding:11px 12px;border:1px solid transparent;border-radius:10px;color:#ddd;transition:.15s}.nav-link:hover{background:#151517;border-color:#29292d}.nav-link.active{background:linear-gradient(100deg,#a90a11,#e31822);border-color:#ed3038;color:#fff}.nav-icon{width:23px;text-align:center;font-size:17px}.content{width:calc(100% - var(--sidebar));max-width:calc(100% - var(--sidebar));min-width:0;margin-left:var(--sidebar)}.topbar{position:sticky;top:0;z-index:50;min-height:70px;display:flex;align-items:center;gap:14px;padding:10px 20px;background:rgba(7,7,8,.95);border-bottom:1px solid #232327;backdrop-filter:blur(10px)}.menu-toggle{display:none}.icon-button{border:1px solid #333338;background:#151517;color:#fff;border-radius:9px;cursor:pointer}.top-title{flex:1;min-width:0;font-size:21px;font-weight:900;letter-spacing:.01em}.top-title span,.accent{color:var(--yellow)}.userbox{display:flex;align-items:center;gap:8px;min-width:0;white-space:nowrap}.user-role{padding:3px 7px;border-radius:999px;background:#202024;color:#aaa;font-size:10px;text-transform:uppercase}.logout{margin-left:3px;color:#111;background:var(--yellow);padding:7px 10px;border-radius:8px;font-weight:800}.main{width:100%;max-width:1500px;min-width:0;margin:0 auto;padding:20px}.page-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:14px}.page-head h1{margin:0;font-size:24px;line-height:1.15}.page-head p{margin:4px 0 0;color:var(--muted);font-size:12px}.rate-chip,.status{padding:8px 11px;border:1px solid #303036;border-radius:999px;background:#121214;color:#bbb;font-size:12px}.grid{display:grid;gap:14px;min-width:0}.grid>*{min-width:0}.kpis{grid-template-columns:repeat(4,minmax(0,1fr))}.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.mt{margin-top:14px}.mt-sm{margin-top:10px}.card{min-width:0;overflow:hidden;padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,var(--panel2),var(--panel));box-shadow:var(--shadow)}.card-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid #2d2d32}.card-title h2,.card h2{margin:0;font-size:14px}.card-title a{color:var(--yellow);font-size:11px;font-weight:800}.kpi{min-height:108px;display:flex;flex-direction:column;justify-content:center}.kpi>span{color:var(--muted);font-size:11px;font-weight:750;text-transform:uppercase}.kpi>strong{margin-top:6px;font-size:clamp(23px,2vw,30px);line-height:1.1}.kpi>small{margin-top:7px;color:#898b91}.big-number{font-size:clamp(28px,3vw,38px);font-weight:900}.eyebrow{color:var(--muted);font-size:10px;text-transform:uppercase;font-weight:800}.muted{color:var(--muted)}.danger{color:#ff5961}.success{color:#66d978}.metric-row{display:flex;align-items:center;justify-content:space-between;gap:14px;min-width:0;padding:10px 0;border-bottom:1px solid #2c2c31}.metric-row:last-child{border-bottom:0}.metric-row>*{min-width:0}.pill{display:inline-flex;align-items:center;justify-content:center;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:850;white-space:nowrap}.pill-red{background:#761116;color:#ffb8bc}.pill-orange{background:#683907;color:#ffc487}.pill-yellow{background:#5a4706;color:#ffe88b}.pill-green{background:#124c1e;color:#a8efb4}.field{margin-bottom:12px}.form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;align-items:end}.form-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr))}.span-2{grid-column:span 2}.form-actions{display:flex;gap:8px;align-items:center}label{display:block;margin:0 0 5px;color:#b6b7bd;font-size:11px;font-weight:700}input,select,textarea{width:100%;min-width:0;min-height:42px;padding:9px 10px;border:1px solid #3a3a40;border-radius:9px;outline:none;color:#fff;background:#0e0e10}textarea{min-height:82px;resize:vertical}input:focus,select:focus,textarea:focus{border-color:#d5a700;box-shadow:0 0 0 3px rgba(255,196,0,.1)}button:disabled,input:disabled{opacity:.5;cursor:not-allowed}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:9px 13px;border:1px solid #44444a;border-radius:9px;background:#2c2c31;color:#fff;font-weight:800;cursor:pointer;text-align:center}.btn:hover{filter:brightness(1.08)}.btn-yellow{background:var(--yellow);border-color:#ffd12e;color:#111}.btn-red{background:var(--red);border-color:#ff3d46}.btn-green{background:#167e2a;border-color:#28a840}.btn-sm{min-height:34px;padding:6px 9px;font-size:11px}.btn-lg{min-height:48px;font-size:16px}.btn-block{width:100%}.toolbar,.row-actions,.compact-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.toolbar input{max-width:380px}.row-actions form{margin:0}.table-wrap{width:100%;max-width:100%;overflow:auto;-webkit-overflow-scrolling:touch}.table-wrap table{min-width:640px}table{width:100%;border-collapse:collapse;font-size:12px}th,td{padding:10px 9px;border-bottom:1px solid #2e2e33;text-align:left;vertical-align:middle}th{color:#b9bac0;background:#101012;font-size:10px;text-transform:uppercase;letter-spacing:.03em;white-space:nowrap}td{overflow-wrap:anywhere}td small{display:block;margin-top:3px;color:#868890}.flash{margin-bottom:12px;padding:11px 13px;border-radius:9px}.flash-success{background:#123b1a;border:1px solid #287c35}.flash-error{background:#4a1417;border:1px solid #a02b31}.flash-info{background:#142c49;border:1px solid #2d5b91}.narrow{max-width:620px}.narrow-wide{max-width:900px}.pos-layout{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(330px,.75fr);gap:14px;min-width:0}.scan-form{display:flex;gap:8px}.scan-form input{flex:1}.pos-items{min-height:480px}.pos-table{min-height:250px}.qty-input{width:90px;min-height:36px}.pos-bottom{display:flex;align-items:end;gap:8px;flex-wrap:wrap;margin-top:10px}.discount-field{width:220px;max-width:100%}.checkout-total{padding:18px 0}.checkout-total span{display:block;color:var(--muted);font-size:11px;text-transform:uppercase}.checkout-total strong{display:block;margin-top:4px;color:#ff5159;font-size:38px;line-height:1.05}.pay-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.app-footer{display:flex;justify-content:space-between;gap:10px;margin-top:18px;padding:13px 2px 2px;border-top:1px solid #1e1e21;color:#686a70;font-size:10px}.sidebar-overlay{display:none}.login-page{min-height:100dvh;display:grid;place-items:center;padding:18px;background:radial-gradient(circle at 50% -10%,rgba(255,196,0,.18),transparent 35%),#070708}.login-card{width:min(420px,100%);padding:25px;border:1px solid #333338;border-radius:16px;background:#111113;box-shadow:0 28px 70px rgba(0,0,0,.4)}.login-card img{width:100%;max-height:96px;object-fit:contain;margin-bottom:18px}.login-card h1{margin:0;font-size:21px}.login-card p{margin:4px 0 18px}
@media(max-width:1150px){.kpis,.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}.cols-3{grid-template-columns:1fr}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pos-layout{grid-template-columns:1fr}}
@media(max-width:900px){body.menu-open{overflow:hidden}.sidebar{width:min(86vw,310px);transform:translateX(-103%);transition:transform .22s ease;z-index:1000;box-shadow:18px 0 40px rgba(0,0,0,.55)}body.menu-open .sidebar{transform:translateX(0)}.sidebar-head{display:flex;align-items:center}.sidebar-head .logo{flex:1;height:82px;border-bottom:0}.sidebar-close{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;margin-right:9px;font-size:25px}.sidebar-overlay{position:fixed;inset:0;z-index:999;display:block;visibility:hidden;opacity:0;background:rgba(0,0,0,.68);transition:.2s}body.menu-open .sidebar-overlay{visibility:visible;opacity:1}.content{width:100%;max-width:100%;margin-left:0}.menu-toggle{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;font-size:19px}.topbar{min-height:62px;padding:9px 11px;padding-top:max(9px,env(safe-area-inset-top))}.top-title{font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-role{display:none}.main{padding:12px}}
@media(max-width:720px){.main{padding:9px}.page-head{align-items:flex-start}.page-head h1{font-size:21px}.grid,.kpis{gap:9px}.cols-2,.cols-3,.cols-4{grid-template-columns:1fr}.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.card{padding:13px;border-radius:11px}.form-grid,.form-grid.compact{grid-template-columns:1fr}.span-2{grid-column:span 1}.form-actions,.toolbar,.compact-toolbar,.scan-form,.pos-bottom{align-items:stretch}.toolbar input,.discount-field{width:100%;max-width:none}.toolbar .btn,.compact-toolbar .btn,.scan-form .btn{flex:1}.pay-grid{grid-template-columns:repeat(2,minmax(0,1fr))}input,select,textarea{font-size:16px;min-height:44px}.btn{min-height:43px}.table-wrap{overflow:visible}.table-wrap table{min-width:0}table.mobile-cards{display:block;font-size:12px}table.mobile-cards thead{display:none}table.mobile-cards tbody{display:grid;gap:8px}table.mobile-cards tr{display:block;padding:4px 9px;border:1px solid #303036;border-radius:10px;background:#101012}table.mobile-cards td{display:grid;grid-template-columns:minmax(92px,38%) minmax(0,1fr);align-items:center;gap:8px;min-height:38px;padding:7px 2px;border-bottom:1px solid #27272b;text-align:right}table.mobile-cards td:last-child{border-bottom:0}table.mobile-cards td::before{content:attr(data-label);color:#92949a;font-size:9px;font-weight:850;text-align:left;text-transform:uppercase;overflow-wrap:anywhere}table.mobile-cards td input,table.mobile-cards td select{width:min(100%,150px);margin-left:auto}.row-actions{justify-content:flex-end}.login-page{padding:13px;padding-top:max(13px,env(safe-area-inset-top));padding-bottom:max(13px,env(safe-area-inset-bottom))}.login-card{padding:20px}.pos-items{min-height:auto}.pos-table{min-height:0}}
@media(max-width:430px){.top-title{font-size:14px}.user-name{display:none}.logout{padding:7px 8px;font-size:11px}.kpis{grid-template-columns:1fr}.pay-grid{grid-template-columns:1fr}.checkout-total strong{font-size:33px}table.mobile-cards td{grid-template-columns:88px minmax(0,1fr)}}
@media print{.sidebar,.topbar,.no-print,.app-footer{display:none!important}.content,.main{width:100%!important;max-width:100%!important;margin:0!important;padding:0!important}.card{box-shadow:none;border:1px solid #aaa;color:#000;background:#fff}body{background:#fff;color:#000}.table-wrap{overflow:visible}table{color:#000}th{background:#eee;color:#000}}


/* ===== Pagamento parcial / misto ===== */
.split-payment-box{margin-top:14px;padding:13px;border:1px solid #38383e;border-radius:12px;background:linear-gradient(180deg,#151517,#101012)}
.split-payment-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:11px}
.split-payment-head h3{margin:0;font-size:14px}
.split-payment-head p{margin:4px 0 0;color:var(--muted);font-size:11px;line-height:1.4}
.mixed-badge{flex:0 0 auto;padding:5px 8px;border:1px solid #6f5800;border-radius:999px;background:#332a05;color:#ffe381;font-size:9px;font-weight:900;letter-spacing:.04em}
.payment-shortcuts{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:11px}
.payment-chip{min-height:34px;padding:6px 9px;border:1px solid #3e3e44;border-radius:8px;background:#242429;color:#ddd;font-size:10px;font-weight:800;cursor:pointer}
.payment-chip:hover{filter:brightness(1.1)}
.payment-chip-primary{border-color:#b88e00;background:#5e4900;color:#ffe680}
.primary-payment-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.payment-method-card{min-width:0;padding:11px;border:1px solid #35353b;border-radius:10px;background:#0c0c0e}
.payment-method-card:focus-within{border-color:#a88000;box-shadow:0 0 0 3px rgba(255,196,0,.08)}
.payment-cash{background:linear-gradient(180deg,rgba(38,116,48,.13),#0c0c0e)}
.payment-qr{background:linear-gradient(180deg,rgba(53,113,174,.13),#0c0c0e)}
.payment-method-title{display:flex;align-items:center;gap:7px;margin-bottom:9px}
.payment-icon{display:grid;place-items:center;flex:0 0 31px;width:31px;height:31px;border-radius:8px;background:#29292e;color:var(--yellow);font-size:10px;font-weight:950}
.payment-method-card small{display:block;margin-top:6px;color:#85878d;font-size:9px;line-height:1.35}
.other-payments{margin-top:9px;border-top:1px solid #2d2d32;padding-top:9px}
.other-payments summary{color:#b7b8bd;font-size:11px;font-weight:800;cursor:pointer;user-select:none}
.payment-summary{margin-top:12px;padding:0 10px;border:1px solid #303036;border-radius:10px;background:#0b0b0d}
.payment-status{margin:9px -10px 0;padding:9px 10px;border-top:1px solid #303036;border-radius:0 0 9px 9px;color:#b7b8bd;background:#151517;font-size:11px;font-weight:750;line-height:1.35}
.payment-status[data-state="success"]{color:#aaf1b4;background:#123719}
.payment-status[data-state="pending"]{color:#ffe18a;background:#443604}
.payment-status[data-state="error"]{color:#ffb9bd;background:#481316}
@media(max-width:720px){.split-payment-box{padding:11px}.primary-payment-grid{grid-template-columns:1fr}.payment-shortcuts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.payment-chip{width:100%;min-height:40px}.payment-chip-primary{grid-column:span 2}.split-payment-head{flex-direction:column}.mixed-badge{align-self:flex-start}}
@media(max-width:430px){.payment-shortcuts{grid-template-columns:1fr}.payment-chip-primary{grid-column:span 1}}

/* ==========================================================
   V6 — MENU ORGANIZADO POR ÁREAS
   ========================================================== */
.nav{
  display:flex;
  min-height:calc(100dvh - 96px - 78px);
  flex-direction:column;
  gap:6px;
  padding:10px 9px 16px;
}
.nav-block{margin-bottom:2px}
.nav-home{
  min-height:48px;
  background:#101012;
  border-color:#242428;
}
.nav-home.active{
  background:linear-gradient(100deg,#a90a11,#e31822);
  border-color:#ed3038;
}

.nav-group{
  overflow:hidden;
  border:1px solid transparent;
  border-radius:11px;
}
.nav-group:has(.nav-link.active){
  border-color:#2d2d32;
  background:#0e0e10;
}
.nav-group-toggle{
  width:100%;
  min-height:47px;
  display:grid;
  grid-template-columns:24px minmax(0,1fr) 20px;
  align-items:center;
  gap:11px;
  padding:10px 12px;
  color:#d9d9dc;
  background:transparent;
  border:0;
  border-radius:10px;
  cursor:pointer;
  text-align:left;
  font-weight:800;
}
.nav-group-toggle:hover{background:#151517;color:#fff}
.nav-group.open>.nav-group-toggle{color:#fff;background:#141416}
.nav-group-label{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.nav-chevron{
  display:grid;
  place-items:center;
  color:#777980;
  font-size:18px;
  transition:transform .18s ease,color .18s ease;
}
.nav-group.open .nav-chevron{
  transform:rotate(180deg);
  color:var(--yellow);
}
.nav-group-items{
  max-height:0;
  overflow:hidden;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-4px);
  transition:
    max-height .24s ease,
    opacity .16s ease,
    transform .20s ease,
    visibility 0s linear .24s;
}
.nav-group.open .nav-group-items{
  max-height:360px;
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
  transition:
    max-height .28s ease,
    opacity .18s ease .04s,
    transform .20s ease,
    visibility 0s linear 0s;
}
.nav-sub-link{
  min-height:41px;
  margin:1px 7px 4px 18px;
  padding:8px 10px;
  color:#b7b8bd;
  border-left:1px solid #333338;
  border-radius:8px;
  font-size:12px;
}
.nav-sub-link .nav-icon{
  width:18px;
  color:#898b91;
  font-size:14px;
}
.nav-sub-link:hover{
  background:#171719;
  border-color:#3a3a40;
}
.nav-sub-link.active{
  color:#fff;
  background:#272014;
  border-color:var(--yellow);
  box-shadow:none;
}
.nav-sub-link.active .nav-icon{color:var(--yellow)}

.sidebar-account{
  position:sticky;
  bottom:0;
  padding:9px;
  background:linear-gradient(180deg,rgba(5,5,6,0),#050506 20%);
}
.sidebar-account>a{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:58px;
  padding:9px 10px;
  border:1px solid #29292e;
  border-radius:11px;
  background:#101012;
}
.sidebar-account>a:hover,
.sidebar-account>a.active{
  border-color:#4a3b0b;
  background:#18160e;
}
.account-avatar,.top-avatar{
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:50%;
  color:#111;
  background:var(--yellow);
  font-weight:900;
}
.account-avatar{width:36px;height:36px}
.account-copy{
  display:flex;
  min-width:0;
  flex-direction:column;
}
.account-copy strong{
  overflow:hidden;
  color:#eee;
  font-size:12px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.account-copy small{color:#85878d;font-size:10px}

.top-title{
  display:flex;
  min-width:0;
  flex:1;
  flex-direction:column;
  gap:1px;
}
.top-title .top-brand{
  color:#85878d;
  font-size:9px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.top-title strong{
  min-width:0;
  overflow:hidden;
  color:#f4f4f5;
  font-size:18px;
  line-height:1.15;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.top-account{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
  padding:5px 7px;
  border:1px solid transparent;
  border-radius:9px;
}
.top-account:hover{
  background:#151517;
  border-color:#29292e;
}
.top-avatar{width:28px;height:28px;font-size:11px}

@media(max-width:900px){
  .nav{
    min-height:auto;
    padding-bottom:10px;
  }
  .sidebar-account{
    position:relative;
    padding-bottom:max(9px,env(safe-area-inset-bottom));
  }
  .nav-group-toggle{min-height:49px}
  .nav-sub-link{
    min-height:44px;
    margin-left:20px;
    font-size:13px;
  }
  .top-title .top-brand{display:none}
  .top-title strong{font-size:16px}
}

@media(max-width:520px){
  .user-name,.user-role{display:none}
  .top-account{padding:4px}
  .logout{margin-left:0}
}



/* V6.1 — reforço do accordion recolhível */
.nav-group:not(.open) .nav-group-items{
  margin-top:0;
  padding-top:0;
  padding-bottom:0;
}
.nav-group.open .nav-group-items{
  padding-bottom:4px;
}
.nav-group-toggle{
  user-select:none;
  -webkit-user-select:none;
}
.nav-group-toggle:focus-visible{
  outline:2px solid var(--yellow);
  outline-offset:2px;
}

/* ==========================================================
   V6.2 — FRENTE DE CAIXA MAIS SIMPLES E ORGANIZADA
   ========================================================== */
[hidden]{display:none!important}

.pos-layout-clean{
  grid-template-columns:minmax(0,1.65fr) minmax(390px,.85fr);
  align-items:start;
}
.sale-products-card,
.checkout-clean{
  overflow:visible;
}
.checkout-clean{
  position:sticky;
  top:84px;
  padding:0;
}
.checkout-section{
  padding:16px;
  border-bottom:1px solid #2b2b30;
}
.checkout-section:last-child{border-bottom:0}
.sale-section-head{
  display:flex;
  align-items:flex-start;
  gap:11px;
  margin-bottom:14px;
}
.sale-section-head.compact{margin-bottom:12px}
.sale-section-head h2{
  margin:0;
  font-size:15px;
  line-height:1.25;
}
.sale-section-head p{
  margin:3px 0 0;
  color:var(--muted);
  font-size:11px;
}
.sale-step-number{
  flex:0 0 28px;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#111;
  background:var(--yellow);
  font-size:12px;
  font-weight:950;
}
.sale-count{
  margin-left:auto;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
}
.sale-count strong{
  color:var(--yellow);
  font-size:18px;
  line-height:1;
}
.sale-count span{
  margin-top:3px;
  color:var(--muted);
  font-size:9px;
  text-transform:uppercase;
}

.scan-form-clean{
  margin-bottom:14px;
}
.scan-input-wrap{
  position:relative;
  flex:1;
  min-width:0;
}
.scan-input-wrap input{
  min-height:49px;
  padding-left:42px;
  font-size:15px;
}
.scan-icon{
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  z-index:1;
  color:var(--yellow);
  font-size:19px;
}
.scan-add-button{
  min-height:49px;
  padding-inline:18px;
}
.pos-empty-state{
  min-height:310px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  padding:30px;
  border:1px dashed #3a3a40;
  border-radius:12px;
  color:#c9c9cd;
  background:#101012;
  text-align:center;
}
.pos-empty-icon{
  display:grid;
  place-items:center;
  width:62px;
  height:62px;
  margin-bottom:13px;
  border-radius:50%;
  color:var(--yellow);
  background:#25200f;
  font-size:29px;
}
.pos-empty-state strong{font-size:15px}
.pos-empty-state p{
  max-width:320px;
  margin:5px 0 0;
  color:var(--muted);
  font-size:11px;
}
.sale-items-actions{
  display:flex;
  align-items:flex-end;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
  margin-top:12px;
}
.clear-sale-form{text-align:right}
.text-danger-button{
  padding:7px 0;
  color:#ff666d;
  background:transparent;
  border:0;
  cursor:pointer;
  font-size:11px;
  font-weight:800;
}
.text-danger-button:hover{text-decoration:underline}
.money-input{
  display:flex;
  align-items:center;
  overflow:hidden;
  border:1px solid #3a3a40;
  border-radius:9px;
  background:#0e0e10;
}
.money-input:focus-within{
  border-color:#d5a700;
  box-shadow:0 0 0 3px rgba(255,196,0,.1);
}
.money-input>span{
  align-self:stretch;
  display:grid;
  place-items:center;
  padding:0 11px;
  color:#111;
  background:var(--yellow);
  font-size:11px;
  font-weight:900;
}
.money-input input{
  border:0;
  border-radius:0;
  box-shadow:none!important;
}
.money-input-large input{
  min-height:52px;
  font-size:22px;
  font-weight:900;
}
.money-input-large>span{font-size:13px}

.sale-summary-lines{
  display:grid;
  gap:8px;
}
.sale-summary-lines>div{
  display:flex;
  justify-content:space-between;
  gap:12px;
  color:#b7b8bd;
  font-size:12px;
}
.checkout-total-clean{
  margin-top:13px;
  padding:14px;
  border:1px solid #55363a;
  border-radius:11px;
  background:linear-gradient(135deg,#261214,#160d0e);
}
.checkout-total-clean span{
  color:#ffadb1;
  font-size:10px;
  font-weight:850;
}
.checkout-total-clean strong{
  margin-top:5px;
  font-size:38px;
}
.customer-details{
  margin-top:10px;
}
.customer-details summary,
.advanced-payment-details summary{
  color:#c8c9cd;
  cursor:pointer;
  font-size:11px;
  font-weight:800;
}
.customer-details summary:hover,
.advanced-payment-details summary:hover{color:var(--yellow)}

.payment-mode-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.payment-mode-card{
  position:relative;
  width:100%;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) 24px;
  align-items:center;
  gap:10px;
  min-height:66px;
  padding:10px;
  color:#ddd;
  background:#111113;
  border:1px solid #35353b;
  border-radius:11px;
  cursor:pointer;
  text-align:left;
  transition:.15s;
}
.payment-mode-card:hover{
  border-color:#666;
  background:#171719;
}
.payment-mode-card.active{
  border-color:var(--yellow);
  background:linear-gradient(100deg,#29220e,#17150d);
  box-shadow:0 0 0 3px rgba(255,196,0,.08);
}
.payment-mode-icon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:10px;
  color:#111;
  background:var(--yellow);
  font-size:12px;
  font-weight:950;
}
.payment-mode-icon.qr-icon{
  color:#fff;
  background:#3d79ff;
}
.payment-mode-icon.split-icon{
  color:#fff;
  background:#d24c22;
  font-size:18px;
}
.payment-mode-card strong{
  display:block;
  font-size:13px;
}
.payment-mode-card small{
  display:block;
  margin-top:2px;
  color:#898b91;
  font-size:9px;
}
.payment-mode-check{
  display:none;
  width:22px;
  height:22px;
  place-items:center;
  border-radius:50%;
  color:#111;
  background:var(--yellow);
  font-size:12px;
  font-weight:950;
}
.payment-mode-card.active .payment-mode-check{display:grid}

.payment-panel{
  margin-top:12px;
  padding:13px;
  border:1px solid #39393f;
  border-radius:11px;
  background:#0d0d0f;
}
.payment-panel-title{
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:12px;
}
.payment-panel-title strong{display:block;font-size:13px}
.payment-panel-title small{display:block;color:var(--muted);font-size:9px}
.payment-panel-icon{
  width:35px;
  height:35px;
  display:grid;
  place-items:center;
  border-radius:9px;
  color:#111;
  background:var(--yellow);
  font-size:11px;
  font-weight:950;
}
.payment-help{
  margin:7px 0 0;
  color:var(--muted);
  font-size:9px;
}
.qr-confirm-box{
  display:flex;
  align-items:center;
  gap:11px;
}
.qr-confirm-icon{
  flex:0 0 48px;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:11px;
  color:#fff;
  background:#3d79ff;
  font-weight:950;
}
.qr-confirm-box strong{font-size:13px}
.qr-confirm-box p{
  margin:3px 0 0;
  color:var(--muted);
  font-size:9px;
}
.qr-total-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:12px;
  padding-top:11px;
  border-top:1px solid #29292d;
}
.qr-total-line span{color:#aaa;font-size:10px}
.qr-total-line strong{color:#77a1ff;font-size:22px}

.partial-explanation{
  margin-bottom:12px;
  padding:10px;
  border-radius:9px;
  background:#17130b;
}
.partial-explanation strong{font-size:12px}
.partial-explanation p{
  margin:3px 0 0;
  color:#aaa;
  font-size:9px;
}
.partial-payment-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:9px;
}
.partial-payment-result{
  display:flex;
  justify-content:center;
  flex-direction:column;
  min-height:78px;
  padding:10px;
  border:1px solid #315597;
  border-radius:10px;
  background:#111a2a;
}
.partial-payment-result span{
  color:#8fa7d4;
  font-size:9px;
  font-weight:800;
}
.partial-payment-result strong{
  margin-top:5px;
  color:#79a4ff;
  font-size:20px;
}
.partial-shortcuts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
  margin-top:9px;
}
.partial-shortcuts button{
  min-height:34px;
  color:#d8d8dc;
  background:#252529;
  border:1px solid #3c3c42;
  border-radius:7px;
  cursor:pointer;
  font-size:9px;
  font-weight:800;
}
.partial-shortcuts button:hover{
  color:#111;
  background:var(--yellow);
  border-color:var(--yellow);
}

.advanced-payment-details{
  margin-top:11px;
  padding-top:11px;
  border-top:1px solid #2d2d32;
}
.advanced-payment-intro{
  margin:8px 0;
  color:var(--muted);
  font-size:9px;
}
.advanced-payment-panel{margin-top:9px}

.payment-result-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
}
.payment-result-card{
  min-width:0;
  padding:9px;
  border:1px solid #333339;
  border-radius:9px;
  background:#101012;
}
.payment-result-card span{
  display:block;
  color:#888a90;
  font-size:8px;
  font-weight:850;
  text-transform:uppercase;
}
.payment-result-card strong{
  display:block;
  margin-top:4px;
  font-size:13px;
  overflow-wrap:anywhere;
}
.remaining-card strong{color:#ff656c}
.remaining-card.is-zero strong{color:#68da76}
.change-card strong{color:#888}
.change-card.has-value strong{color:#68da76}

.payment-status-large{
  margin-top:10px;
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:9px 11px;
  border-radius:9px;
  font-size:10px;
  font-weight:800;
  text-align:center;
}
.finalize-sale-button{
  min-height:58px;
  display:flex;
  justify-content:space-between;
  margin-top:11px;
  padding-inline:16px;
  font-size:14px;
}
.finalize-sale-button strong{font-size:16px}
.finalize-hint{
  display:block;
  margin-top:5px;
  color:#777980;
  font-size:8px;
  text-align:center;
}

@media(max-width:1150px){
  .pos-layout-clean{grid-template-columns:1fr}
  .checkout-clean{position:static}
}
@media(max-width:720px){
  .pos-page-head{align-items:flex-start}
  .scan-form-clean{flex-direction:column}
  .scan-add-button{width:100%}
  .sale-items-actions{
    align-items:stretch;
    flex-direction:column;
  }
  .sale-items-actions .discount-field{width:100%}
  .sale-items-actions .btn{width:100%}
  .clear-sale-form{text-align:center}
  .payment-mode-card{min-height:70px}
  .checkout-section{padding:13px}
}
@media(max-width:430px){
  .partial-payment-grid{grid-template-columns:1fr}
  .payment-result-grid{grid-template-columns:1fr}
  .payment-result-card{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }
  .payment-result-card strong{margin-top:0}
  .checkout-total-clean strong{font-size:33px}
}

/* ==========================================================
   V6.3 — PDV EM TELA FIXA, ESTILO CAIXA DE MERCADO
   ========================================================== */
.page-pos{
  height:100dvh;
  overflow:hidden;
}
.page-pos .app-shell{
  height:100dvh;
  overflow:hidden;
}
.page-pos .content{
  height:100dvh;
  overflow:hidden;
}
.page-pos .topbar{
  min-height:58px;
  height:58px;
}
.page-pos .main{
  height:calc(100dvh - 58px);
  max-width:none;
  margin:0;
  padding:9px;
  overflow:hidden;
}
.page-pos .app-footer{display:none}
.page-pos .flash{
  position:fixed;
  z-index:1300;
  top:66px;
  right:12px;
  width:min(390px,calc(100vw - 24px));
  margin:0;
  box-shadow:0 15px 35px rgba(0,0,0,.42);
}
.page-pos .top-title strong{font-size:15px}
.page-pos .top-title .top-brand{display:none}

.pos-kiosk{
  width:100%;
  height:100%;
  min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(360px,390px);
  gap:9px;
}
.pos-kiosk-panel{
  min-width:0;
  min-height:0;
  height:100%;
  overflow:hidden;
  border:1px solid #2d2d32;
  border-radius:12px;
  background:linear-gradient(180deg,#19191c,#121214);
  box-shadow:0 8px 24px rgba(0,0,0,.18);
}
.pos-products-panel{
  display:flex;
  flex-direction:column;
}
.pos-products-header{
  flex:0 0 auto;
  min-height:56px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:9px 12px;
  border-bottom:1px solid #2d2d32;
  background:#151517;
}
.pos-panel-title{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.pos-panel-title-icon{
  flex:0 0 36px;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:9px;
  color:#111;
  background:var(--yellow);
  font-size:18px;
  font-weight:950;
}
.pos-panel-title h1{
  margin:0;
  font-size:15px;
  line-height:1.1;
}
.pos-panel-title p{
  margin:3px 0 0;
  color:#8e9097;
  font-size:9px;
}
.pos-items-counter{
  margin-left:auto;
  display:flex;
  align-items:baseline;
  gap:6px;
  padding:7px 10px;
  border:1px solid #34343a;
  border-radius:9px;
  background:#101012;
}
.pos-items-counter strong{
  color:var(--yellow);
  font-size:18px;
}
.pos-items-counter span{
  color:#898b91;
  font-size:9px;
  text-transform:uppercase;
}

.pos-scan-bar{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) 112px;
  gap:8px;
  padding:9px 10px;
  border-bottom:1px solid #29292e;
  background:#101012;
}
.pos-scan-input{
  position:relative;
  min-width:0;
}
.pos-scan-input>span{
  position:absolute;
  left:13px;
  top:50%;
  z-index:1;
  transform:translateY(-50%);
  color:var(--yellow);
  font-size:18px;
}
.pos-scan-input input{
  min-height:44px;
  padding-left:40px;
  border-color:#45454c;
  font-size:14px;
}
.pos-scan-button{
  min-height:44px;
  padding:8px 12px;
}

.pos-cart-form{
  flex:1;
  min-height:0;
  display:flex;
  flex-direction:column;
}
.pos-list-head{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:42px minmax(210px,1fr) 76px 96px 105px 34px;
  gap:8px;
  align-items:center;
  min-height:34px;
  padding:0 10px;
  color:#8f9198;
  background:#0d0d0f;
  border-bottom:1px solid #29292e;
  font-size:9px;
  font-weight:850;
  text-transform:uppercase;
}
.pos-item-list{
  flex:1;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:thin;
  scrollbar-color:#4a4a50 #151517;
}
.pos-item-list::-webkit-scrollbar{width:7px}
.pos-item-list::-webkit-scrollbar-track{background:#151517}
.pos-item-list::-webkit-scrollbar-thumb{
  border-radius:20px;
  background:#4a4a50;
}
.pos-item-row{
  display:grid;
  grid-template-columns:42px minmax(210px,1fr) 76px 96px 105px 34px;
  gap:8px;
  align-items:center;
  min-height:57px;
  padding:6px 10px;
  border-bottom:1px solid #29292e;
  background:#151517;
}
.pos-item-row:nth-child(even){background:#121214}
.pos-item-row:hover{background:#1d1d20}
.pos-item-index{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:7px;
  color:#111;
  background:#d7a700;
  font-size:10px;
  font-weight:900;
}
.pos-item-description{
  min-width:0;
}
.pos-item-description strong{
  display:block;
  overflow:hidden;
  color:#f0f0f2;
  font-size:12px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.pos-item-description small{
  display:block;
  overflow:hidden;
  margin-top:2px;
  color:#81838a;
  font-size:8px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.pos-item-quantity input{
  min-height:34px;
  padding:5px 7px;
  text-align:center;
  font-size:12px;
  font-weight:800;
}
.pos-item-price{
  color:#c6c7cb;
  font-size:11px;
  text-align:right;
  white-space:nowrap;
}
.pos-item-total{
  color:var(--yellow);
  font-size:12px;
  font-weight:900;
  text-align:right;
  white-space:nowrap;
}
.pos-remove-item{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  color:#ff747a;
  background:#2a1517;
  border:1px solid #613035;
  border-radius:7px;
  cursor:pointer;
  font-size:18px;
}
.pos-remove-item:hover{
  color:#fff;
  background:#b91b23;
  border-color:#ef353d;
}
.pos-products-footer{
  flex:0 0 auto;
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  padding:8px 10px;
  border-top:1px solid #303036;
  background:#101012;
}
.pos-discount-control{
  display:flex;
  align-items:center;
  gap:7px;
}
.pos-discount-control label{
  margin:0;
  font-size:9px;
}
.pos-money-field{
  width:126px;
  display:flex;
  overflow:hidden;
  border:1px solid #3d3d43;
  border-radius:8px;
}
.pos-money-field span{
  display:grid;
  place-items:center;
  padding:0 9px;
  color:#111;
  background:var(--yellow);
  font-size:9px;
  font-weight:900;
}
.pos-money-field input{
  min-height:36px;
  padding:5px 7px;
  border:0;
  border-radius:0;
}
.pos-update-cart{min-height:36px;padding:7px 11px}
.pos-clear-cart{
  min-height:36px;
  padding:7px 10px;
  color:#ff7177;
  background:transparent;
  border:1px solid #593035;
  border-radius:8px;
  cursor:pointer;
  font-size:10px;
  font-weight:800;
}
.pos-clear-cart:hover{
  color:#fff;
  background:#8f171d;
}
.pos-list-empty{
  flex:1;
  min-height:0;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  color:#c5c6ca;
  text-align:center;
}
.pos-list-empty-icon{
  width:64px;
  height:64px;
  display:grid;
  place-items:center;
  margin-bottom:12px;
  border-radius:50%;
  color:var(--yellow);
  background:#29220e;
  font-size:29px;
}
.pos-list-empty strong{font-size:15px}
.pos-list-empty span{
  max-width:300px;
  margin-top:4px;
  color:#7f8188;
  font-size:10px;
}
.is-hidden{display:none!important}

/* painel direito */
.pos-payment-panel{background:#101012}
.pos-checkout-form{
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
}
.pos-total-header{
  flex:0 0 auto;
  padding:10px 13px;
  border-bottom:1px solid #35353a;
  background:linear-gradient(145deg,#251214,#100c0d);
}
.pos-total-status{
  display:flex;
  align-items:center;
  gap:6px;
  color:#989aa1;
  font-size:8px;
  font-weight:900;
  letter-spacing:.06em;
}
.pos-total-status>span{
  width:7px;
  height:7px;
  border-radius:50%;
}
.pos-total-status>span.online{
  background:#51cf65;
  box-shadow:0 0 8px rgba(81,207,101,.7);
}
.pos-total-status>span.offline{background:#ff4f57}
.pos-total-caption{
  margin-top:7px;
  color:#e2a7aa;
  font-size:9px;
  font-weight:850;
}
.pos-total-value{
  margin-top:1px;
  color:#ff535b;
  font-size:clamp(32px,3.6vw,46px);
  line-height:1;
  font-weight:950;
  letter-spacing:-.04em;
  overflow-wrap:anywhere;
}
.pos-total-details{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top:7px;
  color:#999ba1;
  font-size:8px;
}
.pos-total-details strong{color:#ddd}

.pos-payment-body{
  flex:1;
  min-height:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  padding:10px;
}
.pos-payment-title{
  flex:0 0 auto;
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:8px;
}
.pos-payment-title strong{font-size:12px}
.pos-payment-title span{
  color:#777980;
  font-size:8px;
}
.pos-payment-tabs{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
  margin-top:8px;
}
.pos-payment-tabs button{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:3px;
  color:#bbbcc1;
  background:#171719;
  border:1px solid #37373d;
  border-radius:9px;
  cursor:pointer;
}
.pos-payment-tabs button:hover{border-color:#696970}
.pos-payment-tabs button.active{
  color:#111;
  background:var(--yellow);
  border-color:#ffda53;
  box-shadow:0 0 0 3px rgba(255,196,0,.09);
}
.pos-payment-tabs button>span{
  width:24px;
  height:20px;
  display:grid;
  place-items:center;
  border-radius:5px;
  color:#111;
  background:#ffc400;
  font-size:8px;
  font-weight:950;
}
.pos-payment-tabs button.active>span{
  color:#fff;
  background:#161616;
}
.pos-payment-tabs button>span.qr{color:#fff;background:#3f78f5}
.pos-payment-tabs button>span.split{color:#fff;background:#d65125}
.pos-payment-tabs button strong{font-size:9px}

.pos-payment-content{
  flex:0 0 auto;
  margin-top:8px;
  padding:9px;
  border:1px solid #34343a;
  border-radius:9px;
  background:#151517;
}
.pos-payment-content>label{
  margin-bottom:5px;
  font-size:9px;
}
.pos-payment-content>p{
  margin:5px 0 0;
  color:#777980;
  font-size:8px;
}
.pos-main-money-input{
  display:flex;
  overflow:hidden;
  border:1px solid #525258;
  border-radius:9px;
  background:#0c0c0e;
}
.pos-main-money-input:focus-within{
  border-color:var(--yellow);
  box-shadow:0 0 0 3px rgba(255,196,0,.09);
}
.pos-main-money-input>span{
  display:grid;
  place-items:center;
  padding:0 12px;
  color:#111;
  background:var(--yellow);
  font-size:11px;
  font-weight:950;
}
.pos-main-money-input input{
  min-height:44px;
  padding:5px 10px;
  border:0;
  border-radius:0;
  font-size:22px;
  font-weight:950;
}
.pos-qr-box{
  display:flex;
  align-items:center;
  gap:9px;
}
.pos-qr-icon{
  flex:0 0 40px;
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border-radius:8px;
  color:#fff;
  background:#3f78f5;
  font-size:10px;
  font-weight:950;
}
.pos-qr-box strong{
  display:block;
  font-size:11px;
}
.pos-qr-box span{
  display:block;
  margin-top:2px;
  color:#85878d;
  font-size:8px;
}
.pos-qr-amount,
.pos-split-result{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:8px;
  padding-top:7px;
  border-top:1px solid #2d2d32;
}
.pos-qr-amount span,
.pos-split-result span{
  color:#8d8f96;
  font-size:8px;
}
.pos-qr-amount strong{
  color:#78a1ff;
  font-size:18px;
}
.pos-split-result strong{
  color:#78a1ff;
  font-size:16px;
}
.pos-split-shortcuts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:5px;
  margin-top:7px;
}
.pos-split-shortcuts button{
  min-height:27px;
  color:#c8c9cd;
  background:#242428;
  border:1px solid #3a3a40;
  border-radius:6px;
  cursor:pointer;
  font-size:8px;
  font-weight:850;
}
.pos-split-shortcuts button:hover{
  color:#111;
  background:var(--yellow);
}
.pos-customer-line{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:52px minmax(0,1fr);
  align-items:center;
  gap:7px;
  margin-top:8px;
}
.pos-customer-line label{
  margin:0;
  font-size:8px;
}
.pos-customer-line input{
  min-height:34px;
  padding:5px 8px;
  font-size:10px;
}
.pos-more-payments{
  flex:0 0 auto;
  margin-top:7px;
  padding:5px 0;
  color:#9fa1a8;
  background:transparent;
  border:0;
  cursor:pointer;
  font-size:8px;
  font-weight:800;
  text-decoration:underline;
}
.pos-more-payments:hover{color:var(--yellow)}

.pos-payment-footer{
  flex:0 0 auto;
  padding:8px 10px 10px;
  border-top:1px solid #303036;
  background:#0c0c0e;
}
.pos-payment-results{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:5px;
}
.pos-payment-results>div{
  min-width:0;
  padding:6px 7px;
  border:1px solid #303036;
  border-radius:7px;
  background:#151517;
}
.pos-payment-results span{
  display:block;
  color:#777980;
  font-size:7px;
  font-weight:850;
  text-transform:uppercase;
}
.pos-payment-results strong{
  display:block;
  margin-top:2px;
  color:#ddd;
  font-size:10px;
  overflow-wrap:anywhere;
}
.pos-payment-results .remaining-card strong{color:#ff686f}
.pos-payment-results .remaining-card.is-zero strong{color:#67db75}
.pos-payment-results .change-card.has-value strong{color:#67db75}
.pos-payment-message{
  min-height:31px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-top:6px;
  padding:5px 7px;
  border-radius:7px;
  font-size:8px;
  font-weight:800;
  text-align:center;
}
.pos-finalize-button{
  width:100%;
  min-height:47px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:6px;
  padding:8px 13px;
  font-size:12px;
}
.pos-finalize-button strong{
  padding:3px 7px;
  border-radius:5px;
  background:rgba(0,0,0,.23);
  font-size:9px;
}

/* modal */
.pos-modal-backdrop{
  position:fixed;
  inset:0;
  z-index:1600;
  display:grid;
  place-items:center;
  padding:16px;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(4px);
}
.pos-modal{
  width:min(500px,100%);
  overflow:hidden;
  border:1px solid #44444a;
  border-radius:13px;
  background:#171719;
  box-shadow:0 28px 80px rgba(0,0,0,.55);
}
.pos-modal>header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:13px;
  border-bottom:1px solid #303036;
}
.pos-modal>header strong{display:block;font-size:13px}
.pos-modal>header span{
  display:block;
  margin-top:2px;
  color:#85878d;
  font-size:8px;
}
.pos-modal>header button{
  width:31px;
  height:31px;
  display:grid;
  place-items:center;
  color:#fff;
  background:#28282d;
  border:1px solid #44444a;
  border-radius:8px;
  cursor:pointer;
  font-size:18px;
}
.pos-modal-payment-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  padding:13px;
}
.pos-modal-payment-grid .full{grid-column:1/-1}
.pos-modal-payment-grid input{font-size:16px}
.pos-modal>footer{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  padding:10px 13px;
  border-top:1px solid #303036;
  background:#101012;
}

/* alternância mobile */
.pos-mobile-switch{display:none}

@media(max-width:1180px){
  .pos-kiosk{
    grid-template-columns:minmax(0,1fr) 355px;
  }
  .pos-list-head,
  .pos-item-row{
    grid-template-columns:36px minmax(160px,1fr) 68px 82px 92px 32px;
    gap:6px;
  }
}

@media(max-width:900px){
  .page-pos .topbar{
    height:56px;
    min-height:56px;
  }
  .page-pos .main{
    height:calc(100dvh - 56px);
    padding:7px;
  }
  .pos-mobile-switch{
    height:44px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:6px;
    margin-bottom:7px;
  }
  .pos-mobile-switch button{
    min-width:0;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    color:#b8b9be;
    background:#171719;
    border:1px solid #34343a;
    border-radius:9px;
    cursor:pointer;
    font-size:10px;
    font-weight:850;
  }
  .pos-mobile-switch button.active{
    color:#111;
    background:var(--yellow);
    border-color:#ffd94e;
  }
  .pos-mobile-switch button strong{
    overflow:hidden;
    max-width:100px;
    font-size:8px;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .pos-kiosk{
    height:calc(100% - 51px);
    display:block;
  }
  .pos-kiosk-panel{
    display:none;
    height:100%;
  }
  .pos-kiosk-panel.active{
    display:flex;
  }
  .pos-payment-panel.active{
    display:block;
  }
  .pos-checkout-form{height:100%}
}

@media(max-width:600px){
  .page-pos .main{padding:5px}
  .pos-products-header{min-height:51px;padding:7px 9px}
  .pos-panel-title-icon{width:32px;height:32px;flex-basis:32px}
  .pos-panel-title h1{font-size:13px}
  .pos-items-counter{padding:5px 7px}
  .pos-scan-bar{
    grid-template-columns:minmax(0,1fr) 86px;
    padding:7px;
  }
  .pos-scan-input input{
    min-height:41px;
    font-size:16px;
  }
  .pos-scan-button{
    min-height:41px;
    padding:6px;
    font-size:10px;
  }
  .pos-list-head{display:none}
  .pos-item-row{
    grid-template-columns:34px minmax(0,1fr) 67px 31px;
    grid-template-areas:
      "index desc qty remove"
      "index price total remove";
    min-height:65px;
    padding:6px 8px;
  }
  .pos-item-index{grid-area:index}
  .pos-item-description{grid-area:desc}
  .pos-item-quantity{grid-area:qty}
  .pos-item-price{grid-area:price;text-align:left}
  .pos-item-total{grid-area:total}
  .pos-remove-item{grid-area:remove}
  .pos-products-footer{
    min-height:52px;
    gap:5px;
    padding:6px;
  }
  .pos-discount-control label{display:none}
  .pos-money-field{width:105px}
  .pos-update-cart,
  .pos-clear-cart{
    padding:5px 7px;
    font-size:8px;
  }
  .pos-payment-body{padding:8px}
  .pos-payment-title span{display:none}
  .pos-total-value{font-size:36px}
  .pos-modal-payment-grid{grid-template-columns:1fr}
  .pos-modal-payment-grid .full{grid-column:auto}
}

@media(max-height:700px) and (min-width:901px){
  .page-pos .topbar{
    height:52px;
    min-height:52px;
  }
  .page-pos .main{
    height:calc(100dvh - 52px);
    padding:6px;
  }
  .pos-products-header{min-height:48px;padding:6px 9px}
  .pos-scan-bar{padding:6px 8px}
  .pos-scan-input input,
  .pos-scan-button{min-height:39px}
  .pos-item-row{min-height:49px}
  .pos-products-footer{min-height:49px;padding:5px 8px}
  .pos-total-header{padding:7px 10px}
  .pos-total-value{font-size:34px}
  .pos-total-details{margin-top:4px}
  .pos-payment-body{padding:7px}
  .pos-payment-tabs{margin-top:5px}
  .pos-payment-tabs button{min-height:41px}
  .pos-payment-content{margin-top:6px;padding:7px}
  .pos-main-money-input input{min-height:39px;font-size:19px}
  .pos-customer-line{margin-top:5px}
  .pos-more-payments{margin-top:4px}
  .pos-payment-footer{padding:6px 8px}
  .pos-payment-message{min-height:27px;margin-top:4px}
  .pos-finalize-button{min-height:41px;margin-top:4px}
}

/* ==========================================================
   V6.4 — PRODUTOS SEPARADOS E SEM PÁGINA INFINITA
   ========================================================== */
.page-products,
.page-product_form{
  height:100dvh;
  overflow:hidden;
}

.page-products .app-shell,
.page-product_form .app-shell,
.page-products .content,
.page-product_form .content{
  height:100dvh;
  overflow:hidden;
}

.page-products .topbar,
.page-product_form .topbar{
  min-height:58px;
  height:58px;
}

.page-products .main,
.page-product_form .main{
  height:calc(100dvh - 58px);
  max-width:none;
  margin:0;
  padding:10px;
  overflow:hidden;
}

.page-products .app-footer,
.page-product_form .app-footer{
  display:none;
}

.page-products .flash,
.page-product_form .flash{
  position:fixed;
  z-index:1300;
  top:66px;
  right:12px;
  width:min(410px,calc(100vw - 24px));
  margin:0;
  box-shadow:0 16px 40px rgba(0,0,0,.46);
}

/* lista */
.products-screen{
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.products-screen-head{
  flex:0 0 auto;
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.products-screen-head h1{
  margin:0;
  font-size:20px;
  line-height:1.1;
}

.products-screen-head p{
  margin:3px 0 0;
  color:var(--muted);
  font-size:10px;
}

.products-new-button{
  flex:0 0 auto;
  gap:7px;
}

.products-new-button span{
  font-size:17px;
  line-height:1;
}

.products-kpis{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:7px;
}

.products-kpis article{
  min-width:0;
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 11px;
  border:1px solid #303036;
  border-radius:10px;
  background:linear-gradient(180deg,#1b1b1e,#141416);
}

.products-kpis span{
  color:#909299;
  font-size:9px;
  font-weight:800;
  text-transform:uppercase;
}

.products-kpis strong{
  font-size:20px;
  line-height:1;
}

.warning-text{color:#ffc14f}

.products-list-card{
  flex:1;
  min-height:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid #303036;
  border-radius:12px;
  background:#151517;
  box-shadow:var(--shadow);
}

.products-filter-bar{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:minmax(260px,1fr) 190px 155px 130px auto auto;
  gap:7px;
  align-items:center;
  padding:8px;
  border-bottom:1px solid #303036;
  background:#111113;
}

.products-filter-bar input,
.products-filter-bar select,
.products-filter-bar .btn{
  min-height:38px;
  height:38px;
  font-size:10px;
}

.products-search-field{
  position:relative;
  min-width:0;
}

.products-search-field>span{
  position:absolute;
  left:12px;
  top:50%;
  z-index:1;
  transform:translateY(-50%);
  color:var(--yellow);
  font-size:18px;
}

.products-search-field input{
  padding-left:38px;
}

.products-clear-filter{
  color:#ff858a;
  background:#261315;
  border-color:#5a2c31;
}

.products-table-scroll{
  flex:1;
  min-height:0;
  overflow:auto!important;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:#4a4a50 #151517;
}

.products-table-scroll::-webkit-scrollbar{
  width:8px;
  height:8px;
}

.products-table-scroll::-webkit-scrollbar-track{
  background:#151517;
}

.products-table-scroll::-webkit-scrollbar-thumb{
  border-radius:20px;
  background:#4a4a50;
}

.products-table{
  min-width:1040px;
  table-layout:fixed;
}

.products-table th{
  position:sticky;
  top:0;
  z-index:4;
  height:36px;
  padding:7px 9px;
  background:#0d0d0f;
  box-shadow:0 1px 0 #303036;
}

.products-table th:nth-child(1){width:27%}
.products-table th:nth-child(2){width:13%}
.products-table th:nth-child(3){width:16%}
.products-table th:nth-child(4){width:12%}
.products-table th:nth-child(5){width:10%}
.products-table th:nth-child(6){width:10%}
.products-table th:nth-child(7){width:12%}

.products-table td{
  height:57px;
  padding:7px 9px;
  font-size:10px;
}

.products-table tbody tr:nth-child(even){
  background:#121214;
}

.products-table tbody tr:hover{
  background:#1d1d20;
}

.product-main-cell{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
}

.product-initial{
  flex:0 0 32px;
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:8px;
  color:#111;
  background:var(--yellow);
  font-size:12px;
  font-weight:950;
}

.product-main-cell>span:last-child{
  min-width:0;
}

.product-main-cell strong{
  display:block;
  overflow:hidden;
  font-size:11px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.product-main-cell small{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.product-stock-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:72px;
  padding:4px 7px;
  border-radius:999px;
  font-size:9px;
  font-weight:900;
  white-space:nowrap;
}

.stock-ok{
  color:#a9efb4;
  background:#124c1e;
}

.stock-low{
  color:#ffe4a2;
  background:#664206;
}

.stock-out{
  color:#ffbec1;
  background:#65161b;
}

.product-price{
  color:var(--yellow);
  font-size:12px;
}

.products-row-actions{
  display:flex;
  align-items:center;
  gap:5px;
}

.products-row-actions form{
  margin:0;
}

.products-row-actions .btn{
  min-height:30px;
  padding:5px 7px;
  font-size:9px;
}

.products-pagination{
  flex:0 0 auto;
  min-height:49px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:7px 9px;
  border-top:1px solid #303036;
  color:#8d8f96;
  background:#101012;
  font-size:9px;
}

.products-pagination>div strong{
  color:#ddd;
}

.products-pagination nav{
  display:flex;
  align-items:center;
  gap:4px;
}

.products-pagination nav>span{
  padding:0 3px;
  color:#777980;
}

.pagination-button{
  min-width:30px;
  height:30px;
  display:grid;
  place-items:center;
  padding:0 7px;
  border:1px solid #34343a;
  border-radius:7px;
  color:#c9cacf;
  background:#1c1c1f;
  font-size:10px;
  font-weight:850;
}

.pagination-button:hover{
  border-color:#777980;
}

.pagination-button.active{
  color:#111;
  background:var(--yellow);
  border-color:#ffd63d;
}

.pagination-button.disabled{
  opacity:.35;
  pointer-events:none;
}

.products-empty{
  height:100%;
  min-height:210px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  padding:25px;
  text-align:center;
}

.products-empty>span{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  margin-bottom:11px;
  border-radius:50%;
  color:var(--yellow);
  background:#28210e;
  font-size:25px;
}

.products-empty strong{
  font-size:14px;
}

.products-empty p{
  margin:4px 0 0;
  color:#85878d;
  font-size:10px;
}

/* cadastro separado */
.product-form-screen{
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.product-form-head{
  flex:0 0 auto;
  min-height:62px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
}

.product-form-back{
  display:inline-block;
  margin-bottom:3px;
  color:var(--yellow);
  font-size:9px;
  font-weight:850;
}

.product-form-head h1{
  margin:0;
  font-size:20px;
  line-height:1.1;
}

.product-form-head p{
  margin:3px 0 0;
  color:var(--muted);
  font-size:10px;
}

.product-edit-summary{
  flex:0 0 auto;
  display:flex;
  align-items:flex-end;
  flex-direction:column;
  padding:8px 11px;
  border:1px solid #34343a;
  border-radius:9px;
  background:#141416;
}

.product-edit-summary span{
  color:#8d8f96;
  font-size:8px;
  text-transform:uppercase;
}

.product-edit-summary strong{
  margin-top:2px;
  color:var(--yellow);
  font-size:15px;
}

.product-form-card{
  flex:1;
  min-height:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid #303036;
  border-radius:12px;
  background:linear-gradient(180deg,#1a1a1d,#141416);
  box-shadow:var(--shadow);
}

.product-form-body{
  flex:1;
  min-height:0;
  overflow:auto;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  grid-template-areas:
    "identity stock"
    "pricing pricing";
  gap:8px;
  padding:9px;
  scrollbar-width:thin;
  scrollbar-color:#4a4a50 #151517;
}

.product-form-section{
  min-width:0;
  padding:11px;
  border:1px solid #303036;
  border-radius:10px;
  background:#111113;
}

.product-form-section:nth-child(1){grid-area:identity}
.product-form-section:nth-child(2){grid-area:stock}
.product-form-section:nth-child(3){grid-area:pricing}

.product-form-section>header{
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin-bottom:10px;
  padding-bottom:8px;
  border-bottom:1px solid #29292e;
}

.product-form-section>header>span{
  flex:0 0 27px;
  width:27px;
  height:27px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#111;
  background:var(--yellow);
  font-size:10px;
  font-weight:950;
}

.product-form-section h2{
  margin:0;
  font-size:13px;
}

.product-form-section p{
  margin:2px 0 0;
  color:#81838a;
  font-size:8px;
}

.product-form-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  align-items:end;
}

.product-form-grid-small{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.product-form-grid label{
  margin-bottom:4px;
  font-size:9px;
}

.product-form-grid input,
.product-form-grid select{
  min-height:38px;
  height:38px;
  padding:7px 8px;
  font-size:11px;
}

.product-form-note{
  grid-column:1/-1;
  min-height:58px;
  display:flex;
  justify-content:center;
  flex-direction:column;
  padding:8px 10px;
  border:1px solid #4a3d14;
  border-radius:8px;
  background:#221d0e;
}

.product-form-note strong{
  color:#ffe08a;
  font-size:10px;
}

.product-form-note span{
  margin-top:3px;
  color:#a8a391;
  font-size:8px;
}

.product-price-preview{
  min-height:54px;
  display:flex;
  justify-content:center;
  flex-direction:column;
  padding:7px 10px;
  border:1px solid #68363a;
  border-radius:8px;
  background:linear-gradient(135deg,#291316,#160e0f);
}

.product-price-preview>span{
  color:#d59ca0;
  font-size:8px;
  text-transform:uppercase;
}

.product-price-preview strong{
  margin-top:2px;
  color:#ff676e;
  font-size:19px;
}

.product-price-preview small{
  margin-top:1px;
  color:#8f7779;
  font-size:7px;
}

.product-form-footer{
  flex:0 0 auto;
  min-height:55px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  padding:8px 10px;
  border-top:1px solid #303036;
  background:#101012;
}

.product-form-footer .btn{
  min-width:130px;
  min-height:38px;
}

@media(max-width:1250px){
  .products-filter-bar{
    grid-template-columns:minmax(220px,1fr) 165px 140px 120px auto;
  }

  .products-filter-bar .products-clear-filter{
    display:none;
  }

  .product-form-body{
    grid-template-columns:1fr;
    grid-template-areas:
      "identity"
      "stock"
      "pricing";
  }
}

@media(max-width:900px){
  .page-products .topbar,
  .page-product_form .topbar{
    min-height:56px;
    height:56px;
  }

  .page-products .main,
  .page-product_form .main{
    height:calc(100dvh - 56px);
    padding:7px;
  }

  .products-kpis{
    grid-template-columns:repeat(4,minmax(105px,1fr));
    overflow-x:auto;
    padding-bottom:2px;
  }

  .products-kpis article{
    min-width:105px;
  }

  .products-filter-bar{
    grid-template-columns:minmax(210px,1fr) 155px 135px auto;
  }

  .products-filter-bar select[name="per_page"]{
    display:none;
  }

  .product-form-body{
    padding:7px;
  }
}

@media(max-width:720px){
  .products-screen-head{
    min-height:49px;
  }

  .products-screen-head h1,
  .product-form-head h1{
    font-size:17px;
  }

  .products-screen-head p,
  .product-form-head p{
    display:none;
  }

  .products-new-button{
    min-height:38px;
    padding:7px 9px;
    font-size:9px;
  }

  .products-filter-bar{
    grid-template-columns:minmax(0,1fr) 90px;
  }

  .products-filter-bar select[name="category_id"],
  .products-filter-bar select[name="stock"]{
    display:none;
  }

  .products-filter-bar .btn{
    min-width:90px;
  }

  .products-table-scroll{
    overflow:auto!important;
  }

  .products-table{
    min-width:0!important;
    display:block;
  }

  .products-table thead{
    display:none!important;
  }

  .products-table tbody{
    display:block;
    padding:5px;
  }

  .products-table tr{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto;
    gap:7px 10px;
    margin:0 0 6px;
    padding:9px;
    border:1px solid #303036;
    border-radius:9px;
    background:#151517!important;
  }

  .products-table td{
    height:auto;
    display:block!important;
    padding:0!important;
    border:0!important;
  }

  .products-table td::before{
    display:none!important;
  }

  .products-table td:nth-child(1){
    grid-column:1/-1;
  }

  .products-table td:nth-child(2),
  .products-table td:nth-child(3){
    display:none!important;
  }

  .products-table td:nth-child(4){
    grid-column:1;
  }

  .products-table td:nth-child(5){
    display:none!important;
  }

  .products-table td:nth-child(6){
    grid-column:2;
    align-self:center;
    text-align:right;
  }

  .products-table td:nth-child(7){
    grid-column:1/-1;
  }

  .products-row-actions .btn{
    flex:1;
  }

  .products-row-actions{
    width:100%;
  }

  .products-row-actions form{
    flex:1;
  }

  .products-row-actions form .btn{
    width:100%;
  }

  .products-pagination{
    min-height:45px;
  }

  .products-pagination>div{
    display:none;
  }

  .products-pagination nav{
    width:100%;
    justify-content:center;
  }

  .product-form-head{
    min-height:52px;
  }

  .product-edit-summary{
    display:none;
  }

  .product-form-grid,
  .product-form-grid-small{
    grid-template-columns:1fr 1fr;
  }

  .product-form-grid .span-2{
    grid-column:1/-1;
  }
}

@media(max-width:460px){
  .products-kpis{
    display:none;
  }

  .products-screen{
    gap:6px;
  }

  .products-filter-bar{
    padding:6px;
  }

  .pagination-button{
    min-width:27px;
    height:27px;
    padding:0 5px;
  }

  .product-form-body{
    display:block;
    overflow:auto;
  }

  .product-form-section{
    margin-bottom:7px;
  }

  .product-form-grid,
  .product-form-grid-small{
    grid-template-columns:1fr;
  }

  .product-form-grid .span-2,
  .product-form-note{
    grid-column:1;
  }

  .product-form-footer .btn{
    flex:1;
    min-width:0;
  }
}

@media(max-height:700px) and (min-width:901px){
  .products-screen-head{
    min-height:44px;
  }

  .products-kpis article{
    min-height:45px;
  }

  .products-table td{
    height:50px;
  }

  .product-form-head{
    min-height:48px;
  }

  .product-form-section{
    padding:8px;
  }

  .product-form-section>header{
    margin-bottom:7px;
    padding-bottom:6px;
  }

  .product-form-grid{
    gap:6px;
  }

  .product-form-grid input,
  .product-form-grid select{
    min-height:34px;
    height:34px;
  }

  .product-form-footer{
    min-height:48px;
  }
}

/* ==========================================================
   V6.5 — VALIDADE VISÍVEL NO CADASTRO E NA LISTA
   ========================================================== */
.product-edit-summary-group{
  display:flex;
  align-items:stretch;
  gap:7px;
}

.product-edit-summary strong.danger{
  color:#ff676e;
}

.product-validity-entry{
  padding:9px;
  border:1px solid #504218;
  border-radius:9px;
  background:linear-gradient(135deg,#211c0e,#15130d);
}

.product-validity-entry-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}

.product-validity-entry-head>div{
  min-width:0;
}

.product-validity-entry-head strong{
  display:block;
  color:#ffe087;
  font-size:10px;
}

.product-validity-entry-head span{
  display:block;
  margin-top:2px;
  color:#a8a391;
  font-size:8px;
}

.product-validity-badge{
  flex:0 0 auto;
  margin:0!important;
  padding:4px 6px;
  border:1px solid #715d1c;
  border-radius:6px;
  color:#ffd966!important;
  background:#30270d;
  font-size:7px!important;
  font-weight:900;
  letter-spacing:.05em;
}

.product-validity-entry-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
}

.product-validity-entry-grid label{
  margin-bottom:4px;
  font-size:8px;
}

.product-validity-entry-grid input{
  min-height:36px;
  height:36px;
  padding:6px 7px;
  font-size:10px;
}

.product-validity-help{
  margin:6px 0 0!important;
  color:#918d7d!important;
  font-size:7px!important;
}

.product-current-lots{
  overflow:hidden;
  border:1px solid #303036;
  border-radius:9px;
  background:#0e0e10;
}

.product-current-lots-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 9px;
  border-bottom:1px solid #29292e;
  background:#171719;
}

.product-current-lots-head strong{
  display:block;
  font-size:10px;
}

.product-current-lots-head span{
  display:block;
  margin-top:2px;
  color:#85878d;
  font-size:7px;
}

.product-current-lots-head a{
  flex:0 0 auto;
  color:var(--yellow);
  font-size:8px;
  font-weight:850;
}

.product-lots-list{
  max-height:150px;
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-color:#4a4a50 #101012;
}

.product-lot-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(125px,.7fr);
  gap:8px;
  align-items:center;
  min-height:46px;
  padding:6px 9px;
  border-bottom:1px solid #26262a;
}

.product-lot-row:last-child{
  border-bottom:0;
}

.product-lot-row>span{
  min-width:0;
}

.product-lot-row>span:last-child{
  text-align:right;
}

.product-lot-row strong{
  display:block;
  overflow:hidden;
  color:#ddd;
  font-size:9px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.product-lot-row small{
  display:block;
  margin-top:2px;
  color:#81838a;
  font-size:7px;
}

.product-lot-status{
  display:inline-block!important;
  padding:2px 5px;
  border-radius:5px;
  font-weight:850;
}

.product-lot-status.ok{
  color:#90e49a;
  background:#153d1d;
}

.product-lot-status.warning{
  color:#ffe18a;
  background:#55400e;
}

.product-lot-status.urgent,
.product-lot-status.expired{
  color:#ffc0c3;
  background:#59171b;
}

.product-lot-status.no-date{
  color:#c3c4c9;
  background:#34343a;
}

.product-no-lots{
  padding:12px;
  color:#85878d;
  font-size:8px;
  text-align:center;
}

.product-expiry-line{
  display:flex;
  align-items:center;
  gap:4px;
  width:max-content;
  max-width:100%;
  margin-top:4px;
  padding:2px 5px;
  border-radius:5px;
  font-size:7px;
  font-weight:800;
  white-space:nowrap;
}

.product-expiry-line strong{
  font-size:7px;
}

.product-expiry-line.ok{
  color:#8fdf99;
  background:#15391c;
}

.product-expiry-line.warning{
  color:#ffe08a;
  background:#59430f;
}

.product-expiry-line.urgent,
.product-expiry-line.expired{
  color:#ffc0c3;
  background:#5b181d;
}

.product-expiry-line.no-date{
  color:#c4c5ca;
  background:#34343a;
}

@media(max-width:720px){
  .product-edit-summary-group{
    display:none;
  }

  .product-validity-entry-grid{
    grid-template-columns:1fr 1fr;
  }

  .product-validity-entry-grid>div:last-child{
    grid-column:1/-1;
  }
}

@media(max-width:460px){
  .product-validity-entry-grid{
    grid-template-columns:1fr;
  }

  .product-validity-entry-grid>div:last-child{
    grid-column:auto;
  }

  .product-lot-row{
    grid-template-columns:1fr;
  }

  .product-lot-row>span:last-child{
    text-align:left;
  }
}