#compte_identite {
display:flex;
flex-wrap:wrap;
align-items:center;
gap:18px;
background:linear-gradient(135deg, var(--marine) 0%, var(--marineClair) 100%);
border-radius:var(--rayon);
box-shadow:var(--ombre);
margin:0 0 26px;
padding:clamp(18px, 3vw, 28px)
}

#compte_pseudo {
text-transform:uppercase;
font-family:var(--fonteTitre);
font-size:clamp(22px, 3vw, 30px);
font-weight:700;
color:var(--blanc);
line-height:1.1;
margin:0
}

#compte_infos {
font-size:13px;
color:rgba(255,255,255,.65);
margin:4px 0 0
}

#compte_btnModifier { margin:0 0 0 auto }

.compte_groupeTitre {
text-transform:uppercase;
font-family:var(--fonteTitre);
font-size:18px;
font-weight:700;
letter-spacing:.06em;
color:var(--marine);
border-bottom:2px solid var(--or);
margin:26px 0 12px;
padding:0 0 6px
}

.compte_groupe {
display:grid;
grid-template-columns:repeat(3, minmax(0, 1fr));
gap:10px
}

.compte_lien {
display:flex;
align-items:center;
gap:12px;
background:var(--blanc);
border-radius:var(--rayonPetit);
box-shadow:var(--ombre);
text-decoration:none;
font-size:14px;
font-weight:700;
color:var(--marine);
transition:transform var(--transition), box-shadow var(--transition);
padding:15px 16px
}

.compte_lien:hover {
box-shadow:var(--ombreHaut);
transform:translateY(-3px)
}

.compte_lien > i:first-child {
width:22px;
text-align:center;
font-size:18px;
color:var(--or)
}

.compte_fleche {
font-size:12px;
color:var(--ligne);
margin:0 0 0 auto
}

.compte_lien:hover .compte_fleche { color:var(--or) }

.profil_champLarge { margin:18px 0 0 }

.profil_champLarge textarea {
width:100%;
background:var(--papier);
border:2px solid var(--ligne);
border-radius:var(--rayonPetit);
font-family:var(--fonteTexte);
font-size:15px;
color:var(--encre);
resize:vertical;
transition:border-color var(--transition), background var(--transition);
padding:12px 14px
}

.profil_champLarge textarea:focus {
outline:none;
background:var(--blanc);
border-color:var(--or)
}

#profil_form .auth_erreur { margin:18px 0 0 }

@media (max-width:760px) {
.compte_groupe {
	grid-template-columns:1fr
}

#compte_btnModifier {
	width:100%;
	margin:0
}
}

.avatar_ami {
width:52px;
border:2px solid var(--ligne);
font-size:22px;
flex-shrink:0
}

#amis_demandes, #amis_liste, #notifs_messages {
display:flex;
flex-direction:column;
gap:10px;
margin:0 0 26px
}

.ami_card {
display:flex;
flex-wrap:wrap;
align-items:center;
gap:14px;
background:var(--blanc);
border-radius:var(--rayonPetit);
box-shadow:var(--ombre);
transition:box-shadow var(--transition);
padding:14px 18px
}

.ami_card:hover { box-shadow:var(--ombreHaut) }

.ami_infos {
display:flex;
flex-direction:column;
gap:2px
}

.ami_pseudo {
text-decoration:none;
font-size:17px;
font-weight:700;
color:var(--marine)
}

.ami_pseudo:hover { color:var(--or) }

.ami_lieu {
display:flex;
align-items:center;
gap:6px;
font-size:12px;
color:var(--gris)
}

.ami_actions {
display:flex;
gap:8px;
margin:0 0 0 auto
}

.ami_actions .btn {
font-size:13px;
padding:7px 16px
}

.notif_ligne {
display:flex;
align-items:center;
gap:14px;
background:var(--blanc);
border-left:4px solid var(--or);
border-radius:0 var(--rayonPetit) var(--rayonPetit) 0;
box-shadow:var(--ombre);
text-decoration:none;
font-size:14px;
color:var(--encre);
transition:transform var(--transition);
padding:14px 18px
}

