/**
 * 小部件共享样式 · 手机端 Elementor 容器兜底
 * 源码 Luckilyring.html 使用 `grid-cols-1 md:grid-cols-2` 原生响应。
 * Elementor e-flex 父容器默认 row 方向，不会自动切 column，因此这里：
 *   1. 用 :has() 识别任何装载本主题小部件的 e-parent 容器
 *   2. 在 <768px 强制改为纵向堆叠、子容器 100% 宽
 *   3. 作为最高优先级（全局 !important）兜底，覆盖 Elementor 默认内联变量
 */

/* ================= 手机端：任何装载本主题小部件的 Elementor 父容器自动竖排 ================= */
@media (max-width: 767px) {

    /* 标识：任何 e-parent / e-con-boxed 若其中包含本主题 widget，视为需要堆叠的"两列区块" */
    .e-con.e-parent:has(.gt-ll),
    .e-con.e-parent:has(.gt-stars),
    .e-con.e-parent:has(.gt-bc),
    .e-con.e-parent:has(.gt-ac),
    .e-con.e-parent:has(.gt-ic),
    .e-con.e-parent:has(.gt-works),
    .e-con.e-parent:has(.gt-news),
    .e-con.e-parent:has(.gt-bn),
    .e-con.e-parent:has(.gt-imgbdg),
    .e-con.e-parent:has(.gt-pgal),
    .e-con.e-parent:has(.gt-pinfo),
    .e-con.e-parent:has(.gt-cta) {
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        --direction: column;
        --width: 100%;
    }

    /* 子容器：占满宽度，避免被设置为 50% 导致并排 */
    .e-con.e-parent:has(.gt-ll) > .e-con.e-child,
    .e-con.e-parent:has(.gt-stars) > .e-con.e-child,
    .e-con.e-parent:has(.gt-bc) > .e-con.e-child,
    .e-con.e-parent:has(.gt-ac) > .e-con.e-child,
    .e-con.e-parent:has(.gt-ic) > .e-con.e-child,
    .e-con.e-parent:has(.gt-works) > .e-con.e-child,
    .e-con.e-parent:has(.gt-news) > .e-con.e-child,
    .e-con.e-parent:has(.gt-bn) > .e-con.e-child,
    .e-con.e-parent:has(.gt-imgbdg) > .e-con.e-child,
    .e-con.e-parent:has(.gt-pgal) > .e-con.e-child,
    .e-con.e-parent:has(.gt-pinfo) > .e-con.e-child,
    .e-con.e-parent:has(.gt-cta) > .e-con.e-child {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        --width: 100%;
    }

    /* widget 本身：占满父容器，防止某些外层主题 CSS 限定最大宽 */
    .elementor-widget:has(.gt-ll),
    .elementor-widget:has(.gt-stars),
    .elementor-widget:has(.gt-bc),
    .elementor-widget:has(.gt-ac),
    .elementor-widget:has(.gt-ic),
    .elementor-widget:has(.gt-works),
    .elementor-widget:has(.gt-news),
    .elementor-widget:has(.gt-bn),
    .elementor-widget:has(.gt-imgbdg),
    .elementor-widget:has(.gt-pgal),
    .elementor-widget:has(.gt-pinfo),
    .elementor-widget:has(.gt-cta) {
        width: 100%;
        max-width: 100%;
    }
}

/* ================= 不支持 :has() 的老旧浏览器兜底：通用移动栈 ================= */
/* 对整页 .e-parent 容器，若屏幕 <480px 强制竖排 —— 这是最保守的安全方案，
 * 只在超窄屏触发，桌面 & 平板不受影响 */
@supports not selector(:has(*)) {
    @media (max-width: 480px) {
        .elementor-element.e-con.e-parent.e-flex {
            flex-direction: column !important;
        }
        .elementor-element.e-con.e-parent.e-flex > .e-con.e-child {
            width: 100% !important;
        }
    }
}