/* CSS styles for Detalles DTF Duo block */

.dtf-duo-container {
    background-repeat: no-repeat;
    transition: all 0.3s ease;
}

/* Adjustments for WordPress Gutenberg editor wrapper */
.dtf-duo-block-admin {
    width: 100%;
    margin-bottom: 20px;
}

/* Remove Gutenberg core block margins and padding inside the footer to make it slim */
.wp-block-theme-dtf-store-detalles-dtf-duo-footer,
[data-type="theme-dtf-store/detalles-dtf-duo-footer"] {
    min-height: 50px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
    width: 100% !important;
}

/* Editor specific flex layout support */
.wp-block-theme-dtf-store-detalles-dtf-duo-footer .block-editor-block-list__layout,
[data-type="theme-dtf-store/detalles-dtf-duo-footer"] .block-editor-block-list__layout {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
}

.wp-block-theme-dtf-store-detalles-dtf-duo-footer p,
.wp-block-theme-dtf-store-detalles-dtf-duo-footer .wp-block-paragraph,
[data-type="theme-dtf-store/detalles-dtf-duo-footer"] p,
[data-type="theme-dtf-store/detalles-dtf-duo-footer"] .wp-block-paragraph {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    line-height: 1.25 !important;
}

/* Custom formatting for the features columns in the footer */
.wp-block-theme-dtf-store-detalles-dtf-duo-footer .dtf-features-cols,
[data-type="theme-dtf-store/detalles-dtf-duo-footer"] .dtf-features-cols {
    display: flex !important;
    gap: 0 !important;
    width: auto !important;
    margin: 0 !important;
}

