/*透明內距*/
.bt-tr a,.bt-ok a,.bt-ok-l a{padding: var(--space-15) var(--space-40) var(--space-18) var(--space-40);}
.bt-tr .elementor-button-icon,.bt-ok .elementor-button-icon,.bt-ok-l .elementor-button-icon{transform:translateY(1px);}
.bt-tr .elementor-button-content-wrapper,.bt-ok .elementor-button-content-wrapper,.bt-ok-l .elementor-button-content-wrapper{gap:var(--space-20)!important;}
.bt-tr svg,.bt-ok svg,.bt-ok-l svg{width: 0.84em!important;transform:  translateX(1px);}
.bt-tr a:hover svg,.bt-ok a:hover svg,.bt-ok-l a:hover svg{transform: translateX(5px);}

/*透明按鈕*/
.bt-tr .elementor-button {
        background-color: #ffffff1f !important;
        border: 1px solid white !important;
        border-radius: 99px !important;
        color: white !important;
        box-shadow: inset 3px 5px 10px rgba(255, 255, 255, 0.3) !important;
        transition: all 0.3s ease;
    }
    .bt-tr .elementor-button svg {
        fill: white !important;
    }
    .bt-tr .elementor-button:hover {
        box-shadow: inset 0 0 15px rgba(255, 255, 255, 0.8) !important;
        text-shadow: 0 0 5px rgba(255, 255, 255, 0.5);
    }