.notif_ligne:hover { transform:translateX(4px) }

.notif_ligne i {
font-size:18px;
color:var(--or)
}

.notif_ligne strong { color:var(--marine) }

.notif_ligne time {
font-size:12px;
color:var(--gris);
margin:0 0 0 auto
}

.vide_bloc {
display:flex;
flex-direction:column;
align-items:center;
gap:12px;
background:var(--blanc);
border:2px dashed var(--ligne);
border-radius:var(--rayon);
text-align:center;
padding:clamp(30px, 5vw, 50px)
}

.vide_icone {
font-size:46px;
color:var(--ligne)
}

.vide_titre {
text-transform:uppercase;
font-family:var(--fonteTitre);
font-size:22px;
font-weight:700;
color:var(--marine);
margin:0
}

.vide_texte {
max-width:440px;
font-size:14px;
color:var(--gris);
margin:0
}

@media (max-width:600px) {
.ami_actions {
	width:100%;
	margin:0
}

.ami_actions .btn {
	flex:1
}
}

.compte_retourLien {
display:inline-flex;
align-items:center;
gap:8px;
text-decoration:none;
font-size:14px;
font-weight:700;
color:var(--marine);
transition:color var(--transition);
margin:0 0 20px
}

.compte_retourLien:hover { color:var(--or) }

.avatar_photo {
aspect-ratio:1;
object-fit:cover;
border-radius:50%
}

.avatar_grand {
width:120px;
border:3px solid var(--or);
font-size:52px;
flex-shrink:0
}

.mediaEd {
display:flex;
flex-direction:column;
align-items:center;
gap:22px;
background:var(--blanc);
border-radius:var(--rayon);
box-shadow:var(--ombre);
padding:clamp(24px, 4vw, 40px)
}

.mediaEd_preview, .mediaEd_crop {
display:flex;
flex-direction:column;
align-items:center;
gap:18px;
width:100%
}

.mediaEd_coverImg {
width:100%;
aspect-ratio:3;
object-fit:cover;
border-radius:var(--rayonPetit)
}

.mediaEd_coverVide {
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:8px;
width:100%;
aspect-ratio:3;
background:var(--papier);
border:2px dashed var(--ligne);
border-radius:var(--rayonPetit);
font-size:14px;
color:var(--gris)
}

.mediaEd_coverVide i { font-size:36px; color:var(--ligne) }

.mediaEd_actions {
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:10px
}

.mediaEd_consigne {
font-size:14px;
color:var(--gris);
margin:0
}

.mediaEd_scene {
max-width:100%;
overflow:hidden;
background:var(--marineProfond);
border-radius:var(--rayonPetit);
box-shadow:inset 0 0 0 1px var(--ligne)
}

.mediaEd_canvas {
display:block;
max-width:100%;
touch-action:none;
cursor:grab
}

.mediaEd_canvas:active { cursor:grabbing }

.mediaEd_zoom {
display:flex;
align-items:center;
gap:12px;
width:min(320px, 100%);
color:var(--gris)
}

.mediaEd_zoom input {
flex:1;
accent-color:var(--or)
}

.mediaEd_msg {
width:100%;
background:#eaf7ec;
border-left:3px solid #3d9950;
border-radius:0 var(--rayonPetit) var(--rayonPetit) 0;
font-size:14px;
color:#2c7a3d;
margin:14px 0 0;
padding:10px 14px
}

.mediaEd_msg.estErreur {
background:#fdeaea;
border-left-color:#d64545;
color:#a92f2f
}

.mediaEd_statut {
display:flex;
align-items:center;
gap:10px;
border-radius:var(--rayonPetit);
font-size:14px;
font-weight:700;
margin:0 0 18px;
padding:12px 16px
}

