/* ---------- Sidebar ---------- */

.sidebar{

position:fixed;

top:0;

left:0;

width:260px;

height:100vh;

background:#2c0536;

display:flex;

flex-direction:column;

overflow:auto;

box-shadow:3px 0 15px rgba(0,0,0,.12);

z-index:1000;

}


/* Logo */

.sidebar-logo{

    text-align:center;

    padding:22px 20px 18px;

    border-bottom:1px solid rgba(255,255,255,.08);

}

.sidebar-logo img{

    width:200px;
    filter:drop-shadow(0 4px 10px rgba(0,0,0,.35));
    background:#ffffff;
    border-radius:10px;
    padding:8px;
    box-shadow:0 4px 12px rgba(0,0,0,.25);

    max-width:100%;

    height:auto;

    display:block;

    margin:0 auto 8px;

}

.sidebar-logo h1{

margin:0;

font-size:42px;

font-weight:700;

color:#fff;

letter-spacing:-1px;

}

.sidebar-logo span{

    display:block;

    font-size:12px;

    letter-spacing:1px;

    color:rgba(255,255,255,.65);

    text-transform:uppercase;

}


/* Section */

.sidebar-section{

padding-top:20px;

}

.sidebar-title{

padding:0 22px 10px;

font-size:11px;

font-weight:700;

letter-spacing:1px;

color:#9c7ba8;

text-transform:uppercase;

}


/* Menu */

.sidebar a{

display:flex;

align-items:center;

gap:14px;

padding:13px 22px;

margin:4px 12px;

border-radius:10px;

text-decoration:none;

color:#f2f2f2;

font-size:15px;

font-weight:500;

transition:.25s;

}

.sidebar a i{

width:20px;

text-align:center;

font-size:15px;

}


/* Hover */

.sidebar a:hover{

background:rgba(255,255,255,.08);

padding-left:28px;

}


/* Active */

.sidebar a.active{

background:#7a2ff5;

color:#fff;

box-shadow:0 8px 20px rgba(122,47,245,.35);

}


/* Footer */

.sidebar-footer{

margin-top:auto;

padding:20px;

font-size:12px;

text-align:center;

color:#a78ab2;

border-top:1px solid rgba(255,255,255,.08);

}


/* Main Content */

.main-content{

margin-left:260px;

min-height:100vh;

background:#f5f7fb;

}