/*
 * Deals Package — Midnight Theme
 * Dark mode palette with indigo/violet accents.
 * base.css must be loaded first (provides all structural CSS).
 */

:root,
body[data-theme="midnight"],
.deals {
    --deals-bg:              #0f172a;
    --deals-surface:         #1e293b;
    --deals-border:          #334155;
    --deals-border-hover:    #818cf8;
    --deals-shadow:          0 1px 3px rgba(0,0,0,.4);
    --deals-shadow-hover:    0 4px 16px rgba(0,0,0,.5);
    --deals-radius:          12px;
    --deals-padding:         16px;
    --deals-gap:             20px;

    --deals-text:            #f1f5f9;
    --deals-muted:           #94a3b8;
    --deals-accent:          #6366f1;
    --deals-accent-hover:    #4f46e5;
    --deals-accent-contrast: #ffffff;

    --deals-price:           #e2e8f0;
    --deals-price-original:  #64748b;
    --deals-discount-bg:     #14532d;
    --deals-discount-text:   #86efac;

    --deals-rating:          #fbbf24;
    --deals-badge-bg:        #1e1b4b;
    --deals-badge-text:      #a5b4fc;
}

body[data-theme="midnight"] {
    background: #0f172a;
    color: #f1f5f9;
}
.deals { background: var(--deals-bg); color: var(--deals-text); }
.deals .deals__image { background: #1e293b; }