/* Teopédia Podcasts 0.1.5 */
.tp-podcast {
    --tp-dark: #17362f;
    --tp-dark-2: #0f2a24;
    --tp-cream: #f5eedc;
    --tp-cream-hover: #efe5ca;
    --tp-cream-border: #dec99b;
    --tp-muted: #68736f;
    --tp-player-bg: #f7f5ee;
    --tp-player-border: #e4dfd2;
    --tp-track: #d1d8d4;
    --tp-progress: #17362f;
    display: block !important;
    width: 100% !important;
    margin: 0 0 1rem !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    font: inherit !important;
}

.tp-podcast__control-row {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    gap: .75rem !important;
    margin: 0 0 .62rem !important;
    padding: 0 !important;
}

/* Podcast button: visually aligned with the native Teopédia reader button. */
.tp-podcast .tp-podcast__toggle {
    all: unset !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    gap: .42rem !important;
    min-height: 48px !important;
    padding: .72rem 1.45rem !important;
    margin: 0 !important;
    border: 1px solid var(--tp-cream-border) !important;
    border-radius: 999px !important;
    background: var(--tp-cream) !important;
    color: var(--tp-dark) !important;
    font-family: inherit !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    text-decoration: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    transition: background-color .14s ease, border-color .14s ease, color .14s ease !important;
}

.tp-podcast .tp-podcast__toggle:hover,
.tp-podcast .tp-podcast__toggle:focus-visible {
    background: var(--tp-cream-hover) !important;
    border-color: var(--tp-cream-border) !important;
    color: var(--tp-dark) !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

.tp-podcast .tp-podcast__toggle.is-active,
.tp-podcast .tp-podcast__toggle.is-active:hover,
.tp-podcast .tp-podcast__toggle.is-active:focus-visible {
    background: var(--tp-dark) !important;
    border-color: var(--tp-dark-2) !important;
    color: #fff !important;
}

.tp-podcast .tp-podcast__toggle:focus-visible {
    outline: 2px solid rgba(23,54,47,.22) !important;
    outline-offset: 2px !important;
}

.tp-podcast__icon,
.tp-podcast__toggle-label {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    line-height: 1 !important;
    color: inherit !important;
    white-space: nowrap !important;
}

.tp-podcast__icon svg {
    display: block !important;
    width: 15px !important;
    height: 15px !important;
    stroke: currentColor !important;
}

.tp-podcast__player {
    display: block !important;
    width: min(100%, 650px) !important;
    max-width: 650px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.tp-podcast__player[hidden] {
    display: none !important;
}

.tp-podcast__audio {
    display: none !important;
}

.tp-podcast .tp-podcast__bar {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: .52rem !important;
    width: 100% !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: .38rem .72rem !important;
    border: 1px solid var(--tp-player-border) !important;
    border-radius: 999px !important;
    background: var(--tp-player-bg) !important;
    color: var(--tp-dark) !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

.tp-podcast .tp-podcast__play,
.tp-podcast .tp-podcast__speed,
.tp-podcast .tp-podcast__volume {
    all: unset !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    color: var(--tp-dark) !important;
    font-family: inherit !important;
    cursor: pointer !important;
    line-height: 1 !important;
    box-shadow: none !important;
}

.tp-podcast .tp-podcast__play {
    width: 27px !important;
    height: 27px !important;
    border-radius: 50% !important;
}

.tp-podcast .tp-podcast__play-icon {
    position: relative !important;
    display: block !important;
    width: 11px !important;
    height: 12px !important;
}

.tp-podcast .tp-podcast__play-icon::before {
    content: '' !important;
    position: absolute !important;
    left: 2px !important;
    top: 1px !important;
    width: 0 !important;
    height: 0 !important;
    border-top: 5px solid transparent !important;
    border-bottom: 5px solid transparent !important;
    border-left: 8px solid var(--tp-dark) !important;
}

.tp-podcast .tp-podcast__play.is-playing .tp-podcast__play-icon::before,
.tp-podcast .tp-podcast__play.is-playing .tp-podcast__play-icon::after {
    content: '' !important;
    position: absolute !important;
    top: 1px !important;
    width: 3px !important;
    height: 10px !important;
    border: 0 !important;
    background: var(--tp-dark) !important;
}

.tp-podcast .tp-podcast__play.is-playing .tp-podcast__play-icon::before {
    left: 1px !important;
}

.tp-podcast .tp-podcast__play.is-playing .tp-podcast__play-icon::after {
    right: 1px !important;
}

.tp-podcast .tp-podcast__speed {
    min-width: 32px !important;
    height: 27px !important;
    border-radius: 6px !important;
    font-size: .77rem !important;
    font-weight: 700 !important;
}

.tp-podcast .tp-podcast__volume {
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
}

.tp-podcast .tp-podcast__play:hover,
.tp-podcast .tp-podcast__speed:hover,
.tp-podcast .tp-podcast__volume:hover {
    background: rgba(23,54,47,.07) !important;
    color: var(--tp-dark) !important;
}

.tp-podcast .tp-podcast__play:focus-visible,
.tp-podcast .tp-podcast__speed:focus-visible,
.tp-podcast .tp-podcast__volume:focus-visible,
.tp-podcast .tp-podcast__progress:focus-visible {
    outline: 2px solid rgba(23,54,47,.20) !important;
    outline-offset: 1px !important;
}

.tp-podcast__volume svg {
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    stroke: currentColor !important;
}

.tp-podcast__time {
    display: inline-block !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--tp-muted) !important;
    font-family: inherit !important;
    font-size: .76rem !important;
    font-weight: 500 !important;
    font-variant-numeric: tabular-nums !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

.tp-podcast .tp-podcast__progress {
    --tp-progress-pct: 0%;
    -webkit-appearance: none !important;
    appearance: none !important;
    box-sizing: border-box !important;
    flex: 1 1 260px !important;
    min-width: 110px !important;
    width: auto !important;
    height: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: 0 !important;
    cursor: pointer !important;
    accent-color: var(--tp-dark) !important;
}

.tp-podcast .tp-podcast__progress::-webkit-slider-runnable-track {
    height: 3px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(to right, var(--tp-progress) 0, var(--tp-progress) var(--tp-progress-pct), var(--tp-track) var(--tp-progress-pct), var(--tp-track) 100%) !important;
    box-shadow: none !important;
}

.tp-podcast .tp-podcast__progress::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 10px !important;
    height: 10px !important;
    margin-top: -3.5px !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: var(--tp-dark) !important;
    box-shadow: none !important;
}

.tp-podcast .tp-podcast__progress::-moz-range-track {
    height: 3px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: var(--tp-track) !important;
    box-shadow: none !important;
}

.tp-podcast .tp-podcast__progress::-moz-range-progress {
    height: 3px !important;
    border-radius: 999px !important;
    background: var(--tp-progress) !important;
}

.tp-podcast .tp-podcast__progress::-moz-range-thumb {
    width: 10px !important;
    height: 10px !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: var(--tp-dark) !important;
    box-shadow: none !important;
}

@media (max-width: 640px) {
    .tp-podcast__control-row {
        gap: .55rem !important;
    }
    .tp-podcast .tp-podcast__toggle {
        min-height: 44px !important;
        padding: .68rem 1.05rem !important;
    }
    .tp-podcast .tp-podcast__bar {
        gap: .38rem !important;
        padding-left: .52rem !important;
        padding-right: .52rem !important;
    }
    .tp-podcast .tp-podcast__progress {
        min-width: 72px !important;
    }
    .tp-podcast .tp-podcast__speed {
        display: none !important;
    }
}