.sqelm-sel {
    --sqelm-sel-plan-l: 42%;
    --sqelm-sel-ratio: 1.33;
    --sqelm-sel-etapes: 56px;
    --sqelm-sel-r: 6px;
    --sqelm-sel-accent: #3F5B5E;
    --sqelm-sel-accent-txt: #FFFFFF;
    --sqelm-sel-doux-fond: #F4F2EC;
    --sqelm-sel-choisi: #F7F6F1;
    --sqelm-sel-carte: #FFFFFF;
    --sqelm-sel-ligne: #CFCBB5;
    --sqelm-sel-ligne-int: #E2DFD2;
    --sqelm-sel-texte: #1B1B1B;
    --sqelm-sel-doux: #55524A;
    --sqelm-sel-btn: #A8A26C;
    --sqelm-sel-btn-txt: #1B1B1B;
    display: flex;
    flex-direction: column;
    gap: var(--sqelm-sel-etapes);
    width: 100%;
    color: var(--sqelm-sel-texte);
    font-variant-numeric: tabular-nums;
}

.sqelm-sel__bloc {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.sqelm-sel .sqelm-sel__etape {
    margin: 0;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    color: var(--sqelm-sel-texte);
}

.sqelm-sel__etape-num {
    margin-right: 10px;
    color: var(--sqelm-sel-accent);
}

.sqelm-sel .sqelm-sel__compte,
.sqelm-sel .sqelm-sel__aide-m,
.sqelm-sel .sqelm-sel__resume {
    margin: -8px 0 0;
    font-size: 14px;
    line-height: 1.45;
    color: var(--sqelm-sel-doux);
}

.sqelm-sel .sqelm-sel__aide-m,
.sqelm-sel .sqelm-sel__resume,
.sqelm-sel__carte-prix-m,
.sqelm-sel .sqelm-sel__mliste {
    display: none;
}

/* ---------- Step 1: format cards ---------- */
.sqelm-sel__cartes {
    display: flex;
    gap: 12px;
}

.sqelm-sel button.sqelm-sel__carte {
    flex: 1 1 0;
    min-width: 0;
    display: grid;
    grid-template-columns: 104px minmax(0, 1fr);
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--sqelm-sel-ligne);
    border-radius: var(--sqelm-sel-r);
    background: var(--sqelm-sel-carte);
    color: var(--sqelm-sel-texte);
    font: inherit;
    text-align: left;
    text-transform: none;
    letter-spacing: normal;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.sqelm-sel button.sqelm-sel__carte:hover {
    border-color: var(--sqelm-sel-accent);
    background: var(--sqelm-sel-carte);
    color: var(--sqelm-sel-texte);
}

/* Chosen: thicker border drawn inside, so nothing moves */
.sqelm-sel button.sqelm-sel__carte[aria-selected="true"] {
    border-color: var(--sqelm-sel-accent);
    box-shadow: inset 0 0 0 1px var(--sqelm-sel-accent);
}

.sqelm-sel button.sqelm-sel__carte:focus-visible {
    outline: 2px solid var(--sqelm-sel-texte);
    outline-offset: 3px;
}

.sqelm-sel .sqelm-sel__pieces {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    background: var(--sqelm-sel-doux-fond);
    color: var(--sqelm-sel-accent);
    font-size: 36px;
    font-weight: 300;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.sqelm-sel__carte[aria-selected="true"] .sqelm-sel__pieces {
    background: var(--sqelm-sel-accent);
    color: var(--sqelm-sel-accent-txt);
}

.sqelm-sel__carte-corps {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
    padding: 22px 24px;
}

.sqelm-sel .sqelm-sel__carte-nom {
    font-size: 28px;
    font-weight: 300;
    line-height: 1.05;
}

.sqelm-sel .sqelm-sel__specs {
    display: grid;
    grid-template-columns: repeat(3, auto);
    justify-content: start;
    gap: 2px 22px;
    font-size: 14px;
    line-height: 1.4;
}

.sqelm-sel__spec-lib {
    font-size: 12px;
    color: var(--sqelm-sel-doux);
}

.sqelm-sel__spec-dispo {
    font-weight: 500;
    color: var(--sqelm-sel-accent);
}

/* ---------- Step 2: list next to the plan ---------- */
.sqelm-sel__panneau {
    display: flex;
    gap: 32px;
    align-items: flex-start;
}

.sqelm-sel__panneau[hidden] {
    display: none !important;
}

.sqelm-sel__liste {
    flex: 1 1 0;
    min-width: 0;
}

.sqelm-sel__table-cadre {
    border: 1px solid var(--sqelm-sel-ligne);
    border-radius: var(--sqelm-sel-r);
    overflow: hidden;
    background: var(--sqelm-sel-carte);
}

.sqelm-sel .sqelm-sel__table {
    width: 100%;
    margin: 0;
    border: 0;
    border-collapse: collapse;
    font-size: 15px;
    line-height: 1.4;
}

.sqelm-sel .sqelm-sel__table th,
.sqelm-sel .sqelm-sel__table td {
    padding: 12px 16px;
    border: 0;
    background: none;
    text-align: left;
    vertical-align: middle;
}

.sqelm-sel .sqelm-sel__table thead th,
.sqelm-sel .sqelm-sel__table thead td {
    padding-top: 10px;
    padding-bottom: 10px;
    background: var(--sqelm-sel-doux-fond);
    font-size: 12px;
    font-weight: 500;
    color: var(--sqelm-sel-doux);
}

.sqelm-sel .sqelm-sel__table tbody tr {
    border-top: 1px solid var(--sqelm-sel-ligne-int);
    background: none;
    cursor: pointer;
}

.sqelm-sel .sqelm-sel__table tbody tr.is-actif {
    background: var(--sqelm-sel-choisi);
    box-shadow: inset 3px 0 0 var(--sqelm-sel-accent);
}

.sqelm-sel .sqelm-sel__table tbody tr.is-indispo {
    color: var(--sqelm-sel-doux);
}

.sqelm-sel .sqelm-sel__num {
    font-size: 17px;
    font-weight: 500;
}

.sqelm-sel .sqelm-sel__loyer {
    font-weight: 500;
    white-space: nowrap;
}

.sqelm-sel button.sqelm-sel__choisir {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    text-transform: none;
    letter-spacing: normal;
    cursor: pointer;
}

.sqelm-sel button.sqelm-sel__choisir:hover,
.sqelm-sel button.sqelm-sel__choisir:focus {
    background: none;
    color: inherit;
}

.sqelm-sel button.sqelm-sel__choisir:focus-visible {
    outline: 2px solid var(--sqelm-sel-texte);
    outline-offset: 3px;
}

.sqelm-sel .sqelm-sel__table td.sqelm-sel__actions {
    padding-top: 8px;
    padding-bottom: 8px;
    text-align: right;
    white-space: nowrap;
}

.sqelm-sel a.sqelm-sel__pdf {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    margin-right: 16px;
    color: var(--sqelm-sel-texte);
    font-size: 14px;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.sqelm-sel a.sqelm-sel__demander {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 20px;
    border-radius: var(--sqelm-sel-r);
    background: var(--sqelm-sel-btn);
    color: var(--sqelm-sel-btn-txt);
    font-size: 14px;
    text-decoration: none;
}

.sqelm-sel a.sqelm-sel__demander:hover {
    color: var(--sqelm-sel-btn-txt);
    filter: brightness(0.95);
}

.sqelm-sel a.sqelm-sel__pdf:focus-visible,
.sqelm-sel a.sqelm-sel__demander:focus-visible {
    outline: 2px solid var(--sqelm-sel-texte);
    outline-offset: 3px;
}

.sqelm-sel__statut {
    display: inline-flex;
    padding: 4px 10px;
    border-radius: var(--sqelm-sel-r);
    border: 1px solid var(--sqelm-sel-ligne);
    font-size: 13px;
    white-space: nowrap;
}

.sqelm-sel__statut--disponible {
    border-color: var(--sqelm-sel-accent);
    background: var(--sqelm-sel-accent);
    color: var(--sqelm-sel-accent-txt);
}

.sqelm-sel__vide {
    padding: 32px;
    border: 1px solid var(--sqelm-sel-ligne);
    border-radius: var(--sqelm-sel-r);
}

.sqelm-sel__vide p {
    margin: 0 0 20px;
    font-size: 17px;
    line-height: 1.6;
}

/* ---------- Plan: title above, drawing, strip below ---------- */
.sqelm-sel .sqelm-sel__plan {
    position: sticky;
    top: 24px;
    flex: 0 0 var(--sqelm-sel-plan-l);
    min-width: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.sqelm-sel .sqelm-sel__legende,
.sqelm-sel .sqelm-sel__legende * {
    font-style: normal; /* some themes set figcaption in italics */
}

.sqelm-sel .sqelm-sel__legende {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    gap: 4px 16px;
    margin: 0;
}

.sqelm-sel .sqelm-sel__plan-titre {
    font-size: 30px;
    font-weight: 300;
    line-height: 1.05;
}

.sqelm-sel .sqelm-sel__mention {
    font-size: 13px;
    line-height: 1.3;
    color: var(--sqelm-sel-doux);
}

.sqelm-sel__plan-boite {
    border: 1px solid var(--sqelm-sel-ligne);
    border-radius: var(--sqelm-sel-r);
    overflow: hidden;
    background: var(--sqelm-sel-carte);
}

/* All plans of the format are stacked; the chosen one fades in */
.sqelm-sel__plan-cadre {
    position: relative;
    aspect-ratio: var(--sqelm-sel-ratio);
    background: #FFFFFF;
}

.sqelm-sel-pointille-yes .sqelm-sel .sqelm-sel__plan-cadre::after {
    content: "";
    position: absolute;
    inset: 8px;
    z-index: 1;
    border: 1px dashed #D4D0C2;
    border-radius: 4px;
    pointer-events: none;
}

.sqelm-sel .sqelm-sel__plan-img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    padding: 14px;
    box-sizing: border-box;
    object-fit: contain;
    border-radius: 0;
    opacity: 0;
    transition: opacity 0.25s ease;
}

.sqelm-sel .sqelm-sel__plan-img.is-actif {
    opacity: 1;
}

.sqelm-sel .sqelm-sel__fiche {
    display: none;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0;
    border-top: 1px solid var(--sqelm-sel-ligne);
}

.sqelm-sel-fiche-yes .sqelm-sel .sqelm-sel__fiche {
    display: grid;
}

.sqelm-sel .sqelm-sel__fiche > div {
    padding: 12px 14px;
    border-left: 1px solid var(--sqelm-sel-ligne);
}

.sqelm-sel .sqelm-sel__fiche > div:first-child {
    border-left: 0;
}

.sqelm-sel .sqelm-sel__fiche dt {
    margin: 0;
    font-size: 12px;
    font-weight: 400;
    color: var(--sqelm-sel-doux);
}

.sqelm-sel .sqelm-sel__fiche dd {
    margin: 4px 0 0;
    font-size: 15px;
    font-weight: 500;
}

.sqelm-sel__sr {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.sqelm-sel__aide {
    padding: 24px;
    border: 1px dashed #C4C4C4;
    text-align: center;
    font-size: 14px;
    color: #666666;
}

/* ---------- Tablet: cards stay side by side, a bit tighter ---------- */
@media (max-width: 1024px) {
    .sqelm-sel button.sqelm-sel__carte {
        grid-template-columns: 76px minmax(0, 1fr);
    }
    .sqelm-sel .sqelm-sel__pieces {
        font-size: 28px;
    }
    .sqelm-sel__carte-corps {
        padding: 16px 18px;
    }
    .sqelm-sel .sqelm-sel__carte-nom {
        font-size: 22px;
    }
    .sqelm-sel .sqelm-sel__specs {
        grid-template-columns: auto;
        grid-auto-flow: row;
        gap: 0;
    }
    .sqelm-sel__spec-lib {
        display: none;
    }
}

/* ---------- Phone: three tiles, then a simple list that opens in place ---------- */
@media (max-width: 767px) {
    .sqelm-sel {
        --sqelm-sel-etapes: 32px;
    }
    .sqelm-sel__bloc {
        gap: 12px;
    }
    .sqelm-sel__cartes {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
    }
    .sqelm-sel button.sqelm-sel__carte {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 14px 6px 12px;
        text-align: center;
    }
    .sqelm-sel button.sqelm-sel__carte[aria-selected="true"] {
        background: var(--sqelm-sel-accent);
        color: var(--sqelm-sel-accent-txt);
    }
    .sqelm-sel .sqelm-sel__pieces,
    .sqelm-sel__carte[aria-selected="true"] .sqelm-sel__pieces {
        padding: 0;
        background: none;
        color: inherit;
        font-size: 30px;
    }
    .sqelm-sel__carte-corps {
        align-items: center;
        gap: 6px;
        padding: 6px 0 0;
    }
    .sqelm-sel .sqelm-sel__carte-nom {
        font-size: 13px;
        font-weight: 400;
        line-height: 1.2;
    }
    .sqelm-sel .sqelm-sel__specs {
        display: none;
    }
    .sqelm-sel__carte-prix-m {
        display: block;
        font-size: 12px;
        opacity: 0.8;
    }
    .sqelm-sel .sqelm-sel__resume,
    .sqelm-sel .sqelm-sel__aide-m {
        display: block;
        margin-top: -2px;
    }
    .sqelm-sel .sqelm-sel__compte,
    .sqelm-sel__table-cadre {
        display: none;
    }
    .sqelm-sel__panneau {
        display: block;
    }
    .sqelm-sel__panneau > .sqelm-sel__plan {
        display: none; /* shown inside the opened apartment instead */
    }

    .sqelm-sel .sqelm-sel__mliste {
        display: block;
        margin: 0;
        padding: 0;
        list-style: none;
        border-bottom: 1px solid var(--sqelm-sel-ligne);
    }
    .sqelm-sel .sqelm-sel__mliste > li {
        margin: 0;
        border-top: 1px solid var(--sqelm-sel-ligne);
    }
    .sqelm-sel button.sqelm-sel__mligne {
        display: grid;
        grid-template-columns: 60px minmax(0, 1fr) auto 16px;
        gap: 12px;
        align-items: center;
        width: 100%;
        min-height: 64px;
        margin: 0;
        padding: 0 4px;
        border: 0;
        background: none;
        color: var(--sqelm-sel-texte);
        font: inherit;
        text-align: left;
        text-transform: none;
        letter-spacing: normal;
        cursor: pointer;
    }
    .sqelm-sel button.sqelm-sel__mligne:hover,
    .sqelm-sel button.sqelm-sel__mligne:focus {
        background: none;
        color: var(--sqelm-sel-texte);
    }
    .sqelm-sel button.sqelm-sel__mligne:focus-visible {
        outline: 2px solid var(--sqelm-sel-texte);
        outline-offset: -2px;
    }
    .sqelm-sel .sqelm-sel__mligne .sqelm-sel__num {
        font-size: 20px;
    }
    .sqelm-sel .sqelm-sel__mdetail {
        font-size: 14px;
        color: var(--sqelm-sel-doux);
    }
    .sqelm-sel__chevron {
        display: flex;
        color: var(--sqelm-sel-doux);
        transition: transform 0.2s ease;
    }
    .sqelm-sel__mligne[aria-expanded="true"] .sqelm-sel__num {
        color: var(--sqelm-sel-accent);
    }
    .sqelm-sel__mligne[aria-expanded="true"] .sqelm-sel__chevron {
        color: var(--sqelm-sel-accent);
        transform: rotate(90deg);
    }
    .sqelm-sel .sqelm-sel__mliste > li.is-indispo .sqelm-sel__mligne {
        color: var(--sqelm-sel-doux);
    }
    .sqelm-sel__ouvert {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding: 4px 0 24px;
    }
    .sqelm-sel__ouvert[hidden] {
        display: none;
    }
    .sqelm-sel__fente .sqelm-sel__plan {
        position: static;
        width: 100%;
    }
    .sqelm-sel__fente .sqelm-sel__plan-titre {
        font-size: 24px;
    }
    .sqelm-sel__fente .sqelm-sel__mention {
        font-size: 12px;
    }
    .sqelm-sel__fente .sqelm-sel__fiche dd {
        font-size: 14px;
    }
    .sqelm-sel__fente .sqelm-sel__fiche > div {
        padding: 10px 12px;
    }
    .sqelm-sel a.sqelm-sel__demander--m {
        min-height: 52px;
        font-size: 16px;
    }
    .sqelm-sel a.sqelm-sel__pdf--m {
        align-self: center;
        margin: 0;
        font-size: 15px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sqelm-sel button.sqelm-sel__carte,
    .sqelm-sel .sqelm-sel__pieces,
    .sqelm-sel .sqelm-sel__plan-img,
    .sqelm-sel__chevron {
        transition: none;
    }
}

.elementor-widget-sqelm-selecteur.elementor-invisible:not([data-settings]) {
    visibility: visible;
}
