/* =============================================================================
   ECLIPSEFAN THEME - FAN SLIDER & PLAYBACK
   =============================================================================
   Dark/Astro theme overrides for fan diagram slider, playback controls,
   horizon progress bar, and visibility table.
   Depends on: design-tokens.css
   ============================================================================= */

/* Astro mode: Fan slider and controls */
[data-theme="astro"] #lp-fan-slider,
[data-theme="astro"] #bs-fan-slider {
    background: linear-gradient(to right, var(--color-border) 0%, var(--color-accent) 50%, var(--color-border) 100%);
}

[data-theme="astro"] #lp-fan-slider::-webkit-slider-thumb,
[data-theme="astro"] #bs-fan-slider::-webkit-slider-thumb {
    background: var(--color-accent);
    border-color: var(--color-bg-primary);
    box-shadow: 0 2px 8px rgba(170, 34, 34, 0.5);
}

[data-theme="astro"] #lp-fan-slider::-moz-range-thumb,
[data-theme="astro"] #bs-fan-slider::-moz-range-thumb {
    background: var(--color-accent);
    border-color: var(--color-bg-primary);
    box-shadow: 0 2px 8px rgba(170, 34, 34, 0.5);
}

[data-theme="astro"] #lp-fan-current-time,
[data-theme="astro"] #bs-fan-current-time {
    color: var(--color-accent);
}

[data-theme="astro"] .lp-fan-ctrl-btn,
[data-theme="astro"] .bs-fan-ctrl-btn {
    border-color: var(--color-accent);
    background: var(--color-bg-primary);
    color: var(--color-accent);
}

[data-theme="astro"] .lp-fan-ctrl-btn:hover,
[data-theme="astro"] .bs-fan-ctrl-btn:hover {
    background: var(--color-bg-secondary);
}

/* Override inline styles for Fan control buttons */
[data-theme="dark"] .lp-fan-ctrl-btn,
[data-theme="dark"] .bs-fan-ctrl-btn {
    border-color: var(--color-accent) !important;
    background: var(--color-bg-primary) !important;
}

[data-theme="dark"] .lp-fan-ctrl-btn:hover,
[data-theme="dark"] .bs-fan-ctrl-btn:hover {
    background: var(--color-bg-secondary) !important;
}

/* Stop button - square icon (uses background) */
[data-theme="dark"] #lp-fan-stop-btn div,
[data-theme="dark"] #bs-fan-stop-btn div {
    background: var(--color-accent) !important;
}

/* Play button - triangle icon (uses border-left for the arrow shape) */
[data-theme="dark"] #lp-fan-play-btn div,
[data-theme="dark"] #bs-fan-play-btn div {
    border-left-color: var(--color-accent) !important;
}

/* Active state for fan control buttons — light theme */
.bs-fan-ctrl-btn.fan-btn-active,
.lp-fan-ctrl-btn.fan-btn-active {
    background: #800080 !important;
}
#bs-fan-stop-btn.fan-btn-active div,
#lp-fan-stop-btn.fan-btn-active div {
    background: white !important;
}
#bs-fan-play-btn.fan-btn-active div,
#lp-fan-play-btn.fan-btn-active div {
    border-left-color: white !important;
}

/* Active state — dark theme */
[data-theme="dark"] .lp-fan-ctrl-btn.fan-btn-active,
[data-theme="dark"] .bs-fan-ctrl-btn.fan-btn-active {
    background: var(--color-accent) !important;
}
[data-theme="dark"] #lp-fan-stop-btn.fan-btn-active div,
[data-theme="dark"] #bs-fan-stop-btn.fan-btn-active div {
    background: var(--color-bg-primary) !important;
}
[data-theme="dark"] #lp-fan-play-btn.fan-btn-active div,
[data-theme="dark"] #bs-fan-play-btn.fan-btn-active div {
    border-left-color: var(--color-bg-primary) !important;
}

[data-theme="astro"] .lp-fan-ctrl-btn,
[data-theme="astro"] .bs-fan-ctrl-btn {
    border-color: var(--color-accent) !important;
    background: var(--color-bg-primary) !important;
}

[data-theme="astro"] .lp-fan-ctrl-btn:hover,
[data-theme="astro"] .bs-fan-ctrl-btn:hover {
    background: var(--color-bg-secondary) !important;
}

/* Stop button - square icon (uses background) */
[data-theme="astro"] #lp-fan-stop-btn div,
[data-theme="astro"] #bs-fan-stop-btn div {
    background: var(--color-accent) !important;
}