.mediaEd_statutAttente {
background:#fff6e0;
color:#8a6d1a
}

.mediaEd_statutRefus {
background:#fdeaea;
color:#a92f2f
}

.decor_avantages {
display:grid;
grid-template-columns:repeat(2, minmax(0, 1fr));
gap:10px;
list-style:none;
max-width:520px;
margin:0;
padding:0
}

.decor_avantages li {
display:flex;
align-items:center;
gap:10px;
background:var(--papier);
border-radius:var(--rayonPetit);
text-align:left;
font-size:13px;
font-weight:700;
color:var(--marine);
padding:11px 14px
}

.decor_avantages i { color:var(--or) }

.decor_label {
display:block;
text-transform:uppercase;
font-family:var(--fonteTitre);
font-size:13px;
font-weight:600;
letter-spacing:.05em;
color:var(--marine);
margin:0 0 5px
}

.decor_aide {
font-size:12px;
color:var(--gris);
margin:6px 0 0
}

.decor_stadeChamp { position:relative }

.decor_stadeWrap {
position:relative;
display:flex;
align-items:center
}

.decor_stadeWrap input[type="text"] {
width:100%;
background:var(--papier);
border:2px solid var(--ligne);
border-radius:var(--rayonPetit);
font-family:var(--fonteTexte);
font-size:15px;
color:var(--encre);
transition:border-color var(--transition), background var(--transition);
padding:12px 44px 12px 14px
}

.decor_stadeWrap input[type="text"]:focus {
outline:none;
background:var(--blanc);
border-color:var(--or)
}

.decor_effacer {
position:absolute;
display:flex;
align-items:center;
justify-content:center;
width:30px;
height:30px;
background:var(--papier);
border:none;
border-radius:50%;
font-size:13px;
color:var(--gris);
cursor:pointer;
transition:background var(--transition), color var(--transition);
right:8px
}

.decor_effacer:hover {
background:var(--marine);
color:var(--blanc)
}

.decor_grilleCouleurs {
display:grid;
grid-template-columns:repeat(3, minmax(0, 1fr));
gap:12px
}

.decor_couleur {
display:flex;
align-items:center;
gap:12px;
background:var(--blanc);
border-radius:var(--rayonPetit);
box-shadow:var(--ombre);
font-size:14px;
font-weight:700;
color:var(--marine);
cursor:pointer;
padding:12px 14px
}

.decor_couleur input {
width:44px;
height:34px;
background:none;
border:none;
border-radius:6px;
cursor:pointer;
flex-shrink:0;
padding:0
}

.decor_grillePolices {
display:grid;
grid-template-columns:repeat(2, minmax(0, 1fr));
gap:14px
}

.decor_police select, .formInterne select {
width:100%;
background:var(--papier);
border:2px solid var(--ligne);
border-radius:var(--rayonPetit);
font-family:var(--fonteTexte);
font-size:15px;
color:var(--encre);
cursor:pointer;
transition:border-color var(--transition);
padding:11px 14px
}

.decor_police select:focus, .formInterne select:focus {
outline:none;
border-color:var(--or)
}

#decor_apercu {
border-radius:var(--rayon);
overflow:hidden;
box-shadow:var(--ombre)
}

#decor_apercuBandeau {
height:70px;
background:var(--marine)
}

#decor_apercuCorps {
background:var(--blanc);
border-top:4px solid var(--encre);
padding:20px 24px
}

#decor_apercuPseudo {
font-family:var(--fonteTitre);
font-size:24px;
font-weight:700;
text-transform:uppercase;
color:var(--marine);
margin:0 0 4px
}

#decor_apercuTitre {
font-size:16px;
font-weight:700;
color:var(--marine);
margin:0 0 4px
}

#decor_apercuInfos {
font-size:13px;
color:var(--gris);
margin:0
}

.decor_actions {
display:flex;
flex-wrap:wrap;
gap:10px;
margin:22px 0 0
}

