/* TrueConnects Portal - Navy Theme */
:root{--navy:#071f42;--blue:#168bea;--white:#ffffff;--gray:#f3f4f6;--muted:#6b7280;--border:#e5e7eb;--success:#10b981;--error:#ef4444;--warning:#f59e0b}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:system-ui,-apple-system,sans-serif;font-size:16px;color:#1f2937;background:var(--gray);line-height:1.6}

/* Layout */
.shell{display:flex;flex-direction:column;height:100vh}
.sidebar{width:240px;background:var(--navy);color:var(--white);position:fixed;top:0;left:0;bottom:0;border-right:1px solid rgba(255,255,255,0.1);transition:left 0.3s}
.main{flex:1;margin-left:240px;padding:2rem;width:100%;max-width:1600px}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:1rem 0;border-bottom:1px solid var(--border);background:white;position:sticky;top:0;z-index:10}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}
.stack{display:flex;flex-direction:column;gap:1rem}

/* Cards */
.card{background:white;border:1px solid var(--border);border-radius:8px;padding:1.25rem;box-shadow:0 1px 3px rgba(0,0,0,0.05)}
.card h2,h2{color:var(--navy);margin-bottom:0.75rem;font-size:1.25rem;font-weight:600}
.card p{color:#4b5563;margin-bottom:0.5rem}

/* Responsive */
@media(max-width:768px){
.sidebar{left:-240px;top:auto;bottom:auto;width:100%;height:auto;border-right:none;border-top:1px solid rgba(255,255,255,0.1);transform:translateX(100%);position:absolute}
.main{margin-left:0;padding:1rem}
.sidebar.open{left:0;transform:none}
.topbar .brand{flex:1}
.grid{grid-template-columns:1fr}
}

/* Navigation */
.nav-list{list-style:none}
.nav-list li{border-bottom:1px solid rgba(255,255,255,0.05)}
.nav-link{display:block;padding:0.875rem 1.25rem;color:var(--white);text-decoration:none;font-weight:500;transition:background 0.2s}
.nav-link:hover{background:rgba(255,255,255,0.1)}
.nav-link.active{background:var(--blue);border-left:3px solid var(--white)}
.mobile-nav-toggle{display:none;background:var(--navy);color:white;border:none;padding:0.75rem 1rem;border-radius:6px;font-weight:600;cursor:pointer;margin-bottom:1rem}

/* Forms */
.form-group{margin-bottom:1.25rem}
.form-label{display:block;margin-bottom:0.375rem;font-weight:500;color:#374151;font-size:0.875rem}
input[type="email"],input[type="text"],input[type="password"],select,textarea{width:100%;padding:0.625rem 0.75rem;border:1px solid var(--border);border-radius:6px;font-size:1rem;background:white;transition:border-color 0.2s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(22,139,234,0.15)}
textarea{min-height:120px;resize:vertical;font-family:inherit}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;padding:0.625rem 1.25rem;border:none;border-radius:6px;font-weight:500;text-decoration:none;cursor:pointer;transition:all 0.2s;font-size:0.875rem}
.btn-primary{background:var(--blue);color:white;border:1px solid var(--blue)}
.btn-primary:hover{background:#157ec6;border-color:#157ec6;transform:translateY(-1px)}
.btn-secondary{background:white;color:#374151;border:1px solid var(--border)}
.btn-secondary:hover{background:var(--gray);border-color:#d1d5db}
.btn-success{background:var(--success);color:white;border:1px solid var(--success)}
.btn-danger{background:var(--error);color:white;border:1px solid var(--error)}

/* Badges & Stats */
.badge{display:inline-block;padding:0.25rem 0.625rem;font-size:0.75rem;font-weight:600;border-radius:9999px;text-transform:uppercase;letter-spacing:0.5px}
.badge-success{background:#d1fae5;color:#065f46}
.badge-warning{background:#fef3c7;color:#92400e}
.badge-error{background:#fee2e2;color:#b91c1c}
.badge-info{background:#dbeafe;color:#1e40af}

.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.25rem}
.stat-card{background:white;border:1px solid var(--border);border-radius:8px;padding:1.25rem;text-align:center;box-shadow:0 2px 4px rgba(0,0,0,0.03)}
.stat-value{font-size:2rem;font-weight:700;color:var(--navy);margin-bottom:0.25rem}
.stat-label{font-size:0.8125rem;color:#6b7280;text-transform:uppercase;letter-spacing:0.5px}

/* Tables */
.table-wrap{overflow-x:auto;background:white;border:1px solid var(--border);border-radius:8px}
table{width:100%;border-collapse:collapse;font-size:0.9375rem}
th,td{padding:0.75rem 1rem;text-align:left;border-bottom:1px solid var(--border)}
th{background:#f9fafb;color:#374151;font-weight:600;font-size:0.8125rem;text-transform:uppercase;letter-spacing:0.5px}
tr:hover td{background:var(--gray)}
.text-center{text-align:center}

/* Auth Card */
.auth-card{max-width:420px;margin:2rem auto;padding:2rem;border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 6px rgba(0,0,0,0.1);background:white}
.auth-header{text-align:center;margin-bottom:1.5rem}
.auth-header h1{color:var(--navy);font-size:1.75rem;margin-bottom:0.5rem}
.auth-header p{color:#6b7280;font-size:0.9375rem}

/* Utilities */
.muted{color:var(--muted)}
.error{color:var(--error)}
.success{color:var(--success)}
.text-small{font-size:0.8125rem}
.mb-1{margin-bottom:0.5rem}
.mb-2{margin-bottom:1rem}
.mb-3{margin-bottom:1.5rem}
.pt-2{padding-top:1rem}
.pb-2{padding-bottom:1rem}
.flex{display:flex;align-items:center;gap:0.5rem}

/* Mobile Nav Styles */
.mobile-nav-toggle{display:inline-flex;width:100%;margin:1rem 0 1.5rem}
@media(max-width:768px){
.mobile-nav-toggle{display:none}
.sidebar{position:fixed;z-index:1000;box-shadow:0 4px 6px rgba(0,0,0,0.3)}
.main-content{padding-top:5rem}
}

/* Invoice Print Styles */
@media print{
body{background:white;color:black}
.sidebar,.topbar,.btn,.no-print{display:none}
.main{margin-left:0;padding:1rem;width:100%}
.card{border:none;box-shadow:none;padding:0;margin-bottom:1rem}
table{page-break-inside:auto}
}

/* Focus States */
*:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:2px}