:root{--primary:#0f766e;--primary-dark:#0d5c55;--primary-light:#14b8a6;--accent:#14b8a6;--accent-light:#99f6e4;--bg:#f8fafc;--bg-card:#fff;--bg-teal:#f0fdfa;--bg-teal-strong:#ccfbf1;--ink:#0f172a;--ink-secondary:#475569;--ink-muted:#94a3b8;--line:#e2e8f0;--line-strong:#cbd5e1;--white:#fff;--green:#16a34a;--green-bg:#dcfce7;--amber:#d97706;--amber-bg:#fef3c7;--red:#dc2626;--red-bg:#fee2e2;--blue:#2563eb;--blue-bg:#dbeafe;--purple:#7c3aed;--purple-bg:#ede9fe;--shadow-sm:0 1px 2px #0f172a0f;--shadow:0 1px 3px #0f172a1a, 0 1px 2px #0f172a0f;--shadow-md:0 4px 6px -1px #0f172a1a, 0 2px 4px -2px #0f172a1a;--radius:8px;--radius-sm:6px;--radius-lg:12px;--sidebar-w:240px;--font:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased;font-size:14px;line-height:1.5}a{color:inherit;text-decoration:none}button{cursor:pointer;font-family:inherit;font-size:inherit}input,select,textarea{font-family:inherit;font-size:inherit}.app-shell{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-w);background:var(--white);border-right:1px solid var(--line);z-index:50;flex-direction:column;min-height:100vh;display:flex;position:fixed;top:0;bottom:0;left:0;overflow-y:auto}.sidebar-brand{border-bottom:1px solid var(--line);align-items:center;gap:10px;padding:20px 18px 16px;display:flex}.sidebar-brand .logo{background:var(--primary);color:#fff;border-radius:8px;flex-shrink:0;place-items:center;width:36px;height:36px;font-size:15px;font-weight:800;display:grid}.sidebar-brand .brand-text strong{color:var(--ink);font-size:15px;display:block}.sidebar-brand .brand-text span{color:var(--ink-muted);margin-top:1px;font-size:11px;display:block}.sidebar-nav{flex-direction:column;flex:1;gap:2px;padding:12px 10px;display:flex}.sidebar-nav a{border-radius:var(--radius-sm);color:var(--ink-secondary);align-items:center;gap:10px;padding:9px 12px;font-size:13.5px;font-weight:500;transition:all .15s;display:flex}.sidebar-nav a:hover{background:var(--bg-teal);color:var(--primary)}.sidebar-nav a.active{background:var(--bg-teal-strong);color:var(--primary);font-weight:600}.sidebar-nav a svg{opacity:.7;flex-shrink:0;width:18px;height:18px}.sidebar-nav a.active svg,.sidebar-nav a:hover svg{opacity:1}.sidebar-nav .nav-badge{background:var(--primary);color:#fff;text-align:center;border-radius:999px;min-width:20px;margin-left:auto;padding:2px 7px;font-size:10px;font-weight:700}.sidebar-footer{border-top:1px solid var(--line);padding:12px 10px}.sidebar-footer .org-info{align-items:center;gap:10px;padding:9px 12px;display:flex}.sidebar-footer .org-avatar{background:var(--bg-teal);width:28px;height:28px;color:var(--primary);border-radius:6px;place-items:center;font-size:12px;font-weight:700;display:grid}.sidebar-footer .org-name{color:var(--ink);font-size:12px;font-weight:600}.sidebar-footer .org-role{color:var(--ink-muted);font-size:11px}.main-area{margin-left:var(--sidebar-w);flex-direction:column;flex:1;min-height:100vh;display:flex}.main-header{background:var(--white);border-bottom:1px solid var(--line);z-index:40;justify-content:space-between;align-items:center;padding:16px 28px;display:flex;position:sticky;top:0}.main-header h1{color:var(--ink);font-size:20px;font-weight:700}.main-header .header-actions{align-items:center;gap:12px;display:flex}.header-search{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-sm);width:240px;color:var(--ink-muted);align-items:center;gap:8px;padding:7px 12px;font-size:13px;display:flex}.header-search input{color:var(--ink);background:0 0;border:none;outline:none;flex:1}.header-search input::placeholder{color:var(--ink-muted)}.header-avatar{background:var(--primary);color:#fff;border-radius:50%;place-items:center;width:32px;height:32px;font-size:13px;font-weight:700;display:grid}.main-content{flex:1;padding:24px 28px}.btn{border-radius:var(--radius-sm);border:1px solid var(--line);background:var(--white);color:var(--ink-secondary);white-space:nowrap;align-items:center;gap:6px;padding:8px 16px;font-size:13px;font-weight:600;transition:all .15s;display:inline-flex}.btn:hover{background:var(--bg);border-color:var(--line-strong)}.btn-primary{background:var(--primary);border-color:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark);border-color:var(--primary-dark)}.btn-accent{background:var(--accent);border-color:var(--accent);color:#fff}.btn-accent:hover{opacity:.9}.btn-danger{border-color:var(--red);color:var(--red)}.btn-danger:hover{background:var(--red-bg)}.btn-ghost{color:var(--ink-secondary);background:0 0;border-color:#0000}.btn-ghost:hover{background:var(--bg)}.btn-sm{padding:5px 10px;font-size:12px}.btn-lg{padding:10px 20px;font-size:14px}.btn-icon{place-items:center;width:34px;height:34px;padding:0;display:grid}.stats-grid{grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px;display:grid}.stat-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);flex-direction:column;gap:8px;padding:20px;display:flex}.stat-card .stat-label{color:var(--ink-muted);text-transform:uppercase;letter-spacing:.3px;font-size:12px;font-weight:600}.stat-card .stat-value{color:var(--ink);font-size:28px;font-weight:800;line-height:1}.stat-card .stat-sub{color:var(--ink-secondary);margin-top:2px;font-size:12px}.stat-card .stat-icon{border-radius:var(--radius);color:#fff;place-items:center;width:40px;height:40px;margin-bottom:4px;font-size:18px;display:grid}.stat-card .stat-icon.teal{background:var(--primary)}.stat-card .stat-icon.amber{background:var(--amber)}.stat-card .stat-icon.blue{background:var(--blue)}.stat-card .stat-icon.green{background:var(--green)}.stat-card .stat-change{font-size:12px;font-weight:600}.stat-card .stat-change.up{color:var(--green)}.stat-card .stat-change.down{color:var(--red)}.card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden}.card-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.card-header h2{color:var(--ink);font-size:15px;font-weight:700}.card-header .card-actions{gap:8px;display:flex}.card-body{padding:20px}.card-body:only-child{border-bottom:none}.card-footer{border-top:1px solid var(--line);background:var(--bg);color:var(--ink-secondary);padding:12px 20px;font-size:13px}.grid-2{grid-template-columns:1fr 1fr;gap:16px;display:grid}.grid-3{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}.grid-4{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}.grid-auto{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;display:grid}.dashboard-grid{grid-template-columns:1fr 1fr;gap:20px;display:grid}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:13px}thead th{text-align:left;text-transform:uppercase;letter-spacing:.4px;color:var(--ink-muted);background:var(--bg);border-bottom:1px solid var(--line);white-space:nowrap;padding:10px 14px;font-size:11px;font-weight:700}tbody td{border-bottom:1px solid var(--line);color:var(--ink-secondary);vertical-align:middle;padding:12px 14px}tbody tr:hover{background:var(--bg-teal)}tbody tr:last-child td{border-bottom:none}.badge{letter-spacing:.2px;white-space:nowrap;border-radius:999px;align-items:center;gap:4px;padding:3px 8px;font-size:11px;font-weight:700;display:inline-flex}.badge-green{background:var(--green-bg);color:var(--green)}.badge-amber{background:var(--amber-bg);color:var(--amber)}.badge-red{background:var(--red-bg);color:var(--red)}.badge-blue{background:var(--blue-bg);color:var(--blue)}.badge-purple{background:var(--purple-bg);color:var(--purple)}.badge-teal{background:var(--bg-teal-strong);color:var(--primary)}.badge-gray{background:var(--bg);color:var(--ink-muted);border:1px solid var(--line)}.approval-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);align-items:flex-start;gap:16px;padding:16px;transition:box-shadow .15s;display:flex}.approval-card:hover{box-shadow:var(--shadow)}.approval-card .approval-icon{border-radius:var(--radius);flex-shrink:0;place-items:center;width:40px;height:40px;font-size:16px;font-weight:700;display:grid}.approval-card .approval-body{flex:1;min-width:0}.approval-card .approval-title{color:var(--ink);margin-bottom:2px;font-size:14px;font-weight:600}.approval-card .approval-meta{color:var(--ink-secondary);flex-wrap:wrap;gap:12px;margin-top:6px;font-size:12px;display:flex}.approval-card .approval-meta span{align-items:center;gap:4px;display:flex}.approval-card .approval-actions{flex-shrink:0;gap:6px;display:flex}.schedule-grid{grid-template-columns:repeat(7,1fr);gap:6px;display:grid}.schedule-day{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-sm);min-height:100px;padding:8px}.schedule-day .day-label{color:var(--ink-muted);text-transform:uppercase;margin-bottom:6px;font-size:11px;font-weight:700}.schedule-day .day-num{color:var(--ink);margin-bottom:6px;font-size:14px;font-weight:700}.schedule-day.today{border-color:var(--primary);background:var(--bg-teal)}.schedule-day.other-month{opacity:.4}.schedule-event{background:var(--bg-teal-strong);color:var(--primary);cursor:pointer;white-space:nowrap;text-overflow:ellipsis;border-radius:4px;margin-bottom:3px;padding:3px 6px;font-size:11px;font-weight:600;overflow:hidden}.schedule-event.in-transit{background:var(--blue-bg);color:var(--blue)}.schedule-event.delivered{background:var(--green-bg);color:var(--green)}.schedule-event.issue{background:var(--red-bg);color:var(--red)}.schedule-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);align-items:center;gap:16px;padding:16px;transition:box-shadow .15s;display:flex}.schedule-card:hover{box-shadow:var(--shadow)}.schedule-card .schedule-icon{border-radius:var(--radius);background:var(--bg-teal);width:40px;height:40px;color:var(--primary);flex-shrink:0;place-items:center;font-size:18px;display:grid}.schedule-card .schedule-info{flex:1;min-width:0}.schedule-card .schedule-name{color:var(--ink);font-size:14px;font-weight:600}.schedule-card .schedule-detail{color:var(--ink-secondary);flex-wrap:wrap;gap:10px;margin-top:4px;font-size:12px;display:flex}.schedule-card .schedule-detail span{align-items:center;gap:4px;display:flex}.schedule-card .schedule-toggle{flex-shrink:0}.toggle{background:var(--line-strong);cursor:pointer;border:none;border-radius:999px;width:38px;height:22px;transition:background .2s;position:relative}.toggle:after{content:"";width:18px;height:18px;box-shadow:var(--shadow-sm);background:#fff;border-radius:50%;transition:transform .2s;position:absolute;top:2px;left:2px}.toggle.active{background:var(--primary)}.toggle.active:after{transform:translate(16px)}.template-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px;transition:box-shadow .15s,border-color .15s}.template-card:hover{box-shadow:var(--shadow-md);border-color:var(--primary-light)}.template-card .template-name{color:var(--ink);margin-bottom:4px;font-size:15px;font-weight:700}.template-card .template-meta{color:var(--ink-secondary);gap:14px;margin-bottom:12px;font-size:12px;display:flex}.template-card .template-meta span{align-items:center;gap:4px;display:flex}.template-card .template-tags{flex-wrap:wrap;gap:6px;margin-bottom:14px;display:flex}.template-card .template-tags .tag{background:var(--bg-teal);color:var(--primary);border-radius:999px;padding:3px 8px;font-size:11px;font-weight:600}.template-card .template-actions{border-top:1px solid var(--line);gap:8px;padding-top:14px;display:flex}.invoice-header{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);grid-template-columns:1fr auto;gap:24px;margin-bottom:24px;padding:20px;display:grid}.invoice-header .invoice-meta{gap:6px;display:grid}.invoice-header .invoice-meta .label{text-transform:uppercase;letter-spacing:.3px;color:var(--ink-muted);font-size:11px;font-weight:700}.invoice-header .invoice-meta .value{color:var(--ink);font-size:16px;font-weight:700}.invoice-header .invoice-total{text-align:right}.invoice-header .invoice-total .amount{color:var(--ink);font-size:28px;font-weight:800}.invoice-header .invoice-total .label{color:var(--ink-muted);font-size:12px}.invoice-lines table{font-size:13px}.invoice-lines tbody td{padding:12px 14px}.invoice-lines tfoot td{border-top:2px solid var(--line);color:var(--ink);padding:10px 14px;font-weight:700}.invoice-lines .amount-col{text-align:right;font-variant-numeric:tabular-nums}.proof-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;display:grid}.proof-item{aspect-ratio:4/3;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);cursor:pointer;transition:box-shadow .15s,transform .15s;position:relative;overflow:hidden}.proof-item:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.proof-item .proof-thumb{background:var(--bg);width:100%;height:100%;color:var(--ink-muted);place-items:center;font-size:32px;display:grid}.proof-item .proof-overlay{color:#fff;background:linear-gradient(#0000,#0009);padding:10px;position:absolute;bottom:0;left:0;right:0}.proof-item .proof-type{text-transform:uppercase;letter-spacing:.2px;opacity:.8;font-size:11px;font-weight:600}.proof-item .proof-label{font-size:12px;font-weight:600}.proof-item .proof-date{opacity:.7;font-size:11px}.proof-filter-bar{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:20px;display:flex}.proof-filter-bar select,.proof-filter-bar input{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--white);color:var(--ink-secondary);padding:7px 12px;font-size:13px}.modal-overlay{z-index:100;background:#0f172a80;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal{background:var(--white);border-radius:var(--radius-lg);width:100%;max-width:560px;max-height:85vh;box-shadow:var(--shadow-md);overflow-y:auto}.modal-wide{max-width:720px}.modal-header{border-bottom:1px solid var(--line);background:var(--white);z-index:1;justify-content:space-between;align-items:center;padding:18px 22px;display:flex;position:sticky;top:0}.modal-header h2{font-size:16px;font-weight:700}.modal-close{background:var(--bg);border-radius:var(--radius-sm);width:32px;height:32px;color:var(--ink-secondary);border:none;place-items:center;font-size:18px;display:grid}.modal-close:hover{background:var(--line)}.modal-body{gap:16px;padding:22px;display:grid}.modal-footer{border-top:1px solid var(--line);background:var(--white);justify-content:flex-end;gap:10px;padding:16px 22px;display:flex;position:sticky;bottom:0}.form-group{gap:6px;display:grid}.form-group label{color:var(--ink-secondary);text-transform:uppercase;letter-spacing:.2px;font-size:12px;font-weight:700}.form-group input,.form-group select,.form-group textarea{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--white);color:var(--ink);padding:9px 12px;font-size:14px;transition:border-color .15s}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 3px #0f766e1a}.form-group textarea{resize:vertical;min-height:80px}.form-row{grid-template-columns:1fr 1fr;gap:14px;display:grid}.form-hint{color:var(--ink-muted);font-size:12px}.delivery-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);gap:16px;padding:16px;transition:box-shadow .15s;display:flex}.delivery-card:hover{box-shadow:var(--shadow)}.delivery-card .delivery-icon{border-radius:var(--radius);background:var(--bg-teal);width:44px;height:44px;color:var(--primary);flex-shrink:0;place-items:center;font-size:20px;display:grid}.delivery-card .delivery-body{flex:1;min-width:0}.delivery-card .delivery-location{color:var(--ink);font-size:14px;font-weight:700}.delivery-card .delivery-items{color:var(--ink-secondary);margin-top:2px;font-size:13px}.delivery-card .delivery-meta{color:var(--ink-secondary);flex-wrap:wrap;gap:10px;margin-top:8px;font-size:12px;display:flex}.delivery-card .delivery-actions{flex-direction:column;flex-shrink:0;justify-content:center;gap:6px;display:flex}.section{margin-bottom:24px}.section-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.section-header h2{color:var(--ink);font-size:17px;font-weight:700}.section-header .section-actions{gap:8px;display:flex}.empty-state{text-align:center;color:var(--ink-muted);padding:48px 24px}.empty-state .empty-icon{opacity:.5;margin-bottom:12px;font-size:40px}.empty-state h3{color:var(--ink-secondary);margin-bottom:6px;font-size:16px;font-weight:600}.empty-state p{max-width:400px;margin:0 auto 16px;font-size:13px}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.mb-2{margin-bottom:8px}.mb-4{margin-bottom:16px}.mt-2{margin-top:8px}.text-sm{font-size:13px}.text-xs{font-size:12px}.text-muted{color:var(--ink-muted)}.text-secondary{color:var(--ink-secondary)}.font-semibold{font-weight:600}.font-bold{font-weight:700}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.filter-bar{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:16px;display:flex}.filter-bar select,.filter-bar input{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--white);color:var(--ink-secondary);padding:7px 12px;font-size:13px}.filter-bar select:focus,.filter-bar input:focus{border-color:var(--primary);outline:none}.viewer-overlay{z-index:200;cursor:pointer;background:#000000d9;place-items:center;display:grid;position:fixed;inset:0}.viewer-content{max-width:90vw;max-height:90vh;position:relative}.viewer-content img{border-radius:var(--radius);max-width:100%;max-height:85vh}.viewer-close{color:#fff;cursor:pointer;background:0 0;border:none;font-size:28px;position:absolute;top:-40px;right:0}.timeline{gap:0;display:grid;position:relative}.timeline:before{content:"";background:var(--line);width:2px;position:absolute;top:6px;bottom:6px;left:15px}.timeline-item{gap:14px;padding:8px 0;display:flex;position:relative}.timeline-item .timeline-dot{border:2px solid var(--primary);background:var(--white);z-index:1;border-radius:50%;flex-shrink:0;width:12px;height:12px;margin-top:4px;position:relative}.timeline-item .timeline-dot.green{border-color:var(--green);background:var(--green-bg)}.timeline-item .timeline-dot.amber{border-color:var(--amber);background:var(--amber-bg)}.timeline-item .timeline-dot.red{border-color:var(--red);background:var(--red-bg)}.timeline-item .timeline-content{flex:1;font-size:13px}.timeline-item .timeline-content strong{color:var(--ink);font-weight:600;display:block}.timeline-item .timeline-content span{color:var(--ink-secondary);font-size:12px}.avatar-group{align-items:center;display:flex}.avatar-group .avatar-item{border:2px solid var(--white);color:#fff;border-radius:50%;place-items:center;width:28px;height:28px;margin-left:-8px;font-size:10px;font-weight:700;display:grid}.avatar-group .avatar-item:first-child{margin-left:0}.sidebar-backdrop{z-index:45;background:#0f172a4d;display:none;position:fixed;inset:0}@media (max-width:768px){.sidebar-backdrop{display:block}}.sidebar-toggle{border:1px solid var(--line);border-radius:var(--radius-sm);color:var(--ink-secondary);background:0 0;padding:6px 10px;display:none}@media (max-width:1024px){.stats-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid,.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}@media (max-width:768px){.sidebar{transition:transform .25s;transform:translate(-100%)}.sidebar.open{box-shadow:var(--shadow-md);transform:translate(0)}.sidebar-toggle{align-items:center;gap:6px;display:inline-flex}.main-area{margin-left:0}.main-header{padding:12px 18px}.main-content{padding:16px 18px}.stats-grid{grid-template-columns:1fr;gap:12px}.header-search{width:160px}.schedule-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:480px){.schedule-grid{grid-template-columns:1fr}.approval-card{flex-direction:column}.approval-card .approval-actions{width:100%}.delivery-card{flex-direction:column}.proof-grid{grid-template-columns:1fr 1fr}.modal{max-height:95vh}}