/**
 * INCAOP — Estils personalitzats per LearnDash.
 * Versió 1.7.6 — Correcció botons Expandir (seccions 3 i 4) + paginació
 *                 (secció 16) + pestanyes Contingut/Materials (secció 15:
 *                 remap blau→taronja + treu el fons taronja del Kit de les
 *                 inactives perquè l'activa destaqui, no al revés).
 */

/* ═════════════════════════════════════════════════════════════
   1. TÍTOL PRINCIPAL DE LA PÀGINA — Reforçament
   ═════════════════════════════════════════════════════════════ */

body.single-sfwd-courses .page-header .entry-title,
body.single-sfwd-lessons .page-header .entry-title,
body.single-sfwd-topic .page-header .entry-title,
body.single-sfwd-quiz .page-header .entry-title,
body.single-sfwd-courses h1.entry-title,
body.single-sfwd-lessons h1.entry-title,
body.single-sfwd-topic h1.entry-title,
body.single-sfwd-quiz h1.entry-title {
    font-size: 2.25rem !important;
    line-height: 1.2 !important;
    margin: 0 0 0.5em 0 !important;
    font-weight: 700 !important;
}

body.single-sfwd-courses .page-header,
body.single-sfwd-lessons .page-header,
body.single-sfwd-topic .page-header,
body.single-sfwd-quiz .page-header {
    padding: 1rem 0 !important;
    margin-bottom: 1rem !important;
}

/* ═════════════════════════════════════════════════════════════
   2. ELIMINAR SUBRATLLATS EN HOVER
   ═════════════════════════════════════════════════════════════ */

.learndash-wrapper a,
.learndash-wrapper a:hover,
.learndash-wrapper a:focus,
.learndash-wrapper a:active,
.learndash-wrapper button,
.learndash-wrapper button:hover,
.learndash-wrapper button:focus,
.learndash-wrapper button:active,
.learndash-wrapper .ld-accordion__item-title,
.learndash-wrapper .ld-accordion__item-title:hover,
.learndash-wrapper .ld-accordion__item-title:focus {
    text-decoration: none !important;
    text-decoration-line: none !important;
    text-decoration-color: transparent !important;
}

.learndash-wrapper a:focus-visible,
.learndash-wrapper button:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
    border-radius: 4px;
}

/* ═════════════════════════════════════════════════════════════
   3. BOTONS "EXPANDIR TOT"
   ═════════════════════════════════════════════════════════════ */

.learndash-wrapper .ld-accordion__expand-button.ld-accordion__expand-button--all {
    font-weight: 600 !important;
    padding: 0.65em 1.25em !important;
    border: 0 !important;              /* mata la línia blava de LearnDash */
    border-radius: 8px !important;
    margin-bottom: 0 !important;       /* anul·la el margin-bottom: -2px de LD */
    transition: filter 0.15s ease !important;
    opacity: 1 !important;
}

/* El hover re-declara TOTA la geometria perquè res la col·lapsi */
.learndash-wrapper .ld-accordion__expand-button--all:hover,
.learndash-wrapper .ld-accordion__expand-button--all:focus {
    padding: 0.65em 1.25em !important;
    border: 0 !important;
    border-radius: 8px !important;
    margin-bottom: 0 !important;
    opacity: 1 !important;
    filter: brightness(0.92) !important;
}

/* ═════════════════════════════════════════════════════════════
   4. BOTONS LATERALS "EXPANDIR" — FORÇA MÀXIMA
   ═════════════════════════════════════════════════════════════ */

/* Contenidor del botó: no estirar-lo verticalment */
.learndash-wrapper .ld-accordion__item-header--lesson {
    align-items: center !important;
}

