:root{--bg:#0d0f14;--bg2:#13161e;--bg3:#1a1d27;--border:#252836;--border2:#2f3347;--text1:#e8eaf0;--text2:#8b8fa8;--text3:#555872;--accent:#4f7ef8;--accent2:#3a63d4;--green:#22c77a;--amber:#f59e0b;--red:#ef4444;--purple:#a78bfa;--teal:#2dd4bf;--mono:'DM Mono',monospace;--sans:'Sora',sans-serif;--r:8px;--r2:12px;--r3:16px} /* ── TEMA CLARO (ativado via [data-theme="light"] no ) ── */ [data-theme="light"]{--bg:#eef1f7;--bg2:#ffffff;--bg3:#f3f5fa;--border:#e2e6ef;--border2:#d0d6e2;--text1:#1a1d27;--text2:#525871;--text3:#8b90a6;--accent:#2f5fe0;--accent2:#2348c0;--green:#15914f;--amber:#b8770a;--red:#dc3545;--purple:#7c5cf0;--teal:#0d9488} [data-theme="light"] table.tbl tr:hover td{background:rgba(0,0,0,0.03)} [data-theme="light"] table.tbl td{border-bottom-color:#eceff5} .theme-toggle{background:var(--bg3);border:1px solid var(--border2);color:var(--text2);width:34px;height:34px;border-radius:var(--r);cursor:pointer;font-size:15px;line-height:1;display:flex;align-items:center;justify-content:center;transition:all .15s;flex-shrink:0;padding:0} .theme-toggle:hover{color:var(--text1);border-color:var(--accent)} *{box-sizing:border-box;margin:0;padding:0}html,body{height:100%} body{font-family:var(--sans);background:var(--bg);color:var(--text1);display:flex;font-size:14px;line-height:1.6} .sidebar{width:220px;min-height:100vh;background:var(--bg2);border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;position:sticky;top:0;height:100vh;overflow-y:auto} .logo{padding:20px 16px 16px;border-bottom:1px solid var(--border)} .logo-mark{font-family:var(--mono);font-size:18px;font-weight:500;color:var(--accent);letter-spacing:-0.5px} .logo-sub{font-size:10px;color:var(--text3);letter-spacing:1.5px;text-transform:uppercase;margin-top:2px} .empresa-badge{margin:12px;background:var(--bg3);border:1px solid var(--border);border-radius:var(--r);padding:8px 10px;font-size:11px} .empresa-badge .label{color:var(--text3);font-size:9px;letter-spacing:1px;text-transform:uppercase} .empresa-badge .nome{color:var(--text1);font-weight:500;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #master-empresa-wrap{margin:0 12px 8px;display:none} #master-empresa-sel{width:100%;background:var(--bg3);border:1px solid var(--border2);color:var(--text1);padding:5px 8px;border-radius:var(--r);font-size:11px;font-family:var(--sans)} nav{flex:1;padding:8px}.nav-group{margin-bottom:4px} .nav-group-label{font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--text3);padding:8px 8px 4px} .nav-item{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:var(--r);cursor:pointer;color:var(--text2);font-size:13px;transition:all 0.15s;border:none;background:none;width:100%;text-align:left} .nav-item:hover{background:var(--bg3);color:var(--text1)}.nav-item.active{background:rgba(79,126,248,0.12);color:var(--accent)} .nav-item .icon{width:16px;text-align:center;font-size:14px;flex-shrink:0} .sidebar-footer{padding:12px;border-top:1px solid var(--border)} .user-info{display:flex;align-items:center;gap:8px;padding:6px 4px} .avatar{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--purple));display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;color:white;flex-shrink:0} .user-name{font-size:12px;font-weight:500}.user-email{font-size:10px;color:var(--text3)} .logout-btn{margin-top:6px;width:100%;background:none;border:1px solid var(--border);color:var(--text2);padding:5px;border-radius:var(--r);cursor:pointer;font-size:11px;font-family:var(--sans);transition:all 0.15s} .logout-btn:hover{border-color:var(--red);color:var(--red)} .main{flex:1;display:flex;flex-direction:column;min-height:100vh;overflow:auto} .topbar{height:52px;border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 24px;gap:12px;background:var(--bg2);position:sticky;top:0;z-index:10} .page-title{font-size:15px;font-weight:500}.topbar-actions{margin-left:auto;display:flex;gap:8px} .content{padding:24px;flex:1} .stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:24px} .stat-card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r2);padding:16px} .stat-label{font-size:11px;color:var(--text3);letter-spacing:0.5px}.stat-value{font-size:26px;font-weight:600;margin:4px 0 2px;font-family:var(--mono)}.stat-sub{font-size:11px;color:var(--text2)} .stat-accent{color:var(--accent)}.stat-green{color:var(--green)}.stat-amber{color:var(--amber)}.stat-red{color:var(--red)} .panel{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r2);margin-bottom:16px} .panel-head{padding:14px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px} .panel-title{font-size:14px;font-weight:500}.panel-body{padding:18px} .tabs{display:flex;border-bottom:1px solid var(--border);padding:0 4px} .tab-btn{padding:10px 16px;background:none;border:none;color:var(--text2);cursor:pointer;font-size:13px;font-family:var(--sans);border-bottom:2px solid transparent;transition:all 0.15s;margin-bottom:-1px} .tab-btn.active{color:var(--accent);border-bottom-color:var(--accent)} .tab-pane{display:none;padding:18px}.tab-pane.active{display:block} /* Configurações: navegação lateral agrupada + barra de salvar (escopado em .cfg-panel) */ .cfg-panel{display:grid;grid-template-columns:214px minmax(0,1fr)} .cfg-sidenav{display:flex;flex-direction:column;gap:1px;padding:8px;border-right:1px solid var(--border)} .cfg-sidenav .cfg-grp{font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--text3);padding:10px 8px 3px} .cfg-sidenav .tab-btn{display:flex;align-items:center;gap:9px;width:100%;text-align:left;margin:0;padding:7px 9px;border:none;border-radius:var(--r);background:none;color:var(--text2);font-size:13px} .cfg-sidenav .tab-btn:hover{background:var(--bg3);color:var(--text1)} .cfg-sidenav .tab-btn.active{background:rgba(79,126,248,0.12);color:var(--accent);font-weight:500;border:none} .cfg-sidenav .tab-btn .ci{font-size:15px;width:18px;text-align:center;flex-shrink:0} .cfg-sidenav .tab-btn .sc{margin-left:auto;font-size:11px;opacity:.55} .cfg-leg{display:flex;gap:14px;font-size:10px;color:var(--text3);padding:10px 8px 2px;margin-top:6px;border-top:1px solid var(--border)} .cfg-content{min-width:0} .cfg-savebar{grid-column:1/-1;position:sticky;bottom:0;display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--bg2);border-top:1px solid var(--border);border-radius:0 0 var(--r2) var(--r2)} @media(max-width:860px){.cfg-panel{grid-template-columns:1fr}.cfg-sidenav{flex-direction:row;flex-wrap:wrap;border-right:none;border-bottom:1px solid var(--border)}.cfg-sidenav .cfg-grp,.cfg-leg,.cfg-sidenav .tab-btn .sc{display:none}} .form-grid{display:grid;gap:14px}.form-grid-2{grid-template-columns:1fr 1fr}.form-grid-3{grid-template-columns:1fr 1fr 1fr} .form-group{display:flex;flex-direction:column;gap:5px} .form-label{font-size:11px;color:var(--text2);font-weight:500;letter-spacing:0.3px} .form-control{background:var(--bg3);border:1px solid var(--border2);border-radius:var(--r);color:var(--text1);padding:8px 11px;font-size:13px;font-family:var(--sans);transition:border-color 0.15s;width:100%} .form-control:focus{outline:none;border-color:var(--accent)}.form-control::placeholder{color:var(--text3)} select.form-control{cursor:pointer}textarea.form-control{resize:vertical;min-height:80px} .upload-area{border:2px dashed var(--border2);border-radius:var(--r2);padding:24px;text-align:center;cursor:pointer;transition:all 0.2s;background:var(--bg3);position:relative} .upload-area:hover,.upload-area.dragover{border-color:var(--accent);background:rgba(79,126,248,0.05)} .upload-area input[type="file"]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%} .upload-icon{font-size:24px;margin-bottom:6px}.upload-text{color:var(--text2);font-size:13px}.upload-text strong{color:var(--accent)} .upload-hint{font-size:11px;color:var(--text3);margin-top:4px}.upload-list{margin-top:8px;display:flex;flex-direction:column;gap:6px} .upload-file{display:flex;align-items:center;gap:8px;background:var(--bg3);border:1px solid var(--border);border-radius:var(--r);padding:6px 10px;font-size:12px} .upload-file .fname{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.upload-file .fsize{color:var(--text3);font-family:var(--mono);font-size:10px} .upload-file .rm{cursor:pointer;color:var(--text3);padding:2px 4px;border-radius:4px}.upload-file .rm:hover{color:var(--red);background:rgba(239,68,68,0.1)} .btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:var(--r);cursor:pointer;font-size:13px;font-family:var(--sans);font-weight:500;border:none;transition:all 0.15s;white-space:nowrap} .btn-primary{background:var(--accent);color:white}.btn-primary:hover{background:var(--accent2)} .btn-ghost{background:none;border:1px solid var(--border2);color:var(--text2)}.btn-ghost:hover{background:var(--bg3);color:var(--text1)} .btn-green{background:rgba(34,199,122,0.15);color:var(--green);border:1px solid rgba(34,199,122,0.25)} .btn-red{background:rgba(239,68,68,0.12);color:var(--red);border:1px solid rgba(239,68,68,0.2)} .btn-amber{background:rgba(245,158,11,0.12);color:var(--amber);border:1px solid rgba(245,158,11,0.2)} .btn-sm{padding:5px 10px;font-size:12px}.btn:disabled{opacity:0.4;cursor:not-allowed} .table-wrap{overflow-x:auto} table.tbl{width:100%;border-collapse:collapse;font-size:13px} table.tbl th{text-align:left;padding:8px 12px;font-size:10px;font-weight:500;letter-spacing:0.8px;text-transform:uppercase;color:var(--text3);border-bottom:1px solid var(--border)} table.tbl td{padding:10px 12px;border-bottom:1px solid rgba(37,40,54,0.6)} table.tbl tr:hover td{background:rgba(255,255,255,0.02)} table.tbl .num{text-align:right;font-family:var(--mono);font-size:12px} .badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:500} .badge-pendente{background:rgba(245,158,11,0.12);color:var(--amber)} .badge-aprovada{background:rgba(34,199,122,0.12);color:var(--green)} .badge-rejeitada{background:rgba(239,68,68,0.12);color:var(--red)} .badge-enviada{background:rgba(79,126,248,0.12);color:var(--accent)} .badge-recebida{background:rgba(45,212,191,0.12);color:var(--teal)} .badge-rascunho{background:rgba(139,143,168,0.12);color:var(--text2)} .badge-cancelada{background:rgba(239,68,68,0.08);color:var(--red);opacity:0.6} .badge-aberta{background:rgba(45,212,191,0.12);color:var(--teal)} .badge-fechada{background:rgba(139,143,168,0.12);color:var(--text2)} .badge-em_andamento{background:rgba(79,126,248,0.15);color:var(--accent)} .badge-concluida{background:rgba(34,199,122,0.15);color:var(--green)} .badge-cotando{background:rgba(167,139,250,0.15);color:var(--purple)} .badge-comprado{background:rgba(34,199,122,0.15);color:var(--green)} .badge-parcial{background:rgba(245,158,11,0.15);color:var(--amber)} .badge-pendente-item{background:rgba(139,143,168,0.12);color:var(--text2)} .badge-ok{background:rgba(74,222,128,0.12);color:#4ade80} .badge-alerta{background:rgba(245,158,11,0.15);color:var(--amber)} .badge-critico{background:rgba(239,68,68,0.15);color:var(--red)} .tag-chip{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:500;cursor:default} .tag-chip .tc-del{cursor:pointer;opacity:.6;font-size:10px;padding:0 2px}.tag-chip .tc-del:hover{opacity:1} .color-dot{width:12px;height:12px;border-radius:50%;display:inline-block;flex-shrink:0} .cfg-section{border:1px solid var(--border);border-radius:var(--r2);padding:16px;margin-bottom:16px} .cfg-section-title{font-size:11px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px} .stock-bar{height:6px;border-radius:3px;background:var(--bg3);overflow:hidden;margin-top:4px} .stock-bar-fill{height:100%;border-radius:3px;transition:width .3s} .stock-ok{background:#4ade80}.stock-alerta{background:var(--amber)}.stock-critico{background:var(--red)} .mov-entrada{color:#4ade80}.mov-saida{color:var(--red)}.mov-ajuste{color:var(--amber)}.mov-inventario{color:var(--accent)}.mov-transferencia{color:#a78bfa} .badge-urgente{background:rgba(239,68,68,0.15);color:var(--red)} .badge-programacao{background:rgba(245,158,11,0.12);color:var(--amber)} .badge-outros{background:rgba(139,143,168,0.12);color:var(--text2)} .badge-enviada_fornecedor{background:rgba(79,126,248,.12);color:var(--accent)} .badge-docs_recebidos{background:rgba(245,158,11,.12);color:#d97706} .badge-finalizado_aguardando_entrega{background:rgba(16,185,129,.12);color:#059669} .badge-recebida_parcial{background:rgba(245,158,11,.18);color:#b45309} .badge-atrasada{background:rgba(239,68,68,.13);color:var(--red);font-weight:700} .dot{width:6px;height:6px;border-radius:50%;background:currentColor} .fiscal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;background:var(--bg3);border:1px solid var(--border);border-radius:var(--r2);padding:14px;margin-top:12px} .fiscal-item .fi-label{font-size:10px;color:var(--text3);margin-bottom:2px} .fiscal-item .fi-value{font-family:var(--mono);font-size:13px;font-weight:500} .item-row{background:var(--bg3);border:1px solid var(--border);border-radius:var(--r);padding:12px;margin-bottom:8px;display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:10px;align-items:end} .item-row .rm-item{cursor:pointer;color:var(--text3);padding:8px;border-radius:var(--r)}.item-row .rm-item:hover{color:var(--red);background:rgba(239,68,68,0.1)} #login-screen{position:fixed;inset:0;display:flex;z-index:100;background:var(--bg)} /* Painel esquerdo: imagem (cover) + marca sobreposta */ .login-hero{flex:1.25;position:relative;display:flex;align-items:flex-end;background:linear-gradient(135deg,#1b2a4a 0%,#0b0d12 100%);background-size:cover;background-position:center;overflow:hidden} .login-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.66) 0%,rgba(0,0,0,.18) 55%,rgba(0,0,0,0) 100%)} .login-hero-overlay{position:relative;z-index:1;padding:clamp(28px,5vw,64px)} .login-hero-brand{font-family:var(--mono);font-size:clamp(28px,3.4vw,44px);font-weight:600;color:#fff;letter-spacing:1px;text-shadow:0 2px 18px rgba(0,0,0,.55)} .login-hero-tag{font-size:clamp(13px,1.3vw,17px);color:rgba(255,255,255,.92);margin-top:10px;max-width:520px;line-height:1.5;text-shadow:0 1px 12px rgba(0,0,0,.55)} /* Painel direito: formulário em cartão, centralizado verticalmente */ .login-panel{flex:1;display:flex;align-items:center;justify-content:center;padding:24px;min-width:340px} .login-box{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r3);padding:40px;width:100%;max-width:400px;box-shadow:0 12px 40px rgba(0,0,0,.22)} .login-logo{text-align:center;margin-bottom:28px} .login-logo .lm{font-family:var(--mono);font-size:24px;color:var(--accent);font-weight:500} .login-logo .ls{font-size:12px;color:var(--text3);margin-top:4px} .pass-wrap{position:relative;display:flex;align-items:center} .pass-wrap .form-control{flex:1;padding-right:38px} .pass-toggle{position:absolute;right:10px;background:none;border:none;cursor:pointer;color:var(--text3);font-size:15px;padding:0;line-height:1;transition:color 0.15s;user-select:none} .pass-toggle:hover{color:var(--text1)} /* Telas estreitas: esconde o painel da imagem, formulário ocupa tudo */ @media(max-width:820px){.login-hero{display:none}.login-panel{flex:1;min-width:0}} #toast-container{position:fixed;bottom:20px;right:20px;display:flex;flex-direction:column;gap:8px;z-index:999} .toast{background:var(--bg3);border:1px solid var(--border2);border-radius:var(--r2);padding:12px 16px;min-width:260px;max-width:340px;display:flex;align-items:flex-start;gap:10px;animation:slideIn 0.2s ease;box-shadow:0 8px 24px rgba(0,0,0,0.4)} @keyframes slideIn{from{opacity:0;transform:translateX(20px)}} .toast-icon{font-size:16px;flex-shrink:0;margin-top:1px}.toast-msg{font-size:13px}.toast-title{font-weight:500;margin-bottom:1px}.toast-sub{font-size:11px;color:var(--text2)} .toast.ok{border-left:3px solid var(--green)}.toast.err{border-left:3px solid var(--red)}.toast.info{border-left:3px solid var(--accent)} .modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.7);display:flex;align-items:center;justify-content:center;z-index:50;backdrop-filter:blur(4px)} .modal{background:var(--bg2);border:1px solid var(--border2);border-radius:var(--r3);padding:24px;width:700px;max-height:85vh;overflow-y:auto;animation:fadeUp 0.2s ease} .modal-lg{width:860px} @keyframes fadeUp{from{opacity:0;transform:translateY(12px)}} .modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--border)} .modal-title{font-size:16px;font-weight:500} .modal-close{background:none;border:none;color:var(--text3);cursor:pointer;font-size:20px;padding:2px 6px;border-radius:6px}.modal-close:hover{color:var(--text1);background:var(--bg3)} .empty-state{text-align:center;padding:48px;color:var(--text3)}.empty-state .ei{font-size:36px;margin-bottom:8px} .divider{height:1px;background:var(--border);margin:16px 0} .tag{display:inline-block;background:var(--bg3);border:1px solid var(--border);border-radius:4px;padding:1px 6px;font-family:var(--mono);font-size:11px;color:var(--text2)} .drop-hover,.drop-active{background:var(--bg3) !important} .hidden{display:none!important} .loading{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,0.2);border-top-color:white;border-radius:50%;animation:spin 0.6s linear infinite} @keyframes spin{to{transform:rotate(360deg)}} .ranking-card{background:var(--bg3);border:1px solid var(--border);border-radius:var(--r2);padding:14px 16px;margin-bottom:10px;display:flex;align-items:flex-start;gap:14px} .rank-num{font-family:var(--mono);font-size:22px;font-weight:600;width:32px;flex-shrink:0} .rank-num.gold{color:#f59e0b}.rank-num.silver{color:#9ca3af}.rank-num.bronze{color:#cd7c5a} .addr-card{background:var(--bg3);border:1px solid var(--border);border-radius:var(--r);padding:10px 14px;margin-bottom:8px;display:flex;justify-content:space-between;align-items:center;font-size:13px} .section-sub{font-size:11px;color:var(--text3);letter-spacing:0.8px;text-transform:uppercase;margin:14px 0 8px;padding-bottom:4px;border-bottom:1px solid var(--border)} @media print { body > *:not(.ficha-print-root) { display: none !important; } .ficha-print-root { display: block !important; position: static !important; overflow: visible !important; } body.print-basico .ficha-completo-only { display: none !important; } }