/* /Layout/MainLayout.razor.rz.scp.css */
/* --- MAIN LAYOUT CSS --- */

.page[b-a25r9iatxr] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

main[b-a25r9iatxr] {
    flex: 1;
    background-color: #f5f5f5;
    display: flex;
    flex-direction: column;
}

/* Sticky top navigation bar area */
.top-row[b-a25r9iatxr] {
    position: sticky;
    top: 0;
    z-index: 1000;
    height: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    padding: 0;
    background-color: white; 
    color: #666;
}

/* Main content area */
article.content[b-a25r9iatxr] {
    padding: 1.5rem;
    background-color: #fff;
    border-radius: 6px;
    margin: 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Mobile adjustments */
@media (max-width: 640.98px) {
    .top-row[b-a25r9iatxr] {
        height: auto;
    }

    article.content[b-a25r9iatxr] {
        margin: 0.5rem;
        padding: 1rem;
    }
}
/* /Layout/NavMenu.razor.rz.scp.css */
/* Modern Navbar Styles */
.modern-navbar[b-vqjjzvxqov] {
    backdrop-filter: saturate(180%) blur(14px);
    background: linear-gradient(135deg, rgba(255,255,255,0.85) 0%, rgba(245,247,250,0.9) 60%, rgba(230,235,245,0.9) 100%);
    border-bottom: 1px solid rgba(255,255,255,.4);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 .75rem;
    height: 3.5rem;
    position: sticky;
    top: 0;
    z-index: 1050;
}

.brand-gradient-text[b-vqjjzvxqov] {
    background: linear-gradient(90deg,#667eea,#764ba2,#f093fb);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 700;
    letter-spacing: .5px;
}

.left-section[b-vqjjzvxqov] { display:flex; align-items:center; }
.navbar-brand[b-vqjjzvxqov] { text-decoration:none; font-size:1.05rem; transition:opacity .3s ease; }
.navbar-brand:hover[b-vqjjzvxqov] { opacity:.8; }

.nav[b-vqjjzvxqov] { display:flex; align-items:center; gap:.25rem; margin-left:auto; }

.nav-item[b-vqjjzvxqov]  a {
    text-decoration: none;
    padding: .45rem .9rem;
    border-radius: 999px;
    display: flex;
    align-items: center;
    gap: .5rem;
    white-space: nowrap;
    font-size: .85rem;
    font-weight: 500;
    color: #4a5568;
    position: relative;
    transition: background .25s ease, color .25s ease;
}
.nav-item[b-vqjjzvxqov]  a:hover { background: rgba(102,126,234,.12); color:#2d3748; }
.nav-item[b-vqjjzvxqov]  a.active {
    background: linear-gradient(135deg,#667eea,#764ba2);
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(118,75,162,.35);
}

.social-icon[b-vqjjzvxqov] {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(255,255,255,.6);
    color: #764ba2;
    font-size: 1rem;
    transition: all .3s ease;
    text-decoration: none;
}
.social-icon:hover[b-vqjjzvxqov] { background: linear-gradient(135deg,#f093fb,#667eea); color:#fff; transform:translateY(-3px); box-shadow:0 6px 16px rgba(102,126,234,.3); }

.tagline[b-vqjjzvxqov] { font-size:.7rem; letter-spacing:.5px; }

.dropdown-menu.user-dropdown[b-vqjjzvxqov] {
    background: linear-gradient(135deg,#ffffff,#f5f7fa);
    border: 1px solid rgba(255,255,255,.6);
    border-radius: 1rem;
    box-shadow: 0 10px 28px -5px rgba(0,0,0,.25);
    padding:.25rem .25rem;
    min-width:220px;
}

.dropdown-item[b-vqjjzvxqov],
.dropdown-item-text[b-vqjjzvxqov] {
    display: flex;
    align-items: center;
    gap: .55rem;
    color: #4a5568 !important;
    padding: .55rem .85rem;
    border-radius: .65rem;
    font-size:.8rem;
    background: transparent;
    transition: background .25s ease, color .25s ease;
}
.dropdown-item:hover[b-vqjjzvxqov] { background: linear-gradient(135deg,#667eea,#764ba2); color:#fff !important; }

.avatar-circle[b-vqjjzvxqov] {
    width: 32px;
    height: 32px;
    border-radius:50%;
    background: linear-gradient(135deg,#667eea,#764ba2);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:.9rem;
    box-shadow:0 4px 10px rgba(118,75,162,.35);
}

.user-trigger[b-vqjjzvxqov] { font-size:.8rem; }

.navbar-toggler[b-vqjjzvxqov] {
    width:40px;
    height:40px;
    border-radius:8px;
    background: linear-gradient(135deg,#667eea,#764ba2);
    box-shadow:0 4px 12px rgba(118,75,162,.35);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0;
    border:none;
}
.navbar-toggler-icon[b-vqjjzvxqov] { filter: invert(100%); }

/* Desktop */
@media (min-width:769px) {
    .collapse[b-vqjjzvxqov] { display:flex !important; position:static; background:none; transform:none !important; }
    .navbar-toggler[b-vqjjzvxqov] { display:none; }
}

/* Mobile */
@media (max-width:768px) {
    .collapse[b-vqjjzvxqov] {
        position: fixed;
        top: 3.5rem;
        left: 0;
        width: 70%;
        max-width: 280px;
        height: calc(100vh - 3.5rem);
        background: linear-gradient(135deg,#ffffff,#f2f4f8);
        flex-direction: column;
        align-items: flex-start;
        padding: 1rem;
        gap: .75rem;
        transform: perspective(800px) rotateY(90deg);
        transform-origin: left center;
        transition: transform .4s ease, box-shadow .3s ease;
        box-shadow: none;
        will-change: transform;
    }
    .collapse.show[b-vqjjzvxqov] { transform: perspective(800px) rotateY(0deg); overflow:visible !important; }
    .nav[b-vqjjzvxqov] { flex-direction:column; width:100%; }
    .nav-item[b-vqjjzvxqov] { width:100%; }
    .nav-item[b-vqjjzvxqov]  a { padding:.6rem 1rem; border-radius:12px; font-size:.9rem; }
}