/* El botó en si */
.learndash-wrapper button.ld-accordion__expand-button--lesson,
.learndash-wrapper .ld-accordion__expand-button.ld-accordion__expand-button--lesson {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5em !important;
    min-width: 130px !important;
    max-width: 180px !important;
    height: auto !important;
    max-height: 48px !important;
    padding: 0.5em 1em !important;
    border: 0 !important;              /* mata la línia blava */
    border-radius: 6px !important;
    margin-bottom: 0 !important;       /* anul·la el margin-bottom negatiu */
    align-self: center !important;
    flex-shrink: 0 !important;
    transition: filter 0.15s ease !important;
    opacity: 1 !important;
    line-height: 1.2 !important;
}

/* El hover repeteix la geometria per bloquejar qualsevol col·lapse */
.learndash-wrapper .ld-accordion__expand-button--lesson:hover,
.learndash-wrapper .ld-accordion__expand-button--lesson:focus {
    display: inline-flex !important;
    min-width: 130px !important;
    max-width: 180px !important;
    padding: 0.5em 1em !important;
    border: 0 !important;
    border-radius: 6px !important;
    margin-bottom: 0 !important;
    filter: brightness(0.92) !important;
    opacity: 1 !important;
}

/* EL TEXT: força bruta contra qualsevol regla que l'amagui */
.learndash-wrapper button.ld-accordion__expand-button .ld-accordion__expand-button-text,
.learndash-wrapper .ld-accordion__expand-button .ld-accordion__expand-button-text,
.learndash-wrapper .ld-accordion__expand-button-text,
.learndash-wrapper [data-ld-expand-button-text-element="true"] {
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: 0.9rem !important;
    font-family: inherit !important;
    text-transform: none !important;
    letter-spacing: 0.02em !important;
    line-height: 1.2 !important;

    /* Desfem qualsevol tècnica d'ocultació */
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;

    /* Anti screen-reader-text hack */
    clip: auto !important;
    clip-path: none !important;
    overflow: visible !important;
    text-indent: 0 !important;
    white-space: nowrap !important;

    /* Contra transform/scale */
    transform: none !important;
}

/* Icones (fletxes) */
.learndash-wrapper .ld-accordion__expand-button-icon,
.learndash-wrapper .ld-accordion__expand-button svg {
    color: #ffffff !important;
    fill: currentColor !important;
    width: 20px !important;
    height: 20px !important;
    flex-shrink: 0 !important;
}

/* Screen-reader-text redundant SÍ que ha d'estar amagat */
.learndash-wrapper .ld-accordion__expand-button .screen-reader-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(1px, 1px, 1px, 1px) !important;
    white-space: nowrap !important;
}

/* ═════════════════════════════════════════════════════════════
   5. TÍTOLS DE LLIÇÓ / TEMA / QÜESTIONARI
   ═════════════════════════════════════════════════════════════ */

.learndash-wrapper .ld-accordion__item-title {
    font-weight: 600 !important;
    color: inherit !important;
    transition: color 0.15s ease !important;
}

.learndash-wrapper .ld-accordion__item-title:hover,
.learndash-wrapper .ld-accordion__item-title:focus {
    color: #d94b1e !important;
}

.learndash-wrapper .ld-accordion__heading {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    margin: 0 !important;
}

/* ═════════════════════════════════════════════════════════════
   6. TARGETES DE LLIÇÓ
   ═════════════════════════════════════════════════════════════ */

.learndash-wrapper .ld-accordion__item--lesson {
    border-radius: 8px !important;
    overflow: hidden !important;
    transition: box-shadow 0.15s ease !important;
}

.learndash-wrapper .ld-accordion__item--lesson:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
}

.learndash-wrapper .ld-accordion__item-attributes--lesson {
    color: #6b7280 !important;
    font-size: 0.9rem !important;
}

.learndash-wrapper .ld-accordion__item-attribute-icon {
    width: 18px !important;
    height: 18px !important;
    vertical-align: middle !important;
}

/* ═════════════════════════════════════════════════════════════
   7. BARRA DE PROGRÉS DEL CURS
   ═════════════════════════════════════════════════════════════ */

