/* dgs Feature Card Styles - Minimal version to work with AutomaticCSS */

h2.fr-feature-card-uniform__heading.section-content__heading {
    margin: 0;
}
.fr-feature-card-uniform__accent-heading {
    margin: 0 !important;
    text-transform: uppercase;
    font-size: var(--text-xs);
    color: var(--neutral-medium);
}

/* Link wrapper - properly scoped to this block */
.wp-block-dgs-feature-card .fr-feature-card-link {
    display: block;
    text-decoration: none;
    color: inherit !important; /* Force inherit color to override theme link colors */
    cursor: pointer;
}

/* Only force paragraph text and accent heading to keep their original colors */
.wp-block-dgs-feature-card .fr-feature-card-link p:not(.fr-accent-heading-b),
.wp-block-dgs-feature-card
    .fr-feature-card-link
    .section-content__lede:not(.fr-accent-heading-b) {
    color: inherit !important;
}

.wp-block-dgs-feature-card .fr-feature-card-uniform {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 2rem;
    padding: 2rem;
    position: relative;
}

/* Content Styles */
.wp-block-dgs-feature-card .fr-feature-card-uniform__content {
    flex: 1;
    min-width: 300px;
    display: flex;
    gap: var(--space-xs);
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 4;
}

/* Spacing for the content section */
.wp-block-dgs-feature-card .section-content__lede {
    margin-bottom: var(--space-s);
}

/* Base Button styles */
.wp-block-dgs-feature-card .fr-feature-card-uniform .section-content__button {
    width: fit-content;
    min-width: auto; /* Override default min-width if any */
    display: inline-block;
    text-decoration: none;
    color: var(--white);
    padding: 0.75em var(--space-s);
    border-radius: 0;
    font-weight: var(--btn-font-weight);
    transition: var(--transition);
    border: none;
}

/* Rounded button styles */
.wp-block-dgs-feature-card .rounded-buttons .section-content__button {
    border-radius: 50px;
}

/* Media Styles */
.wp-block-dgs-feature-card .fr-feature-card-uniform__media-wrapper {
    flex: 1;
    min-width: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 2;
    border-radius: var(--radius);
}

.wp-block-dgs-feature-card .fr-feature-card-uniform__media {
    margin: 0;
    width: 100%;
    height: auto;
    border-radius: var(--radius);
    border: solid 1px var(--neutral-light);
}
@media only screen and (max-width: 768px) {
    .wp-block-dgs-feature-card .fr-feature-card-uniform__media {
        border: none;
    }
    .wp-block-dgs-feature-card .fr-feature-card-uniform__media img {
        box-shadow: none !important;
    }
}
.wp-block-dgs-feature-card .fr-feature-card-uniform__media img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: var(--radius);
    box-shadow: var(--box-shadow-1);
}

/* 
 * COLOR SCHEME STYLING 
 * Each color scheme has overlay (ultra-light) and button (base/light/dark) variants
 */

/* Background colors for Bricks container - ultra-light variants */
.brxe-container.fr-feature-card-uniform.color-scheme-action {
    background-color: var(--action-ultra-light);
}

.brxe-container.fr-feature-card-uniform.color-scheme-primary {
    background-color: var(--primary-ultra-light);
}

.brxe-container.fr-feature-card-uniform.color-scheme-accent {
    background-color: var(--accent-ultra-light);
}

.brxe-container.fr-feature-card-uniform.color-scheme-secondary {
    background-color: var(--secondary-ultra-light);
}

.brxe-container.fr-feature-card-uniform.color-scheme-neutral {
    background-color: var(--neutral-ultra-light);
}

/* Base overlay styling - always applied */
.wp-block-dgs-feature-card .fr-feature-card-uniform::after {
    content: "";
    position: absolute;
    inset: 0;
    cursor: pointer !important;
    display: block;
    z-index: 1;
    border-radius: var(--radius, 1rem);
    height: 80%;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
}

/* ACTION COLOR SCHEME */
.wp-block-dgs-feature-card .color-scheme-action::after {
    background-color: var(--action-ultra-light);
}

