:root {
    --brand: #ef6c00;
    --brand-dark: #9a3412;
    --ink: #172033;
    --muted: #667085;
    --surface: #f6f8fb;
    --sidebar: #111827
}

body {
    background: var(--surface);
    color: var(--ink);
    font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif
}

.app-shell {
    min-height: 100vh
}

.sidebar {
    width: 270px;
    background: linear-gradient(180deg, #ffffff, #0b92cf);
    position: fixed;
    inset: 0 auto 0 0;
    overflow-y: auto;
    z-index: 1030
}

.sidebar-brand {
    padding: 1.4rem;
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

.sidebar .nav-link {
    color: #000000;
    border-radius: .75rem;
    margin: .12rem .8rem;
    padding: .7rem .9rem
}

.sidebar .nav-link:hover,
.sidebar .nav-link.active {
    background: rgba(249, 115, 22, .18);
    color: #fff
}

.sidebar .nav-heading {
    padding: .9rem 1.7rem .35rem;
    color: #94a3b8;
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .08em
}

.main {
    margin-left: 270px;
    min-height: 100vh
}

.topbar {
    height: 70px;
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
    position: sticky;
    top: 0;
    z-index: 1020
}

.content {
    padding: 1.5rem
}

.card {
    border: 0;
    border-radius: 1rem;
    box-shadow: 0 8px 30px rgba(15, 23, 42, .06)
}

.stat-card {
    position: relative;
    overflow: hidden
}

.stat-icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: #fff3e0;
    color: var(--brand);
    font-size: 1.35rem
}

.badge-soft {
    background: #fff3e0;
    color: #c2410c
}

.table>thead th {
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #667085;
    background: #f9fafb
}

.btn-primary {
    background: var(--brand);
    border-color: var(--brand)
}

.btn-primary:hover {
    background: var(--brand-dark);
    border-color: var(--brand-dark)
}

.form-control,
.form-select {
    border-radius: .7rem;
    padding: .65rem .8rem
}

.hero {
    background: linear-gradient(135deg, #7c2d12, #ea580c 60%, #f59e0b);
    color: #fff;
    min-height: 100vh
}

.product-card img {
    height: 170px;
    object-fit: cover
}

.timeline {
    position: relative;
    padding-left: 2rem
}

.timeline:before {
    content: "";
    position: absolute;
    left: .55rem;
    top: .4rem;
    bottom: .4rem;
    width: 2px;
    background: #e5e7eb
}

.timeline-item {
    position: relative;
    padding-bottom: 1.2rem
}

.timeline-item:before {
    content: "";
    position: absolute;
    left: -1.72rem;
    top: .25rem;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--brand);
    border: 3px solid #fff;
    box-shadow: 0 0 0 2px #fed7aa
}

.money {
    font-variant-numeric: tabular-nums
}

.mobile-toggle {
    display: none
}

body.sidebar-open {
    overflow: hidden
}

@media(max-width:991.98px) {
    .sidebar {
        position: fixed !important;
        top: 0;
        left: 0;
        bottom: 0;
        z-index: 1040;
        width: min(286px, 86vw);
        height: 100vh;
        visibility: hidden;
        transform: translateX(-105%);
        transition: transform .25s ease, visibility .25s ease;
        box-shadow: 20px 0 55px rgba(15, 23, 42, .17);
    }

    .sidebar.show,
    .sidebar.offcanvas.show {
        visibility: visible;
        transform: translateX(0)
    }

    body.sidebar-open {
        overflow: hidden
    }

    .main {
        margin-left: 0
    }

    .mobile-toggle {
        display: inline-flex
    }

    .content {
        padding: 1rem
    }
}

/* Bhogali brand theme for authenticated panels. Public and login pages are intentionally unscoped. */
body.app-theme {
    --brand: #d9272e;
    --brand-dark: #aa171d;
    --brand-soft: #fff0f0;
    --brand-warm: #ff493d;
    --brand-navy: #0b4a78;
    --bs-primary: #d9272e;
    --bs-primary-rgb: 217, 39, 46;
    --bs-link-color: #d9272e;
    --bs-link-color-rgb: 217, 39, 46;
    --bs-link-hover-color: #aa171d;
    --bs-link-hover-color-rgb: 170, 23, 29;
    --ink: #192536;
    --muted: #78869a;
    --surface: #f6f7f9;
    --line: #e7e9ed;
    background: var(--surface);
    color: var(--ink);
    font-size: .94rem;
}

.app-theme .app-shell { min-height: 100vh; }
.app-theme .sidebar {
    width: 286px;
    background: #fff;
    border-right: 1px solid var(--line);
    box-shadow: none;
    scrollbar-width: thin;
    scrollbar-color: #d8def0 transparent;
}
.app-theme .sidebar-brand {
    min-height: 112px;
    padding: 1.75rem 1.6rem;
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: center;
}
.app-theme .brand-lockup { display: flex; align-items: center; gap: .85rem; color: var(--ink); }
.app-theme .brand-mark {
    width: 46px;
    height: 46px;
    border-radius: 15px;
    display: grid;
    place-items: center;
    color: #fff;
    font-weight: 800;
    letter-spacing: -.04em;
    background: linear-gradient(145deg, var(--brand-warm), var(--brand));
    box-shadow: 0 10px 22px rgba(217, 39, 46, .22);
}
.app-theme .brand-copy { display: flex; flex-direction: column; line-height: 1.05; }
.app-theme .brand-copy strong { font-size: 1.08rem; letter-spacing: .04em; }
.app-theme .brand-copy small { color: var(--muted); font-size: .72rem; margin-top: .35rem; letter-spacing: .04em; }
.app-theme .sidebar .nav { padding: 1.2rem .7rem 2rem !important; }
.app-theme .sidebar .nav-link {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 46px;
    color: var(--ink);
    border-radius: 12px;
    margin: .12rem .45rem;
    padding: .68rem .85rem;
    font-weight: 600;
    transition: color .18s ease, background .18s ease, transform .18s ease;
}
.app-theme .sidebar .nav-link i { width: 24px; font-size: 1.05rem; color: var(--muted); transition: color .18s ease; }
.app-theme .sidebar .nav-link:hover { background: #f7f5ff; color: var(--brand); transform: translateX(2px); }
.app-theme .sidebar .nav-link:hover i,
.app-theme .sidebar .nav-link.active i { color: var(--brand); }
.app-theme .sidebar .nav-link.active { background: var(--brand-soft); color: var(--ink); }
.app-theme .sidebar .nav-link.active::after {
    content: "";
    position: absolute;
    right: -1.15rem;
    top: 8px;
    bottom: 8px;
    width: 4px;
    border-radius: 6px 0 0 6px;
    background: var(--brand);
}
.app-theme .sidebar .nav-heading {
    padding: 1.1rem 1.35rem .45rem;
    color: var(--brand-navy);
    font-size: .67rem;
    font-weight: 800;
    letter-spacing: .1em;
}
.app-theme .main { margin-left: 286px; min-width: 0; }
.app-theme .topbar {
    height: 104px;
    background: rgba(246, 247, 249, .9);
    border: 0;
    border-top: 3px solid var(--brand);
    backdrop-filter: blur(14px);
    gap: 1rem;
}
.app-theme .page-breadcrumb { display: flex; align-items: center; gap: .38rem; color: #707eae; font-size: .75rem; margin-bottom: .25rem; }
.app-theme .page-breadcrumb i { font-size: .55rem; }
.app-theme .page-identity h4 { color: var(--ink); font-size: 1.55rem; font-weight: 800; letter-spacing: -.025em; }
.app-theme .topbar-actions {
    gap: .45rem;
    padding: .45rem;
    background: #fff;
    border: 1px solid rgba(255,255,255,.8);
    border-radius: 999px;
    box-shadow: 0 10px 30px rgba(112, 144, 176, .12);
}
.app-theme .menu-search { align-items: center; gap: .55rem; width: 205px; padding: .58rem .85rem; border-radius: 999px; background: var(--surface); color: #a3aed0; }
.app-theme .menu-search input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: .84rem; }
.app-theme .menu-search input::placeholder { color: #a3aed0; }
.app-theme .icon-button { width: 38px; height: 38px; display: inline-grid; place-items: center; border: 0; border-radius: 50%; color: #8f9bba; background: transparent; }
.app-theme .icon-button:hover { background: var(--brand-soft); color: var(--brand); }
.app-theme .profile-trigger { display: flex; align-items: center; gap: .6rem; max-width: 245px; border: 0; padding: 0 .25rem 0 0; background: transparent; color: var(--ink); text-align: left; }
.app-theme .profile-avatar { flex: 0 0 auto; width: 39px; height: 39px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: linear-gradient(145deg, var(--brand-warm), var(--brand)); font-size: .72rem; font-weight: 800; box-shadow: 0 5px 14px rgba(217,39,46,.22); }
.app-theme .profile-copy { min-width: 0; line-height: 1.05; }
.app-theme .profile-copy strong { display: block; max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .78rem; }
.app-theme .profile-copy small { display: block; max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: .65rem; margin-top: .28rem; }
.app-theme .notification-menu,
.app-theme .profile-menu { margin-top: .8rem !important; border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 20px 50px rgba(112,144,176,.2); overflow: hidden; }
.app-theme .profile-menu { min-width: 280px; padding: .65rem; }
.app-theme .profile-menu-heading { display: flex; align-items: center; gap: .75rem; padding: .55rem; }
.app-theme .profile-menu-heading div { min-width: 0; }
.app-theme .profile-menu-heading strong,
.app-theme .profile-menu-heading small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-theme .profile-menu-heading small { color: var(--muted); font-size: .72rem; margin-top: .2rem; }
.app-theme .dropdown-item { border-radius: 10px; padding: .65rem .75rem; }

.app-theme .content { padding: .5rem 1.75rem 2rem; }
.app-theme .content > .d-flex:first-child h3 { color: var(--ink); font-weight: 800; letter-spacing: -.025em; }
.app-theme .text-muted { color: var(--muted) !important; }
/*.app-theme a { color: var(--brand); }*/
.app-theme .card {
    border: 1px solid rgba(255,255,255,.8);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(112, 144, 176, .08);
}
.app-theme .card-header { border-radius: 20px 20px 0 0 !important; }
.app-theme .stat-card,
.app-theme .row > div > .card.h-100 { transition: transform .2s ease, box-shadow .2s ease; }
.app-theme .stat-card:hover,
.app-theme .row > div > .card.h-100:hover { transform: translateY(-3px); box-shadow: 0 18px 38px rgba(112,144,176,.14); }
.app-theme .stat-icon { width: 48px; height: 48px; border-radius: 50%; background: var(--brand-soft); color: var(--brand); }
.app-theme .badge-soft { background: var(--brand-soft); color: var(--brand); }
.app-theme .table { --bs-table-bg: transparent; color: var(--ink); }
.app-theme .table > :not(caption) > * > * { padding: .9rem 1rem; border-bottom-color: #edf1f8; }
.app-theme .table > thead th { border: 0; background: #f8f9fd; color: #a3aed0; font-size: .69rem; font-weight: 800; letter-spacing: .055em; }
.app-theme .table > thead th:first-child { border-radius: 12px 0 0 12px; }
.app-theme .table > thead th:last-child { border-radius: 0 12px 12px 0; }
.app-theme .table tbody tr { transition: background .15s ease; }
.app-theme .table tbody tr:hover { background: #fafbff; }
.app-theme .form-label { color: #4c587f; font-size: .82rem; font-weight: 700; }
.app-theme .form-control,
.app-theme .form-select {
    min-height: 44px;
    border: 1px solid #dfe5f2;
    border-radius: 12px;
    padding: .62rem .8rem;
    color: var(--ink);
    background-color: #fff;
    box-shadow: none;
}
.app-theme textarea.form-control { min-height: auto; }
.app-theme .form-control:focus,
.app-theme .form-select:focus { border-color: #ed7277; box-shadow: 0 0 0 3px rgba(217,39,46,.1); }
.app-theme .input-group > .form-control,
.app-theme .input-group > .form-select { min-height: 44px; }
.app-theme .input-group-text { border-color: #dfe5f2; background: #f7f9fd; color: #7180a8; }
.app-theme .btn { border-radius: 11px; font-weight: 700; padding: .58rem .9rem; }
.app-theme .btn-sm { border-radius: 9px; padding: .38rem .68rem; font-size: .78rem; }
.app-theme .btn-primary { background: var(--brand); border-color: var(--brand); box-shadow: 0 7px 16px rgba(217,39,46,.18); }
.app-theme .btn-primary:hover,
.app-theme .btn-primary:focus { background: var(--brand-dark); border-color: var(--brand-dark); transform: translateY(-1px); }
.app-theme .btn-outline-primary { color: var(--brand); border-color: #ef9a9e; }
.app-theme .btn-outline-primary:hover { color: #fff; background: var(--brand); border-color: var(--brand); }
.app-theme .btn-dark { background: var(--brand-navy); border-color: var(--brand-navy); }
.app-theme .pagination { gap: .3rem; }
.app-theme .page-link { border: 0; border-radius: 9px !important; color: #7180a8; }
.app-theme .active > .page-link { background: var(--brand); }
.app-theme .alert { border: 0; border-radius: 15px; box-shadow: 0 8px 24px rgba(112,144,176,.08); }
.app-theme .badge { border-radius: 8px; padding: .42em .65em; font-weight: 700; }
.app-theme .modal-content { border: 0; border-radius: 20px; box-shadow: 0 24px 60px rgba(27,37,89,.18); }
.app-theme .list-group-item { border-color: var(--line); }

@media (max-width: 1199.98px) {
    .app-theme .sidebar { width: 254px; }
    .app-theme .main { margin-left: 254px; }
    .app-theme .sidebar .nav-link { font-size: .86rem; }
}
@media (max-width: 991.98px) {
    .app-theme .sidebar { width: min(286px, 86vw); box-shadow: 20px 0 45px rgba(27,37,89,.16); }
    .app-theme .main { margin-left: 0; }
    .app-theme .topbar { height: 88px; }
    .app-theme .content { padding: .35rem 1rem 1.5rem; }
    .app-theme .page-identity h4 { font-size: 1.25rem; }
    .app-theme .page-breadcrumb { display: none; }
}
@media (max-width: 575.98px) {
    .app-theme .topbar { padding-left: .75rem !important; padding-right: .75rem !important; }
    .app-theme .topbar-actions { padding: .32rem; }
    .app-theme .content { padding-left: .75rem; padding-right: .75rem; }
    .app-theme .card { border-radius: 16px; }
    .app-theme .table > :not(caption) > * > * { padding: .75rem; }
}