/* Slotify 2.1 web theme — mirrors the Android application. */
:root{
  color-scheme:dark;
  --ink:#f7f9ff;
  --muted:#aeb8ca;
  --paper:#07111f;
  --panel:#172232;
  --panel-2:#1f2d40;
  --line:#36465b;
  --green:#3987ff;
  --green-dark:#2872e8;
  --blue:#3987ff;
  --red:#ff4d5e;
  --success:#35c77d;
  --mint:#1f2d40;
  --shadow:0 16px 42px rgba(0,0,0,.28);
}

html{background:var(--paper)}
body{
  min-height:100vh;
  color:var(--ink);
  background:
    radial-gradient(circle at 92% -8%,rgba(57,135,255,.16),transparent 31rem),
    radial-gradient(circle at -12% 92%,rgba(57,135,255,.08),transparent 34rem),
    var(--paper);
}
body:before{display:none!important}
a{color:#79aaff}

.topbar{
  height:74px;
  background:rgba(7,17,31,.88);
  border-bottom:1px solid rgba(174,184,202,.18);
  box-shadow:0 8px 30px rgba(0,0,0,.12);
  backdrop-filter:blur(18px) saturate(130%);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
}
.brand{gap:12px;color:var(--ink);font-size:20px;letter-spacing:-.02em}
.brand-mark{width:42px;height:42px;background:transparent!important}
.topbar nav{gap:9px}
.topbar nav>a,.link-button{
  color:var(--muted);
  border-radius:12px;
  padding:9px 11px;
  transition:background .16s,color .16s;
}
.topbar nav>a:hover,.link-button:hover{color:var(--ink);background:var(--panel)}
.warehouse-switcher select{
  min-height:40px;
  color:var(--ink);
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:12px;
}
.warehouse-switcher option,.sheet-warehouse-switcher option{color:#172233;background:#fff}

.page{padding-top:38px}
.page-heading{margin-bottom:24px}
.page-heading h1{font-size:36px;letter-spacing:-.035em}
.eyebrow{color:#79aaff;font-size:11px;letter-spacing:.14em}
.muted{color:var(--muted)!important}

.panel,.stats article,.login-card,.rack-editor{
  color:var(--ink);
  background:rgba(23,34,50,.92)!important;
  border:1px solid var(--line)!important;
  border-radius:22px;
  box-shadow:var(--shadow);
  backdrop-filter:none;
}
.panel{padding:22px}
.stats{gap:12px}
.stats article{min-height:118px;padding:20px}
.stats span{color:var(--muted)}
.stats strong{font-size:31px;letter-spacing:-.04em}

.quick-actions{grid-template-columns:repeat(3,1fr);gap:12px}
.quick-actions a{
  min-height:154px;
  grid-template-columns:58px 1fr;
  column-gap:15px;
  padding:20px;
  color:var(--ink);
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:22px;
  box-shadow:0 12px 28px rgba(0,0,0,.18);
  transition:transform .16s,border-color .16s,background .16s;
}
.quick-actions a:hover{transform:translateY(-2px);background:var(--panel-2);border-color:#506684}
.quick-actions a>span.action-icon{
  width:58px;height:58px;
  grid-row:1/3;
  display:grid;place-items:center;
  background:transparent;
}
.action-icon svg{width:52px;height:52px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.quick-actions .action-receipt .action-icon{color:var(--blue)}
.quick-actions .action-issue .action-icon{color:var(--red)}
.quick-actions .action-transfer .action-icon{color:var(--blue)}
.quick-actions strong{align-self:end;font-size:20px;letter-spacing:-.02em}
.quick-actions small{align-self:start;color:var(--muted)}

.inventory-resume,.attention-row{
  display:grid;
  grid-template-columns:44px 1fr auto;
  align-items:center;
  gap:13px;
  margin:0 0 12px;
  padding:15px 17px;
  color:var(--ink);
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:0 10px 24px rgba(0,0,0,.15);
}
.inventory-resume .row-icon,.attention-row .row-icon{
  width:44px;height:44px;display:grid;place-items:center;
  color:var(--blue);background:rgba(57,135,255,.13);border-radius:13px;font-weight:800;font-size:20px;
}
.attention-row .row-icon{color:var(--red);background:rgba(255,77,94,.13)}
.row-icon svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.inventory-resume span strong,.inventory-resume span small,.attention-row span strong,.attention-row span small{display:block}
.inventory-resume small,.attention-row small{margin-top:4px;color:var(--muted)}
.inventory-resume b,.attention-row b{font-size:28px;color:var(--muted);font-weight:400}

.button{min-height:48px;border-radius:15px;padding:12px 18px}
.button.primary{background:var(--blue);color:#fff}
.button.primary:hover{background:var(--green-dark)}
.button.secondary{color:var(--ink);background:var(--panel-2);border:1px solid var(--line)}
.button.danger{color:#fff;background:var(--red);border:0}
.button.danger:hover{background:#e83d50}
.receipt-cancel-form .check-line{display:flex;align-items:flex-start;gap:10px;line-height:1.5}
.receipt-cancel-form .check-line input[type=checkbox]{width:20px;height:20px;min-height:20px;flex:0 0 20px;padding:0;margin:3px 0 0;appearance:auto;accent-color:var(--blue)}

.form-grid input,.form-grid select,.form-grid textarea,.searchbar input,.searchbar select,.stack input,
.map-add input,.map-add select,.simple-field input,.simple-field select,.shelf select,
.label-search-row input,.label-layout-row select,.product-print-form input,.product-print-form select{
  min-height:48px;
  color:var(--ink)!important;
  background:var(--panel-2)!important;
  border:1px solid var(--line)!important;
  border-radius:14px!important;
}
input::placeholder,textarea::placeholder{color:#8390a4!important}
.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus,.searchbar input:focus,.stack input:focus{
  border-color:var(--blue)!important;box-shadow:0 0 0 3px rgba(57,135,255,.18)!important;
}
.form-grid option,.searchbar option,.map-add option,.simple-field option,.shelf option{color:#172233;background:#fff}
.product-print-form{
  display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;
  color:var(--ink);background:var(--panel-2);border:1px solid var(--line);
}
.product-print-form label{min-width:0;max-width:100%;flex:1 1 300px}
.product-print-form label:first-of-type{flex:0 1 140px}
.product-print-form label>span{color:var(--muted)}
.product-print-form input,.product-print-form select{min-width:0;max-width:100%;font:inherit;color-scheme:dark}
.product-print-form option{color:var(--ink);background:var(--panel-2)}
.product-print-form .button{
  flex:1 1 200px;min-width:0;max-width:100%;height:auto;
  white-space:normal;overflow-wrap:anywhere;line-height:1.3;text-align:center;
}
.product-print-form>small{flex:1 0 100%;color:var(--muted);line-height:1.45}
.scan-button,.search-input-with-scan>button{color:#bcd3ff;background:rgba(57,135,255,.14);border-radius:10px}

.operation-tabs{padding:5px;background:#101b2b;border:1px solid var(--line);border-radius:15px}
.operation-tabs button{color:var(--muted);border-radius:11px}
.operation-tabs button.active{color:#fff;background:var(--blue);box-shadow:none}
.confirmation,.stock-info,.stock-total-heading,.product-locations,.movement-route,.scanned-code,.label-print-basket,.print-help{
  color:var(--ink);background:var(--panel-2);border-color:var(--line);
}

table{color:var(--ink)}
th{color:var(--muted);border-color:var(--line)}
td{border-color:rgba(174,184,202,.13)}
.list-cards>a,.list-cards>div,.mobile-list-card,.recent-products-row a,
.label-location-list>label{
  color:var(--ink);background:var(--panel-2);border-color:var(--line);border-radius:15px;
}
.list-cards>a:hover,.recent-products-row a:hover{background:#26364b;border-color:#506684}
.badge,.chip{color:#dce5f4;background:var(--panel-2);border:1px solid rgba(174,184,202,.16)}
.badge.receipt{color:#8bb9ff;background:rgba(57,135,255,.13)}
.badge.issue{color:#ff98a3;background:rgba(255,77,94,.13)}
.badge.transfer{color:#8bb9ff;background:rgba(57,135,255,.13)}
.badge.inventory{color:#8ce0b2;background:rgba(53,199,125,.12)}
.difference{color:#ffb06e}

.message{color:#cfe1ff;background:#162d4a;border-color:#295484}
.message.error{color:#ffb6bd;background:#3b1e29;border-color:#713141}
.message.success{color:#9ce5bc;background:#16382d;border-color:#28624d}
.secure-banner{color:#ffe2a4;background:#3b311e;border-color:#755f2d}

.auth-page{padding:28px;min-height:100svh}
.login-card{width:min(430px,100%);padding:38px}
.login-card h1{font-size:34px;letter-spacing:-.04em}
.brand-mark.large{width:82px;height:82px}

.scanner{background:rgba(2,7,14,.92);backdrop-filter:blur(10px)}
.scanner-card{color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow)}
.scanner-card video{aspect-ratio:3/4;min-height:0;max-height:68vh;object-fit:cover;border-radius:18px;background:#02060c}

.mobile-title strong{color:var(--ink)}
.mobile-title span{color:var(--muted)}
.mobile-bottom-nav{display:none}
.sheet-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sheet-backdrop{background:rgba(0,5,13,.72)}
.mobile-sheet{color:var(--ink);background:#101b2b;border:1px solid var(--line);box-shadow:0 -22px 60px rgba(0,0,0,.55)}
.sheet-handle{background:#536178}
.sheet-heading>button{color:var(--ink);background:var(--panel-2)}
.sheet-menu{overflow:hidden;background:var(--panel);border:1px solid var(--line);border-radius:19px}
.sheet-menu>a,.sheet-menu>button{color:var(--ink);background:transparent;border-color:rgba(174,184,202,.13)}
.sheet-menu>a:active,.sheet-menu>button:active{background:var(--panel-2)}
.sheet-icon{color:#8bb9ff;background:rgba(57,135,255,.13);border-radius:12px}
.sheet-menu small,.sheet-warehouse-switcher label{color:var(--muted)}
.sheet-warehouse-switcher select{color:var(--ink);background:var(--panel-2);border-color:var(--line);border-radius:12px}
.sheet-logout button{color:#ff9ba5;background:rgba(255,77,94,.13);border:1px solid rgba(255,77,94,.18)}

.floor{background:#0d1827!important;border-color:var(--line)!important}
.section-card,.shelf,.add-section{background:var(--panel)!important;border-color:var(--line)!important}
.rack-plan{background:var(--blue);border-color:#75a7ff}
.icon-button{color:var(--ink);background:var(--panel-2)}

@media(max-width:820px){
  body{background:radial-gradient(circle at 110% -5%,rgba(57,135,255,.16),transparent 25rem),var(--paper)}
  .topbar{height:72px;padding:0 18px;background:rgba(7,17,31,.9)}
  .brand{font-size:19px}.brand span:last-child{display:block}.brand-mark{width:40px;height:40px}
  .mobile-title{display:none}.nav-toggle{display:none}
  .topbar nav{display:none!important}
  .page{padding:25px 16px 112px}
  .page-heading h1{font-size:31px}
  .stats{display:flex;overflow-x:auto;gap:9px;margin:0 -16px 18px;padding:0 16px 4px;scrollbar-width:none}
  .stats::-webkit-scrollbar{display:none}.stats article{flex:0 0 145px;min-height:105px;padding:16px;border-radius:19px}.stats strong{font-size:27px}
  .quick-actions{grid-template-columns:1fr 1fr;gap:10px}
  .quick-actions a{min-height:150px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;padding:16px;border-radius:21px}
  .quick-actions a>span.action-icon{width:52px;height:52px;flex:1;display:flex;align-items:flex-start}.action-icon svg{width:48px;height:48px}
  .quick-actions strong{font-size:20px}.quick-actions small{font-size:12px;margin-top:4px}
  .quick-actions .action-transfer{grid-column:1/-1;min-height:88px;display:grid;grid-template-columns:50px 1fr;grid-template-rows:auto auto;column-gap:14px;align-content:center}
  .quick-actions .action-transfer>span.action-icon{grid-row:1/3;width:46px;height:46px}.quick-actions .action-transfer .action-icon svg{width:42px;height:42px}
  .panel{padding:17px;border-radius:20px}
  .inventory-resume,.attention-row{border-radius:17px}
  .mobile-bottom-nav{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    align-items:center;
    left:12px;right:12px;bottom:max(10px,env(safe-area-inset-bottom));
    min-height:76px;padding:7px 7px 8px;
    color:var(--muted);background:rgba(23,34,50,.94);
    border:1px solid var(--line);border-radius:29px;
    box-shadow:0 18px 50px rgba(0,0,0,.48);
    backdrop-filter:blur(20px) saturate(130%);
    -webkit-backdrop-filter:blur(20px) saturate(130%);
  }
  .mobile-bottom-nav a,.mobile-bottom-nav button{min-width:0;color:var(--muted);font-size:10px;font-weight:650;border-radius:19px}
  .mobile-bottom-nav svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .mobile-bottom-nav a.active,.mobile-bottom-nav button.active{color:#fff;background:rgba(57,135,255,.13)}
  .mobile-bottom-nav .global-scan-nav{color:#fff;overflow:visible;background:transparent}
  .global-scan-orb{width:58px;height:58px;margin-top:-28px;color:#fff;background:var(--red)!important;border:5px solid var(--paper);border-radius:50%;box-shadow:0 10px 24px rgba(255,77,94,.32)}
  .global-scan-orb svg{width:28px!important;height:28px!important}.global-scan-nav>span:last-child{margin-top:1px}
  .scanner{padding:12px}.scanner-card{padding:14px}.scanner-card h2{font-size:20px}
}

@media(max-width:420px){
  .page{padding-left:13px;padding-right:13px}.stats{margin-left:-13px;margin-right:-13px;padding-left:13px;padding-right:13px}
  .mobile-bottom-nav{left:8px;right:8px}.mobile-bottom-nav a,.mobile-bottom-nav button{font-size:9px}
}

@media print{
  :root{color-scheme:light}
  html,body{color:#111!important;background:#fff!important}
  .print-sheet,.print-label,.label{color:#111!important;background:#fff!important}
}