.wp-block-dgs-feature-card .color-scheme-action.color-variant-base .section-content__button {
    background-color: var(--action);
    color: var(--white);
}
.wp-block-dgs-feature-card .color-scheme-action.color-variant-base .section-content__button:hover {
    background-color: var(--action-dark);
}

.wp-block-dgs-feature-card .color-scheme-action.color-variant-light .section-content__button {
    background-color: var(--action-light);
    color: var(--black);
}
.wp-block-dgs-feature-card .color-scheme-action.color-variant-light .section-content__button:hover {
    background-color: var(--action);
    color: var(--white);
}

.wp-block-dgs-feature-card .color-scheme-action.color-variant-dark .section-content__button {
    background-color: var(--action-dark);
    color: var(--white);
}
.wp-block-dgs-feature-card .color-scheme-action.color-variant-dark .section-content__button:hover {
    background-color: var(--action-light);
    color: var(--action-ultra-dark);
}

/* PRIMARY COLOR SCHEME */
.wp-block-dgs-feature-card .color-scheme-primary::after {
    background-color: var(--primary-ultra-light);
}

.wp-block-dgs-feature-card .color-scheme-primary.color-variant-base .section-content__button {
    background-color: var(--primary);
    color: var(--white);
}
.wp-block-dgs-feature-card .color-scheme-primary.color-variant-base .section-content__button:hover {
    background-color: var(--primary-dark);
}

.wp-block-dgs-feature-card .color-scheme-primary.color-variant-light .section-content__button {
    background-color: var(--primary-light);
    color: var(--black);
}
.wp-block-dgs-feature-card .color-scheme-primary.color-variant-light .section-content__button:hover {
    background-color: var(--primary);
    color: var(--white);
}

.wp-block-dgs-feature-card .color-scheme-primary.color-variant-dark .section-content__button {
    background-color: var(--primary-dark);
    color: var(--white);
}
.wp-block-dgs-feature-card .color-scheme-primary.color-variant-dark .section-content__button:hover {
    background-color: var(--primary-light);
    color: var(--primary-ultra-dark);
}

/* ACCENT COLOR SCHEME (Default) */
.wp-block-dgs-feature-card .color-scheme-accent::after {
    background-color: var(--accent-ultra-light);
}

.wp-block-dgs-feature-card .color-scheme-accent.color-variant-base .section-content__button {
    background-color: var(--accent);
    border: none;
    color: var(--white);
}
.wp-block-dgs-feature-card .color-scheme-accent.color-variant-base .section-content__button:hover {
    background-color: var(--accent-dark);
}

.wp-block-dgs-feature-card .color-scheme-accent.color-variant-light .section-content__button {
    background-color: var(--accent-light);
    color: var(--black);
}
.wp-block-dgs-feature-card .color-scheme-accent.color-variant-light .section-content__button:hover {
    background-color: var(--accent);
    color: var(--white);
}

.wp-block-dgs-feature-card .color-scheme-accent.color-variant-dark .section-content__button {
    background-color: var(--accent-dark);
    color: var(--white);
}
.wp-block-dgs-feature-card .color-scheme-accent.color-variant-dark .section-content__button:hover {
    background-color: var(--accent-light);
    color: var(--accent-ultra-dark);
}

/* SECONDARY COLOR SCHEME */
.wp-block-dgs-feature-card .color-scheme-secondary::after {
    background-color: var(--secondary-ultra-light);
}

.wp-block-dgs-feature-card .color-scheme-secondary.color-variant-base .section-content__button {
    background-color: var(--secondary);
    color: var(--white);
}
.wp-block-dgs-feature-card .color-scheme-secondary.color-variant-base .section-content__button:hover {
    background-color: var(--secondary-dark);
}

.wp-block-dgs-feature-card .color-scheme-secondary.color-variant-light .section-content__button {
    background-color: var(--secondary-light);
    color: var(--black);
}
.wp-block-dgs-feature-card .color-scheme-secondary.color-variant-light .section-content__button:hover {
    background-color: var(--secondary);
    color: var(--white);
}

.wp-block-dgs-feature-card .color-scheme-secondary.color-variant-dark .section-content__button {
    background-color: var(--secondary-dark);
    color: var(--white);
}
.wp-block-dgs-feature-card .color-scheme-secondary.color-variant-dark .section-content__button:hover {
    background-color: var(--secondary-light);
    color: var(--secondary-ultra-dark);
}

