.envt-autopsy-app {
    --envt-primary: #176b4a;
    --envt-primary-dark: #0f5238;
    --envt-surface: #ffffff;
    --envt-bg: #f5f7f6;
    --envt-border: #dce4df;
    --envt-text: #1f2a25;
    --envt-muted: #617068;
    color: var(--envt-text);
    font: inherit;
    margin: 20px 0;
}

.envt-autopsy-app *,
.envt-autopsy-app *::before,
.envt-autopsy-app *::after { box-sizing: border-box; }

/* Pleine largeur (réglage Maintenance, désactivé par défaut) : de nombreux thèmes limitent
   la zone de contenu à une colonne étroite pensée pour du texte, ce qui laisse de grandes
   bandes blanches de part et d'autre d'un tableau large comme le registre. Cette classe fait
   « déborder » le conteneur du shortcode jusqu'aux bords du navigateur via la technique CSS
   classique pleine-largeur (100vw + marges négatives recentrées) — aucune dépendance à un
   gabarit de page particulier du thème. `overflow-x: hidden` neutralise le léger dépassement
   (quelques pixels, la largeur de la barre de défilement verticale) que cette technique peut
   introduire ; le défilement horizontal du tableau lui-même (.envt-table-scroll, imbriqué
   plus loin) n'est pas affecté, il continue de fonctionner normalement à l'intérieur. Si le
   thème applique un `transform` (ou `contain: layout`) à un conteneur parent, le débordement
   peut rester bridé à ce parent au lieu d'atteindre les bords de l'écran — un modèle de page
   « pleine largeur »/« sans barre latérale » côté thème (Attributs de page > Modèle) est
   alors la meilleure alternative. */
.envt-full-width {
    box-sizing: border-box;
    left: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    max-width: 100vw;
    overflow-x: hidden;
    padding-left: 24px;
    padding-right: 24px;
    position: relative;
    right: 50%;
    width: 100vw;
}

