/**
 * Sticky Widget Styles
 * @version 3.7
 */

/* 佔位元素 - 用於保持頁面佈局 */
.sticky-widget-placeholder {
display: none;
visibility: hidden;
pointer-events: none;
opacity: 0;
box-sizing: border-box;
width: 100%;
min-height: var(--sticky-widget-placeholder-height, var(--cls-sticky-widget-min-height, 300px));
contain: layout style;
contain-intrinsic-size: auto var(--sticky-widget-placeholder-height, var(--cls-sticky-widget-min-height, 300px));
}

.sticky-widget-placeholder.is-active {
display: block;
}

.sticky-widget {
box-sizing: border-box;
}

.sticky-widget[id^="comprehensive_article_widget-"],
.sticky-widget.widget_comprehensive_article_widget {
min-height: var(--cls-sticky-widget-min-height, 300px);
}

.sticky-widget.homepage-widget.widget_comprehensive_article_widget,
div[id^="comprehensive_article_widget-"].homepage-widget {
min-height: var(--cls-home-sticky-widget-min-height, 360px);
}

.sticky-widget.sidebar-right.widget_comprehensive_article_widget,
section[id^="comprehensive_article_widget-"].sidebar-right {
min-height: var(--cls-sidebar-sticky-widget-min-height, 320px);
}

/* Sticky 啟用時的基本樣式 - 使用更高優先級的選擇器 */
section.sticky-widget.sticky-active,
aside.sticky-widget.sticky-active,
div.sticky-widget.sticky-active,
.sticky-widget.sticky-active {
position: fixed !important;
/*z-index: 9999 !important;*/
transition: box-shadow .18s ease, opacity .18s ease, border-radius .18s ease;
background-color: inherit;
box-sizing: border-box !important;
transform: translateZ(0);
will-change: top;
backface-visibility: hidden;
}

/* Sticky 到達底部時：維持 fixed 並由 JS clamp top，避免 fixed -> absolute handoff 造成 CLS */
section.sticky-widget.sticky-bottom,
aside.sticky-widget.sticky-bottom,
div.sticky-widget.sticky-bottom,
.sticky-widget.sticky-bottom {
position: fixed !important;
/*z-index: 9999 !important;*/
box-sizing: border-box !important;
transform: translateZ(0);
will-change: top;
backface-visibility: hidden;
}

/* 確保 sticky-active 時的樣式正確套用 */
.sticky-widget.sticky-active[style],
.sticky-widget.sticky-bottom[style] {
background-color: #fff;
/*box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);*/
}

/* 整條 Sidebar 模式：預設不啟用，需在小工具設定切到「整條 Sidebar（實驗）」。 */
.sticky-widget-sidebar-mode-host[data-sticky-sidebar-mode="1"] {
position: sticky;
top: var(--sticky-widget-sidebar-top, 72px);
align-self: flex-start;
max-height: calc(100vh - var(--sticky-widget-sidebar-top, 72px) - var(--sticky-widget-sidebar-bottom-gap, 24px));
overflow-y: auto;
overscroll-behavior: contain;
scrollbar-gutter: stable;
z-index: 10;
}

.sticky-widget-sidebar-mode-host[data-sticky-sidebar-mode="1"] .sticky-widget[data-sticky-mode="sidebar"] {
position: static !important;
top: auto !important;
left: auto !important;
right: auto !important;
width: auto !important;
max-width: none !important;
transform: none !important;
will-change: auto !important;
}

/* 小工具後台控制區 */

.widgets-php .sticky-widget-admin-control {
background: #f6f7f7;
border: 1px solid #dcdcde;
border-radius: 8px;
margin: 12px 0 0;
padding: 12px 14px;
}

.widgets-php .sticky-widget-admin-toggle {
margin: 0;
}

.widgets-php .sticky-widget-admin-toggle .description,
.widgets-php .sticky-widget-device-options .description {
display: block;
margin-top: 6px;
}

.widgets-php .sticky-widget-device-options {
border-top: 1px solid #dcdcde;
margin-top: 10px;
padding-top: 10px;
padding-left: 24px;
transition: opacity 0.18s ease;
}

.widgets-php .sticky-widget-device-options.is-disabled {
opacity: 0.55;
}

.widgets-php .sticky-widget-settings-grid {
display: grid;
gap: 12px;
margin-top: 14px;
padding-top: 12px;
border-top: 1px dashed #dcdcde;
}

.widgets-php .sticky-widget-setting {
margin: 0;
}

.widgets-php .sticky-widget-setting label {
display: inline-block;
font-weight: 600;
margin-bottom: 4px;
}

.widgets-php .sticky-widget-setting .small-text {
min-width: 88px;
}

.widgets-php .sticky-widget-setting .description {
display: block;
margin-top: 4px;
}