/* MenuHub admin design system */
:root {
    --mh-sidebar-w: 260px;
    --mh-sidebar-bg: #161a2b;
    --mh-sidebar-fg: #c4c8da;
    --mh-accent: #e4572e;
    --bs-primary: #e4572e;
    --bs-primary-rgb: 228, 87, 46;
    --bs-link-color: #c8461f;
    --bs-link-color-rgb: 200, 70, 31;
    --bs-link-hover-color: #a33a19;
    --bs-body-font-family: 'Cairo', 'Inter', system-ui, sans-serif;
    --bs-body-bg: #f4f5f9;
    --bs-border-radius: .6rem;
}
[dir="ltr"] { --bs-body-font-family: 'Inter', 'Cairo', system-ui, sans-serif; }
body { font-family: var(--bs-body-font-family); }
.btn-primary { --bs-btn-bg: #e4572e; --bs-btn-border-color: #e4572e; --bs-btn-hover-bg: #c8461f; --bs-btn-hover-border-color: #c8461f; --bs-btn-active-bg: #b13d1a; --bs-btn-active-border-color: #b13d1a; --bs-btn-disabled-bg: #e4572e; --bs-btn-disabled-border-color: #e4572e; }
.btn-outline-primary { --bs-btn-color: #e4572e; --bs-btn-border-color: #e4572e; --bs-btn-hover-bg: #e4572e; --bs-btn-hover-border-color: #e4572e; --bs-btn-active-bg: #c8461f; --bs-btn-active-border-color: #c8461f; }
.text-primary { color: #e4572e !important; }
.bg-primary { background-color: #e4572e !important; }
.bg-primary-subtle { background-color: #fde6df !important; }
.form-check-input:checked { background-color: #e4572e; border-color: #e4572e; }
.form-control:focus, .form-select:focus { border-color: #f0a189; box-shadow: 0 0 0 .2rem rgba(228, 87, 46, .15); }
.nav-pills .nav-link.active { background-color: #e4572e; }
.page-link { color: #c8461f; }
.active > .page-link { background-color: #e4572e; border-color: #e4572e; }
.min-w-0 { min-width: 0; }

.brand-mark { width: 36px; height: 36px; border-radius: 10px; background: linear-gradient(135deg, #e4572e, #f4a259); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 1.1rem; }
.avatar-letter { width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,.12); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; }

/* Layout */
.admin-wrapper { display: flex; min-height: 100vh; }
.admin-sidebar { width: var(--mh-sidebar-w); background: var(--mh-sidebar-bg) !important; color: var(--mh-sidebar-fg); flex-shrink: 0; }
@media (min-width: 992px) {
    .admin-sidebar { position: sticky; top: 0; height: 100vh; overflow-y: auto; }
}
@media (max-width: 991.98px) {
    .admin-sidebar.offcanvas-lg { --bs-offcanvas-width: 280px; --bs-offcanvas-bg: var(--mh-sidebar-bg); }
}
.sidebar-brand { padding: 1.1rem 1.2rem; border-bottom: 1px solid rgba(255,255,255,.06); }
.sidebar-restaurant { padding: .9rem 1.2rem; border-bottom: 1px solid rgba(255,255,255,.06); background: rgba(255,255,255,.03); }
.sidebar-nav { padding: .5rem .6rem 2rem; display: flex; flex-direction: column; width: 100%; }
.sidebar-nav .nav-section { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: #7c829b; padding: 1rem .7rem .35rem; }
.sidebar-nav .nav-link { color: var(--mh-sidebar-fg); display: flex; align-items: center; gap: .65rem; padding: .55rem .75rem; border-radius: .5rem; font-size: .93rem; }
.sidebar-nav .nav-link i { font-size: 1.05rem; opacity: .85; }
.sidebar-nav .nav-link:hover { background: rgba(255,255,255,.06); color: #fff; }
.sidebar-nav .nav-link.active { background: var(--mh-accent); color: #fff; }
.admin-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.admin-topbar { background: #fff; border-bottom: 1px solid #e8e9f0; padding: .6rem 1.25rem; position: sticky; top: 0; z-index: 1020; }
.admin-content { padding: 1.5rem 1.25rem 3rem; }
@media (min-width: 1200px) { .admin-content { padding: 1.75rem 2rem 3rem; } }

/* Cards & tables */
.card { border: 1px solid #e8e9f0; box-shadow: 0 1px 2px rgba(16, 24, 40, .04); }
.card-header { background: #fff; font-weight: 600; }
.table > :not(caption) > * > * { padding: .7rem .75rem; }
.table thead th { font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: #6b7085; font-weight: 600; background: #fafbfc; white-space: nowrap; }
.table-thumb { width: 48px; height: 48px; object-fit: cover; border-radius: 8px; background: #f1f2f6; }
.table-thumb-placeholder { width: 48px; height: 48px; border-radius: 8px; background: #f1f2f6; display: inline-flex; align-items: center; justify-content: center; color: #b3b7c6; }
.stat-card .stat-icon { width: 48px; height: 48px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 1.35rem; flex-shrink: 0; }
.filters .form-control, .filters .form-select { min-width: 140px; }

/* Image input */
.image-input-preview { width: 84px; height: 84px; border-radius: 12px; background: #f1f2f6; border: 1px dashed #cfd3df; display: flex; align-items: center; justify-content: center; overflow: hidden; flex-shrink: 0; }
.image-input-preview img { width: 100%; height: 100%; object-fit: cover; }
.image-input-preview i { font-size: 1.8rem; color: #b3b7c6; }

/* Sortable */
.sortable-handle { cursor: grab; color: #9aa0b4; }
.sortable-ghost { opacity: .4; background: #fff4ef !important; }
.sort-list .list-group-item { display: flex; align-items: center; gap: .75rem; }

/* Option groups builder */
.option-group { border: 1px solid #e8e9f0; border-radius: .75rem; padding: 1rem; background: #fcfcfe; margin-bottom: 1rem; }
.option-row { display: grid; grid-template-columns: 1fr 1fr 110px auto auto; gap: .5rem; align-items: center; margin-bottom: .5rem; }
@media (max-width: 767.98px) { .option-row { grid-template-columns: 1fr 1fr; } }

/* Design editor */
.design-preview-frame { width: 100%; height: 760px; border: 10px solid #1f2333; border-radius: 34px; background: #fff; max-width: 400px; display: block; margin: 0 auto; }
.color-field { display: flex; gap: .5rem; align-items: center; }
.color-field input[type=color] { width: 48px; height: 38px; padding: 2px; }
.theme-preset { border: 2px solid transparent; border-radius: .75rem; cursor: pointer; padding: .5rem; background: #fff; }
.theme-preset.active, .theme-preset:hover { border-color: var(--mh-accent); }
.theme-swatch { display: flex; height: 28px; border-radius: 6px; overflow: hidden; }
.theme-swatch span { flex: 1; }

/* Misc */
.qr-box { background: #fff; padding: 1.25rem; border-radius: 1rem; display: inline-block; }
.qr-box svg, .qr-box img { width: 260px; height: 260px; }
.activity-item { border-inline-start: 2px solid #e8e9f0; padding-inline-start: 1rem; position: relative; padding-bottom: 1rem; }
.activity-item::before { content: ''; position: absolute; inset-inline-start: -6px; top: 4px; width: 10px; height: 10px; border-radius: 50%; background: var(--mh-accent); }
.chart-bars { display: flex; align-items: flex-end; gap: 6px; height: 160px; }
.chart-bars .bar { flex: 1; background: linear-gradient(180deg, #f4a259, #e4572e); border-radius: 6px 6px 0 0; min-height: 3px; position: relative; }
.chart-bars .bar:hover::after { content: attr(data-label); position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); background: #1f2333; color: #fff; font-size: .72rem; padding: 2px 6px; border-radius: 4px; white-space: nowrap; margin-bottom: 4px; }
.chart-labels { display: flex; gap: 6px; font-size: .7rem; color: #9aa0b4; }
.chart-labels span { flex: 1; text-align: center; }
.stars { color: #f4b942; white-space: nowrap; }
.auth-body { background: radial-gradient(circle at 20% 0%, #fde6df 0, transparent 40%), #f4f5f9; min-height: 100vh; }
pre.whatsapp-preview { white-space: pre-wrap; background: #e7ffdb; border-radius: .75rem; padding: 1rem; font-family: inherit; font-size: .9rem; }
@media print {
    .admin-sidebar, .admin-topbar, .no-print { display: none !important; }
    .admin-content { padding: 0; }
}