/* Play button - triangle icon (uses border-left for the arrow shape) */
[data-theme="astro"] #lp-fan-play-btn div,
[data-theme="astro"] #bs-fan-play-btn div {
    border-left-color: var(--color-accent) !important;
}

/* Active state — astro theme */
[data-theme="astro"] .lp-fan-ctrl-btn.fan-btn-active,
[data-theme="astro"] .bs-fan-ctrl-btn.fan-btn-active {
    background: var(--color-accent) !important;
}
[data-theme="astro"] #lp-fan-stop-btn.fan-btn-active div,
[data-theme="astro"] #bs-fan-stop-btn.fan-btn-active div {
    background: var(--color-bg-primary) !important;
}
[data-theme="astro"] #lp-fan-play-btn.fan-btn-active div,
[data-theme="astro"] #bs-fan-play-btn.fan-btn-active div {
    border-left-color: var(--color-bg-primary) !important;
}

/* Horizon tab - progress bar and text (override inline styles) */
[data-theme="dark"] #bs-skyline-progress > div:first-child,
[data-theme="dark"] #lp-skyline-progress > div:first-child {
    background: var(--color-bg-tertiary) !important;
}

[data-theme="dark"] #bs-skyline-progress-bar,
[data-theme="dark"] #lp-skyline-progress-bar {
    background: var(--color-accent) !important;
}

[data-theme="dark"] #bs-skyline-progress-text,
[data-theme="dark"] #lp-skyline-progress-text {
    color: var(--color-text-secondary) !important;
}

[data-theme="astro"] #bs-skyline-progress > div:first-child,
[data-theme="astro"] #lp-skyline-progress > div:first-child {
    background: var(--color-bg-tertiary) !important;
}

[data-theme="astro"] #bs-skyline-progress-bar,
[data-theme="astro"] #lp-skyline-progress-bar {
    background: var(--color-accent) !important;
}

[data-theme="astro"] #bs-skyline-progress-text,
[data-theme="astro"] #lp-skyline-progress-text {
    color: var(--color-text-secondary) !important;
}

/* Visibility table in Horizon tab */
[data-theme="dark"] .bs-visibility-grid,
[data-theme="dark"] .lp-visibility-grid {
    color: var(--color-text-primary);
}

[data-theme="dark"] .visibility-table {
    color: var(--color-text-primary);
}

[data-theme="dark"] .visibility-table td {
    border-color: var(--color-border);
}

[data-theme="astro"] .bs-visibility-grid,
[data-theme="astro"] .lp-visibility-grid {
    color: var(--color-text-primary);
}

[data-theme="astro"] .visibility-table {
    color: var(--color-text-primary);
}

[data-theme="astro"] .visibility-table td {
    border-color: var(--color-border);
}

/* Fan PDF section - separator */
[data-theme="dark"] .bs-fan-pdf-section,
[data-theme="dark"] .lp-fan-pdf-section {
    border-top-color: var(--color-border) !important;
}

[data-theme="astro"] .bs-fan-pdf-section,
[data-theme="astro"] .lp-fan-pdf-section {
    border-top-color: var(--color-accent) !important;
}

/* Fan PDF buttons - astro mode */
[data-theme="astro"] #bs-fan-pdf-mobile,
[data-theme="astro"] #lp-fan-pdf-mobile {
    border-color: var(--color-accent) !important;
    background: var(--color-bg-primary) !important;
    color: var(--color-accent) !important;
}

[data-theme="astro"] #bs-fan-pdf-full,
[data-theme="astro"] #lp-fan-pdf-full {
    border-color: var(--color-accent) !important;
    background: var(--color-accent) !important;
    color: var(--color-bg-primary) !important;
}

[data-theme="astro"] #bs-fan-pdf-status,
[data-theme="astro"] #lp-fan-pdf-status {
    color: var(--color-accent) !important;
}

/* Fan PDF buttons - dark mode */
[data-theme="dark"] #bs-fan-pdf-mobile,
[data-theme="dark"] #lp-fan-pdf-mobile {
    border-color: var(--color-accent) !important;
    background: var(--color-bg-primary) !important;
    color: var(--color-accent) !important;
}

[data-theme="dark"] #bs-fan-pdf-full,
[data-theme="dark"] #lp-fan-pdf-full {
    border-color: var(--color-accent) !important;
    background: var(--color-accent) !important;
    color: var(--color-bg-primary) !important;
}

[data-theme="dark"] #bs-fan-pdf-status,
[data-theme="dark"] #lp-fan-pdf-status {
    color: var(--color-accent) !important;
}

/* Eclipse not visible message */
[data-theme="dark"] .bs-tab-pane p[style*="color: #666"],
[data-theme="dark"] .lp-tab-pane p[style*="color: #666"] {
    color: var(--color-text-secondary) !important;
}