.learndash-wrapper .ld-progress-bar {
    padding: 1rem 0 !important;
    border-bottom: 1px solid #e5e7eb !important;
    margin-bottom: 1.5rem !important;
}

.learndash-wrapper .ld-progress-bar__label--progress {
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #6b7280 !important;
}

.learndash-wrapper .ld-progress-bar__meter-percentage {
    font-weight: 700 !important;
    font-size: 0.95rem !important;
}

.learndash-wrapper .ld-progress-bar__meter-background {
    background-color: #e5e7eb !important;
    border-radius: 999px !important;
    height: 8px !important;
    overflow: hidden !important;
}

.learndash-wrapper .ld-progress-bar__meter-foreground {
    border-radius: 999px !important;
    height: 100% !important;
    transition: width 0.3s ease !important;
}

/* ═════════════════════════════════════════════════════════════
   8. ITEMS DE TEMA I QÜESTIONARI
   ═════════════════════════════════════════════════════════════ */

.learndash-wrapper .ld-accordion__item--lesson-topic,
.learndash-wrapper .ld-accordion__item--topic-quiz,
.learndash-wrapper .ld-accordion__item--lesson-quiz {
    padding: 0.65rem 0.5rem !important;
    border-radius: 6px !important;
    transition: background-color 0.15s ease !important;
}

.learndash-wrapper .ld-accordion__item--lesson-topic:hover,
.learndash-wrapper .ld-accordion__item--topic-quiz:hover,
.learndash-wrapper .ld-accordion__item--lesson-quiz:hover {
    background-color: rgba(0, 0, 0, 0.02) !important;
}

/* Completat → verd (progressió). Aquest LearnDash fa servir icones de FONT
   (.ld-icon-*) i marca el completat amb .learndash-complete al contenidor i
   .ld-{lesson,topic,quiz}-complete a .ld-status-icon (que porta .ld-secondary-color,
   qui el pintava navy). Especificitat alta per guanyar-li. */
.learndash-wrapper .ld-table-list-item.learndash-complete .ld-status-icon,
.learndash-wrapper .ld-status-icon.ld-lesson-complete,
.learndash-wrapper .ld-status-icon.ld-topic-complete,
.learndash-wrapper .ld-status-icon.ld-quiz-complete {
    color: #16a34a !important;
    fill: #16a34a !important;
}

/* ═════════════════════════════════════════════════════════════
   9. RESPONSIVE — MÒBILS
   ═════════════════════════════════════════════════════════════ */

@media (max-width: 720px) {
    body.single-sfwd-courses .page-header .entry-title,
    body.single-sfwd-lessons .page-header .entry-title,
    body.single-sfwd-topic .page-header .entry-title,
    body.single-sfwd-quiz .page-header .entry-title {
        font-size: 1.5rem !important;
    }

    .learndash-wrapper button.ld-accordion__expand-button--lesson {
        min-width: 90px !important;
        max-width: 120px !important;
        padding: 0.5em 0.7em !important;
    }

    .learndash-wrapper .ld-accordion__expand-button-text {
        font-size: 0.8rem !important;
    }
}

/* ═════════════════════════════════════════════════════════════
   10. FOCUS MODE — Vista quan l'alumna està dins d'una lliçó/tema/qüestionari
   ═════════════════════════════════════════════════════════════ */

/* Títol de la lliçó/tema/qüestionari — reduir mida */
body.single-sfwd-lessons .ld-focus-main-content .entry-title,
body.single-sfwd-topic .ld-focus-main-content .entry-title,
body.single-sfwd-quiz .ld-focus-main-content .entry-title,
body.single-sfwd-lessons .entry-header .entry-title,
body.single-sfwd-topic .entry-header .entry-title,
body.single-sfwd-quiz .entry-header .entry-title,
.ld-focus-content .entry-title,
.ld-focus-main-content .entry-title {
    font-size: 2rem !important;
    line-height: 1.25 !important;
    margin: 0 0 0.75rem 0 !important;
    font-weight: 700 !important;
}