.formInterne {
display:flex;
flex-direction:column;
gap:15px;
background:var(--blanc);
border-radius:var(--rayon);
box-shadow:var(--ombre);
padding:clamp(20px, 3.5vw, 32px)
}

.formInterne .auth_champ input, .formInterne .auth_champ textarea {
width:100%;
background:var(--papier);
border:2px solid var(--ligne);
border-radius:var(--rayonPetit);
font-family:var(--fonteTexte);
font-size:15px;
color:var(--encre);
transition:border-color var(--transition), background var(--transition);
padding:11px 14px
}

.formInterne .auth_champ input:focus, .formInterne .auth_champ textarea:focus {
outline:none;
background:var(--blanc);
border-color:var(--or)
}

.formInterne .auth_champ textarea { resize:vertical }

.form_deuxCol {
display:grid;
grid-template-columns:repeat(2, minmax(0, 1fr));
gap:14px
}

.form_troisCol { grid-template-columns:repeat(3, minmax(0, 1fr)) }

.visite_customToggle {
display:flex;
align-items:center;
gap:9px;
font-size:13px;
color:var(--gris);
cursor:pointer
}

.visite_customToggle input {
width:17px;
height:17px;
accent-color:var(--or)
}

#amis_stats {
display:flex;
gap:12px;
margin:0 0 8px
}

.amis_stat {
display:flex;
flex-direction:column;
align-items:center;
min-width:96px;
background:var(--blanc);
border-radius:var(--rayonPetit);
box-shadow:var(--ombre);
padding:12px 18px
}

.amis_stat strong {
font-family:var(--fonteTitre);
font-size:28px;
font-weight:700;
color:var(--or);
line-height:1
}

.amis_stat span {
text-transform:uppercase;
font-size:10px;
letter-spacing:.06em;
color:var(--gris);
margin:5px 0 0
}

.amis_badge {
display:inline-flex;
align-items:center;
justify-content:center;
min-width:24px;
height:24px;
background:var(--or);
border-radius:50%;
font-size:13px;
color:var(--marine);
margin:0 0 0 6px
}

#amis_outils {
display:flex;
flex-wrap:wrap;
align-items:center;
justify-content:space-between;
gap:12px;
margin:0 0 16px
}

#amis_rechercheWrap {
position:relative;
display:flex;
flex:1;
align-items:center;
min-width:220px;
max-width:380px
}

#amis_rechercheWrap i {
position:absolute;
font-size:14px;
color:var(--gris);
left:14px
}

#amis_recherche {
width:100%;
background:var(--blanc);
border:2px solid var(--ligne);
border-radius:100px;
font-family:var(--fonteTexte);
font-size:14px;
color:var(--encre);
transition:border-color var(--transition);
padding:10px 16px 10px 38px
}

#amis_recherche:focus {
outline:none;
border-color:var(--or)
}

#amis_tris {
display:flex;
gap:6px
}

.amis_tri {
display:inline-flex;
align-items:center;
gap:7px;
background:var(--blanc);
border:2px solid var(--ligne);
border-radius:100px;
text-transform:uppercase;
font-family:var(--fonteTitre);
font-size:13px;
font-weight:600;
color:var(--gris);
cursor:pointer;
transition:border-color var(--transition), color var(--transition);
padding:8px 16px
}

.amis_tri:hover { border-color:var(--or) }

.amis_tri.actif {
background:var(--marine);
border-color:var(--marine);
color:var(--blanc)
}

@media (max-width:760px) {
.decor_grilleCouleurs {
	grid-template-columns:1fr
}

.decor_grillePolices {
	grid-template-columns:1fr
}

.decor_avantages {
	grid-template-columns:1fr
}

.form_deuxCol, .form_troisCol {
	grid-template-columns:1fr
}

.voyage_entetePage {
	flex-direction:column;
	align-items:stretch
}

.voyage_boutons .btn {
	flex:1
}
}

#header_profilLien { position:relative }

