/**
 * Equal Height for Elementor - Styles
 * Version: 1.0.0
 */

/* Ensure smooth transitions when heights change */
[data-ehe-enabled="true"] .elementor-widget,
[data-ehe-enabled="true"] .elementor-column,
[data-ehe-enabled="true"] .e-con {
    transition: height 0.3s ease;
}

/* When containers mode is active, make child containers use flexbox */
/* This auto-aligns buttons to bottom */
[data-ehe-enabled="true"][data-ehe-apply-to="containers"] > .e-con-inner > .e-con {
    display: flex !important;
    flex-direction: column !important;
}

/* Push button widgets to bottom in flexbox containers */
[data-ehe-enabled="true"][data-ehe-apply-to="containers"] .elementor-widget-button {
    margin-top: auto !important;
}

/* Same for columns mode */
[data-ehe-enabled="true"][data-ehe-apply-to="columns"] > .e-con-inner > .e-con,
[data-ehe-enabled="true"][data-ehe-apply-to="columns"] > .elementor-container > .elementor-column {
    display: flex !important;
    flex-direction: column !important;
}

[data-ehe-enabled="true"][data-ehe-apply-to="columns"] .elementor-widget-button {
    margin-top: auto !important;
}

/* Prevent layout shift during height calculations */
[data-ehe-enabled="true"] {
    position: relative;
}

/* Optional: Add a data attribute indicator in Elementor editor */
.elementor-editor-active [data-ehe-enabled="true"]::before {
    content: '⚖️ Equal Height Active';
    position: absolute;
    top: -20px;
    left: 0;
    font-size: 10px;
    background: #93003c;
    color: white;
    padding: 2px 8px;
    border-radius: 3px;
    z-index: 9999;
    pointer-events: none;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}