@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;900&family=Playfair+Display:wght@400;700;900&display=swap";
@font-face{font-family:Gilroy;src:local(Inter Bold),url(https://fonts.gstatic.com/s/inter/v12/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuLyfAZ9hiJ-Ek-_EeA.woff2)format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Gilmer;src:local(Inter Black),url(https://fonts.gstatic.com/s/inter/v12/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuLyfAZ9hiJ-Ek-_EeA.woff2)format("woff2");font-weight:900;font-style:normal;font-display:swap}@font-face{font-family:Nexa Slab;src:local("Playfair Display Bold"),local("Georgia"),local("Times New Roman"),serif;font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Nexa Slab;src:local("Playfair Display Bold"),local("Georgia"),local("Times New Roman"),serif;font-weight:800;font-style:normal;font-display:swap}@font-face{font-family:Nexa Slab;src:local("Playfair Display Black"),local("Georgia"),local("Times New Roman"),serif;font-weight:900;font-style:normal;font-display:swap}@font-face{font-family:Nexa Slab;src:local("Playfair Display Black"),local("Georgia"),local("Times New Roman"),serif;font-weight:900;font-style:italic;font-display:swap}:root{--font-primary:"Inter","Gilmer",-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto",sans-serif;--font-heading:"Nexa Slab","Georgia","Times New Roman",serif;--font-accent:"Inter","Gilmer",-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto",sans-serif;--font-brand:"Nexa Slab","Georgia","Times New Roman",serif}
.dashboard-page{max-width:1200px;margin:0 auto;padding:1.5rem}.loading-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:50vh;display:flex}.loading-spinner{border:3px solid var(--sk-border);border-top:3px solid var(--sk-primary);border-radius:50%;width:3rem;height:3rem;margin-bottom:1rem;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:50vh;padding:2rem;display:flex}.error-state h2{font-family:var(--font-brand);color:var(--sk-text);margin-bottom:1rem}.error-state p{color:var(--sk-muted)}.pay-now-btn{background:var(--sk-accent);color:var(--sk-on-primary);cursor:pointer;border:none;border-radius:.75rem;padding:.75rem 1.5rem;font-weight:700;text-decoration:none;transition:opacity .2s;display:inline-block}.pay-now-btn:hover{opacity:.9;text-decoration:none}.dashboard-card{background:var(--sk-surface);box-shadow:var(--sk-elevation);border:1px solid var(--sk-border);color:inherit;border-radius:1.5rem;padding:1.5rem;text-decoration:none;transition:all .2s;display:block}.dashboard-card:hover{color:inherit;text-decoration:none;transform:translateY(-2px);box-shadow:0 10px 25px -3px #0000001a,0 4px 6px -2px #0000000d}.card-title{font-family:var(--font-brand);color:var(--sk-text);margin:0 0 1rem;font-size:1.25rem;font-style:italic;font-weight:900}.card-content{flex-direction:column;justify-content:space-between;height:100%;display:flex}.card-description{color:var(--sk-muted);margin:0 0 1rem}.card-action{color:var(--sk-primary);align-items:center;gap:.5rem;font-weight:600;display:flex}@media (min-width:640px){.rent-banner,.rent-content{flex-direction:row;justify-content:space-between;align-items:center}.rent-info{text-align:left}.utilities-grid{grid-template-columns:repeat(2,1fr)}.unit-content{flex-direction:row}.unit-image{width:33.3333%;height:12rem}}@media (min-width:768px){.utilities-grid{grid-template-columns:repeat(4,1fr)}}@media (min-width:1024px){.dashboard-grid{grid-template-columns:repeat(3,1fr)}.unit-card{grid-column:span 2}}.dashboard-container{background-color:var(--sk-bg);min-height:100vh;color:var(--sk-text);font-family:var(--font-accent);position:relative}.mobile-header{z-index:50;background:var(--sk-surface);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--sk-border);padding:1rem;display:block;position:sticky;top:0}.header-content{justify-content:space-between;align-items:center;display:flex}.logo-section{width:100%;margin-bottom:1rem}.logo-section .logo-link{background:#0f184f;border-radius:.5rem;justify-content:space-between;align-items:center;width:100%;padding:.5rem;text-decoration:none;display:flex}.logo-icon{object-fit:contain;order:1;width:2rem;height:2rem}.logo-text{font-family:var(--font-brand);color:#fff;text-align:right;order:2;margin:0 0 0 auto;font-size:1.25rem;font-weight:600}.notification-btn{color:var(--sk-muted);cursor:pointer;background:0 0;border:none;border-radius:50%;padding:.5rem;transition:background-color .2s}.notification-btn:hover{background:var(--sk-border)}.dashboard{color:#fff;flex-direction:column;gap:1rem;display:flex}.dashboard .nav-item{color:#fff}.dashboard .nav-icon{color:#0ff}.desktop-sidebar{background:var(--sk-surface);border-right:1px solid var(--sk-border);z-index:40;box-sizing:border-box;flex-direction:column;justify-content:space-between;width:16rem;height:100vh;padding:1rem;transition:width .3s ease-in-out;display:none;position:fixed;top:0;left:0;overflow:hidden}.desktop-sidebar.collapsed{width:5rem}.desktop-sidebar.collapsed .user-info,.desktop-sidebar.collapsed .nav-label,.desktop-sidebar.collapsed .collapse-btn span{display:none}.sidebar-content{flex-direction:column;min-width:0;height:100%;display:flex;overflow:hidden}.logo-section{justify-content:flex-end;align-items:center;gap:.75rem;display:flex}.sidebar-header{margin-bottom:2rem}.sidebar-nav{flex-direction:column;flex:1;gap:.25rem;display:flex}.nav-section{margin-bottom:1rem}.nav-items{flex-direction:column;gap:.25rem;display:flex}.nav-item{color:#fff;background:#0f184f;border-radius:.5rem;align-items:center;gap:.75rem;padding:.75rem;font-weight:500;text-decoration:none;transition:all .2s;display:flex}.nav-item:hover{color:#fff;background:#192266}.nav-item.active{color:#fff;background:#192266;font-weight:600}.nav-icon{color:#0ff;stroke:#0ff;flex-shrink:0;width:1.5rem;height:1.5rem}.nav-label{white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.sidebar-footer{border-top:1px solid var(--sk-border);flex-direction:column;gap:1rem;padding-top:1rem;display:flex}.collapse-btn{color:#fff;cursor:pointer;box-sizing:border-box;background:#0f184f;border:none;border-radius:.5rem;align-items:center;gap:.75rem;width:100%;min-width:0;padding:.75rem;font-weight:500;transition:all .2s;display:flex}.collapse-btn:hover{color:#fff;background:#192266}.user-profile{cursor:pointer;box-sizing:border-box;background:#0f184f;border:none;border-radius:.5rem;align-items:center;gap:.75rem;width:100%;min-width:0;padding:.75rem;display:flex}.user-avatar{object-fit:cover;border-radius:50%;width:2.5rem;height:2.5rem;margin-left:-.5rem}.user-info{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.user-info .user-name,.user-info .user-role{color:#fff;white-space:nowrap;text-overflow:ellipsis;max-width:100%;margin:0;overflow:hidden}.user-name{font-size:.875rem;font-weight:600}.user-role{opacity:.8;font-size:.75rem}.profile-arrow{color:#fff;flex-shrink:0;margin-left:auto}.arrow-icon{flex-shrink:0;width:1.25rem;height:1.25rem}@media (min-width:768px){.desktop-sidebar{display:flex}.main-content{margin-left:16rem}.main-content.sidebar-collapsed{margin-left:5rem}}@media (max-width:767px){.desktop-sidebar{display:none!important}.main-content{margin-left:0}}.main-content{flex:1;padding:1.5rem;overflow-y:auto}.content-container{max-width:80rem;margin:0 auto}.content-header{margin-bottom:2rem}.welcome-title{font-family:var(--font-brand);color:var(--light-text);margin:0 0 .25rem;font-size:2.5rem;font-style:italic;font-weight:900}.welcome-subtitle{color:var(--light-text-secondary);margin:0;font-size:1.125rem}.rent-banner{background:var(--brand-primary);box-shadow:var(--light-shadow);border-radius:1rem;flex-direction:column;align-items:center;gap:2rem;margin-bottom:2.5rem;padding:2rem;display:flex}.rent-content{flex-direction:column;align-items:center;gap:2rem;width:100%;display:flex}.rent-info{text-align:center;flex:1}.rent-title{font-family:var(--font-brand);color:#fff;margin:0 0 .5rem;font-size:1.5rem;font-style:italic;font-weight:900}.rent-description{color:#fffc;margin:0 0 1.5rem}.pay-now-btn{background:var(--brand-accent);color:var(--brand-primary);cursor:pointer;border:none;border-radius:.75rem;padding:.75rem 1.5rem;font-weight:700;transition:opacity .2s}.pay-now-btn:hover{opacity:.9}.rent-amount{flex-shrink:0}.amount-circle{background:#ffffff1a;border-radius:50%;justify-content:center;align-items:center;width:12rem;height:12rem;display:flex;position:relative}.amount-circle:before{content:"";background:#fff3;border-radius:50%;width:9rem;height:9rem;position:absolute}.amount-text{color:var(--brand-accent);z-index:1;font-size:2.25rem;font-weight:700}.dashboard-grid{grid-template-columns:1fr;gap:1.5rem;display:grid}.dashboard-card,.unit-card,.maintenance-card,.utilities-card,.lease-card,.announcements-card{background:var(--sk-surface);box-shadow:var(--sk-elevation);border:1px solid var(--sk-border);color:inherit;border-radius:1.5rem;padding:1.5rem;text-decoration:none;transition:all .2s;display:block}.dashboard-card:hover,.unit-card:hover,.maintenance-card:hover,.utilities-card:hover,.lease-card:hover,.announcements-card:hover{transform:translateY(-2px);box-shadow:0 10px 25px -3px #0000001a,0 4px 6px -2px #0000000d}.unit-content{flex-direction:column;gap:1.5rem;display:flex}.unit-image{object-fit:cover;border-radius:.75rem;width:100%;height:12rem}.unit-details{flex-direction:column;display:flex}.unit-name{color:var(--light-text);margin:0 0 .25rem;font-size:1.125rem;font-weight:600}.unit-address{color:var(--light-text-secondary);margin:0 0 1rem}.unit-features{color:var(--light-text-secondary);gap:1rem;display:flex}.feature{align-items:center;gap:.375rem;display:flex}.feature-icon{width:1.25rem;height:1.25rem}.new-request-btn{background:var(--sk-border);width:100%;color:var(--sk-primary);cursor:pointer;border:none;border-radius:.75rem;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-weight:600;transition:all .2s;display:flex}.new-request-btn:hover{background:var(--sk-primary);color:var(--sk-on-primary)}.btn-icon{width:1.25rem;height:1.25rem}.utilities-grid{text-align:center;grid-template-columns:1fr;gap:1rem;display:grid}.utility-item{background:var(--sk-bg);border:1px solid var(--sk-border);border-radius:1rem;padding:1rem}.utility-label{color:var(--sk-muted);margin:0 0 .25rem;font-size:.875rem}.utility-amount{color:var(--sk-text);margin:0;font-size:1.5rem;font-weight:700}.view-docs-btn{background:var(--sk-border);width:100%;color:var(--sk-primary);cursor:pointer;border:none;border-radius:.75rem;padding:.75rem 1.5rem;font-weight:600;transition:all .2s}.view-docs-btn:hover{background:var(--sk-primary);color:var(--sk-on-primary)}.announcements-list{flex-direction:column;gap:1rem;display:flex}.announcement-item{align-items:flex-start;gap:1rem;display:flex}.announcement-icon{background:var(--sk-glow-soft);color:var(--sk-accent);border-radius:50%;flex-shrink:0;padding:.5rem}.announcement-icon .icon{width:1.25rem;height:1.25rem}.announcement-content{flex:1}.announcement-title{color:var(--sk-text);margin:0 0 .25rem;font-weight:600}.announcement-description{color:var(--sk-muted);margin:0;font-size:.875rem}.mobile-footer{z-index:50;background:var(--sk-surface);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid var(--sk-border);display:block;position:sticky;bottom:0}.bottom-nav{justify-content:space-around;align-items:center;padding:.5rem;display:flex}.bottom-nav .nav-item{color:var(--sk-muted);border-radius:.5rem;flex-direction:column;align-items:center;gap:.25rem;padding:.5rem;font-size:.75rem;font-weight:500;text-decoration:none;transition:color .2s;display:flex}.bottom-nav .nav-item:hover,.bottom-nav .nav-item.active{color:var(--sk-primary)}.nav-label{font-size:.75rem;font-weight:500}@media (min-width:640px){.main-content{padding:2rem}.rent-banner,.rent-content{flex-direction:row;justify-content:space-between;align-items:center}.rent-info{text-align:left}.utilities-grid{grid-template-columns:repeat(2,1fr)}.unit-content{flex-direction:row}.unit-image{width:33.3333%;height:12rem}}@media (min-width:768px){.main-content{padding:2.5rem}.utilities-grid{grid-template-columns:repeat(4,1fr)}}@media (min-width:1024px){.mobile-header,.mobile-footer{display:none}.desktop-sidebar{display:flex}.main-content{margin-left:16rem;padding:2.5rem}.desktop-sidebar.collapsed+.main-content{margin-left:5rem}.dashboard-grid{grid-template-columns:repeat(3,1fr)}.unit-card,.announcements-card{grid-column:span 2}}@media (min-width:1280px){.main-content{padding:3rem}.content-container{max-width:90rem}}.desktop-sidebar.collapsed .logo-text,.desktop-sidebar.collapsed .nav-item span:not(.nav-icon),.desktop-sidebar.collapsed .collapse-btn span,.desktop-sidebar.collapsed .user-info{opacity:0;transition:opacity .3s ease-in-out}.desktop-sidebar:not(.collapsed) .logo-text,.desktop-sidebar:not(.collapsed) .nav-item span:not(.nav-icon),.desktop-sidebar:not(.collapsed) .collapse-btn span,.desktop-sidebar:not(.collapsed) .user-info{opacity:1;transition:opacity .3s ease-in-out}
*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:1.5}body{font-family:var(--font-accent);background:var(--sk-bg);color:var(--sk-text);transition:background-color .24s,color .24s}*{font-family:var(--font-accent)}:root{--sk-bg:#f8fafc;--sk-surface:#fff;--sk-surface-alt:linear-gradient(135deg,#ecfeff,#eff6ff);--sk-card-bg:#eff6ff;--sk-card-title:#06b6d4;--sk-text:#0f172a;--sk-text-secondary:#475569;--sk-text-details:#64748b;--sk-muted:#64748b;--sk-border:#e2e8f0;--sk-primary:#06b6d4;--sk-primary-hover:#0891b2;--sk-on-primary:#fff;--sk-accent:#06b6d4;--sk-glow-strong:#06b6d440;--sk-glow-soft:#22d3ee1a;--sk-card-radius:1rem;--sk-elevation:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;--light-bg:#f8fafc;--light-text:#0f172a;--light-text-secondary:#475569;--light-card:#fff;--light-border:#e2e8f0;--light-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;--brand-primary:#06b6d4;--brand-accent:#06b6d4}[data-theme=dark],.theme-dark{--sk-bg:#0f184f;--sk-surface:#1e293b;--sk-surface-alt:linear-gradient(135deg,#0f184f,#1e293b);--sk-card-bg:#1e293b;--sk-card-title:#22d3ee;--sk-text:#fff;--sk-text-secondary:#cbd5e1;--sk-text-details:#94a3b8;--sk-muted:#94a3b8;--sk-border:#334155;--sk-primary:#22d3ee;--sk-primary-hover:#67e8f9;--sk-on-primary:#0f184f;--sk-accent:#22d3ee;--sk-glow-strong:#06b6d440;--sk-glow-soft:#22d3ee1a;--sk-card-radius:1rem;--sk-elevation:0 4px 6px -1px #ffffff1a,0 2px 4px -2px #ffffff0d;--light-bg:#0f184f;--light-text:#fff;--light-text-secondary:#cbd5e1;--light-card:#1e293b;--light-border:#334155;--light-shadow:0 4px 6px -1px #ffffff1a,0 2px 4px -2px #ffffff0d;--brand-primary:#22d3ee;--brand-accent:#22d3ee}h1,h2,h3,h4,h5,h6{font-family:var(--font-brand);margin-bottom:.5em;font-style:italic;font-weight:900;line-height:1.2}h1{font-size:2.5rem;font-weight:900}h2{font-size:2rem;font-weight:800}h3{font-size:1.5rem;font-weight:700}p{font-family:var(--font-accent);margin-bottom:1em;line-height:1.6}.sk-button{border-radius:var(--sk-card-radius);cursor:pointer;font-family:var(--font-accent);box-shadow:var(--sk-elevation);border:none;justify-content:center;align-items:center;gap:10px;padding:12px 20px;font-size:15px;font-weight:700;text-decoration:none;transition:transform 60ms,box-shadow .12s;display:inline-flex}.sk-button:hover{transform:translateY(-1px);box-shadow:0 8px 25px #0c12281f}.sk-button:active{transform:translateY(0)}.sk-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.sk-button--primary{background:var(--sk-primary);color:var(--sk-on-primary)}.sk-button--outline{color:var(--sk-primary);border:2px solid var(--sk-primary);background:0 0}.sk-button--outline:hover{background:var(--sk-primary);color:var(--sk-on-primary)}.sk-button--small{padding:8px 16px;font-size:14px}.sk-button--large{padding:16px 24px;font-size:16px}.sk-button--full-width{width:100%}.sk-card{background:var(--sk-surface);border-radius:var(--sk-card-radius);box-shadow:var(--sk-elevation);transition:box-shadow .2s}.sk-card:hover{box-shadow:0 8px 25px #0c12281f}.sk-card--padding-none{padding:0}.sk-card--padding-small{padding:12px}.sk-card--padding-medium{padding:16px}.sk-card--padding-large{padding:24px}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:4px}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.gap-6{gap:24px}.w-full{width:100%}.h-full{height:100%}.min-h-screen{min-height:100vh}button:focus-visible,a:focus-visible{outline:2px solid var(--sk-primary);outline-offset:2px}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--sk-surface)}::-webkit-scrollbar-thumb{background:var(--sk-muted);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--sk-primary)}@media (max-width:1024px){.desktop-layout{flex-direction:column!important}.sidebar{flex-direction:row!important;width:100%!important;height:auto!important;padding:16px!important}.sidebar nav{flex-direction:row!important;gap:8px!important;display:flex!important}.sidebar nav>div{border-radius:8px!important;margin-bottom:0!important;padding:8px 12px!important}.community-sidebar{border-left:none!important;border-top:1px solid var(--sk-muted)!important;width:100%!important}.main-content{padding:16px!important}}@media (max-width:768px){.sidebar{flex-direction:column!important;align-items:center!important}.sidebar nav{flex-direction:column!important;width:100%!important}.main-content h1{font-size:24px!important}.rent-banner{text-align:center!important;flex-direction:column!important;gap:16px!important}.community-hub-icons{justify-content:center!important}}
