/* ============================================================
   TLGAWY CHAT V141 — requested repairs
   Header placement, mobile room list, room skin, admin toggles,
   subscriptions, professional join notice and log action menu.
   ============================================================ */

/* Header quick actions belong at the far right on desktop. */
@media screen and (min-width:769px){
    #chat_head{
        display:flex !important;
        direction:ltr !important;
        align-items:stretch !important;
        width:100% !important;
    }
    #chat_head #head_burger{ order:1 !important; flex:0 0 45px !important; }
    #chat_head .chat_head_logo{
        order:2 !important;
        display:flex !important;
        align-items:center !important;
        flex:1 1 auto !important;
        width:auto !important;
        min-width:120px !important;
        overflow:hidden !important;
    }
    #chat_head .chat_head_logo #main_logo{
        display:block !important;
        max-width:100% !important;
        object-fit:contain !important;
        object-position:left center !important;
    }
    #chat_head #empty_top_mob{ display:none !important; width:0 !important; padding:0 !important; }
    #chat_head #get_private{ order:20 !important; margin-left:auto !important; }
    #chat_head .tlg_mobile_request{ order:21 !important; }
    #chat_head .tlg_mobile_notify{ order:22 !important; }
    #chat_head .tlg_mobile_report{ order:23 !important; }
    #chat_head #main_mob_menu{ order:24 !important; }
    #chat_head .tlg_mobile_quick,
    #chat_head #main_mob_menu{
        position:relative !important;
        float:none !important;
        top:auto !important;
        right:auto !important;
        left:auto !important;
    }
}

/* Mobile header stays readable and never clips the logo. */
@media screen and (max-width:768px){
    #chat_head{ padding-inline:3px !important; }
    #chat_head .chat_head_logo{ min-width:82px !important; }
    #chat_head .chat_head_logo #main_logo,
    #chat_head #main_logo{
        width:auto !important;
        max-width:100% !important;
        height:38px !important;
        object-fit:contain !important;
        object-position:left center !important;
    }
    #chat_head .tlg_mobile_quick{ flex-shrink:0 !important; }

    /* Room list panel uses the exact phone width rather than a fixed 380px. */
    #chat_left{
        width:100vw !important;
        max-width:100vw !important;
        min-width:0 !important;
        left:0 !important;
        right:auto !important;
        border-left:0 !important;
        border-right:0 !important;
    }
    #chat_left_data,
    #left_content,
    .v90_room_list_panel,
    .v90_room_list{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;
        box-sizing:border-box !important;
    }
    .v90_room_row{
        min-height:48px !important;
        padding:5px 9px !important;
        box-sizing:border-box !important;
    }
    .v90_room_icon_wrap{ flex-basis:42px !important; width:42px !important; min-width:42px !important; }
    .v90_room_icon{ width:38px !important; height:38px !important; }
    .v90_room_title{ font-size:14px !important; font-weight:800 !important; }
    .v90_room_count{ flex-basis:50px !important; min-width:50px !important; }
}

/* Keep the gold treatment limited to the room entry, never the active chat. */
.v90_room_row.v90_room_gold{
    background:linear-gradient(90deg,#fff8dc 0%,#fffdf6 52%,#ffe699 100%) !important;
    border-bottom-color:#d5ad35 !important;
}
.v90_room_row.v90_room_gold .v90_room_title{ color:#b57a00 !important; }

/* A loaded custom room background must show immediately and after room switches. */
#global_chat.tlg-room-skin-active #chat_center,
#global_chat.tlg-room-skin-active #container_chat,
#global_chat.tlg-room-skin-active #wrap_chat,
#global_chat.tlg-room-skin-active #warp_show_chat,
#global_chat.tlg-room-skin-active #container_show_chat,
#global_chat.tlg-room-skin-active #inside_wrap_chat,
#global_chat.tlg-room-skin-active #show_chat,
#global_chat.tlg-room-skin-active #show_chat > ul,
#global_chat.tlg-room-skin-active #chat_logs_container{
    background-color:transparent !important;
}
#global_chat.tlg-room-skin-active #show_chat .chat_log:not(.topic_log){
    background-color:rgba(255,255,255,.76) !important;
}

/* Chairman controls for optional menu groups. */
.v141_menu_toggle_group select{ width:100% !important; }

/* Subscription profile tab. */
.v141_subscription_card{
    display:flex;
    align-items:center;
    gap:14px;
    width:100%;
    padding:18px;
    border:1px solid rgba(0,0,0,.08);
    border-radius:14px;
    background:rgba(255,255,255,.88);
    box-sizing:border-box;
}
.v141_subscription_icon{
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 54px;
    width:54px;
    height:54px;
    border-radius:50%;
    font-size:24px;
    background:linear-gradient(135deg,#fff1a8,#d79d00);
    color:#fff;
    box-shadow:0 5px 14px rgba(161,112,0,.22);
}
.v141_subscription_body{ display:flex; flex-direction:column; gap:5px; min-width:0; }
.v141_subscription_body strong{ font-size:17px; }
.v141_subscription_body span{ color:#777; font-size:13px; line-height:1.55; }
.v141_subscription_inactive .v141_subscription_icon{ background:#d8d8d8; color:#777; box-shadow:none; }

/* Professional system join card. */
.v141_join_notice{
    display:inline-flex;
    direction:rtl;
    align-items:center;
    gap:8px;
    max-width:calc(100% - 12px);
    padding:7px 12px;
    border:1px solid rgba(3,173,216,.22);
    border-radius:12px;
    background:linear-gradient(135deg,rgba(3,173,216,.12),rgba(255,255,255,.86));
    color:#263238;
    box-shadow:0 2px 7px rgba(0,0,0,.06);
    font-weight:700;
}
.v141_join_notice > i{ color:#03add8; font-size:17px; }
.v141_join_notice .v141_join_name{ color:#0788aa; font-weight:900; }
.v141_join_notice .v141_join_rank{
    display:inline-flex;
    align-items:center;
    padding:2px 7px;
    border-radius:999px;
    background:#222;
    color:#fff;
    font-size:11px;
    white-space:nowrap;
}

/* Log action menu always stays above disabled input overlays. */
#log_menu.v141_log_menu_open{
    position:fixed !important;
    display:block !important;
    visibility:visible !important;
    z-index:2147483000 !important;
    height:auto !important;
    min-width:165px !important;
    max-width:min(260px,calc(100vw - 16px)) !important;
}
#log_menu.v141_log_menu_open .logmenu{ max-height:70vh !important; overflow:auto !important; }
#show_chat .logs_menu{ cursor:pointer !important; pointer-events:auto !important; position:relative !important; z-index:6 !important; }

@media screen and (max-width:768px){
    .v141_join_notice{ font-size:13px; padding:6px 9px; gap:6px; }
    .v141_subscription_card{ padding:14px; }
}