/* Header del contingut (contenidor del H1) — espaiat més compacte */
.ld-focus-content .entry-header,
.ld-focus-main-content .entry-header {
    padding: 1.5rem 0 !important;
    margin-bottom: 1rem !important;
    border-bottom: 1px solid #e5e7eb !important;
}

/* Breadcrumbs — estil discret */
.ld-focus-content .ld-breadcrumbs,
.learndash-wrapper .ld-breadcrumbs {
    font-size: 0.85rem !important;
    color: #6b7280 !important;
    padding: 0 !important;
    margin: 0 0 0.75rem 0 !important;
    background: transparent !important;
    border: none !important;
}

.ld-focus-content .ld-breadcrumbs a,
.learndash-wrapper .ld-breadcrumbs a {
    color: #6b7280 !important;
    font-weight: 500 !important;
}

.ld-focus-content .ld-breadcrumbs a:hover,
.learndash-wrapper .ld-breadcrumbs a:hover {
    color: #d94b1e !important;
}

.ld-focus-content .ld-breadcrumbs__separator,
.learndash-wrapper .ld-breadcrumbs__separator {
    color: #d1d5db !important;
    margin: 0 0.4rem !important;
}

/* ═════════════════════════════════════════════════════════════
   11. HEADER STICKY DEL FOCUS MODE
   ═════════════════════════════════════════════════════════════ */

.ld-focus-header {
    padding: 0.75rem 1.5rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
    border-bottom: 1px solid #e5e7eb !important;
}

/* Barra de progrés del curs a dalt (petita) */
.ld-focus-header .ld-progress-bar {
    padding: 0 !important;
    border: none !important;
    margin: 0 !important;
}

.ld-focus-header .ld-progress-bar__meter-background {
    background-color: rgba(0, 0, 0, 0.08) !important;
    height: 6px !important;
    border-radius: 999px !important;
}

.ld-focus-header .ld-progress-bar__meter-foreground {
    border-radius: 999px !important;
    height: 100% !important;
}

.ld-focus-header .ld-progress-bar__label {
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #6b7280 !important;
}

.ld-focus-header .ld-progress-bar__meter-percentage {
    font-size: 0.85rem !important;
    font-weight: 700 !important;
    color: #111827 !important;
}

/* Botó "Següent Tema" més visible */
.ld-focus-header .ld-focus-header__user-status,
.ld-focus-header__user-status {
    font-weight: 600 !important;
    font-size: 0.95rem !important;
    padding: 0.5em 1em !important;
    border-radius: 6px !important;
    transition: background-color 0.15s ease !important;
}

.ld-focus-header .ld-focus-header__user-status:hover,
.ld-focus-header__user-status:hover {
    background-color: rgba(0, 0, 0, 0.04) !important;
    color: #d94b1e !important;
}

/* ═════════════════════════════════════════════════════════════
   12. SIDEBAR DEL FOCUS MODE
   ═════════════════════════════════════════════════════════════ */

.ld-focus-sidebar {
    border-right: 1px solid #e5e7eb !important;
    background: #f9fafb !important;
}

/* Header del curs a la sidebar (barra blava amb títol del curs) */
.ld-focus-sidebar__course-heading {
    padding: 1rem 1.25rem !important;
}

.ld-focus-sidebar__course-heading .ld-focus-sidebar__course-title {
    font-size: 1rem !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}

/* Items de lliçó a la sidebar */
.ld-focus-sidebar .ld-lesson-item,
.ld-focus-sidebar .ld-topic-item,
.ld-focus-sidebar .ld-quiz-item,
.ld-focus-sidebar .ld-lesson-item-preview-heading,
.ld-focus-sidebar .ld-item-list-item {
    padding: 0.6rem 1rem !important;
    border-radius: 6px !important;
    margin: 0.1rem 0.5rem !important;
    transition: background-color 0.15s ease !important;
    font-size: 0.9rem !important;
    line-height: 1.35 !important;
}