.wp-block-theme-dtf-store-detalles-dtf-duo-footer .dtf-features-cols > .wp-block-column,
[data-type="theme-dtf-store/detalles-dtf-duo-footer"] .dtf-features-cols > .wp-block-column {
    border-left: 1px solid rgba(255, 255, 255, 0.25) !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    min-width: 90px !important;
    flex: 1 1 auto !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.wp-block-theme-dtf-store-detalles-dtf-duo-footer .dtf-features-cols > .wp-block-column:first-child,
[data-type="theme-dtf-store/detalles-dtf-duo-footer"] .dtf-features-cols > .wp-block-column:first-child {
    border-left: none !important;
}

/* Style for button outline to look white when inside the orange footer */
.wp-block-theme-dtf-store-detalles-dtf-duo-footer .wp-block-button.is-style-outline .wp-block-button__link {
    border-color: currentColor !important;
    color: currentColor !important;
    background-color: transparent !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    padding: 10px 22px !important;
    border-width: 2px !important;
    border-radius: 9999px !important;
}

.wp-block-theme-dtf-store-detalles-dtf-duo-footer .wp-block-image,
[data-type="theme-dtf-store/detalles-dtf-duo-footer"] .wp-block-image {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.dtf-duo-wrapper {
    display: block;
    width: 100%;
}

.wp-block-theme-dtf-store-detalles-dtf-duo-zoom,
[data-type="theme-dtf-store/detalles-dtf-duo-zoom"] {
    margin-left: auto !important;
    max-width: 320px !important;
}

.wp-block-theme-dtf-store-detalles-dtf-duo-zoom:not(.has-background),
[data-type="theme-dtf-store/detalles-dtf-duo-zoom"]:not(.has-background) {
    background-color: #ffffff !important;
}

.wp-block-theme-dtf-store-detalles-dtf-duo-zoom:not(.has-text-color),
[data-type="theme-dtf-store/detalles-dtf-duo-zoom"]:not(.has-text-color) {
    color: #1e293b !important;
}

.wp-block-theme-dtf-store-detalles-dtf-duo-zoom p,
.wp-block-theme-dtf-store-detalles-dtf-duo-zoom .wp-block-paragraph,
[data-type="theme-dtf-store/detalles-dtf-duo-zoom"] p,
[data-type="theme-dtf-store/detalles-dtf-duo-zoom"] .wp-block-paragraph {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    line-height: 1.35 !important;
}

.wp-block-theme-dtf-store-detalles-dtf-duo-zoom p:not(:last-child),
[data-type="theme-dtf-store/detalles-dtf-duo-zoom"] p:not(:last-child) {
    margin-bottom: 6px !important;
}

.wp-block-theme-dtf-store-detalles-dtf-duo-zoom .wp-block-image,
[data-type="theme-dtf-store/detalles-dtf-duo-zoom"] .wp-block-image {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
}

.dtf-duo-container {
    background-repeat: no-repeat;
    transition: all 0.3s ease;
    container-type: inline-size !important;
    container-name: dtfcard !important;
}

.wp-block-theme-dtf-store-detalles-dtf-duo-zoom .wp-block-image img,
[data-type="theme-dtf-store/detalles-dtf-duo-zoom"] .wp-block-image img {
    border-radius: 12px !important;
    width: 100% !important;
}

/* Force footer to always be in a single row without wrapping */
.wp-block-theme-dtf-store-detalles-dtf-duo-footer,
[data-type="theme-dtf-store/detalles-dtf-duo-footer"] {
    flex-wrap: nowrap !important;
    overflow: hidden !important;
    gap: 12px !important;
}

.wp-block-theme-dtf-store-detalles-dtf-duo-footer .block-editor-block-list__layout,
[data-type="theme-dtf-store/detalles-dtf-duo-footer"] .block-editor-block-list__layout {
    flex-wrap: nowrap !important;
    gap: 12px !important;
}

/* Container Queries for Adaptive Faldon Scaling */
@container dtfcard (max-width: 750px) {
    .wp-block-theme-dtf-store-detalles-dtf-duo-footer .dtf-features-cols > .wp-block-column,
    [data-type="theme-dtf-store/detalles-dtf-duo-footer"] .dtf-features-cols > .wp-block-column {
        padding-left: 8px !important;
        padding-right: 8px !important;
        min-width: 60px !important;
    }
    .wp-block-theme-dtf-store-detalles-dtf-duo-footer p,
    [data-type="theme-dtf-store/detalles-dtf-duo-footer"] p {
        font-size: 10px !important;
    }
}

@container dtfcard (max-width: 620px) {
    /* Limit the button size so it shrinks gracefully and doesn't push elements out */
    .wp-block-theme-dtf-store-detalles-dtf-duo-footer .wp-block-button__link,
    [data-type="theme-dtf-store/detalles-dtf-duo-footer"] .wp-block-button__link {
        max-width: 130px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 10px !important;
        padding: 8px 12px !important;
    }
    .wp-block-theme-dtf-store-detalles-dtf-duo-footer .wp-block-image img,
    [data-type="theme-dtf-store/detalles-dtf-duo-footer"] .wp-block-image img {
        max-width: 80px !important;
    }
    .wp-block-theme-dtf-store-detalles-dtf-duo-footer .dtf-features-cols > .wp-block-column,
    [data-type="theme-dtf-store/detalles-dtf-duo-footer"] .dtf-features-cols > .wp-block-column {
        padding-left: 6px !important;
        padding-right: 6px !important;
        min-width: 50px !important;
    }
}

@container dtfcard (max-width: 480px) {
    /* Hide the button text completely, leaving only the arrow */
    .wp-block-theme-dtf-store-detalles-dtf-duo-footer .wp-block-button__link,
    [data-type="theme-dtf-store/detalles-dtf-duo-footer"] .wp-block-button__link {
        max-width: 36px !important;
        padding: 8px !important;
        text-align: center !important;
        text-indent: -9999px !important; /* Hide text nodes */
        display: inline-block !important;
        position: relative !important;
    }
    /* Render a clean absolute arrow instead of text */
    .wp-block-theme-dtf-store-detalles-dtf-duo-footer .wp-block-button__link::before,
    [data-type="theme-dtf-store/detalles-dtf-duo-footer"] .wp-block-button__link::before {
        content: "→" !important;
        text-indent: 0 !important;
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        font-size: 16px !important;
        font-weight: bold !important;
        text-align: center !important;
    }
    .wp-block-theme-dtf-store-detalles-dtf-duo-footer .wp-block-image img,
    [data-type="theme-dtf-store/detalles-dtf-duo-footer"] .wp-block-image img {
        max-width: 65px !important;
    }
    /* Hide labels from features columns, showing only stars/icons */
    .wp-block-theme-dtf-store-detalles-dtf-duo-footer .dtf-features-cols p,
    [data-type="theme-dtf-store/detalles-dtf-duo-footer"] .dtf-features-cols p {
        height: 18px !important;
        overflow: hidden !important;
        font-size: 14px !important;
        line-height: 1 !important;
    }
    .wp-block-theme-dtf-store-detalles-dtf-duo-footer .dtf-features-cols > .wp-block-column,
    [data-type="theme-dtf-store/detalles-dtf-duo-footer"] .dtf-features-cols > .wp-block-column {
        min-width: 30px !important;
    }
}

/* Enforcement of default image widths for templates to avoid Gutenberg validation errors */
.wp-block-theme-dtf-store-detalles-dtf-duo-body .wp-block-image img,
[data-type="theme-dtf-store/detalles-dtf-duo-body"] .wp-block-image img {
    max-width: 180px !important;
    height: auto !important;
}

.wp-block-theme-dtf-store-detalles-dtf-duo-footer .wp-block-image img,
[data-type="theme-dtf-store/detalles-dtf-duo-footer"] .wp-block-image img {
    max-width: 105px !important;
    height: auto !important;
}