/* =========================================================
   COUPONEARTH DEALS
   COMPACT BLUE + YELLOW PREMIUM UI
========================================================= */

.ce-deals-section {
    display: block !important;
    width: 100% !important;
    padding: 42px 0 !important;
    margin: 0 !important;
    background: #f8fafc !important;
    box-sizing: border-box !important;
}

.ce-deals-section--white {
    background: #ffffff !important;
}

.ce-deals-container {
    width: 100% !important;
    max-width: 1720px !important;
    margin: 0 auto !important;
    padding: 0 26px !important;
    box-sizing: border-box !important;
}


/* =========================================================
   HEADER
========================================================= */

.ce-deals-header {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 20px !important;
    width: 100% !important;
    margin: 0 0 22px !important;
    box-sizing: border-box !important;
}

.ce-deals-heading {
    min-width: 0 !important;
}

.ce-deals-eyebrow {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    margin: 0 0 5px !important;
}

.ce-deals-eyebrow-dot {
    width: 7px !important;
    height: 7px !important;
    min-width: 7px !important;
    border-radius: 50% !important;
    background: #facc15 !important;
}

.ce-deals-eyebrow-text {
    color: #0e7490 !important;
    font-size: 9px !important;
    line-height: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .13em !important;
}

.ce-deals-title {
    margin: 0 !important;
    padding: 0 !important;
    color: #0f172a !important;
    font-size: 28px !important;
    line-height: 34px !important;
    font-weight: 700 !important;
    letter-spacing: -.02em !important;
}

.ce-deals-subtitle {
    margin: 5px 0 0 !important;
    color: #64748b !important;
    font-size: 13px !important;
    line-height: 19px !important;
}


/* =========================================================
   VIEW ALL
========================================================= */

.ce-deals-view-all {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;

    flex-shrink: 0 !important;

    min-height: 36px !important;
    padding: 0 14px !important;

    background: #ffffff !important;

    border: 1px solid #d8e1e6 !important;
    border-radius: 8px !important;

    color: #0e7490 !important;

    font-size: 11px !important;
    line-height: 15px !important;
    font-weight: 600 !important;

    text-decoration: none !important;

    box-sizing: border-box !important;

    transition: all .2s ease !important;
}

.ce-deals-view-all:hover {
    background: #fffbea !important;
    border-color: #facc15 !important;
    color: #075985 !important;
}


/* =========================================================
   GRID
========================================================= */

.ce-deals-grid {
    display: grid !important;

    grid-template-columns:
        repeat(5, minmax(0, 1fr)) !important;

    gap: 18px !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    box-sizing: border-box !important;
}

.ce-deals-item {
    display: flex !important;

    min-width: 0 !important;
    width: 100% !important;

    height: 100% !important;
}


/* =========================================================
   COMPACT CARD
========================================================= */

.ce-deal-card {
    position: relative !important;

    display: flex !important;
    flex-direction: column !important;

    width: 100% !important;
    min-width: 0 !important;

    /*
       REDUCED HEIGHT
    */
    height: 285px !important;
    min-height: 270px !important;

    margin: 0 !important;

    /*
       REDUCED PADDING
    */
    padding: 14px 13px 12px !important;

    background: #ffffff !important;

    /*
       BLUE BORDER
    */
    border: 2px solid #193494 !important;
    border-radius: 14px !important;

    box-shadow:
        0 3px 10px rgba(15, 23, 42, .045) !important;

    overflow: hidden !important;

    box-sizing: border-box !important;

    transition:
        transform .2s ease,
        box-shadow .2s ease !important;
}

.ce-deal-card:hover {
    transform: translateY(-3px) !important;

    box-shadow:
        0 10px 22px rgba(15, 23, 42, .10) !important;
}


/* =========================================================
   TOP BADGES
========================================================= */

.ce-deal-card__top {
    display: flex !important;

    align-items: center !important;
    justify-content: flex-start !important;

    flex-wrap: wrap !important;

    gap: 6px !important;

    width: 100% !important;

    min-height: 27px !important;

    margin: 0 0 8px !important;
}


/* =========================================================
   USED BADGE
========================================================= */

.ce-deal-card__used {
    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    gap: 4px !important;

    min-height: 27px !important;

    padding: 0 9px !important;

    background: #193494 !important;

    border: 0 !important;
    border-radius: 15px !important;

    color: #ffffff !important;

    font-size: 10px !important;
    line-height: 1 !important;

    font-weight: 500 !important;

    white-space: nowrap !important;

    box-sizing: border-box !important;
}

.ce-deal-card__used-icon {
    font-size: 11px !important;
    line-height: 1 !important;
}


/* =========================================================
   TRENDING / NEW
========================================================= */

.ce-deal-card__trending,
.ce-deal-card__new,
.ce-deal-card__deal-badge {
    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    min-height: 27px !important;

    padding: 0 9px !important;

    border-radius: 15px !important;

    font-size: 10px !important;
    line-height: 1 !important;

    font-weight: 600 !important;

    white-space: nowrap !important;

    box-sizing: border-box !important;
}