/* NEUTRAL COLOR SCHEME */
.wp-block-dgs-feature-card .color-scheme-neutral::after {
    background-color: var(--neutral-ultra-light);
}

.wp-block-dgs-feature-card .color-scheme-neutral.color-variant-base .section-content__button {
    background-color: var(--neutral);
    color: var(--white);
}
.wp-block-dgs-feature-card .color-scheme-neutral.color-variant-base .section-content__button:hover {
    background-color: var(--neutral-dark);
}

.wp-block-dgs-feature-card .color-scheme-neutral.color-variant-light .section-content__button {
    background-color: var(--neutral-light);
    color: var(--black);
}
.wp-block-dgs-feature-card .color-scheme-neutral.color-variant-light .section-content__button:hover {
    background-color: var(--neutral);
    color: var(--white);
}

.wp-block-dgs-feature-card .color-scheme-neutral.color-variant-dark .section-content__button {
    background-color: var(--neutral-dark);
    color: var(--white);
}
.wp-block-dgs-feature-card .color-scheme-neutral.color-variant-dark .section-content__button:hover {
    background-color: var(--neutral-light);
    color: var(--neutral-ultra-dark);
}

/* Ensure the editor also shows overlays */
.editor-styles-wrapper
    .wp-block-dgs-feature-card
    .fr-feature-card-uniform::after,
.block-editor-block-list__block
    .wp-block-dgs-feature-card
    .fr-feature-card-uniform::after {
    content: "";
    display: block !important;
}

/* Order for different layouts - scoped to this block */
.wp-block-dgs-feature-card .order-1 {
    order: 1;
}

.wp-block-dgs-feature-card .order-2 {
    order: 2;
}

/* Responsive adjustments */
@media (max-width: 767px) {
    .wp-block-dgs-feature-card .fr-feature-card-uniform {
        flex-direction: column;
        padding-left: var(--space-m);
        padding-right: var(--space-m);
    }

    .wp-block-dgs-feature-card .order-1,
    .wp-block-dgs-feature-card .order-2 {
        order: unset;
    }

    .wp-block-dgs-feature-card .fr-feature-card-uniform__media-wrapper {
        margin-top: 1rem;
    }

    /* Center text elements on mobile */
    .wp-block-dgs-feature-card .fr-feature-card-uniform__content {
        text-align: center;
        align-items: center;
    }

    .wp-block-dgs-feature-card .fr-feature-card-uniform__heading,
    .wp-block-dgs-feature-card .fr-feature-card-uniform__accent-heading,
    .wp-block-dgs-feature-card .fr-feature-card-uniform__lede {
        text-align: center;
    }

    /* Make overlay full height on mobile */
    .wp-block-dgs-feature-card .fr-feature-card-uniform::after {
        height: 100%;
    }

    /* Change image object-fit to contain on mobile */
    .wp-block-dgs-feature-card .fr-feature-card-uniform__media img {
        object-fit: contain;
    }
}

/* Editor Specific Styles */
.blockstudio-element__placeholder {
    padding: 2rem;
    background-color: #f0f0f0;
    text-align: center;
    border: 2px dashed #ccc;
    color: #666;
}

.blockstudio-preview {
    padding: 1rem;
    background-color: #f0f0f0;
    text-align: center;
}

/* Disable pointer events in the editor to prevent accidental navigation */
body.block-editor-page .wp-block-dgs-feature-card .fr-feature-card-link,
.block-editor-block-list__block
    .wp-block-dgs-feature-card
    .fr-feature-card-link,
.editor-styles-wrapper .wp-block-dgs-feature-card .fr-feature-card-link {
    pointer-events: none !important;
}

/* Re-enable pointer events for the button to keep it interactive in the editor */
body.block-editor-page .wp-block-dgs-feature-card .section-content__button,
.block-editor-block-list__block
    .wp-block-dgs-feature-card
    .section-content__button,
.editor-styles-wrapper .wp-block-dgs-feature-card .section-content__button {
    pointer-events: auto !important;
}