/* Libre ce soir Corps - styles minimaux (s'accorde avec le theme) */
.sl-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.06);color:inherit;text-decoration:none}
.sl-btn:hover{background:rgba(255,255,255,.10)}
.sl-btn--primary{border:none;background:linear-gradient(135deg, #b07bff, #ff9acb)}
.sl-btn--primary:hover{filter:brightness(1.03)}

.sl-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);border-radius:18px;padding:14px}
.sl-toggle small{opacity:.75}
.sl-switch{cursor:pointer;display:inline-flex;align-items:center;gap:10px;user-select:none}
.sl-pill{width:46px;height:26px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);position:relative}
.sl-dot{width:20px;height:20px;border-radius:999px;background:rgba(255,255,255,.70);position:absolute;top:2px;left:2px;transition:all .18s ease}
.sl-pill[data-on="1"]{background:rgba(176,123,255,.20);border-color:rgba(176,123,255,.35)}
.sl-pill[data-on="1"] .sl-dot{left:24px;background:rgba(176,123,255,.95)}

.sl-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:900px){.sl-cards{grid-template-columns:1fr}}
.sl-card{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);border-radius:18px;padding:14px;display:flex;gap:12px;align-items:flex-start}
.sl-ava{width:54px;height:54px;border-radius:16px;overflow:hidden;flex:0 0 auto;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04)}
.sl-ava img{width:100%;height:100%;object-fit:cover}
.sl-card h5{margin:0 0 4px;font-size:16px}
.sl-meta{margin:0;opacity:.75;font-size:13px}
.sl-badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.sl-badge{font-size:12px;padding:5px 9px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05)}
.sl-badge--mauve{border:none;background:rgba(176,123,255,.20)}
.sl-badge--green{border:none;background:rgba(0,255,160,.14)}

.sl-input{padding:12px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(20,18,32,.70);color:rgba(255,255,255,.92);outline:none;width:100%}
.sl-input.slc-locked{opacity:.85;filter:saturate(.7)}
.sl-input::placeholder{color:rgba(255,255,255,.60)}
select.sl-input{appearance:none;-webkit-appearance:none;}
select.sl-input option{color:#f3f4f6;background:#111827}
.sl-input:focus{border-color:rgba(176,123,255,.45);box-shadow:0 0 0 3px rgba(176,123,255,.15)}

/* En-tetes de pages (petit visuel a droite) */
.sl-page-header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.sl-page-badge{flex:0 0 auto;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);border-radius:18px;overflow:hidden}
.sl-page-badge img{display:block;width:260px;max-width:260px;height:auto;object-fit:cover}
@media (max-width:900px){.sl-page-badge img{width:220px;max-width:220px}}
@media (max-width:480px){.sl-page-badge img{width:150px;max-width:150px}}

.sl-photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:900px){.sl-photo-grid{grid-template-columns:1fr}}
.sl-photo{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);border-radius:18px;overflow:hidden;position:relative}
.sl-photo img{width:100%;height:220px;object-fit:cover;display:block}
.sl-photo--blur img{filter:blur(10px);transform:scale(1.03)}
.sl-photo-controls{padding:12px;display:grid;gap:8px}
.sl-photo-controls label{display:flex;gap:10px;align-items:center;opacity:.85;font-size:13px}
.sl-photo-tag{position:absolute;top:10px;left:10px;background:rgba(0,0,0,.55);color:#fff;padding:6px 10px;border-radius:999px;font-size:12px;border:1px solid rgba(255,255,255,.12)}

/* Incoming call modal */
.slc-call-modal{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:99999;display:flex;align-items:center;justify-content:center;padding:16px}
.slc-call-card{max-width:420px;width:100%;background:rgba(20,18,32,.95);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:16px;box-shadow:0 10px 40px rgba(0,0,0,.45)}
.slc-call-title{font-weight:700;margin-bottom:6px}
.slc-call-from{opacity:.85;margin-bottom:14px}
.slc-call-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}


.sl-status-dots{display:flex;gap:6px;align-items:center;margin-top:6px}
.sl-status-dot{width:10px;height:10px;border-radius:999px;display:inline-block;box-shadow:0 0 0 2px rgba(255,255,255,.08) inset}
.sl-status-dot--green{background:#2ecc71}
.sl-status-dot--purple{background:#b45cff}


/* Photo visibility toggle */
.sl-vis-option{position:relative;}
.sl-vis-option input{position:absolute;opacity:0;pointer-events:none;}
.sl-vis-box{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.18);cursor:pointer;user-select:none;font-weight:600;}
.sl-vis-option input:checked + .sl-vis-box{border-color:rgba(170,120,255,.55);box-shadow:0 0 0 2px rgba(170,120,255,.20) inset;}


/* Emoji bar */
.sl-emoji-bar{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.sl-emoji-btn{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);border-radius:10px;padding:6px 8px;cursor:pointer;line-height:1;font-size:18px}
.sl-emoji-btn:hover{background:rgba(255,255,255,.10)}


/* Profil: évite le débordement horizontal sur mobile */
.sl-profile-head{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap}
.sl-profile-head .sl-ava{flex:0 0 auto}
.sl-profile-head h2{word-break:break-word}
@media (max-width:480px){
  .sl-profile-head{justify-content:center;text-align:center}
  .sl-profile-head > div{width:100%}
  .sl-profile-head .sl-ava{margin:0 auto}
}

/* Profil: bloc "Accès" (boutons Message / Appel Chat / Visio)
   Sur mobile, .sl-card (display:flex row) peut pousser ce bloc sur la droite.
   On force ici une mise en colonne + boutons qui reviennent dans le flux. */
.sl-profile-access{flex-direction:column;align-items:flex-start}
.sl-profile-access-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px;width:100%}

@media (max-width:768px){
  .sl-profile-access{width:100%}
  .sl-profile-access-actions{flex-direction:column}
  .sl-profile-access-actions .sl-btn{width:100%}
}

.sl-photo-controls input[type="text"]{max-width:100%}

/* Auth (Inscription / Connexion internes) : centre le panneau et évite le décalage */
.slc-auth-wrap{max-width:560px;margin:0 auto;padding:0 12px;}
.slc-auth-card{display:block;flex-direction:column;align-items:stretch;}
.sl-form{display:block;}
.sl-form label{display:block;margin:10px 0 6px;opacity:.85;}
.sl-form input,
.sl-form select,
.sl-form textarea{width:100%;max-width:100%;box-sizing:border-box;padding:12px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(20,18,32,.70);color:rgba(255,255,255,.92);outline:none;}
.sl-form textarea{resize:vertical;}
.sl-form input:focus,
.sl-form select:focus,
.sl-form textarea:focus{border-color:rgba(176,123,255,.45);box-shadow:0 0 0 3px rgba(176,123,255,.15)}