/* =========================================================
   PAREACLUB LEFT ROOM ACTIONS V2
   COMPACT BUTTONS + SAFE DJ VISIBILITY
========================================================= */


/* Κρύβουμε μόνο την επάνω μπάρα οπτικά.
   Δεν πειράζουμε το Android layout. */

html.parea-rooms-actions-ready-v1 .topbar {
    min-height: 5px !important;
    height: 5px !important;
    max-height: 5px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-bottom: 1px solid rgba(231,172,0,.38) !important;
}


/* Logo PAREACLUB τέλος */

html.parea-rooms-actions-ready-v1 .topbar .brand {
    display: none !important;
}


/* Η αρχική top-actions παραμένει στο DOM
   για να συνεχίσουν να δουλεύουν οι μηχανισμοί του chat.
   Απλώς δεν φαίνεται. */

html.parea-rooms-actions-ready-v1 .topbar .top-actions {
    position: absolute !important;

    left: -10000px !important;
    top: 0 !important;

    width: 1px !important;
    height: 1px !important;

    overflow: hidden !important;

    opacity: 0 !important;

    pointer-events: none !important;
}


/* =========================================================
   ACTION AREA ΠΑΝΩ ΑΠΟ ΛΙΣΤΑ ΔΩΜΑΤΙΩΝ
========================================================= */

#pareaRoomsActionsV1 {
    display: grid !important;

    grid-template-columns:
        minmax(0,1fr)
        minmax(0,1fr) !important;

    gap: 4px !important;

    margin:
        4px 6px 5px 6px !important;

    padding:
        0 !important;

    order:
        -1 !important;
}


/* =========================================================
   EXIT + SETTINGS
   ΦΥΣΙΟΛΟΓΙΚΟ ΜΕΓΕΘΟΣ
========================================================= */

#pareaRoomsActionsV1 #logoutBtn,
#pareaRoomsActionsV1 #settingsBtn {

    width: 100% !important;

    min-width: 0 !important;

    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;

    padding:
        2px 7px !important;

    margin:
        0 !important;

    font-size:
        13px !important;

    line-height:
        1 !important;

    border-radius:
        6px !important;

    display:
        inline-flex !important;

    align-items:
        center !important;

    justify-content:
        center !important;

    column-gap:
        5px !important;

    box-sizing:
        border-box !important;
}


/* =========================================================
   DJ PLAYER PROXY
   Εμφανίζεται ΜΟΝΟ όταν το πραγματικό DJ Player είναι ενεργό
========================================================= */

#pareaDjPlayerProxyV2 {

    grid-column:
        1 / -1 !important;

    width:
        100% !important;

    height:
        31px !important;

    min-height:
        31px !important;

    max-height:
        31px !important;

    padding:
        2px 7px !important;

    margin:
        0 !important;

    font-size:
        13px !important;

    line-height:
        1 !important;

    border-radius:
        6px !important;

    display:
        inline-flex !important;

    align-items:
        center !important;

    justify-content:
        center !important;

    column-gap:
        5px !important;

    box-sizing:
        border-box !important;


    /* ίδιο professional 3D look */

    background:
        linear-gradient(
            180deg,
            #284c68 0%,
            #17344e 35%,
            #0d2438 68%,
            #071622 100%
        ) !important;

    border:
        1px solid #e6ae32 !important;

    color:
        #f5f8ff !important;

    font-weight:
        700 !important;

    text-shadow:
        0 1px 1px #000 !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.22),
        inset 0 -2px 0 rgba(0,0,0,.65),
        0 1px 2px rgba(0,0,0,.60),
        0 0 5px rgba(0,169,255,.14) !important;
}


/* hidden σημαίνει ΠΡΑΓΜΑΤΙΚΑ hidden */

#pareaDjPlayerProxyV2[hidden] {
    display:
        none !important;
}


/* Δεν αφήνουμε παλιούς κανόνες V1
   να ξαναμεγαλώσουν τα κουμπιά */

@media screen and (min-width:901px) {

    #pareaRoomsActionsV1 #logoutBtn,
    #pareaRoomsActionsV1 #settingsBtn {

        height:
            32px !important;

        min-height:
            32px !important;

        max-height:
            32px !important;

        font-size:
            13px !important;
    }
}


/* ANDROID:
   ίδιο layout όπως ήδη υπάρχει,
   μόνο compact εμφάνιση των συγκεκριμένων κουμπιών */

@media screen
       and (max-width:1000px)
       and (orientation:portrait) {

    #pareaRoomsActionsV1 {

        gap:
            3px !important;

        margin:
            3px 5px 4px 5px !important;
    }


    #pareaRoomsActionsV1 #logoutBtn,
    #pareaRoomsActionsV1 #settingsBtn,
    #pareaDjPlayerProxyV2 {

        height:
            30px !important;

        min-height:
            30px !important;

        max-height:
            30px !important;

        font-size:
            12px !important;
    }
}

