*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:#f3f4f6;color:#111827;-webkit-font-smoothing:antialiased}.app-container{display:flex;flex-direction:column;height:100vh;background:#f3f4f6}.app-main{display:flex;flex:1;overflow:hidden}.app-content{flex:1;overflow-y:auto;padding:1.5rem}.content-wrapper{max-width:1280px;margin:0 auto}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#e5e7eb}::-webkit-scrollbar-thumb{background:#9ca3af;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#6b7280}.header{background:white;border-bottom:1px solid #e5e7eb;padding:.75rem 1.5rem;display:flex;align-items:center;justify-content:space-between}.header-brand{display:flex;align-items:center;gap:.75rem}.header-logo{width:40px;height:40px;background:#2563eb;border-radius:.75rem;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.25rem;color:#fff}.header-title h1{font-size:1.125rem;font-weight:700;color:#111827}.header-title p{font-size:.75rem;color:#6b7280}.header-actions{display:flex;align-items:center;gap:1.5rem}.header-actions .notification{position:relative;color:#6b7280;cursor:pointer}.header-actions .notification .badge{position:absolute;top:-4px;right:-4px;width:18px;height:18px;background:#ef4444;color:#fff;font-size:10px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid white}.sidebar{position:fixed;top:0;left:0;height:100vh;width:280px;background:#111827;color:#fff;display:flex;flex-direction:column;z-index:1000;transform:translate(-100%);transition:transform .3s ease;box-shadow:0 20px 25px -5px #00000040}.sidebar.open{transform:translate(0)}@media (min-width: 1024px){.sidebar{position:relative;transform:translate(0)!important;width:240px}}.sidebar-brand{padding:1.25rem;border-bottom:1px solid rgba(255,255,255,.08);display:flex;align-items:center;gap:.75rem}.sidebar-brand .logo{width:44px;height:44px;background:#2563eb;border-radius:.75rem;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.25rem;color:#fff;flex-shrink:0}.sidebar-brand .brand-text h1{font-size:1rem;font-weight:700;color:#fff}.sidebar-brand .brand-text p{font-size:.75rem;color:#9ca3af}.sidebar-nav{flex:1;padding:1rem;overflow-y:auto}.sidebar-nav a{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border-radius:.75rem;color:#d1d5db;text-decoration:none;transition:all .15s ease;margin-bottom:2px;cursor:pointer}.sidebar-nav a:hover{background:rgba(255,255,255,.06);color:#fff}.sidebar-nav a.active{background:#2563eb;color:#fff;box-shadow:0 4px 12px #2563eb4d}.sidebar-nav a .icon{width:20px;height:20px;flex-shrink:0}.sidebar-nav a .label{font-size:.875rem;font-weight:500;flex:1}.sidebar-footer{padding:1rem 1.25rem;border-top:1px solid rgba(255,255,255,.08);text-align:center}.sidebar-footer p{font-size:.75rem;color:#6b7280}.sidebar-footer .powered{font-size:.625rem;color:#4b5563;margin-top:2px}.hamburger{position:fixed;top:1rem;left:1rem;z-index:1001;padding:.5rem;background:#2563eb;color:#fff;border:none;border-radius:.75rem;cursor:pointer;box-shadow:0 10px 15px -3px #0000001a;display:flex;align-items:center;justify-content:center;transition:all .15s ease}.hamburger:hover{background:#1d4ed8;transform:scale(1.05)}@media (min-width: 1024px){.hamburger{display:none}}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:999}@media (min-width: 1024px){.overlay{display:none}}.stats-grid{display:grid;grid-template-columns:1fr;gap:1rem;margin-bottom:1.5rem}@media (min-width: 640px){.stats-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1280px){.stats-grid{grid-template-columns:repeat(4,1fr)}}.stat-card{background:white;padding:1.25rem;border-radius:1rem;border:1px solid #e5e7eb;box-shadow:0 1px 2px #0000000d;transition:all .15s ease}.stat-card:hover{box-shadow:0 4px 6px -1px #0000001a;transform:translateY(-2px)}.stat-card .stat-header{display:flex;align-items:center;justify-content:space-between}.stat-card .stat-label{font-size:.875rem;color:#6b7280;font-weight:500}.stat-card .stat-value{font-size:1.5rem;font-weight:700;margin-top:.25rem}.stat-card .stat-icon{width:44px;height:44px;border-radius:.75rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}.stat-card .stat-icon.green{background:#d1fae5;color:#10b981}.stat-card .stat-icon.red{background:#fee2e2;color:#ef4444}.stat-card .stat-icon.blue{background:#dbeafe;color:#3b82f6}.stat-card .stat-icon.orange{background:#fef3c7;color:#f59e0b}.stat-card .stat-value.green{color:#10b981}.stat-card .stat-value.red{color:#ef4444}.stat-card .stat-value.blue{color:#3b82f6}.stat-card .stat-value.orange{color:#f59e0b}.stat-card .stat-sub{font-size:.75rem;color:#6b7280;margin-top:.25rem}.chart-grid{display:grid;grid-template-columns:1fr;gap:1.5rem;margin-bottom:1.5rem}@media (min-width: 1024px){.chart-grid{grid-template-columns:repeat(2,1fr)}}.chart-container{background:white;padding:1.25rem;border-radius:1rem;border:1px solid #e5e7eb;box-shadow:0 1px 2px #0000000d}.chart-container h3{font-size:1rem;font-weight:600;color:#374151;margin-bottom:1rem}.chart-container .chart-wrapper{height:280px}.section-card{background:white;padding:1.25rem;border-radius:1rem;border:1px solid #e5e7eb;box-shadow:0 1px 2px #0000000d;margin-bottom:1.5rem}.section-card h3{font-size:1rem;font-weight:600;color:#374151;margin-bottom:1rem}.transaction-item{display:flex;align-items:center;justify-content:space-between;padding:.75rem;background:#f9fafb;border-radius:.75rem;margin-bottom:.5rem;transition:background .15s ease}.transaction-item:hover{background:#f3f4f6}.transaction-item .info{flex:1;min-width:0}.transaction-item .info .desc{font-weight:500;color:#1f2937;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.transaction-item .info .date{font-size:.75rem;color:#6b7280}.transaction-item .amount{font-weight:600;margin-left:.75rem}.transaction-item .amount.income{color:#10b981}.transaction-item .amount.expense{color:#ef4444}.transaction-item .badge{padding:.125rem .625rem;border-radius:9999px;font-size:.75rem;font-weight:600;margin-left:.75rem}.transaction-item .badge.approved{background:#d1fae5;color:#065f46}.transaction-item .badge.pending{background:#fef3c7;color:#92400e}.transaction-item .badge.rejected{background:#fee2e2;color:#991b1b}.branch-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}@media (min-width: 640px){.branch-grid{grid-template-columns:repeat(3,1fr)}}@media (min-width: 768px){.branch-grid{grid-template-columns:repeat(4,1fr)}}@media (min-width: 1024px){.branch-grid{grid-template-columns:repeat(5,1fr)}}.branch-card{padding:.75rem;background:#f9fafb;border-radius:.75rem;text-align:center;border:1px solid #e5e7eb;transition:all .15s ease}.branch-card:hover{box-shadow:0 4px 6px -1px #0000001a}.branch-card .code{font-weight:700;color:#1f2937;font-size:1.125rem}.branch-card .name{font-size:.75rem;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.branch-card .status{font-size:.75rem}.branch-card .status.active{color:#10b981}.branch-card .status.inactive{color:#ef4444}.dashboard-header{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;gap:.75rem;margin-bottom:1.5rem}@media (min-width: 640px){.dashboard-header{flex-direction:row;align-items:center}}.dashboard-header h1{font-size:1.5rem;font-weight:700;color:#1f2937}.dashboard-header p{font-size:.875rem;color:#6b7280}.dashboard-header .actions{display:flex;gap:.5rem;width:100%}@media (min-width: 640px){.dashboard-header .actions{width:auto}}.dashboard-header .actions button{flex:1;padding:.5rem 1rem;border-radius:.75rem;font-size:.875rem;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .15s ease}@media (min-width: 640px){.dashboard-header .actions button{flex:none}}.dashboard-header .actions .btn-outline{background:white;border:1px solid #e5e7eb;color:#374151}.dashboard-header .actions .btn-outline:hover{background:#f9fafb}.dashboard-header .actions .btn-primary{background:#2563eb;color:#fff}.dashboard-header .actions .btn-primary:hover{background:#1d4ed8}.loading{display:flex;align-items:center;justify-content:center;height:100%;min-height:200px}.loading .spinner{width:48px;height:48px;border:4px solid #e5e7eb;border-top-color:#2563eb;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.text-center{text-align:center}.text-right{text-align:right}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.w-full{width:100%}