@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&display=swap";*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-primary:#020617;--bg-secondary:#0b1120;--bg-card:#0f172ab3;--bg-card-hover:#1e293bcc;--sidebar-bg:#020617;--sidebar-width:280px;--primary:#001334;--primary-glow:#00133480;--primary-light:#0013341a;--secondary:#0ea5e9;--secondary-glow:#0ea5e966;--accent:#a855f7;--accent-glow:#a855f766;--success:#10b981;--warning:#f59e0b;--danger:#ef4444;--info:#3b82f6;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--border:#ffffff14;--border-bright:#ffffff26;--border-focus:#00133499;--glass:blur(16px) saturate(180%);--radius:20px;--radius-sm:12px;--radius-lg:28px;--shadow:0 10px 40px -10px #00000080;--shadow-glow:0 0 30px #00133433;--transition:all .4s cubic-bezier(.23, 1, .32, 1)}[data-theme=light]{--bg-primary:#f8fafc;--bg-secondary:#fff;--bg-card:#fffc;--bg-card-hover:#fff;--sidebar-bg:#fff;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#94a3b8;--border:#0f172a14;--border-bright:#0f172a26;--border-focus:#001334;--shadow:0 10px 30px -5px #0000000d;--shadow-glow:0 0 20px #0013341a}[data-theme=light] .form-control{background:#f1f5f9;border-color:#0f172a1a;color:#0f172a!important}[data-theme=light] select.form-control option{color:#0f172a;background:#fff}body{background:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;min-height:100vh;font-family:Outfit,sans-serif;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:-1;background:radial-gradient(circle at 10% 10%,#0013340d 0%,#0000 40%),radial-gradient(circle at 90% 90%,#a855f70d 0%,#0000 40%),radial-gradient(circle,#0ea5e908 0%,#0000 60%);position:fixed;inset:0}.app-layout{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-width);background:var(--sidebar-bg);border-right:1px solid var(--border);z-index:100;transition:var(--transition);flex-direction:column;display:flex;position:fixed;top:0;bottom:0;left:0}.main-content{margin-left:var(--sidebar-width);flex-direction:column;flex:1;min-height:100vh;display:flex;position:relative}.topbar{background:rgba(var(--bg-primary), .7);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);border-bottom:1px solid var(--border);z-index:90;justify-content:space-between;align-items:center;height:80px;padding:0 40px;display:flex;position:sticky;top:0}.page-content{flex:1;width:100%;max-width:1600px;margin:0 auto;padding:40px}.sidebar-logo{flex-direction:column;gap:6px;padding:40px 32px;display:flex}.sidebar-logo h1{background:linear-gradient(135deg,#fff 0%,#94a3b8 100%);-webkit-text-fill-color:transparent;letter-spacing:-1.5px;-webkit-background-clip:text;font-size:26px;font-weight:900}[data-theme=light] .sidebar-logo h1{background:linear-gradient(135deg,#0f172a 0%,#475569 100%);-webkit-background-clip:text}.sidebar-logo span{text-transform:uppercase;letter-spacing:2px;color:var(--primary);opacity:.9;font-size:11px;font-weight:800}.sidebar-nav{flex:1;padding:12px 20px;overflow-y:auto}.nav-section-label{text-transform:uppercase;letter-spacing:2px;color:var(--text-muted);opacity:.6;padding:32px 12px 12px;font-size:11px;font-weight:800}.nav-item{border-radius:var(--radius-sm);color:var(--text-secondary);transition:var(--transition);border:1px solid #0000;align-items:center;gap:14px;margin-bottom:6px;padding:14px 18px;font-size:14px;font-weight:600;text-decoration:none;display:flex}.nav-item:hover{background:var(--bg-card-hover);color:var(--text-primary);border-color:var(--border);transform:translate(6px)}.nav-item.active{background:linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);color:#fff;box-shadow:0 8px 20px -6px var(--primary-glow);border-color:#ffffff1a}.nav-item svg{width:20px;height:20px;transition:var(--transition)}.nav-item:hover svg{transform:scale(1.1)}.sidebar-user{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);transition:var(--transition);align-items:center;gap:14px;margin:20px;padding:18px;display:flex}.sidebar-user:hover{background:var(--bg-card-hover);border-color:var(--border-bright)}.card{background:var(--bg-card);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);border:1px solid var(--border);border-radius:var(--radius);transition:var(--transition);box-shadow:var(--shadow);padding:32px;position:relative;overflow:hidden}.card:after{content:"";background:linear-gradient(90deg, transparent, var(--border-bright), transparent);opacity:.5;height:1px;position:absolute;top:0;left:0;right:0}.card:hover{border-color:var(--border-focus);transform:translateY(-4px);box-shadow:0 20px 40px -15px #0009}.stats-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;margin-bottom:40px;display:grid}.stat-card{background:var(--bg-card);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);border-radius:var(--radius);border:1px solid var(--border);transition:var(--transition);flex-direction:column;gap:20px;padding:28px;display:flex;position:relative;overflow:hidden}.stat-card:hover{border-color:var(--border-focus);transform:translateY(-6px)}.stat-card:before{content:"";background:var(--primary);filter:blur(50px);opacity:.15;width:120px;height:120px;transition:var(--transition);position:absolute;top:-30px;right:-30px}.stat-card:hover:before{opacity:.3;width:140px;height:140px}.stat-header{justify-content:space-between;align-items:center;display:flex}.stat-icon{width:56px;height:56px;transition:var(--transition);border-radius:18px;justify-content:center;align-items:center;display:flex}.stat-card:hover .stat-icon{transform:rotate(-5deg)scale(1.1)}.stat-icon.indigo{color:#001334;background:#00133426;border:1px solid #00133433}.stat-icon.cyan{color:#38bdf8;background:#0ea5e926;border:1px solid #0ea5e933}.stat-icon.rose{color:#fb7185;background:#f43f5e26;border:1px solid #f43f5e33}.stat-icon.amber{color:#fbbf24;background:#f59e0b26;border:1px solid #f59e0b33}.stat-value{letter-spacing:-1.5px;background:linear-gradient(#fff,#94a3b8);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:36px;font-weight:800}[data-theme=light] .stat-value{background:linear-gradient(#0f172a,#475569);-webkit-background-clip:text}.stat-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px;font-size:14px;font-weight:700}.btn{border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);border:1px solid #0000;justify-content:center;align-items:center;gap:10px;padding:14px 28px;font-family:inherit;font-size:15px;font-weight:700;display:inline-flex;position:relative;overflow:hidden}.btn-primary{background:linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);color:#fff;box-shadow:0 10px 20px -10px var(--primary-glow)}.btn-primary:hover{box-shadow:0 15px 30px -10px var(--primary-glow);filter:brightness(1.1);transform:translateY(-2px)}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:var(--bg-card);border:1px solid var(--border);color:var(--text-primary);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass)}.btn-secondary:hover{background:var(--bg-card-hover);border-color:var(--border-bright);transform:translateY(-2px)}.btn-hover-effect:hover{filter:brightness(1.05);transform:translateY(-2px);box-shadow:0 15px 30px #ffffff4d!important}.table-wrap{background:var(--bg-card);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.table-toolbar{border-bottom:1px solid var(--border);background:#0000001a;justify-content:space-between;align-items:center;padding:28px;display:flex}table{border-collapse:collapse;width:100%}th{text-align:left;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-muted);background:#0003;padding:16px 12px;font-size:12px;font-weight:800}.responsive-section{grid-template-columns:1fr 360px;align-items:start;gap:24px;display:grid}.responsive-section .right-column{flex-direction:column;gap:24px;display:flex}.responsive-card-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;display:flex}@media (width<=900px){.responsive-section{grid-template-columns:1fr;gap:16px}.responsive-section .right-column{width:100%}}[data-theme=light] th{color:#64748b;background:#f1f5f9}td{border-bottom:1px solid var(--border);color:var(--text-primary);transition:var(--transition);padding:16px 12px;font-size:15px}[data-theme=light] td{color:#334155}tr:last-child td{border-bottom:none}tr:hover td{color:var(--text-primary);background:#ffffff08}[data-theme=light] tr:hover td{color:#0f172a;background:#f8fafc}.form-control{border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);transition:var(--transition);width:100%;background:#0003;padding:14px 20px;font-family:inherit;font-size:15px}.form-control option{background:var(--bg-secondary);color:var(--text-primary)}td .form-control{padding:10px 8px}.form-control:focus{border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-light);background:#0000004d;outline:none}.form-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px;margin-bottom:10px;font-size:14px;font-weight:700;display:block}.badge{text-transform:uppercase;letter-spacing:.5px;border-radius:100px;align-items:center;gap:6px;padding:8px 16px;font-size:12px;font-weight:800;display:inline-flex}.badge:before{content:"";background:currentColor;border-radius:50%;width:6px;height:6px}.badge-success{color:#34d399;background:#10b98126;border:1px solid #10b9814d}.badge-warning{color:#fbbf24;background:#f59e0b26;border:1px solid #f59e0b4d}.badge-danger{color:#f87171;background:#ef444426;border:1px solid #ef44444d}.badge-info{color:#60a5fa;background:#3b82f626;border:1px solid #3b82f64d}.alert{border-radius:var(--radius-sm);border:1px solid #0000;align-items:center;gap:12px;margin-bottom:24px;padding:16px 24px;font-size:14px;font-weight:600;animation:.4s cubic-bezier(.23,1,.32,1) slideDown;display:flex}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.alert-success{color:#34d399;background:#10b9811a;border-color:#10b98133}.alert-danger{color:#f87171;background:#ef44441a;border-color:#ef444433}.auth-page{background:radial-gradient(circle at top left, #0ea5e926, transparent 40%), radial-gradient(circle at bottom right, #a855f726, transparent 40%), var(--bg-primary);justify-content:center;align-items:center;min-height:100vh;padding:32px;display:flex;position:relative;overflow:hidden}.auth-page:before{content:"";pointer-events:none;z-index:0;background:url("data:image/svg+xml;utf8,<svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"2\" cy=\"2\" r=\"2\" fill=\"rgba(255,255,255,0.03)\"/></svg>");width:150vw;height:150vh;animation:150s linear infinite rotateBg;position:absolute}[data-theme=light] .auth-page:before{background:url("data:image/svg+xml;utf8,<svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"2\" cy=\"2\" r=\"2\" fill=\"rgba(0,0,0,0.03)\"/></svg>")}.auth-card{-webkit-backdrop-filter:blur(40px)saturate(200%);z-index:1;background:#0f172a99;border:1px solid #ffffff1a;border-radius:32px;width:100%;max-width:480px;padding:60px;position:relative;box-shadow:0 30px 60px -10px #000c,inset 0 1px #ffffff1a}[data-theme=light] .auth-card{background:#ffffffb3;border:1px solid #ffffff80;box-shadow:0 30px 60px -10px #0000001a,0 0 0 1px #0013340d}.auth-header{text-align:center;margin-bottom:40px}.auth-title{letter-spacing:-1.5px;background:linear-gradient(90deg,#fff,#94a3b8);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:12px;font-size:36px;font-weight:900}[data-theme=light] .auth-title{background:linear-gradient(90deg,#0f172a,#475569);-webkit-background-clip:text}.auth-subtitle{color:var(--text-muted);font-size:16px;font-weight:500}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes rotateBg{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.page-content>*{animation:.6s cubic-bezier(.23,1,.32,1) forwards fadeInUp}.stagger-1{animation:.6s cubic-bezier(.23,1,.32,1) .1s both fadeInUp}.stagger-2{animation:.6s cubic-bezier(.23,1,.32,1) .2s both fadeInUp}.stagger-3{animation:.6s cubic-bezier(.23,1,.32,1) .3s both fadeInUp}.stagger-4{animation:.6s cubic-bezier(.23,1,.32,1) .4s both fadeInUp}.stagger-5{animation:.6s cubic-bezier(.23,1,.32,1) .5s both fadeInUp}.auth-card-animated{animation:.8s cubic-bezier(.16,1,.3,1) forwards scaleIn}.auth-input-container{transition:var(--transition);position:relative}.auth-input-container:focus-within{transform:translateY(-2px)}.auth-input-container .form-control{background:#00000040;border:1px solid #ffffff14}[data-theme=light] .auth-input-container .form-control{background:#fffc;border:1px solid #0000001a}.auth-input-container .form-control:focus{border-color:var(--secondary);background:#0006;box-shadow:0 0 0 4px #0ea5e926}[data-theme=light] .auth-input-container .form-control:focus{border-color:var(--primary);background:#fff;box-shadow:0 0 0 4px #0013341a}.auth-input-icon{color:var(--text-muted);transition:var(--transition);position:absolute;top:16px;left:16px}.auth-input-container:focus-within .auth-input-icon{color:var(--secondary);transform:scale(1.1)}[data-theme=light] .auth-input-container:focus-within .auth-input-icon{color:var(--primary)}.modal-overlay{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:1000;background:#020617d9;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--bg-secondary);border:1px solid var(--border-bright);border-radius:32px;width:100%;max-width:600px;padding:48px;animation:.5s cubic-bezier(.23,1,.32,1) fadeInUp;box-shadow:0 50px 100px #0009}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff1a padding-box content-box;border:2px solid #0000;border-radius:20px}::-webkit-scrollbar-thumb:hover{background:#fff3 padding-box content-box;border:2px solid #0000}.avatar{background:var(--bg-card-hover);width:40px;height:40px;color:var(--primary);border:1px solid var(--border);transition:var(--transition);border-radius:12px;justify-content:center;align-items:center;font-size:14px;font-weight:800;display:flex}.page-header{justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:40px;display:flex}.page-title{letter-spacing:-1.5px;background:linear-gradient(90deg,#fff,#94a3b8);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:8px;font-size:32px;font-weight:900}[data-theme=light] .page-title{background:linear-gradient(90deg,#0f172a,#475569);-webkit-background-clip:text}.page-subtitle{color:var(--text-muted);font-size:16px;font-weight:500}.page-actions{align-items:center;gap:12px;display:flex}.page-loader{background:var(--bg-primary);z-index:2000;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.spinner{border:4px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:48px;height:48px;animation:1s cubic-bezier(.4,0,.2,1) infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.divider{background:var(--border);height:1px;margin:32px 0;position:relative}.divider:after{content:"";background:var(--primary);width:60px;height:1px;position:absolute;top:0;left:50%;transform:translate(-50%)}.mt-4{margin-top:16px}.mt-6{margin-top:24px}.mt-8{margin-top:32px}.mb-6{margin-bottom:24px}.text-center{text-align:center}.w-full{width:100%}.btn-icon{border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;padding:0;display:flex}.grid-2{grid-template-columns:1fr 1fr;gap:32px;display:grid}.grid-3{grid-template-columns:1fr 1fr 1fr;gap:32px;display:grid}@media (width<=1200px){.grid-3{grid-template-columns:1fr 1fr}}.premium-header{color:#fff;transition:var(--transition);background:linear-gradient(135deg,#001334 0%,#1e40af 100%);border-radius:0 0 60px 60px;padding:60px 48px 100px;position:relative;overflow:hidden;box-shadow:0 20px 40px #00133426}.premium-header-content{zIndex:1;justify-content:space-between;align-items:flex-end;display:flex;position:relative}.stats-grid-responsive{grid-template-columns:repeat(4,1fr);gap:24px;margin-bottom:32px;display:grid}.grid-form-fields,.grid-info-fields{grid-template-columns:repeat(2,1fr);gap:32px;display:grid}.logistics-grid-responsive{grid-template-columns:1fr 1fr;gap:32px;display:grid}.desktop-table-container{padding:0 40px}.mobile-items-list{display:none}.footer-actions{justify-content:flex-end;gap:16px;display:flex}@media (width<=768px){.page-content-wrapper{padding:0 12px!important}.premium-header{border-radius:0 0 24px 24px!important;padding:32px 16px 48px!important}.premium-header-content{flex-direction:column;gap:20px;text-align:center!important;align-items:center!important}.premium-header-content>div:first-child{text-align:center!important;flex-direction:column!important;align-items:center!important}.page-actions,.action-stack{flex-direction:column;width:100%}.page-actions .btn{justify-content:center;width:100%}.grid-form-fields,.grid-info-fields{grid-template-columns:1fr!important;gap:16px!important}.desktop-table-container{display:none!important}.mobile-items-list{display:block!important}.logistics-grid-responsive{grid-template-columns:1fr!important;gap:16px!important}.footer-actions{flex-direction:column;gap:12px!important}.footer-actions .btn{width:100%}}.stats-grid-3{grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:32px;display:grid}.table-container{background:var(--bg-card);box-shadow:var(--shadow);border:1px solid var(--border);border-radius:24px;overflow-x:auto}[data-theme=light] .table-container{background:#fff;border-color:#e2e8f0;box-shadow:0 4px 20px #00000008}.page-content-wrapper{padding:0 48px}@media (width<=1024px){.sidebar{transform:translate(-100%)}.main-content{margin-left:0}.page-content{padding:32px 24px}.topbar{padding:0 24px}.premium-header{border-radius:0 0 40px 40px;padding:40px 24px 80px}.premium-header-content{flex-direction:column;align-items:flex-start;gap:24px}.stats-grid-responsive{grid-template-columns:repeat(2,1fr)}.stats-grid-3{grid-template-columns:repeat(3,1fr)}.page-content-wrapper{padding:0 24px}}@media (width<=768px){.grid-2,.grid-3{grid-template-columns:1fr}.auth-card{border-radius:24px;padding:40px 24px}.auth-title{font-size:28px}.auth-subtitle{font-size:15px}.page-header{flex-direction:column;align-items:flex-start;gap:16px}.page-title{font-size:26px}.page-content-wrapper{padding:0 16px}.stats-grid-3{grid-template-columns:1fr}}@media (width<=640px){.stats-grid-responsive{grid-template-columns:1fr}.premium-header h1{font-size:28px!important}.premium-header p{font-size:13px!important}}@media (width<=480px){.auth-page{padding:16px}.auth-card{padding:32px 20px}.auth-header img{width:60px;height:60px}.auth-header h1{font-size:22px}}.status-select{transition:all .3s;border:none!important;border-radius:8px!important}.status-select.draft{color:var(--warning)!important;background:#f59e0b1a!important}.status-select.send{color:var(--secondary)!important;background:#0ea5e91a!important}.status-select.paid{color:var(--success)!important;background:#10b9811a!important}.status-select.overdue{color:var(--danger)!important;background:#ef44441a!important}[data-theme=light] .status-select option{color:#000!important;background:#fff!important}[data-theme=dark] .status-select option{background:var(--bg-secondary)!important;color:#fff!important}@keyframes iosAppOpen{0%{opacity:0;filter:blur(8px);transform:scale(.85)translateY(40px)}60%{filter:blur();transform:scale(1.02)translateY(-4px)}80%{transform:scale(.99)translateY(1px)}to{opacity:1;filter:blur();transform:scale(1)translateY(0)}}@keyframes iosFadeInUp{0%{opacity:0;transform:translateY(20px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.auth-card-animated{transform-origin:50%;animation:.8s cubic-bezier(.16,1,.3,1) forwards iosAppOpen}.auth-header-animated{animation:.6s cubic-bezier(.16,1,.3,1) .1s both iosFadeInUp}.auth-switcher-animated{animation:.6s cubic-bezier(.16,1,.3,1) .2s both iosFadeInUp}.auth-form-animated{animation:.6s cubic-bezier(.16,1,.3,1) .3s both iosFadeInUp}.ios-transition-container{transform-origin:top;transition:all .5s cubic-bezier(.16,1,.3,1);overflow:hidden}
