/* ═══════════════════════════════════════════
   BESAT DIGITAL MENU - DARK MODE
   ═══════════════════════════════════════════ */

.besat-dark {
    --besat-bg: #0F0F1A;
    --besat-surface: #1A1A2E;
    --besat-surface-hover: #22223A;
    --besat-border: #2D2D44;
    --besat-text-primary: #E4E4E7;
    --besat-text-secondary: #A1A1AA;
    --besat-text-muted: #71717A;
    --besat-shadow-sm: 0 1px 3px rgba(0,0,0,0.3);
    --besat-shadow-md: 0 4px 12px rgba(0,0,0,0.4);
    --besat-shadow-lg: 0 8px 30px rgba(0,0,0,0.5);
    --besat-shadow-xl: 0 20px 60px rgba(0,0,0,0.6);
    --besat-gray-100: #22223A;
    --besat-gray-200: #2D2D44;
    --besat-gray-300: #3D3D55;
}

.besat-dark body,
body.besat-dark {
    background: var(--besat-bg);
    color: var(--besat-text-primary);
}

/* Header */
.besat-dark .besat-header {
    background: linear-gradient(135deg, #0a0a15 0%, #1a1a2e 50%, #0a0a15 100%);
}

/* Nav */
.besat-dark .besat-nav {
    background: rgba(15, 15, 26, 0.95);
    border-bottom-color: var(--besat-border);
}

.besat-dark .besat-nav__link {
    background: var(--besat-gray-100);
    color: var(--besat-text-secondary);
}

.besat-dark .besat-nav__link:hover {
    background: rgba(255, 107, 0, 0.15);
}

.besat-dark .besat-nav__link--active {
    background: var(--besat-primary);
    color: white;
}

/* Items */
.besat-dark .besat-item {
    background: var(--besat-surface);
    border-color: var(--besat-border);
}

.besat-dark .besat-item:hover {
    border-color: rgba(255, 107, 0, 0.3);
    background: var(--besat-surface-hover);
}

.besat-dark .besat-item__image-placeholder {
    background: linear-gradient(135deg, #22223A, #2D2D44);
}

/* Category */
.besat-dark .besat-category__header {
    border-bottom-color: var(--besat-border);
}

.besat-dark .besat-category__icon {
    background: rgba(255, 107, 0, 0.15);
}

/* Cart */
.besat-dark .besat-cart__container {
    background: var(--besat-surface);
}

.besat-dark .besat-cart__header {
    border-bottom-color: var(--besat-border);
}

.besat-dark .besat-cart__header::before {
    background: var(--besat-gray-300);
}

.besat-dark .besat-cart__close {
    background: var(--besat-gray-200);
    color: var(--besat-text-secondary);
}

.besat-dark .besat-cart__item {
    border-bottom-color: var(--besat-border);
}

.besat-dark .besat-cart__footer {
    background: var(--besat-surface);
    border-top-color: var(--besat-border);
}

.besat-dark .besat-cart__item-image {
    background: var(--besat-gray-200);
}

/* Form */
.besat-dark .besat-form__input,
.besat-dark .besat-form__textarea {
    background: var(--besat-bg);
    border-color: var(--besat-border);
    color: var(--besat-text-primary);
}

.besat-dark .besat-form__input:focus,
.besat-dark .besat-form__textarea:focus {
    border-color: var(--besat-primary);
}

/* Counter */
.besat-dark .besat-counter {
    background: var(--besat-bg);
}

.besat-dark .besat-counter__btn--minus {
    background: var(--besat-gray-200);
    border-color: var(--besat-gray-300);
    color: var(--besat-text-secondary);
}

/* Modal */
.besat-dark .besat-modal__content {
    background: var(--besat-surface);
}

.besat-dark .besat-modal__close {
    background: var(--besat-gray-200);
    color: var(--besat-text-secondary);
}

/* Toast */
.besat-dark .besat-toast {
    background: var(--besat-surface);
    box-shadow: 0 8px 30px rgba(0,0,0,0.5);
}

.besat-dark .besat-toast__message {
    color: var(--besat-text-primary);
}

/* FAB */
.besat-dark .besat-fab__badge {
    border-color: var(--besat-bg);
}

/* Sponsor */
.besat-dark .besat-sponsor--inline .besat-sponsor__banner {
    background: linear-gradient(135deg, rgba(255,107,0,0.08), rgba(255,217,61,0.05));
    border-color: rgba(255,107,0,0.2);
}

/* Scrollbar */
.besat-dark ::-webkit-scrollbar-thumb { background: var(--besat-gray-300); }
.besat-dark ::-webkit-scrollbar-thumb:hover { background: var(--besat-gray-400); }

/* Skeleton Dark */
.besat-dark .besat-shimmer {
    background: linear-gradient(
        90deg,
        var(--besat-gray-200) 25%,
        var(--besat-gray-300) 50%,
        var(--besat-gray-200) 75%
    );
    background-size: 200% 100%;
}