.ce-deal-card__trending,
.ce-deal-card__new {
    background: #facc15 !important;
    color: #164e63 !important;
}

.ce-deal-card__deal-badge {
    background: #e0f2fe !important;
    color: #075985 !important;
}


/* =========================================================
   LOGO
========================================================= */

/* =========================================================
   LOGO — SAME SIZE FOR ALL STORES
========================================================= */

.ce-deal-card__logo {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    height: 64px !important;

    margin: 0 0 8px !important;
    padding: 0 !important;

    overflow: hidden !important;

    box-sizing: border-box !important;
}


.ce-deal-card__logo img {
    display: block !important;

    width: 145px !important;
    height: 64px !important;

    min-width: 145px !important;
    min-height: 64px !important;

    max-width: 145px !important;
    max-height: 64px !important;

    margin: 0 auto !important;
    padding: 0 !important;

    object-fit: contain !important;
    object-position: center !important;
}

/* =========================================================
   STORE + CATEGORY ONE LINE
========================================================= */

.ce-deal-card__store-category {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;

    gap: 6px !important;

    margin: 0 0 5px !important;
    padding: 15px !important;

    min-width: 0 !important;

    overflow: hidden !important;

    white-space: nowrap !important;
}


/* =========================================================
   STORE NAME
========================================================= */

.ce-deal-card__store-category .ce-deal-card__store {
    display: block !important;

    width: auto !important;
    max-width: 60% !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    color: #000000 !important;

    font-size: 15px !important;
    line-height: 14px !important;

    font-weight: 500 !important;

    text-align: center !important;

    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}


/* =========================================================
   SEPARATOR
========================================================= */

.ce-deal-card__separator {
    flex: 0 0 auto !important;

    color: #cbd5e1 !important;

    font-size: 9px !important;
    line-height: 14px !important;
}


/* =========================================================
   CATEGORY
========================================================= */

.ce-deal-card__store-category .ce-deal-card__category {
    display: block !important;

    width: auto !important;
    max-width: 35% !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    color: #000000 !important;

    font-size: 15px !important;
    line-height: 14px !important;

    text-align: center !important;

    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}






/* =========================================================
   DISCOUNT
========================================================= */

.ce-deal-card__discount {
    display: block !important;

    width: 100% !important;

    min-height: 21px !important;

    margin: 0 !important;

    color: #111827 !important;

    font-size: 14px !important;
    line-height: 21px !important;

    font-weight: 600 !important;

    text-align: center !important;
}


/* =========================================================
   CODE ROW
========================================================= */

.ce-deal-card__code-row {
    display: flex !important;

    align-items: center !important;
    justify-content: space-between !important;

    width: 100% !important;

    /*
       REDUCED CODE ROW
    */
    min-height: 39px !important;

    margin: 0 !important;

    padding: 0 9px !important;

    background: #eef2f4 !important;

    border: 0 !important;
    border-radius: 9px !important;

    box-sizing: border-box !important;
}

.ce-deal-card__code {
    min-width: 0 !important;

    overflow: hidden !important;

    color: #08788f !important;

    font-size: 12px !important;
    line-height: 17px !important;

    font-weight: 700 !important;

    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}


/* =========================================================
   COPY
========================================================= */

.ce-deal-card__copy {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 27px !important;
    height: 27px !important;

    min-width: 27px !important;

    flex: 0 0 27px !important;

    margin-left: 6px !important;

    padding: 0 !important;

    background: transparent !important;

    border: 0 !important;
    border-radius: 6px !important;

    color: #e47c5d !important;

    font-size: 13px !important;

    cursor: pointer !important;
}

.ce-deal-card__copy:hover {
    background: #ffffff !important;
    color: #193494 !important;
}

.ce-deal-card__copy.is-copied {
    color: #16a34a !important;
}


/* =========================================================
   INFO
========================================================= */

.ce-deal-card__info {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    flex-wrap: wrap !important;

    gap: 6px !important;

    width: 100% !important;

    min-height: 21px !important;

    margin: 0 !important;

    padding: 4px 0 2px !important;
}

.ce-deal-card__exclusive,
.ce-deal-card__expiry {
    display: inline-flex !important;

    align-items: center !important;

    gap: 3px !important;

    color: #64748b !important;

    font-size: 7px !important;
    line-height: 11px !important;

    font-weight: 500 !important;
}

.ce-deal-card__exclusive {
    color: #a16207 !important;
}


/* =========================================================
   BUTTON
========================================================= */

.ce-deal-card__button {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    gap: 7px !important;

    width: 100% !important;

    /*
       REDUCED BUTTON
    */
    min-height: 43px !important;

    margin: auto 0 0 !important;

    padding: 0 12px !important;

    background: #193494 !important;

    border: 0 !important;
    border-radius: 9px !important;

    color: #ffffff !important;

    font-size: 17px !important;
    line-height: 1 !important;

    font-weight: 600 !important;

    text-align: center !important;

    text-decoration: none !important;

    box-sizing: border-box !important;

    cursor: pointer !important;

    transition:
        background .2s ease,
        transform .2s ease !important;
}