/* =========================================================
   PAREACLUB MOBILE ROOM ACTIONS COMPACT FIX V4
   ANDROID PORTRAIT ONLY
   Δεν αλλάζει το layout του chat
========================================================= */

@media screen
       and (max-width:1000px)
       and (orientation:portrait) {

    /* ---------------------------------------------
       Container
    --------------------------------------------- */

    html.parea-android-desktop-v3
    #pareaRoomsActionsV1 {

        grid-template-columns:
            minmax(0,1fr)
            minmax(0,1fr) !important;

        gap:
            3px !important;

        margin:
            3px 4px 4px 4px !important;

        padding:
            0 !important;
    }


    /* ---------------------------------------------
       EXIT + SETTINGS
       Κρύβουμε το αρχικό text-node.
       Θα φαίνονται μόνο τα pseudo icon + label.
    --------------------------------------------- */

    html.parea-android-desktop-v3
    #pareaRoomsActionsV1 #logoutBtn,

    html.parea-android-desktop-v3
    #pareaRoomsActionsV1 #settingsBtn {

        order:
            1 !important;

        width:
            100% !important;

        min-width:
            0 !important;

        height:
            25px !important;

        min-height:
            25px !important;

        max-height:
            25px !important;

        padding:
            1px 3px !important;

        margin:
            0 !important;

        font-size:
            0 !important;

        line-height:
            1 !important;

        column-gap:
            3px !important;

        overflow:
            hidden !important;

        white-space:
            nowrap !important;

        border-radius:
            5px !important;

        display:
            inline-flex !important;

        align-items:
            center !important;

        justify-content:
            center !important;

        box-sizing:
            border-box !important;
    }


    /* ---------------------------------------------
       ICONS
    --------------------------------------------- */

    html.parea-android-desktop-v3
    #pareaRoomsActionsV1 #logoutBtn::before {

        content:
            "⏻" !important;

        font-family:
            Arial, sans-serif !important;

        font-size:
            11px !important;

        line-height:
            1 !important;

        margin:
            0 1px 0 0 !important;

        width:
            auto !important;

        height:
            auto !important;

        filter:
            drop-shadow(0 0 2px rgba(255,110,70,.65)) !important;
    }


    html.parea-android-desktop-v3
    #pareaRoomsActionsV1 #settingsBtn::before {

        content:
            "⚙" !important;

        font-family:
            Arial, sans-serif !important;

        font-size:
            11px !important;

        line-height:
            1 !important;

        margin:
            0 1px 0 0 !important;

        width:
            auto !important;

        height:
            auto !important;

        filter:
            drop-shadow(0 0 2px rgba(0,180,255,.70)) !important;
    }


    /* ---------------------------------------------
       LABELS
       Μία φορά μόνο
    --------------------------------------------- */

    html.parea-android-desktop-v3
    #pareaRoomsActionsV1 #logoutBtn::after {

        content:
            "Έξοδος" !important;

        font-size:
            10px !important;

        line-height:
            1 !important;

        font-family:
            Arial, sans-serif !important;

        font-weight:
            700 !important;

        white-space:
            nowrap !important;

        width:
            auto !important;

        height:
            auto !important;

        margin:
            0 !important;
    }


    html.parea-android-desktop-v3
    #pareaRoomsActionsV1 #settingsBtn::after {

        content:
            "Ρυθμίσεις" !important;

        font-size:
            9.5px !important;

        line-height:
            1 !important;

        font-family:
            Arial, sans-serif !important;

        font-weight:
            700 !important;

        white-space:
            nowrap !important;

        width:
            auto !important;

        height:
            auto !important;

        margin:
            0 !important;
    }


    /* ---------------------------------------------
       DJ PLAYER
       Πάντα κάτω από Exit / Settings.
       Μόνο όταν το JS αποφασίσει ότι πρέπει να φαίνεται.
    --------------------------------------------- */

    html.parea-android-desktop-v3
    #pareaDjPlayerProxyV2 {

        order:
            3 !important;

        grid-column:
            1 / -1 !important;

        width:
            100% !important;

        height:
            24px !important;

        min-height:
            24px !important;

        max-height:
            24px !important;

        padding:
            1px 4px !important;

        margin:
            0 !important;

        font-size:
            10px !important;

        line-height:
            1 !important;

        border-radius:
            5px !important;

        overflow:
            hidden !important;

        white-space:
            nowrap !important;

        text-overflow:
            ellipsis !important;
    }


    html.parea-android-desktop-v3
    #pareaDjPlayerProxyV2[hidden] {

        display:
            none !important;
    }
}