/* Banner Styles - v5.2 (FIXED) */

/* Z-index layering */
#maintenance-banner { z-index: 99999; }
#coupon-banner { z-index: 99998; }

/* Coupon banner dark mode */
html.dark #coupon-banner.bg-green-50 { background-color: #064e3b; border-color: #059669; }
html.dark #coupon-banner.bg-green-50 .text-green-800 { color: #6ee7b7; }
html.dark #coupon-banner.bg-green-50 .text-green-600 { color: #34d399; }

html.dark #coupon-banner.bg-indigo-50 { background-color: #1e1b4b; border-color: #4f46e5; }
html.dark #coupon-banner.bg-indigo-50 .text-indigo-800 { color: #a5b4fc; }
html.dark #coupon-banner.bg-indigo-50 .text-indigo-600 { color: #818cf8; }

html.dark #coupon-banner.bg-amber-50 { background-color: #78350f; border-color: #d97706; }
html.dark #coupon-banner.bg-amber-50 .text-amber-800 { color: #fcd34d; }
html.dark #coupon-banner.bg-amber-50 .text-amber-600 { color: #fbbf24; }

/* Slide in animation */
@keyframes slideDown {
    from { opacity: 0; transform: translateY(-100%); }
    to { opacity: 1; transform: translateY(0); }
}
#maintenance-banner, #coupon-banner {
    animation: slideDown 0.3s ease-out;
}

/* Mobile */
@media (max-width: 640px) {
    #maintenance-banner > div, #coupon-banner > div { padding: 10px 12px; }
    #maintenance-banner span, #coupon-banner span { font-size: 13px; }
}

/* Print */
@media print {
    #maintenance-banner, #coupon-banner { display: none !important; }
    body { padding-top: 0 !important; }
}