.learning ~ .accordion.accordion-reverse.inner-search .accordion-item,
.learning ~ .accordion.accordion-reverse.inner-search .accordion-header {
    background-color: var(--learning-section-background-color);
}

.learning ~ .inner-search .accordion-item,
.learning ~ .inner-search .accordion-header {
    background-color: var(--learning-section-background-color);
}

.learning ~ .inner-search .accordion-header a[data-bs-toggle="collapse"] {
    color: var(--learning-section-expand-btn-text-color);
}

.learning ~ .inner-search .accordion-header:hover a[data-bs-toggle="collapse"] {
    color: var(--learning-section-expand-btn-text-color-hover);
}

.learning ~ .accordion.accordion-reverse.inner-search .ls-custom-field-filter .accordion-item {
    flex-direction: column;
    background-color: var(--white-01);
    border-radius: 8px !important;
}

.learning ~ .accordion.accordion-reverse.inner-search .ls-custom-field-filter .accordion-header {
    background-color: var(--grey-01);
}

.learning ~ .accordion.accordion-reverse.inner-search .ls-custom-field-filter .accordion-header a.accordion-title {
    justify-content: flex-start !important;
    text-align: left !important;
    color: var(--primary);
    font-weight: 500 !important;
}

.learning ~ .accordion.accordion-reverse.inner-search .ls-custom-field-filter .accordion-header:hover a[data-bs-toggle="collapse"] {
    color: var(--primary);
}

.learning ~ .accordion.accordion-reverse.inner-search [aria-expanded="true"] + .wdk-search-advanced {
    max-height: calc(100vh - 120px) !important;
    overflow-y: auto !important;
    overscroll-behavior: none;
}

.learning ~ .accordion.accordion-reverse.inner-search .wdk-search-advanced .wdk-search-advanced-footer {
    position: sticky;
    bottom: -16px;
    z-index: 1;
}

.certificate ~ .accordion.accordion-reverse.inner-search .accordion-item,
.certificate ~ .accordion.accordion-reverse.inner-search .accordion-header{
    background-color: var(--certificate-section-background-color);
}

.certificate ~ .inner-search .accordion-header a[data-bs-toggle="collapse"] {
    color: var(--certificate-section-expand-btn-text-color);
}

.certificate ~ .inner-search .accordion-header:hover a[data-bs-toggle="collapse"] {
    color: var(--certificate-section-expand-btn-text-color-hover);
}

.learning-marketplace ~ section {
    background-color: var(--learning-marketplace-gallery-section-background-color);
}

.learning-marketplace ~ section [aria-expanded="true"] + .wdk-search-advanced {
    max-height: calc(100vh - 120px) !important;
    overflow-y: auto !important;
    overscroll-behavior: none;
}

.learning ~ div .ls-tag .wdk-tag,
.certificate ~ div .ls-tag .wdk-tag {
    background-color: var(--tertiary) !important;
    color: var(--white-01) !important;
}

.learning ~ div .ls-tag .icon-close,
.learning ~ div .ls-tag .icon-folder_special,
.learning ~ div .ls-tag .fw-bold,
.certificate ~ div .ls-tag .icon-close,
.certificate ~ div .ls-tag .icon-folder_special,
.certificate ~ div .ls-tag .fw-bold {
    color: var(--white-01) !important;
}

.learning ~ div .ls-tag .icon-close:hover,
.learning ~ div .ls-tag .icon-close:active,
.certificate ~ div .ls-tag .icon-close:hover,
.certificate ~ div .ls-tag .icon-close:active {
    color: tomato !important;
    background: none !important;
}

.learning ~ div .ls-tag:hover [class*="icon"],
.certificate ~ div .ls-tag:hover [class*="icon"]{
    background: none !important;
}

/* Custom Tabs */
.learning ~ div .nav.nav-pills.nav-fill .nav-link {
    color: var(--learning-tabs-btn-text-color) !important;
    background-color: var(--learning-tabs-btn-background-color) !important;
}

.learning ~ div .nav.nav-pills.nav-fill .nav-link:hover {
    color: var(--learning-tabs-btn-text-color-hover) !important;
    background-color: var(--learning-tabs-btn-background-color-hover) !important;
}

.learning ~ div .nav.nav-pills.nav-fill .nav-link.active {
    color: var(--learning-tabs-btn-text-color-active) !important;
    background-color: var(--learning-tabs-btn-background-color-active) !important;
}

