@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--bg-color:#f8fafc;--surface-color:#fff;--text-primary:#0f172a;--text-secondary:#475569;--primary-blue:#0ea5e9;--border-color:#e2e8f0}body{background-color:var(--bg-color);color:var(--text-primary);margin:0;font-family:Inter,sans-serif}*{box-sizing:border-box}.container{max-width:1400px;margin:0 auto;padding:2rem}.card{background:var(--surface-color);border:1px solid #fffc;border-radius:16px;margin-bottom:2rem;padding:2rem;box-shadow:0 4px 6px -1px #0000000d,0 2px 4px -1px #00000008}.app-header{border-bottom:2px solid var(--border-color);justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;display:flex}.app-title{color:#0f172a;margin:0;font-size:1.75rem;font-weight:700}.tabs{gap:1rem;margin-bottom:1.5rem;display:flex}.tab-button{cursor:pointer;color:var(--text-secondary);background:#f1f5f9;border:none;border-radius:10px;padding:.75rem 1.5rem;font-size:.95rem;font-weight:600;transition:all .2s}.tab-button:hover{background:#e2e8f0}.tab-button.active{background:var(--primary-blue);color:#fff;box-shadow:0 4px 14px #0ea5e963}.table-wrapper{border:1px solid var(--border-color);background:#fff;border-radius:12px;overflow-x:auto}table{border-collapse:collapse;text-align:left;width:100%}th{border-bottom:2px solid var(--border-color);white-space:nowrap;border-right:1px solid #0000000d;padding:1rem .75rem;font-size:.85rem;font-weight:600}td{border-bottom:1px solid var(--border-color);color:var(--text-primary);border-right:1px solid #0000000d;padding:.75rem;font-size:.875rem}th.toko-col{color:#fff;text-align:center;background-color:#0ea5e9}th.dc-col{color:#0f172a;text-align:center;background-color:#fde047}.header-group{text-align:center;border-bottom:1px solid #0000001a;padding:.5rem;font-weight:700}.bg-toko{color:#fff;background-color:#0ea5e9}.bg-dc{color:#0f172a;background-color:#fde047}input[type=text],input[type=number],select{border:1px solid var(--border-color);background:#f8fafc;border-radius:8px;outline:none;width:100%;padding:.6rem .75rem;font-family:inherit;transition:all .2s}input:focus,select:focus{border-color:var(--primary-blue);background:#fff;box-shadow:0 0 0 3px #0ea5e933}input[readonly]{color:#64748b;cursor:not-allowed;background-color:#f1f5f9}.btn{cursor:pointer;border:none;border-radius:8px;padding:.6rem 1.2rem;font-size:.9rem;font-weight:600;transition:all .2s}.btn-primary{background:var(--primary-blue);color:#fff}.btn-primary:hover{background:#0284c7}.btn-success{color:#fff;background:#10b981}.btn-success:hover{background:#059669}.btn-danger{color:#fff;background:#ef4444}.btn-danger:hover{background:#dc2626}.btn-icon{border-radius:6px;justify-content:center;align-items:center;padding:.4rem;display:inline-flex}.upload-area{text-align:center;cursor:pointer;background:#f8fafc;border:2px dashed #cbd5e1;border-radius:12px;padding:2rem;transition:all .2s}.upload-area:hover{border-color:var(--primary-blue);background:#f0f9ff}.text-center{text-align:center}.mt-4{margin-top:1rem}.mb-4{margin-bottom:1rem}.flex{display:flex}.gap-2{gap:.5rem}.gap-4{gap:1rem}.items-center{align-items:center}.justify-between{justify-content:space-between}.w-full{width:100%}.badge{border-radius:9999px;padding:.25rem .75rem;font-size:.75rem;font-weight:600}.badge-draft{color:#92400e;background:#fef3c7}.badge-sent{color:#1e40af;background:#dbeafe}.badge-processed{color:#166534;background:#dcfce7}.justify-end{justify-content:flex-end}.info-text{color:#64748b;margin:.25rem 0 0;font-size:.85rem}.login-container{background:linear-gradient(135deg,#0ea5e9 0%,#0284c7 40%,#0369a1 100%);justify-content:center;align-items:center;min-height:100vh;padding:1rem;display:flex}.login-card{text-align:center;background:#fff;border-radius:24px;width:100%;max-width:420px;padding:2.5rem;box-shadow:0 25px 50px -12px #00000040}.login-logo{margin-bottom:.5rem;font-size:3rem}.login-title{color:#0f172a;margin:0 0 .25rem;font-size:1.5rem;font-weight:700}.login-subtitle{color:#64748b;margin:0 0 1.5rem;font-size:.9rem}.login-role-tabs{background:#f1f5f9;border-radius:12px;gap:.5rem;margin-bottom:1.5rem;padding:.35rem;display:flex}.role-tab{cursor:pointer;color:#64748b;background:0 0;border:none;border-radius:9px;flex:1;padding:.6rem;font-size:.9rem;font-weight:600;transition:all .2s}.role-tab.active{color:#0ea5e9;background:#fff;box-shadow:0 2px 8px #0000001a}.login-field{text-align:left;margin-bottom:1rem}.login-field label{color:#475569;margin-bottom:.4rem;font-size:.85rem;font-weight:600;display:block}.login-error{color:#ef4444;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;margin-bottom:1rem;padding:.5rem;font-size:.85rem;font-weight:600}.login-btn{background:linear-gradient(135deg,#0ea5e9,#0284c7);border-radius:12px;width:100%;padding:.85rem;font-size:1rem;box-shadow:0 4px 14px #0ea5e966}.login-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px #0ea5e980}@media print{body{color:#000!important;background-color:#fff!important}.app-header,.tabs,.no-print,button{display:none!important}.container{max-width:100%!important;padding:0!important}.card{box-shadow:none!important;border:none!important;margin:0!important;padding:0!important}input,select{appearance:none!important;color:#000!important;background:0 0!important;border:none!important;padding:0!important}table{border:1px solid #000!important}th,td{border:1px solid #000!important;padding:8px!important}th.toko-col,th.dc-col,.header-group{-webkit-print-color-adjust:exact;print-color-adjust:exact;color:#000!important;background-color:#f1f5f9!important}th.bg-toko{color:#fff!important;background-color:#0ea5e9!important}th.bg-dc{color:#000!important;background-color:#fde047!important}}