/* ContentBuilderNG — styles frontend partagés
   Préfixe .cb- (classes existantes).
   Pas de sélecteurs globaux agressifs.
   ---------------------------------------------------------------- */

/* Échelle typographique frontend partagée. Les titres et le texte
   courant restent pilotés par Bootstrap et le template Joomla. */
:root {
    --cb-font-size-caption: .75rem;
    --cb-font-size-compact: .85rem;
    --cb-font-size-meta: .9rem;
    --cb-screen-title-size: clamp(1.25rem, 2.1vw, 1.75rem);
    --cb-button-padding-block: .34rem;
    --cb-button-padding-inline: .85rem;
}

/* ── Liste frontend : toolbar, filtres et selects ───────────────── */
.cb-list-filters .form-select {
    width: auto;
    max-width: 100%;
}
.cb-filter-select-lang  { min-width: 7rem; max-width: 10rem; }
.cb-filter-select-state { min-width: 14rem; max-width: 24rem; }
.cb-filter-select-pub   { min-width: 13rem; max-width: 22rem; }
.cb-filter-select-md    { min-width: 12rem; max-width: 18rem; }
.cb-filter-select-rpp   { min-width: 5.5rem; max-width: 7rem; }
.cb-filter-search-group { max-width: 360px; }
.cb-list-toolbar-actions {
    flex-wrap: wrap;
}
.cb-list-toolbar-actions .btn,
.cb-list-toolbar-actions .form-select {
    flex: 0 0 auto;
}

/* ── Selects d'actions groupées (état / publication) désactivés ───
   Bootstrap ne change que le fond (--bs-secondary-bg) sur :disabled ;
   trop peu visible. On ajoute opacité réduite + curseur explicite,
   via variables Bootstrap pour rester cohérent en dark mode.        */