.ce-deal-card__button:hover {
    background: #edc540 !important;

    color: #ffffff !important;

    transform: translateY(-1px) !important;
}

.ce-deal-card__button i {
    font-size: 10px !important;
}


/* =========================================================
   CARD VARIANTS
========================================================= */

.ce-deal-card--trending {
    border-color: #193494 !important;
}

.ce-deal-card--recent {
    border-color: #16869c !important;
}


/* =========================================================
   EMPTY STATE
========================================================= */

.ce-deals-empty {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    flex-direction: column !important;

    grid-column: 1 / -1 !important;

    min-height: 180px !important;

    padding: 25px !important;

    background: #ffffff !important;

    border: 1px solid #dbe4ea !important;

    border-radius: 14px !important;

    text-align: center !important;
}

.ce-deals-empty-icon {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 42px !important;
    height: 42px !important;

    margin-bottom: 10px !important;

    border-radius: 10px !important;

    background: #fff9db !important;

    color: #ca8a04 !important;

    font-size: 16px !important;
}


/* =========================================================
   LARGE DESKTOP
========================================================= */

@media (min-width: 1600px) {

    .ce-deals-container {
        max-width: 1760px !important;

        padding-left: 32px !important;
        padding-right: 32px !important;
    }

    .ce-deals-grid {
        gap: 18px !important;
    }

}


/* =========================================================
   DESKTOP
   1200 - 1599
========================================================= */

@media (max-width: 1599px) {

    .ce-deals-grid {
        grid-template-columns:
            repeat(4, minmax(0, 1fr)) !important;
    }

}


/* =========================================================
   TABLET LANDSCAPE
   900 - 1199
========================================================= */

@media (max-width: 1199px) {

    .ce-deals-section {
        padding: 40px 0 !important;
    }

    .ce-deals-container {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .ce-deals-grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;

        gap: 16px !important;
    }

    .ce-deal-card {
        height: 305px !important;
        min-height: 305px !important;
    }

}


/* =========================================================
   TABLET
   641 - 899
========================================================= */

@media (max-width: 899px) {

    .ce-deals-header {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 12px !important;
        margin-bottom: 20px !important;
    }

    .ce-deals-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 14px !important;
    }

    .ce-deals-title {
        font-size: 25px !important;
        line-height: 31px !important;
    }

    .ce-deal-card {
        height: 305px !important;
        min-height: 305px !important;
        padding: 13px 12px 11px !important;
    }

    .ce-deal-card__logo {
        height: 61px !important;
    }

    .ce-deal-card__logo img {
        max-width: 135px !important;
    }

    .ce-deal-card__button {
        min-height: 41px !important;
        font-size: 16px !important;
    }

}


/* =========================================================
   MOBILE
   640 AND BELOW
========================================================= */

@media (max-width: 640px) {

    .ce-deals-section {
        padding: 32px 0 !important;
    }

    .ce-deals-container {
        padding-left: 13px !important;
        padding-right: 13px !important;
    }

    .ce-deals-header {
        margin-bottom: 18px !important;
    }

    .ce-deals-title {
        font-size: 23px !important;
        line-height: 29px !important;
    }

    .ce-deals-subtitle {
        font-size: 12px !important;
        line-height: 18px !important;
    }

    .ce-deals-grid {
        grid-template-columns: 1fr !important;
        gap: 13px !important;
    }

    .ce-deal-card {
        height: 295px !important;
        min-height: 295px !important;

        padding: 13px 12px 11px !important;

        border-radius: 13px !important;
    }

    .ce-deal-card__top {
        margin-bottom: 7px !important;
    }

    .ce-deal-card__used,
    .ce-deal-card__trending,
    .ce-deal-card__new,
    .ce-deal-card__deal-badge {
        min-height: 26px !important;
        padding-left: 9px !important;
        padding-right: 9px !important;
        font-size: 10px !important;
    }

    .ce-deal-card__logo {
        height: 62px !important;
    }

    .ce-deal-card__logo img {
        max-width: 145px !important;
        max-height: 62px !important;
    }

    .ce-deal-card__discount {
        font-size: 14px !important;
        line-height: 20px !important;
    }

    .ce-deal-card__code-row {
        min-height: 38px !important;
    }

    .ce-deal-card__code {
        font-size: 12px !important;
    }

    .ce-deal-card__button {
        min-height: 42px !important;
        font-size: 16px !important;
    }

}


/* =========================================================
   SMALL MOBILE
   380 AND BELOW
========================================================= */

@media (max-width: 380px) {

    .ce-deals-section {
        padding: 28px 0 !important;
    }

    .ce-deals-container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .ce-deals-title {
        font-size: 21px !important;
        line-height: 27px !important;
    }

    .ce-deal-card {
        height: 285px !important;
        min-height: 285px !important;

        padding: 12px 11px 10px !important;
    }

    .ce-deal-card__logo {
        height: 58px !important;
    }

    .ce-deal-card__logo img {
        max-width: 135px !important;
    }

    .ce-deal-card__discount {
        font-size: 13px !important;
    }

    .ce-deal-card__button {
        min-height: 40px !important;
        font-size: 15px !important;
    }

}