/**
 * FINAL GALLERY GRID FIX - HIGHEST PRIORITY
 * This file has the highest specificity to override any conflicting styles
 */

/* Container reset with highest specificity */
body .atf-tour-grid .row {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-left: -15px !important;
    margin-right: -15px !important;
    align-items: stretch !important;
}

/* Grid items with maximum specificity */
body .atf-tour-grid .row .grid-item,
body .atf-tour-grid .row .col-lg-4,
body .atf-tour-grid .row .col-md-6,
body .atf-tour-grid .row .col-12 {
    display: flex !important;
    flex-direction: column !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    margin-bottom: 30px !important;
    box-sizing: border-box !important;
}

/* FINAL RESPONSIVE RULES - CANNOT BE OVERRIDDEN */

/* Large screens: EXACTLY 3 columns */
@media screen and (min-width: 992px) {
    body .atf-tour-grid .row .grid-item,
    body .atf-tour-grid .row .col-lg-4,
    body .atf-tour-grid .row .col-md-6,
    body .atf-tour-grid .row .col-12,
    body .atf-tour-grid .row [class*="col-"] {
        flex: 0 0 33.333333% !important;
        max-width: 33.333333% !important;
        width: 33.333333% !important;
        min-width: 0 !important;
    }
}

/* Medium screens: EXACTLY 2 columns */
@media screen and (min-width: 768px) and (max-width: 991.98px) {
    body .atf-tour-grid .row .grid-item,
    body .atf-tour-grid .row .col-lg-4,
    body .atf-tour-grid .row .col-md-6,
    body .atf-tour-grid .row .col-12,
    body .atf-tour-grid .row [class*="col-"] {
        flex: 0 0 50% !important;
        max-width: 50% !important;
        width: 50% !important;
        min-width: 0 !important;
    }
}

/* Small screens: EXACTLY 1 column */
@media screen and (max-width: 767.98px) {
    body .atf-tour-grid .row .grid-item,
    body .atf-tour-grid .row .col-lg-4,
    body .atf-tour-grid .row .col-md-6,
    body .atf-tour-grid .row .col-12,
    body .atf-tour-grid .row [class*="col-"] {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
        min-width: 0 !important;
    }
}

/* Portfolio container standardization */
body .atf-tour-grid .atf-single-portfolio {
    height: 320px !important;
    width: 100% !important;
    position: relative !important;
    overflow: hidden !important;
    border-radius: 12px !important;
    background: #fff !important;
}

/* Image standardization */
body .atf-tour-grid .atf-single-portfolio img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    border: none !important;
    outline: none !important;
}

/* Responsive heights */
@media screen and (max-width: 1199.98px) {
    body .atf-tour-grid .atf-single-portfolio {
        height: 280px !important;
    }
}

@media screen and (max-width: 991.98px) {
    body .atf-tour-grid .atf-single-portfolio {
        height: 260px !important;
    }
}

@media screen and (max-width: 767.98px) {
    body .atf-tour-grid .atf-single-portfolio {
        height: 300px !important;
    }
}

/* Override any conflicting flex or grid properties */
body .atf-tour-grid .row .grid-item {
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
}

/* Debug mode - uncomment to see column borders */
/*
.atf-tour-grid .grid-item {
    border: 2px solid red !important;
}
.atf-tour-grid .grid-item::after {
    content: 'Col width: ' attr(style);
    position: absolute;
    top: 10px;
    left: 10px;
    background: rgba(0,0,0,0.8);
    color: white;
    padding: 5px;
    font-size: 12px;
    z-index: 1000;
}
*/