/**
 * 篩選器無障礙輔助樣式
 *
 * 用於 JetSmartFilters checkbox 篩選器的無障礙改善，
 * 包含：篩選說明小字、aria-live announcer 的 sr-only 隱藏
 *
 * 檢測碼：GN1320201E（篩選更新告知）
 *
 * @package EZC
 * @since 1.6.2
 */

/**
 * 篩選器操作提示說明文字（可見小灰字）
 *
 * 顯示在 JetSmartFilters checkbox 容器前，
 * 告知使用者勾選後清單會自動更新，不需要按送出。
 */
.ezc-a11y-filter-notice {
    display: block;
    font-size: 0.75em;
    color: #767676;
    margin-bottom: 0.4em;
    line-height: 1.4;
}

/**
 * 螢幕報讀器專用隱藏元素（sr-only）
 *
 * 視覺上不顯示，但螢幕報讀器可讀取。
 * 用於 aria-live announcer，不影響頁面視覺排版。
 */
.ezc-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/**
 * Accesskey 定位點 focus 視覺框（檢測碼 GN1240102E）
 *
 * 台灣政府無障礙規範 Alt+U/C/Z 快速鍵跳轉時，目標元素需要可見 focus 框，
 * 讓鍵盤使用者明確知道焦點位置。
 *
 * Selector 涵蓋兩種情境：
 *   A) <a accesskey="U">:::</a> 政府網站標準定位連結（最常見，使用者在 Elementor 手動放）
 *   B) [accesskey="U"][tabindex="-1"] 帶 tabindex 的 landmark 元素（若主題有這樣放）
 *
 * Specificity 考量：主題常用 `outline-style: none !important` 和灰色 outline-color
 * 蓋掉焦點框，這裡用 longhand + html body 前綴提升特異性。
 * [value i] case-insensitive 修飾詞：瀏覽器處理 accesskey 不分大小寫，CSS 選擇器預設敏感，
 * 加 i 才能同時匹配 accesskey="U" 和 accesskey="u"。
 *
 * v1.6.25：移除原本 box-shadow 視覺備援 —— 它原意是 outline 被主題蓋掉時當 fallback，
 * 但實際上 focus-outline.css 已為所有 a:focus 套 outline，多數主題沒 override，
 * outline + box-shadow 兩者並存造成「兩個焦點框」視覺。
 * 主題若真的 override outline，由 applyAccesskeyFocusStyle JS 用 inline style 補回。
 *
 * 實際運作時還需要搭配 a11y-enhancements.js 的 applyAccesskeyFocusStyle：
 * 當主題用高特異性 `outline: none !important` 打贏 CSS 時，JS 會在 focus 事件
 * 用 inline style + !important 強制套 outline（CSS 規範最高優先度）。
 */
html body a[accesskey="U" i]:focus,
html body a[accesskey="C" i]:focus,
html body a[accesskey="Z" i]:focus,
html body a[accesskey="U" i]:focus-visible,
html body a[accesskey="C" i]:focus-visible,
html body a[accesskey="Z" i]:focus-visible,
html body [accesskey="U" i][tabindex="-1"]:focus,
html body [accesskey="C" i][tabindex="-1"]:focus,
html body [accesskey="Z" i][tabindex="-1"]:focus,
html body [accesskey="U" i][tabindex="-1"]:focus-visible,
html body [accesskey="C" i][tabindex="-1"]:focus-visible,
html body [accesskey="Z" i][tabindex="-1"]:focus-visible {
    outline-style: solid !important;
    outline-color: #fbbf24 !important;
    outline-width: 3px !important;
    outline-offset: 2px !important;
}

/**
 * 定位點連結自動生成（landmark-links 模組，v1.11.13）
 *
 * 由外掛在 body 開頭注入的 ::: 連結（上方/中央/下方定位點）。
 * 平時視覺隱藏（不干擾版面），鍵盤 Tab 或按 Alt+U/C/Z 聚焦時才顯示在畫面左上，
 * 焦點框沿用上方 accesskey 規則的金色 outline。
 */
/* 置頂那份（含容器）與短代碼放在自訂位置的裸連結都吃這條，平時 sr-only 藏起來 */
.ezc-landmark-link {
    position: absolute;
    left: -9999px;
    top: 0;
    width: 1px;
    height: 1px;
    overflow: hidden;
    z-index: 100000;
}

.ezc-landmark-link:focus,
.ezc-landmark-link:focus-visible {
    left: 8px;
    top: 8px;
    width: auto;
    height: auto;
    padding: 8px 14px;
    overflow: visible;
    background: #ffffff;
    color: #111111;
    font-weight: 700;
    letter-spacing: 2px;
    text-decoration: none;
    border-radius: 4px;
}

/**
 * Swiper 舊 class 相容性修正（v1.6.11，Chrome Claude 診斷）
 *
 * 問題 A：首頁 .icarbon-sliderbox 卡片第四張被切
 *   主題對所有 swiper-slide 設 margin: 2px，累積的 margin-left 讓
 *   4 張卡片總寬度超出容器 37px。Swiper inline style 只蓋 margin-right。
 *
 * 問題 B：導航圓點擠在一起
 *   Swiper 用舊版 class `swiper-container-horizontal`，但 Elementor CSS
 *   只對新版 class `.swiper-horizontal` 有 bullet spacing 規則。
 *
 * 修法：手動為舊 class 補上 bullet 間距 + 移除卡片 horizontal margin。
 */
