/* ==========================================================================
   PEE.CHAT - rooms video : retouches du 11/10/2026 (agent "rooms") - voir js/aa-rooms.js
   Le bandeau du haut de la room (Minimize / Leave) n'est pas touche.
   ========================================================================== */

/* ---- 1. PEEMOJI de la room : colle a la barre de message, en largeur ---- */
#peeEmoPicker.aa-room {
    left: var(--aa-l) !important; top: var(--aa-t) !important; width: var(--aa-w) !important; height: var(--aa-h) !important;
    border-radius: 18px !important; border-bottom: 1px solid rgba(255, 107, 53, .38) !important; padding-bottom: 0 !important;
    transform-origin: 50% 100%;
}
#peeEmoPicker.aa-room.open { animation: aaEmoUp .16s ease-out; }
@keyframes aaEmoUp { from { transform: translateY(10px); } to { transform: none; } }
#peeEmoPicker.aa-room .pemo-grab, #peeEmoPicker.aa-room .pemo-draft { display: none !important; }
#peeEmoPicker.aa-room .pemo-top { padding-top: 8px; }
#peeEmoPicker.aa-room .pemo-head { max-width: 560px; width: 100%; margin: 0 auto; box-sizing: border-box; }

/* ---- 6. Me : ligne camera sans apercu, comme la ligne micro ---- */
.stg-me-camrow { align-items: center !important; }
.aa-me-cam {
    flex: 1; min-width: 0; height: 26px; display: flex; align-items: center; justify-content: center; border-radius: 99px;
    background: rgba(255, 255, 255, .05); font: 600 .72rem 'Inter', sans-serif; color: rgba(255, 255, 255, .5); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.aa-me-cam.on { color: #3DDC84; background: rgba(61, 220, 132, .08); }

/* interrupteurs de l'onglet Me : allume = rail degrade PEE.CHAT (le rail gris de rectif.css restait gris), pastille a droite */
#stgRoomPanel .stg-sw input:checked + i, #stgRoomPanel .stg-sw.aa-on i { background: linear-gradient(135deg, #FF6B35, #F7C948) !important; border-color: transparent !important; }
#stgRoomPanel .stg-sw.aa-on i::after { transform: translateX(18px); }
#stgRoomPanel .stg-sw:not(.aa-on) i::after { transform: none; }

/* ---- barre de message de la room : tout sur UNE ligne (le champ retrecit), icones de meme taille ----
   (en ligne, a 390 px le bouton d'envoi passait sous le champ : flex-wrap + largeur mini du champ) */
#videoRoomModal .room-chat-input { flex-wrap: nowrap !important; }
#videoRoomModal .room-chat-input > #roomChatInput { flex: 1 1 auto !important; min-width: 0 !important; width: 0; box-sizing: border-box; }
#videoRoomModal .room-chat-input > .btn-icon, #videoRoomModal .room-chat-input > .btn-send-room { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; }
@media (max-width: 640px) {
    #videoRoomModal .room-chat-input { gap: 4px !important; padding: 6px 8px !important; }
    #videoRoomModal .room-chat-input > .btn-icon { width: 34px !important; height: 34px !important; padding: 0 !important; border-radius: 10px; }
    #videoRoomModal .room-chat-input > .btn-icon svg { width: 19px !important; height: 19px !important; }
    #videoRoomModal .room-chat-input > .btn-icon .btc-cyber { font-size: 19px !important; line-height: 1; }
    #videoRoomModal .room-chat-input > #roomChatInput { height: 36px; padding: 0 12px !important; }
    #videoRoomModal .room-chat-input > .btn-send-room { width: 40px; height: 36px; padding: 0 !important; }
}
@media (max-width: 370px) {
    #videoRoomModal .room-chat-input { gap: 3px !important; padding: 6px !important; }
    #videoRoomModal .room-chat-input > .btn-icon { width: 32px !important; height: 32px !important; }
    #videoRoomModal .room-chat-input > .btn-icon svg { width: 18px !important; height: 18px !important; }
    #videoRoomModal .room-chat-input > #roomChatInput { padding: 0 10px !important; }
    #videoRoomModal .room-chat-input > .btn-send-room { width: 38px; }
}

/* ---- rooms5 (13/10) : la zone des cameras prend la hauteur reelle des vignettes (posee par aa-rooms.js, par vagues
   d'arrivees), le changement est anime (une seule propriete : height, 250 ms) ; le chat est ancre en bas ---- */
#videoRoomModal #camerasSection { box-sizing: border-box; transition: height .25s cubic-bezier(.2, .8, .2, 1); }
#videoRoomModal #camerasSection.aa-cam-hold { overflow: hidden !important; }
#videoRoomModal .room-chat-messages { display: flex; flex-direction: column; }
#videoRoomModal .room-chat-messages > * { flex-shrink: 0; }
#videoRoomModal .room-chat-messages > :first-child { margin-top: auto; }
@media (prefers-reduced-motion: reduce) { #videoRoomModal #camerasSection { transition: none; } }
/* fond de la room opaque partout (toutes largeurs, tous etats, rooms6) : le lobby ne se voit jamais derriere */
#videoRoomModal.video-room-modal { background: #0A0A0A !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; opacity: 1 !important; }
#videoRoomModal .video-room-container { background: radial-gradient(120% 55% at 50% 0%, rgba(255, 107, 53, .05), rgba(10, 10, 10, 0) 60%), #0A0A0A !important; }
#videoRoomModal .room-body { background-color: #0A0A0A; }
#videoRoomModal #camerasSection { background-color: #070707 !important; }   /* meme teinte qu'avant (noir a 60 % sur #0A0A0A), mais opaque */