/* Pont visuel entre les vues historiques Zone18 et Velzon Modern. */

body.z18-velzon-test {
    --z18-vz-radius: 10px;
    --z18-vz-shadow: 0 2px 5px rgba(56, 65, 74, .06);
    --z18-vz-field-height: 38px;
}

body.z18-velzon-test .main-content .page-content {
    padding-right: clamp(12px, 2vw, 24px);
    padding-left: clamp(12px, 2vw, 24px);
}

body.z18-velzon-test .main-content .page-content > .container-fluid,
body.z18-velzon-test #content > .centered,
body.z18-velzon-test #content > .centered:has(.z18-page-shell) {
    width: 100% !important;
    max-width: none !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

body.z18-velzon-test img,
body.z18-velzon-test video,
body.z18-velzon-test canvas,
body.z18-velzon-test iframe {
    max-width: 100%;
}

body.z18-velzon-test .z18-vz-avatar img,
body.z18-velzon-test img[class*="grade"],
body.z18-velzon-test .panel-player-main img {
    max-width: none;
}

/* En-têtes et onglets de pages — bandeau sombre Zone18 (comme standard.php) */
body.z18-velzon-test .z18-page-top {
    margin-bottom: 16px;
}

body.z18-velzon-test .z18-page-top .z18-page-hero,
body.z18-velzon-test .z18-page-top .z18-page-hero.z18-page-hero-compact,
body.z18-velzon-test .z18-panel-hero,
body.z18-velzon-test .z18-info-hero,
body.z18-velzon-test .z18-caserne-info-hero,
body.z18-velzon-test .z18-career-info-hero {
    padding: 17px 20px !important;
    border: 0 !important;
    border-radius: 12px !important;
    color: #fff !important;
    background:
        radial-gradient(circle at 12% 25%, rgba(229, 72, 63, .22), transparent 25%),
        linear-gradient(120deg, #262a2f, #30363d) !important;
    box-shadow: 0 12px 30px rgba(31, 37, 46, .14) !important;
}

body.z18-velzon-test .z18-page-hero h1,
body.z18-velzon-test .z18-page-hero h2,
body.z18-velzon-test .z18-page-hero p,
body.z18-velzon-test .z18-info-hero h1,
body.z18-velzon-test .z18-info-hero p {
    color: inherit !important;
}

body.z18-velzon-test .z18-page-hero p,
body.z18-velzon-test .z18-info-hero p {
    color: rgba(255, 255, 255, .6) !important;
}

body.z18-velzon-test .z18-page-kicker,
body.z18-velzon-test .z18-info-eyebrow {
    color: #ff928c !important;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    font-size: 10px;
}

body.z18-velzon-test .z18-info-hero-icon,
body.z18-velzon-test .z18-accueil-grade {
    border: 1px solid rgba(255, 255, 255, .12) !important;
    color: #fff !important;
    background: rgba(255, 255, 255, .06) !important;
}

body.z18-velzon-test .z18-accueil-saison {
    color: #ff928c !important;
    background: rgba(229, 72, 63, .14) !important;
}

body.z18-velzon-test .z18-page-tabs,
body.z18-velzon-test .z18-panel-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 12px;
}