.envt-app-nav {
    align-items: center;
    background: var(--envt-surface);
    border: 1px solid var(--envt-border);
    border-radius: 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 18px;
    padding: 8px;
}
.envt-app-nav a {
    border-radius: 9px;
    color: var(--envt-text);
    font-weight: 600;
    padding: 9px 12px;
    text-decoration: none;
}
.envt-app-nav a:hover { background: #eef4f0; color: var(--envt-primary-dark); }
.envt-app-nav .envt-nav-primary { background: var(--envt-primary); color: #fff; }
.envt-app-nav .envt-nav-primary:hover { background: var(--envt-primary-dark); color: #fff; }

.envt-panel {
    background: var(--envt-surface);
    border: 1px solid var(--envt-border);
    border-radius: 16px;
    box-shadow: 0 2px 8px rgba(22, 50, 37, .06);
    margin: 18px 0;
    overflow: hidden;
    padding: 24px;
}
.envt-panel-header {
    align-items: flex-start;
    display: flex;
    gap: 20px;
    justify-content: space-between;
    margin-bottom: 22px;
}
.envt-panel-header h2 { font-size: 1.55rem; line-height: 1.2; margin: 0 0 6px; }
.envt-panel-header p { color: var(--envt-muted); margin: 0; max-width: 820px; }
.envt-header-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.envt-eyebrow { margin-bottom: 8px; }

.envt-section {
    border-top: 1px solid var(--envt-border);
    margin-top: 24px;
    padding-top: 22px;
}
.envt-section:first-child { border-top: 0; margin-top: 0; padding-top: 0; }
.envt-section h3 { font-size: 1.12rem; margin: 0 0 16px; }
.envt-manager-section { background: #fbfaf5; border: 1px solid #e9e1c9; border-radius: 12px; margin-top: 24px; padding: 20px; }
.envt-section-note, .envt-meta-line { color: var(--envt-muted); font-size: .93rem; margin: -7px 0 18px; }

.envt-form-grid-public {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.envt-field { min-width: 0; position: relative; }
.envt-field-textarea { grid-column: 1 / -1; }
.envt-field-label {
    color: #35443c;
    display: block;
    font-size: .9rem;
    font-weight: 650;
    margin: 0 0 7px;
}
.envt-required { color: #b42318; }
.envt-field-help { color: var(--envt-muted); font-size: .82rem; margin-top: 5px; }
.envt-input {
    background: #fff;
    border: 1px solid #b9c6bf;
    border-radius: 8px;
    color: var(--envt-text);
    font: inherit;
    min-height: 44px;
    outline: 0;
    padding: 9px 11px;
    transition: border-color .15s, box-shadow .15s;
    width: 100%;
}
.envt-input:focus { border-color: var(--envt-primary); box-shadow: 0 0 0 3px rgba(23, 107, 74, .13); }
.envt-textarea { min-height: 110px; resize: vertical; }
.envt-input-suffix { color: var(--envt-muted); font-size: .9rem; margin-left: 6px; }
.envt-readonly-value {
    background: var(--envt-bg);
    border: 1px solid var(--envt-border);
    border-radius: 8px;
    min-height: 44px;
    padding: 10px 11px;
}
/* System fields (e.g. the dossier number) are never editable: a locked/greyed,
   diagonally-hatched look makes that unmistakable, distinct from a field that is
   only temporarily read-only (e.g. once a request has been taken over). */
.envt-field-readonly .envt-readonly-value {
    background-color: #eef1ef;
    background-image: repeating-linear-gradient(135deg, rgba(0,0,0,.035) 0 6px, transparent 6px 12px);
    color: var(--envt-muted);
    font-weight: 650;
}
.envt-choice-group { display: flex; flex-wrap: wrap; gap: 12px 18px; padding: 8px 0; }
.envt-choice-group label { align-items: center; display: inline-flex; gap: 6px; }
.envt-other-input { margin-top: 8px; }

.envt-form-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.envt-button {
    align-items: center;
    background: #fff;
    border: 1px solid #aebbb4;
    border-radius: 9px;
    color: var(--envt-text);
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-weight: 650;
    justify-content: center;
    min-height: 40px;
    padding: 9px 14px;
    text-decoration: none !important;
}
.envt-button:hover { background: #f1f5f3; color: var(--envt-primary-dark); }
.envt-button-primary { background: var(--envt-primary); border-color: var(--envt-primary); color: #fff !important; }
.envt-button-primary:hover { background: var(--envt-primary-dark); border-color: var(--envt-primary-dark); color: #fff !important; }
.envt-button-ghost { border-color: transparent; }
.envt-button-small { min-height: 34px; padding: 6px 10px; }

.envt-message { border-radius: 10px; margin: 12px 0 18px; padding: 12px 14px; }
.envt-message-success { background: #e9f7ef; border: 1px solid #b8dfc8; color: #175d35; }
.envt-message-error { background: #fdf0ef; border: 1px solid #efc2bf; color: #8f251d; }
.envt-message-info { background: #eef5fb; border: 1px solid #c5dced; color: #25536f; }
.envt-message-warning { background: #fff3d6; border: 1px solid #f0dba3; color: #7a4b00; }
.envt-empty { background: var(--envt-bg); border-radius: 10px; color: var(--envt-muted); padding: 22px; text-align: center; }

.envt-table-wrap { overflow-x: auto; width: 100%; }
.envt-table { border-collapse: separate; border-spacing: 0; font-size: .92rem; min-width: 760px; width: 100%; }
.envt-table th { background: #f0f4f2; color: #405047; font-size: .78rem; font-weight: 750; letter-spacing: .02em; padding: 10px 11px; text-align: left; text-transform: uppercase; white-space: nowrap; }
.envt-table td { border-top: 1px solid var(--envt-border); padding: 11px; vertical-align: top; }
/* Optional pale alternating-row background (Maintenance > "Lignes alternées"), applied
   to every table on the page via the .envt-zebra-rows class on the outer wrapper. Written
   at the same selector specificity as the :hover rule just below and placed before it, so
   that on an even row being hovered, the hover shade still wins (later rule, same weight)
   instead of the stripe flattening the hover feedback. */
.envt-zebra-rows tbody tr:nth-child(even) td { background: #f6f8f7; }
.envt-table tbody tr:hover td { background: #fafcfb; }
.envt-actions { white-space: nowrap; }
.envt-actions a { font-weight: 650; margin-right: 12px; text-decoration: none; }
.envt-register-scroll { max-height: 70vh; }
.envt-register-table { min-width: max-content; }
.envt-register-table th, .envt-register-table td { max-width: 300px; min-width: 130px; }
.envt-register-table thead th { position: sticky; top: 0; z-index: 2; }
/* Numéro de dossier, Statut, Actions: ordered first, but NOT pinned/sticky — that was
   tried in 0.3.3 (position: sticky + left offsets) and dropped in 0.3.5 after feedback
   that pinning the first three columns didn't actually help while scrolling the
   register. The order is kept; only the fixed-width/no-wrap styling on the dossier
   number remains, so a long value doesn't blow the column out. */
.envt-register-table .envt-register-col-1 { max-width: 160px; min-width: 160px; width: 160px; }
.envt-register-table .envt-register-col-1 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.envt-register-table .envt-register-col-2 { max-width: 140px; min-width: 140px; width: 140px; }
.envt-register-table .envt-register-col-3 { max-width: 195px; min-width: 195px; width: 195px; }

/* "Filtre par colonne": collapsed by default (opened automatically server-side, via the
   envt-column-filters-open class, when a column filter is already active from the URL);
   the toggle button in the filter bar flips this class client-side (see envt-autopsy-public.js). */
.envt-column-filter-row { display: none; }
.envt-column-filters-open .envt-column-filter-row { display: table-row; }
.envt-column-filter-row td { background: #f6f8f7; padding: 6px 10px; }
.envt-input-small { font-size: .82rem; min-height: 30px; padding: 4px 8px; width: 100%; }

.envt-filter-bar { align-items: end; display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 16px; }
.envt-filter-field {
    display: flex;
    flex: 1 1 200px;
    flex-direction: column;
    gap: 5px;
    max-width: 320px;
    min-width: 160px;
}
.envt-filter-label { color: var(--envt-muted); font-size: .82rem; font-weight: 650; }
.envt-filter-bar .envt-input { min-height: 38px; padding: 7px 10px; }
.envt-filter-bar .envt-filter-submit { flex: 0 0 auto; }

.envt-chip { border-radius: 999px; display: inline-block; font-size: .76rem; font-weight: 750; padding: 4px 9px; white-space: nowrap; }
.envt-chip-draft { background: #eef1f0; color: #4b5a53; border: 1px dashed #b9c6bf; }
.envt-chip-submitted { background: #fff3d6; color: #7a4b00; }
.envt-chip-taken_over { background: #e8f1fb; color: #235c8d; }
.envt-chip-in_progress { background: #eeeafd; color: #5b3a9c; }
.envt-chip-completed { background: #e5f5eb; color: #1d6b3c; }
.envt-chip-cancelled { background: #fce8e6; color: #8f251d; }

.envt-muted { color: var(--envt-muted); }

.envt-group-heading {
    color: var(--envt-primary-dark);
    font-size: .82rem;
    font-weight: 750;
    letter-spacing: .03em;
    margin: 26px 0 12px;
    text-transform: uppercase;
}
.envt-group-heading:first-child { margin-top: 4px; }
.envt-field-manager .envt-field-label { color: #6b5713; }

.envt-link-button {
    background: none;
    border: 0;
    color: var(--envt-primary-dark);
    cursor: pointer;
    font: inherit;
    font-weight: 650;
    padding: 0;
    text-decoration: underline;
}
.envt-link-danger, a.envt-link-danger, .envt-link-button.envt-link-danger { color: #b42318; }
.envt-inline-form { display: inline-block; margin-right: 12px; }
.envt-button-danger { background: #b42318; border-color: #b42318; color: #fff !important; }
.envt-button-danger:hover { background: #8f251d; border-color: #8f251d; color: #fff !important; }

.envt-badge { border-radius: 999px; display: inline-block; font-size: .74rem; font-weight: 700; padding: 3px 9px; white-space: nowrap; }
.envt-badge-manager { background: #fbf1d3; color: #6b5713; }
.envt-badge-requester { background: #e8f1fb; color: #235c8d; }

.envt-pager { align-items: center; display: flex; gap: 12px; justify-content: center; margin-top: 18px; }
.envt-pager-status { color: var(--envt-muted); font-size: .86rem; font-weight: 600; }

/* ---- Multi-step wizard (requester entry form) ---- */
.envt-wizard-progress {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 24px;
}
.envt-wizard-tab {
    align-items: center;
    background: var(--envt-bg);
    border: 1px solid var(--envt-border);
    border-radius: 10px;
    color: var(--envt-muted);
    cursor: pointer;
    display: flex;
    /* grow to fill whichever row it lands on, shrink rather than force a
       horizontal scrollbar if even one tab is wider than the viewport,
       never go below a size where the number + a couple of words stay
       legible. No fixed count of tabs per row: with flex-wrap on the
       parent, the browser fits as many as the current width allows and
       wraps the rest onto as many additional rows as needed — this keeps
       working the same way regardless of how many step groups a given
       site's field configuration ends up producing. */
    flex: 1 1 150px;
    font: inherit;
    font-weight: 650;
    gap: 8px;
    padding: 9px 12px;
    text-align: left;
    white-space: nowrap;
}
.envt-wizard-tab-num {
    align-items: center;
    background: #fff;
    border: 1px solid #b9c6bf;
    border-radius: 50%;
    display: inline-flex;
    flex-shrink: 0;
    font-size: .78rem;
    height: 22px;
    justify-content: center;
    width: 22px;
}
.envt-wizard-tab.is-active { background: var(--envt-surface); border-color: var(--envt-primary); color: var(--envt-text); }
.envt-wizard-tab.is-active .envt-wizard-tab-num { background: var(--envt-primary); border-color: var(--envt-primary); color: #fff; }
.envt-wizard-tab.is-done .envt-wizard-tab-num { background: #e5f5eb; border-color: #bfe3cd; color: #1d6b3c; }
.envt-wizard-step { display: none; }
.envt-wizard-step.is-active, .envt-wizard-step.envt-force-visible { display: block; }
.envt-wizard-tab.envt-step-unavailable { display: none; }
.envt-wizard-step-title { color: var(--envt-primary-dark); font-size: .82rem; font-weight: 750; letter-spacing: .03em; margin: 0 0 14px; text-transform: uppercase; }
.envt-wizard-step-nav { display: flex; gap: 10px; justify-content: space-between; margin-top: 22px; }
.envt-wizard-step-nav:has(.envt-button:only-child) { justify-content: flex-end; }

/* ---- Audit timeline ---- */
.envt-timeline { list-style: none; margin: 0; padding: 0; }
.envt-timeline-item { display: flex; gap: 12px; padding: 10px 0; position: relative; }
.envt-timeline-item + .envt-timeline-item { border-top: 1px solid var(--envt-border); }
.envt-timeline-marker { background: var(--envt-primary); border-radius: 50%; flex-shrink: 0; height: 9px; margin-top: 6px; width: 9px; }
.envt-timeline-headline { font-weight: 650; }
.envt-timeline-meta { color: var(--envt-muted); font-size: .84rem; margin-top: 2px; }
.envt-timeline-detail { background: var(--envt-bg); border-radius: 8px; font-size: .88rem; margin-top: 6px; padding: 8px 10px; white-space: pre-wrap; }

.envt-detail-grid {
    display: grid;
    gap: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
}
.envt-detail-item { border-bottom: 1px solid var(--envt-border); padding: 12px 14px 12px 0; }
.envt-detail-item dt { color: var(--envt-muted); font-size: .78rem; font-weight: 700; margin-bottom: 4px; text-transform: uppercase; }
.envt-detail-item dd { margin: 0; white-space: pre-wrap; }

.envt-hidden-by-condition { display: none !important; }

/* Below this width, a data table becomes a stack of labelled cards instead of a
   horizontally-scrolling table — used for "Mes demandes" and the manager list, whose
   column count stays reasonable. The big multi-column shared register keeps its
   horizontal scroll (too many columns for cards to stay readable), which is fine since
   it's mostly a desktop tool for the manager anyway. */
.envt-cards-on-mobile .envt-table { min-width: 0; }

@media (max-width: 760px) {
    .envt-panel { border-radius: 12px; padding: 16px; }
    .envt-panel-header { display: block; }
    .envt-panel-header .envt-button, .envt-panel-header .envt-header-actions { margin-top: 12px; }
    .envt-form-grid-public, .envt-detail-grid { grid-template-columns: 1fr; }
    .envt-field-textarea { grid-column: auto; }
    .envt-manager-section { margin-left: -4px; margin-right: -4px; padding: 15px; }
    .envt-wizard-tab-label { display: none; }
    .envt-wizard-tab { flex: 0 0 auto; padding: 9px; }
    .envt-filter-bar { align-items: stretch; flex-direction: column; }
    .envt-filter-field { max-width: none; }
    .envt-filter-bar .envt-filter-submit { flex: 1 1 auto; }

    .envt-cards-on-mobile table,
    .envt-cards-on-mobile thead,
    .envt-cards-on-mobile tbody,
    .envt-cards-on-mobile tr,
    .envt-cards-on-mobile td { display: block; width: 100%; }
    .envt-cards-on-mobile thead { position: absolute; left: -9999px; top: -9999px; }
    .envt-cards-on-mobile tr {
        background: var(--envt-surface);
        border: 1px solid var(--envt-border);
        border-radius: 12px;
        margin-bottom: 12px;
        padding: 10px 12px;
    }
    .envt-cards-on-mobile td {
        border-top: 0;
        display: flex;
        gap: 12px;
        justify-content: space-between;
        padding: 7px 0;
        text-align: right;
    }
    .envt-cards-on-mobile td::before {
        color: var(--envt-muted);
        content: attr(data-label);
        flex-shrink: 0;
        font-size: .78rem;
        font-weight: 700;
        text-align: left;
        text-transform: uppercase;
    }
    .envt-cards-on-mobile td.envt-actions { justify-content: flex-start; }
    .envt-cards-on-mobile td.envt-actions::before { display: none; }
}