/* ==========================================================
   WeddingPart — Tool Bar (refonte v2)
   --------------------------------------------------------
   Design "floating pill" en bas d'écran, fixe, mobile-first.
   Inspiration : Canva/Procreate mobile, Apple Photos editor.

   Avantages :
   - Toujours accessible (zone pouce sur mobile)
   - Frosted glass + ombre douce → flotte au-dessus du canvas
   - Scrollable horizontalement si trop d'actions
   - Safe-area-inset pour iPhone notch/home indicator
   - Le panneau d'actions secondaires s'ouvre en bottom-sheet
     (sliding-up) sur mobile et reste docké à gauche sur desktop
     (override par chaque plugin via .idd-pb-root / .idd-am-root)

   Structure HTML attendue (inchangée par rapport à v1 — c'est juste
   la mise en forme qui bouge) :

   <div class="idd-tool-toolbar" data-idd-tb>
     <div class="idd-tool-toolbar__left">…</div>
     <div class="idd-tool-toolbar__center">…</div>
     <div class="idd-tool-toolbar__right">…</div>
   </div>
   <aside class="idd-tool-panel">…</aside>
   ========================================================== */

:root {
    --idd-tb-height-mobile:  56px;
    --idd-tb-height-desktop: 60px;
    --idd-tb-radius-pill:    999px;
    --idd-tb-bottom-gap:     14px;
    /* Z-index : le panneau d'outils DOIT passer AU-DESSUS du chrome de
       l'app-shell (header=100, sidebar/shell-bar=200) sinon son bouton
       « fermer » se retrouve masqué sous le header sur mobile. On reste
       sous le modal « Tous les outils » (--z-modal = 9500). */
    --idd-tb-z-bar:          40;
    --idd-tb-z-backdrop:     9400;
    --idd-tb-z-panel:        9450;
}

/* ──────────────────────────────────────────────────────────
   .idd-tool-toolbar v3 — full-width edge-to-edge, collée juste
   AU-DESSUS de la shell-bar. Plus de pill flottante : les deux
   barres forment une pile cohérente au bas de l'écran.
   ────────────────────────────────────────────────────────── */
.idd-tool-toolbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: calc(60px + env(safe-area-inset-bottom, 0px));  /* au-dessus de la shell-bar (60px) */
    z-index: var(--idd-tb-z-bar);

    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px 10px;
    min-height: 56px;

    background: rgba(255, 255, 255, 0.97);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-top: 1px solid rgba(0,0,0,0.06);
    border-bottom: 1px solid rgba(0,0,0,0.04);
    box-shadow: 0 -10px 28px -10px rgba(0,0,0,0.10);

    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;

    transition: transform .25s cubic-bezier(.2,.8,.2,1),
                opacity .2s ease;
}
.idd-tool-toolbar::-webkit-scrollbar { display: none; }

/* Cache la barre quand un panneau plein écran (du shell) est ouvert */
body.is-panel-open .idd-tool-toolbar,
body.is-shell-actions-open .idd-tool-toolbar {
    transform: translateY(110%);
    opacity: 0;
    pointer-events: none;
}

/* Zones */
.idd-tool-toolbar__left,
.idd-tool-toolbar__center,
.idd-tool-toolbar__right {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}
.idd-tool-toolbar__center {
    flex: 1 1 auto;
    min-width: 0;
    justify-content: center;
    padding: 0 8px;
}

/* Séparateur visuel discret entre les zones (desktop) */
@media (min-width: 768px) {
    .idd-tool-toolbar__left + .idd-tool-toolbar__center::before {
        content: '';
        width: 1px;
        height: 24px;
        background: rgba(0,0,0,0.08);
        margin: 0 4px 0 0;
    }
    .idd-tool-toolbar__center + .idd-tool-toolbar__right::before {
        content: '';
        width: 1px;
        height: 24px;
        background: rgba(0,0,0,0.08);
        margin: 0 0 0 4px;
    }
}

/* ──────────────────────────────────────────────────────────
   Boutons (icône, retour, burger)
   ────────────────────────────────────────────────────────── */