/*頁面內選單按鈕*/
.insitemenu a{
    border: 1px solid var( --e-global-color-primary );
    border-radius: 99px;
    position: relative;
    overflow: hidden;
    background: transparent!important;
}
.insitemenu a::before{
    content: " ";
  display:block;
    position: absolute;
    top: 50%!important;
    left: 0%!important;
    transform: translateX(-100%) translateY(-50%)!important;
    border-radius:99px;
    width:98%!important;
    height:104%!important;
    background: linear-gradient(to bottom, #475670 0%, #153556 100%) !important;
    z-index: 1;
    transition: all 0.2s ease-out;
}
.insitemenu a:hover{background: transparent!important;}
.insitemenu a:hover::before,.insitemenu a.elementor-item-active::before{
    width:110%!important;
    transform: translateX(0%) translateY(-50%)!important;
}
/*頁面內選單按鈕2*/
.insitemenu2 a{
    border-radius: 99px;
    position: relative;
    overflow: hidden;
    background-color: #E8F8FF;
    z-index: 0;
}
.insitemenu2 a::before{
    content: " ";
  display:block;
    position: absolute;
    top: 50%!important;
    left: 0%!important;
    transform: translateX(-100%) translateY(-50%)!important;
    border-radius:99px;
    width:98%!important;
    height:104%!important;
    background: #A6DAFE!important;
    z-index: 1;
    transition: all 0.26s ease-out;
}
.insitemenu2 a:hover::before,.insitemenu2 a.elementor-item-active::before{
    width:110%!important;
    transform: translateX(0%) translateY(-50%)!important;
}


/*深色按鈕*/
.bt-ok .elementor-button {
        background: white !important;
        border: 1px solid var( --e-global-color-primary ) !important;
        border-radius: 99px !important;
        color: var( --e-global-color-primary ) !important;
        transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    }
.bt-ok .elementor-button::after{
    content: " ";
  display:block;
    position: absolute;
    top: 50%;
    left: 0%;
    transform: translateX(-100%) translateY(-50%);
    border-radius: 99px;
    width:104%;
    height:104%;
    background: linear-gradient(to bottom, #475670 0%, #153556 100%) !important;
    z-index: 1;
    transition: all 0.22s ease-out;
}
.bt-ok .elementor-button-content-wrapper{
    position: relative;
    z-index: 2;
}
.bt-ok .elementor-button:hover::after{
    width:110%;
    transform: translateX(0%) translateY(-50%);
}
    .bt-ok .elementor-button svg {
        fill: var( --e-global-color-primary ) !important;
    }
    .bt-ok .elementor-button:hover {
        background: white !important;
        color: white !important;
    }
.bt-ok .elementor-button:hover svg {
        fill: white !important;
    }

/*按鈕變小*/
.bt-s-size a{
    padding: var(--space-10) var(--space-24) var(--space-12) var(--space-24)!important;
    font-size: var(--body-l)!important;
}
.bt-s-size .elementor-button-content-wrapper{gap:var(--space-12)!important;}
.bt-s-size .elementor-button-icon{transform:translateY(0.5px)!important;}

/*亮框線按鈕*/
.bt-ok-l .elementor-button {
        background: white !important;
        border: 1px solid var( --e-global-color-11564f5 ) !important;
        border-radius: 99px !important;
        color: var( --e-global-color-primary ) !important;
        transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    }
.bt-ok-l .elementor-button::after{
    content: " ";
  display:block;
    position: absolute;
    top: 50%;
    left: 0%;
    transform: translateX(-100%) translateY(-50%);
    border-radius: 99px;
    width:98%;
    height:104%;
    background: linear-gradient(to bottom, #475670 0%, #153556 100%) !important;
    z-index: 1;
    transition: all 0.22s ease-out;
}
.bt-ok-l .elementor-button-content-wrapper{
    position: relative;
    z-index: 2;
}
.bt-ok-l .elementor-button:hover::after{
    width:110%;
    transform: translateX(0%) translateY(-50%);
}
.bt-ok-l .elementor-button svg {
        fill: var( --e-global-color-primary ) !important;
    }
    .bt-ok-l .elementor-button:hover {
        border: 1px solid var( --e-global-color-primary ) !important;
        color: white !important;
    }
.bt-ok-l .elementor-button:hover svg {
        fill: white !important;
    }

/*頁數*/
.dy-pagination .dce-pagination svg{width:0.7em;}
.dy-pagination .dce-pagination .current,.dy-pagination .dce-pagination a.inactive{
           background-color: transparent;
    color: var( --e-global-color-primary );
    width: var(--space-40);
    height: var(--space-40);
    display: flex;
    align-items: center;
    border-radius: 99px;
    justify-content: center;
}
.dy-pagination .dce-pagination .current,.dy-pagination .dce-pagination a.inactive:hover{background-color: var( --e-global-color-08271dd );}
.dy-pagination .dce-pagination a.icon{
    background: #fff;
    fill: var( --e-global-color-primary );
    border:1px solid var( --e-global-color-primary );
    width: var(--space-40);
    height: var(--space-40);
    display: flex;
    align-items: center;
    border-radius: 99px;
    justify-content: center;
}
.dy-pagination .dce-pagination a.icon:hover{
    fill: #fff;
    background: linear-gradient(to bottom, #475670 0%, #153556 100%) !important;
}
.dy-pagination .dce-pagination a.right{
    margin-right: 0px!important;
    margin-left: var(--space-15);
}
.dy-pagination .dce-pagination a.left{
    margin-right: var(--space-15)!important;
}
.dy-pagination .dce-container-navigation.swiper-container-horizontal .swiper-button-left svg,.dy-pagination .dce-container-navigation.swiper-container-horizontal .swiper-button-right svg{height: var(--EN_Body)!important;}
.dy-pagination .dce-container-navigation.swiper-container-horizontal .swiper-button-left,.dy-pagination .dce-container-navigation.swiper-container-horizontal .swiper-button-right{background: #fff;
    fill: var( --e-global-color-primary );
    border:1px solid var( --e-global-color-primary );
    width: var(--space-40)!important;
    height: var(--space-40)!important;
    display: flex;
    align-items: center;
    border-radius: 99px;
    justify-content: center;transition: all 0.2s ease-out;}
.dy-pagination .dce-container-navigation.swiper-container-horizontal .swiper-button-left:hover,.dy-pagination .dce-container-navigation.swiper-container-horizontal .swiper-button-right:hover{fill: #fff;
    background: linear-gradient(to bottom, #475670 0%, #153556 100%) !important;}

/*圖片滑入放大*/
.himgb{
    overflow: hidden;
    border-radius: var(--radius-30);
}
.himgb img{
    transition: all 0.26s ease-out;
}
.himgb:hover img{
    transform: scale(1.08);
}

/**
 * Elementor Nav Menu - Text Slide Up Hover Effect
 * 文字往上滑出，從下方滑入的 hover 效果
 * 
 * 限定條件：只有在 div.sliding-menu 底下的 nav 才會生效
 * 
 * 使用方式：將此 CSS 加入到 WordPress Customizer > Additional CSS
 * 或透過 Elementor 的 Custom CSS 功能加入
 */

/* ========================================
   Text Slide Up Hover Effect
   限定：div.sliding-menu 底下的 nav
   ======================================== */

/* 主選單連結 - 容器設定 */
div.sliding-menu nav.elementor-nav-menu--main .elementor-nav-menu > .menu-item > a.elementor-item {
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
}

/* 文字容器（由 JS 創建的 span.menu-text） */
div.sliding-menu nav.elementor-nav-menu--main .elementor-nav-menu > .menu-item > a.elementor-item .menu-text {
    display: inline-block;
    position: relative;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 複製的文字（由 JS 創建，用於 hover 效果） */
div.sliding-menu nav.elementor-nav-menu--main .elementor-nav-menu > .menu-item > a.elementor-item .menu-text::after {
    content: attr(data-text);
    position: absolute;
    left: 0;
    top: 100%; /* 位於原文字下方 */
    color: var( --e-global-color-secondary ); /* Hover 時的顏色 - 可自訂 */
    white-space: nowrap;
}

/* Hover 效果 - 文字往上滑 */
div.sliding-menu nav.elementor-nav-menu--main .elementor-nav-menu > .menu-item > a.elementor-item:hover .menu-text {
    transform: translateY(-100%);
}

/* 確保下拉箭頭不受影響 */
div.sliding-menu nav.elementor-nav-menu--main .elementor-nav-menu > .menu-item > a.elementor-item .sub-arrow {
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ========================================
   可選：子選單項目也套用相同效果
   ======================================== */

div.sliding-menu nav.elementor-nav-menu--main .sub-menu .menu-item > a.elementor-sub-item {
    position: relative;
    overflow: hidden;
    display: inline-block;
}

div.sliding-menu nav.elementor-nav-menu--main .sub-menu .menu-item > a.elementor-sub-item .menu-text {
    display: inline-block;
    position: relative;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

div.sliding-menu nav.elementor-nav-menu--main .sub-menu .menu-item > a.elementor-sub-item .menu-text::after {
    content: attr(data-text);
    position: absolute;
    left: 0;
    top: 100%;
    color: var( --e-global-color-secondary );
    white-space: nowrap;
}

div.sliding-menu nav.elementor-nav-menu--main .sub-menu .menu-item > a.elementor-sub-item:hover .menu-text {
    transform: translateY(-100%);
}

/* ========================================
   Elementor Heading Widget 連結
   限定：有 .sliding-menu class 的元素內的 heading widget
   ======================================== */

.sliding-menu .elementor-heading-title a,
.sliding-menu.elementor-widget-heading .elementor-heading-title a {
    position: relative;
    overflow: hidden;
    display: inline-block;
}

.sliding-menu .elementor-heading-title a .menu-text,
.sliding-menu.elementor-widget-heading .elementor-heading-title a .menu-text {
    display: inline-block;
    position: relative;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.sliding-menu .elementor-heading-title a .menu-text::after,
.sliding-menu.elementor-widget-heading .elementor-heading-title a .menu-text::after {
    content: attr(data-text);
    position: absolute;
    left: 0;
    top: 100%;
    color: var( --e-global-color-secondary );
    white-space: nowrap;
}

.sliding-menu .elementor-heading-title a:hover .menu-text,
.sliding-menu.elementor-widget-heading .elementor-heading-title a:hover .menu-text {
    transform: translateY(-100%);
}

/* ========================================
   Elementor Heading Widget 連結效果
   限定：div.sliding-menu 底下的 heading
   ======================================== */

/* Heading 連結 - 容器設定 */
div.sliding-menu .elementor-heading-title a {
    position: relative;
    overflow: hidden;
    display: inline-block;
}

/* 文字容器（由 JS 創建的 span.menu-text） */
div.sliding-menu .elementor-heading-title a .menu-text {
    display: inline-block;
    position: relative;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 複製的文字 - 用於 hover 效果 */
div.sliding-menu .elementor-heading-title a .menu-text::after {
    content: attr(data-text);
    position: absolute;
    left: 0;
    top: 100%;
    color: var( --e-global-color-secondary ); /* Hover 時的顏色 - 可自訂 */
    white-space: nowrap;
}

/* Hover 效果 - 文字往上滑 */
div.sliding-menu .elementor-heading-title a:hover .menu-text {
    transform: translateY(-100%);
}

/* ========================================
   Elementor Heading Widget 連結效果
   適用於 div.sliding-menu 內的 heading widget
   ======================================== */

/* Heading Widget 連結 - 容器設定 */
div.sliding-menu .elementor-heading-title a {
    position: relative;
    overflow: hidden;
    display: inline-block;
}

/* 文字容器 */
div.sliding-menu .elementor-heading-title a .menu-text {
    display: inline-block;
    position: relative;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 複製的文字 - 用於 hover 效果 */
div.sliding-menu .elementor-heading-title a .menu-text::after {
    content: attr(data-text);
    position: absolute;
    left: 0;
    top: 100%;
    color: var( --e-global-color-secondary ); /* Hover 時的顏色 - 可自訂 */
    white-space: nowrap;
}

/* Hover 效果 - 文字往上滑 */
div.sliding-menu .elementor-heading-title a:hover .menu-text {
    transform: translateY(-100%);
}