.learning ~ div .nav.nav-pills.nav-fill .nav-link.active:hover {
    color: var(--learning-tabs-btn-text-color-active-hover) !important;
    background-color: var(--learning-tabs-btn-background-color-active-hover) !important;
}

/* Player de áudio do preview de voz (barra fixa acima do footer) */
.voice-player {
    position: fixed;
    bottom: 60px;
    left: var(--sidebar-expanded-width);
    width: calc(100% - var(--sidebar-expanded-width));
    z-index: 4001;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 24px;
    background-color: var(--system-main-background-color);
    border-top: 1px solid var(--wdk-footer-border-color);
    box-shadow: 0px -2px 6px rgb(0 0 0 / 10%);
}

.voice-player .btn i {
    margin: 0;
}

body.alert-show.alert-bottom .voice-player {
    bottom: 122px;
}

#sidebar-trigger:checked ~ .wdk-layout .voice-player {
    width: calc(100% - 58px);
    left: 58px;
}

@media (max-width: 992px) {
    .voice-player,
    #sidebar-trigger:checked ~ .wdk-layout .voice-player {
        width: 100%;
        left: 0;
    }
}

.voice-player .voice-player-info {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.voice-player .voice-player-controls {
    display: flex;
    align-items: center;
    gap: 8px;
}

.voice-player .voice-player-progress {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
}

.voice-player .voice-player-progress .form-input-range {
    flex: 1;
}

/* Barra de progresso do player: trilho cinza claro, progresso cinza escuro (sem bolinha protuberante) */
#voicePlayerBar {
    overflow: hidden;
    height: 8px;
    margin: 0;
    align-self: center;
    border: none;
    border-radius: 8px;
    background: transparent;
    -webkit-appearance: none;
}
#voicePlayerBar::-webkit-slider-runnable-track {
    height: 8px;
    border-radius: 8px;
    background-color: var(--grey-02);
}
#voicePlayerBar::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 8px;
    height: 8px;
    margin-top: 0;
    border: none;
    border-radius: 50%;
    background: var(--primary);
    box-shadow: -1000px 0 0 1000px var(--primary);
    cursor: grab;
}
#voicePlayerBar::-moz-range-track {
    height: 8px;
    border-radius: 8px;
    background-color: var(--grey-02);
}
#voicePlayerBar::-moz-range-progress {
    height: 8px;
    border-radius: 8px;
    background-color: var(--primary);
}
#voicePlayerBar::-moz-range-thumb {
    width: 8px;
    height: 8px;
    border: none;
    border-radius: 50%;
    background: var(--primary);
}

/* Barra de volume de fundo: trilho cinza claro, progresso cinza escuro, COM bolinha visível */
#Background_Volume {
    -webkit-appearance: none;
    height: 16px;
    margin: 0;
    align-self: center;
    overflow: visible;
    background: transparent;
}
#Background_Volume::-webkit-slider-runnable-track {
    height: 8px;
    border-radius: 8px;
    background: linear-gradient(to right, var(--primary) 0, var(--primary) var(--bg-vol, 60%), var(--grey-02) var(--bg-vol, 60%), var(--grey-02) 100%);
}
#Background_Volume::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 16px;
    height: 16px;
    margin-top: -4px;
    border: none;
    border-radius: 50%;
    background: var(--primary);
    box-shadow: none;
    cursor: grab;
}
#Background_Volume::-moz-range-track {
    height: 8px;
    border-radius: 8px;
    background: var(--grey-02);
}
#Background_Volume::-moz-range-progress {
    height: 8px;
    border-radius: 8px;
    background: var(--primary);
}
#Background_Volume::-moz-range-thumb {
    width: 16px;
    height: 16px;
    border: none;
    border-radius: 50%;
    background: var(--primary);
}

.voice-player .voice-player-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: var(--primary);
    color: #fff;
}

.voice-player .voice-player-toggle i {
    color: #fff;
}

/* Botões do player como icon buttons, sem sombra de fundo */
.voice-player .btn,
.voice-player .btn:active {
    box-shadow: none;
}

/* Empty state da tabela de vozes: flat, integrado à tabela (sem card/sombra) */
.voice-empty-state {
    background-color: var(--table-line-odd-background-color);
    border-radius: var(--radius-mini);
    color: var(--grey-03);
    text-align: center;
    padding: 20px 16px;
}