#header_nonLus {
position:absolute;
display:flex;
align-items:center;
justify-content:center;
min-width:19px;
height:19px;
background:#e0393e;
border:2px solid var(--marine);
border-radius:100px;
font-size:11px;
font-weight:700;
color:var(--blanc);
top:-2px;
right:-6px;
padding:0 4px
}

#msg_layout {
position:relative;
display:grid;
grid-template-columns:340px 1fr;
min-height:520px;
overflow:hidden;
background:var(--blanc);
border-radius:var(--rayon);
box-shadow:var(--ombre)
}

#msg_colonne {
overflow-y:auto;
max-height:640px;
border-right:1px solid var(--ligne)
}

.msg_colonneTitre {
display:flex;
align-items:center;
gap:9px;
background:var(--papier);
text-transform:uppercase;
font-family:var(--fonteTitre);
font-size:14px;
font-weight:700;
letter-spacing:.05em;
color:var(--gris);
margin:0;
padding:12px 16px
}

.msg_colonneTitre i { color:var(--or) }

.msg_conv {
display:flex;
align-items:center;
gap:12px;
width:100%;
background:var(--blanc);
border:none;
border-bottom:1px solid var(--ligne);
text-align:left;
cursor:pointer;
transition:background var(--transition);
padding:12px 16px
}

.msg_conv:hover { background:var(--papier) }

.msg_conv.actif {
background:var(--papier);
box-shadow:inset 4px 0 0 var(--or)
}

.msg_convInfos {
display:flex;
flex:1;
flex-direction:column;
min-width:0;
gap:2px
}

.msg_convPseudo {
font-size:15px;
font-weight:700;
color:var(--marine)
}

.msg_convExtrait {
overflow:hidden;
font-size:12px;
color:var(--gris);
white-space:nowrap;
text-overflow:ellipsis
}

.msg_nonLus {
display:flex;
align-items:center;
justify-content:center;
min-width:22px;
height:22px;
background:#e0393e;
border-radius:100px;
font-size:12px;
font-weight:700;
color:var(--blanc);
flex-shrink:0;
padding:0 6px
}

#msg_tchat {
display:flex;
flex-direction:column;
max-height:640px
}

#msg_tchatEntete {
display:flex;
align-items:center;
gap:12px;
background:var(--marine);
padding:13px 18px
}

#msg_retourListe {
display:none;
align-items:center;
justify-content:center;
width:34px;
height:34px;
background:rgba(255,255,255,.12);
border:none;
border-radius:50%;
font-size:14px;
color:var(--blanc);
cursor:pointer
}

#msg_tchatPseudo {
text-transform:uppercase;
font-family:var(--fonteTitre);
font-size:19px;
font-weight:700;
color:var(--blanc);
margin:0
}

#msg_fil {
display:flex;
flex:1;
flex-direction:column;
gap:8px;
overflow-y:auto;
background:var(--papier);
padding:18px
}

.msg_jour {
align-self:center;
background:var(--blanc);
border-radius:100px;
font-size:11px;
text-transform:uppercase;
letter-spacing:.05em;
color:var(--gris);
margin:6px 0;
padding:4px 14px
}

.msg_bulle {
position:relative;
align-self:flex-start;
max-width:70%;
background:var(--blanc);
border-radius:14px 14px 14px 4px;
box-shadow:var(--ombre);
padding:9px 46px 9px 13px
}

.msg_bulleMoi {
align-self:flex-end;
background:var(--marine);
border-radius:14px 14px 4px 14px
}

.msg_bulleTexte {
font-size:14px;
color:var(--encre);
line-height:1.45;
margin:0
}

.msg_bulleMoi .msg_bulleTexte { color:var(--blanc) }

.msg_bulleHeure {
position:absolute;
font-size:10px;
color:var(--gris);
bottom:8px;
right:12px
}

.msg_bulleMoi .msg_bulleHeure { color:rgba(255,255,255,.6) }

