/**
 * FORCE SEVEN COLUMNS CSS
 * Highest specificity to override all conflicts
 */

/* FORCE 7 columns with maximum specificity */
html body .gallery-pro-container .gallery-pro-grid[data-columns="7"] {
    grid-template-columns: repeat(7, 1fr) !important;
    column-count: 7 !important;
}

/* Specific for masonry layout */
html body .gallery-pro-container.gallery-masonry-layout .gallery-pro-grid[data-columns="7"] {
    column-count: 7 !important;
    column-gap: 15px !important;
}

/* Force flexbox layout for masonry */
html body .gallery-pro-container.gallery-masonry-layout .gallery-pro-grid[data-columns="7"] {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
}

/* Force item widths for masonry với flexbox */
html body .gallery-pro-container.gallery-masonry-layout .gallery-pro-grid[data-columns="7"] .gallery-pro-item {
    /* 7 cột với gap 15px: (100% - 90px) / 7 */
    flex: 0 0 calc((100% - 90px) / 7) !important;
    width: calc((100% - 90px) / 7) !important;
    box-sizing: border-box !important;
    margin-bottom: 0 !important;
    break-inside: avoid !important;
}

/* Override ALL responsive rules for 7 columns */
@media (min-width: 1px) {
    html body .gallery-pro-container .gallery-pro-grid[data-columns="7"] {
        grid-template-columns: repeat(7, 1fr) !important;
        column-count: 7 !important;
    }
    
    html body .gallery-pro-container.gallery-masonry-layout .gallery-pro-grid[data-columns="7"] .gallery-pro-item {
        width: calc(14.28571% - 15px) !important;
    }
}

/* Even higher specificity with ID selector */
#page .gallery-pro-container .gallery-pro-grid[data-columns="7"],
#content .gallery-pro-container .gallery-pro-grid[data-columns="7"],
.entry-content .gallery-pro-container .gallery-pro-grid[data-columns="7"],
.post-content .gallery-pro-container .gallery-pro-grid[data-columns="7"] {
    grid-template-columns: repeat(7, 1fr) !important;
    column-count: 7 !important;
}

/* Masonry with ID selectors */
#page .gallery-pro-container.gallery-masonry-layout .gallery-pro-grid[data-columns="7"] .gallery-pro-item,
#content .gallery-pro-container.gallery-masonry-layout .gallery-pro-grid[data-columns="7"] .gallery-pro-item,
.entry-content .gallery-pro-container.gallery-masonry-layout .gallery-pro-grid[data-columns="7"] .gallery-pro-item,
.post-content .gallery-pro-container.gallery-masonry-layout .gallery-pro-grid[data-columns="7"] .gallery-pro-item {
    width: calc(14.28571% - 15px) !important;
    margin-bottom: 15px !important;
}

/* Debug mode to visualize columns */
.debug-seven-columns .gallery-pro-grid[data-columns="7"] {
    outline: 3px solid red !important;
    position: relative !important;
}

.debug-seven-columns .gallery-pro-grid[data-columns="7"]:before {
    content: "FORCING 7 COLUMNS";
    position: absolute;
    top: -40px;
    left: 0;
    background: red;
    color: white;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: bold;
    z-index: 9999;
}

.debug-seven-columns .gallery-pro-grid[data-columns="7"] .gallery-pro-item {
    outline: 1px solid blue !important;
}

/* Force override theme conflicts */
.gallery-pro-grid[data-columns="7"] {
    display: block !important; /* For masonry */
}

.gallery-pro-grid[data-columns="7"]:not(.masonry) {
    display: grid !important; /* For grid */
}

/* Disable conflicting responsive breakpoints */
@media (max-width: 9999px) {
    .gallery-pro-grid[data-columns="7"]:not(.force-responsive) {
        grid-template-columns: repeat(7, 1fr) !important;
        column-count: 7 !important;
    }
    
    .gallery-masonry-layout .gallery-pro-grid[data-columns="7"]:not(.force-responsive) {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 15px !important;
    }
    
    .gallery-masonry-layout .gallery-pro-grid[data-columns="7"]:not(.force-responsive) .gallery-pro-item {
        flex: 0 0 calc((100% - 90px) / 7) !important;
        width: calc((100% - 90px) / 7) !important;
        box-sizing: border-box !important;
    }
} 