:root{--bg:#08111f;--bg2:#0b1524;--panel:#111d2e;--panel2:#0f1b2d;--border:#26364c;--border2:#33465f;--text:#f8fafc;--muted:#94a3b8;--blue:#2563eb;--blue2:#3b82f6;--red:#991b1b;--orange:#c2410c;--yellow:#a16207;--green:#15803d;--shadow:0 18px 45px rgba(0,0,0,.22);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at top right,#10274a 0,transparent 30%),var(--bg2);color:var(--text);font-size:14px}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{color:inherit}.app-shell{min-height:100vh;display:grid;grid-template-columns:260px minmax(0,1fr)}.sidebar{position:sticky;top:0;height:100vh;padding:22px 16px 18px;background:#07101d;border-right:1px solid #1d2b3f;display:flex;flex-direction:column;z-index:30}.brand{display:flex;align-items:center;gap:12px;padding:4px 8px 24px}.brand-mark{display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:linear-gradient(145deg,#3678ff,#1641a9);box-shadow:0 10px 28px rgba(37,99,235,.35);font-weight:900;font-size:21px}.brand-mark.large{width:54px;height:54px;border-radius:17px;font-size:28px}.brand span:last-child{display:flex;flex-direction:column;min-width:0}.brand b{font-size:18px}.brand small,.user-box small,.product-cell small,td small{display:block;color:var(--muted);font-size:11px;line-height:1.4}.nav{display:flex;flex-direction:column;gap:5px;overflow:auto}.nav a{padding:11px 13px;border-radius:10px;color:#a8b5c8;font-weight:650}.nav a:hover{background:#111f33;color:#fff}.nav a.active{background:#142847;color:#6ea3ff;border:1px solid #244879}.sidebar-footer{margin-top:auto;padding-top:18px;border-top:1px solid #1c2b40;display:grid;gap:12px}.user-box{display:flex;align-items:center;gap:10px;min-width:0}.user-box>span:last-child{min-width:0}.avatar{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#192b43;color:#77a9ff;font-weight:800;flex:none}.content{min-width:0;padding:30px 34px 52px}.mobile-top{display:none}.sidebar-overlay{display:none}.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:24px}.page-header h1{font-size:30px;line-height:1.12;margin:3px 0 7px}.page-header p,.panel-head p{margin:0;color:var(--muted);line-height:1.5}.kicker{color:#60a5fa;font-size:11px;font-weight:850;letter-spacing:.15em}.header-actions,.row-actions,.form-actions,.filter-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.btn{display:inline-flex;justify-content:center;align-items:center;gap:6px;min-height:39px;padding:9px 14px;border:1px solid var(--border2);border-radius:9px;background:#132238;color:#e5edf7;font-weight:700;cursor:pointer;white-space:nowrap}.btn:hover{background:#192d48;border-color:#48627f}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:linear-gradient(180deg,#3478f6,#1d56ce);border-color:#4685fa;color:white}.btn-primary:hover{background:#2f6fe6}.btn-danger{background:#44171b;border-color:#7f1d1d;color:#fecaca}.btn-danger:hover{background:#601d24}.btn-ghost{background:transparent;border-color:#29394e}.btn-small{min-height:31px;padding:5px 9px;font-size:12px}.full{width:100%}.icon-button{border:0;background:transparent;font-size:22px}.panel{background:linear-gradient(180deg,rgba(18,31,49,.98),rgba(14,26,43,.98));border:1px solid var(--border);border-radius:16px;padding:21px;box-shadow:var(--shadow);margin-bottom:18px}.panel.narrow{max-width:840px}.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px}.panel-head h2{margin:0 0 4px;font-size:19px}.panel h3{margin:14px 0 12px;font-size:14px}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}.metric-grid.five{grid-template-columns:repeat(5,minmax(0,1fr))}.metric-card{min-height:126px;background:#111d2e;border:1px solid var(--border);border-radius:15px;padding:18px;display:flex;flex-direction:column;justify-content:center;box-shadow:var(--shadow)}.metric-card span{color:#a8b6c9;font-size:12px;font-weight:700}.metric-card b{font-size:34px;line-height:1.05;margin:10px 0 5px}.metric-card b.metric-text{font-size:18px;line-height:1.25}.metric-card small{color:var(--muted)}.metric-card.danger{border-left:4px solid #b91c1c}.metric-card.warning{border-left:4px solid #ea580c}.metric-card.caution{border-left:4px solid #ca8a04}.metric-card.success{border-left:4px solid #16a34a}.alert-list,.mini-list{display:grid}.alert-row,.mini-row{display:flex;align-items:center;gap:13px;padding:12px 4px;border-bottom:1px solid #203047}.alert-row:last-child,.mini-row:last-child{border:0}.alert-row:hover,.mini-row:hover,.mini-row.selected{background:#142238}.grow{flex:1;min-width:0}.grow small,.mini-row small{display:block;color:var(--muted);font-size:11px;margin-top:2px}.thumb{width:44px;height:44px;border-radius:9px;object-fit:cover;background:#0a1422;border:1px solid #29394f;flex:none}.thumb.placeholder{display:grid;place-items:center;color:#506078}.status-pill{display:inline-flex;align-items:center;justify-content:center;padding:5px 8px;border-radius:999px;background:#213149;color:#d5deea;font-weight:750;font-size:11px;white-space:nowrap}.status-pill.ok,.status-pill.status-acima_60_dias,.status-pill.status-acima_60{background:#123b27;color:#86efac}.status-pill.off{background:#27303e;color:#a6b1c1}.status-pill.warning{background:#4b3610;color:#fde68a}.status-pill.status-vencido,.status-pill.status-vence_hoje{background:#4d1417;color:#fecaca}.status-pill.status-ate_15_dias{background:#54220f;color:#fdba74}.status-pill.status-ate_30_dias{background:#4b380d;color:#fde68a}.status-pill.status-ate_60_dias{background:#173755;color:#93c5fd}.info-strip{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:13px 17px;border:1px solid #244875;background:#102440;border-radius:12px;margin-bottom:18px;color:#b9d2fb}.company-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:15px;margin-bottom:22px}.company-card{display:grid;gap:17px;padding:20px;background:#111d2e;border:1px solid var(--border);border-radius:15px}.company-card.selected{border-color:#3478f6;box-shadow:0 0 0 1px #3478f6 inset}.company-card h2{margin:7px 0 4px}.company-card p{margin:0;color:var(--muted)}.company-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px}.company-meta span{display:grid;gap:3px;color:var(--muted);font-size:11px}.company-meta b{color:var(--text);font-size:13px}.status-dot{width:9px;height:9px;border-radius:50%;display:inline-block}.status-dot.on{background:#22c55e;box-shadow:0 0 10px #22c55e}.status-dot.off{background:#ef4444}.split-layout{display:grid;grid-template-columns:minmax(380px,520px) minmax(0,1fr);gap:18px;align-items:start}.split-layout.users-layout{grid-template-columns:minmax(340px,470px) minmax(0,1fr)}.sticky-panel{position:sticky;top:18px;max-height:calc(100vh - 36px);overflow:auto}.two-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.filter-grid{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:13px;align-items:end}.filter-grid.reports-filter{grid-template-columns:repeat(4,1fr)}.span-2{grid-column:1/-1}.stack{display:grid;gap:13px}label{display:grid;gap:7px;color:#cbd5e1;font-size:12px;font-weight:720}input,select,textarea{width:100%;min-height:42px;padding:10px 12px;border:1px solid #31435b;border-radius:9px;background:#0d1929;color:#f8fafc;outline:none}input:focus,select:focus,textarea:focus{border-color:#4688ff;box-shadow:0 0 0 3px rgba(59,130,246,.13)}textarea{min-height:90px;resize:vertical}.check{display:flex;align-items:center;gap:8px;grid-auto-flow:column;justify-content:start;align-self:center}.check input{width:17px;min-height:17px}.input-action,.inline-form,.stock-actions form{display:flex;gap:7px;align-items:center}.field-help{color:#60a5fa;min-height:14px}.file-button{position:relative;overflow:hidden}.file-button input{position:absolute;inset:0;opacity:0;cursor:pointer}.photo-editor{display:grid;grid-template-columns:150px 1fr;gap:16px;margin-bottom:18px}.photo-preview{height:150px;border:1px dashed #3b4f69;border-radius:13px;background:#0b1625;display:grid;place-items:center;color:#64748b;overflow:hidden}.photo-preview img{width:100%;height:100%;object-fit:cover}.advanced{background:#0b1727;border:1px solid #26384e;border-radius:10px;padding:10px}.advanced summary,.import-panel summary{cursor:pointer;font-weight:750}.advanced .inner,.import-panel .inner{margin-top:14px}.divider{height:1px;background:#26374d;margin:20px 0}.danger-zone{margin-top:20px;padding-top:18px;border-top:1px solid #61252b;display:flex;align-items:center;justify-content:space-between;gap:16px}.danger-zone p{color:var(--muted);margin:4px 0 0}.searchbar{display:flex;align-items:center;gap:10px}.searchbar>input{flex:1}.table-panel{padding:0;overflow:hidden}.table-panel .panel-head{padding:19px 20px 0}.table-scroll{overflow:auto;max-width:100%}table{width:100%;border-collapse:collapse;min-width:760px}th{text-align:left;background:#132238;color:#9fb0c5;padding:11px 13px;font-size:11px;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}td{padding:11px 13px;border-top:1px solid #223149;color:#dbe4ef;vertical-align:middle}tbody tr:hover{background:#122138}.clickable{cursor:pointer}.product-cell{display:flex;align-items:center;gap:10px;min-width:190px}.product-cell>span:last-child{min-width:0}.code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px}.muted{color:var(--muted)}.empty-state{padding:32px;text-align:center;color:var(--muted)}.stock-actions{display:grid;gap:6px}.stock-actions form input{width:90px;min-height:32px;padding:5px 7px}.subscription-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}.subscription-grid>div{display:grid;gap:5px;padding:13px;background:#0c1828;border:1px solid #26374c;border-radius:10px}.subscription-grid span{color:var(--muted);font-size:11px}.subscription-grid b{font-size:13px}.flash-stack{display:grid;gap:8px;margin-bottom:18px}.flash{padding:12px 15px;border:1px solid;border-radius:10px;font-weight:650}.flash-sucesso{background:#113621;border-color:#1c6b3a;color:#bbf7d0}.flash-erro{background:#42171a;border-color:#7f1d1d;color:#fecaca}.flash-aviso{background:#453511;border-color:#7c5c13;color:#fde68a}.flash-info{background:#102b4d;border-color:#24578c;color:#bfdbfe}.auth-page{min-height:100vh;display:grid;grid-template-columns:1.2fr 1fr;background:#07101d}.auth-hero{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:38px 52px;background:linear-gradient(110deg,rgba(4,12,23,.42),rgba(7,16,29,.82)),url('/assets/images/login_zerolabs_background.png') center/cover}.auth-logo{display:flex;align-items:center;gap:11px;font-size:20px;font-weight:850}.auth-logo img{width:45px;height:45px;object-fit:contain}.hero-copy{max-width:650px;padding-bottom:9vh}.hero-copy h1{font-size:clamp(40px,5vw,72px);line-height:.98;margin:10px 0 20px;letter-spacing:-.045em}.hero-copy p{font-size:18px;color:#c1cede;max-width:520px}.auth-panel{display:grid;place-items:center;padding:30px;background:radial-gradient(circle at top,#102542,transparent 43%),#08111f}.auth-panel.centered{grid-column:1/-1}.auth-card{width:min(440px,100%);padding:32px;background:rgba(14,26,43,.95);border:1px solid #2a3b52;border-radius:22px;box-shadow:0 30px 80px rgba(0,0,0,.42)}.auth-card.wide{width:min(760px,100%)}.auth-heading{text-align:center;margin-bottom:24px}.auth-heading .brand-mark{margin:0 auto 12px}.auth-heading h2{font-size:27px;margin:0 0 7px}.auth-heading p{margin:0;color:var(--muted)}.auth-links{display:flex;justify-content:center;gap:7px;margin-top:18px;color:var(--muted)}.auth-links a{color:#6ca6ff;font-weight:750}.camera-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.78);z-index:100;place-items:center;padding:20px}.camera-modal.open{display:grid}.camera-card{width:min(760px,100%);background:#111d2e;border:1px solid #3a4f69;border-radius:16px;padding:15px}.camera-card video{width:100%;max-height:70vh;background:black;border-radius:10px}.error-card{max-width:580px;margin:10vh auto;padding:40px;text-align:center;background:#111d2e;border:1px solid #2d4058;border-radius:18px}.error-card>span{display:grid;place-items:center;width:55px;height:55px;margin:auto;border-radius:50%;background:#4b171b;color:#fecaca;font-size:30px}.error-card h1{font-size:28px}.error-card p{color:var(--muted);margin-bottom:22px}
@media(max-width:1100px){.metric-grid.five{grid-template-columns:repeat(3,1fr)}.split-layout{grid-template-columns:1fr}.sticky-panel{position:relative;top:auto;max-height:none}.two-columns{grid-template-columns:1fr}.subscription-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.mobile-top{display:flex;position:sticky;top:0;z-index:40;height:54px;align-items:center;gap:10px;padding:0 14px;background:#07101d;border-bottom:1px solid #223249}.app-shell{display:block}.sidebar{position:fixed;left:-280px;top:0;width:270px;transition:left .2s ease}.sidebar.open{left:0}.sidebar.open~.content+.sidebar-overlay,.sidebar-overlay.open{display:block;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:20}.content{padding:20px 15px 42px}.page-header{align-items:stretch;flex-direction:column}.metric-grid,.metric-grid.five{grid-template-columns:repeat(2,1fr)}.filter-grid,.filter-grid.reports-filter{grid-template-columns:1fr 1fr}.auth-page{grid-template-columns:1fr}.auth-hero{display:none}.auth-panel{min-height:100vh}.form-grid{grid-template-columns:1fr}.form-grid .span-2{grid-column:auto}.searchbar{align-items:stretch;flex-direction:column}.photo-editor{grid-template-columns:120px 1fr}.photo-preview{height:120px}.subscription-grid{grid-template-columns:1fr}.info-strip{align-items:flex-start;flex-direction:column}.danger-zone{align-items:flex-start;flex-direction:column}}
@media(max-width:520px){.metric-grid,.metric-grid.five{grid-template-columns:1fr 1fr;gap:9px}.metric-card{min-height:104px;padding:14px}.metric-card b{font-size:28px}.filter-grid,.filter-grid.reports-filter{grid-template-columns:1fr}.filter-actions{grid-column:auto}.photo-editor{grid-template-columns:1fr}.photo-preview{height:220px}.row-actions,.inline-form{align-items:stretch;flex-direction:column}.inline-form input,.inline-form select{width:100%}.header-actions{align-items:stretch;flex-direction:column}.content{padding-left:11px;padding-right:11px}.panel{padding:16px}.table-panel{padding:0}.auth-panel{padding:14px}.auth-card{padding:23px 19px}}
.table-actions{display:flex;gap:8px;padding:14px 18px;border-top:1px solid #26374d}.selectable-row{cursor:pointer}.selectable-row.selected-row{background:#17345e!important;box-shadow:inset 3px 0 #3b82f6}
.danger-panel{border-color:#7f1d1d;background:linear-gradient(180deg,rgba(57,17,23,.92),rgba(27,18,29,.98))}.danger-text{color:#f87171}.danger-panel input{border-color:#7f1d1d}.danger-panel input:focus{border-color:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,.14)}

/* Patch 2.2.2: login responsivo, lojas e leitor por câmera */
html,body{max-width:100%;overflow-x:hidden}
body.auth-page{margin:0;width:100%;min-height:100vh;min-height:100dvh;overflow:hidden}
.auth-page{grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr)}
.auth-hero{min-width:0;padding:clamp(24px,3vw,48px);background-position:center center;background-size:cover;overflow:hidden}
.auth-logo{position:relative;z-index:2}
.hero-copy{position:relative;z-index:2;max-width:560px;padding-bottom:clamp(30px,7vh,80px)}
.hero-copy h1{font-size:clamp(38px,4.2vw,68px)}
.auth-panel{min-width:0;min-height:100dvh;padding:clamp(20px,4vw,64px)}
.auth-card{width:min(440px,100%);box-sizing:border-box}
.store-switcher{display:flex;align-items:end;min-width:210px}
.store-switcher label{width:100%}
.store-switcher select{min-width:190px;background:#10213a;border-color:#3478f6}
.barcode-actions{flex-wrap:wrap}
.barcode-actions input{flex:1 1 180px}
#barcodeReader{width:100%;min-height:260px;overflow:hidden;border-radius:12px;background:#050a12}
#barcodeReader video{border-radius:12px}
#barcodeReader__scan_region{background:#050a12}
#barcodeReader__dashboard{padding:10px!important;background:#0d1929;color:#dbeafe}
@media(max-width:1280px){
  .auth-page{grid-template-columns:minmax(0,1fr) minmax(400px,.92fr)}
  .auth-hero{padding:28px 34px}
  .hero-copy h1{font-size:clamp(36px,4vw,54px)}
  .hero-copy p{font-size:16px}
}
@media(max-width:980px){
  body.auth-page{overflow:auto}
  .auth-page{display:grid;grid-template-columns:1fr}
  .auth-hero{display:none}
  .auth-panel{min-height:100vh;min-height:100dvh;padding:20px}
}
@media(max-width:820px){
  .store-switcher{width:100%;min-width:0}
  .store-switcher select{width:100%;min-width:0}
  .page-header .header-actions{width:100%}
  .page-header .header-actions>*{max-width:100%}
}
@media(max-width:520px){
  .auth-panel{padding:12px}
  .auth-card{padding:22px 18px;border-radius:16px}
  .barcode-actions .btn{flex:1 1 auto}
  #barcodeReader{min-height:220px}
}
#barcodeNativeVideo{width:100%;max-height:65vh;object-fit:cover;border-radius:12px;background:#000}
#barcodeReader{position:relative}
.barcode-guide{position:absolute;left:10%;right:10%;top:50%;height:2px;background:#ef4444;box-shadow:0 0 12px #ef4444;pointer-events:none}
/* Mantém a arte completa da Zero Labs visível, sem recorte lateral. */
.auth-hero{
  background-image:linear-gradient(110deg,rgba(4,12,23,.30),rgba(7,16,29,.72)),url('/assets/images/login_zerolabs_background.png');
  background-size:cover,contain;
  background-position:center,center;
  background-repeat:no-repeat,no-repeat;
  background-color:#030b18;
}

/* Patch 2.2.3 — correção definitiva do alinhamento da página de login */
body.auth-page{
  width:100%;
  height:100vh;
  height:100dvh;
  min-height:100vh;
  min-height:100dvh;
  overflow:hidden;
  background:#07101d;
}
.auth-page{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,1fr);
  width:100%;
  height:100vh;
  height:100dvh;
  min-height:100vh;
  min-height:100dvh;
  align-items:stretch;
}
.auth-hero{
  width:100%;
  height:100vh;
  height:100dvh;
  min-height:0;
  padding:clamp(26px,2.5vw,46px);
  justify-content:space-between;
  overflow:hidden;
  background-color:#030b18;
  background-image:
    linear-gradient(110deg,rgba(4,12,23,.20),rgba(7,16,29,.58)),
    url('/assets/images/login_zerolabs_background.png');
  background-size:100% 100%,auto 100%;
  background-position:center,left center;
  background-repeat:no-repeat,no-repeat;
}
.auth-logo{
  flex:none;
  margin:0;
}
.hero-copy{
  flex:none;
  width:min(520px,82%);
  max-width:520px;
  padding:0 0 clamp(34px,6vh,70px);
  margin:0;
}
.hero-copy h1{
  font-size:clamp(42px,4vw,66px);
  line-height:1.02;
  margin:10px 0 18px;
}
.hero-copy p{
  margin:0;
  font-size:clamp(15px,1.05vw,18px);
}
.auth-panel{
  width:100%;
  height:100vh;
  height:100dvh;
  min-height:0;
  padding:clamp(24px,3vw,58px);
  display:grid;
  place-items:center;
  align-self:stretch;
}
.auth-card{
  width:min(440px,100%);
  max-height:calc(100dvh - 48px);
  overflow:auto;
}
@media(max-width:1180px){
  .auth-page{grid-template-columns:minmax(0,1fr) minmax(390px,.86fr)}
  .auth-hero{padding:28px 32px}
  .hero-copy{width:min(470px,88%);padding-bottom:38px}
  .hero-copy h1{font-size:clamp(38px,4.4vw,54px)}
  .auth-panel{padding:24px}
}
@media(max-width:980px){
  body.auth-page{height:auto;min-height:100dvh;overflow:auto}
  .auth-page{display:block;width:100%;height:auto;min-height:100dvh}
  .auth-hero{display:none}
  .auth-panel{width:100%;height:auto;min-height:100dvh;padding:20px}
  .auth-card{max-height:none;overflow:visible}
}
@media(max-width:520px){
  .auth-panel{padding:12px}
  .auth-card{width:100%;padding:22px 18px;border-radius:16px}
}

/* ========================================================================== */
/* ZeroPreju Patch 2.2.4 — responsividade mobile completa                     */
/* Base: Patch 2.2.3. Este bloco deve permanecer no fim do arquivo.           */
/* ========================================================================== */

/* Impede que grids, painéis, mídias ou textos aumentem a largura da página. */
html,
body {
  width: 100%;
  max-width: 100%;
}

body:not(.auth-page) {
  overflow-x: hidden;
}

.app-shell,
.content,
.page-header,
.panel,
.panel-head,
.metric-grid,
.company-grid,
.split-layout,
.two-columns,
.form-grid,
.filter-grid,
.subscription-grid,
.alert-list,
.mini-list,
.table-panel,
.table-scroll,
.searchbar,
.photo-editor,
.danger-zone,
.info-strip,
.header-actions,
.row-actions,
.form-actions,
.filter-actions,
.input-action,
.inline-form,
.stock-actions,
.company-card,
.metric-card,
.alert-row,
.mini-row,
.grow,
.product-cell,
.store-switcher,
label {
  min-width: 0;
}

img,
svg,
video,
canvas {
  max-width: 100%;
}

input,
select,
textarea,
button {
  max-width: 100%;
}

.page-header h1 {
  overflow-wrap: anywhere;
}

.page-header p,
.panel-head p,
.company-card p,
.grow,
.product-cell,
td,
.flash {
  overflow-wrap: anywhere;
}

/* Login: arte Zero Labs em toda a tela e cartão sobreposto. */
body.auth-page {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  height: auto;
  padding: clamp(20px, 4vw, 64px);
  overflow-x: hidden;
  overflow-y: auto;
  background-color: #030b18;
  background-image:
    linear-gradient(90deg, rgba(3, 11, 24, .18) 0%, rgba(3, 11, 24, .36) 48%, rgba(3, 11, 24, .82) 100%),
    url('/assets/images/login_zerolabs_background.png');
  background-size: cover, cover;
  background-position: center, center;
  background-repeat: no-repeat, no-repeat;
}

body.auth-page::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(1, 7, 16, .06), rgba(1, 7, 16, .25));
}

.auth-hero {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  min-height: 100%;
  padding: clamp(24px, 3vw, 48px);
  background: none;
  pointer-events: none;
}

.auth-logo,
.hero-copy {
  position: relative;
  z-index: 1;
  max-width: min(520px, 48vw);
}

.auth-panel {
  position: relative;
  z-index: 2;
  display: block;
  width: min(480px, 100%);
  height: auto;
  min-height: 0;
  padding: 0;
  margin-left: auto;
  background: transparent;
}

.auth-panel.centered {
  width: min(800px, 100%);
  margin: auto;
}

.auth-card {
  width: 100%;
  max-height: none;
  overflow: visible;
  background: rgba(12, 24, 41, .94);
  border-color: rgba(94, 124, 163, .5);
  box-shadow: 0 30px 80px rgba(0, 0, 0, .52);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.auth-card.wide {
  width: 100%;
}

/* Tabelas continuam completas, mas passam a aceitar gesto horizontal. */
.table-scroll {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable;
}

.table-scroll table {
  width: 100%;
  max-width: none;
}

/* Modais respeitam a altura útil do celular. */
.camera-modal {
  overflow-y: auto;
  padding:
    max(12px, env(safe-area-inset-top))
    max(12px, env(safe-area-inset-right))
    max(12px, env(safe-area-inset-bottom))
    max(12px, env(safe-area-inset-left));
}

.camera-card {
  max-height: calc(100dvh - 24px);
  overflow-y: auto;
}

.camera-card video,
#barcodeNativeVideo {
  max-height: 58dvh;
}

/* Tablet e celulares na horizontal. */
@media (max-width: 960px) {
  .mobile-top {
    display: flex;
    position: sticky;
    top: 0;
    z-index: 60;
    width: 100%;
    min-height: 56px;
    height: auto;
    padding:
      max(8px, env(safe-area-inset-top))
      max(14px, env(safe-area-inset-right))
      8px
      max(14px, env(safe-area-inset-left));
    align-items: center;
    gap: 11px;
    background: rgba(7, 16, 29, .97);
    border-bottom: 1px solid #223249;
    box-shadow: 0 7px 22px rgba(0, 0, 0, .22);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }

  .mobile-top .icon-button {
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #132238;
    border: 1px solid #2b3e58;
  }

  .app-shell {
    display: block;
    width: 100%;
  }

  .sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    left: 0;
    width: min(86vw, 300px);
    height: 100dvh;
    padding-top: max(18px, env(safe-area-inset-top));
    padding-bottom: max(18px, env(safe-area-inset-bottom));
    transform: translateX(-105%);
    transition: transform .22s ease;
    box-shadow: 20px 0 50px rgba(0, 0, 0, .38);
    overflow-y: auto;
    overscroll-behavior: contain;
    z-index: 80;
  }

  .sidebar.open {
    left: 0;
    transform: translateX(0);
  }

  .sidebar-overlay.open {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 70;
    background: rgba(0, 0, 0, .62);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
  }

  .content {
    width: 100%;
    padding: 22px 18px 48px;
  }

  .page-header {
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
  }

  .page-header h1 {
    font-size: clamp(26px, 6vw, 32px);
  }

  .page-header .header-actions,
  .page-header .header-actions > *,
  .store-switcher,
  .store-switcher label,
  .store-switcher select {
    width: 100%;
    min-width: 0;
  }

  .header-actions > .btn {
    flex: 1 1 180px;
  }

  .split-layout,
  .split-layout.users-layout,
  .two-columns {
    grid-template-columns: minmax(0, 1fr);
  }

  .sticky-panel {
    position: relative;
    top: auto;
    max-height: none;
    overflow: visible;
  }

  .metric-grid,
  .metric-grid.five {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .filter-grid,
  .filter-grid.reports-filter {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .filter-actions {
    grid-column: 1 / -1;
  }

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

  .table-panel::before {
    content: "↔ Deslize a tabela para ver todas as colunas";
    display: block;
    padding: 10px 14px;
    color: #93c5fd;
    background: #0c1c31;
    border-bottom: 1px solid #26374d;
    font-size: 12px;
    font-weight: 700;
  }

  .table-scroll table {
    min-width: 720px;
  }

  .table-actions {
    position: sticky;
    left: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
  }

  .table-actions > .btn,
  .table-actions > form {
    flex: 1 1 130px;
  }

  .table-actions > form .btn {
    width: 100%;
  }

  .danger-zone,
  .info-strip {
    align-items: stretch;
    flex-direction: column;
  }

  body.auth-page {
    justify-content: center;
    padding: clamp(14px, 4vw, 28px);
    background-position: center, center;
  }

  .auth-hero {
    display: none;
  }

  .auth-panel,
  .auth-panel.centered {
    width: min(520px, 100%);
    margin: auto;
  }
}

/* Celulares. */
@media (max-width: 680px) {
  body {
    font-size: 14px;
  }

  .content {
    padding:
      16px
      max(11px, env(safe-area-inset-right))
      max(38px, env(safe-area-inset-bottom))
      max(11px, env(safe-area-inset-left));
  }

  .panel {
    padding: 16px;
    border-radius: 14px;
  }

  .table-panel {
    padding: 0;
  }

  .table-panel .panel-head {
    padding: 16px 16px 0;
  }

  .panel-head {
    flex-direction: column;
    align-items: stretch;
  }

  .panel-head > .btn,
  .panel-head > a.btn {
    width: 100%;
  }

  .form-grid,
  .filter-grid,
  .filter-grid.reports-filter,
  .subscription-grid,
  .company-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .form-grid .span-2,
  .filter-actions {
    grid-column: auto;
  }

  .form-actions,
  .filter-actions,
  .header-actions,
  .row-actions,
  .searchbar,
  .inline-form,
  .input-action,
  .barcode-actions,
  .stock-actions form {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
  }

  .form-actions > *,
  .filter-actions > *,
  .header-actions > *,
  .row-actions > *,
  .searchbar > *,
  .inline-form > *,
  .input-action > *,
  .barcode-actions > *,
  .stock-actions form > * {
    width: 100%;
    max-width: 100%;
  }

  .btn,
  input,
  select,
  textarea {
    min-height: 44px;
  }

  .btn-small {
    min-height: 40px;
  }

  .metric-card {
    min-height: 112px;
    padding: 15px;
  }

  .metric-card b {
    font-size: 30px;
  }

  .photo-editor {
    grid-template-columns: minmax(0, 1fr);
  }

  .photo-preview {
    width: 100%;
    height: min(62vw, 260px);
  }

  .company-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .alert-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 8px 11px;
    padding: 13px 2px;
  }

  .alert-row > .thumb {
    grid-row: 1 / span 3;
  }

  .alert-row > .grow,
  .alert-row > .status-pill,
  .alert-row > span:last-child {
    grid-column: 2;
    justify-self: start;
  }

  .mini-row {
    flex-wrap: wrap;
  }

  .product-cell {
    min-width: 175px;
  }

  .stock-actions form input {
    width: 100%;
  }

  .auth-card,
  .auth-card.wide {
    padding: 23px 18px;
    border-radius: 17px;
  }

  .auth-heading h2 {
    font-size: 24px;
  }

  .auth-links {
    flex-wrap: wrap;
    text-align: center;
  }

  .camera-card {
    padding: 12px;
    border-radius: 14px;
  }

  #barcodeReader {
    min-height: 210px;
  }
}

/* Celulares estreitos: prioriza leitura em uma coluna. */
@media (max-width: 480px) {
  .metric-grid,
  .metric-grid.five {
    grid-template-columns: minmax(0, 1fr);
  }

  .metric-card {
    min-height: 96px;
  }

  .page-header h1 {
    font-size: 26px;
  }

  .company-meta {
    grid-template-columns: minmax(0, 1fr);
  }

  .company-card,
  .panel {
    padding: 14px;
  }

  .table-panel {
    padding: 0;
  }

  .table-actions > .btn,
  .table-actions > form {
    flex-basis: 100%;
  }

  body.auth-page {
    align-items: flex-start;
    padding:
      max(12px, env(safe-area-inset-top))
      max(10px, env(safe-area-inset-right))
      max(12px, env(safe-area-inset-bottom))
      max(10px, env(safe-area-inset-left));
  }

  .auth-panel,
  .auth-panel.centered {
    width: 100%;
  }

  .auth-card,
  .auth-card.wide {
    padding: 21px 16px;
  }
}

/* Em telas de toque, aumenta alvos sem alterar o desktop com mouse. */
@media (pointer: coarse) {
  .nav a,
  .btn,
  .icon-button,
  input,
  select,
  textarea,
  summary {
    min-height: 44px;
  }

  summary {
    display: flex;
    align-items: center;
  }
}

/* ========================================================================== */
/* ZeroPreju Patch 2.2.6 — tema claro/escuro e novos componentes             */
/* ========================================================================== */
.theme-control{display:grid;gap:6px}.theme-control label{font-size:11px;color:var(--muted)}.theme-control select{min-height:36px;padding:7px 10px}.theme-toggle{display:inline-grid;place-items:center;width:40px;height:40px;border:1px solid var(--border2);border-radius:10px;background:#132238;color:var(--text);cursor:pointer}.theme-toggle.compact{margin-left:auto;width:38px;height:38px}.plan-pending-banner{display:flex;align-items:flex-start;gap:12px;padding:15px 17px;margin-bottom:18px;border:1px solid #8a6414;border-radius:13px;background:#34270d;color:#fde68a}.plan-pending-banner>span{font-size:22px;line-height:1}.plan-pending-banner b{display:block;margin-bottom:4px}.plan-pending-banner p{margin:0;color:#f4d68c;line-height:1.45}.store-editor{border-top:1px solid var(--border);padding-top:13px}.store-editor summary{cursor:pointer;font-weight:800}.store-editor .inner{margin-top:13px}.store-delete-zone{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:13px;border-top:1px solid #61252b}.store-delete-zone small{display:block;color:var(--muted);margin-top:3px}.import-help{margin:14px 0;padding:14px;border:1px solid var(--border);border-radius:11px;background:rgba(37,99,235,.07)}.import-help p{margin:0 0 10px;line-height:1.5}.import-help p:last-child{margin-bottom:0}.import-columns{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:10px}.import-columns span{padding:5px 8px;border-radius:999px;background:#17345e;color:#bfdbfe;font-size:11px;font-weight:750}

:root[data-theme="light"]{
  --bg:#eef3f9;
  --bg2:#f6f8fc;
  --panel:#ffffff;
  --panel2:#f7f9fc;
  --border:#d8e0ea;
  --border2:#c5d0de;
  --text:#172033;
  --muted:#64748b;
  --shadow:0 14px 34px rgba(30,41,59,.10);
  color-scheme:light;
}
html[data-theme="light"] body:not(.auth-page){background:radial-gradient(circle at top right,#dce9ff 0,transparent 30%),var(--bg2);color:var(--text)}
html[data-theme="light"] .sidebar{background:#ffffff;border-right-color:#dce3ed;box-shadow:7px 0 24px rgba(30,41,59,.05)}
html[data-theme="light"] .brand small,
html[data-theme="light"] .user-box small,
html[data-theme="light"] .product-cell small,
html[data-theme="light"] td small{color:#64748b}
html[data-theme="light"] .nav a{color:#53637a}
html[data-theme="light"] .nav a:hover{background:#eef4ff;color:#172033}
html[data-theme="light"] .nav a.active{background:#e7f0ff;color:#1d5cc7;border-color:#bfd5fa}
html[data-theme="light"] .sidebar-footer{border-top-color:#dce3ed}
html[data-theme="light"] .avatar{background:#e5efff;color:#1d5cc7}
html[data-theme="light"] .mobile-top{background:#ffffff;border-bottom-color:#dce3ed;color:#172033}
html[data-theme="light"] .theme-toggle{background:#f7f9fc;color:#172033;border-color:#c5d0de}
html[data-theme="light"] .panel{background:linear-gradient(180deg,#ffffff,#fafbfd);border-color:#d8e0ea}
html[data-theme="light"] .metric-card,
html[data-theme="light"] .company-card{background:#ffffff;border-color:#d8e0ea}
html[data-theme="light"] .metric-card span{color:#5f6f85}
html[data-theme="light"] .alert-row,
html[data-theme="light"] .mini-row{border-bottom-color:#e1e7ef}
html[data-theme="light"] .alert-row:hover,
html[data-theme="light"] .mini-row:hover,
html[data-theme="light"] .mini-row.selected{background:#f0f5fc}
html[data-theme="light"] .thumb{background:#f1f5f9;border-color:#d5dde8}
html[data-theme="light"] .status-pill{background:#e9eef5;color:#425269}
html[data-theme="light"] .status-pill.ok,
html[data-theme="light"] .status-pill.status-acima_60_dias,
html[data-theme="light"] .status-pill.status-acima_60{background:#dcfce7;color:#166534}
html[data-theme="light"] .status-pill.off{background:#e5e7eb;color:#4b5563}
html[data-theme="light"] .status-pill.warning,
html[data-theme="light"] .status-pill.status-ate_30_dias{background:#fef3c7;color:#854d0e}
html[data-theme="light"] .status-pill.status-vencido,
html[data-theme="light"] .status-pill.status-vence_hoje{background:#fee2e2;color:#991b1b}
html[data-theme="light"] .status-pill.status-ate_15_dias{background:#ffedd5;color:#9a3412}
html[data-theme="light"] .status-pill.status-ate_60_dias{background:#dbeafe;color:#1e40af}
html[data-theme="light"] .info-strip{border-color:#bfd5fa;background:#eaf2ff;color:#264b83}
html[data-theme="light"] label{color:#435269}
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea{border-color:#cbd5e1;background:#ffffff;color:#172033}
html[data-theme="light"] input:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] textarea:focus{border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.12)}
html[data-theme="light"] .btn{background:#f5f7fa;color:#26364c;border-color:#c5d0de}
html[data-theme="light"] .btn:hover{background:#eaf0f7;border-color:#9fb0c5}
html[data-theme="light"] .btn-primary{background:linear-gradient(180deg,#3478f6,#1d56ce);border-color:#3478f6;color:#fff}
html[data-theme="light"] .btn-danger{background:#fff1f2;border-color:#f3a7ad;color:#a71924}
html[data-theme="light"] .btn-ghost{background:transparent}
html[data-theme="light"] .advanced{background:#f7f9fc;border-color:#d8e0ea}
html[data-theme="light"] .photo-preview{background:#f5f7fa;border-color:#cbd5e1;color:#64748b}
html[data-theme="light"] .divider,
html[data-theme="light"] .table-actions{border-color:#e1e7ef;background:transparent}
html[data-theme="light"] th{background:#eef3f8;color:#526176}
html[data-theme="light"] td{border-top-color:#e1e7ef;color:#26364c}
html[data-theme="light"] tbody tr:hover{background:#f1f5fa}
html[data-theme="light"] .selectable-row.selected-row{background:#e2edff!important;box-shadow:inset 3px 0 #2563eb}
html[data-theme="light"] .danger-panel{border-color:#f3a7ad;background:linear-gradient(180deg,#fff7f7,#fffafa)}
html[data-theme="light"] .danger-zone,
html[data-theme="light"] .store-delete-zone{border-color:#f0b7bc}
html[data-theme="light"] .camera-card,
html[data-theme="light"] .error-card{background:#ffffff;border-color:#cbd5e1;color:#172033}
html[data-theme="light"] .import-help{background:#f3f7ff}
html[data-theme="light"] .import-columns span{background:#e0ebff;color:#1e4f9f}
html[data-theme="light"] .plan-pending-banner{background:#fff8dc;border-color:#e5c45e;color:#6f5010}
html[data-theme="light"] .plan-pending-banner p{color:#755c26}

@media(max-width:520px){.store-delete-zone{align-items:stretch;flex-direction:column}.store-delete-zone form,.store-delete-zone .btn{width:100%}.theme-control{display:none}}

/* Patch 2.2.7 — isolamento por loja e permissões de funcionários */
.nav a.nav-sub{margin-left:18px;padding-top:8px;padding-bottom:8px;font-size:12px;border-left:2px solid var(--border)}
.access-info-panel{margin-bottom:18px}.access-rules{display:grid;gap:8px;color:var(--muted);font-size:13px;line-height:1.45}.access-user-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}.access-user-card{display:grid;gap:16px}.access-user-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.compact-user-box{padding:0;background:transparent;border:0}.store-access-form{display:grid;gap:14px}.access-all-check{align-items:flex-start;padding:13px;border:1px solid var(--border);border-radius:12px;background:rgba(37,99,235,.06)}.access-all-check span{display:grid;gap:3px}.access-all-check small,.store-access-option small{color:var(--muted)}.store-access-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}.store-access-option{display:flex;align-items:flex-start;gap:10px;padding:12px;border:1px solid var(--border);border-radius:11px;background:var(--panel2);cursor:pointer}.store-access-option span{display:grid;gap:3px}.store-access-option.store-inactive{opacity:.55;cursor:not-allowed}.access-summary{padding:10px 12px;border-radius:10px;background:rgba(30,64,175,.10);color:var(--muted);font-size:13px}.access-summary b{color:var(--text)}
html[data-theme="light"] .access-all-check{background:#f2f6ff}html[data-theme="light"] .store-access-option{background:#f8fafc}html[data-theme="light"] .access-summary{background:#edf3ff}
@media(max-width:700px){.access-user-grid{grid-template-columns:1fr}.access-user-head{align-items:flex-start}.store-access-list{grid-template-columns:1fr}.nav a.nav-sub{margin-left:10px}}

/* ========================================================================== */
/* ZeroPreju Patch 2.2.8 — contraste no tema claro, modais e foto de perfil   */
/* ========================================================================== */
.avatar.avatar-image{
  object-fit:cover;
  overflow:hidden;
  border:1px solid var(--border2);
  background:var(--panel2);
}

.profile-photo-panel{
  max-width:840px;
}
.profile-photo-editor{
  display:grid;
  grid-template-columns:150px minmax(0,1fr);
  gap:20px;
  align-items:center;
}
.profile-photo-preview{
  width:150px;
  height:150px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px dashed var(--border2);
  border-radius:50%;
  background:var(--panel2);
  color:var(--blue2);
  font-size:50px;
  font-weight:900;
}
.profile-photo-preview img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.profile-photo-actions{
  display:grid;
  gap:12px;
  max-width:430px;
}
.profile-photo-remove{
  margin-top:2px;
}

/* Mantém superfícies de diálogo sincronizadas com o tema ativo. */
.zp-theme-surface,
dialog{
  color:var(--text);
  background:var(--panel);
  border-color:var(--border);
}
dialog{
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:var(--shadow);
}
dialog::backdrop{
  background:rgba(2,6,23,.62);
  backdrop-filter:blur(2px);
}

/* O tema claro precisa conservar a identidade visual das faixas de validade. */
html[data-theme="light"] .metric-card.danger{
  background:linear-gradient(135deg,#ffffff 0%,#fff1f2 100%)!important;
  border-color:#fecaca!important;
  border-left:5px solid #dc2626!important;
  box-shadow:0 12px 28px rgba(220,38,38,.10);
}
html[data-theme="light"] .metric-card.warning{
  background:linear-gradient(135deg,#ffffff 0%,#fff7ed 100%)!important;
  border-color:#fed7aa!important;
  border-left:5px solid #ea580c!important;
  box-shadow:0 12px 28px rgba(234,88,12,.10);
}
html[data-theme="light"] .metric-card.caution{
  background:linear-gradient(135deg,#ffffff 0%,#fefce8 100%)!important;
  border-color:#fde68a!important;
  border-left:5px solid #ca8a04!important;
  box-shadow:0 12px 28px rgba(202,138,4,.10);
}
html[data-theme="light"] .metric-card.success{
  background:linear-gradient(135deg,#ffffff 0%,#f0fdf4 100%)!important;
  border-color:#bbf7d0!important;
  border-left:5px solid #16a34a!important;
  box-shadow:0 12px 28px rgba(22,163,74,.10);
}
html[data-theme="light"] .metric-card.danger span{color:#991b1b}
html[data-theme="light"] .metric-card.warning span{color:#9a3412}
html[data-theme="light"] .metric-card.caution span{color:#854d0e}
html[data-theme="light"] .metric-card.success span{color:#166534}

/* Corrige caixas e modais que possuíam fundos escuros fixos. */
html[data-theme="light"] .zp-theme-surface,
html[data-theme="light"] dialog,
html[data-theme="light"] .modal-card,
html[data-theme="light"] .modal-content,
html[data-theme="light"] .movement-dialog,
html[data-theme="light"] .movement-modal-content,
html[data-theme="light"] .movimentacao-modal-content,
html[data-theme="light"] .stock-dialog,
html[data-theme="light"] .stock-modal-card{
  background:#ffffff!important;
  color:#172033!important;
  border-color:#cbd5e1!important;
  box-shadow:0 24px 60px rgba(30,41,59,.18)!important;
}
html[data-theme="light"] .zp-theme-surface form,
html[data-theme="light"] dialog form{
  color:#172033;
  background:transparent;
}
html[data-theme="light"] .subscription-grid>div{
  background:#f7f9fc;
  border-color:#d8e0ea;
}
html[data-theme="light"] .profile-photo-preview{
  background:#f5f7fa;
  border-color:#cbd5e1;
  color:#1d5cc7;
}
html[data-theme="light"] .avatar.avatar-image{
  border-color:#c5d0de;
  background:#eef3f8;
}

@media(max-width:640px){
  .profile-photo-editor{
    grid-template-columns:1fr;
    justify-items:center;
  }
  .profile-photo-actions{
    width:100%;
    max-width:none;
  }
  .profile-photo-actions .btn,
  .profile-photo-remove{
    width:100%;
  }
}