[data-theme="astro"] .bs-tab-pane p[style*="color: #666"],
[data-theme="astro"] .lp-tab-pane p[style*="color: #666"] {
    color: var(--color-text-secondary) !important;
}

/* Fan tab - current time display (override inline styles) */
[data-theme="dark"] #bs-fan-current-time,
[data-theme="dark"] #lp-fan-current-time {
    color: var(--color-accent) !important;
}

[data-theme="astro"] #bs-fan-current-time,
[data-theme="astro"] #lp-fan-current-time {
    color: var(--color-accent) !important;
}

/* Fan slider labels (override inline styles) */
[data-theme="dark"] .bs-fan-slider-labels,
[data-theme="dark"] .lp-fan-slider-labels,
[data-theme="dark"] .bs-fan-slider-times,
[data-theme="dark"] .lp-fan-slider-times {
    color: var(--color-text-secondary) !important;
}

[data-theme="astro"] .bs-fan-slider-labels,
[data-theme="astro"] .lp-fan-slider-labels,
[data-theme="astro"] .bs-fan-slider-times,
[data-theme="astro"] .lp-fan-slider-times {
    color: var(--color-text-secondary) !important;
}

/* Fan slider container - override inline-styled elements */
[data-theme="dark"] .bs-fan-slider-container span,
[data-theme="dark"] .lp-fan-slider-container span {
    color: var(--color-text-secondary) !important;
}

[data-theme="dark"] .bs-fan-slider-container span[style*="800080"],
[data-theme="dark"] .lp-fan-slider-container span[style*="800080"] {
    color: var(--color-accent) !important;
}

[data-theme="dark"] #bs-fan-slider,
[data-theme="dark"] #lp-fan-slider {
    background: var(--color-border) !important;
}

[data-theme="astro"] .bs-fan-slider-container span,
[data-theme="astro"] .lp-fan-slider-container span {
    color: var(--color-text-secondary) !important;
}

[data-theme="astro"] .bs-fan-slider-container span[style*="800080"],
[data-theme="astro"] .lp-fan-slider-container span[style*="800080"] {
    color: var(--color-accent) !important;
}

[data-theme="astro"] #bs-fan-slider,
[data-theme="astro"] #lp-fan-slider {
    background: var(--color-border) !important;
}

/* Fan slider markers and tics - apply filter to convert purple to red in Astro mode */
[data-theme="astro"] .bs-fan-slider-container div[style*="background"],
[data-theme="astro"] .lp-fan-slider-container div[style*="background"] {
    filter: hue-rotate(-40deg) saturate(1.5) !important;
}

/* Astro mode: General filter for Fan tab to convert purples to reds */
[data-theme="astro"] .bs-tab-pane[data-tab="fan"] .bs-fan-slider-container,
[data-theme="astro"] .lp-tab-pane[data-tab="fan"] .lp-fan-slider-container {
    filter: hue-rotate(-40deg);
}

/* But keep text readable */
[data-theme="astro"] .bs-tab-pane[data-tab="fan"] .bs-fan-slider-container span,
[data-theme="astro"] .lp-tab-pane[data-tab="fan"] .lp-fan-slider-container span {
    filter: none;
    color: var(--color-text-secondary) !important;
}

/* Dark mode tics */
[data-theme="dark"] .bs-fan-slider-container div[style*="background:#999"],
[data-theme="dark"] .bs-fan-slider-container div[style*="background: #999"],
[data-theme="dark"] .lp-fan-slider-container div[style*="background:#999"],
[data-theme="dark"] .lp-fan-slider-container div[style*="background: #999"] {
    background: var(--color-border-strong) !important;
}

/* Dark mode: Fan slider */
[data-theme="dark"] #lp-fan-slider,
[data-theme="dark"] #bs-fan-slider {
    background: linear-gradient(to right, var(--color-border) 0%, var(--color-accent) 50%, var(--color-border) 100%);
}

[data-theme="dark"] #lp-fan-slider::-webkit-slider-thumb,
[data-theme="dark"] #bs-fan-slider::-webkit-slider-thumb {
    background: var(--color-accent);
    border-color: var(--color-bg-primary);
}

[data-theme="dark"] #lp-fan-slider::-moz-range-thumb,
[data-theme="dark"] #bs-fan-slider::-moz-range-thumb {
    background: var(--color-accent);
    border-color: var(--color-bg-primary);
}

[data-theme="dark"] #lp-fan-current-time,
[data-theme="dark"] #bs-fan-current-time {
    color: var(--color-accent);
}