/* Button Repeater Row Widget Styles */


/* Container */

.button-repeater-row {
    width: 100%;
    box-sizing: border-box;
}


/* Heading */

.button-repeater-row-heading {
    margin-bottom: 20px;
}


/* Buttons Container */

.button-repeater-row-buttons {
    display: flex;
    width: 100%;
}


/* Layout Types */

.button-layout-inline .button-repeater-row-buttons {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    /* Smooth scrolling on iOS */
    scrollbar-width: thin;
    /* For Firefox */
    padding-bottom: 5px;
    /* Space for scrollbar */
}

.button-layout-inline .button-repeater-row-buttons::-webkit-scrollbar {
    height: 4px;
}

.button-layout-inline .button-repeater-row-buttons::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 4px;
}

.button-layout-block .button-repeater-row-buttons {
    flex-direction: column;
}

.button-layout-wrap .button-repeater-row-buttons {
    flex-wrap: wrap;
}


/* Tablet Layout Types */

.button-layout-tablet-inline .button-repeater-row-buttons {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    padding-bottom: 5px;
}

.button-layout-tablet-inline .button-repeater-row-buttons::-webkit-scrollbar {
    height: 4px;
}

.button-layout-tablet-inline .button-repeater-row-buttons::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 4px;
}

.button-layout-tablet-block .button-repeater-row-buttons {
    flex-direction: column;
}

.button-layout-tablet-wrap .button-repeater-row-buttons {
    flex-wrap: wrap;
}


/* Mobile Layout Types */

.button-layout-mobile-inline .button-repeater-row-buttons {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    padding-bottom: 5px;
}

.button-layout-mobile-inline .button-repeater-row-buttons::-webkit-scrollbar {
    height: 4px;
}

.button-layout-mobile-inline .button-repeater-row-buttons::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 4px;
}

.button-layout-mobile-block .button-repeater-row-buttons {
    flex-direction: column;
}

.button-layout-mobile-wrap .button-repeater-row-buttons {
    flex-wrap: wrap;
}


/* Button Item */

.button-repeater-item {
    display: inline-flex;
    text-align: center;
}

.button-repeater-item-inner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.3s ease;
    width: 100%;
    box-sizing: border-box;
}


/* Button Text */

.button-text {
    display: inline-block;
}


/* Button Icons */

.button-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.button-icon svg {
    width: 1em;
    height: 1em;
}


/* Hover Animations */

.button-hover-animation-grow .button-repeater-item-inner:hover {
    transform: scale(1.05);
}

.button-hover-animation-shrink .button-repeater-item-inner:hover {
    transform: scale(0.95);
}

.button-hover-animation-pulse .button-repeater-item-inner:hover {
    animation: button-pulse 1s ease infinite;
}

.button-hover-animation-float .button-repeater-item-inner:hover {
    transform: translateY(-5px);
}

.button-hover-animation-sink .button-repeater-item-inner:hover {
    transform: translateY(5px);
}

@keyframes button-pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
    }
}


/* Responsive Styles */

@media (max-width: 1024px) {
    .button-layout-tablet-wrap .button-repeater-row-buttons {
        justify-content: center;
    }
}

@media (max-width: 767px) {
    .button-layout-wrap .button-repeater-row-buttons,
    .button-layout-mobile-wrap .button-repeater-row-buttons {
        justify-content: center;
    }
    .button-repeater-item {
        width: 100%;
        max-width: 100%;
    }
}