.onsa-preferences-page{
    max-width:1400px;
    margin:auto;
    padding:0 30px;
}

/* Masonry */
.onsa-preferences {
    column-width: 340px;
    column-gap: 24px;
}

/* Le formulaire devient le conteneur Masonry */
.onsa-preferences form{
    columns: 360px;
    column-gap:24px;
}

/* Chaque thématique devient une carte */
.onsa-pref-theme{
    display:inline-block;
    width:100%;
    margin:0 0 24px;
    break-inside:avoid;

    background:#fff;
    border:1px solid #e6e6e6;
    border-radius:14px;
    padding:20px;
    box-sizing:border-box;

    box-shadow:0 2px 10px rgba(0,0,0,.05);
    transition:.2s;
}


.onsa-pref-theme:hover{
    box-shadow:0 8px 24px rgba(0,0,0,.08);
}

.onsa-pref-theme{
    transition:
        transform .18s ease,
        box-shadow .18s ease;
}

.onsa-pref-theme:hover{
    transform:translateY(-2px);
}



.onsa-pref-theme h2{
    margin:0 0 16px;
    padding-bottom:12px;
    border-bottom:1px solid #ececec;
    color:#263238;
    font-weight:700;
}

.onsa-pref-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.onsa-pref-item{
    display:flex;
    align-items:center;
    gap:12px;

    padding:6px 0;
}

.onsa-pref-item input[type="checkbox"]{
    margin:0;
    width:18px;
    height:18px;
    flex-shrink:0;
}

.onsa-pref-item span{
    font-size:1rem;      /* 16px */
    font-weight:500;
    line-height:1.45;
    color:#37474f;
}


/* Titre */
.onsa-pref-title{
    display:flex;
    align-items:center;
    gap:14px;

    margin:0 0 18px;
    padding-bottom:14px;

    border-bottom:1px solid #ececec;

    color:#263238;
    font-weight:700;
}

/* Cercle de l'icône */
.onsa-pref-icon{
    width:46px;
    height:46px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;
    background:#f4f8fb;

    flex-shrink:0;
}

/* SVG */
.onsa-pref-icon img{
    width:24px;
    height:24px;
}



.onsa-save-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:12px;

    min-width:320px;
    height:56px;

    padding:0 28px;

    background:#fff;
    color:#007f99;

    border:2px solid #007f99;
    border-radius:12px;

    font-size:1rem;
    font-weight:600;
    letter-spacing:.2px;

    cursor:pointer;

    transition:
        background .2s ease,
        color .2s ease,
        border-color .2s ease,
        transform .15s ease,
        box-shadow .2s ease;
}

.onsa-save-button:hover{
    background:#007f99;
    color:#fff;

    box-shadow:0 8px 18px rgba(0,127,153,.20);

    transform:translateY(-1px);
}

.onsa-save-button:active{
    transform:translateY(0);
}

.onsa-save-button:focus-visible{
    outline:none;
    box-shadow:
        0 0 0 4px rgba(0,127,153,.18);
}