.cb-filter-select-state:disabled,
.cb-filter-select-pub:disabled {
    opacity: .6;
    color: var(--bs-secondary-color, #6c757d);
    cursor: not-allowed;
}

@media (max-width: 767.98px) {
    .cb-list-filters {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .cb-list-filters .form-select,
    .cb-filter-search-group,
    .cb-list-toolbar-actions,
    .cb-filter-rpp-wrap {
        flex-shrink: 0;
    }
}

/* ── Pagination : replier les items sur petits écrans ────────────
   Bootstrap ne pose pas flex-wrap sur ul.pagination : avec beaucoup
   de pages, la barre déborde du viewport en portrait mobile.       */
.pagination__wrapper .pagination {
    flex-wrap: wrap;
}

/* ── Contenu d'enregistrement (details/edit/cartes) ──────────────
   Le HTML des enregistrements est fourni par l'utilisateur : images
   à largeur fixe, tableaux larges, URLs longues. On le contient dans
   le viewport sans toucher au desktop.                             */
.cbDetailsBody,
.cbEditableBody,
.cb-list-card-value {
    overflow-wrap: break-word;
    min-width: 0;
}
.cbDetailsBody img,
.cbDetailsBody iframe,
.cbDetailsBody video,
.cbEditableBody img,
.cbEditableBody iframe,
.cbEditableBody video,
.cb-list-card-value img {
    max-width: 100%;
    height: auto;
}
.cbDetailsBody table,
.cbEditableBody table {
    max-width: 100%;
}

/* ── Écrans fiche et édition ─────────────────────────────────────
   Socle visuel commun aux deux parcours. Les thèmes de formulaire
   peuvent toujours personnaliser leur contenu sans modifier ce cadre. */
:is(.cbDetailsWrapper, .cbEditableWrapper) {
    --cb-screen-bg: var(--bs-body-bg, #fff);
    --cb-screen-color: var(--bs-body-color, #212529);
    --cb-screen-border: var(--bs-border-color, #dee2e6);
    --cb-screen-toolbar-bg: var(--bs-tertiary-bg, #f8f9fa);
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: .7rem 0 1.4rem;
    padding: 0;
    border: 0;
    border-radius: 0;
    color: var(--cb-screen-color);
    background: transparent;
    box-shadow: none;
}
:is(.cbDetailsWrapper, .cbEditableWrapper) > h1.display-6 {
    margin: 0 0 .9rem !important;
    padding: 0 0 .55rem;
    border-bottom: 1px solid var(--cb-screen-border);
    color: var(--cb-screen-color);
    font-size: var(--cb-screen-title-size);
    font-weight: 600;
    letter-spacing: 0;
}
:is(.cbDetailsWrapper, .cbEditableWrapper) > h1.display-6::after {
    display: none;
}
:is(.cbDetailsWrapper, .cbEditableWrapper) .cbToolBar {
    padding: .65rem .75rem;
    border: 1px solid var(--cb-screen-border);
    border-radius: .9rem;
    background: var(--cb-screen-bg);
    box-shadow: 0 .35rem .9rem rgba(0, 0, 0, .06);
}
:is(.cbDetailsWrapper, .cbEditableWrapper) :is(.cbToolBar, .cbTitleRecordNav) .cbButton.btn {
    border-radius: 999px;
    font-weight: 600;
    font-size: var(--cb-font-size-compact);
    padding: var(--cb-button-padding-block) var(--cb-button-padding-inline);
}
:is(.cbDetailsWrapper, .cbEditableWrapper) .cbTitleRecordNav .cbButton.btn {
    display: inline-flex;
    align-items: center;
}
:is(.cbDetailsWrapper, .cbEditableWrapper) :is(.cbDetailsBody, .cbEditableBody) {
    min-width: 0;
    padding: .65rem .75rem;
    border: 1px solid var(--cb-screen-border);
    border-radius: .9rem;
    color: var(--cb-screen-color);
    background: var(--cb-screen-bg);
    box-shadow: 0 .35rem .9rem rgba(0, 0, 0, .06);
}

@media (max-width: 767.98px) {
    :is(.cbDetailsWrapper, .cbEditableWrapper) {
        margin-top: .45rem;
    }
    :is(.cbDetailsWrapper, .cbEditableWrapper) .cbToolBar {
        padding: .34rem;
    }
    :is(.cbDetailsWrapper, .cbEditableWrapper) :is(.cbDetailsBody, .cbEditableBody) {
        padding: .6rem .54rem .3rem;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    :is(.cbDetailsWrapper, .cbEditableWrapper) :is(.cbToolBar, .cbTitleRecordNav) .cbButton.btn {
        flex: 0 0 auto;
        justify-content: center;
        white-space: normal;
    }
}

@media (prefers-color-scheme: dark) {
    html:not([data-bs-theme="light"]) :is(.cbDetailsWrapper, .cbEditableWrapper) {
        --cb-screen-bg: #111a24;
        --cb-screen-color: #e7edf6;
        --cb-screen-border: rgba(173, 193, 216, .3);
        --cb-screen-toolbar-bg: #1a2431;
        color-scheme: dark;
    }
}

html[data-bs-theme="dark"] :is(.cbDetailsWrapper, .cbEditableWrapper) {
    --cb-screen-bg: var(--bs-body-bg, #111a24);
    --cb-screen-color: var(--bs-body-color, #e7edf6);
    --cb-screen-border: var(--bs-border-color, rgba(173, 193, 216, .3));
    --cb-screen-toolbar-bg: var(--bs-tertiary-bg, #1a2431);
    color-scheme: dark;
}
/* ── Aide de configuration preview (List, Details, Edit) ─────────*/
.cb-preview-config-help {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.55rem;
    height: 1.55rem;
    margin-left: .25rem;
    border-radius: 999px;
    color: #7a4c07;
    background: rgba(255,255,255,.45);
    text-decoration: none;
    vertical-align: middle;
}
.cb-preview-config-help:hover,
.cb-preview-config-help:focus-visible {
    color: #5f3b00;
    background: rgba(255,255,255,.62);
    outline: .1875rem solid currentColor;
    outline-offset: .125rem;
}

/* ── Fil d'Ariane du titre (liste > écran courant) ───────────────*/
.cbPageBreadcrumb .cbPageBreadcrumbLink {
    display: inline-flex;
    align-items: center;
    padding: .16rem .48rem;
    border: 1px solid rgba(var(--bs-primary-rgb, 13, 110, 253), .28);
    border-radius: 999px;
    color: var(--bs-link-color, #0d6efd);
    background: rgba(var(--bs-primary-rgb, 13, 110, 253), .08);
    font-weight: 600;
}
.cbPageBreadcrumb .cbPageBreadcrumbLink:hover,
.cbPageBreadcrumb .cbPageBreadcrumbLink:focus-visible {
    border-color: var(--bs-link-hover-color, #0a58ca);
    color: var(--bs-link-hover-color, #0a58ca);
    background: rgba(var(--bs-primary-rgb, 13, 110, 253), .16);
}
.cbPageBreadcrumb .cbPageBreadcrumbLink:focus-visible {
    outline: .1875rem solid currentColor;
    outline-offset: .125rem;
}

/* ── Radios et cases non sélectionnés ────────────────────────────── */
:is(.cbEditableWrapper, .cbDetailsWrapper) .cbGroupField .form-check-input:not(:checked) {
    border-color: rgba(var(--bs-primary-rgb, 13, 110, 253), .58);
    background-color: rgba(var(--bs-primary-rgb, 13, 110, 253), .06);
}
:is(.cbEditableWrapper, .cbDetailsWrapper) .cbGroupField .form-check-input:not(:checked):not(:disabled):hover {
    border-color: rgba(var(--bs-primary-rgb, 13, 110, 253), .85);
    background-color: rgba(var(--bs-primary-rgb, 13, 110, 253), .12);
}
:is(.cbEditableWrapper, .cbDetailsWrapper) .cbGroupField .form-check-input:focus-visible {
    border-color: var(--bs-primary, #0d6efd);
    outline: .1875rem solid rgba(var(--bs-primary-rgb, 13, 110, 253), .35);
    outline-offset: .125rem;
    box-shadow: none;
}

/* ── Utilitaires ─────────────────────────────────────────────────*/
.cb-clear-right { clear: right; }

/* ── publicforms : liste de formulaires publics ───────────────────*/
.cb-pubforms-tag-filter {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: .75rem;
}
.cb-pubforms-tag-filter label {
    margin: 0;
    white-space: nowrap;
    font-weight: 500;
}
.cb-pubforms-th-name {
    width: 200px;
    min-width: 120px;
}
.cb-pubforms-perm-icon {
    font-size: var(--cb-font-size-meta);
}
.cb-pubforms-perm-icon.is-allowed { color: var(--bs-success, #198754); }
.cb-pubforms-perm-icon.is-denied  { color: var(--bs-danger,  #dc3545); }

/* ── Mode sombre ────────────────────────────────────────────────
   Ce site Cassiopeia ne pose pas [data-bs-theme="dark"] : le mode
   sombre est piloté uniquement par prefers-color-scheme (cf. list.css).
   Cassiopeia définit ses propres variables de lien (--link-color,
   --link-color-rgb…) sans préfixe bs-, distinctes de --bs-link-color,
   et ne les redéfinit pas en dark → les liens restent bleu très sombre
   (#224faa), illisible sur fond sombre. On aligne ici les variables
   Cassiopeia sur les valeurs Bootstrap dark mode (#6ea8fe / #8bb9fe).

   --bs-success et --bs-danger ne sont pas redéfinis par Bootstrap en
   dark mode : on bascule sur les variantes -text-emphasis adaptées.  */
@media (prefers-color-scheme: dark) {
    html:not([data-bs-theme="light"]) {
        --link-color:           #6ea8fe;
        --link-color-rgb:       110, 168, 254;
        --link-hover-color:     #8bb9fe;
        --link-hover-color-rgb: 139, 185, 254;
    }
    html:not([data-bs-theme="light"]) .cb-list-filters .form-select,
    html:not([data-bs-theme="light"]) .cb-list-toolbar-actions .form-select {
        color: #ffffff !important;
        background-color: #0f1824 !important;
        border-color: rgba(190, 213, 241, .42) !important;
        color-scheme: dark;
    }
    html:not([data-bs-theme="light"]) .cb-list-filters .form-select:disabled,
    html:not([data-bs-theme="light"]) .cb-list-toolbar-actions .form-select:disabled {
        color: #ffffff !important;
        background-color: #172638 !important;
        border-color: rgba(190, 213, 241, .34) !important;
        opacity: 1;
    }
    html:not([data-bs-theme="light"]) .cb-list-filters .form-select:focus,
    html:not([data-bs-theme="light"]) .cb-list-toolbar-actions .form-select:focus {
        color: #ffffff !important;
        background-color: #111d2b !important;
        border-color: #78a6dd !important;
        box-shadow: 0 0 0 .18rem rgba(120, 166, 221, .2) !important;
    }
    html:not([data-bs-theme="light"]) .cb-pubforms-perm-icon.is-allowed { color: var(--bs-success-text-emphasis, #75b798); }
    html:not([data-bs-theme="light"]) .cb-pubforms-perm-icon.is-denied  { color: var(--bs-danger-text-emphasis,  #ea868f); }
    html:not([data-bs-theme="light"]) .cb-preview-config-help {
        color: #f5d38f;
        background: rgba(255,255,255,.08);
    }
    html:not([data-bs-theme="light"]) .cb-preview-config-help:hover,
    html:not([data-bs-theme="light"]) .cb-preview-config-help:focus {
        color: #ffe8b3;
        background: rgba(255,255,255,.14);
    }
    /* joomla-alert.css (Cassiopeia) impose un fond blanc, illisible avec
       le texte clair du mode sombre : palette alerte sombre Bootstrap.
       L'id #system-message-container prime sur joomla-alert.css chargé après. */
    html:not([data-bs-theme="light"]) #system-message-container joomla-alert {
        background-color: #101924;
        border-color: rgba(148, 163, 184, .3);
        color: #e7edf6;
    }
    html:not([data-bs-theme="light"]) #system-message-container joomla-alert[type="success"] {
        background-color: #0f2a1d;
        border-color: #2f6a4f;
        color: var(--bs-success-text-emphasis, #75b798);
    }
    html:not([data-bs-theme="light"]) #system-message-container joomla-alert[type="danger"] {
        background-color: #2c1215;
        border-color: #842029;
        color: var(--bs-danger-text-emphasis, #ea868f);
    }
    html:not([data-bs-theme="light"]) #system-message-container joomla-alert[type="warning"] {
        background-color: #2a2005;
        border-color: #997404;
        color: var(--bs-warning-text-emphasis, #ffda6a);
    }
    html:not([data-bs-theme="light"]) #system-message-container joomla-alert[type="info"] {
        background-color: #092c38;
        border-color: #087990;
        color: var(--bs-info-text-emphasis, #6edff6);
    }
    html:not([data-bs-theme="light"]) #system-message-container joomla-alert .joomla-alert--close {
        color: inherit;
    }
}
[data-bs-theme="dark"] .cb-pubforms-perm-icon.is-allowed { color: var(--bs-success-text-emphasis, #75b798); }
[data-bs-theme="dark"] .cb-pubforms-perm-icon.is-denied  { color: var(--bs-danger-text-emphasis,  #ea868f); }
html[data-bs-theme="dark"] .cb-preview-config-help {
    color: #f5d38f;
    background: rgba(255,255,255,.08);
}
html[data-bs-theme="dark"] .cb-preview-config-help:hover,
html[data-bs-theme="dark"] .cb-preview-config-help:focus {
    color: #ffe8b3;
    background: rgba(255,255,255,.14);
}
html[data-bs-theme="dark"] {
    --link-color:           #6ea8fe;
    --link-color-rgb:       110, 168, 254;
    --link-hover-color:     #8bb9fe;
    --link-hover-color-rgb: 139, 185, 254;
}
html[data-bs-theme="dark"] .cb-list-filters .form-select,
html[data-bs-theme="dark"] .cb-list-toolbar-actions .form-select {
    color: #ffffff !important;
    background-color: #0f1824 !important;
    border-color: rgba(190, 213, 241, .42) !important;
    color-scheme: dark;
}
html[data-bs-theme="dark"] .cb-list-filters .form-select:disabled,
html[data-bs-theme="dark"] .cb-list-toolbar-actions .form-select:disabled {
    color: #ffffff !important;
    background-color: #172638 !important;
    border-color: rgba(190, 213, 241, .34) !important;
    opacity: 1;
}
html[data-bs-theme="dark"] .cb-list-filters .form-select:focus,
html[data-bs-theme="dark"] .cb-list-toolbar-actions .form-select:focus {
    color: #ffffff !important;
    background-color: #111d2b !important;
    border-color: #78a6dd !important;
    box-shadow: 0 0 0 .18rem rgba(120, 166, 221, .2) !important;
}
html[data-bs-theme="dark"] body #system-message-container joomla-alert {
    background-color: #101924;
    border-color: rgba(148, 163, 184, .3);
    color: #e7edf6;
}
html[data-bs-theme="dark"] body #system-message-container joomla-alert[type="success"] {
    background-color: #0f2a1d;
    border-color: #2f6a4f;
    color: var(--bs-success-text-emphasis, #75b798);
}
html[data-bs-theme="dark"] body #system-message-container joomla-alert[type="danger"] {
    background-color: #2c1215;
    border-color: #842029;
    color: var(--bs-danger-text-emphasis, #ea868f);
}
html[data-bs-theme="dark"] body #system-message-container joomla-alert[type="warning"] {
    background-color: #2a2005;
    border-color: #997404;
    color: var(--bs-warning-text-emphasis, #ffda6a);
}
html[data-bs-theme="dark"] body #system-message-container joomla-alert[type="info"] {
    background-color: #092c38;
    border-color: #087990;
    color: var(--bs-info-text-emphasis, #6edff6);
}
html[data-bs-theme="dark"] body #system-message-container joomla-alert .joomla-alert--close {
    color: inherit;
}

/* ── Impression (vue details/print) ──────────────────────────────*/
.cb-print-wrapper {
    max-width: 960px;
    margin: 0 auto;
    padding: .5rem 1rem;
}
.cb-print-actions {
    display: flex;
    gap: .5rem;
    justify-content: center;
    margin-bottom: 1.5rem;
}
.cb-print-meta {
    margin-bottom: 1rem;
    color: var(--bs-secondary-color, #6c757d);
    font-size: var(--cb-font-size-meta);
}

@media print {
    /* Masque la navigation et l'interface Joomla */
    header, footer, nav,
    #sp-top-bar, #sp-menu, #sp-bottom,
    .mod-menu, .navbar, .main-nav,
    .system-message, .alert,
    .cb-print-actions {
        display: none !important;
    }

    /* Réinitialise les marges du template */
    body, html {
        margin: 0 !important;
        padding: 0 !important;
        background: #fff !important;
        color: #000 !important;
        font-size: 11pt !important;
    }

    /* Le contenu CB prend toute la largeur */
    .cb-print-wrapper {
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Évite les coupures de page à l'intérieur des champs */
    .mb-3, .cb-print-meta {
        break-inside: avoid;
    }

    /* Liens externes : affiche l'URL entre parenthèses (URLs absolues uniquement) */
    a[href^="http"]::after {
        content: " (" attr(href) ")";
        font-size: .8em;
        color: #555;
    }
}