/* =========================================================================
   DEALSTOPR - EVENT PAGE (/black-friday-deals)
   Coupon cards, store cards aur popup ka design home.css se aata hai.
   Yahan sirf hero, notice, empty state aur content ka design hai.
   ========================================================================= */

.ev-hero {
    background-color: #F7F6F4;
    text-align: center;
    padding: 34px 0 38px;
    position: relative;
}
.ev-hero.has-banner {
    background-image: linear-gradient(rgba(17, 17, 17, .62), rgba(17, 17, 17, .62)), var(--ev-banner);
    background-size: cover;
    background-position: center;
    color: #fff;
    padding: 56px 0 60px;
}
.ev-crumbs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #777;
    margin-bottom: 14px;
}
.ev-crumbs a { color: #777; text-decoration: none; }
.ev-crumbs a:hover { color: #FF5F00; }
.ev-hero h1 {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 auto 12px;
    max-width: 860px;
    color: #111;
}
.ev-sub {
    font-size: 1.1rem;
    line-height: 1.6;
    color: #666;
    max-width: 650px;
    margin: 0 auto;
}
.ev-stats {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 20px;
}
.ev-stats span {
    background: #fff;
    border: 1px solid #e7e7e7;
    border-radius: 999px;
    padding: 6px 14px;
    font-size: 14px;
    color: #444;
}
.ev-stats strong { color: #FF5F00; }

.ev-hero.has-banner .ev-crumbs,
.ev-hero.has-banner .ev-crumbs a { color: rgba(255, 255, 255, .8); }
.ev-hero.has-banner h1 { color: #fff; }
.ev-hero.has-banner .ev-sub { color: rgba(255, 255, 255, .88); }
.ev-hero.has-banner .ev-stats span { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .28); color: #fff; }
.ev-hero.has-banner .ev-stats strong { color: #FFB27A; }

.ev-notice {
    margin: 22px 0 0;
    padding: 12px 16px;
    border-left: 4px solid #FF5F00;
    background: #FFF4EC;
    color: #7a3500;
    border-radius: 4px;
    font-size: 15px;
}

.ev-empty {
    text-align: center;
    padding: 50px 20px;
    border: 1px dashed #ddd;
    border-radius: 10px;
    background: #fafafa;
}
.ev-empty h3 { font-size: 22px; margin: 0 0 8px; color: #111; }
.ev-empty p { color: #666; margin: 0; }
.ev-empty a { color: #FF5F00; font-weight: 600; }

.ev-content {
    max-width: 860px;
    margin: 0 auto;
    font-size: 17px;
    line-height: 1.75;
    color: #333;
}
.ev-content h2 { font-size: 26px; margin: 34px 0 12px; color: #111; }
.ev-content h3 { font-size: 21px; margin: 26px 0 10px; color: #111; }
.ev-content p { margin: 0 0 18px; }
.ev-content a { color: #FF5F00; text-decoration: underline; }
.ev-content ul, .ev-content ol { padding-left: 24px; margin: 0 0 18px; }
.ev-content li { margin-bottom: 6px; }
.ev-content img { max-width: 100%; height: auto; }
.ev-content table { width: 100%; border-collapse: collapse; margin: 0 0 20px; display: block; overflow-x: auto; }
.ev-content th, .ev-content td { border: 1px solid #e7e7e7; padding: 10px 12px; text-align: left; }

@media (max-width: 768px) {
    .ev-hero h1 { font-size: 28px; }
    .ev-hero.has-banner { padding: 40px 0 44px; }
}