.sidebar{width:260px;background:#0f172af2;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-right:1px solid var(--glass-border);padding:30px 0;position:fixed;top:0;left:0;height:100vh;display:flex;flex-direction:column;z-index:100;overflow:hidden}
.logo{display:flex;align-items:center;gap:12px;margin-bottom:40px;padding:0 15px;color:var(--success);font-size:1.5rem;font-weight:800;transition:transform .3s ease;flex-shrink:0}
.logo-vertical{flex-direction:column;text-align:center}
.logo-img{width:140px;height:140px;object-fit:contain;filter:drop-shadow(0 0 15px #10b98133)}
.logo-text{font-size:1.1rem;letter-spacing:2px;margin-top:10px;color:var(--text-main);font-weight:800;text-shadow:0 2px 10px #0000004d}
.nav-container{flex:1;display:flex;flex-direction:column;gap:25px;overflow-y:auto;padding:0 15px 20px;scrollbar-width:thin;scrollbar-color:var(--glass-border) transparent}
.nav-container::-webkit-scrollbar{width:6px}
.nav-container::-webkit-scrollbar-track{background:transparent}
.nav-container::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:10px}
.nav-container::-webkit-scrollbar-thumb:hover{background:var(--text-dim)}
.nav-section{display:flex;flex-direction:column;gap:5px}
.nav-section-title{font-size:.7rem;text-transform:uppercase;color:var(--text-dim);letter-spacing:1.5px;margin-left:15px;margin-bottom:8px;font-weight:600}
.nav-accordion-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer;padding-right:15px;margin-bottom:5px;transition:all .3s ease}
.nav-accordion-header:hover .nav-section-title{color:var(--text-main)}
.nav-section-title{margin-bottom:0!important;transition:color .3s ease}
.accordion-icon{font-size:.7rem;color:var(--text-dim);transition:transform .3s cubic-bezier(0.4,0,0.2,1)}
.nav-accordion-content{max-height:0;overflow:hidden;transition:max-height .4s ease-out;display:flex;flex-direction:column;gap:5px}
.nav-accordion-header.active .accordion-icon{transform:rotate(180deg)}
.nav-accordion-content.open{max-height:1000px}
.nav-link{position:relative;display:flex;align-items:center;gap:12px;padding:12px 18px;color:var(--text-dim);text-decoration:none;border-radius:14px;transition:all .3s cubic-bezier(0.4,0,0.2,1);font-weight:500;margin-bottom:0;border:1px solid transparent}
.nav-link i{font-size:1.1rem;width:24px;text-align:center;transition:all .4s cubic-bezier(0.175,0.885,0.32,1.275)}
.nav-link:hover{background:#ffffff0d;color:var(--text-main);padding-left:22px}
.nav-link:hover i{transform:scale(1.2) rotate(5deg);color:var(--accent)}
.nav-link.active{background:linear-gradient(90deg,#3b82f626 0%,#3b82f608 100%);color:var(--text-main);border:1px solid #3b82f64d;box-shadow:0 8px 32px -6px #0006 inset 0 0 10px #3b82f61a}
.nav-link.active i{color:var(--accent);filter:drop-shadow(0 0 8px #3b82f699);transform:scale(1.1)}
.nav-link.active::before{content:'';position:absolute;left:0;top:15%;height:70%;width:4px;background:var(--accent);border-radius:0 4px 4px 0;box-shadow:2px 0 15px var(--accent);animation:indicatorGlow 2s infinite alternate}
@keyframes indicatorGlow {
from{opacity:.6;box-shadow:2px 0 10px var(--accent)}
to{opacity:1;box-shadow:2px 0 20px var(--accent)}
}
.nav-skeleton{height:45px;margin:5px 15px;border-radius:12px;background:linear-gradient(90deg,#1e293b 25%,#2d3e5a 50%,#1e293b 75%);background-size:200% 100%;animation:skeletonLoading 1.5s infinite}
@keyframes skeletonLoading {
0%{background-position:200% 0}
100%{background-position:-200% 0}
}
.sidebar-footer{margin-top:auto;padding:20px 15px 15px;border-top:1px solid var(--glass-border);flex-shrink:0}
.user-profile-logout{display:flex;align-items:center;justify-content:space-between;padding:12px;background:#ffffff08;border-radius:16px;cursor:pointer;transition:all .3s ease;border:1px solid transparent}
.user-profile-logout:hover{background:#ffffff14;border-color:var(--glass-border);transform:translateY(-2px)}
.user-info-wrapper{display:flex;align-items:center;gap:12px}
.user-avatar-small{width:42px;height:42px;border-radius:50%;object-fit:cover;background:var(--accent);border:2px solid #ffffff1a}
.user-details{display:flex;flex-direction:column}
.user-name{font-size:.95rem;font-weight:700;color:var(--text-main)}
.user-role{font-size:.75rem;color:var(--text-dim)}
.logout-icon{font-size:1.2rem;color:var(--text-dim);transition:all .3s ease}
.user-profile-logout:hover .logout-icon{color:var(--danger);transform:translateX(3px)}
.fab{position:fixed;bottom:30px;right:30px;width:60px;height:60px;background:var(--success);color:#fff;border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:24px;box-shadow:0 10px 25px #10b98166;border:none;cursor:pointer;z-index:90;transition:all .3s cubic-bezier(0.175,0.885,0.32,1.275)}
.fab:hover{transform:scale(1.1) rotate(90deg);background:#059669;box-shadow:0 15px 30px #10b98180}
.mobile-only{display:none!important}
@media (max-width:768px) {
.fab{bottom:80px;right:20px;width:50px;height:50px}
.sidebar{width:100%;height:65px;flex-direction:row;bottom:0;top:auto;left:0;padding:0;justify-content:space-around;align-items:center;border-right:none;border-top:1px solid var(--glass-border);background:var(--bg-dark);z-index:200;backdrop-filter:none;overflow-y:visible}
.nav-section-title,.sidebar-footer,.logo,.nav-accordion-header,.accordion-icon{display:none!important}
.nav-accordion-content{max-height:none!important;overflow:visible!important;display:contents!important}
.nav-container{flex-direction:row;gap:0;width:100%;height:100%;justify-content:space-around;padding:0;overflow-y:visible}
.nav-section{display:contents}
.nav-section>div{display:contents}
.nav-link{flex-direction:column;gap:4px;padding:4px 2px!important;font-size:.55rem;border-radius:0;justify-content:center;align-items:center;flex:1;margin-bottom:0;min-width:0;text-align:center;background:none!important;border:none!important;box-shadow:none!important}
.nav-link span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;font-size:.5rem}
.nav-link i{font-size:1.1rem;width:auto;text-align:center;filter:none!important}
.nav-link:hover{padding-left:2px!important;background:none}
.nav-link:hover i{transform:none}
.nav-link.active{color:var(--accent)}
.nav-link.active::before{display:none}
.mobile-only{display:flex!important}
.logout-btn-mobile{color:var(--danger)!important}
.nav-container .nav-link:not(#nav-dashboard):not(#nav-transactions):not(#nav-members):not(#nav-mais):not(#nav-logout-mobile){display:none!important}
.mais-profile-header{background:var(--card-bg);border:1px solid var(--glass-border);border-radius:20px;padding:20px;margin-bottom:25px}
.user-info-large{display:flex;align-items:center;gap:15px}
.avatar-large{width:60px;height:60px;border-radius:50%;border:2px solid var(--accent)}
.user-texts h2{font-size:1.1rem;color:var(--text-main);margin:0}
.user-texts p{font-size:.8rem;color:var(--text-dim);margin:0}
.mais-section-title{font-size:.75rem;text-transform:uppercase;color:var(--text-dim);letter-spacing:1px;margin-bottom:15px;font-weight:700}
.mais-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.mais-card{background:var(--card-bg);border:1px solid var(--glass-border);border-radius:16px;padding:18px 10px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;cursor:pointer;transition:transform .2s}
.mais-card:active{transform:scale(0.95)}
.mais-card i{font-size:1.4rem;color:var(--accent)}
.mais-card span{font-size:.7rem;font-weight:600;color:var(--text-main)}
}