/* 全球動態警報地圖（旅遊專區 #hub-alerts）— 樣式移植自 Orbivoy style.css 地震頁區塊；全部限定在 #live-map-root 內，不影響站內其他版面 */
#live-map-root .leaflet-container { font-family: inherit; isolation: isolate; z-index: 0; }
#live-map-root .leaflet-popup-content { font-size: 13px; line-height: 1.5; }
#live-map-root .leaflet-popup-content-wrapper { border-radius: 14px; }
#live-map-root .eq-panel.eq-light { background: #f8fafc; border-color: #e2e8f0; }
#live-map-root .eq-panel.eq-light #eq-filters { color: #334155; border-color: #e2e8f0; }
#live-map-root .eq-panel.eq-light .eq-legend, #live-map-root .eq-panel.eq-light #eq-count { background: rgba(255,255,255,.9); color: #334155; border-color: #e2e8f0; }
#live-map-root .eq-panel.eq-light #eq-map { background: #f1f5f9; }
#live-map-root .eq-panel.eq-light .eq-theme.bg-slate-700 { background: #0e7490; }
#live-map-root .eq-panel.eq-light .eq-theme:not(.bg-slate-700) { color: #64748b; }
#live-map-root .eq-panel.eq-light .rounded-lg.bg-slate-800 { background: #e2e8f0; }
@keyframes eq-pulse { 0% { stroke-width: 1; stroke-opacity: .9; } 70% { stroke-width: 14; stroke-opacity: 0; } 100% { stroke-width: 14; stroke-opacity: 0; } }
#live-map-root .leaflet-interactive.eq-pulse { animation: eq-pulse 1.8s ease-out infinite; }
#live-map-root .eq-panel:not(.eq-light) .leaflet-popup-content-wrapper, #live-map-root .eq-panel:not(.eq-light) .leaflet-popup-tip { background: #0f172a; color: #e2e8f0; border: 1px solid #334155; }
#live-map-root .eq-panel:not(.eq-light) .leaflet-popup-close-button { color: #94a3b8; }
#live-map-root .eq-panel:not(.eq-light) .eq-popup a, #live-map-root .eq-panel:not(.eq-light) .hz-popup a { color: #67e8f9; }
#live-map-root .eq-panel:not(.eq-light) .leaflet-control-zoom a { background: #1e293b; color: #e2e8f0; border-color: #334155; }
#live-map-root .eq-panel:not(.eq-light) .leaflet-control-attribution { background: rgba(15,23,42,.7); color: #94a3b8; }
#live-map-root .eq-panel:not(.eq-light) .leaflet-control-attribution a { color: #67e8f9; }
#live-map-root .tiles-dark { filter: invert(1) hue-rotate(190deg) brightness(.8) contrast(.9) saturate(.6); }
#live-map-root .leaflet-container { min-height: 320px; touch-action: pan-x pan-y; }
/* 篩選列 */
#live-map-root .eq-chip { background: rgba(30,41,59,.8); border-color: #334155; color: #cbd5e1; }
#live-map-root .eq-chip:hover { background: #334155; color: #fff; }
#live-map-root .eq-chip.is-active { background: linear-gradient(135deg, #f97316, #ef4444); border-color: transparent; color: #fff; box-shadow: 0 2px 10px rgba(249,115,22,.35); }
#live-map-root .eq-field { display: flex; align-items: center; gap: .5rem; height: 38px; padding: 0 .75rem; border-radius: .75rem; background: #1e293b; border: 1px solid #334155; color: #e2e8f0; transition: border-color .15s, box-shadow .15s; }
#live-map-root .eq-field:focus-within { border-color: #22d3ee; box-shadow: 0 0 0 3px rgba(34,211,238,.18); }
#live-map-root .eq-field > i { color: #64748b; font-size: 12px; width: 14px; text-align: center; flex: none; }
#live-map-root .eq-field select, #live-map-root .eq-field input { flex: 1; min-width: 0; background: transparent; border: 0; outline: 0; color: inherit; font-size: 13px; height: 100%; }
#live-map-root .eq-field select { appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2394a3b8' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 2px center; padding-right: 16px; cursor: pointer; }
#live-map-root .eq-field select option { background: #0f172a; color: #e2e8f0; }
#live-map-root .eq-field input::placeholder { color: #64748b; }
#live-map-root .eq-field input[type=search]::-webkit-search-cancel-button { filter: invert(.7); }
#live-map-root .eq-field-q { position: relative; }
#live-map-root .eq-field-q input { text-overflow: ellipsis; }
#live-map-root .eq-q-count { flex: none; font-size: 10px; line-height: 1; padding: 3px 6px; border-radius: 999px; background: rgba(148,163,184,.18); color: #94a3b8; white-space: nowrap; }
#live-map-root .eq-q-hint { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 20; font-size: 11px; line-height: 1.3; padding: 4px 8px; border-radius: 8px; background: #0f172a; color: #cbd5e1; border: 1px solid #334155; box-shadow: 0 6px 16px rgba(0,0,0,.35); pointer-events: none; }
#live-map-root .eq-panel.eq-light .eq-q-hint { background: #fff; color: #475569; border-color: #cbd5e1; box-shadow: 0 6px 16px rgba(15,23,42,.12); }
#live-map-root .eq-panel.eq-light .eq-q-count { background: #e2e8f0; color: #475569; }
@media (max-width: 1023px) { #live-map-root .eq-field { height: 42px; } #live-map-root .eq-field select, #live-map-root .eq-field input { font-size: 15px !important; } }
#live-map-root .eq-country-tip { background: rgba(15,23,42,.9); color: #e2e8f0; border: 1px solid #334155; font-size: 11px; padding: 2px 8px; border-radius: 6px; }
#live-map-root .eq-country-tip::before { display: none; }
#live-map-root .eq-panel.eq-light .eq-chip { background: #fff; border-color: #cbd5e1; color: #334155; }
#live-map-root .eq-panel.eq-light .eq-chip:hover { background: #f1f5f9; color: #0f172a; }
#live-map-root .eq-panel.eq-light .eq-chip.is-active { color: #fff; }
#live-map-root .eq-panel.eq-light .eq-field { background: #fff; border-color: #cbd5e1; color: #0f172a; }
#live-map-root .eq-panel.eq-light .eq-field select option { background: #fff; color: #0f172a; }
#live-map-root .eq-panel.eq-light .eq-field input::placeholder, #live-map-root .eq-panel.eq-light .eq-field > i { color: #94a3b8; }
#live-map-root .eq-panel.eq-light #eq-filters .text-slate-400 { color: #64748b; }
#live-map-root .eq-panel.eq-light #eq-home, #live-map-root .eq-panel.eq-light .eq-theme-mobile { background: rgba(255,255,255,.9); color: #334155; border-color: #e2e8f0; }
#live-map-root .eq-panel.eq-light .eq-country-tip { background: rgba(255,255,255,.95); color: #0f172a; border-color: #cbd5e1; }
#live-map-root .eq-src-cwa { display: inline-block; padding: 1px 6px; border-radius: 6px; background: #ecfeff; color: #0e7490; font-size: 10px; font-weight: 700; border: 1px solid #a5f3fc; vertical-align: middle; }
#live-map-root .eq-src-jma { background: #1d4ed8; color: #fff; }
/* 震央同心圓 */
#live-map-root .eq-ripple-wrap { pointer-events: none; }
#live-map-root .eq-ripple { position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--c, #ff4d4d); opacity: 0; transform: scale(.08); animation: eq-ripple var(--d, 3s) cubic-bezier(.2,.6,.3,1) infinite; will-change: transform, opacity; }
@keyframes eq-ripple { 0% { transform: scale(.08); opacity: .9; } 70% { opacity: .25; } 100% { transform: scale(1); opacity: 0; } }
#live-map-root.eq-paused .eq-ripple, #live-map-root.eq-paused .eq-pulse { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { #live-map-root .eq-ripple { animation: none; opacity: .25; transform: scale(.5); } }
#live-map-root .eq-ripple-demo { position: relative; width: 14px; height: 14px; border-radius: 50%; border: 2px solid #ff4d4d; opacity: .7; }
#live-map-root .eq-ripple-demo::after { content: ''; position: absolute; inset: 3px; border-radius: 50%; border: 1.5px solid #ff4d4d; opacity: .5; }
/* 災害圖層 chips／標記 */
#live-map-root .hz-layer { background: rgba(30,41,59,.8); border-color: #334155; color: #94a3b8; }
#live-map-root .hz-layer .hz-dot { width: 20px; height: 20px; border-radius: 9999px; display: inline-flex; align-items: center; justify-content: center; font-size: 10px; background: #334155; color: #cbd5e1; transition: background .15s, color .15s; }
#live-map-root .hz-layer:hover { color: #e2e8f0; border-color: #475569; }
#live-map-root .hz-layer.is-on { color: #fff; border-color: color-mix(in srgb, var(--hz) 60%, transparent); background: color-mix(in srgb, var(--hz) 18%, rgba(30,41,59,.9)); }
#live-map-root .hz-layer.is-on .hz-dot { background: var(--hz); color: #fff; box-shadow: 0 0 0 3px color-mix(in srgb, var(--hz) 30%, transparent); }
#live-map-root .eq-panel.eq-light .hz-layer { background: #fff; border-color: #cbd5e1; color: #64748b; }
#live-map-root .eq-panel.eq-light .hz-layer .hz-dot { background: #e2e8f0; color: #475569; }
#live-map-root .eq-panel.eq-light .hz-layer.is-on { color: #0f172a; background: color-mix(in srgb, var(--hz) 12%, #fff); }
#live-map-root .eq-panel.eq-light .hz-layer.is-on .hz-dot { color: #fff; }
#live-map-root .hz-pin-wrap { background: none !important; border: 0 !important; }
#live-map-root .hz-pin { position: relative; width: 30px; height: 30px; border-radius: 9999px; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 0 0 2.5px var(--lv), 0 3px 10px rgba(0,0,0,.45); background: var(--c); color: #fff; }
#live-map-root .hz-pin-in { display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 100%; border-radius: 9999px; font-size: 13px; line-height: 1; text-shadow: 0 1px 2px rgba(0,0,0,.4); }
#live-map-root .hz-pin.hz-mini { width: 18px; height: 18px; box-shadow: 0 0 0 1.5px var(--lv); flex: none; }
#live-map-root .hz-pin.hz-mini .hz-pin-in { font-size: 9px; }
#live-map-root .hz-pin.is-red::after, #live-map-root .hz-pin.is-orange::after { content: ''; position: absolute; inset: -7px; border-radius: 9999px; border: 2px solid var(--lv); opacity: .8; animation: hz-ring 1.8s ease-out infinite; }
@keyframes hz-ring { 0% { transform: scale(.75); opacity: .9; } 100% { transform: scale(1.5); opacity: 0; } }
#live-map-root.eq-paused .hz-pin::after { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { #live-map-root .hz-pin::after { animation: none; } }
#live-map-root .hz-pin.is-ended { opacity: .55; filter: saturate(.6); }
#live-map-root .hz-pin.hz-cyclone .hz-pin-in i { animation: hz-spin 6s linear infinite; }
@keyframes hz-spin { to { transform: rotate(-360deg); } }
#live-map-root.eq-paused .hz-pin.hz-cyclone i, #live-map-root .hz-mini.hz-cyclone i { animation: none; }
#live-map-root .hz-wind { stroke-dasharray: 6 5; }
#live-map-root .hz-popup .hz-badge { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 9999px; font-size: 11px; font-weight: 700; color: #fff; }
/* 列表分頁 */
#live-map-root .hz-ftab { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; height: 30px; padding: 0 11px; border-radius: 9999px; font-size: 12px; font-weight: 600; color: #475569; background: #f5f2ec; border: 1px solid #e7e1d6; transition: all .15s; }
#live-map-root .hz-ftab i { color: var(--hz); font-size: 11px; }
#live-map-root .hz-ftab:hover { border-color: var(--hz); color: #0f172a; }
#live-map-root .hz-ftab.is-active { background: var(--hz); border-color: var(--hz); color: #fff; }
#live-map-root .hz-ftab.is-active i { color: #fff; }
#live-map-root .hz-ftab.is-empty { opacity: .45; }
#live-map-root .hz-ftab-n { font-size: 11px; opacity: .75; font-variant-numeric: tabular-nums; }
#live-map-root .hz-kind-tag > i { width: 20px; height: 20px; border-radius: 9999px; display: inline-flex; align-items: center; justify-content: center; font-size: 10px; background: currentColor; }
#live-map-root .hz-kind-tag > i::before { color: #fff; }
#live-map-root .hz-kind-tag { display: inline-flex; align-items: center; gap: 6px; padding: 2px 8px 2px 2px; border-radius: 9999px; font-size: 12px; font-weight: 600; white-space: nowrap; }
#live-map-root .hz-kind-tag .hz-pin { width: 20px; height: 20px; box-shadow: 0 0 0 1.5px var(--lv); }
#live-map-root .hz-kind-tag .hz-pin-in { font-size: 9px; }
#live-map-root .hz-lv { display: inline-block; width: 8px; height: 8px; border-radius: 9999px; }
#live-map-root .hz-lv-red { background: #ef4444; } #live-map-root .hz-lv-orange { background: #fb923c; } #live-map-root .hz-lv-yellow { background: #facc15; } #live-map-root .hz-lv-green { background: #22c55e; }
#live-map-root .eq-legend summary::-webkit-details-marker { display: none; }
#live-map-root .eq-legend summary::after { content: '▾'; margin-left: auto; opacity: .6; }
#live-map-root .eq-legend:not([open]) summary::after { content: '▸'; }
@media (max-width: 639px) { #live-map-root .eq-legend { max-width: 220px; } #live-map-root .eq-legend[open] .grid-cols-2 { grid-template-columns: 1fr; } }
#live-map-root .eq-panel.eq-light .eq-legend .text-slate-400 { color: #64748b; }
#live-map-root .eq-panel.eq-light .eq-legend .border-slate-700 { border-color: #e2e8f0; }
#live-map-root .eq-panel.eq-light .eq-legend .hz-pin { --lv: #64748b; }
#live-map-root .eq-panel.eq-light .eq-legend .border-white\/70 { border-color: #94a3b8; }
#live-map-root .eq-panel.eq-light .hz-pin.is-green { --lv: rgba(15,23,42,.55); }
/* RTL（ar）：地圖、數值與表格內容維持 LTR，容器仍跟隨頁面方向 */
html.rtl #live-map-root .eq-panel, html.rtl #live-map-root #alert-list table { direction: ltr; }
