/**
 * Dynoments 
 * Css File: Dynoments Repeater Grid Layout
 * Description: CSS file for the Dynoments Repeater
 * Author:      Dynoments
 * Text Domain: dynoments
 */

.dm-placeholder {
    display: block;
    padding: 20px;
    background-color: #fff;
    border-radius: 3px;
    color: #bdbdbd;
    font-style: italic;
    font-size: 0.9rem;
}

.dm-repeater-grid {
    display: grid;
    grid-column-gap: var(--repeater-column-gap-desktop);
    grid-row-gap: var(--repeater-row-gap-desktop);
}

.dm-repeater-grid.dm-1 {
    grid-template-columns: minmax(0, 1fr);
}

.dm-repeater-grid.dm-2 {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.dm-repeater-grid.dm-3 {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}

.dm-repeater-grid.dm-4 {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}

.dm-repeater-grid.dm-5 {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}

.dm-repeater-grid.dm-6 {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}


/**
 *
 * Media Query for Tablet 
 *
 */

@media screen and (max-width: 768px) {
    .dm-repeater-grid {
        grid-column-gap: var(--repeater-column-gap-tablet);
        grid-row-gap: var(--repeater-row-gap-tablet);
    }
    .dm-repeater-grid.dm-tablet-1 {
        grid-template-columns: minmax(0, 1fr);
    }
    .dm-repeater-grid.dm-tablet-2 {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }
    .dm-repeater-grid.dm-tablet-3 {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    }
    .dm-repeater-grid.dm-tablet-4 {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    }
    .dm-repeater-grid.dm-tablet-5 {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    }
    .dm-repeater-grid.dm-tablet-6 {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    }
}


/**
 *
 * Media Query for Mobile 
 *
 */

@media screen and (max-width: 386px) {
    .dm-repeater-grid {
        grid-column-gap: var(--repeater-column-gap-mobile);
        grid-row-gap: var(--repeater-row-gap-mobile);
    }
    .dm-repeater-grid.dm-mobile-1 {
        grid-template-columns: minmax(0, 1fr);
    }
    .dm-repeater-grid.dm-mobile-2 {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }
    .dm-repeater-grid.dm-mobile-3 {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    }
    .dm-repeater-grid.dm-mobile-4 {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    }
    .dm-repeater-grid.dm-mobile-5 {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    }
    .dm-repeater-grid.dm-mobile-6 {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    }
}