/* =====================================================
   Matir Bazar — Theme Variables (Ecommerce + Food palette)
   ===================================================== */
:root {
    /* === PRIMARY (30%) — Slate / Midnight Black === */
    --mb-primary:        #0F172A;
    --mb-primary-light:  #1E293B;
    --mb-primary-dark:   #020617;

    /* === SECONDARY (White) === */
    --mb-secondary:      #FFFFFF;

    /* === ACCENT (10%) — Warm Orange (CTA / appetite trigger) === */
    --mb-accent:         #EA580C;
    --mb-accent-light:   #F97316;
    --mb-accent-dark:    #C2410C;

    /* === DANGER === */
    --mb-danger:         #DC2626;

    /* === SURFACES (60% background) === */
    --mb-bg:             #F8FAFC;
    --mb-border:         #F1F5F9;

    /* === TEXT === */
    --mb-text:           #0F172A;
    --mb-text-muted:     #64748B;

    /* === FEEDBACK === */
    --mb-success:        #16A34A;
    --mb-warning:        #F59E0B;

    /* === SHADOWS === */
    --mb-shadow-sm:      0 1px 2px rgba(15, 23, 42, 0.06);
    --mb-shadow:         0 4px 12px rgba(15, 23, 42, 0.08);
    --mb-shadow-lg:      0 10px 30px rgba(15, 23, 42, 0.12);

    /* === RADII === */
    --mb-radius-sm:      6px;
    --mb-radius:         10px;
    --mb-radius-lg:      16px;
    --mb-radius-pill:    999px;

    /* === SPACING === */
    --mb-space-xs:       4px;
    --mb-space-sm:       8px;
    --mb-space:          16px;
    --mb-space-lg:       24px;
    --mb-space-xl:       40px;

    /* === LAYOUT === */
    --mb-container:      1200px;
    --mb-header-h:       64px;
    --mb-bottom-h:       60px;

    /* === FONTS === */
    --mb-font:           'Poppins', 'Noto Sans Bengali', system-ui, -apple-system, sans-serif;
    --mb-font-bn:        'Noto Sans Bengali', 'Poppins', sans-serif;

    /* === TRANSITIONS === */
    --mb-transition:     0.2s ease;
}