.idd-tool-toolbar__btn,
.idd-tool-toolbar__burger,
.idd-tool-toolbar__back {
    appearance: none;
    background: transparent;
    border: 1px solid transparent;
    color: var(--app-ink, #2D3748);
    width: 44px;
    height: 44px;
    padding: 0;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    font: inherit;
    transition: background-color .15s ease, color .15s ease, transform .12s ease;
}
.idd-tool-toolbar__btn:hover,
.idd-tool-toolbar__burger:hover,
.idd-tool-toolbar__back:hover {
    background: rgba(0,0,0,0.05);
}
.idd-tool-toolbar__btn:active,
.idd-tool-toolbar__burger:active,
.idd-tool-toolbar__back:active {
    transform: scale(.94);
}
.idd-tool-toolbar__btn:focus-visible,
.idd-tool-toolbar__burger:focus-visible,
.idd-tool-toolbar__back:focus-visible {
    outline: 2px solid var(--app-brand, #9E4D64);
    outline-offset: 2px;
}
.idd-tool-toolbar__btn[disabled],
.idd-tool-toolbar__btn[aria-disabled="true"] {
    opacity: .30;
    cursor: not-allowed;
    pointer-events: none;
}
.idd-tool-toolbar__btn svg,
.idd-tool-toolbar__back svg {
    width: 20px; height: 20px;
    stroke-width: 1.8;
    flex-shrink: 0;
}
.idd-tool-toolbar__btn.is-active {
    background: var(--app-brand-soft, rgba(181,99,122,0.16));
    color: var(--app-brand-dark, #9A4F65);
    border-color: var(--app-brand-border, rgba(181,99,122,0.30));
}

/* Bouton retour : label visible dès que la place le permet */
.idd-tool-toolbar__back {
    padding: 0 12px;
    gap: 6px;
    width: auto;
    min-width: 44px;
    color: var(--app-muted, #718096);
    font-size: 13px;
    font-weight: 600;
}
.idd-tool-toolbar__back svg { width: 16px; height: 16px; stroke-width: 2.2; }

/* Labels — cachés sur mobile par défaut */
.idd-tool-toolbar__label { display: none; }

/* Burger = bouton "Plus" mis en avant (point d'accès au panneau outils) */
.idd-tool-toolbar__burger {
    background: var(--app-brand, #9E4D64);
    color: #fff;
    border-color: var(--app-brand-dark, #9A4F65);
}
.idd-tool-toolbar__burger:hover {
    background: var(--app-brand-dark, #9A4F65);
}
.idd-tool-toolbar__burger-lines {
    width: 16px;
    height: 14px;
    position: relative;
    display: block;
}
.idd-tool-toolbar__burger-lines span {
    position: absolute;
    left: 0; right: 0;
    height: 2px;
    background: currentColor;
    border-radius: 2px;
    transition: transform .25s ease, opacity .2s ease, top .25s ease;
}
.idd-tool-toolbar__burger-lines span:nth-child(1) { top: 1px; }
.idd-tool-toolbar__burger-lines span:nth-child(2) { top: 6px; }
.idd-tool-toolbar__burger-lines span:nth-child(3) { top: 11px; }
.idd-tool-toolbar__burger[aria-expanded="true"] .idd-tool-toolbar__burger-lines span:nth-child(1) {
    top: 6px; transform: rotate(45deg);
}
.idd-tool-toolbar__burger[aria-expanded="true"] .idd-tool-toolbar__burger-lines span:nth-child(2) {
    opacity: 0;
}
.idd-tool-toolbar__burger[aria-expanded="true"] .idd-tool-toolbar__burger-lines span:nth-child(3) {
    top: 6px; transform: rotate(-45deg);
}

/* ──────────────────────────────────────────────────────────
   Zone centre — titre + statut sauvegarde
   ────────────────────────────────────────────────────────── */
.idd-tool-toolbar__title {
    display: none;        /* caché par défaut, redondant avec le header shell */
}
.idd-tool-toolbar__status {
    font-size: 11px;
    color: var(--app-muted, #718096);
    line-height: 1.2;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0 6px;
}
.idd-tool-toolbar__status[data-status="saving"] { color: var(--app-brand-dark, #9A4F65); }
.idd-tool-toolbar__status[data-status="error"]  { color: #C0392B; }
.idd-tool-toolbar__status[data-status="saved"]  { color: #4A8F5F; }

/* ──────────────────────────────────────────────────────────
   CTA primaire dans __right (« Télécharger »)
   ────────────────────────────────────────────────────────── */
.idd-tool-toolbar__right .btn,
.idd-tool-toolbar__right button.idd-tool-toolbar__primary,
.idd-tool-toolbar__primary {
    appearance: none;
    background: var(--app-brand, #9E4D64);
    color: #fff;
    border: 1px solid var(--app-brand-dark, #9A4F65);
    height: 44px;
    padding: 0 14px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: background-color .15s ease, transform .12s ease;
    flex-shrink: 0;
}
.idd-tool-toolbar__primary:hover { background: var(--app-brand-dark, #9A4F65); }
/* Bouton principal en lien (<a>, export PDF) : certains outils colorent tous leurs liens (ex. « .pr2 a ») ;
   le texte et l'icône restent blancs, sinon violet sur violet (7/10/2026). */
.idd-tool-toolbar a.idd-tool-toolbar__primary,
.idd-tool-toolbar a.idd-tool-toolbar__primary:hover,
.idd-tool-toolbar a.idd-tool-toolbar__primary:focus,
.idd-tool-toolbar a.idd-tool-toolbar__primary:visited { color: #fff; text-decoration: none; }
.idd-tool-toolbar__primary:active { transform: scale(.97); }
.idd-tool-toolbar__primary svg { width: 16px; height: 16px; stroke-width: 2; }
.idd-tool-toolbar__primary-label { display: none; }
.idd-tool-toolbar__primary-label,
.idd-tool-toolbar__back > span.idd-tool-toolbar__label { /* label libellé du retour */
    display: none;
}

/* ──────────────────────────────────────────────────────────
   Tablette ≥ 600px : labels du retour visibles
   Desktop ≥ 768px : labels secondaires visibles aussi
   ────────────────────────────────────────────────────────── */
@media (min-width: 600px) {
    .idd-tool-toolbar__back .idd-tool-toolbar__label { display: inline; }
}

@media (min-width: 768px) {
    .idd-tool-toolbar {
        min-height: var(--idd-tb-height-desktop);
        gap: 6px;
        padding: 8px;
    }
    /* Boutons secondaires : ICÔNE SEULE par défaut (desktop compris) pour que
       la toolbar ne déborde JAMAIS de l'écran, quel que soit le nombre de
       boutons. Le libellé ne s'affiche que si le bouton est explicitement
       marqué data-icon-only="false". Le title / aria-label reste lu au survol
       et par les lecteurs d'écran. */
    .idd-tool-toolbar__btn {
        width: 44px;
        min-width: 44px;
        padding: 0;
        gap: 6px;
    }
    .idd-tool-toolbar__btn[data-icon-only="false"] {
        width: auto;
        padding: 0 12px;
    }
    .idd-tool-toolbar__btn .idd-tool-toolbar__label { display: none; }
    .idd-tool-toolbar__btn[data-icon-only="false"] .idd-tool-toolbar__label { display: inline; }
    .idd-tool-toolbar__label { font-size: 13px; font-weight: 500; }
    .idd-tool-toolbar__status { font-size: 12px; }
    .idd-tool-toolbar__primary { padding: 0 20px; }
    .idd-tool-toolbar__primary-label { display: inline; }
}

/* ──────────────────────────────────────────────────────────
   Filet de sécurité desktop : une toolbar très riche (éditeurs
   plan-salle / plan-technique) peut, sur un petit écran, dépasser
   malgré le mode icône. On affiche alors un fin indicateur de
   défilement pour que TOUT reste atteignable (le burger surtout).
   Sur les outils dont la barre tient, rien ne s'affiche.
   ────────────────────────────────────────────────────────── */
@media (min-width: 1024px) {
    .idd-tool-toolbar {
        scrollbar-width: thin;
        scrollbar-color: rgba(29,24,25,.22) transparent;
    }
    .idd-tool-toolbar::-webkit-scrollbar { display: block; height: 6px; }
    .idd-tool-toolbar::-webkit-scrollbar-thumb {
        background: rgba(29,24,25,.20);
        border-radius: 999px;
    }
    .idd-tool-toolbar::-webkit-scrollbar-track { background: transparent; }
}

/* ──────────────────────────────────────────────────────────
   Panneau d'actions secondaires
   ----------------------------------------------------------
   Par défaut (mobile) : slide-up depuis le bas (bottom-sheet)
   Sur desktop : chaque plugin décide où le docker (override
   via .idd-pb-root / .idd-am-root .idd-tool-panel)
   ────────────────────────────────────────────────────────── */

.idd-tool-panel-backdrop {
    position: fixed;
    inset: 0;
    top: var(--app-adminbar-h, 0);
    background: rgba(29,24,25,0.50);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    z-index: var(--idd-tb-z-backdrop);
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, visibility .25s ease;
}
body.is-idd-tb-panel-open .idd-tool-panel-backdrop {
    opacity: 1;
    visibility: visible;
}

.idd-tool-panel {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    max-height: 88vh;
    width: auto;
    z-index: var(--idd-tb-z-panel);
    background: var(--app-bg, #FAFAF8);
    border-top-left-radius: 22px;
    border-top-right-radius: 22px;
    border-left: 0;
    box-shadow: 0 -22px 60px -10px rgba(0,0,0,0.25);
    display: flex;
    flex-direction: column;
    transform: translateY(100%);
    visibility: hidden;
    transition: transform .3s cubic-bezier(.2,.8,.2,1), visibility .3s ease;
    padding-bottom: env(safe-area-inset-bottom, 0px);
}
body.is-idd-tb-panel-open .idd-tool-panel {
    transform: translateY(0);
    visibility: visible;
}

/* ──────────────────────────────────────────────────────────
   Bibliothèque (second panneau, octobre 2026) — <aside class="idd-tool-panel idd-tool-panel--library" data-idd-tb-library>.
   Téléphone / tablette : volet séparé (ouvert par [data-idd-tb-library-open]), jamais en même temps que les outils.
   Ordinateur : chaque outil le docke à droite (grille « outils | plan | bibliothèque »).
   ────────────────────────────────────────────────────────── */
body.is-idd-tb-panel-open .idd-tool-panel.idd-tool-panel--library { transform: translateY(100%); visibility: hidden; }
body.is-idd-tb-library-open .idd-tool-panel.idd-tool-panel--library { transform: translateY(0); visibility: visible; }
body.is-idd-tb-library-open .idd-tool-panel-backdrop { opacity: 1; visibility: visible; }
.idd-tool-panel__search { position: relative; padding: 2px 16px 10px; flex-shrink: 0; }
.idd-tool-panel__search svg { position: absolute; left: 28px; top: 50%; width: 16px; height: 16px; margin-top: -9px; color: var(--app-muted, #8B8579); pointer-events: none; }
.idd-tool-panel__search input {
    width: 100%; height: 42px; box-sizing: border-box; padding: 0 12px 0 38px;
    border: 1px solid var(--app-line, #E2D9CC); border-radius: 12px; background: #fff;
    font: inherit; font-size: 15px; color: var(--app-fg, #2A2620);
}
.idd-tool-panel__search input:focus { outline: 2px solid var(--app-brand, #B5637A); outline-offset: 1px; border-color: transparent; }
.idd-tool-panel__search input::-webkit-search-cancel-button {
    -webkit-appearance: none; appearance: none; width: 18px; height: 18px; cursor: pointer;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E4D64' stroke-width='2.4' stroke-linecap='round'><line x1='18' y1='6' x2='6' y2='18'/><line x1='6' y1='6' x2='18' y2='18'/></svg>") center / 16px no-repeat;
}
.idd-tool-panel__empty { padding: 18px 6px; color: var(--app-muted, #8B8579); font-size: 14px; text-align: center; }
@media (min-width: 1280px) {
    .idd-tool-toolbar__btn--library { display: none !important; }  /* grand écran : la bibliothèque est affichée à droite en permanence */
}

/* Drag handle */
.idd-tool-panel::before {
    content: '';
    display: block;
    width: 42px;
    height: 4px;
    background: rgba(0,0,0,0.15);
    border-radius: 2px;
    margin: 8px auto 4px;
    flex-shrink: 0;
}

.idd-tool-panel__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 18px 12px;
    border-bottom: 1px solid var(--app-line, #E2D9CC);
    background: transparent;
    flex-shrink: 0;
}
.idd-tool-panel__title {
    margin: 0;
    font-family: var(--font-serif, 'Cormorant Garamond', serif);
    font-size: 20px;
    font-weight: 700;
    color: var(--app-ink, #2D3748);
    letter-spacing: -.01em;
}
.idd-tool-panel__close {
    appearance: none;
    background: transparent;
    border: 1px solid var(--app-line, #E2D9CC);
    color: var(--app-ink, #2D3748);
    width: 36px;
    height: 36px;
    border-radius: 999px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.idd-tool-panel__close:hover { background: var(--app-surface-2, #F4EFE6); }
.idd-tool-panel__close svg { width: 16px; height: 16px; stroke-width: 2; }

.idd-tool-panel__body {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    -webkit-overflow-scrolling: touch;
}

.idd-tool-panel__group {
    margin-bottom: 22px;
}
.idd-tool-panel__group:last-child { margin-bottom: 0; }
.idd-tool-panel__group-title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--app-brand, #9E4D64);
    margin: 0 0 10px;
}
.idd-tool-panel__list {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.idd-tool-panel__item {
    appearance: none;
    background: var(--app-surface, #fff);
    border: 1px solid var(--app-line, #E2D9CC);
    color: var(--app-ink, #2D3748);
    text-align: left;
    width: 100%;
    padding: 12px 14px;
    border-radius: 12px;
    cursor: pointer;
    font: inherit;
    font-size: 14px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 12px;
    transition: background-color .15s ease, border-color .15s ease, transform .12s ease;
    line-height: 1.25;
}
.idd-tool-panel__item:hover {
    background: var(--app-surface-2, #F4EFE6);
    border-color: var(--app-brand-border, rgba(181,99,122,0.35));
}
.idd-tool-panel__item:active { transform: scale(.98); }
.idd-tool-panel__item svg {
    width: 18px;
    height: 18px;
    stroke-width: 1.8;
    flex-shrink: 0;
    color: var(--app-muted, #718096);
}
.idd-tool-panel__item-text {
    flex: 1;
    min-width: 0;
}
.idd-tool-panel__item-label {
    display: block;
    font-weight: 600;
    color: var(--app-ink, #2D3748);
}
.idd-tool-panel__item-hint {
    display: block;
    font-size: 12px;
    font-weight: 400;
    color: var(--app-muted, #718096);
    margin-top: 2px;
}
.idd-tool-panel__item--danger {
    color: #C0392B;
    border-color: rgba(192,57,43,0.25);
}
.idd-tool-panel__item--danger svg { color: #C0392B; }
.idd-tool-panel__item--danger:hover { background: rgba(192,57,43,0.06); }

.idd-tool-panel__footer {
    padding: 12px 16px;
    border-top: 1px solid var(--app-line, #E2D9CC);
    background: var(--app-surface, #fff);
    font-size: 12px;
    color: var(--app-muted, #718096);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-shrink: 0;
}

/* ──────────────────────────────────────────────────────────
   DOUBLE TOOLBAR -> SIMPLE TOOLBAR
   On masque .app-bottomnav (legacy) ET .idd-shell-bar (v3) :
   l'utilisateur a demande qu'il n'y ait qu'UNE seule barre,
   celle du haut (.app-header) avec son bouton "Tous les outils"
   qui ouvre le panel plein ecran.
   La logique contextuelle "Plus d'actions" du shell-bar est
   conservee dans le panel principal (item "Voir tous mes outils").
   ────────────────────────────────────────────────────────── */
.app-bottomnav,
.idd-shell-bar,
.idd-shell-actions-backdrop,
#idd-shell-actions-panel { display: none !important; }

/* Plus de padding-bottom reserve : la shell-bar n'existe plus visuellement.
   On garde uniquement l'espace pour la safe-area iOS (notch bas). */
body.idd-tools-body .app-workspace {
    padding-bottom: env(safe-area-inset-bottom, 0px);
}
body.idd-pb-active .app-workspace,
body.idd-am-active .app-workspace {
    padding-bottom: 0;
}

/* ══════════════════════════════════════════════════════════
   .idd-shell-bar v3 — PLEINE LARGEUR, EDGE-TO-EDGE, fixe bas.
   Présente sur TOUS les outils (y compris pb/am qui ont leur
   toolbar v2 contextuelle EMPILÉE AU-DESSUS).
   ══════════════════════════════════════════════════════════ */

/* Cache la shell-bar quand le panel plein écran (shell ou shell-actions) est ouvert */
body.is-panel-open .idd-shell-bar,
body.is-shell-actions-open .idd-shell-bar { transform: translateY(110%); }

/* Quand une toolbar v2 est empilée au-dessus, la shell-bar perd son
   ombre (couverte) et son border-top (la toolbar v2 a le sien) */
body.idd-pb-active .idd-shell-bar,
body.idd-am-active .idd-shell-bar {
    box-shadow: none;
    border-top: 0;
}

.idd-shell-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--idd-tb-z-bar, 40);

    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 8px;
    padding: 8px 14px calc(8px + env(safe-area-inset-bottom, 0px));
    min-height: 60px;

    background: rgba(255,255,255,0.97);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-top: 1px solid rgba(0,0,0,0.06);
    box-shadow: 0 -8px 24px -8px rgba(0,0,0,0.10);
    transition: transform .3s cubic-bezier(.2,.8,.2,1);
}

/* Bouton retour Mes outils (gauche) */
.idd-shell-bar__back {
    appearance: none;
    background: transparent;
    border: 0;
    color: var(--app-muted, #718096);
    height: 44px;
    padding: 0 14px 0 4px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    text-decoration: none;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    transition: background-color .15s ease, color .15s ease;
    flex-shrink: 0;
}
.idd-shell-bar__back:hover {
    background: rgba(0,0,0,0.05);
    color: var(--app-ink, #2D3748);
    text-decoration: none;
}
.idd-shell-bar__back:active { transform: scale(.96); }
.idd-shell-bar__back svg { width: 18px; height: 18px; stroke-width: 2; }

/* Titre central (eyebrow + nom) */
.idd-shell-bar__title {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 0;
    text-align: center;
    line-height: 1.15;
    padding: 0 4px;
}
.idd-shell-bar__title-eyebrow {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--app-brand, #9E4D64);
    line-height: 1;
}
.idd-shell-bar__title-name {
    font-family: var(--font-serif, 'Cormorant Garamond', serif);
    font-size: 16px;
    font-weight: 700;
    color: var(--app-ink, #2D3748);
    margin-top: 2px;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Bouton "+" droite — bouton circulaire brand (icône seule).
   Anime en croix × quand le panel est ouvert. */
.idd-shell-bar__plus {
    appearance: none;
    background: linear-gradient(135deg, var(--app-brand, #9E4D64), var(--app-brand-dark, #9A4F65));
    border: 0;
    color: #fff;
    width: 48px;
    height: 48px;
    padding: 0;
    border-radius: 999px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color .15s ease, transform .12s ease, box-shadow .15s ease;
    flex-shrink: 0;
    box-shadow: 0 4px 14px -4px rgba(181,99,122,0.55);
}
.idd-shell-bar__plus:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 22px -4px rgba(181,99,122,0.70);
}
.idd-shell-bar__plus:active { transform: scale(.95); }
.idd-shell-bar__plus:focus-visible {
    outline: 2px solid var(--app-brand-dark, #9A4F65);
    outline-offset: 2px;
}
.idd-shell-bar__plus-cross {
    width: 18px;
    height: 18px;
    position: relative;
    display: inline-block;
    flex-shrink: 0;
}
.idd-shell-bar__plus-cross span {
    position: absolute;
    background: currentColor;
    border-radius: 2px;
    transition: transform .3s cubic-bezier(.2,.8,.2,1);
}
.idd-shell-bar__plus-cross span:nth-child(1) {
    left: 0;
    top: 50%;
    width: 100%;
    height: 2.4px;
    margin-top: -1.2px;
}
.idd-shell-bar__plus-cross span:nth-child(2) {
    left: 50%;
    top: 0;
    width: 2.4px;
    height: 100%;
    margin-left: -1.2px;
}
.idd-shell-bar__plus[aria-expanded="true"] .idd-shell-bar__plus-cross span:nth-child(1) {
    transform: rotate(45deg);
}
.idd-shell-bar__plus[aria-expanded="true"] .idd-shell-bar__plus-cross span:nth-child(2) {
    transform: rotate(45deg);
}
/* Mobile étroit : label retour caché */
@media (max-width: 600px) {
    .idd-shell-bar__back .idd-shell-bar__label { display: none; }
    .idd-shell-bar__back { padding: 0 4px; width: 44px; justify-content: center; }
    .idd-shell-bar__plus { width: 46px; height: 46px; }
}

/* ──────────────────────────────────────────────────────────
   MOBILE (< 1024px) : depuis qu'on a retire la shell-bar bas (cf. plus haut
   `.idd-shell-bar { display: none !important; }`), il n'y a plus de relais
   "+" pour les actions des plugins -> on remet leurs barres natives
   (telecharger, partager, etc.). Sinon plus aucun acces a ces actions.
   ────────────────────────────────────────────────────────── */
@media (max-width: 1023px) {
    /* On garde un padding-bottom genereux dans le workspace pour que les
       barres internes ne masquent pas le dernier contenu de la liste. */
    body:has(.wpz-invites-bottom-bar) .app-workspace,
    body:has(.wpz-pt-bottom-bar) .app-workspace {
        padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px)) !important;
    }
}

/* DESKTOP (≥ 1024px) : les bottom-bars internes restent visibles,
   on les pousse juste pour ne pas être sous la shell-bar */
@media (min-width: 1024px) {
    body:has(.wpz-invites-bottom-bar) .wpz-invites-bottom-bar,
    body:has(.wpz-pt-bottom-bar) .wpz-pt-bottom-bar {
        bottom: calc(70px + env(safe-area-inset-bottom, 0px)) !important;
    }
    body:has(.wpz-invites-fab) .wpz-invites-fab,
    body:has(.wpz-pt-fab) .wpz-pt-fab {
        bottom: calc(150px + env(safe-area-inset-bottom, 0px)) !important;
    }

    /* Notes client (liste-invites #20 « la toolbar passe sous le sidebar » +
       panneau #17 « réparer partout »): sur desktop, les barres fixes du bas
       doivent DÉMARRER au bord droit de la sidebar — sinon elles s'étendent
       SOUS la sidebar fixe (260px, ou 74px en mode mini). */
    .idd-tool-toolbar,
    .idd-shell-bar,
    body:has(.wpz-invites-bottom-bar) .wpz-invites-bottom-bar,
    body:has(.wpz-pt-bottom-bar) .wpz-pt-bottom-bar {
        left: var(--app-sidebar-w, 260px) !important;
        transition: left var(--duration-lg, .3s) var(--ease, ease);
    }
    body.is-sidebar-mini .idd-tool-toolbar,
    body.is-sidebar-mini .idd-shell-bar,
    body.is-sidebar-mini:has(.wpz-invites-bottom-bar) .wpz-invites-bottom-bar,
    body.is-sidebar-mini:has(.wpz-pt-bottom-bar) .wpz-pt-bottom-bar {
        left: var(--app-sidebar-w-mini, 74px) !important;
    }
}

/* ══════════════════════════════════════════════════════════
   PANEL D'ACTIONS — side-drawer pleine hauteur depuis la droite
   - Largeur ≤ 420px desktop, plein écran ≤ 640px
   - Fond opaque (pas de blur translucide), ombre douce à gauche
   - Slide horizontal (translateX)
   ══════════════════════════════════════════════════════════ */

.idd-shell-actions-backdrop {
    position: fixed;
    inset: 0;
    top: var(--app-adminbar-h, 0);
    background: rgba(29,24,25,0.45);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    /* Passe au-dessus du header de l'app (z=100) et de la shell-bar (z=200) */
    z-index: var(--app-z-backdrop, 9000);
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, visibility .25s ease;
}
body.is-shell-actions-open .idd-shell-actions-backdrop {
    opacity: 1;
    visibility: visible;
}

.idd-shell-actions-panel {
    position: fixed;
    top: var(--app-adminbar-h, 0);
    right: 0;
    bottom: 0;
    width: min(420px, 100vw);
    max-width: 100vw;
    /* Au-dessus du backdrop et de tous les sticky de la page */
    z-index: var(--app-z-panel, 9500);
    background: var(--app-surface, #fff);
    border-left: 1px solid var(--app-line, #E2D9CC);
    box-shadow: -24px 0 60px -16px rgba(29,24,25,0.18);
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    visibility: hidden;
    transition: transform .35s cubic-bezier(.2,.8,.2,1), visibility .35s ease;
    padding-bottom: env(safe-area-inset-bottom, 0px);
}
body.is-shell-actions-open .idd-shell-actions-panel {
    transform: translateX(0);
    visibility: visible;
}
@media (max-width: 640px) {
    .idd-shell-actions-panel {
        width: 100vw;
        border-left: 0;
    }
}

.idd-shell-actions-panel__head {
    position: relative;
    padding: 18px 56px 18px 20px;
    border-bottom: 1px solid var(--app-line, #E2D9CC);
    flex-shrink: 0;
}
/* Drawer latéral : pas de poignée drag-down */
.idd-shell-actions-panel__handle { display: none; }
.idd-shell-actions-panel__head-content {
    text-align: left;
    padding: 0;
}
.idd-shell-actions-panel__eyebrow {
    display: block;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--app-brand, #9E4D64);
    margin-bottom: 4px;
}
.idd-shell-actions-panel__title {
    font-family: var(--font-serif, 'Cormorant Garamond', serif);
    font-size: 22px;
    font-weight: 700;
    color: var(--app-ink, #2D3748);
    margin: 0;
    line-height: 1.15;
    letter-spacing: -.01em;
}
.idd-shell-actions-panel__close {
    position: absolute;
    top: 14px;
    right: 14px;
    appearance: none;
    background: var(--app-surface-2, #F4EFE6);
    border: 0;
    width: 36px;
    height: 36px;
    border-radius: 999px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--app-ink, #2D3748);
    transition: background-color .15s ease;
}
.idd-shell-actions-panel__close:hover { background: var(--app-line, #E2D9CC); }
.idd-shell-actions-panel__close svg { width: 16px; height: 16px; }

.idd-shell-actions-panel__body {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    -webkit-overflow-scrolling: touch;
}

/* Sections internes au panel */
.idd-shell-actions__section {
    margin-bottom: 22px;
}
.idd-shell-actions__section:last-child { margin-bottom: 0; }
.idd-shell-actions__section-title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--app-muted, #718096);
    margin: 0 0 10px 4px;
}

/* Grille tiles 2 colonnes (design "app shortcuts") */
.idd-shell-actions__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}
.idd-shell-actions__tile {
    appearance: none;
    background: var(--app-surface, #fff);
    border: 1px solid var(--app-line, #E2D9CC);
    border-radius: 14px;
    padding: 16px 14px;
    cursor: pointer;
    text-align: left;
    color: var(--app-ink, #2D3748);
    text-decoration: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
    transition: transform .12s ease, box-shadow .15s ease, border-color .15s ease;
    min-height: 100px;
    position: relative;
    overflow: hidden;
}
.idd-shell-actions__tile:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px -6px rgba(0,0,0,0.10);
    border-color: var(--app-brand-border, rgba(181,99,122,0.40));
    text-decoration: none;
}
.idd-shell-actions__tile:active { transform: translateY(0); }
.idd-shell-actions__tile::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, transparent 0%, transparent 60%, var(--app-brand-soft, rgba(181,99,122,0.10)) 100%);
    pointer-events: none;
    opacity: 0;
    transition: opacity .15s ease;
}
.idd-shell-actions__tile:hover::after { opacity: 1; }

.idd-shell-actions__tile-icon {
    width: 38px;
    height: 38px;
    border-radius: 11px;
    background: var(--app-brand-soft, rgba(181,99,122,0.14));
    color: var(--app-brand-dark, #9A4F65);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.idd-shell-actions__tile-icon svg { width: 20px; height: 20px; stroke-width: 1.7; }

.idd-shell-actions__tile-label {
    font-family: var(--font-serif, 'Cormorant Garamond', serif);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--app-ink, #2D3748);
    letter-spacing: -.01em;
}
.idd-shell-actions__tile-hint {
    font-size: 12px;
    color: var(--app-muted, #718096);
    line-height: 1.35;
    margin: 0;
}

/* Tile gold (mise en avant — ex: Tous les outils) */
.idd-shell-actions__tile--gold {
    background: linear-gradient(135deg, var(--app-brand, #9E4D64), var(--app-brand-dark, #9A4F65));
    color: #fff;
    border-color: var(--app-brand-dark, #9A4F65);
    grid-column: span 2;
    flex-direction: row;
    align-items: center;
}
.idd-shell-actions__tile--gold .idd-shell-actions__tile-icon {
    background: rgba(255,255,255,0.20);
    color: #fff;
}
.idd-shell-actions__tile--gold .idd-shell-actions__tile-label { color: #fff; }
.idd-shell-actions__tile--gold .idd-shell-actions__tile-hint { color: rgba(255,255,255,0.85); }
.idd-shell-actions__tile--gold:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px -6px rgba(154,79,101,0.40);
}

/* Footer du panel — bouton "Tous mes outils" */
.idd-shell-actions-panel__footer {
    padding: 14px 20px calc(14px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--app-line, #E2D9CC);
    background: var(--app-surface, #fff);
    flex-shrink: 0;
}
.idd-shell-actions-panel__all-tools {
    appearance: none;
    width: 100%;
    background: linear-gradient(135deg, var(--app-brand, #9E4D64), var(--app-brand-dark, #9A4F65));
    color: #fff;
    border: 0;
    height: 52px;
    padding: 0 18px;
    border-radius: 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 12px;
    font: inherit;
    font-size: 15px;
    font-weight: 600;
    transition: transform .12s ease, box-shadow .15s ease;
    box-shadow: 0 6px 16px -6px rgba(181,99,122,0.50);
}
.idd-shell-actions-panel__all-tools:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px -6px rgba(181,99,122,0.65);
}
.idd-shell-actions-panel__all-tools:active { transform: translateY(0); }
.idd-shell-actions-panel__all-tools svg { width: 22px; height: 22px; stroke-width: 2; flex-shrink: 0; }
.idd-shell-actions-panel__all-tools span { flex: 1; text-align: left; }
.idd-shell-actions-panel__all-tools-arrow { margin-left: auto; }

/* Desktop : layout 3 colonnes possibles, marges plus généreuses */
@media (min-width: 768px) {
    .idd-shell-actions-panel {
        max-width: 600px;
        left: 50%;
        transform: translate(-50%, 100%);
        border-radius: 24px;
        bottom: 20px;
    }
    body.is-shell-actions-open .idd-shell-actions-panel {
        transform: translate(-50%, 0);
    }
    .idd-shell-actions__grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Print */
@media print {
    .idd-shell-bar,
    .idd-shell-actions-backdrop,
    .idd-shell-actions-panel { display: none !important; }
}

/* ──────────────────────────────────────────────────────────
   Print
   ────────────────────────────────────────────────────────── */
@media print {
    .idd-tool-toolbar,
    .idd-tool-panel,
    .idd-tool-panel-backdrop { display: none !important; }
}

/* ──────────────────────────────────────────────────────────
   Toutes tailles : seule la partie gauche défile, le centre se
   rétrécit, la partie droite (menu « Outils », export) reste
   toujours visible. Avant, toute la barre défilait et le menu
   ou le bouton 3D pouvaient sortir de l'écran.
   ────────────────────────────────────────────────────────── */
body .idd-tool-toolbar { overflow: hidden; }
body .idd-tool-toolbar__left {
    flex: 0 1 auto; min-width: 0;
    overflow-x: auto; overflow-y: hidden; scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}
body .idd-tool-toolbar__left::-webkit-scrollbar { display: none; }
body .idd-tool-toolbar__center { flex: 1 1 0; min-width: 0; overflow: hidden; }
body .idd-tool-toolbar__right { flex: none; }
@media (max-width: 640px) {
    body .idd-tool-toolbar__left { flex: 1 1 auto; }
    body .idd-tool-toolbar__right { margin-left: 0; }
    /* Centre (titre + état d'enregistrement) : on libère la place sur téléphone. */
    body .idd-tool-toolbar__center:not(:has(> :not(.idd-tool-toolbar__title):not(.idd-tool-toolbar__status))) { display: none; }
}

/* Ordinateur : la barre commence après le menu latéral (left fixé) ; une largeur de 100 % la faisait
   déborder à droite de 260 px, et les boutons de droite (Imprimer, PDF, menu) sortaient de l’écran. */
@media (min-width: 1024px) {
    body .idd-tool-toolbar { width: auto !important; }
}


/* Partie gauche défilante : fondu sur les bords + flèche « autres boutons » (octobre 2026) */
body .idd-tool-toolbar__left.is-more-right { -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 46px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 46px), transparent); }
body .idd-tool-toolbar__left.is-more-left.is-more-right { -webkit-mask-image: linear-gradient(to right, transparent 0, #000 22px, #000 calc(100% - 46px), transparent); mask-image: linear-gradient(to right, transparent 0, #000 22px, #000 calc(100% - 46px), transparent); }
body .idd-tool-toolbar__left.is-more-left:not(.is-more-right) { -webkit-mask-image: linear-gradient(to right, transparent 0, #000 22px); mask-image: linear-gradient(to right, transparent 0, #000 22px); }
.idd-tb-more { position: absolute; z-index: 3; width: 30px; height: 30px; border-radius: 999px; border: 1px solid rgba(29,24,25,.12); background: #fff; color: #9E4D64; box-shadow: 0 4px 12px rgba(29,24,25,.18); display: inline-flex; align-items: center; justify-content: center; padding: 0; margin: 0; cursor: pointer; }
.idd-tb-more[hidden] { display: none !important; }
.idd-tb-more:focus-visible { outline: 2px solid #9E4D64; outline-offset: 2px; }