.ld-focus-sidebar .ld-lesson-item:hover,
.ld-focus-sidebar .ld-topic-item:hover,
.ld-focus-sidebar .ld-quiz-item:hover,
.ld-focus-sidebar .ld-item-list-item:hover {
    background-color: rgba(217, 75, 30, 0.06) !important;
}

/* Ítem actiu (el que està obert ara) */
.ld-focus-sidebar .ld-lesson-item.ld-is-current-item,
.ld-focus-sidebar .ld-topic-item.ld-is-current-item,
.ld-focus-sidebar .ld-item-list-item.ld-is-current-item {
    background-color: rgba(217, 75, 30, 0.1) !important;
    font-weight: 600 !important;
}

/* Icona de completat: verd (progressió). Els NO completats queden navy. */
.ld-focus-sidebar .learndash-complete .ld-status-icon,
.ld-focus-sidebar .ld-status-icon.ld-lesson-complete,
.ld-focus-sidebar .ld-status-icon.ld-topic-complete,
.ld-focus-sidebar .ld-status-icon.ld-quiz-complete {
    color: #16a34a !important;
    fill: #16a34a !important;
}

/* Estat NO completat: navy neutre (evita que hereti cap verd). */
.ld-focus-sidebar .ld-status-incomplete,
.ld-focus-sidebar .ld-status-incomplete .ld-status-icon {
    color: #1a2b4c !important;
    fill: #1a2b4c !important;
}

/* Enllaços dels ítems */
.ld-focus-sidebar a,
.ld-focus-sidebar a:hover,
.ld-focus-sidebar a:focus {
    text-decoration: none !important;
    color: inherit !important;
}

/* Botó de collapse de la sidebar */
.ld-focus-sidebar__button-collapse,
.ld-focus-sidebar__button-expand {
    transition: background-color 0.15s ease !important;
}

.ld-focus-sidebar__button-collapse:hover,
.ld-focus-sidebar__button-expand:hover {
    background-color: rgba(255, 255, 255, 0.2) !important;
}

/* ═════════════════════════════════════════════════════════════
   13. BARRA DE PROGRÉS INFERIOR (LLIÇÓ PROGRÉS)
   ═════════════════════════════════════════════════════════════ */

.ld-focus-content .ld-progress-bar,
.ld-focus-main-content .ld-progress-bar {
    padding: 1rem 1.25rem !important;
    background: #f9fafb !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    margin: 1rem 0 !important;
}

.ld-focus-content .ld-progress-bar__label,
.ld-focus-main-content .ld-progress-bar__label {
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #6b7280 !important;
}

.ld-focus-content .ld-progress-bar__meter-percentage,
.ld-focus-main-content .ld-progress-bar__meter-percentage {
    font-weight: 700 !important;
    color: #111827 !important;
}

/* Text "Última activitat" */
.ld-focus-content .ld-progress-bar__last-activity,
.ld-focus-main-content .ld-progress-bar__last-activity {
    font-size: 0.8rem !important;
    color: #9ca3af !important;
}

/* ═════════════════════════════════════════════════════════════
   14. RESPONSIVE FOCUS MODE — MÒBIL
   ═════════════════════════════════════════════════════════════ */

@media (max-width: 720px) {
    body.single-sfwd-lessons .ld-focus-main-content .entry-title,
    body.single-sfwd-topic .ld-focus-main-content .entry-title,
    body.single-sfwd-quiz .ld-focus-main-content .entry-title,
    .ld-focus-content .entry-title {
        font-size: 1.4rem !important;
        line-height: 1.3 !important;
    }

    .ld-focus-content .entry-header,
    .ld-focus-main-content .entry-header {
        padding: 1rem 0 !important;
    }

    .ld-focus-sidebar .ld-lesson-item,
    .ld-focus-sidebar .ld-topic-item,
    .ld-focus-sidebar .ld-item-list-item {
        font-size: 0.85rem !important;
    }
}