body.z18-velzon-test .z18-page-tab,
body.z18-velzon-test .z18-panel-tab {
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid var(--vz-border-color, #e9ebec) !important;
    border-radius: 7px !important;
    color: var(--vz-body-color, #495057) !important;
    background: var(--vz-light, #f3f6f9) !important;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none !important;
}

body.z18-velzon-test .z18-page-tab.is-active,
body.z18-velzon-test .z18-panel-tab.is-active,
body.z18-velzon-test .z18-page-tab.active,
body.z18-velzon-test .z18-panel-tab.active {
    border-color: #e5483f !important;
    color: #fff !important;
    background: #e5483f !important;
}

/* Anciennes règles dark-theme pour heroes : plus nécessaires (bandeau toujours sombre) */
html[data-bs-theme="dark"] body.z18-velzon-test .card,
html[data-bs-theme="dark"] body.z18-velzon-test .z18-table-card,
html[data-bs-theme="dark"] body.z18-velzon-test .z18-panel-card {
    color: var(--vz-body-color, #ced4da) !important;
    background: var(--vz-card-bg, #212529) !important;
    border-color: var(--vz-border-color, #32383e) !important;
}

html[data-bs-theme="dark"] body.z18-velzon-test .z18-page-tab,
html[data-bs-theme="dark"] body.z18-velzon-test .z18-panel-tab {
    color: var(--vz-body-color, #ced4da) !important;
    background: var(--vz-light, #282b2e) !important;
    border-color: var(--vz-border-color, #32383e) !important;
}

html[data-bs-theme="dark"] body.z18-velzon-test .table,
html[data-bs-theme="dark"] body.z18-velzon-test .table > :not(caption) > * > * {
    color: var(--vz-body-color, #ced4da);
    border-color: var(--vz-border-color, #32383e);
    background-color: transparent;
}

html[data-bs-theme="dark"] body.z18-velzon-test .form-control,
html[data-bs-theme="dark"] body.z18-velzon-test .form-select,
html[data-bs-theme="dark"] body.z18-velzon-test input[type="text"],
html[data-bs-theme="dark"] body.z18-velzon-test input[type="search"],
html[data-bs-theme="dark"] body.z18-velzon-test input[type="number"],
html[data-bs-theme="dark"] body.z18-velzon-test select,
html[data-bs-theme="dark"] body.z18-velzon-test textarea {
    color: var(--vz-body-color, #ced4da) !important;
    background-color: var(--vz-input-bg, #2a2f34) !important;
    border-color: var(--vz-border-color, #32383e) !important;
}

/* Cartes et anciens blocs de contenu */
body.z18-velzon-test .z18-card,
body.z18-velzon-test .grid-1,
body.z18-velzon-test .grid-2,
body.z18-velzon-test .grid-3,
body.z18-velzon-test .grid-4,
body.z18-velzon-test .grid-5,
body.z18-velzon-test .grid-6,
body.z18-velzon-test .grid-7,
body.z18-velzon-test .grid-8,
body.z18-velzon-test .grid-9,
body.z18-velzon-test .grid-10 {
    box-sizing: border-box;
    max-width: 100% !important;
    border-color: var(--vz-border-color, #e9ebec) !important;
    border-radius: var(--z18-vz-radius) !important;
    box-shadow: var(--z18-vz-shadow);
}

body.z18-velzon-test .z18-card {
    overflow: hidden;
    margin-bottom: 16px;
    background: var(--vz-card-bg, #fff) !important;
}

body.z18-velzon-test .z18-card-title,
body.z18-velzon-test .title-grid {
    display: flex;
    min-height: 48px;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 10px 15px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--vz-border-color, #e9ebec) !important;
    border-radius: var(--z18-vz-radius) var(--z18-vz-radius) 0 0 !important;
    color: var(--vz-heading-color, #343a40) !important;
    background: var(--vz-card-cap-bg, #fff) !important;
    background-image: none !important;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .035em;
    text-transform: uppercase;
}

body.z18-velzon-test .z18-card-title *,
body.z18-velzon-test .title-grid * {
    color: inherit;
}

body.z18-velzon-test .content-gird-1,
body.z18-velzon-test .content-gird-2,
body.z18-velzon-test .content-gird-3,
body.z18-velzon-test .content-gird-4,
body.z18-velzon-test .content-gird-5 {
    box-sizing: border-box;
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 0 !important;
    padding: 16px !important;
    overflow-x: auto;
    border: 0 !important;
    color: var(--vz-body-color, #495057) !important;
    background: var(--vz-card-bg, #fff) !important;
}

body.z18-velzon-test .grid-1 {
    float: none !important;
    width: 100% !important;
    margin-right: 0 !important;
    margin-bottom: 16px !important;
}

/* Tableaux et DataTables */
body.z18-velzon-test .table-responsive,
body.z18-velzon-test .dataTables_wrapper,
body.z18-velzon-test [class*="table-wrap"] {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

body.z18-velzon-test table.display,
body.z18-velzon-test table.z18-table,
body.z18-velzon-test #content table:not(.cke_dialog_ui_hbox):not(.cke_dialog_ui_vbox) {
    width: 100% !important;
    max-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--vz-border-color, #e9ebec);
    color: var(--vz-body-color, #495057);
    background: var(--vz-card-bg, #fff);
}

body.z18-velzon-test table.display thead th,
body.z18-velzon-test table.z18-table thead th,
body.z18-velzon-test #content table thead th,
body.z18-velzon-test th.th_title {
    height: auto !important;
    padding: 11px 12px !important;
    border-bottom: 1px solid var(--vz-border-color, #e9ebec) !important;
    color: var(--vz-heading-color, #343a40) !important;
    background: var(--vz-light, #f3f6f9) !important;
    background-image: none !important;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
    text-transform: uppercase;
}

body.z18-velzon-test table.display tbody td,
body.z18-velzon-test table.z18-table tbody td,
body.z18-velzon-test #content table tbody td {
    height: auto !important;
    padding: 10px 12px !important;
    border-bottom: 1px solid var(--vz-border-color, #e9ebec);
    vertical-align: middle;
}

body.z18-velzon-test table tbody tr:last-child td {
    border-bottom: 0;
}

body.z18-velzon-test table tbody tr:hover td {
    background: rgba(64, 81, 137, .035);
}

body.z18-velzon-test .th_chexbox,
body.z18-velzon-test .th_title,
body.z18-velzon-test .th_status,
body.z18-velzon-test .th_date,
body.z18-velzon-test .th_author,
body.z18-velzon-test .th_images,
body.z18-velzon-test .th_action {
    width: auto !important;
    min-width: 0;
}

body.z18-velzon-test .dataTables_length,
body.z18-velzon-test .dataTables_filter,
body.z18-velzon-test .dataTables_info,
body.z18-velzon-test .dataTables_paginate {
    width: auto !important;
    margin: 0 0 10px;
}

body.z18-velzon-test .dataTables_filter input,
body.z18-velzon-test .dataTables_length select {
    min-height: 34px;
    box-sizing: border-box;
    margin-left: 6px;
    padding: 5px 9px;
    border: 1px solid var(--vz-input-border-custom, #ced4da);
    border-radius: 6px;
    color: var(--vz-body-color, #495057);
    background: var(--vz-input-bg-custom, #fff);
}

body.z18-velzon-test .paginate_button,
body.z18-velzon-test .dataTables_paginate a {
    display: inline-flex;
    min-width: 32px;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    margin-left: 3px;
    padding: 4px 8px;
    border: 1px solid var(--vz-border-color, #e9ebec);
    border-radius: 6px;
    text-decoration: none;
}

/* Formulaires */
body.z18-velzon-test #content label {
    color: var(--vz-heading-color, #343a40);
    font-weight: 600;
}

body.z18-velzon-test #content input[type="text"],
body.z18-velzon-test #content input[type="password"],
body.z18-velzon-test #content input[type="email"],
body.z18-velzon-test #content input[type="number"],
body.z18-velzon-test #content input[type="date"],
body.z18-velzon-test #content input[type="time"],
body.z18-velzon-test #content select,
body.z18-velzon-test #content textarea {
    min-height: var(--z18-vz-field-height);
    max-width: 100%;
    box-sizing: border-box;
    padding: 7px 10px;
    border: 1px solid var(--vz-input-border-custom, #ced4da);
    border-radius: 6px;
    color: var(--vz-body-color, #495057);
    background-color: var(--vz-input-bg-custom, #fff);
    box-shadow: none;
}

body.z18-velzon-test #content textarea {
    min-height: 110px;
    resize: vertical;
}

body.z18-velzon-test #content input:focus,
body.z18-velzon-test #content select:focus,
body.z18-velzon-test #content textarea:focus {
    border-color: rgba(64, 81, 137, .55);
    outline: 0;
    box-shadow: 0 0 0 3px rgba(64, 81, 137, .1);
}

body.z18-velzon-test form .elem {
    display: grid;
    grid-template-columns: minmax(130px, 190px) minmax(0, 1fr);
    gap: 10px 14px;
    align-items: start;
    margin-bottom: 12px;
}

body.z18-velzon-test form .elem label {
    margin: 8px 0 0;
}

body.z18-velzon-test form .elem .right {
    float: none !important;
    width: 100% !important;
}

/* Boutons legacy */
body.z18-velzon-test .button-input,
body.z18-velzon-test input.button-input,
body.z18-velzon-test button.button-input,
body.z18-velzon-test .button-a {
    display: inline-flex !important;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 7px 12px !important;
    border: 1px solid transparent !important;
    border-radius: 6px !important;
    color: #fff !important;
    background: var(--vz-primary, #405189) !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;
    text-decoration: none !important;
    cursor: pointer;
}

body.z18-velzon-test .button-input.red,
body.z18-velzon-test .button-input.rouge,
body.z18-velzon-test .button-input.red-button {
    background: var(--vz-danger, #f06548) !important;
}

body.z18-velzon-test .button-input.green,
body.z18-velzon-test .button-input.vert {
    background: var(--vz-success, #0ab39c) !important;
}

body.z18-velzon-test .button-input.gray,
body.z18-velzon-test .button-input.grey,
body.z18-velzon-test .button-input.gris {
    background: var(--vz-secondary, #3577f1) !important;
}

body.z18-velzon-test .button-input:hover,
body.z18-velzon-test .button-a:hover {
    filter: brightness(.94);
}

/* Alertes */
body.z18-velzon-test .alert,
body.z18-velzon-test .z18-page-flash {
    box-sizing: border-box;
    margin-bottom: 16px;
    padding: 11px 14px;
    border: 1px solid transparent;
    border-radius: 8px;
}

body.z18-velzon-test .alert.green,
body.z18-velzon-test .z18-page-flash-ok {
    border-color: rgba(10, 179, 156, .25);
    color: #087f70;
    background: rgba(10, 179, 156, .1);
}

body.z18-velzon-test .alert.red,
body.z18-velzon-test .z18-page-flash-err {
    border-color: rgba(240, 101, 72, .25);
    color: #c63f25;
    background: rgba(240, 101, 72, .1);
}

body.z18-velzon-test .alert .close {
    float: right;
    color: inherit;
    font-size: 0;
    opacity: .65;
}

body.z18-velzon-test .alert .close::after {
    content: "×";
    font-size: 18px;
}

/* Widgets tiers */
body.z18-velzon-test .chosen-container,
body.z18-velzon-test .chzn-container {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
}

body.z18-velzon-test .chosen-container-single .chosen-single,
body.z18-velzon-test .chzn-container-single .chzn-single {
    min-height: 38px;
    box-sizing: border-box;
    border-color: var(--vz-input-border-custom, #ced4da);
    border-radius: 6px;
    line-height: 36px;
}

body.z18-velzon-test .chosen-container .chosen-drop,
body.z18-velzon-test .chzn-container .chzn-drop {
    z-index: 1060;
    width: 100% !important;
    box-sizing: border-box;
}

body.z18-velzon-test .cke,
body.z18-velzon-test .cke_chrome,
body.z18-velzon-test .cke_inner {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
}

body.z18-velzon-test .cke_dialog,
body.z18-velzon-test .cke_dialog_body {
    max-width: none !important;
}

body.z18-velzon-test .z18-remise-popup {
    z-index: 100050 !important;
    backdrop-filter: blur(2px);
}

body.z18-velzon-test .z18-remise-popup-panel {
    border-radius: 14px;
    box-shadow: 0 28px 70px rgba(15, 23, 42, .38);
}

/* Tableau de bord du panel */
body.z18-panel-modern .pdash-page {
    width: 100% !important;
    max-width: none !important;
}

body.z18-panel-modern .pdash-hero {
    padding: 20px !important;
    border: 1px solid var(--vz-border-color, #e9ebec) !important;
    border-bottom: 2px solid var(--vz-danger, #f06548) !important;
    border-radius: var(--z18-vz-radius) !important;
    color: var(--vz-heading-color, #343a40) !important;
    background:
        radial-gradient(circle at 90% 20%, rgba(240, 101, 72, .1), transparent 25%),
        var(--vz-card-bg, #fff) !important;
    box-shadow: var(--z18-vz-shadow) !important;
}

body.z18-panel-modern .pdash-hero h1,
body.z18-panel-modern .pdash-hero p,
body.z18-panel-modern .pdash-kicker {
    color: inherit !important;
}

body.z18-panel-modern .pdash-kicker {
    color: var(--vz-danger, #f06548) !important;
}

body.z18-panel-modern .pdash-server,
body.z18-panel-modern .pdash-stats > div,
body.z18-panel-modern .pdash-card,
body.z18-panel-modern .pdash-table-card {
    border: 1px solid var(--vz-border-color, #e9ebec) !important;
    border-radius: var(--z18-vz-radius) !important;
    color: var(--vz-body-color, #495057) !important;
    background: var(--vz-card-bg, #fff) !important;
    box-shadow: var(--z18-vz-shadow) !important;
}

body.z18-panel-modern .pdash-card-title,
body.z18-panel-modern .pdash-table-card-title {
    min-height: 48px;
    box-sizing: border-box;
    padding: 13px 15px !important;
    border-bottom: 1px solid var(--vz-border-color, #e9ebec) !important;
    color: var(--vz-heading-color, #343a40) !important;
    background: transparent !important;
}

body.z18-panel-modern .pdash-clean-table,
body.z18-panel-modern .pdash-table {
    border: 0 !important;
}

@media (max-width: 991.98px) {
    body.z18-velzon-test .grid-1,
    body.z18-velzon-test .grid-2,
    body.z18-velzon-test .grid-3,
    body.z18-velzon-test .grid-4,
    body.z18-velzon-test .grid-5,
    body.z18-velzon-test .grid-6,
    body.z18-velzon-test .grid-7,
    body.z18-velzon-test .grid-8,
    body.z18-velzon-test .grid-9,
    body.z18-velzon-test .grid-10 {
        float: none !important;
        width: 100% !important;
        margin-right: 0 !important;
        margin-bottom: 14px !important;
    }

    body.z18-velzon-test table.display,
    body.z18-velzon-test .panel-player-table {
        min-width: 640px;
    }

    body.z18-velzon-test .z18-page-tabs,
    body.z18-velzon-test .z18-panel-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 4px;
        -webkit-overflow-scrolling: touch;
    }
}

@media (max-width: 767.98px) {
    body.z18-velzon-test .main-content .page-content {
        padding-right: 10px;
        padding-left: 10px;
    }

    body.z18-velzon-test .z18-page-hero,
    body.z18-velzon-test .z18-panel-hero {
        padding: 13px !important;
    }

    body.z18-velzon-test .z18-page-hero h1,
    body.z18-velzon-test .z18-panel-hero h1 {
        font-size: 20px !important;
    }

    body.z18-velzon-test form .elem {
        grid-template-columns: 1fr;
    }

    body.z18-velzon-test form .elem label {
        margin-top: 0;
    }

    body.z18-velzon-test .left,
    body.z18-velzon-test .right {
        float: none !important;
        width: 100%;
    }

    body.z18-velzon-test input[size],
    body.z18-velzon-test textarea[cols],
    body.z18-velzon-test #content select,
    body.z18-velzon-test #content textarea {
        width: 100% !important;
    }

    body.z18-velzon-test .dataTables_length,
    body.z18-velzon-test .dataTables_filter,
    body.z18-velzon-test .dataTables_info,
    body.z18-velzon-test .dataTables_paginate {
        float: none !important;
        width: 100% !important;
        text-align: left !important;
    }

    body.z18-velzon-test .dataTables_filter input,
    body.z18-velzon-test .dataTables_length select {
        width: 100% !important;
        margin: 5px 0 0;
    }

    body.z18-velzon-test .button-input,
    body.z18-velzon-test button.button-input,
    body.z18-velzon-test input.button-input {
        max-width: 100%;
    }
}

/* === Uniformisation + formulaires / tableaux (v91) === */

/* Heroes info : déjà forcés en bandeau sombre plus haut — ne pas les reblanchir */

body.z18-velzon-test .z18-section-tabs,
body.z18-velzon-test .z18-locaux-room-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 12px;
}

body.z18-velzon-test .z18-section-tabs a,
body.z18-velzon-test .z18-locaux-room-tabs a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 36px;
    padding: 7px 12px;
    border: 1px solid var(--vz-border-color, #e9ebec);
    border-radius: 8px;
    color: var(--vz-body-color, #495057);
    background: var(--vz-light, #f3f6f9);
    font-size: 12px;
    font-weight: 600;
    text-decoration: none !important;
}

body.z18-velzon-test .z18-section-tabs a.is-active,
body.z18-velzon-test .z18-section-tabs a[aria-current="page"],
body.z18-velzon-test .z18-locaux-room-tabs a.is-active,
body.z18-velzon-test .z18-locaux-room-tabs a[aria-current="page"] {
    border-color: #e5483f;
    color: #fff;
    background: #e5483f;
}

/* Formulaires / filtres style Velzon */
body.z18-velzon-test .z18-page-body input[type="text"],
body.z18-velzon-test .z18-page-body input[type="email"],
body.z18-velzon-test .z18-page-body input[type="password"],
body.z18-velzon-test .z18-page-body input[type="number"],
body.z18-velzon-test .z18-page-body input[type="search"],
body.z18-velzon-test .z18-page-body input[type="date"],
body.z18-velzon-test .z18-page-body input[type="time"],
body.z18-velzon-test .z18-page-body select,
body.z18-velzon-test .z18-page-body textarea,
body.z18-velzon-test .account-row input,
body.z18-velzon-test .account-row select,
body.z18-velzon-test .account-row textarea,
body.z18-velzon-test .msgf-tools input[type="text"],
body.z18-velzon-test .msgf-tools select {
    min-height: var(--z18-vz-field-height);
    padding: 8px 12px !important;
    border: 1px solid var(--vz-border-color, #e9ebec) !important;
    border-radius: 7px !important;
    color: var(--vz-body-color, #495057) !important;
    background: var(--vz-input-bg, #fff) !important;
    box-shadow: none !important;
    font-size: 13px;
}

body.z18-velzon-test .z18-account-page .account-row.account-signature-row textarea,
body.z18-velzon-test .z18-account-page #account_signature {
    min-height: 180px !important;
    height: 180px !important;
    width: 100% !important;
    resize: vertical;
}

body.z18-velzon-test .button-input,
body.z18-velzon-test button.button-input,
body.z18-velzon-test input.button-input,
body.z18-velzon-test .z18-page-body .btn,
body.z18-velzon-test .z18-remise-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 36px;
    padding: 0 14px !important;
    border: 1px solid transparent !important;
    border-radius: 7px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    cursor: pointer;
}

body.z18-velzon-test .button-input.bleu,
body.z18-velzon-test input.button-input.bleu,
body.z18-velzon-test .z18-remise-action {
    color: #fff !important;
    background: #405189 !important;
    border-color: #405189 !important;
}

body.z18-velzon-test .button-input.red,
body.z18-velzon-test input.button-input.red {
    color: #fff !important;
    background: #e5483f !important;
    border-color: #e5483f !important;
}

body.z18-velzon-test .msgf-tools {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 18px;
    align-items: end;
}

body.z18-velzon-test .msgf-tools form {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

/* Cartes compte */
body.z18-velzon-test .account-card,
body.z18-velzon-test .jeton-card,
body.z18-velzon-test .boutique-card,
body.z18-velzon-test .jeton-stat,
body.z18-velzon-test .account-stat {
    border: 1px solid var(--vz-border-color, #e9ebec) !important;
    border-radius: var(--z18-vz-radius) !important;
    background: var(--vz-card-bg, #fff) !important;
    box-shadow: var(--z18-vz-shadow);
    color: var(--vz-body-color, #495057);
}

body.z18-velzon-test .account-card {
    overflow: hidden;
    margin-bottom: 16px;
}

body.z18-velzon-test .account-card-title {
    padding: 12px 14px;
    border-bottom: 1px solid var(--vz-border-color, #e9ebec);
    color: var(--vz-heading-color, #343a40) !important;
    background: var(--vz-light, #f3f6f9) !important;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
}

body.z18-velzon-test .account-card-body {
    padding: 14px;
}

body.z18-velzon-test .account-dashboard {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 16px;
    margin-bottom: 16px;
}

body.z18-velzon-test .account-mini-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

body.z18-velzon-test .account-row {
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    margin-bottom: 10px;
}

body.z18-velzon-test .account-connexions th {
    background: var(--vz-light, #f3f6f9) !important;
    color: var(--vz-body-color, #878a99) !important;
}

@media (max-width: 900px) {
    body.z18-velzon-test .account-dashboard,
    body.z18-velzon-test .account-mini-grid {
        grid-template-columns: 1fr;
    }

    body.z18-velzon-test .account-row {
        grid-template-columns: 1fr;
    }
}

/* Mode sombre — couverture large (thème clair forcé : rules inertes) */
html[data-bs-theme="dark"] body.z18-velzon-test .z18-card,
html[data-bs-theme="dark"] body.z18-velzon-test .account-card,
html[data-bs-theme="dark"] body.z18-velzon-test .jeton-card,
html[data-bs-theme="dark"] body.z18-velzon-test .boutique-card,
html[data-bs-theme="dark"] body.z18-velzon-test .jeton-stat,
html[data-bs-theme="dark"] body.z18-velzon-test .account-stat,
html[data-bs-theme="dark"] body.z18-velzon-test .content-gird-1,
html[data-bs-theme="dark"] body.z18-velzon-test .content-gird-2,
html[data-bs-theme="dark"] body.z18-velzon-test .grid-1,
html[data-bs-theme="dark"] body.z18-velzon-test .grid-2 {
    color: var(--vz-body-color, #ced4da) !important;
    background: var(--vz-card-bg, #212529) !important;
    border-color: var(--vz-border-color, #32383e) !important;
}

html[data-bs-theme="dark"] body.z18-velzon-test .z18-card-title,
html[data-bs-theme="dark"] body.z18-velzon-test .title-grid,
html[data-bs-theme="dark"] body.z18-velzon-test .account-card-title {
    color: #f3f6f9 !important;
    background: #2a2f34 !important;
    border-bottom-color: #32383e !important;
}

html[data-bs-theme="dark"] body.z18-velzon-test .z18-section-tabs a,
html[data-bs-theme="dark"] body.z18-velzon-test .z18-locaux-room-tabs a {
    color: #ced4da;
    background: #2a2f34;
    border-color: #32383e;
}

html[data-bs-theme="dark"] body.z18-velzon-test .z18-section-tabs a.is-active,
html[data-bs-theme="dark"] body.z18-velzon-test .z18-section-tabs a[aria-current="page"],
html[data-bs-theme="dark"] body.z18-velzon-test .z18-locaux-room-tabs a.is-active {
    color: #fff;
    background: #e5483f;
    border-color: #e5483f;
}

html[data-bs-theme="dark"] body.z18-velzon-test table.display,
html[data-bs-theme="dark"] body.z18-velzon-test table.z18-table,
html[data-bs-theme="dark"] body.z18-velzon-test #content table:not(.cke_dialog_ui_hbox):not(.cke_dialog_ui_vbox),
html[data-bs-theme="dark"] body.z18-velzon-test .account-connexions {
    color: #ced4da !important;
    background: #212529 !important;
    border-color: #32383e !important;
}

html[data-bs-theme="dark"] body.z18-velzon-test table.display thead th,
html[data-bs-theme="dark"] body.z18-velzon-test table.z18-table thead th,
html[data-bs-theme="dark"] body.z18-velzon-test #content table thead th,
html[data-bs-theme="dark"] body.z18-velzon-test th.th_title,
html[data-bs-theme="dark"] body.z18-velzon-test .account-connexions th {
    color: #f3f6f9 !important;
    background: #2a2f34 !important;
    border-bottom-color: #32383e !important;
}

html[data-bs-theme="dark"] body.z18-velzon-test table tbody tr:hover td {
    background: rgba(229, 72, 63, .08) !important;
}

html[data-bs-theme="dark"] body.z18-velzon-test .account-stat span,
html[data-bs-theme="dark"] body.z18-velzon-test .account-device-item small,
html[data-bs-theme="dark"] body.z18-velzon-test .account-device-empty {
    color: #878a99 !important;
}

html[data-bs-theme="dark"] body.z18-velzon-test .account-stat b,
html[data-bs-theme="dark"] body.z18-velzon-test .account-device-head strong,
html[data-bs-theme="dark"] body.z18-velzon-test .jeton-stat b,
html[data-bs-theme="dark"] body.z18-velzon-test .jeton-card h3,
html[data-bs-theme="dark"] body.z18-velzon-test .boutique-card h3 {
    color: #f3f6f9 !important;
}

html[data-bs-theme="dark"] body.z18-velzon-test .account-device-item,
html[data-bs-theme="dark"] body.z18-velzon-test .account-security-note {
    background: #2a2f34 !important;
    border-color: #32383e !important;
    color: #ced4da !important;
}

html[data-bs-theme="dark"] body.z18-velzon-test .account-danger {
    background: rgba(229, 72, 63, .08) !important;
    border-color: rgba(229, 72, 63, .35) !important;
}

html[data-bs-theme="dark"] body.z18-velzon-test .account-danger .account-card-title {
    background: rgba(159, 47, 42, .85) !important;
    color: #fff !important;
}

html[data-bs-theme="dark"] body.z18-velzon-test .z18-msg-simple-list a,
html[data-bs-theme="dark"] body.z18-velzon-test .z18-msg-thread,
html[data-bs-theme="dark"] body.z18-velzon-test .z18-msg-read-sidebar {
    color: #ced4da;
}

html[data-bs-theme="dark"] .z18-accueil-chip,
html[data-bs-theme="dark"] .z18-accueil-panel,
html[data-bs-theme="dark"] .z18-accueil-stat,
html[data-bs-theme="dark"] .z18-gestion-card,
html[data-bs-theme="dark"] .z18-formation-card {
    color: #ced4da !important;
    background: #212529 !important;
    border-color: #32383e !important;
}