/* ==========================================================
   IDD Plan d'Aménagement — App CSS
   --------------------------------------------------------
   Hérite des tokens du thème (--app-*).
   Réutilise le pattern toolbar partagée (.idd-tool-toolbar /
   .idd-tool-panel) du thème.
   ========================================================== */

.idd-ps-root [hidden] { display: none !important; }

/* Full width — bypass de la cap 1200px du thème */
.app-workspace__inner > #idd-ps-root {
    max-width: none !important;
    margin-inline: 0 !important;
}
body.idd-ps-active .app-workspace,
body.idd-ps-active .app-workspace__inner {
    padding-left: 0;
    padding-right: 0;
    max-width: none;
}
body.idd-ps-active .app-workspace {
    padding-top: 0;
    /* Réserve l'espace en bas pour les 2 toolbars empilées :
       shell-bar (60px) + idd-tool-toolbar (56px mobile / 60px desktop) + gap. */
    padding-bottom: calc(124px + env(safe-area-inset-bottom, 0px));
}
@media (min-width: 768px) {
    body.idd-ps-active .app-workspace {
        padding-bottom: calc(128px + env(safe-area-inset-bottom, 0px));
    }
}

/* ----------------------------------------------------------
   Root
   ---------------------------------------------------------- */
.idd-ps-root {
    /* Cascade --app-* → --wp-* (fallbacks alignés palette WeddingPart) */
    --app-bg:           var(--wp-bg,           #FDFAF8);
    --app-surface:      var(--wp-surface,      #FFFFFF);
    --app-surface-2:    var(--wp-surface-2,    #FAF5F3);
    --app-surface-3:    var(--wp-surface-3,    #F5EEEc);
    --app-line:         var(--wp-line,         #EDE0E4);
    --app-line-strong:  var(--wp-line-strong,  #DECFD5);
    --app-ink:          var(--wp-ink,          #1D1819);
    --app-soft:         var(--wp-soft,         #6E5A60);
    --app-muted:        var(--wp-muted,        #A08D93);
    --app-brand:        var(--wp-brand,        #B5637A);
    --app-brand-dark:   var(--wp-brand-dark,   #9A4F65);
    --app-brand-light:  var(--wp-brand-light,  #EDD6DC);
    --app-brand-soft:   var(--wp-brand-soft,   rgba(181,99,122,.09));
    --app-brand-border: var(--wp-brand-border, rgba(181,99,122,.22));

    --am-canvas-bg: var(--app-surface-2, #FAF5F3);
    --am-tools-w:   300px;
    position: relative;
    display: block;
    background: var(--app-bg, #FDFAF8);
    color: var(--app-ink, #1D1819);
}

/* ----------------------------------------------------------
   Loader
   ---------------------------------------------------------- */
.idd-ps-loader {
    min-height: 360px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 60px 20px;
}
.idd-ps-loader__spinner {
    width: 42px; height: 42px;
    border-radius: 50%;
    border: 3px solid var(--app-line, #E2D9CC);
    border-top-color: var(--app-brand, #D4A96A);
    animation: idd-ps-spin .9s linear infinite;
}
.idd-ps-loader p { color: var(--app-muted, #718096); margin: 0; font-size: 14px; }
@keyframes idd-ps-spin { to { transform: rotate(360deg); } }
.idd-ps-root.is-ready .idd-ps-loader { display: none; }

/* ----------------------------------------------------------
   Workspace
   ---------------------------------------------------------- */
.idd-ps-workspace {
    position: relative;
    min-height: calc(100vh - var(--app-header-h, 60px) - 64px);
}

/* ----------------------------------------------------------
   Vue : Liste des plans
   ---------------------------------------------------------- */
.idd-ps-list {
    padding: 32px 20px 60px;
    max-width: 1200px;
    margin: 0 auto;
}
.idd-ps-list__head {
    text-align: center;
    margin-bottom: 28px;
}
.idd-ps-list__head .eyebrow {
    display: inline-flex;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--app-brand, #D4A96A);
    margin-bottom: 8px;
}
.idd-ps-list__title {
    font-family: var(--font-serif, 'Cormorant Garamond', serif);
    font-size: clamp(26px, 4.5vw, 38px);
    font-weight: 700;
    color: var(--app-ink, #2D3748);
    margin: 0 0 6px;
    letter-spacing: -.01em;
    line-height: 1.15;
}
.idd-ps-list__lead {
    color: var(--app-muted, #718096);
    font-size: 15px;
    margin: 0 auto 18px;
    max-width: 560px;
}
.idd-ps-list__new {
    appearance: none;
    background: var(--app-brand, #D4A96A);
    color: #fff;
    border: 0;
    padding: 12px 22px;
    border-radius: var(--radius-full, 999px);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    box-shadow: 0 4px 14px -4px rgba(212,169,106,0.4);
    transition: background-color .15s, transform .12s;
}
.idd-ps-list__new:hover { background: var(--app-brand-dark, #B5894C); transform: translateY(-1px); }
.idd-ps-list__new svg { width: 18px; height: 18px; }
.idd-ps-list__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 16px;
}
.idd-ps-list__card {
    background: var(--app-surface, #fff);
    border: 1px solid var(--app-line, #E2D9CC);
    border-radius: var(--radius-sm, 14px);
    overflow: hidden;
    cursor: pointer;
    text-align: left;
    transition: transform .15s, box-shadow .15s, border-color .15s;
    display: flex;
    flex-direction: column;
    position: relative;
    padding: 0;
}
.idd-ps-list__card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 28px -10px rgba(0,0,0,0.15);
    border-color: var(--app-brand-border, rgba(212,169,106,0.35));
}
.idd-ps-list__card-preview {
    aspect-ratio: 16 / 10;
    background: var(--am-canvas-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--app-muted, #718096);
}
.idd-ps-list__card-preview svg { width: 40px; height: 40px; }
.idd-ps-list__card-preview img { width: 100%; height: 100%; object-fit: cover; }
.idd-ps-list__card-body {
    padding: 12px 14px 14px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.idd-ps-list__card-name {
    font-family: var(--font-serif, 'Cormorant Garamond', serif);
    font-size: 18px;
    font-weight: 700;
    color: var(--app-ink, #2D3748);
    margin: 0;
}
.idd-ps-list__card-meta {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--app-muted, #718096);
    font-weight: 600;
}
.idd-ps-list__card-actions {
    position: absolute;
    top: 8px;
    right: 8px;
    display: flex;
    gap: 4px;
    opacity: 0;
    transition: opacity .12s;
}
.idd-ps-list__card:hover .idd-ps-list__card-actions { opacity: 1; }
.idd-ps-list__card-action {
    appearance: none;
    background: rgba(255,255,255,0.95);
    border: 1px solid var(--app-line, #E2D9CC);
    width: 30px; height: 30px;
    border-radius: var(--radius-xs, 8px);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.idd-ps-list__card-action svg { width: 14px; height: 14px; stroke-width: 2; }
.idd-ps-list__card-action--delete:hover { background: rgba(192,57,43,0.08); color: #C0392B; }
.idd-ps-list__empty {
    text-align: center;
    padding: 60px 20px;
    color: var(--app-muted, #718096);
}
.idd-ps-list__empty svg { width: 60px; height: 60px; margin-bottom: 12px; color: var(--app-brand-light, #E8C977); }

/* ----------------------------------------------------------
   Vue : Éditeur
   ---------------------------------------------------------- */
.idd-ps-editor {
    background: var(--am-canvas-bg);
    min-height: calc(100vh - var(--app-header-h, 60px) - var(--idd-tb-height-mobile, 56px));
    display: flex;
    flex-direction: column;
}
.idd-ps-canvas-area {
    position: relative;
    overflow: auto;
    padding: 16px;
    background:
        linear-gradient(45deg, #E8E2D7 25%, transparent 25%) 0 0 / 20px 20px,
        linear-gradient(-45deg, #E8E2D7 25%, transparent 25%) 0 10px / 20px 20px,
        linear-gradient(45deg, transparent 75%, #E8E2D7 75%) 10px -10px / 20px 20px,
        linear-gradient(-45deg, transparent 75%, #E8E2D7 75%) -10px 0 / 20px 20px,
        var(--am-canvas-bg);
    /* Hauteur dispo = viewport − admin-bar − app-header − toolbar v2 − shell-bar
       (toutes en position:fixed/sticky). Ainsi le canvas-area ne déborde plus
       sous les barres du bas. */
    min-height: calc(
        100vh
        - var(--app-adminbar-h, 0px)
        - var(--app-header-h, 60px)
        - var(--idd-tb-height-desktop, 60px)
        - 60px /* shell-bar */
        - env(safe-area-inset-bottom, 0px)
    );
    display: flex;
    align-items: flex-start;
    justify-content: center;
}
.idd-ps-canvas-frame {
    background: #fff;
    box-shadow: 0 4px 28px -8px rgba(0,0,0,0.15);
    margin: 8px auto 60px;
    display: inline-block;
    line-height: 0;
    border-radius: 4px;
    overflow: hidden;
    flex-shrink: 0;
    position: relative;     /* Pour ancrer l'overlay dims absolu */
}

/* Overlay HTML qui dessine les badges de dimensions par-dessus le canvas.
   Pointer-events: none pour ne pas bloquer les clics Fabric. Les badges
   ont une taille FIXE en pixels — ils ne grandissent pas quand on scale
   un objet (vrai souci UX résolu en sortant le label du Group Fabric). */
.idd-ps-dims-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    z-index: 4;
}
.idd-ps-dim-badge {
    position: absolute;
    transform: translate(-50%, 0);
    background: rgba(255,255,255,0.95);
    color: #2D3748;
    padding: 2px 8px;
    border-radius: var(--radius-full, 999px);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
    box-shadow: 0 1px 3px rgba(0,0,0,0.18);
    border: 1px solid rgba(212, 169, 106, 0.4);
    cursor: pointer;
    pointer-events: auto;
    font-family: 'DM Sans', system-ui, sans-serif;
    transition: background 0.15s, border-color 0.15s, transform 0.1s;
}
.idd-ps-dim-badge:hover {
    background: #FFF6E2;
    border-color: var(--app-brand, #D4A96A);
    transform: translate(-50%, 0) scale(1.05);
}
.idd-ps-dim-badge:active { transform: translate(-50%, 0) scale(0.95); }

/* Hint quand canvas vide — au-dessus du canvas mais
   pointer-events: none pour ne pas bloquer les clics. Seul
   le bouton interne reste cliquable. */
.idd-ps-empty-hint {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    padding: 24px 28px;
    max-width: 360px;
    background: rgba(255,255,255,0.85);
    border-radius: var(--radius-sm, 14px);
    border: 1px dashed var(--app-line, #E2D9CC);
    z-index: 5;
    pointer-events: none;       /* laisse passer les clics vers le canvas */
}
.idd-ps-empty-hint__btn {
    pointer-events: auto;       /* mais le CTA reste cliquable */
}
.idd-ps-empty-hint svg {
    width: 48px; height: 48px;
    color: var(--app-brand, #D4A96A);
    margin-bottom: 12px;
}
.idd-ps-empty-hint h3 {
    font-family: var(--font-serif, 'Cormorant Garamond', serif);
    font-size: 20px;
    margin: 0 0 6px;
    color: var(--app-ink, #2D3748);
}
.idd-ps-empty-hint p {
    color: var(--app-muted, #718096);
    margin: 0 0 16px;
    font-size: 14px;
    line-height: 1.5;
}
.idd-ps-empty-hint__btn {
    appearance: none;
    background: var(--app-brand, #D4A96A);
    color: #fff;
    border: 0;
    padding: 10px 20px;
    border-radius: var(--radius-full, 999px);
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    transition: background-color .15s;
}
.idd-ps-empty-hint__btn:hover { background: var(--app-brand-dark, #B5894C); }
.idd-ps-root.has-bg .idd-ps-empty-hint,
.idd-ps-root.has-objects .idd-ps-empty-hint { display: none; }

/* Indicateur outil actif (mesure, calibrage) */
.idd-ps-tool-indicator {
    position: fixed;
    top: calc(var(--app-header-h, 60px) + 16px + env(safe-area-inset-top, 0px));
    left: 50%;
    transform: translateX(-50%);
    background: var(--app-ink, #2D3748);
    color: #fff;
    padding: 10px 14px 10px 18px;
    border-radius: var(--radius-full, 999px);
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 8px 24px -8px rgba(0,0,0,0.30);
    z-index: 50;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.idd-ps-tool-indicator button {
    appearance: none;
    background: rgba(255,255,255,0.2);
    border: 0;
    color: #fff;
    width: 22px; height: 22px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 16px;
    line-height: 1;
}

/* ----------------------------------------------------------
   Bibliothèque d'éléments dans la sidebar (grille de chips)
   ---------------------------------------------------------- */
.idd-ps-elements {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}
.idd-ps-element {
    appearance: none;
    background: var(--app-surface, #fff);
    border: 1px solid var(--app-line, #E2D9CC);
    border-radius: var(--radius-sm, 10px);
    padding: 8px 6px;
    cursor: pointer;
    transition: transform .12s, border-color .12s, background-color .15s;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-height: 70px;
}
.idd-ps-element:hover {
    background: var(--app-surface-2, #F4EFE6);
    border-color: var(--app-brand-border, rgba(212,169,106,0.35));
    transform: translateY(-1px);
}
.idd-ps-element__icon {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--app-brand-dark, #B5894C);
}
.idd-ps-element__icon svg { width: 100%; height: 100%; }
.idd-ps-element__label {
    font-size: 10px;
    font-weight: 600;
    text-align: center;
    color: var(--app-ink, #2D3748);
    line-height: 1.2;
}
.idd-ps-element__dim {
    font-size: 9px;
    color: var(--app-muted, #718096);
    text-align: center;
}

/* ----------------------------------------------------------
   Modal calibrage
   ---------------------------------------------------------- */
.idd-ps-modal {
    position: fixed;
    inset: 0;
    z-index: 200;
}
.idd-ps-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(29,24,25,0.55);
    backdrop-filter: blur(2px);
}
.idd-ps-modal__inner {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    background: var(--app-surface, #fff);
    border-radius: var(--radius-sm, 14px);
    padding: 24px;
    width: min(90vw, 420px);
    box-shadow: 0 20px 60px -20px rgba(0,0,0,0.40);
}
.idd-ps-modal__inner h3 {
    font-family: var(--font-serif, 'Cormorant Garamond', serif);
    margin: 0 0 8px;
    font-size: 22px;
}
.idd-ps-modal__inner p {
    color: var(--app-muted, #718096);
    margin: 0 0 16px;
    font-size: 14px;
}
.idd-ps-modal__row {
    display: flex;
    gap: 8px;
    margin-bottom: 18px;
}
.idd-ps-modal__row input,
.idd-ps-modal__row select {
    flex: 1;
    padding: 10px 12px;
    border: 1px solid var(--app-line, #E2D9CC);
    border-radius: var(--radius-xs, 8px);
    font: inherit;
    font-size: 15px;
}
.idd-ps-modal__actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}
.idd-ps-modal__actions button {
    appearance: none;
    padding: 10px 18px;
    border-radius: var(--radius-xs, 8px);
    border: 0;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}
.idd-ps-modal__actions .btn--ghost {
    background: transparent;
    color: var(--app-muted, #718096);
    border: 1px solid var(--app-line, #E2D9CC);
}
.idd-ps-modal__actions .btn--primary {
    background: var(--app-brand, #D4A96A);
    color: #fff;
}
.idd-ps-modal__actions .btn--primary:hover { background: var(--app-brand-dark, #B5894C); }

/* Toasts (réutilise pattern panneau-bienvenue) */
/* Bouton actions panneau en mode "actif" (toggle on) */
.idd-tool-panel__item.is-active {
    background: var(--app-brand-soft, rgba(212,169,106,0.16));
    border-color: var(--app-brand, #D4A96A);
}
.idd-tool-panel__item.is-active svg { color: var(--app-brand-dark, #B5894C); }

.idd-ps-toast {
    position: fixed;
    top: calc(var(--app-header-h, 60px) + 12px + env(safe-area-inset-top, 0px));
    left: 50%;
    transform: translateX(-50%) translateY(-12px);
    z-index: 110;
    background: var(--app-ink, #2D3748);
    color: #fff;
    padding: 10px 16px;
    border-radius: var(--radius-full, 999px);
    font-size: 13px;
    font-weight: 600;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s, transform .25s;
}
.idd-ps-toast.is-visible {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}
.idd-ps-toast--error { background: #C0392B; }
.idd-ps-toast--success { background: #4A8F5F; }

/* ----------------------------------------------------------
   Toolbar fixe en bas d'écran (toutes tailles d'écran)
   Pleine largeur (collée gauche + droite), passe sous la sidebar
   gauche qui s'arrête plus haut (height calc avec -120px). Scroll
   horizontal visible quand les boutons débordent.
   ---------------------------------------------------------- */
.idd-ps-root .idd-tool-toolbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: env(safe-area-inset-bottom, 0px);
    z-index: 40;
    margin: 0;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
    box-shadow: 0 -6px 24px -10px rgba(29, 24, 25, 0.12);
    /* Scroll horizontal renforcé : barre plus visible que celle du tool-kit (6px gris pâle) */
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
    scrollbar-color: var(--app-brand, #B5637A) var(--app-surface-2, #FAF5F3);
}
.idd-ps-root .idd-tool-toolbar::-webkit-scrollbar { height: 8px; }
.idd-ps-root .idd-tool-toolbar::-webkit-scrollbar-track {
    background: var(--app-surface-2, #FAF5F3);
}
.idd-ps-root .idd-tool-toolbar::-webkit-scrollbar-thumb {
    background: var(--app-brand, #B5637A);
    border-radius: 999px;
    border: 2px solid var(--app-surface-2, #FAF5F3);
}
.idd-ps-root .idd-tool-toolbar::-webkit-scrollbar-thumb:hover {
    background: var(--app-brand-dark, #9A4F65);
}

/* ----------------------------------------------------------
   Desktop ≥ 1024px : dock-left sidebar
   ---------------------------------------------------------- */
@media (min-width: 1024px) {
    /* La toolbar v2 est position:fixed (flottante bas) — pas dans le grid.
       On la recentre sur le canvas via --idd-tb-offset-x. */
    .idd-ps-root {
        display: grid;
        grid-template-columns: var(--am-tools-w) 1fr;
        grid-template-rows: 1fr;
        grid-template-areas: "tools workspace";
        min-height: calc(100vh - var(--app-header-h, 60px));
        --idd-tb-offset-x: calc(var(--am-tools-w) / 2);
    }
    .idd-ps-root.is-tools-collapsed,
    .idd-ps-root.is-list {
        --idd-tb-offset-x: 0px;
    }
    .idd-ps-root .idd-ps-workspace {
        grid-area: workspace;
        min-width: 0;
        overflow: hidden;
        padding-bottom: calc(125px + env(safe-area-inset-bottom, 0px));
    }
    /* La toolbar reste pleine largeur (left: 0) sur desktop aussi.
       La sidebar gauche descend jusqu'à juste au-dessus de la toolbar (≈ 64px de haut).
       Avant : -120px laissait un trou de ~60px entre la sidebar et la toolbar. */
    .idd-ps-root .idd-tool-panel {
        grid-area: tools;
        position: sticky !important;
        top: calc(var(--app-header-h, 60px) + var(--app-adminbar-h, 0px));
        right: auto !important;
        bottom: auto !important;
        left: auto !important;
        width: auto !important;
        height: calc(100vh - var(--app-header-h, 60px) - var(--app-adminbar-h, 0px) - 64px - env(safe-area-inset-bottom, 0px)) !important;
        min-height: 0 !important;
        max-height: calc(100vh - var(--app-header-h, 60px) - var(--app-adminbar-h, 0px) - 64px - env(safe-area-inset-bottom, 0px));
        overflow: hidden;
        transform: none !important;
        visibility: visible !important;
        z-index: 1;
        background: var(--app-surface, #fff) !important;
        border-top-left-radius: 0 !important;
        border-top-right-radius: 0 !important;
        box-shadow: none !important;
        border-left: 0;
        border-right: 1px solid var(--app-line, #E2D9CC);
        display: flex;
        flex-direction: column;
        transition: margin-left .25s;
        padding-bottom: 0 !important;
    }
    .idd-ps-root .idd-tool-panel::before { display: none; }
    .idd-ps-root .idd-tool-panel__header { flex-shrink: 0; }
    .idd-ps-root .idd-tool-panel__body {
        flex: 1 1 0;
        min-height: 0;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }
    .idd-ps-root .idd-tool-panel__footer { flex-shrink: 0; }

    .idd-ps-root.is-tools-collapsed { grid-template-columns: 0 1fr; }
    .idd-ps-root.is-tools-collapsed .idd-tool-panel {
        margin-left: calc(-1 * var(--am-tools-w));
        opacity: 0;
        pointer-events: none;
    }
    .idd-ps-root.is-list .idd-tool-panel { display: none; }
    .idd-ps-root.is-list {
        grid-template-columns: 1fr;
        grid-template-areas: "toolbar" "workspace";
    }
    /* En vue liste, on cache le bouton 3D : il n'a aucun sens sans plan ouvert
       (openVisite3D() refuserait de toute façon avec un toast d'erreur). */
    .idd-ps-root.is-list .idd-tool-toolbar__btn--3d { display: none !important; }

    .idd-ps-root .idd-tool-toolbar__burger,
    .idd-ps-root .idd-tool-panel__close,
    .idd-ps-root .idd-tool-panel-backdrop {
        display: none !important;
    }
    .idd-ps-tools-collapse {
        display: inline-flex;
        appearance: none;
        background: transparent;
        border: 0;
        color: var(--app-muted, #718096);
        cursor: pointer;
        width: 32px;
        height: 32px;
        align-items: center;
        justify-content: center;
        border-radius: var(--radius-xs, 8px);
    }
    .idd-ps-tools-collapse:hover {
        background: var(--app-surface-2, #F4EFE6);
        color: var(--app-ink, #2D3748);
    }
    .idd-ps-tools-collapse svg { width: 16px; height: 16px; }
    .idd-ps-tools-expand {
        display: none;
        position: fixed;
        left: calc(var(--app-sidebar-w, 260px) + 0px);
        top: 50%;
        transform: translateY(-50%);
        background: var(--app-brand, #D4A96A);
        color: #fff;
        border: 0;
        width: 28px;
        height: 56px;
        border-radius: 0 8px 8px 0;
        cursor: pointer;
        z-index: 20;
        align-items: center;
        justify-content: center;
    }
    .idd-ps-root.is-tools-collapsed .idd-ps-tools-expand { display: inline-flex; }
    .idd-ps-tools-expand svg { width: 14px; height: 14px; }
}
@media (max-width: 1023px) {
    .idd-ps-tools-collapse,
    .idd-ps-tools-expand { display: none !important; }
}

@media print {
    .idd-tool-toolbar,
    .idd-tool-panel,
    .idd-ps-empty-hint,
    .idd-ps-toast,
    .idd-ps-loader { display: none !important; }
    .idd-ps-canvas-area { padding: 0; background: #fff !important; }
}

/* ==========================================================
   Dimensions de la salle — inputs largeur × longueur
   ========================================================== */
.idd-ps-room-dims {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    margin: 8px 0 10px;
}
.idd-ps-room-dims__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}
.idd-ps-room-dims__field > span {
    font-size: 11px;
    color: var(--app-muted, #718096);
    font-weight: 600;
    letter-spacing: 0.02em;
}
.idd-ps-room-dims__field input {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid var(--app-line, #E2E8F0);
    border-radius: var(--radius-xs, 8px);
    font-size: 14px;
    font-weight: 600;
    color: var(--app-ink, #2D3748);
    background: #fff;
    -moz-appearance: textfield;
}
.idd-ps-room-dims__field input::-webkit-outer-spin-button,
.idd-ps-room-dims__field input::-webkit-inner-spin-button {
    -webkit-appearance: none; margin: 0;
}
.idd-ps-room-dims__field input:focus {
    outline: 0;
    border-color: var(--app-brand, #D4A96A);
    box-shadow: 0 0 0 3px rgba(212, 169, 106, 0.18);
}
.idd-ps-room-dims__sep {
    font-size: 16px;
    color: var(--app-muted, #718096);
    padding-bottom: 8px;
    font-weight: 700;
}

/* ==========================================================
   Liste invités — cartes tables (draggables / cliquables)
   ========================================================== */
.idd-ps-guests-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 8px 0;
    max-height: 280px;
    overflow-y: auto;
    padding-right: 2px;
}
.idd-ps-guests-table {
    border: 1px solid var(--app-line, #E2E8F0);
    border-radius: var(--radius-xs, 8px);
    padding: 8px 10px;
    background: #FFF6E8;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s, transform 0.1s;
}
.idd-ps-guests-table:hover {
    background: #FCE9C8;
    border-color: var(--app-brand, #D4A96A);
}
.idd-ps-guests-table:active {
    transform: scale(0.98);
}
.idd-ps-guests-table__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}
.idd-ps-guests-table__name {
    font-weight: 700;
    color: #7C5832;
    font-size: 13px;
}
.idd-ps-guests-table__count {
    font-size: 11px;
    font-weight: 600;
    color: #9C7A4E;
    background: #fff;
    padding: 2px 7px;
    border-radius: var(--radius-full, 999px);
    border: 1px solid #E5C988;
}
.idd-ps-guests-table__list {
    margin-top: 4px;
    font-size: 11px;
    color: var(--app-muted, #718096);
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.idd-ps-guests-subhead {
    margin: 8px 0 4px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--app-muted, #718096);
}
.idd-ps-guests-chip {
    display: inline-block;
    font-size: 11px;
    padding: 3px 8px;
    border-radius: var(--radius-full, 999px);
    background: #F4EFE6;
    color: var(--app-ink, #2D3748);
    border: 1px solid var(--app-line, #E2E8F0);
    margin: 2px 3px 2px 0;
}
.idd-ps-guests-empty {
    margin: 0;
    font-size: 12px;
    color: var(--app-muted, #718096);
    text-align: center;
    padding: 12px 8px;
    background: var(--app-surface-2, #F4EFE6);
    border-radius: var(--radius-xs, 8px);
    line-height: 1.4;
}
.idd-ps-guests-empty a {
    color: var(--app-brand, #D4A96A);
    font-weight: 600;
    text-decoration: none;
}
.idd-ps-guests-empty a:hover { text-decoration: underline; }
/* ==========================================================
   Légende invités — bandeau full-width au-dessus du plan
   ========================================================== */
.idd-ps-legend {
    flex-shrink: 0;
    z-index: 6;
    background: linear-gradient(180deg, #FFFCF5 0%, #FFF8E8 100%);
    border-bottom: 1px solid rgba(212, 169, 106, 0.4);
    box-shadow: 0 2px 12px -6px rgba(124, 88, 50, 0.18);
    padding: 8px 18px;
    display: flex;
    align-items: center;
    gap: 14px;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    scrollbar-width: thin;
    scrollbar-color: rgba(212, 169, 106, 0.5) transparent;
}
.idd-ps-legend::-webkit-scrollbar { height: 4px; }
.idd-ps-legend::-webkit-scrollbar-thumb {
    background: rgba(212, 169, 106, 0.5);
    border-radius: 2px;
}
.idd-ps-legend[hidden] { display: none; }
.idd-ps-legend__title {
    font-size: 10px;
    font-weight: 800;
    color: #7C5832;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 4px 10px;
    background: #D4A96A;
    color: #fff;
    border-radius: var(--radius-full, 999px);
    align-self: center;
    flex-shrink: 0;
}
.idd-ps-legend__groups {
    display: flex;
    flex: 1;
    flex-wrap: nowrap;
    gap: 14px;
    align-items: center;
}
.idd-ps-legend__group {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px 0 0;
    border-right: 1px dashed rgba(212, 169, 106, 0.4);
}
.idd-ps-legend__group:last-child { border-right: 0; padding-right: 0; }
.idd-ps-legend__group-label {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #9C7A4E;
    margin-right: 2px;
}
.idd-ps-legend__item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    font-weight: 600;
    color: #5A4631;
    background: rgba(255,255,255,0.7);
    padding: 4px 8px 4px 6px;
    border-radius: var(--radius-full, 999px);
    border: 1px solid rgba(212, 169, 106, 0.25);
    cursor: default;
    transition: background 0.15s, border-color 0.15s;
}
.idd-ps-legend__item:hover {
    background: #fff;
    border-color: rgba(212, 169, 106, 0.55);
}
.idd-ps-legend__item svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}
.idd-ps-legend__dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    box-shadow: 0 0 0 2px #fff, 0 0 0 3px currentColor;
}
.idd-ps-legend__close {
    appearance: none;
    background: transparent;
    border: 0;
    color: #9C7A4E;
    cursor: pointer;
    width: 24px;
    height: 24px;
    padding: 0;
    border-radius: var(--radius-xs, 6px);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.15s;
}
.idd-ps-legend__close:hover {
    background: rgba(212, 169, 106, 0.18);
    color: #5A4631;
}
.idd-ps-legend__close svg { width: 14px; height: 14px; }

@media (max-width: 720px) {
    .idd-ps-legend {
        padding: 6px 10px;
        gap: 8px;
        font-size: 10px;
    }
    .idd-ps-legend__group {
        padding-right: 8px;
        gap: 6px;
    }
    .idd-ps-legend__title { font-size: 9px; padding: 3px 8px; }
    .idd-ps-legend__item { font-size: 10px; padding: 3px 7px 3px 5px; }
    .idd-ps-legend__item svg { width: 12px; height: 12px; }
}

@media print {
    .idd-ps-legend { display: none !important; }
}

/* ==========================================================
   Titre éditable inline (style Canva) dans la toolbar
   ========================================================== */
.idd-ps-title-editable {
    cursor: text;
    padding: 4px 10px;
    border-radius: var(--radius-xs, 6px);
    border: 1px solid transparent;
    transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
    min-width: 60px;
    max-width: 260px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: inline-block;
    outline: none;
}
.idd-ps-title-editable:hover {
    background: rgba(212, 169, 106, 0.10);
    border-color: rgba(212, 169, 106, 0.25);
}
.idd-ps-title-editable:focus,
.idd-ps-title-editable[contenteditable="true"] {
    background: #fff;
    border-color: var(--app-brand, #D4A96A);
    box-shadow: 0 0 0 3px rgba(212, 169, 106, 0.18);
    cursor: text;
    overflow: visible;
    white-space: normal;
    max-width: 360px;
}
.idd-ps-title-pencil {
    width: 14px;
    height: 14px;
    color: var(--app-muted, #9C7A4E);
    cursor: pointer;
    opacity: 0.65;
    transition: opacity 0.15s, color 0.15s;
    flex-shrink: 0;
    margin-left: 4px;
}
.idd-ps-title-pencil:hover {
    opacity: 1;
    color: var(--app-brand, #D4A96A);
}

.idd-ps-guests-done {
    margin: 0 0 8px;
    font-size: 12px;
    color: #4A8F5F;
    background: #E8F5EC;
    padding: 10px 12px;
    border-radius: var(--radius-xs, 8px);
    border: 1px solid #B9DDC5;
    font-weight: 600;
    text-align: center;
}

/* ==========================================================
   Sélecteur de thème de couleurs (Naturel / Site / Moodboard)
   ========================================================== */
.idd-ps-theme-picker {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
    margin: 8px 0 4px;
}
.idd-ps-theme-btn {
    appearance: none;
    background: #fff;
    border: 1px solid var(--app-line, #E2E8F0);
    border-radius: var(--radius-sm, 10px);
    padding: 8px 6px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    transition: border-color 0.15s, background 0.15s, transform 0.1s;
}
.idd-ps-theme-btn:hover {
    border-color: var(--app-brand, #D4A96A);
    background: #FFFCF5;
}
.idd-ps-theme-btn.is-active {
    border-color: var(--app-brand, #D4A96A);
    background: #FFF6E2;
    box-shadow: 0 0 0 2px rgba(212, 169, 106, 0.25);
}
.idd-ps-theme-btn__swatches {
    display: inline-flex;
    gap: 0;
    border-radius: var(--radius-full, 999px);
    overflow: hidden;
    border: 1px solid rgba(0,0,0,0.06);
}
.idd-ps-theme-btn__swatches > span {
    width: 14px;
    height: 22px;
    display: inline-block;
}
.idd-ps-theme-btn__label {
    font-size: 11px;
    font-weight: 600;
    color: var(--app-ink, #2D3748);
    text-align: center;
    line-height: 1.2;
}

/* ============================================================
   Catégorie Formes & mesures — boutons d'outils de dessin
   ============================================================ */
.idd-ps-element--shape {
    background: linear-gradient(180deg, #FFF9F0 0%, #FBEFD8 100%);
    border-color: #E5D4B5;
}
.idd-ps-element--shape:hover {
    background: linear-gradient(180deg, #FBEFD8 0%, #F5E0BC 100%);
    border-color: #D4A96A;
}
.idd-ps-element--shape .idd-ps-element__icon {
    color: #B8923F;
}

/* ============================================================
   Liste d'accueil — bouton "Plan vierge quadrillé" alternatif
   ============================================================ */
.idd-ps-list__new-group {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 8px;
}
.idd-ps-list__new--alt {
    background: #fff;
    color: var(--app-ink, #2D3748);
    border: 2px solid var(--app-primary, #D4A96A);
}
.idd-ps-list__new--alt:hover {
    background: #FFF9F0;
    border-color: var(--app-primary-dk, #B5894C);
}

/* ============================================================
   Panneau Calques — liste des objets utilisateurs
   ============================================================ */
.idd-ps-layers {
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-height: 320px;
    overflow-y: auto;
    padding: 4px;
    background: #FAFAF6;
    border-radius: var(--radius-xs, 8px);
    margin-bottom: 8px;
}
.idd-ps-layers__empty {
    margin: 0;
    padding: 16px 8px;
    text-align: center;
    color: #A0AEC0;
    font-size: 12px;
    font-style: italic;
}
.idd-ps-layer {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    background: #fff;
    border-radius: var(--radius-xs, 6px);
    border: 1px solid transparent;
    transition: border-color .15s, background .15s;
}
.idd-ps-layer:hover {
    border-color: #E5D4B5;
    background: #FFFCF5;
}
.idd-ps-layer.is-hidden {
    opacity: .5;
    background: #F4F4EE;
}
.idd-ps-layer__name {
    flex: 1;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--app-ink, #2D3748);
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.idd-ps-layer.is-hidden .idd-ps-layer__name {
    text-decoration: line-through;
}
.idd-ps-layer__eye,
.idd-ps-layer__delete {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    padding: 4px;
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--radius-xs, 6px);
    color: #718096;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .15s;
}
.idd-ps-layer__eye:hover {
    background: #E8DFCB;
    color: var(--app-primary-dk, #B5894C);
}
.idd-ps-layer__delete:hover {
    background: #FCE4EC;
    color: #B23A55;
}
.idd-ps-layer__eye svg,
.idd-ps-layer__delete svg {
    width: 16px;
    height: 16px;
}

/* ============================================================
   Popover Apparence — color picker fill / stroke / strokeWidth
   ============================================================ */
.idd-ps-appearance {
    position: fixed;
    z-index: 250;
    top: 0;
    right: 0;
    height: 100vh;
    width: 320px;
    max-width: 90vw;
    background: #fff;
    border-left: 1px solid #E5D4B5;
    box-shadow: -8px 0 28px -10px rgba(45, 55, 72, 0.18);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateX(0);
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}
.idd-ps-appearance[hidden] {
    display: flex !important;            /* on garde la sidebar dans le flow */
    transform: translateX(100%);
    pointer-events: none;
    visibility: hidden;
    transition: transform 0.24s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.24s;
}
.idd-ps-appearance__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    background: linear-gradient(180deg, #FFF9F0 0%, #FBEFD8 100%);
    border-bottom: 1px solid #E8DFCB;
    flex-shrink: 0;
}
.idd-ps-appearance__title {
    font-size: 15px;
    font-weight: 800;
    color: var(--app-ink, #2D3748);
    letter-spacing: -0.01em;
}
.idd-ps-appearance__body {
    overflow-y: auto;
    overscroll-behavior: contain;
    flex: 1;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.idd-ps-appearance__close {
    width: 26px;
    height: 26px;
    background: transparent;
    border: none;
    border-radius: var(--radius-xs, 6px);
    color: #718096;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.idd-ps-appearance__close:hover {
    background: #E8DFCB;
}
.idd-ps-appearance__close svg { width: 16px; height: 16px; }
.idd-ps-appearance__field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 12px;
    color: #4A5568;
    font-weight: 500;
}
.idd-ps-appearance__field em {
    font-style: normal;
    color: var(--app-primary-dk, #B5894C);
    font-weight: 600;
}
.idd-ps-appearance__field input[type="color"] {
    width: 100%;
    height: 36px;
    padding: 2px;
    border: 1px solid #E5D4B5;
    border-radius: var(--radius-xs, 6px);
    cursor: pointer;
    background: #fff;
}
.idd-ps-appearance__field input[type="range"] {
    width: 100%;
    accent-color: var(--app-primary, #D4A96A);
}
.idd-ps-appearance__field--toggle {
    flex-direction: row;
    align-items: center;
    gap: 8px;
}
.idd-ps-appearance__field--toggle input[type="checkbox"] {
    accent-color: var(--app-primary, #D4A96A);
    width: 16px;
    height: 16px;
}

/* ============================================================
   Item premium (Export PDF gratuit vs Premium)
   ============================================================ */
.idd-tool-panel__item--premium {
    position: relative;
    background: linear-gradient(180deg, #FFF9F0 0%, #FBEFD8 100%);
    border-color: #E5D4B5;
}
.idd-tool-panel__item--premium::after {
    content: '✦';
    position: absolute;
    top: 8px;
    right: 10px;
    color: var(--app-primary, #D4A96A);
    font-size: 14px;
}
.idd-tool-toolbar__primary--alt {
    background: linear-gradient(180deg, #FBEFD8 0%, #F5C265 100%);
    color: var(--app-ink, #2D3748);
}
.idd-tool-toolbar__primary--alt:hover {
    background: linear-gradient(180deg, #F5C265 0%, #E5AC4D 100%);
}

/* ============================================================
   Modal Premium (paywall PDF) — utilise les classes idd-ps-modal
   existantes + extension --premium pour visuel valorisé
   ============================================================ */
.idd-ps-premium-modal .idd-ps-modal__inner {
    max-width: 460px;
    padding: 32px 28px 24px;
    text-align: center;
}
.idd-ps-premium-modal__icon {
    font-size: 48px;
    margin-bottom: 12px;
}
.idd-ps-premium-modal h3 {
    margin: 0 0 12px;
    font-size: 22px;
    color: var(--app-ink, #2D3748);
    font-weight: 700;
}
.idd-ps-premium-modal p {
    margin: 0 0 18px;
    color: #4A5568;
    font-size: 14px;
    line-height: 1.55;
}
.idd-ps-premium-modal__perks {
    text-align: left;
    margin: 0 0 22px;
    padding: 16px 18px;
    background: #FFF9F0;
    border-radius: var(--radius-sm, 10px);
    list-style: none;
    border: 1px solid #E5D4B5;
}
.idd-ps-premium-modal__perks li {
    padding: 4px 0;
    font-size: 13.5px;
    color: var(--app-ink, #2D3748);
}

/* =====================================================================
   Hint vide multi-CTA (Importer / Quadrillé)
   ===================================================================== */
.idd-ps-empty-hint__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 8px;
}
.idd-ps-empty-hint__btn--alt {
    background: #FFFFFF !important;
    color: var(--app-brand, #D4A96A) !important;
    border: 2px solid var(--app-brand, #D4A96A);
}
.idd-ps-empty-hint__btn--alt:hover {
    background: var(--app-brand-soft, #FBF6EA) !important;
}

/* =====================================================================
   Badge Premium (★ or) sur les items du panel
   ===================================================================== */
.idd-tool-panel__item--premium { position: relative; }
.idd-tool-panel__item--premium::after {
    content: '★';
    position: absolute;
    top: 6px;
    right: 8px;
    color: var(--app-brand, #D4A96A);
    font-size: 13px;
    line-height: 1;
}

/* ==========================================================
   Popover Apparence — bloc Calque (z-order)
   ========================================================== */
.idd-ps-appearance__section {
    border-top: 1px solid var(--app-line, #E2E8F0);
    margin-top: 8px;
    padding-top: 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.idd-ps-appearance__section-title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--app-muted, #718096);
}
.idd-ps-zorder {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
}
.idd-ps-zorder__btn {
    appearance: none;
    background: #fff;
    border: 1px solid var(--app-line, #E2E8F0);
    border-radius: var(--radius-xs, 8px);
    padding: 7px 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 11px;
    font-weight: 600;
    color: var(--app-ink, #2D3748);
    transition: border-color 0.15s, background 0.15s, transform 0.1s;
    text-align: left;
}
.idd-ps-zorder__btn:hover {
    border-color: var(--app-brand, #D4A96A);
    background: #FFFCF5;
}
.idd-ps-zorder__btn:active { transform: scale(0.97); }
.idd-ps-zorder__btn svg { width: 18px; height: 18px; flex-shrink: 0; color: #7C5832; }

/* ============================================================
   Sidebar Apparence ouverte : décale le contenu pour ne pas masquer
   ============================================================ */
@media (min-width: 901px) {
    .idd-ps-root.idd-ps-appearance-open .idd-ps-editor {
        padding-right: 320px;
        transition: padding-right 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .idd-ps-editor {
        transition: padding-right 0.24s cubic-bezier(0.4, 0, 0.2, 1);
    }
}
@media (max-width: 900px) {
    .idd-ps-appearance {
        width: 100vw;
        max-width: 100vw;
    }
}

/* Hint visuel : double-clic = paramètres */
.idd-ps-appearance__hint {
    font-size: 11px;
    color: var(--app-muted, #718096);
    font-style: italic;
    margin: 0;
    padding: 8px 12px;
    background: #FBF6EA;
    border-radius: var(--radius-xs, 8px);
    border: 1px solid #E8D9B8;
}

/* Champ "Nom affiché sur le plan" dans la sidebar Apparence */
.idd-ps-appearance__field--name input[type="text"] {
    width: 100%;
    padding: 9px 11px;
    border: 1px solid #E5D4B5;
    border-radius: var(--radius-xs, 8px);
    font-size: 13px;
    font-weight: 600;
    color: var(--app-ink, #2D3748);
    background: #fff;
    font-family: 'DM Sans', system-ui, sans-serif;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.idd-ps-appearance__field--name input[type="text"]:focus {
    outline: 0;
    border-color: var(--app-brand, #D4A96A);
    box-shadow: 0 0 0 3px rgba(212, 169, 106, 0.18);
}

/* ==========================================================
   Thème "Perso" — color pickers utilisateur
   ========================================================== */
.idd-ps-theme-picker {
    grid-template-columns: repeat(2, 1fr);    /* 4 boutons (2x2) — déjà 2 colonnes */
}
.idd-ps-custom-colors {
    margin-top: 10px;
    padding: 10px;
    background: #FFFCF5;
    border: 1px solid rgba(212, 169, 106, 0.4);
    border-radius: var(--radius-sm, 10px);
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.idd-ps-custom-colors[hidden] { display: none; }
.idd-ps-custom-colors__field {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-size: 12px;
    font-weight: 600;
    color: var(--app-ink, #2D3748);
}
.idd-ps-custom-colors__field input[type="color"] {
    appearance: none;
    -webkit-appearance: none;
    width: 50px;
    height: 30px;
    border: 1px solid var(--app-line, #E2E8F0);
    border-radius: var(--radius-xs, 6px);
    padding: 2px;
    background: #fff;
    cursor: pointer;
}
.idd-ps-custom-colors__field input[type="color"]::-webkit-color-swatch {
    border: 0; border-radius: 4px;
}
.idd-ps-custom-colors__field input[type="color"]::-moz-color-swatch {
    border: 0; border-radius: 4px;
}
.idd-ps-custom-colors__hint {
    margin: 2px 0 0;
    font-size: 10px;
    color: var(--app-muted, #718096);
    font-style: italic;
    text-align: center;
}

/* ============================================================
   Règles graduées (top + left) — à l'échelle de scalePxPerM
   ============================================================ */
.idd-ps-frame--with-rulers {
    padding: 22px 0 0 22px;
    position: relative;
}
.idd-ps-ruler {
    position: absolute;
    background: #FBF6EA;
    overflow: hidden;
    color: #5A3A1F;
    user-select: none;
    pointer-events: none;
    z-index: 5;
}
.idd-ps-ruler--top {
    top: 0; left: 22px; right: 0; height: 22px;
    border-bottom: 1px solid #E5D4B5;
}
.idd-ps-ruler--left {
    top: 22px; left: 0; bottom: 0; width: 22px;
    border-right: 1px solid #E5D4B5;
}
.idd-ps-ruler-corner {
    position: absolute;
    top: 0; left: 0; width: 22px; height: 22px;
    background: #F2E6CD;
    border-right: 1px solid #E5D4B5;
    border-bottom: 1px solid #E5D4B5;
    z-index: 6;
}
.idd-ps-ruler__nocalib {
    font-size: 10px;
    padding: 6px 10px;
    color: #A0826A;
    font-style: italic;
    white-space: nowrap;
}
.idd-ps-canvas-inner {
    position: relative;
    display: inline-block;
    line-height: 0;
}

/* ==========================================================
   VISITE 3D — bouton toolbar + overlay fullscreen Three.js
   ========================================================== */
.idd-tool-toolbar__btn--3d{
    background:linear-gradient(135deg,#9E4D64 0%, #853F55 100%) !important;
    color:#fff !important;
    border-color:transparent !important;
}
.idd-tool-toolbar__btn--3d svg{ stroke:#fff !important; }
.idd-tool-toolbar__btn--3d:hover{ filter:brightness(1.08); }

html.idd-ps-3d-noscroll,
html.idd-ps-3d-noscroll body{ overflow:hidden !important; }
/* La place réservée à la barre de défilement (thème : scrollbar-gutter: stable) laissait une bande
   de 15 px non couverte à droite de la 3D sur ordinateur. */
html.idd-ps-3d-noscroll{ scrollbar-gutter:auto !important; }

.idd-ps-3d-overlay{
    position:fixed;
    inset:0;
    z-index:99999;
    background:#0a0a0f;
    display:none;
    opacity:0;
    transition:opacity .25s ease;
}
.idd-ps-3d-overlay.is-open{
    display:block;
    opacity:1;
}
.idd-ps-3d-canvas{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    display:block;
    touch-action:none;
    cursor:grab;
}
.idd-ps-3d-canvas:active{ cursor:grabbing; }

.idd-ps-3d-topbar{
    position:absolute;
    top:0; left:0; right:0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    padding:14px 18px;
    color:#fff;
    background:linear-gradient(to bottom, rgba(10,10,15,.75), rgba(10,10,15,0));
    pointer-events:none;
    z-index:2;
}
.idd-ps-3d-topbar > *{ pointer-events:auto; }

.idd-ps-3d-title{
    font-weight:600;
    font-size:15px;
}

.idd-ps-3d-modes{
    display:flex;
    gap:4px;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.12);
    border-radius:10px;
    padding:3px;
}
.idd-ps-3d-mode{
    background:transparent;
    color:rgba(255,255,255,.75);
    border:0;
    padding:7px 14px;
    border-radius:8px;
    font-size:13px;
    cursor:pointer;
    transition:background .15s, color .15s;
}
.idd-ps-3d-mode:hover{ color:#fff; background:rgba(255,255,255,.08); }
.idd-ps-3d-mode.is-active{
    background:linear-gradient(135deg,#9E4D64 0%, #853F55 100%);
    color:#fff;
}

.idd-ps-3d-close{
    width:38px;
    height:38px;
    border-radius:999px;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.12);
    color:#fff;
    cursor:pointer;
    font-size:16px;
}
.idd-ps-3d-close:hover{ background:rgba(255,255,255,.16); }

/* Écran d'attente de la 3D : voir « Attente de la 3D aux couleurs du logo » en fin de fichier. */

/* ==========================================================
   VISITE 3D — Panneau couleurs (sol + murs + nappes)
   ========================================================== */
.idd-ps-3d-colors{
    position:absolute;
    top:60px;
    right:20px;
    width:260px;
    z-index:3;
    background:rgba(20,20,28,.94);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    border:1px solid rgba(255,255,255,.12);
    border-radius:14px;
    padding:14px;
    box-shadow:0 20px 40px -10px rgba(0,0,0,.5);
    color:#fff;
}
.idd-ps-3d-colors-section{
    margin-bottom:14px;
}
.idd-ps-3d-colors-section:last-child{ margin-bottom:0; }
/* Modèles de lieu (lot 4) : 8 cartes, icône + nom, deux par ligne sur téléphone. */
.idd-ps-3d-venues{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; }
.idd-ps-3d-venues button{ display:flex; align-items:center; gap:8px; min-height:48px; padding:8px 10px; border-radius:12px; border:1.5px solid rgba(255,255,255,.16); background:rgba(255,255,255,.05); color:#fff; font:inherit; font-size:13px; text-align:left; cursor:pointer; }
.idd-ps-3d-venues button svg{ flex:none; opacity:.9; }
.idd-ps-3d-venues button span{ min-width:0; line-height:1.2; }
.idd-ps-3d-venues button.is-active{ border-color:#E8B7C4; background:rgba(158,77,100,.45); }
.idd-ps-3d-venues button:focus-visible{ outline:2px solid #E8B7C4; outline-offset:2px; }
/* « Mes lieux » (lot 4, décision D2) : lieux enregistrés sur le compte, communs à tous les plans. */
.idd-ps-3d-lieux{ display:grid; gap:8px; margin-bottom:10px; }
.idd-ps-3d-lieu{ display:flex; align-items:stretch; gap:6px; }
.idd-ps-3d-lieu__main{ flex:1; min-width:0; display:flex; align-items:center; gap:10px; min-height:52px; padding:8px 12px; border-radius:12px; border:1.5px solid rgba(255,255,255,.16); background:rgba(255,255,255,.05); color:#fff; font:inherit; text-align:left; cursor:pointer; }
.idd-ps-3d-lieu__main svg{ flex:none; opacity:.9; }
.idd-ps-3d-lieu__main span{ min-width:0; display:flex; flex-direction:column; gap:2px; }
.idd-ps-3d-lieu__main b{ font-size:14px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.idd-ps-3d-lieu__main small{ font-size:12px; color:rgba(255,255,255,.75); }
.idd-ps-3d-lieu.is-active .idd-ps-3d-lieu__main{ border-color:#E8B7C4; background:rgba(158,77,100,.45); }
.idd-ps-3d-lieu__del{ flex:none; width:44px; border-radius:12px; border:1.5px solid rgba(255,255,255,.16); background:rgba(255,255,255,.05); color:rgba(255,255,255,.85); display:flex; align-items:center; justify-content:center; cursor:pointer; }
.idd-ps-3d-lieu.is-confirm{ flex-direction:column; gap:8px; padding:10px 12px; border-radius:12px; border:1.5px solid #E8B7C4; font-size:13px; color:#fff; }
.idd-ps-3d-lieu-form{ display:grid; gap:8px; margin-bottom:8px; }
.idd-ps-3d-lieu-form label{ font-size:13px; color:rgba(255,255,255,.85); }
.idd-ps-3d-lieu-form input{ min-height:44px; padding:8px 12px; border-radius:10px; border:1.5px solid rgba(255,255,255,.3); background:rgba(0,0,0,.25); color:#fff; font:inherit; font-size:16px; }
.idd-ps-3d-lieu-maj{ padding:10px 12px; border-radius:12px; background:rgba(232,183,196,.14); border:1.5px solid rgba(232,183,196,.5); margin-bottom:10px; font-size:13px; color:#fff; }
.idd-ps-3d-lieu-maj p{ margin:0 0 8px; }
.idd-ps-3d-mylieux > .idd-ps-3d-seg{ margin-bottom:6px; }
/* Salle en L (lot 4) : coin découpé et dimensions de la découpe. */
.idd-ps-3d-forme{ display:grid; gap:8px; margin:10px 0 2px; }
.idd-ps-3d-forme__lbl{ font-size:12px; color:rgba(255,255,255,.75); }
.idd-ps-3d-corners button{ padding:6px 10px; }
.idd-ps-3d-step{ display:flex; align-items:center; gap:8px; color:#fff; font-size:13px; }
.idd-ps-3d-step span{ flex:1; min-width:0; }
.idd-ps-3d-step button{ width:40px; height:40px; border-radius:999px; border:1.5px solid rgba(255,255,255,.2); background:rgba(255,255,255,.06); color:#fff; font:inherit; font-size:18px; line-height:1; cursor:pointer; }
.idd-ps-3d-step button:focus-visible{ outline:2px solid #E8B7C4; outline-offset:2px; }
.idd-ps-3d-step output{ min-width:58px; text-align:center; font-weight:600; }
.idd-ps-3d-linkbtn{ background:none; border:0; padding:4px 2px; min-height:32px; color:#F3C6D3; font:inherit; font-weight:600; text-decoration:underline; cursor:pointer; }
.idd-ps-3d-lieu__main:focus-visible, .idd-ps-3d-lieu__del:focus-visible, .idd-ps-3d-linkbtn:focus-visible, .idd-ps-3d-lieu-form input:focus-visible{ outline:2px solid #E8B7C4; outline-offset:2px; }
/* Section repliable « Le lieu » (lot 4) : un résumé d'une ligne, les réglages dépliés au besoin. */
.idd-ps-3d-fold{ border-top:1px solid rgba(255,255,255,.14); border-bottom:1px solid rgba(255,255,255,.14); margin:2px 0 14px; }
.idd-ps-3d-fold[open]{ padding-bottom:6px; }
.idd-ps-3d-fold > summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:10px; min-height:46px; color:#fff; }
.idd-ps-3d-fold > summary::-webkit-details-marker{ display:none; }
.idd-ps-3d-fold > summary span{ font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; flex:none; }
.idd-ps-3d-fold > summary small{ flex:1; min-width:0; font-size:12px; color:rgba(255,255,255,.72); text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.idd-ps-3d-fold > summary svg{ flex:none; transition:transform .2s ease; }
.idd-ps-3d-fold[open] > summary svg{ transform:rotate(180deg); }
.idd-ps-3d-fold > summary:focus-visible{ outline:2px solid #E8B7C4; outline-offset:2px; border-radius:6px; }
@media (prefers-reduced-motion: reduce){ .idd-ps-3d-fold > summary svg{ transition:none; } }
.idd-ps-3d-colors-label{
    font-size:11px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:rgba(255,255,255,.7);
    margin-bottom:8px;
}
.idd-ps-3d-colors-swatches{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}
.idd-ps-3d-swatch{
    width:32px;
    height:32px;
    border-radius:8px;
    border:2px solid rgba(255,255,255,.2);
    cursor:pointer;
    padding:0;
    transition:transform .12s, border-color .12s;
    position:relative;
}
.idd-ps-3d-swatch:hover{ transform:scale(1.1); }
.idd-ps-3d-swatch.is-active{
    border-color:#fff;
    box-shadow:0 0 0 2px #9E4D64;
}
.idd-ps-3d-swatch.is-active::after{
    content:'✓';
    position:absolute;
    top:50%; left:50%;
    transform:translate(-50%,-50%);
    color:#fff;
    font-weight:900;
    text-shadow:0 1px 2px rgba(0,0,0,.6);
}
.idd-ps-3d-mode[data-ps-3d-colors-toggle].is-active{
    background:linear-gradient(135deg,#9E4D64 0%, #853F55 100%);
    color:#fff;
}

@media (max-width: 768px){
    .idd-ps-3d-colors{
        top:auto;
        bottom:80px;
        right:10px;
        left:10px;
        width:auto;
    }
    .idd-ps-3d-colors-swatches{ justify-content:center; }
}

/* ==========================================================
   VISITE 3D — Popup d'introduction (1re ouverture)
   ========================================================== */
.idd-ps-3d-intro{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:10;
    background:rgba(10,10,15,.65);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    padding:20px;
}
.idd-ps-3d-intro-box{
    max-width:520px;
    background:#FFFFFF;
    border-radius:18px;
    padding:32px 28px;
    box-shadow:0 30px 80px -10px rgba(0,0,0,.5);
    text-align:center;
    color:#1D1819;
}
.idd-ps-3d-intro-icon{
    font-size:48px;
    margin-bottom:8px;
}
.idd-ps-3d-intro-box h3{
    font-family:'Cormorant Garamond', Georgia, serif;
    font-size:26px;
    font-weight:700;
    margin:0 0 14px;
    color:#1D1819;
}
.idd-ps-3d-intro-box p{
    font-size:14.5px;
    line-height:1.5;
    color:#4A4543;
    margin:0 0 12px;
    text-align:left;
}
.idd-ps-3d-intro-box p strong{ color:#1D1819; }
.idd-ps-3d-intro-box p.idd-ps-3d-intro-warn{
    background:#FFF6E5;
    border-left:3px solid #D4A96A;
    padding:10px 12px;
    border-radius:4px;
    font-size:13.5px;
    color:#5A3A1F;
}
.idd-ps-3d-intro-features{
    list-style:none;
    padding:0;
    margin:16px 0;
    text-align:left;
}
.idd-ps-3d-intro-features li{
    font-size:13.5px;
    line-height:1.5;
    color:#4A4543;
    padding:6px 0;
    border-bottom:1px solid #F1ECE5;
}
.idd-ps-3d-intro-features li:last-child{ border-bottom:0; }
.idd-ps-3d-intro-dontshow{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin:14px 0 18px;
    font-size:13px;
    color:#6B6360;
    cursor:pointer;
    user-select:none;
}
.idd-ps-3d-intro-dontshow input{ cursor:pointer; }
.idd-ps-3d-intro-close{
    background:linear-gradient(135deg,#9E4D64 0%, #853F55 100%);
    color:#fff;
    border:0;
    padding:12px 28px;
    border-radius:999px;
    font-size:14px;
    font-weight:600;
    cursor:pointer;
    transition:filter .15s;
}
.idd-ps-3d-intro-close:hover{ filter:brightness(1.08); }

@media (max-width:600px){
    .idd-ps-3d-intro-box{ padding:24px 20px; }
    .idd-ps-3d-intro-box h3{ font-size:22px; }
}

/* ==========================================================
   MENU CONTEXTUEL (clic droit sur élément du canvas 2D)
   ========================================================== */
/* Menu clic droit : voir « Menu clic droit / appui long (octobre 2026) » en fin de fichier */

/* FIX : l'attribut [hidden] doit fermer la popup d'intro 3D.
   Sans cette règle, la spécificité de .idd-ps-3d-intro (display:flex)
   gagne contre le browser default sur [hidden], donc la popup reste
   visible après "Compris". */
.idd-ps-3d-intro[hidden]{ display: none !important; }

/* ==========================================================
   VISITE 3D — Mobile & tactile (< 768px et pointer: coarse)
   ========================================================== */

/* Dynamic viewport height : sur iOS Safari, 100% se calcule en incluant
   la barre URL ; 100dvh suit dynamiquement quand elle apparaît/disparaît. */
@supports (height: 100dvh) {
    .idd-ps-3d-overlay{ height: 100dvh; }
}

/* Mode FPS masqué sur écrans tactiles : pas de clavier WASD ni pointer lock
   fiable. La rotation 1 doigt + pinch 2 doigts suffit pour l'usage mariage. */
/* La visite se fait maintenant au doigt (toucher le sol pour avancer) : bouton visible partout. */

@media (max-width: 768px){
    .idd-ps-3d-topbar{
        flex-wrap: wrap;
        gap: 8px;
        padding: 8px 10px;
        align-items: center;
    }
    .idd-ps-3d-title{
        font-size: 13px;
        flex: 1 1 auto;
        min-width: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        order: 1;
    }
    .idd-ps-3d-close{
        order: 2;
        width: 40px;
        height: 40px;
        flex-shrink: 0;
    }
    /* La barre de modes prend toute la largeur en dessous et scrolle
       horizontalement si elle dépasse (pas de débordement écran). */
    .idd-ps-3d-modes{
        order: 3;
        flex: 1 1 100%;
        gap: 4px;
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: nowrap;
        scrollbar-width: none;            /* Firefox */
        -ms-overflow-style: none;         /* IE/Edge legacy */
        -webkit-overflow-scrolling: touch;
    }
    .idd-ps-3d-modes::-webkit-scrollbar{ display: none; }
    .idd-ps-3d-mode{
        flex-shrink: 0;
        min-height: 40px;
        padding: 8px 12px;
        font-size: 13px;
        white-space: nowrap;
    }
    /* Panneau couleurs : drawer plein-largeur ancré en bas avec scroll vertical. */
    .idd-ps-3d-colors{
        top: auto;
        bottom: 0;
        right: 0;
        left: 0;
        width: auto;
        max-height: 55vh;
        max-height: 55dvh;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        border-radius: 14px 14px 0 0;
        padding: 16px 14px calc(16px + env(safe-area-inset-bottom));
    }
    .idd-ps-3d-swatch{
        width: 38px;
        height: 38px;
        border-radius: var(--radius-sm, 10px);
    }
    .idd-ps-3d-loader{
        font-size: 13px;
        padding: 0 16px;
        text-align: center;
    }
    /* Popup intro : scroll vertical si contenu trop long, padding réduit. */
    .idd-ps-3d-intro{
        align-items: flex-start;
        padding: 60px 12px 20px;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
    .idd-ps-3d-intro-box{
        max-width: 100%;
        padding: 22px 18px;
    }
    .idd-ps-3d-intro-icon{ font-size: 40px; }
    .idd-ps-3d-intro-box h3{ font-size: 20px; }
    .idd-ps-3d-intro-box p,
    .idd-ps-3d-intro-features li{ font-size: 13px; }
    .idd-ps-3d-intro-close{
        width: 100%;
        padding: 14px 28px;
        font-size: 15px;
    }
}

/* Écran très petit (iPhone SE et inférieur) : on cache le titre pour gagner
   de la place au profit des boutons d'action. */
@media (max-width: 380px){
    .idd-ps-3d-title{ display: none; }
}

/* ==========================================================
   VISITE 3D (moteur réaliste, octobre 2026) — aide et bandeau « assis »
   ========================================================== */
.idd-ps-3d-hud{ position:absolute; left:50%; bottom:calc(18px + env(safe-area-inset-bottom, 0px)); transform:translateX(-50%); z-index:6; display:flex; flex-direction:column; align-items:center; gap:10px; width:min(560px, calc(100% - 24px)); pointer-events:none; }
.idd-ps-3d-hud__hint{ margin:0; padding:8px 14px; border-radius:999px; background:rgba(29,24,25,.62); color:#fff; font-size:13px; line-height:1.35; text-align:center; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.idd-ps-3d-hud__seat{ pointer-events:auto; display:flex; align-items:center; gap:12px; flex-wrap:wrap; justify-content:center; padding:10px 12px 10px 16px; border-radius:16px; background:rgba(255,255,255,.94); color:#1D1819; box-shadow:0 10px 30px rgba(0,0,0,.18); font-size:14px; font-weight:600; }
.idd-ps-3d-hud__seat[hidden]{ display:none !important; }
.idd-ps-3d-hud__seat button{ border:0; border-radius:999px; padding:8px 14px; background:#9E4D64; color:#fff; font-weight:700; font-size:13px; cursor:pointer; }
.idd-ps-3d-overlay .idd-ps-3d-canvas{ touch-action:none; }

/* Panneau « Décor » : styles, couleurs, chaises (octobre 2026) */
.idd-ps-3d-colors{ width:320px; max-height:calc(100% - 90px); overflow-y:auto; overscroll-behavior:contain; }
.idd-ps-3d-colors[hidden]{ display:none !important; }
.idd-ps-3d-colors-head{ display:flex; align-items:center; justify-content:space-between; margin:-2px 0 12px; }
.idd-ps-3d-colors-head strong{ font-size:15px; }
.idd-ps-3d-colors-x{ width:34px; height:34px; border-radius:999px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.06); color:#fff; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; padding:0; }
.idd-ps-3d-styles{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; }
.idd-ps-3d-style{ position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:6px; padding:10px; border-radius:12px; border:1.5px solid rgba(255,255,255,.14); background:rgba(255,255,255,.05); color:#fff; text-align:left; cursor:pointer; font:inherit; min-height:64px; }
.idd-ps-3d-style:hover{ background:rgba(255,255,255,.1); }
.idd-ps-3d-style.is-active{ border-color:#E8B7C4; background:rgba(158,77,100,.35); box-shadow:0 0 0 1px #E8B7C4 inset; }
.idd-ps-3d-style__dots{ display:inline-flex; gap:3px; }
.idd-ps-3d-style__dots i{ width:14px; height:14px; border-radius:999px; border:1px solid rgba(255,255,255,.35); display:block; }
.idd-ps-3d-style__name{ font-size:13px; font-weight:600; line-height:1.2; }
.idd-ps-3d-style__tag{ font-size:10.5px; font-weight:700; letter-spacing:.02em; color:#1D1819; background:#F3D2D6; border-radius:999px; padding:2px 7px; }
.idd-ps-3d-seg{ display:flex; gap:6px; flex-wrap:wrap; }
.idd-ps-3d-seg button, .idd-ps-3d-chips button{ display:inline-flex; align-items:center; gap:6px; min-height:38px; padding:7px 12px; border-radius:999px; border:1.5px solid rgba(255,255,255,.16); background:rgba(255,255,255,.05); color:#fff; font:inherit; font-size:13px; cursor:pointer; }
.idd-ps-3d-seg button.is-active, .idd-ps-3d-chips button.is-active{ border-color:#E8B7C4; background:rgba(158,77,100,.45); }
.idd-ps-3d-chips{ display:flex; flex-wrap:wrap; gap:6px; }
.idd-ps-3d-note{ margin:0; font-size:12.5px; line-height:1.45; color:rgba(255,255,255,.78); }
.idd-ps-3d-more{ margin-top:4px; border-top:1px solid rgba(255,255,255,.1); padding-top:10px; }
.idd-ps-3d-more summary{ cursor:pointer; font-size:13px; font-weight:600; color:rgba(255,255,255,.85); margin-bottom:10px; list-style:none; display:flex; align-items:center; gap:6px; }
.idd-ps-3d-more summary::-webkit-details-marker{ display:none; }
.idd-ps-3d-more summary::before{ content:''; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(-45deg); transition:transform .15s; }
.idd-ps-3d-more[open] summary::before{ transform:rotate(45deg); }
.idd-ps-3d-mode svg{ vertical-align:-3px; }
@media (max-width: 768px){
    .idd-ps-3d-colors{ width:auto; max-height:62vh; max-height:62dvh; z-index:7; }
    .idd-ps-3d-styles{ grid-template-columns:repeat(3, minmax(0,1fr)); }
    /* Barre d'outils 3D : un fondu à droite montre qu'on peut la faire défiler */
    .idd-ps-3d-modes{ -webkit-mask-image:linear-gradient(to right, #000 0, #000 calc(100% - 34px), transparent 100%); mask-image:linear-gradient(to right, #000 0, #000 calc(100% - 34px), transparent 100%); padding-right:30px; }
    .idd-ps-3d-modes.is-end{ -webkit-mask-image:none; mask-image:none; }
}
@media (max-width: 420px){
    .idd-ps-3d-styles{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width: 768px){
    /* Assis à une place : on garde l'écran pour la vue, l'aide revient en vue d'ensemble */
    .idd-ps-3d-hud:has(.idd-ps-3d-hud__seat:not([hidden])) .idd-ps-3d-hud__hint{ display:none; }
}

/* ==========================================================
   Bibliothèque « Décoration de mariage » (commune aux plans)
   ========================================================== */
/* Toutes les familles visibles d'un coup (sur téléphone, une rangée défilante cachait la moitié des familles). */
.idd-ps-deco-chips { display:flex; flex-wrap:wrap; gap:6px; padding:2px 0 10px; }
.idd-ps-deco-chip { flex:none; border:1.5px solid var(--wp-line, #EDE0E4); background:#fff; color:var(--wp-ink, #1D1819); border-radius:999px; padding:7px 12px; min-height:36px; font:inherit; font-size:13px; font-weight:600; cursor:pointer; }
.idd-ps-deco-chip.is-active { background:#9E4D64; border-color:#9E4D64; color:#fff; }

/* Mode vue du plan 2D */
.idd-ps-viewpill { position:absolute; left:50%; top:12px; transform:translateX(-50%); z-index:30; display:flex; align-items:center; gap:10px; padding:6px 6px 6px 14px; border-radius:999px; background:rgba(29,24,25,.86); color:#fff; font-size:13px; font-weight:600; box-shadow:0 8px 24px rgba(0,0,0,.18); white-space:nowrap; }
.idd-ps-viewpill[hidden] { display:none !important; }
.idd-ps-viewpill button { border:0; border-radius:999px; background:#fff; color:#9E4D64; font:inherit; font-size:13px; font-weight:700; padding:6px 12px; min-height:32px; cursor:pointer; }
.idd-ps-editor { position:relative; }

/* ==========================================================
   Visite 3D : mode édition, ajout d'objets, matériel
   ========================================================== */
.idd-ps-3d-mode--edit.is-active { background:linear-gradient(135deg,#9E4D64 0%, #853F55 100%); color:#fff; }
.idd-ps-3d-overlay.is-editing .idd-ps-3d-canvas { cursor:default; }
.idd-ps-3d-edit { pointer-events:auto; width:100%; display:flex; flex-direction:column; gap:8px; padding:10px; border-radius:16px; background:rgba(255,255,255,.96); color:#1D1819; box-shadow:0 10px 30px rgba(0,0,0,.2); }
.idd-ps-3d-edit[hidden] { display:none !important; }
.idd-ps-3d-edit__head { display:flex; align-items:baseline; justify-content:space-between; gap:10px; padding:0 4px; }
.idd-ps-3d-edit__head strong { font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.idd-ps-3d-edit__head span { font-size:12px; color:#6E5A60; white-space:nowrap; }
/* Un mur choisi (lot 4) : son nom en entier, l'aide dessous. */
.idd-ps-3d-edit.is-wall .idd-ps-3d-edit__head { flex-direction:column; align-items:flex-start; gap:2px; }
.idd-ps-3d-edit.is-wall .idd-ps-3d-edit__head strong { white-space:normal; }
.idd-ps-3d-edit.is-wall .idd-ps-3d-edit__head span { white-space:normal; }
.idd-ps-3d-edit__btns { display:flex; gap:6px; }
.idd-ps-3d-edit__btns button { flex:1 1 auto; display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:44px; padding:8px 10px; border:1.5px solid #EDE0E4; border-radius:12px; background:#fff; color:#1D1819; font:inherit; font-size:13px; font-weight:600; cursor:pointer; }
.idd-ps-3d-edit__btns button[data-edit-act="rotl"], .idd-ps-3d-edit__btns button[data-edit-act="rotr"] { flex:0 0 48px; }
.idd-ps-3d-edit__btns button[hidden] { display:none; }
.idd-ps-3d-edit__btns button.is-danger { color:#B42318; border-color:#F4D3D0; }
.idd-ps-3d-overlay.is-editing .idd-ps-3d-hud__hint { display:none; }
.idd-ps-3d-overlay.is-editing .idd-ps-3d-hud:not(:has(.idd-ps-3d-edit:not([hidden]))) .idd-ps-3d-hud__hint { display:block; }
.idd-ps-3d-add { position:absolute; left:16px; bottom:calc(18px + env(safe-area-inset-bottom, 0px)); z-index:7; display:inline-flex; align-items:center; gap:8px; min-height:48px; padding:10px 18px 10px 14px; border:0; border-radius:999px; background:linear-gradient(135deg,#9E4D64 0%, #853F55 100%); color:#fff; font:inherit; font-size:15px; font-weight:700; box-shadow:0 10px 26px rgba(133,63,85,.45); cursor:pointer; }
.idd-ps-3d-add[hidden] { display:none !important; }
.idd-ps-3d-overlay.is-editing .idd-ps-3d-hud { left:auto; right:16px; transform:none; width:min(460px, calc(100% - 180px)); }
.idd-ps-3d-addpanel, .idd-ps-3d-matpanel { z-index:8; }
.idd-ps-3d-chips--scroll { flex-wrap:nowrap; overflow-x:auto; padding-bottom:8px; margin-bottom:6px; scrollbar-width:none; }
.idd-ps-3d-chips--scroll::-webkit-scrollbar { display:none; }
.idd-ps-3d-chips--scroll button { flex:none; }
/* Bibliothèque, étape 1 : recherche (panneau 2D : seuls les résultats pendant une recherche ; tiroir 3D : champ en tête) */
.idd-tool-panel .is-search-hidden { display:none !important; }
.idd-ps-3d-addsearch { position:relative; margin:0 0 12px; }
.idd-ps-3d-addsearch svg { position:absolute; left:12px; top:50%; width:16px; height:16px; margin-top:-8px; color:rgba(255,255,255,.62); pointer-events:none; }
.idd-ps-3d-addsearch input { box-sizing:border-box; width:100%; min-height:44px; padding:8px 12px 8px 36px; border-radius:10px; border:1.5px solid rgba(255,255,255,.3); background:rgba(0,0,0,.25); color:#fff; font:inherit; font-size:16px; }
.idd-ps-3d-addsearch input::placeholder { color:rgba(255,255,255,.62); }
.idd-ps-3d-addsearch input:focus-visible { outline:2px solid #E8B7C4; outline-offset:2px; }
.idd-ps-3d-addsearch input::-webkit-search-cancel-button { -webkit-appearance:none; appearance:none; width:20px; height:20px; 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='%23F3C9D5' 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-ps-3d-addgroup { margin-bottom:10px; }
.idd-ps-3d-addgroup__label { font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:rgba(255,255,255,.62); margin:0 0 6px; }
.idd-ps-3d-chips--compact { gap:6px; }
.idd-ps-3d-chips--compact button { min-height:34px; padding:6px 11px; font-size:12.5px; }
/* Matières photo du sol et des murs (chantier « lieux », lot 1) : vignette ronde dans la pastille */
.idd-ps-3d-matchip img, .idd-ps-3d-chip-dot { width:22px; height:22px; flex:0 0 22px; margin-left:-5px; border-radius:50%; object-fit:cover; box-shadow:0 0 0 1px rgba(255,255,255,.28); }
.idd-ps-3d-chip-dot { display:inline-block; }
.idd-ps-3d-addgroup + .idd-ps-3d-additems { margin-top:12px; padding-top:12px; border-top:1px solid rgba(255,255,255,.1); }
.idd-ps-3d-additems { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; }
.idd-ps-3d-additem { display:flex; align-items:center; gap:10px; min-height:56px; padding:8px 10px; border-radius:12px; border:1.5px solid rgba(255,255,255,.14); background:rgba(255,255,255,.05); color:#fff; font:inherit; font-size:13px; font-weight:600; text-align:left; cursor:pointer; }
.idd-ps-3d-additem:hover { background:rgba(255,255,255,.12); }
.idd-ps-3d-additem__icon { flex:none; width:34px; height:34px; border-radius:10px; background:rgba(232,183,196,.18); color:#F3C9D5; display:inline-flex; align-items:center; justify-content:center; }
.idd-ps-3d-additem__icon svg { width:22px; height:22px; }
.idd-ps-3d-mat__sec { margin-bottom:14px; }
.idd-ps-3d-mat__sec ul { list-style:none; margin:0; padding:0; }
.idd-ps-3d-mat__sec li { display:flex; justify-content:space-between; gap:12px; padding:7px 0; border-bottom:1px solid rgba(255,255,255,.08); font-size:13.5px; line-height:1.35; }
.idd-ps-3d-mat__sec li strong { flex:none; font-variant-numeric:tabular-nums; }
.idd-ps-3d-mat__actions { margin-top:6px; }
.idd-ps-3d-mat__actions button { flex:1 1 auto; justify-content:center; }
.idd-ps-3d-addpanel .idd-ps-3d-note, .idd-ps-3d-matpanel > .idd-ps-3d-note { margin:-4px 0 12px; }
@media (max-width: 768px){
    .idd-ps-3d-overlay.is-editing .idd-ps-3d-hud { left:50%; right:auto; transform:translateX(-50%); width:calc(100% - 24px); bottom:calc(84px + env(safe-area-inset-bottom, 0px)); }
    .idd-ps-3d-add { left:50%; transform:translateX(-50%); bottom:calc(16px + env(safe-area-inset-bottom, 0px)); }
    .idd-ps-3d-edit__btns button span { display:none; }
    .idd-ps-3d-edit__btns button { flex:1 1 0; }
    .idd-ps-3d-edit__btns button[data-edit-act="rotl"], .idd-ps-3d-edit__btns button[data-edit-act="rotr"] { flex:1 1 0; }
}
.idd-ps-viewpill { top:auto; bottom:14px; }

/* Centre de table, table par table (barre d'édition 3D) */
.idd-ps-3d-edit__centers { display:flex; flex-wrap:wrap; gap:6px; padding:2px 2px 0; max-height:150px; overflow-y:auto; }
.idd-ps-3d-edit__centers[hidden] { display:none !important; }
.idd-ps-3d-edit__centers button { min-height:34px; padding:6px 11px; border:1.5px solid #EDE0E4; border-radius:999px; background:#fff; color:#1D1819; font:inherit; font-size:12.5px; font-weight:600; cursor:pointer; }
.idd-ps-3d-edit__centers button.is-active { background:#9E4D64; border-color:#9E4D64; color:#fff; }
/* Panneau Décor : art de la table */
.idd-ps-3d-tw__row { margin-bottom:10px; }
.idd-ps-3d-tw__title { font-size:12px; font-weight:600; color:rgba(255,255,255,.82); margin:0 0 6px; }

/* Cérémonie laïque (même moteur) : pas de légende des invités ; pastille « Soleil réel » de la 3D */
.is-ceremonie .idd-ps-legend { display:none !important; }
.idd-ps-3d-sunpill { pointer-events:none; display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:999px; background:rgba(29,24,25,.72); color:#fff; font-size:12.5px; font-weight:600; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.idd-ps-3d-sunpill svg { color:#FFD58A; flex:none; }
/* Curseur d'heure (cérémonie) : la pastille devient manipulable */
.idd-ps-3d-sunpill.has-slider { pointer-events:auto; flex-wrap:wrap; max-width:min(92vw, 340px); }
.idd-ps-3d-sunpill__range { flex:1 1 100%; width:100%; min-width:180px; height:28px; margin:2px 0 0; accent-color:#E8B7C4; cursor:pointer; touch-action:pan-x; }

/* 3D : chargement visible pendant une reconstruction (style, lieu, chaises, art de la table) */
.idd-ps-3d-loading { position:absolute; inset:0; z-index:20; display:flex; align-items:center; justify-content:center; background:rgba(15,13,14,.28); pointer-events:all; }
.idd-ps-3d-loading[hidden] { display:none !important; }
.idd-ps-3d-loading__card { display:flex; flex-direction:column; align-items:center; gap:12px; min-width:220px; padding:20px 26px 18px; border-radius:18px; background:rgba(29,24,25,.86); color:#fff; font-size:14.5px; font-weight:600; box-shadow:0 18px 40px rgba(0,0,0,.35); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.idd-ps-3d-loading__spin, .idd-ps-3d-loading__ring.is-fallback, .idd-ps-3d-wait__ring.is-fallback { width:38px; height:38px; border-radius:50%; border:3.5px solid rgba(255,255,255,.18); border-top-color:#E8B7C4; animation:idd-ps-spin .8s linear infinite; will-change:transform; }
.idd-ps-3d-loading__bar { position:relative; width:180px; height:4px; border-radius:4px; background:rgba(255,255,255,.14); overflow:hidden; }
.idd-ps-3d-loading__bar i { position:absolute; top:0; bottom:0; width:40%; border-radius:4px; background:linear-gradient(90deg,#9E4D64,#E8B7C4); animation:idd-ps-bar 1.1s ease-in-out infinite; will-change:transform; }
@keyframes idd-ps-spin { to { transform:rotate(360deg); } }
@keyframes idd-ps-bar { 0% { transform:translateX(-110%); } 100% { transform:translateX(260%); } }
@media (prefers-reduced-motion: reduce) { .idd-ps-3d-loading__spin, .idd-ps-3d-loading__bar i { animation-duration:2.4s; } }
/* 3D : Annuler / Rétablir (mode Modifier) */
.idd-ps-3d-hist { position:absolute; left:16px; bottom:calc(76px + env(safe-area-inset-bottom, 0px)); z-index:7; display:inline-flex; gap:8px; }
.idd-ps-3d-hist[hidden] { display:none !important; }
.idd-ps-3d-hist button { display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:8px 14px 8px 11px; border:0; border-radius:999px; background:rgba(255,255,255,.95); color:#1D1819; font:inherit; font-size:13.5px; font-weight:700; box-shadow:0 8px 20px rgba(0,0,0,.18); cursor:pointer; }
.idd-ps-3d-hist button:disabled { opacity:.45; cursor:default; }
.idd-ps-3d-hist button svg { color:#9E4D64; }
@media (max-width: 768px){
    .idd-ps-3d-hist { left:12px; bottom:calc(16px + env(safe-area-inset-bottom, 0px)); }
    .idd-ps-3d-hist button { width:48px; height:48px; padding:0; justify-content:center; }
    .idd-ps-3d-hist button span { display:none; }
    .idd-ps-3d-overlay.has-panel .idd-ps-3d-hud { display:none; }
}
@media (min-width: 769px){
    .idd-ps-3d-overlay.has-panel .idd-ps-3d-hud, .idd-ps-3d-overlay.is-editing.has-panel .idd-ps-3d-hud { left:16px; right:auto; transform:none; width:min(460px, calc(100% - 400px)); bottom:calc(140px + env(safe-area-inset-bottom, 0px)); align-items:flex-start; }
}
/* 3D : Personnaliser (réglages propres à l'objet : bouquets, fleurs, couleurs, décor des chaises) */
.idd-ps-3d-edit__custom { display:flex; flex-direction:column; gap:10px; max-height:min(44vh, 340px); overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; padding:2px 2px 4px; }
.idd-ps-3d-edit__custom[hidden] { display:none !important; }
.idd-ps-3d-edit__rowtitle { font-size:12px; font-weight:700; letter-spacing:.02em; color:#6B5A5E; margin:0 0 5px; }
.idd-ps-3d-edit__custom .idd-ps-3d-chips { display:flex; flex-wrap:wrap; gap:6px; }
.idd-ps-3d-edit__custom button { display:inline-flex; align-items:center; gap:6px; min-height:36px; padding:6px 11px; border:1.5px solid #EDE0E4; border-radius:999px; background:#fff; color:#1D1819; font:inherit; font-size:12.5px; font-weight:600; cursor:pointer; }
.idd-ps-3d-edit__custom button.is-active { background:#9E4D64; border-color:#9E4D64; color:#fff; }
.idd-ps-3d-sw { flex:none; width:16px; height:16px; border-radius:50%; border:1.5px solid rgba(0,0,0,.14); }
img.idd-ps-3d-sw { object-fit:cover; }
.idd-ps-3d-edit__btns button.is-active { background:#F8EEF1; border-color:#9E4D64; color:#853F55; }

/* 3D : visite à pied — joystick semi-transparent en bas à droite */
.idd-ps-3d-joy { position:absolute; right:calc(18px + env(safe-area-inset-right, 0px)); bottom:calc(22px + env(safe-area-inset-bottom, 0px)); z-index:7; touch-action:none; user-select:none; -webkit-user-select:none; }
.idd-ps-3d-joy[hidden] { display:none !important; }
.idd-ps-3d-joy__base { position:relative; width:132px; height:132px; border-radius:50%; background:radial-gradient(circle, rgba(255,255,255,.16) 0%, rgba(255,255,255,.26) 70%, rgba(255,255,255,.34) 100%); border:2px solid rgba(255,255,255,.55); box-shadow:0 6px 22px rgba(0,0,0,.22), inset 0 0 18px rgba(0,0,0,.08); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); cursor:grab; touch-action:none; }
.idd-ps-3d-joy__base::before, .idd-ps-3d-joy__base::after { content:""; position:absolute; left:50%; top:50%; width:0; height:0; border:7px solid transparent; opacity:.7; }
.idd-ps-3d-joy__base::before { border-bottom-color:#fff; transform:translate(-50%, -58px); }
.idd-ps-3d-joy__base::after { border-top-color:#fff; transform:translate(-50%, 44px); }
.idd-ps-3d-joy__knob { position:absolute; left:50%; top:50%; width:56px; height:56px; margin:-28px 0 0 -28px; border-radius:50%; background:radial-gradient(circle at 35% 30%, rgba(255,255,255,.95), rgba(240,226,231,.72)); border:2px solid rgba(158,77,100,.55); box-shadow:0 4px 14px rgba(0,0,0,.28); pointer-events:none; transition:transform .12s ease-out; }
.idd-ps-3d-joy.is-active .idd-ps-3d-joy__base { cursor:grabbing; background:radial-gradient(circle, rgba(255,255,255,.22) 0%, rgba(255,255,255,.34) 70%, rgba(255,255,255,.42) 100%); }
.idd-ps-3d-joy.is-active .idd-ps-3d-joy__knob { transition:none; }
.idd-ps-3d-overlay.is-walking .idd-ps-3d-hud { left:16px; right:auto; transform:none; width:min(460px, calc(100% - 190px)); align-items:flex-start; }
@media (max-width: 768px) {
  .idd-ps-3d-joy__base { width:120px; height:120px; }
  .idd-ps-3d-joy__base::before { transform:translate(-50%, -54px); }
  .idd-ps-3d-joy__base::after { transform:translate(-50%, 40px); }
  .idd-ps-3d-overlay.is-walking .idd-ps-3d-hud__hint { font-size:12px; text-align:left; }
}
@media (prefers-reduced-motion: reduce) { .idd-ps-3d-joy__knob { transition:none; } }

/* ==========================================================
   VISITE 3D — colonne d'outils fixe le long du bord droit (octobre 2026)
   La barre du haut ne garde que le titre et la croix ; les outils sont en colonne,
   translucides et colorés, toujours à portée de pouce, sans défilement horizontal.
   ========================================================== */
.idd-ps-3d-rail {
    position:absolute; right:calc(12px + env(safe-area-inset-right, 0px)); top:70px; z-index:5;
    display:flex; flex-direction:column; align-items:stretch; gap:8px;
    margin:0; padding:2px; background:none !important; border:0 !important; border-radius:0;
    max-height:calc(100% - 250px); overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; scrollbar-width:none;
    -webkit-mask-image:none !important; mask-image:none !important;
}
.idd-ps-3d-rail::-webkit-scrollbar { display:none; }
.idd-ps-3d-rail .idd-ps-3d-rail__btn {
    flex:0 0 auto; width:62px; min-height:56px; padding:7px 4px 6px;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
    border-radius:16px; border:1px solid rgba(255,255,255,.38);
    background:linear-gradient(160deg, rgba(176,90,114,.66), rgba(133,63,85,.52));
    backdrop-filter:blur(8px) saturate(140%); -webkit-backdrop-filter:blur(8px) saturate(140%);
    color:#fff; box-shadow:0 6px 18px rgba(40,10,20,.25);
    font-size:10.5px; font-weight:700; letter-spacing:.01em; line-height:1.1; text-align:center; white-space:nowrap;
    transition:transform .15s, background .15s, box-shadow .15s;
}
.idd-ps-3d-rail .idd-ps-3d-rail__btn svg { width:22px; height:22px; flex:none; vertical-align:0; }
.idd-ps-3d-rail .idd-ps-3d-rail__btn:hover { background:linear-gradient(160deg, rgba(176,90,114,.85), rgba(133,63,85,.75)); color:#fff; }
.idd-ps-3d-rail .idd-ps-3d-rail__btn:active { transform:scale(.95); }
.idd-ps-3d-rail .idd-ps-3d-rail__btn.is-active { background:linear-gradient(160deg, #B05A72, #853F55); border-color:#fff; box-shadow:0 0 0 2px rgba(255,255,255,.6), 0 8px 20px rgba(40,10,20,.35); }
.idd-ps-3d-rail .idd-ps-3d-rail__btn:focus-visible { outline:3px solid #fff; outline-offset:2px; }
.idd-ps-3d-rail__lbl { display:block; max-width:58px; overflow:hidden; text-overflow:ellipsis; }
.idd-ps-3d-rail__btn[data-amb="sunset"] { background:linear-gradient(160deg, rgba(236,146,96,.78), rgba(190,92,82,.62)) !important; }
.idd-ps-3d-rail__btn[data-amb="night"] { background:linear-gradient(160deg, rgba(64,64,118,.8), rgba(34,34,72,.7)) !important; }
@media (min-width: 769px) {
    .idd-ps-3d-colors { right:92px; }
    .idd-ps-3d-overlay.is-editing .idd-ps-3d-hud { right:92px; }
}
@media (max-width: 768px) {
    .idd-ps-3d-rail { right:calc(8px + env(safe-area-inset-right, 0px)); top:60px; gap:6px; max-height:calc(100% - 60px - 170px); }
    .idd-ps-3d-rail .idd-ps-3d-rail__btn { width:56px; min-height:52px; border-radius:14px; font-size:10px; padding:6px 3px 5px; }
    .idd-ps-3d-rail .idd-ps-3d-rail__btn svg { width:20px; height:20px; }
    /* barre d'édition (Personnaliser…) : laisse la colonne visible à droite */
    .idd-ps-3d-overlay.is-editing .idd-ps-3d-hud { left:10px; right:auto; transform:none; width:calc(100% - 82px); }
    .idd-ps-3d-overlay.is-editing .idd-ps-3d-add { left:calc(50% - 36px); }
}
@media (prefers-reduced-motion: reduce) { .idd-ps-3d-rail .idd-ps-3d-rail__btn { transition:none; } }
/* Panneaux de la 3D (Décor, Ajouter, Matériel) : l'en-tête et sa croix restent visibles pendant le défilement */
.idd-ps-3d-colors-head { position:sticky; top:-14px; z-index:3; margin:-14px -14px 12px; padding:12px 14px 10px; background:rgba(20,20,28,.97); border-radius:14px 14px 0 0; }
@media (max-width: 768px) { .idd-ps-3d-colors-head { top:-16px; margin:-16px -14px 12px; padding:14px 14px 10px; } }

/* Téléphone / tablette : la feuille du plan occupe toute la zone libre (classe posée par app.js). */
@media (max-width: 1023px) {
    .idd-ps-fill .idd-ps-canvas-area { padding: 6px; overflow: hidden; }
    .idd-ps-fill .idd-ps-canvas-frame { margin: 0 auto; }
}

/* ==========================================================
   Attente de la 3D aux couleurs du logo (octobre 2026)
   La bague WeddingPart se trace dès le clic, jusqu'à la première image ;
   message si c'est long ; Réessayer / Fermer en cas d'échec.
   ========================================================== */
.idd-ps-3d-loader {
    position:absolute; inset:0; z-index:6;
    display:flex; align-items:center; justify-content:center;
    padding:72px 20px calc(24px + env(safe-area-inset-bottom, 0px));
    background:radial-gradient(110% 80% at 50% 42%, #FFFFFF 0%, #FDFAF8 55%, #F6ECEF 100%);
    color:#3B2A30; text-align:center;
    opacity:1; transition:opacity .38s ease;
}
.idd-ps-3d-loader[hidden] { display:none !important; }
.idd-ps-3d-loader.is-done { opacity:0; pointer-events:none; }
.idd-ps-3d-loader::before { /* halo rose et or derrière la bague, comme l'écran de lancement */
    content:''; position:absolute; left:50%; top:50%; width:min(90vw, 560px); aspect-ratio:1; border-radius:50%;
    transform:translate(-50%, -54%);
    background:radial-gradient(circle, rgba(181,99,122,.12) 0%, rgba(201,168,124,.08) 38%, transparent 68%);
    pointer-events:none;
}
.idd-ps-3d-wait { position:relative; display:flex; flex-direction:column; align-items:center; gap:8px; width:100%; max-width:360px; }
.idd-ps-3d-wait__ring { display:block; width:64px; height:90px; margin:0 0 10px; object-fit:contain; }
.idd-ps-3d-wait__ring.is-fallback, .idd-ps-3d-loading__ring.is-fallback { width:44px; height:44px; border-color:rgba(181,99,122,.18); border-top-color:#B5637A; }
.idd-ps-3d-wait__title { margin:0; font-family:var(--font-serif, 'Cormorant Garamond', Georgia, serif); font-size:26px; font-weight:600; line-height:1.15; color:#2A1D22; }
.idd-ps-3d-wait__step { margin:0; font-family:'DM Sans', system-ui, sans-serif; font-size:14.5px; font-weight:500; color:#6E5A61; min-height:1.4em; }
.idd-ps-3d-wait__bar { position:relative; display:block; width:140px; height:3px; margin:8px 0 2px; border-radius:3px; overflow:hidden; background:rgba(181,99,122,.14); }
.idd-ps-3d-wait__bar i { position:absolute; top:0; bottom:0; left:0; width:40%; border-radius:3px; background:linear-gradient(90deg, transparent, #B5637A, transparent); animation:idd-ps-bar 1.3s ease-in-out infinite; will-change:transform; }
.idd-ps-3d-wait__slow { margin:10px 0 0; padding:10px 14px; border-radius:12px; background:rgba(255,255,255,.78); box-shadow:0 1px 0 rgba(181,99,122,.12) inset, 0 6px 18px rgba(90,40,55,.08); font-family:'DM Sans', system-ui, sans-serif; font-size:13.5px; line-height:1.45; color:#5A464D; }
.idd-ps-3d-wait__slow[hidden], .idd-ps-3d-wait__actions[hidden] { display:none !important; }
.idd-ps-3d-wait__actions { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:12px; }
.idd-ps-3d-wait__btn { display:inline-flex; align-items:center; gap:8px; min-height:46px; padding:10px 20px; border-radius:999px; border:1px solid rgba(133,63,85,.28); background:#fff; color:#853F55; font:600 15px/1 'DM Sans', system-ui, sans-serif; cursor:pointer; }
.idd-ps-3d-wait__btn.is-primary { border-color:transparent; background:linear-gradient(135deg, #B05A72 0%, #853F55 100%); color:#fff; box-shadow:0 8px 22px rgba(133,63,85,.32); }
.idd-ps-3d-wait__btn:focus-visible { outline:3px solid rgba(181,99,122,.45); outline-offset:2px; }
.idd-ps-3d-loader.is-error .idd-ps-3d-wait__bar, .idd-ps-3d-loader.is-error .idd-ps-3d-wait__ring { display:none; }
.idd-ps-3d-loader.is-error .idd-ps-3d-wait__step { color:#8A2E45; font-weight:600; }
/* Pendant l'attente : l'en-tête (titre + croix) reste lisible et cliquable sur le fond clair */
.idd-ps-3d-overlay.is-loading3d .idd-ps-3d-topbar { z-index:7; background:none; color:#3B2A30; }
.idd-ps-3d-overlay.is-loading3d .idd-ps-3d-close { background:rgba(133,63,85,.08); border-color:rgba(133,63,85,.2); color:#853F55; }
/* Reconstruction (style, lieu, chaises…) : carte claire avec la bague */
.idd-ps-3d-loading__card { background:rgba(255,253,251,.96); color:#3B2A30; box-shadow:0 18px 40px rgba(20,8,12,.28); }
.idd-ps-3d-loading__ring { display:block; width:40px; height:56px; }
.idd-ps-3d-ring { position:relative; }
.idd-ps-3d-ring img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.idd-ps-3d-ring__still { opacity:.16; }
.idd-ps-3d-loading__bar { background:rgba(181,99,122,.14); }
.idd-ps-3d-loading__bar i { background:linear-gradient(90deg, #9E4D64, #E8B7C4); }
@media (max-width: 768px) {
    .idd-ps-3d-loader { padding:64px 16px calc(20px + env(safe-area-inset-bottom, 0px)); font-size:inherit; }
    .idd-ps-3d-wait__title { font-size:23px; }
    .idd-ps-3d-wait__ring { width:56px; height:78px; }
}
@media (prefers-reduced-motion: reduce) { .idd-ps-3d-loader { transition:none; } .idd-ps-3d-wait__bar i { animation-duration:2.6s; } }

/* ==========================================================
   Menu clic droit / appui long (octobre 2026).
   Souris : petite carte à l'endroit du clic. Doigt ou petit écran : volet du bas, gros boutons.
   ========================================================== */
.idd-ps-ctx-menu { position: fixed; inset: 0 auto auto 0; z-index: 100000; font-family: var(--font-sans, 'DM Sans', system-ui, sans-serif); }
.idd-ps-ctx-box {
    position: fixed;
    min-width: 230px;
    max-width: min(320px, calc(100vw - 16px));
    background: var(--wp-surface, #fff);
    border: 1px solid var(--wp-line, #EDE0E4);
    border-radius: var(--radius-sm, 10px);
    box-shadow: var(--shadow-lg, 0 18px 48px rgba(29,24,25,.11));
    padding: 6px;
    font-size: 14px;
    color: var(--wp-ink, #1D1819);
    user-select: none;
    animation: idd-ps-ctx-in .12s ease;
}
@keyframes idd-ps-ctx-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.idd-ps-ctx-title {
    padding: 6px 10px 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--wp-muted, #7A6A6F);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.idd-ps-ctx-item {
    display: flex; align-items: center; gap: 10px;
    width: 100%; min-height: 36px; padding: 7px 10px;
    background: transparent; border: 0; border-radius: var(--radius-xs, 6px);
    cursor: pointer; text-align: left; color: inherit; font: inherit;
}
.idd-ps-ctx-item:hover,
.idd-ps-ctx-item:focus-visible { background: var(--wp-brand-soft, rgba(181,99,122,.09)); outline: none; }
.idd-ps-ctx-item:focus-visible { box-shadow: inset 0 0 0 2px var(--wp-brand, #9E4D64); }
.idd-ps-ctx-item.is-danger { color: var(--wp-danger-text, #991B1B); }
.idd-ps-ctx-item.is-danger:hover,
.idd-ps-ctx-item.is-danger:focus-visible { background: var(--wp-danger-bg, rgba(239,68,68,.10)); }
.idd-ps-ctx-icon { width: 20px; display: inline-flex; align-items: center; justify-content: center; color: var(--wp-soft, #6E5A60); flex-shrink: 0; }
.idd-ps-ctx-item.is-danger .idd-ps-ctx-icon { color: inherit; }
.idd-ps-ctx-label { flex: 1; }
.idd-ps-ctx-sep { height: 1px; background: var(--wp-line, #EDE0E4); margin: 4px 6px; }
.idd-ps-ctx-backdrop, .idd-ps-ctx-cancel { display: none; }

.idd-ps-ctx-menu.is-sheet { inset: 0; }
.idd-ps-ctx-menu.is-sheet .idd-ps-ctx-backdrop { display: block; position: absolute; inset: 0; background: rgba(29,24,25,.35); animation: idd-ps-fade .15s ease; }
@keyframes idd-ps-fade { from { opacity: 0; } to { opacity: 1; } }
.idd-ps-ctx-menu.is-sheet .idd-ps-ctx-box {
    left: 0; right: 0; bottom: 0; top: auto;
    max-width: none; min-width: 0;
    max-height: 80vh; overflow-y: auto;
    border-radius: var(--radius-lg, 22px) var(--radius-lg, 22px) 0 0;
    padding: 8px 12px calc(12px + env(safe-area-inset-bottom, 0px));
    font-size: 16px;
    animation: idd-ps-sheet-in .2s cubic-bezier(.2,.8,.2,1);
}
@keyframes idd-ps-sheet-in { from { transform: translateY(100%); } to { transform: none; } }
.idd-ps-ctx-menu.is-sheet .idd-ps-ctx-box::before { content: ''; display: block; width: 42px; height: 4px; margin: 0 auto 6px; border-radius: 2px; background: var(--wp-line-strong, #DECFD5); }
.idd-ps-ctx-menu.is-sheet .idd-ps-ctx-title { text-align: center; font-size: 12px; padding: 4px 10px 8px; }
.idd-ps-ctx-menu.is-sheet .idd-ps-ctx-item { min-height: var(--tap-target, 44px); padding: 10px 12px; }
.idd-ps-ctx-menu.is-sheet .idd-ps-ctx-cancel {
    display: block; width: 100%; min-height: var(--tap-target, 44px); margin-top: 8px;
    border: 1px solid var(--wp-line-strong, #DECFD5); border-radius: var(--radius-full, 9999px);
    background: var(--wp-surface, #fff); color: var(--wp-ink, #1D1819); font: inherit; font-weight: 600; cursor: pointer;
}
/* Pas de loupe ni de menu « copier l'image » du téléphone pendant un appui long sur le plan */
.idd-ps-root .canvas-container, .idd-ps-root .canvas-container canvas { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }

/* ==========================================================
   Panneau « Outils du plan » rangé en rubriques repliables (octobre 2026)
   ========================================================== */
.idd-ps-add-cta {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    width: 100%; min-height: var(--tap-target, 44px); margin: 0 0 14px;
    border: 0; border-radius: var(--radius-full, 9999px);
    background: var(--wp-brand, #9E4D64); color: #fff;
    font: inherit; font-size: 15px; font-weight: 600; cursor: pointer;
    box-shadow: var(--shadow-sm, 0 3px 12px rgba(29,24,25,.07));
}
.idd-ps-add-cta:hover { background: var(--wp-brand-dark, #853F55); }
.idd-ps-add-cta:focus-visible { outline: 2px solid var(--wp-brand-dark, #853F55); outline-offset: 2px; }
.idd-ps-add-cta svg { width: 18px; height: 18px; }
@media (min-width: 1440px) { .idd-ps-add-cta { display: none; } }

.idd-ps-acc-list .idd-ps-acc { margin: 0 0 8px; border: 1px solid var(--wp-line, #EDE0E4); border-radius: var(--radius-sm, 10px); background: var(--wp-surface, #fff); }
.idd-ps-acc-list .idd-ps-acc[hidden] { display: none; }
.idd-ps-acc[open] { border-color: var(--wp-line-strong, #DECFD5); box-shadow: var(--shadow-xs, 0 1px 4px rgba(29,24,25,.06)); }
.idd-ps-acc__head {
    display: grid;
    grid-template-columns: 22px 1fr 18px;
    grid-template-areas: "icon title chev" "icon sub chev";
    align-items: center;
    column-gap: 12px;
    min-height: var(--tap-target, 44px);
    padding: 10px 12px;
    cursor: pointer;
    list-style: none;
    border-radius: var(--radius-sm, 10px);
}
.idd-ps-acc__head::-webkit-details-marker { display: none; }
.idd-ps-acc__head:hover { background: var(--wp-surface-2, #FAF5F3); }
.idd-ps-acc__head:focus-visible { outline: 2px solid var(--wp-brand, #9E4D64); outline-offset: -2px; }
.idd-ps-acc__icon { grid-area: icon; width: 20px; height: 20px; color: var(--wp-brand, #9E4D64); }
.idd-ps-acc__title { grid-area: title; font-size: 15px; font-weight: 600; color: var(--wp-ink, #1D1819); line-height: 1.25; }
.idd-ps-acc__count { font-weight: 500; color: var(--wp-muted, #7A6A6F); font-size: 13px; }
.idd-ps-acc__sub { grid-area: sub; font-size: 12px; color: var(--wp-muted, #7A6A6F); line-height: 1.3; margin-top: 1px; }
.idd-ps-acc__sub:empty { display: none; }
.idd-ps-acc__chev { grid-area: chev; width: 18px; height: 18px; color: var(--wp-muted, #7A6A6F); transition: transform .2s ease; }
.idd-ps-acc[open] .idd-ps-acc__chev { transform: rotate(180deg); }
.idd-ps-acc__body { padding: 4px 12px 12px; }
.idd-ps-acc__body > .idd-tool-panel__hint:first-child { margin-top: 0; }
.idd-ps-acc__body .idd-ps-room-dims { margin-bottom: 10px; }

/* Liste « Éléments du plan » : nom = bouton (sélectionner), crayon (modifier), œil, corbeille ; cibles assez grandes au doigt */
.idd-ps-layers { max-height: 360px; }
button.idd-ps-layer__name { appearance: none; background: transparent; border: 0; padding: 6px 2px; text-align: left; font: inherit; font-size: 13px; font-weight: 500; min-width: 0; }
.idd-ps-layer__edit {
    flex-shrink: 0; width: 32px; height: 32px; padding: 6px;
    background: transparent; border: 1px solid transparent; border-radius: var(--radius-xs, 6px);
    color: var(--wp-soft, #6E5A60); cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.idd-ps-layer__edit:hover { background: var(--wp-brand-soft, rgba(181,99,122,.09)); color: var(--wp-brand, #9E4D64); }
.idd-ps-layer__edit svg { width: 16px; height: 16px; }
.idd-ps-layer__eye, .idd-ps-layer__delete { width: 32px; height: 32px; }
@media (pointer: coarse) {
    .idd-ps-layer__eye, .idd-ps-layer__delete, .idd-ps-layer__edit { width: 40px; height: 40px; }
    button.idd-ps-layer__name { min-height: 40px; }
}

/* Bandeau d'outil (mesure, fil lumineux…) : bouton « Terminé » et croix assez grands pour le doigt */
.idd-ps-tool-indicator {
    left: 0; right: 0; margin-inline: auto; transform: none;
    width: fit-content; max-width: calc(100vw - 24px); box-sizing: border-box;
    border-radius: var(--radius-md, 16px); line-height: 1.35;
}
.idd-ps-tool-indicator > span { min-width: 0; flex: 1 1 auto; }
.idd-ps-tool-indicator button { width: 32px; height: 32px; flex-shrink: 0; }
.idd-ps-tool-indicator .idd-ps-tool-indicator__done {
    width: auto; height: 34px; padding: 0 14px; border-radius: var(--radius-full, 9999px);
    background: var(--wp-surface, #fff); color: var(--wp-ink, #1D1819); font: inherit; font-weight: 700; font-size: 13px;
}
.idd-ps-tool-indicator .idd-ps-tool-indicator__done[hidden] { display: none; }

/* ==========================================================
   Bibliothèque d'objets (octobre 2026), comme l'aménagement extérieur :
   ≥ 1440 px : ancrée à droite en permanence (grille « outils | plan | bibliothèque ») ;
   1024-1439 px : tiroir (à 1280 px, avec le menu du site à gauche, le plan serait trop étroit) qui glisse depuis la droite (bouton « Objets ») ; < 1024 px : volet du bas (thème).
   ========================================================== */
.is-search-hidden { display: none !important; }
.idd-ps-root { --ps-lib-w: 300px; }
@media (min-width: 1280px) and (max-width: 1439px) {
    .idd-ps-root .idd-tool-toolbar__btn--library { display: inline-flex !important; }
}
@media (min-width: 1440px) {
    .idd-ps-root {
        grid-template-columns: var(--am-tools-w) 1fr var(--ps-lib-w);
        grid-template-areas: "tools workspace library";
        --idd-tb-offset-x: calc((var(--am-tools-w) - var(--ps-lib-w)) / 2);
    }
    .idd-ps-root.is-tools-collapsed { grid-template-columns: 0 1fr var(--ps-lib-w); --idd-tb-offset-x: calc(var(--ps-lib-w) / -2); }
    .idd-ps-root .idd-tool-panel.idd-tool-panel--library {
        grid-area: library;
        border-right: 0;
        border-left: 1px solid var(--wp-line, #EDE0E4);
        margin-left: 0;
    }
    .idd-ps-root.is-tools-collapsed .idd-tool-panel.idd-tool-panel--library { margin-left: 0; opacity: 1; pointer-events: auto; }
    /* Le panneau « Modifier » (à droite, 320 px) passe par-dessus la bibliothèque : le plan ne se pousse que du surplus */
    .idd-ps-root.idd-ps-appearance-open .idd-ps-editor { padding-right: calc(320px - var(--ps-lib-w)); }
}
@media (min-width: 1024px) and (max-width: 1439px) {
    .idd-ps-root .idd-tool-panel.idd-tool-panel--library {
        grid-area: auto;
        position: fixed !important;
        top: calc(var(--app-header-h, 60px) + var(--app-adminbar-h, 0px)) !important;
        right: 0 !important;
        left: auto !important;
        bottom: calc(80px + env(safe-area-inset-bottom, 0px)) !important;
        width: 340px !important;
        height: auto !important;
        max-height: none;
        transform: translateX(105%) !important;
        visibility: hidden !important;
        transition: transform .25s ease, visibility .25s ease;
        border-left: 1px solid var(--wp-line, #EDE0E4);
        border-right: 0;
        box-shadow: -18px 0 40px -12px rgba(29,24,25,.22) !important;
        z-index: 60;
        margin-left: 0;
        opacity: 1;
        pointer-events: auto;
    }
    body.is-idd-tb-library-open .idd-ps-root .idd-tool-panel.idd-tool-panel--library {
        transform: none !important;
        visibility: visible !important;
    }
    .idd-ps-root .idd-tool-panel--library .idd-tool-panel__close { display: inline-flex !important; }
}
@media (min-width: 1024px) {
    .idd-ps-root.is-list .idd-tool-panel--library { display: none !important; }
}

/* Pendant un tracé (fil lumineux, mesure, forme) : les étiquettes de dimensions laissent passer le clic jusqu'au plan */
.idd-ps-root.is-tool-active .idd-ps-dims-overlay,
.idd-ps-root.is-tool-active .idd-ps-dim-badge { pointer-events: none !important; }