.icarbon-sliderbox .swiper-slide,
.swiper-container-horizontal .swiper-slide {
    margin-left: 0 !important;
    /* 保留 margin-top/bottom: 2px（主題原意）但拿掉 left 避免累積 overflow */
}

/* v1.6.19 revert：移除 nth-child(4n) margin-right: 0 的 hack
 * 原因：Swiper 位移計算依賴一致的 margin，改動第 4/8/12 張的 margin
 * 會造成往右滑時 transform translate 跟實際 slide 位置對不齊，出現空白。
 * 接受第一頁最後一張的 15px margin 略為超出（視覺上是空白邊，非內容裁切）。
 */

.swiper-container-horizontal .swiper-pagination-bullets .swiper-pagination-bullet,
.icarbon-sliderbox .swiper-pagination-bullet,
.elementor-swiper-button ~ .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 6px !important;
}

/**
 * v1.6.20：覆蓋主題 .icarbon-sliderbox .swiper { padding-right: 17px !important }
 *
 * 使用者實測發現主題（或 ICarbon 外掛）加了這條規則，強制 swiper 容器右邊
 * 留 17px padding，造成最後一張卡片視覺上被切掉 + 往右滑時位置對不齊。
 */
.icarbon-sliderbox .swiper {
    padding-right: 0 !important;
}

/**
 * v1.6.23：Elementor :not(.swiper-initialized) fallback 在舊版 Swiper 永遠生效
 *
 * Elementor widget-loop-carousel.min.css 有這條規則：
 *   .swiper:not(.swiper-initialized) > .swiper-wrapper { gap: 15px; overflow: hidden }
 * 用意是 Swiper v8 初始化前用 CSS 撐排版，v8 init 後加 .swiper-initialized
 * class，:not() 就不匹配，fallback 停用。
 *
 * knzp 線上環境：Elementor Swiper v8 沒被載入（全站 script 被 defer 影響載入時序，
 * jet-woo-product-gallery 的舊版 Swiper v5 先佔用 window.Swiper），輪播用 v5 初始化，
 * 初始化後加的 class 是 swiper-container-initialized 不是 swiper-initialized。
 * :not(.swiper-initialized) 永遠 true，fallback 永遠生效：
 *   - gap: 15px 疊加 Swiper inline margin-right: 10px → 實際間距 25px → 右側切邊
 *   - overflow: hidden 讓 wrapper 無法擴展到 virtualSize → 往右滑 slides 跑到 wrapper 外 → 空白
 *
 * 修法：對舊版 Swiper 初始化後的 wrapper 強制 gap: 0 + overflow: visible，
 * 讓間距只由 Swiper 自己的 margin-right 控制，wrapper 能正確延伸顯示所有 slides。
 */
.icarbon-sliderbox .swiper-container-initialized > .swiper-wrapper,
.elementor-widget-loop-carousel .swiper-container-initialized > .swiper-wrapper {
    gap: 0 !important;
    overflow: visible !important;
}

/**
 * 自動輪播暫停 / 播放按鈕（WCAG 2.2.2，搭配 enhanceAutoplayCarousels）
 *
 * JS 會在 SELECTORS.autoplayCarousels 列出的容器右下角插入一顆按鈕，
 * 並把容器設為 position:relative 當定位基準。
 */
.ezc-carousel-pause-btn {
    position: absolute;
    bottom: 12px;
    right: 12px;
    z-index: 10;
    padding: 4px 12px;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    border: 2px solid #fff;
    border-radius: 4px;
    font-size: 0.8rem;
    line-height: 1.4;
    cursor: pointer;
    white-space: nowrap;
}

.ezc-carousel-pause-btn:hover {
    background: rgba(0, 0, 0, 0.8);
}

.ezc-carousel-pause-btn:focus,
.ezc-carousel-pause-btn:focus-visible {
    outline: 3px solid #fbbf24 !important;
    outline-offset: 2px;
}

/* 滑鼠點擊不顯示外框（鍵盤 Tab 仍顯示）
   理由與清單維護規則見 focus-outline.css 檔尾同名區塊 @since 1.12.45 */
@supports selector(:focus-visible) {
    .ezc-carousel-pause-btn:focus:not(:focus-visible) {
        outline: none !important;
    }
}

/**
 * JetSmartFilters 分頁頁碼焦點指示器（搭配 enhanceFilterPagination）
 *
 * 用 JetEngine 標準 class，跨站通用，不綁特定佈景的外層容器。
 */
.jet-filters-pagination__item:focus,
.jet-filters-pagination__item:focus-visible {
    outline: 3px solid #fbbf24 !important;
    outline-offset: 2px;
}

/* 滑鼠點擊不顯示外框（鍵盤 Tab 仍顯示）@since 1.12.45 */
@supports selector(:focus-visible) {
    .jet-filters-pagination__item:focus:not(:focus-visible) {
        outline: none !important;
    }
}