@import '_content/Blazored.Toast/Blazored.Toast.bundle.scp.css';

/* /Layout/MainLayout.razor.rz.scp.css */
/* ── Public (non-admin) layout ─────────────────────────────── */
.page[b-3w8213fgkz] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

main[b-3w8213fgkz] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* ── Hero ─────────────────────────────────────────────────── */
.hero[b-3w8213fgkz] {
    background: url('/images/banner.jpg') center/cover no-repeat;
    min-height: 320px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-shadow: 0 2px 6px rgba(0,0,0,0.4);
    padding: 2rem 1rem;
}

.hero h1[b-3w8213fgkz] {
    font-size: clamp(1.4rem, 5vw, 2.5rem);
    font-weight: bold;
    margin-bottom: 15px;
}

.hero p[b-3w8213fgkz] {
    font-size: clamp(1rem, 3vw, 1.2rem);
    margin-bottom: 25px;
}

/* ── Hero button ─────────────────────────────────────────── */
.btn-hero[b-3w8213fgkz] {
    background-color: #ffa500;
    color: #000;
    font-weight: bold;
    border-radius: 30px;
    padding: 10px 28px;
    transition: transform 0.3s;
}

.btn-hero:hover[b-3w8213fgkz] { transform: scale(1.05); }

/* ── Cards ───────────────────────────────────────────────── */
.card-custom[b-3w8213fgkz] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    transition: transform 0.3s;
}

.card-custom:hover[b-3w8213fgkz] { transform: translateY(-5px); }

/* ── Header bar ──────────────────────────────────────────── */
.app-header[b-3w8213fgkz] {
    background-color: rgb(60, 58, 68);
    padding: 0.5rem 1rem;
    min-height: 56px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

/* ── Login form ──────────────────────────────────────────── */
.login-form input[b-3w8213fgkz]  { height: 35px; font-size: 0.9rem; }
.login-form button[b-3w8213fgkz] { height: 35px; font-size: 0.9rem; font-weight: bold; }
/* /Layout/NavMenu.razor.rz.scp.css */
/* ── NavMenu is rendered inside MudDrawer (Dark) ─────────── */
/* MudDrawer with DrawerVariant.Responsive auto-handles:       */
/*   desktop  → permanent open sidebar                         */
/*   mobile   → temporary overlay drawer                       */
/* No extra fixed-positioning needed here.                     */

/* ── Sidebar container (when used in old MainLayout) ──────── */
.sidebar[b-j2zwh1zyid] {
    background-color: rgb(60, 58, 68);
    min-height: 100vh;
    width: 220px;
    overflow-y: auto;
    padding-top: 1rem;
}

.sidebar .nav-link[b-j2zwh1zyid] {
    color: #FFA500;
    font-weight: 500;
    padding: 10px 15px;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.3s ease;
}

.sidebar .nav-link i[b-j2zwh1zyid] { font-size: 1.2rem; }

.sidebar .nav-link:hover[b-j2zwh1zyid] {
    background-color: #6c757d;
    color: #fff;
    border-radius: 6px;
}

.sidebar .nav-link.active[b-j2zwh1zyid] {
    background-color: rgba(255, 165, 0, 0.2);
    color: #fff;
}