.msg_filVide {
text-align:center;
font-size:14px;
color:var(--gris);
margin:auto
}

#msg_form {
display:flex;
gap:10px;
border-top:1px solid var(--ligne);
padding:12px 14px
}

#msg_texte {
flex:1;
background:var(--papier);
border:2px solid var(--ligne);
border-radius:100px;
font-family:var(--fonteTexte);
font-size:14px;
color:var(--encre);
transition:border-color var(--transition);
padding:10px 18px
}

#msg_texte:focus {
outline:none;
border-color:var(--or)
}

#msg_form .btn { padding:10px 20px }

#msg_placeholder {
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:12px;
color:var(--gris)
}

#msg_placeholder i {
font-size:52px;
color:var(--ligne)
}

#msg_placeholder p {
font-size:14px;
margin:0
}

#infog_outils {
display:flex;
align-items:center;
gap:14px;
margin:0 0 20px
}

#infog_outils .decor_label { margin:0 }

#infog_periode {
background:var(--blanc);
border:2px solid var(--ligne);
border-radius:var(--rayonPetit);
font-family:var(--fonteTexte);
font-size:15px;
color:var(--encre);
cursor:pointer;
padding:10px 14px
}

#infog_scene {
display:flex;
justify-content:center;
background:var(--blanc);
border-radius:var(--rayon);
box-shadow:var(--ombre);
padding:clamp(14px, 3vw, 28px)
}

#infog_canvas {
width:min(460px, 100%);
height:auto;
border-radius:var(--rayonPetit);
box-shadow:var(--ombreHaut)
}

@media (max-width:820px) {
#msg_layout {
	grid-template-columns:1fr
}

#msg_placeholder {
	display:none
}

#msg_tchat {
	position:absolute;
	width:100%;
	height:100%;
	background:var(--blanc);
	top:0;
	left:0
}

#msg_layout:not(.msg_tchatOuvert) #msg_tchat { display:none }

#msg_retourListe { display:flex }

.msg_bulle { max-width:85% }
}

.decor_fontSelect {
position:relative;
width:100%
}

.decor_fontToggle {
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
width:100%;
background:var(--papier);
border:2px solid var(--ligne);
border-radius:var(--rayonPetit);
text-align:left;
font-size:16px;
color:var(--encre);
cursor:pointer;
transition:border-color var(--transition);
padding:11px 14px
}

.decor_fontToggle:hover,
.decor_fontToggle[aria-expanded="true"] { border-color:var(--or) }

.decor_fontToggle:focus-visible {
outline:2px solid var(--or);
outline-offset:2px
}

.decor_fontToggle i {
font-size:12px;
color:var(--gris);
transition:transform var(--transition);
flex-shrink:0
}

.decor_fontToggle[aria-expanded="true"] i { transform:rotate(180deg) }

.decor_fontListe {
position:absolute;
z-index:60;
width:100%;
max-height:280px;
overflow-y:auto;
background:var(--blanc);
border:1px solid var(--ligne);
border-radius:var(--rayonPetit);
box-shadow:var(--ombreHaut);
list-style:none;
top:calc(100% + 6px);
left:0;
overscroll-behavior:contain;
margin:0;
padding:6px
}

.decor_fontOption {
border-radius:6px;
font-size:17px;
color:var(--encre);
cursor:pointer;
transition:background var(--transition);
padding:10px 12px
}

.decor_fontOption:hover { background:var(--papier) }

.decor_fontOption[aria-selected="true"] {
background:var(--or);
font-weight:600;
color:var(--marine)
}

.notif_liste {
display:flex;
flex-direction:column;
gap:8px
}

.notif_item {
display:flex;
align-items:center;
gap:13px;
background:var(--blanc);
border-radius:var(--rayonPetit);
box-shadow:var(--ombre);
text-decoration:none;
transition:transform var(--transition), box-shadow var(--transition);
padding:12px 16px
}

