
.header_sale_timer {
    background-color: #d71e41;
    color: #fff;
    padding: 13.75px 10px;
    text-align: center;
    font-family: Arial, sans-serif;
    font-weight: bold;
    width: 100%;
    /*position: fixed;*/
    z-index: 100000;
    /*top: 50px;*/
    transition: background-color 0.3s ease, color 0.3s ease;
}

@media (min-width: 768px) {
    .header_sale_timer.countdown-active {
        padding: 5px 10px 6px;
    }
}

.countdown-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}

#saleCountdownLabel {
    font-size: 2em;
    font-weight: normal;
}

#saleCountdownLabel span {
    font-size: inherit;
    font-weight: 600;
}

#saleCountdown {
    gap: 10px;
    font-size: 1.5em;
    font-weight: 600;
    display: flex;
}


@media (min-width: 768px) {
    #saleCountdown {
        display: flex;
    }
    .sale-header{
        padding-top: 60px !important;
    }
}

.countdown-box {
    background-color: #fff;
    color: #000;
    padding: 5px;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 60px;
}

.countdown-number {
    font-size: 17px;
    line-height: 1;
}

.countdown-label {
    font-size: 12px;
    line-height: 1;
}
.sale-page {
    padding-top: 60px !important;
}
.header_sale_timer { position: relative; }
.promo-dismiss{
    position:absolute; right:8px; top:6px; background:transparent; border:0;
    font-size:22px; color:#fff; line-height:1; cursor:pointer;
}
.promo-body { margin-left:.35rem; font-weight:normal; }

/* === Light Theme === */
.header_sale_timer.theme-light {
    background-color: #fff;
    color: #111;
    border-bottom: 1px solid #ddd;
}
.header_sale_timer.theme-light .promo-body span,
.header_sale_timer.theme-light #saleCountdownLabel span {
    color: #d71e41;
}
.header_sale_timer.theme-light .countdown-box {
    background-color: #f7f7f7;
    color: #111;
}

/* === Dark Theme === */
.header_sale_timer.theme-dark {
    background-color: #1c1c1c;
    color: #f5f5f5;
    border-bottom: 1px solid #333;
}
.header_sale_timer.theme-dark .promo-body span,
.header_sale_timer.theme-dark #saleCountdownLabel span {
    color: #ffc107;
}
.header_sale_timer.theme-dark .countdown-box {
    background-color: #333;
    color: #f5f5f5;
}
/* === Brand (Default) === */
.header_sale_timer.theme-brand {
    background-color: #d71e41; /* red */
    color: #fff;
}
.header_sale_timer.theme-brand .countdown-box {
    background-color: #fff;
    color: #000;
}
