:root {
    --scout-primary: #501F6E;
    --scout-primary-dark: #36134d;
    --scout-primary-soft: #f3edf7;
    --scout-accent: #d6aa52;
    --scout-bg: #f6f7f9;
    --scout-text: #26232a;
    --scout-muted: #74707a;
    --bs-primary: #501F6E;
    --bs-primary-rgb: 80, 31, 110;
    --bs-font-sans-serif: "Tajawal", system-ui, sans-serif;
}
* { box-sizing: border-box; }
body { font-family: var(--bs-font-sans-serif); color: var(--scout-text); background: var(--scout-bg); }
a { text-decoration: none; }
.btn-primary { --bs-btn-bg: var(--scout-primary); --bs-btn-border-color: var(--scout-primary); --bs-btn-hover-bg: var(--scout-primary-dark); --bs-btn-hover-border-color: var(--scout-primary-dark); }
.btn-outline-primary { --bs-btn-color: var(--scout-primary); --bs-btn-border-color: var(--scout-primary); --bs-btn-hover-bg: var(--scout-primary); --bs-btn-hover-border-color: var(--scout-primary); }
.form-control:focus, .form-select:focus { border-color: #9c78b4; box-shadow: 0 0 0 .22rem rgba(80,31,110,.12); }
.topbar { height: 76px; background: #fff; border-bottom: 1px solid #e9e7eb; z-index: 1035; }
.brand-logo { width: 54px; height: 48px; object-fit: contain; border-radius: 7px; }
.navbar-brand span { display: flex; flex-direction: column; color: var(--scout-text); line-height: 1.2; }
.navbar-brand strong { font-size: 1rem; }
.navbar-brand small { font-size: .7rem; color: var(--scout-muted); margin-top: 4px; }
.icon-btn { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: #f5f2f7; color: var(--scout-primary); }
.user-menu { display: flex; align-items: center; gap: 9px; border: 0; }
.user-menu strong, .user-menu small { display: block; font-size: .82rem; }
.user-menu small { color: var(--scout-muted); font-size: .7rem; }
.user-avatar { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 12px; background: var(--scout-primary); color: #fff; font-weight: 800; }
.app-shell { display: flex; min-height: calc(100vh - 76px); }
.sidebar { background: #fff; }
aside.sidebar { width: 254px; flex: 0 0 254px; border-left: 1px solid #e9e7eb; position: sticky; top: 76px; height: calc(100vh - 76px); overflow-y: auto; }
.mobile-sidebar { width: 100%; height: 100%; overflow-y: auto; display: flex; flex-direction: column; align-items: stretch; }
.mobile-sidebar .sidebar-nav { width: 100%; }
#mobileNav { --bs-offcanvas-width: min(85vw, 300px); height: 100vh; }
#mobileNav .offcanvas-body { display: flex; flex-direction: column; padding: 0; width: 100%; }
.sidebar-nav { min-height: 100%; display: flex; flex-direction: column; gap: 4px; }
.nav-section { color: #aaa5ae; font-size: .72rem; font-weight: 700; margin: 16px 10px 5px; }
.sidebar .nav-link { color: #5e5962; border-radius: 11px; padding: 10px 13px; display: flex; gap: 12px; align-items: center; font-weight: 600; }
.sidebar .nav-link i { width: 22px; text-align: center; font-size: 1.02rem; }
.sidebar .nav-link:hover, .sidebar .nav-link.active { background: var(--scout-primary-soft); color: var(--scout-primary); }
.sidebar .nav-link.active { box-shadow: inset -3px 0 var(--scout-primary); }
.sidebar-help { background: linear-gradient(145deg, var(--scout-primary), #723a92); color: #fff; border-radius: 16px; padding: 16px; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; }
.sidebar-help i { font-size: 1.6rem; }.sidebar-help span { font-size: .74rem; opacity: .8; line-height: 1.6; }
.main-content { min-width: 0; flex: 1; }
.page-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 22px; }
.page-header h1 { margin: 0; font-size: 1.48rem; font-weight: 800; }
.page-header p { color: var(--scout-muted); margin: 5px 0 0; font-size: .9rem; }
.card { --bs-card-border-color: #ebe8ed; border-radius: 17px; box-shadow: 0 5px 22px rgba(39,24,48,.035); }
.card-header { background: transparent; border-bottom-color: #eeeaf0; padding: 1rem 1.15rem; }
.card-body { padding: 1.15rem; }
.stat-card { overflow: hidden; position: relative; }
.stat-card::after { content: ""; width: 80px; height: 80px; background: var(--stat-color, var(--scout-primary)); opacity: .06; border-radius: 50%; position: absolute; left: -18px; bottom: -25px; }
.stat-icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; color: var(--stat-color, var(--scout-primary)); background: color-mix(in srgb, var(--stat-color, var(--scout-primary)) 12%, white); font-size: 1.25rem; }
.stat-label { color: var(--scout-muted); font-size: .8rem; font-weight: 600; }.stat-value { font-size: 1.55rem; font-weight: 800; margin-top: 8px; }
.table { --bs-table-bg: transparent; margin: 0; }.table thead th { color: #7c7680; font-size: .73rem; border-bottom-width: 1px; padding: .85rem .75rem; white-space: nowrap; }
.table tbody td { padding: .78rem .75rem; vertical-align: middle; font-size: .84rem; border-color: #f0edf1; }
.sortable { cursor: pointer; user-select: none; }.sortable::after { content: "\F127"; font-family: bootstrap-icons; opacity: .25; margin-right: 6px; font-size: .7rem; }.sortable.sort-asc::after { content: "\F128"; opacity: 1; }.sortable.sort-desc::after { content: "\F124"; opacity: 1; }
.data-table-tools { display: flex; gap: 10px; align-items: center; margin-bottom: 13px; }.data-table-search { max-width: 330px; }
.item-thumb { width: 48px; height: 48px; border-radius: 10px; object-fit: cover; background: #eeeaf0; }.item-thumb-placeholder { display: grid; place-items: center; color: #9e94a4; font-size: 1.2rem; }
.badge-soft-primary { background: var(--scout-primary-soft); color: var(--scout-primary); }.badge-soft-success { background: #e8f7ee; color: #198754; }.badge-soft-danger { background: #fcebec; color: #c23442; }.badge-soft-warning { background: #fff4dd; color: #a86c00; }
.badge { font-weight: 600; padding: .45em .7em; }
.filter-card { background: #fff; border: 1px solid #ebe8ed; border-radius: 16px; padding: 14px; margin-bottom: 18px; }
.form-label { font-size: .82rem; font-weight: 700; }.form-text { font-size: .72rem; }
.upload-zone { border: 2px dashed #d9cedf; border-radius: 16px; padding: 28px; text-align: center; background: #fcfafc; transition: .2s; cursor: pointer; }.upload-zone:hover, .upload-zone.dragover { border-color: var(--scout-primary); background: var(--scout-primary-soft); }.upload-zone i { font-size: 2rem; color: var(--scout-primary); }
.preview-grid, .media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; }.preview-item, .media-card { border: 1px solid #e7e1ea; border-radius: 14px; overflow: hidden; background: #fff; }.preview-item img, .media-card img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }.media-card-body { padding: 10px; }
.qr-box { background: #fff; border: 1px solid #e8e3eb; border-radius: 18px; padding: 14px; display: inline-block; }.qr-box img { width: min(230px, 100%); }
.detail-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 15px; }.detail-item small { display: block; color: var(--scout-muted); margin-bottom: 4px; }.detail-item strong { font-size: .93rem; }
.timeline { position: relative; padding-right: 20px; }.timeline::before { content: ""; position: absolute; right: 5px; top: 10px; bottom: 8px; width: 2px; background: #e6dfea; }.timeline-item { position: relative; padding: 0 18px 18px 0; }.timeline-item::before { content: ""; position: absolute; right: -19px; top: 5px; width: 11px; height: 11px; border-radius: 50%; background: var(--scout-primary); box-shadow: 0 0 0 4px #f1eaf5; }
.chart-row { display: grid; grid-template-columns: 105px 1fr 65px; align-items: center; gap: 10px; margin-bottom: 14px; font-size: .78rem; }.chart-track { height: 9px; background: #eeeaf0; border-radius: 20px; overflow: hidden; }.chart-bar { height: 100%; background: linear-gradient(90deg, var(--scout-primary), #8b5aa7); border-radius: inherit; }
.empty-state { padding: 45px 20px; text-align: center; color: var(--scout-muted); }.empty-state i { display: block; font-size: 2.6rem; color: #cfc5d5; margin-bottom: 10px; }
.guest-body { min-height: 100vh; background: radial-gradient(circle at 15% 15%, #7a4297 0, transparent 28%), linear-gradient(145deg, #36134d, #501F6E 58%, #6f378c); }.guest-shell { width: min(100% - 30px, 450px); margin: auto; min-height: 100vh; display: grid; align-content: center; padding-block: 30px; }.guest-card { background: rgba(255,255,255,.98); border-radius: 24px; padding: 32px; box-shadow: 0 25px 80px rgba(20,5,28,.26); }.guest-logo { width: 110px; height: 85px; object-fit: contain; display: block; margin: 0 auto 14px; }.guest-title { text-align: center; font-weight: 800; font-size: 1.35rem; }.guest-subtitle { text-align: center; color: var(--scout-muted); font-size: .85rem; margin-bottom: 24px; }
@media (max-width: 767.98px) { .topbar { height: 66px; }.brand-logo { width: 45px; height: 40px; }.navbar-brand small { display: none; }.app-shell { min-height: calc(100vh - 66px); }.main-content .container-fluid { padding-bottom: 90px !important; }.page-header { align-items: flex-start; flex-direction: column; }.page-header .btn-group, .page-header > .btn { width: 100%; }.page-header > .btn { display:flex; justify-content:center; }.detail-list { grid-template-columns: 1fr; }.table-responsive { border-radius: 12px; }.data-table-tools { flex-direction: column; align-items: stretch; }.data-table-search { max-width: none; }.guest-card { padding: 25px 20px; }.mobile-sidebar { background:#fff; }.chart-row { grid-template-columns: 80px 1fr 50px; } }
@media print { .topbar, .sidebar, .page-header .btn, .no-print, .alert { display: none !important; }.main-content { width:100%; }.card { box-shadow:none; }.app-shell { display:block; } }