.notif_item:hover {
box-shadow:var(--ombreHaut);
transform:translateX(4px)
}

.notif_itemTexte {
display:flex;
flex:1;
flex-direction:column;
min-width:0;
font-size:14px;
color:var(--encre);
line-height:1.4
}

.notif_itemTexte strong { color:var(--marine) }

.notif_quand {
text-transform:uppercase;
font-size:11px;
letter-spacing:.05em;
color:var(--gris);
margin:2px 0 0
}

.notif_itemIcone {
font-size:16px;
color:var(--or);
flex-shrink:0
}

.notif_itemMedaille {
width:40px;
height:40px;
object-fit:contain;
flex-shrink:0
}

.avatar_petit {
width:40px;
border:2px solid var(--ligne);
font-size:17px;
flex-shrink:0
}

.header_outil {
position:relative;
display:inline-flex;
align-items:center;
justify-content:center;
width:40px;
height:40px;
background:rgba(255,255,255,.1);
border:none;
border-radius:50%;
font-size:16px;
color:var(--blanc);
cursor:pointer;
transition:background var(--transition), color var(--transition)
}

.header_outil:hover {
background:var(--or);
color:var(--marine)
}

.header_pastille {
position:absolute;
display:flex;
align-items:center;
justify-content:center;
min-width:18px;
height:18px;
background:#e0393e;
border:2px solid var(--marine);
border-radius:100px;
font-size:10px;
font-weight:700;
color:var(--blanc);
top:-3px;
right:-5px;
padding:0 4px
}

.header_pastille[hidden] { display:none !important }

#notifs_dropdown {
position:absolute;
z-index:150;
width:min(380px, calc(100vw - 24px));
max-height:70vh;
overflow-y:auto;
background:var(--blanc);
border-radius:var(--rayon);
box-shadow:var(--ombreHaut);
top:calc(100% + 10px);
right:0;
overscroll-behavior:contain
}

#notifs_dropdown .notif_item {
border-radius:0;
box-shadow:none;
border-bottom:1px solid var(--ligne)
}

#notifs_dropdown .notif_item:hover { transform:none; background:var(--papier) }

.notif_dropTitre {
display:flex;
align-items:center;
gap:9px;
background:var(--papier);
border-radius:var(--rayon) var(--rayon) 0 0;
text-transform:uppercase;
font-family:var(--fonteTitre);
font-size:14px;
font-weight:700;
letter-spacing:.05em;
color:var(--marine);
margin:0;
padding:13px 16px
}

.notif_dropTitre i { color:var(--or) }

.notif_dropVide {
text-align:center;
font-size:14px;
color:var(--gris);
margin:0;
padding:26px 16px
}

.notif_dropPied {
display:block;
background:var(--papier);
border-radius:0 0 var(--rayon) var(--rayon);
text-align:center;
text-decoration:none;
text-transform:uppercase;
font-family:var(--fonteTitre);
font-size:13px;
font-weight:700;
letter-spacing:.05em;
color:var(--marine);
transition:color var(--transition);
padding:12px 16px
}

.notif_dropPied:hover { color:var(--or) }

.notif_dropChargement {
text-align:center;
font-size:14px;
color:var(--gris);
margin:0;
padding:26px 16px
}

@media (max-width:900px) {
#notifs_dropdown {
	position:fixed;
	width:calc(100vw - 16px);
	top:auto;
	right:8px
}
}

.header_notifsWrap {
position:relative;
display:inline-flex
}

@media (max-width:520px) {
#header_compte { gap:6px }

.header_outil {
	width:36px;
	height:36px;
	font-size:14px
}
}

.notif_itemActu {
display:inline-flex;
align-items:center;
justify-content:center;
width:40px;
height:40px;
background:var(--marine);
border-radius:50%;
font-size:16px;
color:var(--or);
flex-shrink:0
}

.vUser_visiteMinis {
display:flex;
flex-wrap:wrap;
gap:6px;
margin:8px 0 0;
padding:0 10px 10px
}

