/**
 * Castory — Mobile UI: footer, theme toggle, BuddyBoss panel, episode cards
 */

/* Episode page play button — all breakpoints */
.castory-episode-page__play .castory-btn-play-episode {
    min-height: 48px;
    padding: 12px 24px;
    font-size: 1rem;
    font-weight: 700;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: linear-gradient(135deg, #776cfe, #a03cff);
    color: #fff !important;
    border: none;
    cursor: pointer;
    box-shadow: 0 6px 20px rgba(119, 108, 254, 0.35);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.castory-episode-page__play .castory-btn-play-episode.is-playing {
    background: linear-gradient(135deg, #00ea99, #776cfe);
}

.castory-episode-page__play .castory-btn-play-episode:hover {
    box-shadow: 0 8px 24px rgba(119, 108, 254, 0.45);
}

@media (max-width: 768px) {
    /* Hide Castory footer bar on mobile — theme toggle moves to header */
    .castory-site-footer-bar {
        display: none !important;
    }

    body.castory-theme-enabled:not(.castbox-player-active) {
        padding-bottom: 0;
    }

    /* Hide BuddyBoss site footer on mobile */
    #colophon,
    .site-footer,
    .footer-bottom,
    .bb-footer {
        display: none !important;
    }

    /* Theme toggle in header */
    .castory-theme-toggle--header {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        min-width: 36px;
        padding: 0 !important;
        border-radius: 50% !important;
        margin-left: 6px;
    }

    .castory-theme-toggle--header .castory-theme-toggle__label {
        display: none;
    }

    /* bb-mobile-panel theme-aware */
    html[data-castory-theme] .bb-mobile-panel-wrapper .bb-mobile-panel,
    html[data-castory-theme] .bb-mobile-panel {
        background: var(--castory-surface, #1a1d29) !important;
        color: var(--castory-text, #f3f4f6) !important;
        border-color: var(--castory-border, #2d3748) !important;
    }

    html[data-castory-theme="light"] .bb-mobile-panel-wrapper .bb-mobile-panel,
    html[data-castory-theme="light"] .bb-mobile-panel {
        background: #ffffff !important;
        color: #111827 !important;
        box-shadow: -4px 0 24px rgba(15, 17, 26, 0.12);
    }

    html[data-castory-theme] .bb-mobile-panel a,
    html[data-castory-theme] .bb-mobile-panel .bb-icon,
    html[data-castory-theme] .bb-mobile-panel i {
        color: var(--castory-text, #f3f4f6) !important;
    }

    html[data-castory-theme="light"] .bb-mobile-panel a,
    html[data-castory-theme="light"] .bb-mobile-panel .bb-icon,
    html[data-castory-theme="light"] .bb-mobile-panel i {
        color: #374151 !important;
    }

    html[data-castory-theme] .bb-mobile-panel .current-menu-item > a,
    html[data-castory-theme] .bb-mobile-panel .selected > a {
        color: var(--cast-primary, #776cfe) !important;
    }

    /* Episode cards — Castbox-style compact grid on podcast page */
    .castbox-page .episodes-list--cards {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
    }

    .castbox-page .episode-card--tile {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        padding: 0;
        gap: 0;
        border-radius: 10px;
        border: none;
        background: transparent;
        box-shadow: none;
        aspect-ratio: auto;
    }

    html[data-castory-theme="light"] .castbox-page .episode-card--tile {
        background: transparent;
        border: none;
        box-shadow: none;
    }

    .castbox-page .episode-card--tile:hover {
        transform: none;
        box-shadow: none;
    }

    .castbox-page .episode-card__cover {
        width: 100%;
        height: auto;
        aspect-ratio: 1 / 1;
        border-radius: 8px;
        overflow: hidden;
    }

    .castbox-page .episode-card__cover img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        aspect-ratio: 1 / 1;
    }

    .castbox-page .episode-card__cover-overlay {
        opacity: 1;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.02) 45%, rgba(0, 0, 0, 0.5) 100%);
    }

    .castbox-page .episode-card__play-btn--overlay {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        font-size: 0.78rem !important;
    }

    .castbox-page .episode-card--tile .episode-card__body {
        display: block;
        padding: 6px 2px 0;
    }

    .castbox-page .episode-card--tile .episode-details__top,
    .castbox-page .episode-card__actions-row,
    .castbox-page .episode-card--tile .episode-desc,
    .castbox-page .episode-card--tile .episode-tags,
    .castbox-page .episode-card--tile .episode-guest,
    .castbox-page .episode-card--tile .castory-published-date,
    .castbox-page .episode-card--tile .episode-meta .castory-episode-discuss {
        display: none !important;
    }

    .castbox-page .episode-card--tile .episode-title {
        font-size: 0.7rem;
        font-weight: 600;
        line-height: 1.3;
        margin: 0 0 3px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .castbox-page .episode-card--tile .episode-title__link {
        color: inherit;
    }

    .castbox-page .episode-card--tile .episode-meta {
        display: flex;
        flex-wrap: nowrap;
        gap: 4px;
        margin: 0;
        font-size: 0.6rem;
        color: var(--castory-text-muted, #9ca3af);
    }

  /* Hide season/episode line — keep duration only (Castbox-style) */
    .castbox-page .episode-card--tile .episode-meta > span:first-child {
        display: none;
    }

    .castbox-page .episode-card__play-btn--inline {
        display: none !important;
    }

    @media (max-width: 360px) {
        .castbox-page .episodes-list--cards {
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px;
        }
    }

    /* Episode page play button mobile sizing */
    .castory-episode-page__play .castory-btn-play-episode {
        width: 100%;
        max-width: 320px;
    }
}

/* Dark mode header icon contrast boost */
html[data-castory-theme="dark"] .bb-mobile-header .header-aside a,
html[data-castory-theme="dark"] .bb-mobile-header .header-aside .bb-icon,
html[data-castory-theme="dark"] .bb-mobile-header .header-aside i,
body.bb-dark-theme .bb-mobile-header .header-aside a,
body.dark-mode .bb-mobile-header .header-aside a {
    color: #f9fafb !important;
    opacity: 1 !important;
}

html[data-castory-theme="dark"] .site-header-container .notification-link,
body.bb-dark-theme .site-header-container .notification-link,
body.dark-mode .site-header-container .notification-link {
    color: #ffffff !important;
}

html[data-castory-theme="dark"] .site-header-container a:hover,
html[data-castory-theme="dark"] .bb-mobile-header a:hover {
    color: var(--cast-primary, #a78bfa) !important;
}