.pgbg-gallery {
    width: 100%;
    max-width: 100%;
}

.pgbg-stage {
    width: 100% !important;
    /* column width (875px) */
    height: var(--pgbg-image-height, 520px) !important;
    overflow: hidden;
    border-radius: 0px;
    position: relative;
}

.pgbg-track {
    display: flex !important;
    height: 100%;
    gap: var(--pgbg-slide-gap, 17px);
    will-change: transform;
    transform: translate3d(0, 0, 0);
    transition: transform 350ms ease;
}

.pgbg-slide {
    flex: 0 0 var(--pgbg-slide-width, 632px);
    /* IMPORTANT */
    height: 100%;
    display: block;
    /* no centering */
}

.pgbg-img {
    width: 100%;
    height: 100%;
    object-fit: var(--pgbg-object-fit, cover);
    display: block;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.pgbg-arrows {
    display: flex;
    justify-content: var(--pgbg-arrows-justify, flex-end);
    gap: var(--pgbg-arrows-gap, 12px);
    margin: var(--pgbg-arrows-margin, 0px);
    padding: var(--pgbg-arrows-padding, 0px);
    margin-top: 12px;
    width: 632px;
}

.pgbg-arrow {
    display: grid;
    place-items: center;
    cursor: pointer;
    transition: transform 120ms ease, box-shadow 120ms ease;
    justify-content: center;
}

.pgbg-arrow svg {
    color: #0E1D3F;
}

.pgbg-arrow:active {
    transform: translateY(0px);
}

.pgbg-arrow-icon {
    width: var(--pgbg-icon-width, 28px);
    height: var(--pgbg-icon-height, 28px);
    display: block;
}

/* --- Arrow buttons (make sure they never collapse) --- */
.pgbg-gallery .pgbg-arrows {
    display: flex;
    justify-content: var(--pgbg-arrows-justify, flex-end);
    gap: var(--pgbg-arrows-gap, 12px);
    margin: var(--pgbg-arrows-margin, 0);
    padding: var(--pgbg-arrows-padding, 0);
}

.pgbg-gallery .pgbg-arrow {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    border: none;
    cursor: pointer;
    padding: 0 !important;
    line-height: 1;
    box-shadow: none;
}

/* --- The actual icon (force size) --- */
.pgbg-gallery .pgbg-arrow .pgbg-arrow-icon {
    width: var(--pgbg-icon-width, 20px) !important;
    height: var(--pgbg-icon-height, 18px) !important;
    max-width: none !important;
    /* prevents theme max-width:100% weirdness */
    display: block !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.pgbg-arrows button:hover {
    border: none !important;
}

.pgbg-arrows button {
    border: none !important;
}