.vUser_visiteMini {
width:46px;
height:46px;
object-fit:cover;
border-radius:8px
}

.visite_photos {
display:flex;
flex-wrap:wrap;
gap:10px;
margin:0 0 22px
}

.visite_photoAjout {
display:inline-flex;
align-items:center;
gap:8px;
background:#f4f6fa;
border:1px dashed #b9c2d4;
border-radius:8px;
font-size:13px;
color:#3c4a6b;
cursor:pointer;
padding:10px 14px
}

.visite_photoAjout input[type="file"] { display:none }

.visite_photoAjout span {
max-width:180px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap
}

.visite_photoAjout:hover { border-color:#0d1b3e }

.visite_photoAjout.estRempli {
background:#eef7ef;
border:1px solid #2f9e44;
color:#2f7d3a
}

.push_bouton {
display:inline-flex;
align-items:center;
gap:10px;
background:var(--marine, #0d1b3e);
border:none;
border-radius:8px;
font-size:15px;
font-weight:700;
color:#fff;
cursor:pointer;
transition:opacity .2s, transform .2s;
padding:12px 22px
}

.push_bouton:hover:not(:disabled) { transform:translateY(-2px) }

.push_bouton:disabled {
opacity:.5;
cursor:not-allowed
}

.push_bouton[data-actif="1"] {
background:#eef1f7;
border:1px solid #b9c2d4;
color:var(--marine, #0d1b3e)
}

.push_message {
font-size:14px;
color:#b3261e;
margin:12px 0 0
}

.push_section { content-visibility:auto }

.push_intro {
max-width:640px;
font-size:15px;
color:#3c4a6b;
line-height:1.5;
margin:0 0 16px
}

.push_prefs {
display:flex;
flex-direction:column;
gap:6px;
max-width:640px;
background:#fff;
border:1px solid #e2e4ee;
border-radius:12px;
margin:20px 0 0;
padding:16px 18px
}

.push_prefsTitre {
font-size:16px;
font-weight:700;
color:#0d1b3e;
padding:0 6px
}

.push_prefsIntro {
font-size:13px;
color:#3c4a6b;
margin:4px 0 10px
}

.push_pref {
display:flex;
align-items:center;
gap:12px;
border-top:1px solid #eef1f7;
cursor:pointer;
padding:10px 4px
}

.push_pref:first-of-type { border-top:none }

.push_prefIcone {
width:22px;
text-align:center;
font-size:16px;
color:#0d1b3e
}

.push_prefLabel {
flex:1;
font-size:15px;
color:#212238
}

.push_prefToggle {
position:absolute;
width:1px;
height:1px;
overflow:hidden;
clip-path:inset(50%);
margin:-1px
}

.push_prefSwitch {
position:relative;
display:inline-block;
width:42px;
height:24px;
background:#c3cad9;
border-radius:12px;
transition:background .2s;
flex-shrink:0
}

.push_prefSwitch::after {
position:absolute;
display:block;
width:18px;
height:18px;
content:"";
background:#fff;
border-radius:50%;
box-shadow:0 1px 3px rgba(13, 27, 62, .3);
top:3px;
left:3px;
transform:translate3d(0, 0, 0);
transition:transform .2s cubic-bezier(.4, 0, .2, 1);
will-change:transform
}

.push_prefToggle:checked + .push_prefSwitch { background:#2f9e44 }

.push_prefToggle:checked + .push_prefSwitch::after { transform:translate3d(18px, 0, 0) }

.push_prefToggle:focus-visible + .push_prefSwitch {
outline:2px solid #0d1b3e;
outline-offset:2px
}

.push_prefToggle:disabled + .push_prefSwitch { opacity:.5 }

.push_rgpd {
max-width:640px;
font-size:12px;
color:#5a668a;
line-height:1.5;
margin:16px 0 0
}

.push_rgpd a {
text-decoration:underline;
color:#0d1b3e
}