/* ═════════════════════════════════════════════════════════════
   15. PESTANYES CONTINGUT / MATERIALS
   ─────────────────────────────────────────────────────────────
   Classe: .ld-tab-bar__tab dins .ld-tab-bar.
   L'indicador de pestanya activa i el subratllat de hover els dibuixa
   LearnDash internament (via ::after / box-shadow) amb el seu blau de
   marca (var(--ld-color-brand-primary) = #235af3), que xoca amb el tema.
   En comptes de perseguir-ne el selector i afegir una vora pròpia (que
   es duplicava sobre la blava), REMAPEM el token del blau a taronja
   NOMÉS dins la barra de pestanyes. Com que les variables CSS hereten
   cap als fills, tot l'accent (indicador actiu, text, subratllat) surt
   taronja i coherent, sense afegir cap element nou.
   ═════════════════════════════════════════════════════════════ */

.ld-tab-bar {
    --ld-color-brand-primary: #d94b1e;
    --ld-color-primitives-blue-500: #d94b1e;
    --ld-color-primitives-blue-800: #b83e19;
    --ld-color-semantic-text-link: #d94b1e;
    --ld-color-semantic-text-link-hover: #b83e19;
}

/* Totes les pestanyes PLANES per defecte: treu el fons taronja que els
   posa el botó del Kit i torna el text a fosc (el Kit el feia blanc). */
.ld-tab-bar .ld-tab-bar__tab {
    background-color: transparent !important;
    color: var(--e-global-color-primary, #1A2B4C) !important;
    box-shadow: none !important;
    font-weight: 600 !important;
}

.ld-tab-bar .ld-tab-bar__tab:hover,
.ld-tab-bar .ld-tab-bar__tab:focus {
    background-color: rgba(217, 75, 30, 0.08) !important;
    color: #d94b1e !important;
}

/* Pestanya ACTIVA: text taronja i negreta; l'indicador (subratllat) ja
   surt taronja pel remap del token de dalt. Així l'activa destaca i la
   inactiva queda discreta. */
.ld-tab-bar .ld-tab-bar__tab[aria-selected="true"] {
    background-color: transparent !important;
    color: #d94b1e !important;
    font-weight: 700 !important;
}

/* Text de la pestanya sempre visible */
.ld-tab-bar .ld-tab-bar__tab-title {
    color: inherit !important;
}

/* ═════════════════════════════════════════════════════════════
   16. PAGINACIÓ DEL CURS ("1 de 2")
   ─────────────────────────────────────────────────────────────
   Classe confirmada: .ld-accordion__pagination-button (--next / --prev).
   El botó és icon-only i rep l'estil de botó del Kit d'Elementor sobre
   un all:unset de LearnDash; en hover perdia la geometria i s'encongia.
   Bloquegem mida i padding en repòs, hover i focus. No toquem el fons
   (deixem el taronja del Kit); només afegim el brightness en hover per
   coherència amb els botons Expandir.
   ═════════════════════════════════════════════════════════════ */

.learndash-wrapper .ld-accordion__pagination-button,
.learndash-wrapper .ld-accordion__pagination-button:hover,
.learndash-wrapper .ld-accordion__pagination-button:focus {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0.5em 0.9em !important;
    border: 0 !important;
    border-radius: 8px !important;
    margin: 0 !important;
    opacity: 1 !important;
    line-height: 1 !important;
    transition: filter 0.15s ease !important;
}

/* Enfosquiment en hover (només si no està desactivat) */
.learndash-wrapper .ld-accordion__pagination-button:not(:disabled):hover,
.learndash-wrapper .ld-accordion__pagination-button:not(:disabled):focus {
    filter: brightness(0.92) !important;
}

/* La icona sempre a mida fixa i sense encongir-se */
.learndash-wrapper .ld-accordion__pagination-button svg {
    width: 20px !important;
    height: 20px !important;
    flex-shrink: 0 !important;
}