/* ============================================================
   GREAT OFFERS CAROUSEL - COMPLETE REBUILD CSS
   Clean, minimal CSS to ensure Owl Carousel v1 works correctly
   ============================================================ */

/* Reset everything for Great Offers carousel */
.great-offers-wrapper {
    width: 100% !important;
    position: relative !important;
    overflow: hidden !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* Carousel container - center and constrain viewport */
.great-offers-wrapper .owl-carousel {
    width: 100% !important;
    max-width: 1170px !important;
    margin: 0 auto !important;
    display: block !important;
}

/* Stage outer - visible viewport (4 cards) */
.great-offers-wrapper .owl-stage-outer {
    width: 100% !important;
    max-width: 1170px !important;
    margin: 0 auto !important;
    overflow: hidden !important;
    position: relative !important;
}

/* Wrapper outer - can expand beyond viewport */
.great-offers-wrapper .owl-wrapper-outer {
    width: auto !important;
    max-width: none !important;
    position: relative !important;
    overflow: visible !important;
}

/* Owl wrapper — NEVER width:auto on homepage deals strip (#homepage-great-offers-carousel): overrides Owl inline width and wraps floats into ~3 columns × N rows */
.great-offers-wrapper ul.owl-carousel:not(#homepage-great-offers-carousel) .owl-wrapper {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    position: relative !important;
    display: block !important;
    /* CRITICAL: Owl uses float layout, not flex */
    overflow: visible !important;
}

/* Owl stage - block for float layout */
.great-offers-wrapper .owl-stage {
    display: block !important;
    width: auto !important;
    position: relative !important;
}

/* Owl items — float only. NEVER width:auto!important: it overrides Owl v1’s inline slide widths and stacks huge full-width cards. */
.great-offers-wrapper .owl-item {
    float: left !important;
    display: block !important;
    position: relative !important;
    min-width: 0 !important;
    clear: none !important; /* CRITICAL: Don't clear floats */
}

/* CRITICAL: Ensure wrapper doesn't collapse with floats */
.great-offers-wrapper .owl-wrapper::after {
    content: "" !important;
    display: block !important;
    clear: both !important;
    visibility: hidden !important;
    height: 0 !important;
}

/* Ensure items inside are properly sized */
.great-offers-wrapper .owl-item .item {
    width: 100% !important;
    display: block !important;
}

/* Remove any conflicting rules */
.great-offers-wrapper .owl-item * {
    box-sizing: border-box !important;
}

/* Navigation arrows */
.great-offers-wrapper .owl-controls {
    position: relative !important;
    margin-top: 20px !important;
}

.great-offers-wrapper .owl-buttons {
    position: absolute !important;
    top: 50% !important;
    width: 100% !important;
    margin-top: -20px !important;
}

.great-offers-wrapper .owl-prev,
.great-offers-wrapper .owl-next {
    position: absolute !important;
    cursor: pointer !important;
    z-index: 10 !important;
}

.great-offers-wrapper .owl-prev {
    left: -50px !important;
}

.great-offers-wrapper .owl-next {
    right: -50px !important;
}

