.elementor-17905 .elementor-element.elementor-element-c6d70f3{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-17905 .elementor-element.elementor-element-21dbb00{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-17905 .elementor-element.elementor-element-ac1198f{--display:flex;}@media(max-width:767px){.elementor-17905 .elementor-element.elementor-element-ac1198f{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-17905 .elementor-element.elementor-element-8a7e362 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}}/* Start custom CSS for html, class: .elementor-element-7e1eb29 */<style>
/* 1. 全局鎖定防位移干擾 */
.elementor-17905 .elementor-element.elementor-element-7e1eb29, .elementor-17905 .elementor-element.elementor-element-7e1eb29:hover, .elementor-17905 .elementor-element.elementor-element-7e1eb29 > .elementor-widget-container {
  width: 100% !important; margin: 0 !important; padding: 0 !important; background: transparent !important; transform: none !important;
}

.ws-interactive-upcoming {
  --navy: #17345B; --gold: #D5A51F; --bg-warm: #FAF8F5;
  width: 100% !important; max-width: 1200px !important; margin: 0 auto !important; padding: 40px 20px !important;
  font-family: "Noto Serif TC", "Noto Sans TC", sans-serif !important; box-sizing: border-box !important;
}

/* 標題與 Tab */
.ws-header-center { text-align: center !important; margin-bottom: 24px !important; }
.ws-tag-gold { font-size: 12px !important; font-weight: 800 !important; color: var(--gold) !important; letter-spacing: 2px !important; }
.ws-title-navy { font-size: clamp(24px, 3.5vw, 36px) !important; color: var(--navy) !important; font-weight: 800 !important; margin: 6px 0 !important; }
.ws-desc-sub { font-size: 14px !important; color: #596A7A !important; }

.ws-filter-bar { display: flex !important; justify-content: center !important; gap: 10px !important; margin-bottom: 30px !important; flex-wrap: wrap !important; }
.ws-filter-tab {
  background: #FFFFFF !important; border: 1px solid rgba(213, 165, 31, 0.3) !important; color: #596A7A !important;
  padding: 8px 20px !important; border-radius: 30px !important; font-size: 14px !important; font-weight: 600 !important; cursor: pointer !important;
  transition: all 0.25s ease !important;
}
.ws-filter-tab.active, .ws-filter-tab:hover { background: var(--navy) !important; color: #FFFFFF !important; border-color: var(--navy) !important; box-shadow: 0 4px 12px rgba(23, 52, 91, 0.2) !important; }

/* 舞台布局 (左 45% 右 52%) */
.ws-stage-wrapper { display: flex !important; gap: 3% !important; align-items: flex-start !important; }
.ws-card-list { flex: 1 1 45% !important; display: flex !important; flex-direction: column !important; gap: 16px !important; }

.ws-card-item {
  display: flex !important; background: #FFFFFF !important; border-radius: 18px !important; border: 1.5px solid rgba(213, 165, 31, 0.2) !important;
  overflow: hidden !important; cursor: pointer !important; transition: all 0.25s ease !important;
}
.ws-card-item:hover, .ws-card-item.active { border-color: var(--gold) !important; transform: translateX(6px) !important; box-shadow: 0 8px 24px rgba(23, 52, 91, 0.08) !important; }

.ws-card-img-box { position: relative !important; width: 140px !important; min-width: 140px !important; }
.ws-card-img-box img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
.ws-status-badge { position: absolute !important; top: 8px !important; left: 8px !important; font-size: 10px !important; font-weight: 700 !important; padding: 2px 8px !important; border-radius: 10px !important; }
.status-open { background: #E6F4EA !important; color: #137333 !important; }
.status-upcoming { background: #FEF7E0 !important; color: #B06000 !important; }
.status-full { background: #FCE8E6 !important; color: #C5221F !important; }

.ws-card-info { padding: 14px !important; display: flex !important; flex-direction: column !important; flex: 1 !important; }
.ws-cat-label { font-size: 11px !important; font-weight: 700 !important; color: var(--gold) !important; }
.ws-card-h3 { font-size: 15px !important; font-weight: 700 !important; color: var(--navy) !important; margin: 4px 0 !important; line-height: 1.35 !important; }
.ws-card-desc { font-size: 12.5px !important; color: #596A7A !important; line-height: 1.5 !important; margin-bottom: 10px !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }
.ws-meta-row { font-size: 11px !important; color: #2C3E50 !important; display: flex !important; gap: 8px !important; margin-bottom: 10px !important; }
.ws-click-btn { margin-top: auto !important; border: none !important; background: rgba(23, 52, 91, 0.06) !important; color: var(--navy) !important; padding: 6px 12px !important; border-radius: 6px !important; font-size: 12px !important; font-weight: 700 !important; text-align: left !important; cursor: pointer !important; }

/* 右側預覽舞台 */
.ws-preview-stage { flex: 1 1 52% !important; position: sticky !important; top: 20px !important; }
.ws-stage-card { background: #FFFFFF !important; border-radius: 22px !important; border: 1.5px solid var(--gold) !important; padding: 28px !important; box-shadow: 0 12px 30px rgba(12, 30, 54, 0.08) !important; }
.ws-stage-cat { font-size: 12px !important; font-weight: 800 !important; color: var(--gold) !important; }
.ws-stage-title { font-size: 22px !important; color: var(--navy) !important; font-weight: 800 !important; margin: 6px 0 14px 0 !important; }
.ws-stage-img img { width: 100% !important; height: 200px !important; object-fit: cover !important; border-radius: 14px !important; margin-bottom: 14px !important; }
.ws-stage-desc { font-size: 14px !important; color: #596A7A !important; line-height: 1.7 !important; margin-bottom: 16px !important; }
.ws-stage-grid { background: var(--bg-warm) !important; padding: 14px !important; border-radius: 12px !important; font-size: 13px !important; display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; margin-bottom: 20px !important; }
.ws-stage-btn { display: block !important; text-align: center !important; padding: 12px !important; background: linear-gradient(135deg, #D7A818 0%, #F39A35 100%) !important; color: #FFFFFF !important; border-radius: 30px !important; font-size: 15px !important; font-weight: 700 !important; text-decoration: none !important; }

/* 手機彈窗 Modal */
.ws-modal-backdrop { position: fixed !important; inset: 0 !important; background: rgba(12, 30, 54, 0.6) !important; backdrop-filter: blur(6px) !important; z-index: 99999 !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 20px !important; opacity: 0 !important; pointer-events: none !important; transition: opacity 0.25s ease !important; }
.ws-modal-backdrop.open { opacity: 1 !important; pointer-events: auto !important; }
.ws-modal-box { background: #FFFFFF !important; width: 100% !important; max-width: 480px !important; max-height: 85vh !important; border-radius: 24px !important; padding: 24px !important; overflow-y: auto !important; position: relative !important; }
.ws-modal-close { position: absolute !important; top: 14px !important; right: 14px !important; border: none !important; background: #FAF8F5 !important; width: 32px !important; height: 32px !important; border-radius: 50% !important; font-size: 16px !important; cursor: pointer !important; }

@media (min-width: 768px) { .ws-modal-backdrop { display: none !important; } }
@media (max-width: 767px) {
  .ws-stage-wrapper { flex-direction: column !important; }
  .ws-preview-stage { display: none !important; } /* 手機版自動改為點擊跳彈窗 */
  .ws-card-item { flex-direction: column !important; }
  .ws-card-img-box { width: 100% !important; height: 150px !important; }
}
</style>/* End custom CSS */