/* =========================================================
   PAREACLUB ANDROID LEGACY COMPAT MIGRATED V1

   V24 -> V2.10 rules preserved in original order.
   Legacy Android scope migrated to:
   parea-android-desktop-v3
========================================================= */

/* ===== MIGRATED FROM android-v24-test.css ===== */
/* PAREACLUB ANDROID V2.4 ACTIVATION TEST */

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

    html.parea-android-desktop-v3 .layout,
    body.parea-android-desktop-v3 .layout {
        grid-template-columns:
            24% minmax(0,52%) 24% !important;
    }

    html.parea-android-desktop-v3 main.center,
    body.parea-android-desktop-v3 main.center {
        display:block !important;

        grid-template-columns:none !important;
        grid-template-rows:none !important;

        width:100% !important;
        min-width:0 !important;
    }

    html.parea-android-desktop-v3 .center .chat-panel,
    body.parea-android-desktop-v3 .center .chat-panel {
        width:100% !important;
        max-width:100% !important;
    }

    html.parea-android-desktop-v3 .camera-panel,
    body.parea-android-desktop-v3 .camera-panel {
        height:190px !important;
        min-height:190px !important;
        max-height:190px !important;
    }
}

/* ===== END android-v24-test.css ===== */

/* ===== MIGRATED FROM android-v25.css ===== */
/* =========================================================
   PAREACLUB ANDROID V2.5
   Final PC-like portrait foundation
   ONLY Android detector class
   Desktop untouched
========================================================= */

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

    /* =====================================================
       PAGE
    ===================================================== */

    html.parea-android-desktop-v3,
    html.parea-android-desktop-v3 body {
        width:100% !important;
        height:100% !important;
        margin:0 !important;
        padding:0 !important;
        overflow:hidden !important;
    }

    html.parea-android-desktop-v3 #mainApp {
        position:fixed !important;
        inset:0 !important;

        width:100% !important;
        height:100dvh !important;

        margin:0 !important;
        padding:0 !important;

        overflow:hidden !important;
    }


    /* =====================================================
       REAL TOPBAR
    ===================================================== */

    html.parea-android-desktop-v3 .topbar {
        position:fixed !important;

        top:0 !important;
        left:0 !important;
        right:0 !important;

        width:100% !important;
        height:46px !important;
        min-height:46px !important;
        max-height:46px !important;

        display:flex !important;
        flex-wrap:nowrap !important;

        align-items:center !important;
        justify-content:space-between !important;

        gap:3px !important;

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

        box-sizing:border-box !important;

        overflow:hidden !important;

        z-index:50000 !important;
    }


    html.parea-android-desktop-v3 .topbar .top-actions {
        order:1 !important;

        flex:0 1 auto !important;

        display:flex !important;
        align-items:center !important;

        gap:2px !important;

        min-width:0 !important;
        margin:0 !important;

        overflow:hidden !important;
    }


    html.parea-android-desktop-v3 .topbar .brand {
        order:2 !important;

        flex:0 0 auto !important;

        margin:0 !important;

        font-size:11px !important;
        line-height:1 !important;

        white-space:nowrap !important;
    }


    html.parea-android-desktop-v3 #myUsernameTop {
        display:none !important;
    }


    html.parea-android-desktop-v3 #logoutBtn,
    html.parea-android-desktop-v3 #settingsBtn,
    html.parea-android-desktop-v3 #openDjPlayerBtn {
        display:inline-flex !important;
        visibility:visible !important;
        opacity:1 !important;

        flex:0 0 auto !important;

        width:auto !important;
        min-width:0 !important;

        height:30px !important;
        min-height:30px !important;

        padding:0 5px !important;
        margin:0 !important;

        font-size:9px !important;
        line-height:1 !important;

        white-space:nowrap !important;
    }


    /* =====================================================
       REMOVE LEGACY MOBILE BARS
    ===================================================== */

    html.parea-android-desktop-v3 #pareaMobileBar,
    html.parea-android-desktop-v3 #pareaMobileToolbar,
    html.parea-android-desktop-v3 #pareaMobileOverlay {
        display:none !important;
    }


    /* =====================================================
       REAL 3 COLUMN LAYOUT
       Starts immediately under topbar
    ===================================================== */

    html.parea-android-desktop-v3 .layout {
        position:fixed !important;

        top:46px !important;
        left:0 !important;
        right:0 !important;
        bottom:0 !important;

        width:100% !important;

        height:auto !important;
        min-height:0 !important;
        max-height:none !important;

        display:grid !important;

        grid-template-columns:
            24% minmax(0,52%) 24% !important;

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

        gap:3px !important;

        margin:0 !important;
        padding:3px !important;

        box-sizing:border-box !important;

        overflow:hidden !important;

        z-index:100 !important;
    }


    /* =====================================================
       LEFT COLUMN
    ===================================================== */

    html.parea-android-desktop-v3 .left {
        position:relative !important;

        top:auto !important;
        left:auto !important;
        right:auto !important;
        bottom:auto !important;

        width:100% !important;
        height:100% !important;

        min-width:0 !important;
        min-height:0 !important;

        display:grid !important;

        grid-template-rows:
            minmax(0,1fr)
            190px !important;

        gap:3px !important;

        padding:0 !important;
        margin:0 !important;

        transform:none !important;

        overflow:hidden !important;

        pointer-events:auto !important;
    }


    html.parea-android-desktop-v3 .rooms-panel {
        width:100% !important;
        height:100% !important;

        min-height:0 !important;

        display:flex !important;
        flex-direction:column !important;

        overflow:hidden !important;
    }


    html.parea-android-desktop-v3 #roomList {
        flex:1 1 auto !important;

        min-height:0 !important;

        overflow-y:auto !important;
        overflow-x:hidden !important;
    }


    /* =====================================================
       CAMERA
    ===================================================== */

    html.parea-android-desktop-v3 .camera-panel {
        width:100% !important;

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

        margin:0 !important;
        padding:0 !important;

        align-self:end !important;

        overflow:hidden !important;
    }


    html.parea-android-desktop-v3 .camera-panel .panel-title {
        height:24px !important;
        min-height:24px !important;
    }


    html.parea-android-desktop-v3 .camera-user {
        min-height:23px !important;
        height:23px !important;

        font-size:9px !important;
    }


    html.parea-android-desktop-v3 .camera-box {
        width:100% !important;

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

        overflow:hidden !important;
    }


    html.parea-android-desktop-v3 .camera-box video,
    html.parea-android-desktop-v3 #cameraPlaceholder {
        width:100% !important;

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

        object-fit:cover !important;
    }


    html.parea-android-desktop-v3 .camera-panel input[type="range"] {
        display:none !important;
    }


    html.parea-android-desktop-v3 .camera-panel button {
        min-height:27px !important;

        padding:2px 3px !important;

        font-size:8px !important;
    }


    /* =====================================================
       CENTER CHAT
    ===================================================== */

    html.parea-android-desktop-v3 main.center,
    html.parea-android-desktop-v3 .center {
        position:relative !important;

        top:auto !important;
        left:auto !important;

        width:100% !important;
        height:100% !important;

        min-width:0 !important;
        min-height:0 !important;

        display:block !important;

        grid-template-columns:none !important;
        grid-template-rows:none !important;

        margin:0 !important;
        padding:0 !important;

        overflow:hidden !important;
    }


    html.parea-android-desktop-v3 .chat-panel {
        width:100% !important;
        height:100% !important;

        min-width:0 !important;
        min-height:0 !important;

        display:flex !important;
        flex-direction:column !important;

        margin:0 !important;
        padding:0 !important;

        overflow:hidden !important;
    }


    html.parea-android-desktop-v3 #messages {
        flex:1 1 0 !important;

        width:100% !important;

        min-width:0 !important;
        min-height:0 !important;

        overflow-y:auto !important;
        overflow-x:hidden !important;
    }


    html.parea-android-desktop-v3 .toolbar {
        flex:0 0 auto !important;

        width:100% !important;

        display:flex !important;
        flex-wrap:nowrap !important;

        gap:2px !important;

        padding:2px !important;

        box-sizing:border-box !important;

        overflow-x:auto !important;
        overflow-y:hidden !important;
    }


    html.parea-android-desktop-v3 .toolbar button,
    html.parea-android-desktop-v3 .toolbar select {
        flex:0 0 auto !important;

        height:27px !important;
        min-height:27px !important;

        width:auto !important;
        min-width:0 !important;

        padding:0 4px !important;

        font-size:8px !important;

        white-space:nowrap !important;
    }


    html.parea-android-desktop-v3 #form {
        flex:0 0 38px !important;

        width:100% !important;

        height:38px !important;
        min-height:38px !important;

        display:flex !important;
        align-items:center !important;

        gap:3px !important;

        padding:2px !important;
        margin:0 !important;

        box-sizing:border-box !important;
    }


    html.parea-android-desktop-v3 #input {
        flex:1 1 auto !important;

        width:auto !important;
        min-width:0 !important;

        height:32px !important;

        font-size:9px !important;
    }


    html.parea-android-desktop-v3 #form button {
        flex:0 0 auto !important;

        min-width:67px !important;
        height:32px !important;

        padding:0 4px !important;

        font-size:8px !important;
    }


    /* =====================================================
       RIGHT COLUMN
       Actual HTML contains USERS only
    ===================================================== */

    html.parea-android-desktop-v3 .right {
        position:relative !important;

        top:auto !important;
        left:auto !important;
        right:auto !important;
        bottom:auto !important;

        width:100% !important;
        height:100% !important;

        min-width:0 !important;
        min-height:0 !important;

        display:block !important;

        padding:0 !important;
        margin:0 !important;

        transform:none !important;

        overflow:hidden !important;

        pointer-events:auto !important;
    }


    html.parea-android-desktop-v3 .right .users-panel {
        width:100% !important;
        height:100% !important;

        min-height:0 !important;

        display:flex !important;
        flex-direction:column !important;

        overflow:hidden !important;
    }


    html.parea-android-desktop-v3 #usersListUI {
        flex:1 1 auto !important;

        min-height:0 !important;

        overflow-y:auto !important;
        overflow-x:hidden !important;
    }


    /* =====================================================
       COMPACT TITLES
    ===================================================== */

    html.parea-android-desktop-v3 .panel-title {
        min-height:24px !important;
        height:24px !important;

        padding:0 3px !important;

        font-size:8px !important;
    }


    html.parea-android-desktop-v3 #roomList,
    html.parea-android-desktop-v3 #usersListUI {
        font-size:8px !important;
    }

}

/* ===== END android-v25.css ===== */

/* ===== MIGRATED FROM android-v26.css ===== */
/* =========================================================
   PAREACLUB ANDROID V2.6
   CAMERA + RADIO ONLY
   CENTER / TOPBAR / 3-COLUMN UNTOUCHED
========================================================= */

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

    /* =====================================================
       CAMERA - πιο φυσιολογική και compact
    ===================================================== */

    html.parea-android-desktop-v3 .left {
        grid-template-rows:
            minmax(0,1fr)
            150px !important;
    }

    html.parea-android-desktop-v3 .camera-panel {
        height:150px !important;
        min-height:150px !important;
        max-height:150px !important;

        display:flex !important;
        flex-direction:column !important;

        padding:0 !important;
        margin:0 !important;

        overflow:hidden !important;
    }

    html.parea-android-desktop-v3 .camera-panel .panel-title {
        flex:0 0 22px !important;

        height:22px !important;
        min-height:22px !important;

        font-size:8px !important;
    }

    html.parea-android-desktop-v3 .camera-user {
        flex:0 0 20px !important;

        height:20px !important;
        min-height:20px !important;

        padding:0 3px !important;

        font-size:8px !important;
    }

    html.parea-android-desktop-v3 .camera-box {
        flex:0 0 56px !important;

        width:100% !important;

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

        overflow:hidden !important;
    }

    html.parea-android-desktop-v3 .camera-box #localVideo,
    html.parea-android-desktop-v3 .camera-box video,
    html.parea-android-desktop-v3 #cameraPlaceholder {
        width:100% !important;

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

        object-fit:cover !important;
    }

    html.parea-android-desktop-v3 .camera-panel .media-row {
        flex:0 0 30px !important;

        height:30px !important;
        min-height:30px !important;

        display:flex !important;

        gap:2px !important;

        padding:2px !important;
        margin:0 !important;

        box-sizing:border-box !important;
    }

    html.parea-android-desktop-v3 #cameraBtn,
    html.parea-android-desktop-v3 #micBtn {
        flex:1 1 50% !important;

        min-width:0 !important;

        height:26px !important;
        min-height:26px !important;

        padding:0 2px !important;

        font-size:8px !important;
    }

    /*
       Η μεγάλη volume μπάρα που δεν θέλουμε
    */
    html.parea-android-desktop-v3 .camera-panel .volume-row,
    html.parea-android-desktop-v3 #volumeSlider,
    html.parea-android-desktop-v3 #volumeValue {
        display:none !important;
    }


    /* =====================================================
       PAREA RADIO
       Είναι μέσα στο .users-panel πριν από .users-help
    ===================================================== */

    html.parea-android-desktop-v3 #pareaRoomRadio3dV1 {
        flex:0 0 166px !important;

        width:100% !important;

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

        margin:3px 0 0 !important;
        padding:6px !important;

        box-sizing:border-box !important;

        border-radius:8px !important;

        overflow:hidden !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-top {
        height:20px !important;
        min-height:20px !important;

        margin:0 0 3px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-brand {
        font-size:8px !important;
        letter-spacing:0 !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-onair {
        padding:2px 4px !important;

        font-size:7px !important;

        gap:3px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-dot {
        width:5px !important;
        height:5px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-screen {
        grid-template-columns:
            30px minmax(0,1fr) !important;

        gap:5px !important;

        min-height:42px !important;
        height:42px !important;

        padding:4px !important;

        margin:0 0 4px !important;

        border-radius:7px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-disc {
        width:28px !important;
        height:28px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-small {
        font-size:6px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadioStationName {
        margin-top:1px !important;

        font-size:8px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-eq {
        height:7px !important;

        margin-top:1px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadioStationSelect {
        height:25px !important;

        padding:2px 4px !important;

        margin:0 0 4px !important;

        font-size:8px !important;

        border-radius:6px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-controls {
        min-height:27px !important;

        margin:0 !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadioPlay {
        width:28px !important;
        height:25px !important;
        min-height:25px !important;

        padding:0 !important;

        font-size:10px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadioVolume {
        min-width:0 !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadioVolumeValue {
        font-size:7px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadioMessage {
        margin-top:2px !important;

        min-height:12px !important;

        font-size:7px !important;
        line-height:12px !important;
    }


    /* =====================================================
       USERS PANEL
       Το list γεμίζει τον χώρο και το radio κάθεται κάτω
    ===================================================== */

    html.parea-android-desktop-v3
    .right .users-panel {
        display:flex !important;
        flex-direction:column !important;

        min-height:0 !important;
    }

    html.parea-android-desktop-v3
    #usersListUI {
        flex:1 1 0 !important;

        min-height:0 !important;

        overflow-y:auto !important;
    }

    html.parea-android-desktop-v3
    .right .users-help {
        flex:0 0 auto !important;

        min-height:0 !important;
    }

}

/* ===== END android-v26.css ===== */

/* ===== MIGRATED FROM android-v27.css ===== */
/* =========================================================
   PAREACLUB ANDROID V2.7
   CAMERA + RADIO FINAL POSITION
========================================================= */

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

    /* RADIO: κάτω στη δεξιά στήλη */
    html.parea-android-desktop-v3 .right .users-panel {
        display:flex !important;
        flex-direction:column !important;
        height:100% !important;
        min-height:0 !important;
    }

    html.parea-android-desktop-v3 #usersListUI {
        flex:1 1 auto !important;
        min-height:0 !important;
    }

    html.parea-android-desktop-v3 #pareaRoomRadio3dV1 {
        flex:0 0 166px !important;

        margin-top:auto !important;
        margin-left:0 !important;
        margin-right:0 !important;
        margin-bottom:0 !important;

        width:100% !important;
        max-width:100% !important;

        box-sizing:border-box !important;
    }


    /* CAMERA BUTTONS */
    html.parea-android-desktop-v3 .camera-panel .media-row {
        display:grid !important;

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

        gap:2px !important;

        width:100% !important;

        padding:2px !important;

        box-sizing:border-box !important;
    }

    html.parea-android-desktop-v3 #cameraBtn,
    html.parea-android-desktop-v3 #micBtn {
        width:100% !important;
        min-width:0 !important;

        height:26px !important;

        padding:0 1px !important;

        font-size:7px !important;

        overflow:hidden !important;
        white-space:nowrap !important;
    }

    html.parea-android-desktop-v3 #mobileCameraSwitchBtn {
        width:28px !important;
        min-width:28px !important;
        max-width:28px !important;

        height:26px !important;
        min-height:26px !important;

        padding:0 !important;

        font-size:14px !important;
    }


    /* Δεν θέλουμε volume slider στην κάμερα */
    html.parea-android-desktop-v3 .camera-panel .volume-row,
    html.parea-android-desktop-v3 #volumeSlider,
    html.parea-android-desktop-v3 #volumeValue {
        display:none !important;
    }

}

/* ===== END android-v27.css ===== */

/* ===== MIGRATED FROM android-v28.css ===== */
/* =========================================================
   PAREACLUB ANDROID V2.8
   RIGHT COLUMN FINAL
   RADIO BOTTOM
========================================================= */

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

    html.parea-android-desktop-v3
    .right .users-panel {

        display:grid !important;

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

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

        width:100% !important;
        height:100% !important;

        min-width:0 !important;
        min-height:0 !important;

        padding:0 !important;
        margin:0 !important;

        overflow:hidden !important;
    }


    /* Tabs */
    html.parea-android-desktop-v3
    .right .users-panel > .tabs {
        grid-row:1 !important;

        min-width:0 !important;
        flex:none !important;
    }


    /* ΧΡΗΣΤΕΣ ΣΤΟ ΔΩΜΑΤΙΟ */
    html.parea-android-desktop-v3
    .right .users-panel > .panel-title {
        grid-row:2 !important;

        min-width:0 !important;
        flex:none !important;
    }


    /* Η λίστα παίρνει ΟΛΟ τον κενό χώρο */
    html.parea-android-desktop-v3
    .right .users-panel > #usersListUI {
        grid-row:3 !important;

        position:relative !important;

        top:auto !important;
        right:auto !important;
        bottom:auto !important;
        left:auto !important;

        width:100% !important;
        height:auto !important;

        min-width:0 !important;
        min-height:0 !important;

        max-width:none !important;
        max-height:none !important;

        margin:0 !important;
        padding:0 !important;

        display:block !important;

        overflow-x:hidden !important;
        overflow-y:auto !important;

        flex:none !important;
    }


    /* Radio πάντα μετά τη λίστα = χαμηλά */
    html.parea-android-desktop-v3
    .right .users-panel > #pareaRoomRadio3dV1 {
        grid-row:4 !important;

        position:relative !important;

        top:auto !important;
        right:auto !important;
        bottom:auto !important;
        left:auto !important;

        align-self:end !important;

        width:100% !important;

        margin:0 !important;

        flex:none !important;
    }


    html.parea-android-desktop-v3
    .right .users-panel > .users-help {
        grid-row:5 !important;

        position:relative !important;

        width:100% !important;

        min-height:0 !important;

        margin:0 !important;
        padding:0 !important;

        flex:none !important;
    }

}

/* ===== END android-v28.css ===== */

/* ===== MIGRATED FROM android-v29.css ===== */
/* =========================================================
   PAREACLUB ANDROID V2.9
   RIGHT PANEL FULL HEIGHT + RADIO BOTTOM
========================================================= */

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

    html.parea-android-desktop-v3 .right {
        position:relative !important;

        width:100% !important;
        height:100% !important;

        min-width:0 !important;
        min-height:0 !important;

        overflow:hidden !important;
    }


    /*
       Το Users Panel πιάνει ΥΠΟΧΡΕΩΤΙΚΑ
       όλη τη δεξιά στήλη.
    */
    html.parea-android-desktop-v3
    .right > .users-panel {

        position:absolute !important;

        top:0 !important;
        right:0 !important;
        bottom:0 !important;
        left:0 !important;

        width:auto !important;
        height:auto !important;

        min-width:0 !important;
        min-height:0 !important;

        margin:0 !important;
        padding:0 !important;

        display:grid !important;

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

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

        align-content:stretch !important;

        overflow:hidden !important;
    }


    html.parea-android-desktop-v3
    .right > .users-panel > .tabs {
        grid-row:1 !important;
    }


    html.parea-android-desktop-v3
    .right > .users-panel > .panel-title {
        grid-row:2 !important;
    }


    /*
       Οι χρήστες παίρνουν όλο
       τον ενδιάμεσο ελεύθερο χώρο.
    */
    html.parea-android-desktop-v3
    .right > .users-panel > #usersListUI {

        grid-row:3 !important;

        width:100% !important;
        height:auto !important;

        min-width:0 !important;
        min-height:0 !important;

        margin:0 !important;
        padding:0 !important;

        overflow-x:hidden !important;
        overflow-y:auto !important;
    }


    /*
       RADIO κάτω δεξιά.
    */
    html.parea-android-desktop-v3
    .right > .users-panel > #pareaRoomRadio3dV1 {

        grid-row:4 !important;

        position:relative !important;

        top:auto !important;
        right:auto !important;
        bottom:auto !important;
        left:auto !important;

        align-self:end !important;

        width:100% !important;

        margin:0 !important;

        flex:none !important;
    }


    html.parea-android-desktop-v3
    .right > .users-panel > .users-help {

        grid-row:5 !important;

        min-height:0 !important;

        margin:0 !important;
        padding:0 !important;
    }

}

/* ===== END android-v29.css ===== */

/* ===== MIGRATED FROM android-v210.css ===== */
/* PAREACLUB ANDROID V2.10 - RIGHT COLUMN FIX */

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

    html.parea-android-desktop-v3
    .right > .users-panel {

        position:absolute !important;

        inset:0 !important;

        width:auto !important;
        height:auto !important;

        min-width:0 !important;
        min-height:0 !important;

        max-width:none !important;
        max-height:none !important;

        margin:0 !important;
        padding:0 !important;

        transform:none !important;
        translate:none !important;

        align-self:stretch !important;

        display:grid !important;

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

        grid-template-rows:
            auto
            auto
            minmax(0,1fr)
            166px
            0px !important;

        overflow:hidden !important;
    }


    /* Tabs επάνω */
    html.parea-android-desktop-v3
    .right > .users-panel > .tabs {

        grid-row:1 !important;

        position:relative !important;

        top:auto !important;
        bottom:auto !important;

        margin:0 !important;

        transform:none !important;
    }


    /* Τίτλος χρηστών επάνω */
    html.parea-android-desktop-v3
    .right > .users-panel > .panel-title {

        grid-row:2 !important;

        position:relative !important;

        top:auto !important;
        bottom:auto !important;

        margin:0 !important;

        transform:none !important;
    }


    /* Λίστα χρηστών στη μέση */
    html.parea-android-desktop-v3
    .right > .users-panel > #usersListUI {

        grid-row:3 !important;

        position:relative !important;

        width:100% !important;
        height:100% !important;

        min-height:0 !important;

        margin:0 !important;
        padding:0 !important;

        transform:none !important;

        overflow-y:auto !important;
        overflow-x:hidden !important;
    }


    /* Μόνο το Radio κάτω */
    html.parea-android-desktop-v3
    .right > .users-panel > #pareaRoomRadio3dV1 {

        grid-row:4 !important;

        position:relative !important;

        width:100% !important;

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

        margin:0 !important;

        align-self:end !important;

        transform:none !important;
    }


    html.parea-android-desktop-v3
    .right > .users-panel > .users-help {

        grid-row:5 !important;

        height:0 !important;
        min-height:0 !important;

        margin:0 !important;
        padding:0 !important;

        overflow:hidden !important;
    }

}

/* ===== END android-v210.css ===== */


/* =========================================================
   PAREACLUB ANDROID DESKTOP MODE V3
   Virtual desktop: 940px
   Whole interface scales proportionally
========================================================= */

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

    html.parea-android-desktop-v3,
    html.parea-android-desktop-v3 body {
        width:100% !important;
        height:100% !important;

        margin:0 !important;
        padding:0 !important;

        overflow:hidden !important;
    }


    /* =====================================================
       WHOLE VIRTUAL DESKTOP
    ===================================================== */

    html.parea-android-desktop-v3 #mainApp {
        position:fixed !important;

        top:0 !important;
        left:0 !important;

        right:auto !important;
        bottom:auto !important;

        width:var(--parea-v3-width) !important;
        height:var(--parea-v3-height) !important;

        min-width:var(--parea-v3-width) !important;
        max-width:var(--parea-v3-width) !important;

        margin:0 !important;
        padding:0 !important;

        transform:
            scale(var(--parea-v3-scale)) !important;

        transform-origin:
            top left !important;

        overflow:hidden !important;

        background:#07111b !important;
    }


    /* =====================================================
       REMOVE OLD MOBILE UI
    ===================================================== */

    html.parea-android-desktop-v3 #pareaMobileBar,
    html.parea-android-desktop-v3 #pareaMobileToolbar,
    html.parea-android-desktop-v3 #pareaMobileOverlay {
        display:none !important;
    }


    /* =====================================================
       DESKTOP TOPBAR
    ===================================================== */

    html.parea-android-desktop-v3 .topbar {
        position:relative !important;

        top:auto !important;
        left:auto !important;
        right:auto !important;

        width:940px !important;

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

        display:flex !important;
        flex-wrap:nowrap !important;

        align-items:center !important;
        justify-content:space-between !important;

        padding:0 10px !important;
        margin:0 !important;

        box-sizing:border-box !important;

        overflow:hidden !important;
    }

    html.parea-android-desktop-v3
    .topbar .top-actions {
        order:1 !important;

        display:flex !important;
        align-items:center !important;

        gap:7px !important;

        width:auto !important;

        margin:0 auto 0 0 !important;

        overflow:visible !important;
    }

    html.parea-android-desktop-v3
    .topbar .brand {
        order:2 !important;

        margin:0 !important;

        font-size:16px !important;

        white-space:nowrap !important;
    }

    html.parea-android-desktop-v3
    #myUsernameTop {
        display:inline !important;

        font-size:13px !important;
    }

    html.parea-android-desktop-v3
    #logoutBtn,
    html.parea-android-desktop-v3
    #settingsBtn,
    html.parea-android-desktop-v3
    #openDjPlayerBtn {

        display:inline-flex !important;

        width:auto !important;
        min-width:0 !important;

        height:29px !important;
        min-height:29px !important;

        padding:0 11px !important;

        font-size:13px !important;

        white-space:nowrap !important;
    }


    /* =====================================================
       TRUE DESKTOP 3-COLUMN LAYOUT
    ===================================================== */

    html.parea-android-desktop-v3 .layout {
        position:relative !important;

        top:auto !important;
        left:auto !important;
        right:auto !important;
        bottom:auto !important;

        width:940px !important;

        height:
            calc(
                var(--parea-v3-height) - 45px
            ) !important;

        display:grid !important;

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

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

        gap:5px !important;

        padding:5px !important;
        margin:0 !important;

        box-sizing:border-box !important;

        overflow:hidden !important;
    }


    /* =====================================================
       LEFT COLUMN
    ===================================================== */

    html.parea-android-desktop-v3 .left {
        position:relative !important;

        top:auto !important;
        left:auto !important;
        right:auto !important;
        bottom:auto !important;

        width:auto !important;
        height:100% !important;

        min-width:0 !important;
        min-height:0 !important;

        display:grid !important;

        grid-template-rows:
            minmax(260px,1fr)
            295px !important;

        gap:5px !important;

        margin:0 !important;
        padding:0 !important;

        transform:none !important;

        opacity:1 !important;
        visibility:visible !important;

        pointer-events:auto !important;

        overflow:hidden !important;
    }

    html.parea-android-desktop-v3
    .rooms-panel {
        height:100% !important;

        min-height:0 !important;

        display:flex !important;
        flex-direction:column !important;

        overflow:hidden !important;
    }

    html.parea-android-desktop-v3
    #roomList {
        flex:1 1 auto !important;

        min-height:0 !important;

        font-size:14px !important;

        overflow-y:auto !important;
        overflow-x:hidden !important;
    }


    /* =====================================================
       CAMERA - DESKTOP PROPORTIONS
    ===================================================== */

    html.parea-android-desktop-v3
    .camera-panel {
        width:100% !important;

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

        display:flex !important;
        flex-direction:column !important;

        margin:0 !important;
        padding:0 !important;

        overflow:hidden !important;
    }

    html.parea-android-desktop-v3
    .camera-user {
        height:30px !important;
        min-height:30px !important;

        padding:0 7px !important;

        font-size:14px !important;
    }

    html.parea-android-desktop-v3
    .camera-box {
        flex:1 1 auto !important;

        width:100% !important;

        height:auto !important;
        min-height:145px !important;
        max-height:none !important;

        overflow:hidden !important;
    }

    html.parea-android-desktop-v3
    .camera-box video,
    html.parea-android-desktop-v3
    #cameraPlaceholder {

        width:100% !important;
        height:100% !important;

        min-height:145px !important;
        max-height:none !important;

        object-fit:cover !important;
    }

    html.parea-android-desktop-v3
    .camera-panel .media-row {

        display:flex !important;

        height:42px !important;
        min-height:42px !important;

        gap:5px !important;

        padding:4px !important;
    }

    html.parea-android-desktop-v3
    #cameraBtn,
    html.parea-android-desktop-v3
    #micBtn,
    html.parea-android-desktop-v3
    #mobileCameraSwitchBtn {

        width:auto !important;
        min-width:0 !important;

        height:34px !important;
        min-height:34px !important;

        padding:0 8px !important;

        font-size:13px !important;
    }

    html.parea-android-desktop-v3
    .camera-panel .volume-row,
    html.parea-android-desktop-v3
    #volumeSlider,
    html.parea-android-desktop-v3
    #volumeValue {
        display:none !important;
    }


    /* =====================================================
       NORMAL DESKTOP PANEL TITLES
    ===================================================== */

    html.parea-android-desktop-v3
    .panel-title {
        height:30px !important;
        min-height:30px !important;

        padding:0 8px !important;

        font-size:14px !important;
    }


    /* =====================================================
       CENTER CHAT
    ===================================================== */

    html.parea-android-desktop-v3
    main.center,
    html.parea-android-desktop-v3
    .center {

        position:relative !important;

        top:auto !important;
        left:auto !important;
        right:auto !important;
        bottom:auto !important;

        display:block !important;

        width:auto !important;
        height:100% !important;

        min-width:0 !important;
        min-height:0 !important;

        margin:0 !important;
        padding:0 !important;

        transform:none !important;

        overflow:hidden !important;
    }

    html.parea-android-desktop-v3
    .chat-panel {

        width:100% !important;
        height:100% !important;

        min-width:0 !important;
        min-height:0 !important;

        display:flex !important;
        flex-direction:column !important;

        overflow:hidden !important;
    }

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

        flex:1 1 0 !important;

        min-width:0 !important;
        min-height:0 !important;

        overflow-y:auto !important;
        overflow-x:hidden !important;
    }


    /* =====================================================
       CHAT TOOLBAR
       Desktop-like multi-row toolbar
    ===================================================== */

    html.parea-android-desktop-v3
    .toolbar {

        flex:0 0 auto !important;

        display:flex !important;
        flex-wrap:wrap !important;

        align-items:center !important;

        gap:4px !important;

        width:100% !important;

        padding:4px !important;

        box-sizing:border-box !important;

        overflow:visible !important;
    }

    html.parea-android-desktop-v3
    .toolbar button,
    html.parea-android-desktop-v3
    .toolbar select {

        width:auto !important;
        min-width:0 !important;

        height:27px !important;
        min-height:27px !important;

        padding:0 7px !important;

        font-size:12px !important;

        white-space:nowrap !important;
    }

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

        flex:0 0 46px !important;

        width:100% !important;

        height:46px !important;
        min-height:46px !important;

        display:flex !important;
        align-items:center !important;

        gap:5px !important;

        padding:4px !important;

        box-sizing:border-box !important;
    }

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

        flex:1 1 auto !important;

        width:auto !important;
        min-width:0 !important;

        height:36px !important;

        font-size:14px !important;
    }

    html.parea-android-desktop-v3
    #form button {

        flex:0 0 auto !important;

        width:auto !important;
        min-width:105px !important;

        height:36px !important;

        padding:0 12px !important;

        font-size:13px !important;
    }


    /* =====================================================
       RIGHT COLUMN
    ===================================================== */

    html.parea-android-desktop-v3
    .right {

        position:relative !important;

        top:auto !important;
        left:auto !important;
        right:auto !important;
        bottom:auto !important;

        width:auto !important;
        height:100% !important;

        min-width:0 !important;
        min-height:0 !important;

        margin:0 !important;
        padding:0 !important;

        transform:none !important;

        opacity:1 !important;
        visibility:visible !important;

        pointer-events:auto !important;

        overflow:hidden !important;
    }


    /*
       Users top / radio bottom.
       Radio row collapses automatically
       when radio is display:none.
    */
    html.parea-android-desktop-v3
    .right > .users-panel {

        position:relative !important;

        inset:auto !important;

        width:100% !important;
        height:100% !important;

        min-width:0 !important;
        min-height:0 !important;

        max-width:none !important;
        max-height:none !important;

        display:grid !important;

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

        grid-template-rows:
            auto
            auto
            minmax(0,1fr)
            auto
            0px !important;

        margin:0 !important;
        padding:0 !important;

        transform:none !important;

        overflow:hidden !important;
    }

    html.parea-android-desktop-v3
    .right > .users-panel > .tabs {

        grid-row:1 !important;

        position:relative !important;

        margin:0 !important;
        transform:none !important;
    }

    html.parea-android-desktop-v3
    .right > .users-panel > .panel-title {

        grid-row:2 !important;

        position:relative !important;

        margin:0 !important;
        transform:none !important;
    }

    html.parea-android-desktop-v3
    .right > .users-panel > #usersListUI {

        grid-row:3 !important;

        position:relative !important;

        width:100% !important;
        height:auto !important;

        min-width:0 !important;
        min-height:0 !important;

        max-height:none !important;

        margin:0 !important;
        padding:0 !important;

        font-size:14px !important;

        transform:none !important;

        overflow-y:auto !important;
        overflow-x:hidden !important;
    }


    /* =====================================================
       PAREA RADIO - DESKTOP SIZE
    ===================================================== */

    html.parea-android-desktop-v3
    .right > .users-panel >
    #pareaRoomRadio3dV1 {

        grid-row:4 !important;

        position:relative !important;

        top:auto !important;
        left:auto !important;
        right:auto !important;
        bottom:auto !important;

        width:100% !important;

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

        margin:0 !important;

        padding:9px !important;

        align-self:end !important;

        box-sizing:border-box !important;

        transform:none !important;

        overflow:hidden !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-top {

        min-height:24px !important;

        margin-bottom:6px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-brand {

        font-size:11px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-onair {

        padding:4px 7px !important;

        font-size:9px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-screen {

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

        min-height:54px !important;

        padding:8px !important;

        margin-bottom:7px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-disc {

        width:40px !important;
        height:40px !important;
    }

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

        font-size:12px !important;
    }

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

        height:30px !important;

        padding:4px 7px !important;

        margin-bottom:6px !important;

        font-size:10px !important;
    }

    html.parea-android-desktop-v3
    #pareaRoomRadio3dV1
    .parea-room-radio-controls {

        min-height:30px !important;
    }

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

        width:34px !important;
        height:30px !important;

        min-height:30px !important;

        font-size:12px !important;
    }

    html.parea-android-desktop-v3
    .right > .users-panel >
    .users-help {

        grid-row:5 !important;

        height:0 !important;
        min-height:0 !important;

        margin:0 !important;
        padding:0 !important;

        overflow:hidden !important;
    }


    /* =====================================================
       TABS
    ===================================================== */

    html.parea-android-desktop-v3
    .users-panel .tabs {

        min-height:30px !important;

        overflow:hidden !important;
    }

    html.parea-android-desktop-v3
    .users-panel .tab {

        height:28px !important;
        min-height:28px !important;

        padding:0 7px !important;

        font-size:11px !important;

        white-space:nowrap !important;
    }

}


/* PAREACLUB ANDROID DESKTOP V3.1 HIDE TOP USERNAME */

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

    html.parea-android-desktop-v3 #myUsernameTop {
        display:none !important;
    }

}


/* =========================================================
   PAREACLUB ZOOM ENGINE CLEANUP V1

   Legacy V3.2 + V3.4 removed.
   Native browser pinch/pan is controlled only by
   ANDROID DESKTOP NATIVE VIEWPORT FINAL V1 below.
========================================================= */

/* =========================================================
   PAREACLUB ANDROID DESKTOP NATIVE VIEWPORT FINAL V1

   Canonical mobile desktop viewport.
   Replaces legacy V3.7 + V3.9 layers.
   Browser handles native pinch zoom and page pan.
========================================================= */

html.parea-android-desktop-v3,
html.parea-android-desktop-v3 body {

    width:940px !important;
    min-width:940px !important;

    height:var(--parea-v3-height) !important;
    min-height:var(--parea-v3-height) !important;
    max-height:var(--parea-v3-height) !important;

    margin:0 !important;
    padding:0 !important;

    overflow:auto !important;

    touch-action:auto !important;
    overscroll-behavior:auto !important;

    -webkit-overflow-scrolling:touch !important;
}


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

    position:relative !important;

    top:auto !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;

    width:940px !important;
    min-width:940px !important;
    max-width:940px !important;

    height:var(--parea-v3-height) !important;
    min-height:var(--parea-v3-height) !important;
    max-height:var(--parea-v3-height) !important;

    transform:none !important;
    transform-origin:initial !important;

    zoom:1 !important;

    will-change:auto !important;
    backface-visibility:visible !important;

    touch-action:auto !important;

    overflow:hidden !important;
}


html.parea-android-desktop-v3 .layout,
html.parea-android-desktop-v3 .left,
html.parea-android-desktop-v3 .center,
html.parea-android-desktop-v3 .right {

    transform:none !important;

    will-change:auto !important;
    backface-visibility:visible !important;
}


html.parea-android-desktop-v3 #messages,
html.parea-android-desktop-v3 #roomList,
html.parea-android-desktop-v3 #usersListUI {

    touch-action:auto !important;
    overscroll-behavior:auto !important;
}


/* =========================================================
   PAREACLUB ANDROID DESKTOP V3.11
   PREMIUM TOP ACTION BUTTONS
========================================================= */

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

    html.parea-android-desktop-v3
    .topbar {

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

        padding:0 10px !important;

        border-bottom:
            1px solid rgba(218,170,0,.55) !important;

        background:
            linear-gradient(
                180deg,
                #071522 0%,
                #06101a 100%
            ) !important;
    }


    html.parea-android-desktop-v3
    .layout {

        height:
            calc(
                var(--parea-v3-height) - 58px
            ) !important;
    }


    html.parea-android-desktop-v3
    .topbar .top-actions {

        gap:10px !important;

        display:flex !important;
        align-items:center !important;

        overflow:visible !important;
    }


    /* =====================================================
       ΚΟΙΝΟ PREMIUM STYLE
    ===================================================== */

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

    html.parea-android-desktop-v3
    #settingsBtn,

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

        position:relative !important;

        height:42px !important;
        min-height:42px !important;

        padding:0 15px !important;

        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;

        gap:0 !important;

        border:
            1.5px solid #d6a800 !important;

        border-radius:
            11px !important;

        background:
            linear-gradient(
                180deg,
                #102a43 0%,
                #081827 48%,
                #050d16 100%
            ) !important;

        color:
            #f5f8ff !important;

        font-size:
            0 !important;

        font-weight:
            600 !important;

        letter-spacing:
            .2px !important;

        white-space:
            nowrap !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.12),
            inset 0 -1px 0 rgba(0,0,0,.8),
            0 0 0 1px rgba(0,0,0,.8),
            0 0 10px rgba(255,190,0,.10) !important;

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


    /* =====================================================
       ΜΕΓΕΘΗ
    ===================================================== */

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

        min-width:
            145px !important;
    }


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

        min-width:
            175px !important;
    }


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

        min-width:
            185px !important;
    }


    /* =====================================================
       ICONS
    ===================================================== */

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

        content:"🚪";

        font-size:21px !important;

        margin-right:
            10px;

        filter:
            drop-shadow(
                0 0 4px rgba(0,180,255,.8)
            );
    }


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

        content:"⚙️";

        font-size:22px !important;

        margin-right:
            10px;

        filter:
            drop-shadow(
                0 0 5px rgba(0,190,255,.85)
            );
    }


    html.parea-android-desktop-v3
    #openDjPlayerBtn::before {

        content:"🎧";

        font-size:22px !important;

        margin-right:
            10px;

        filter:
            drop-shadow(
                0 0 5px rgba(0,190,255,.85)
            );
    }


    /* =====================================================
       TEXT
    ===================================================== */

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

        content:"Έξοδος";

        font-size:
            17px !important;
    }


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

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

        font-size:
            17px !important;
    }


    html.parea-android-desktop-v3
    #openDjPlayerBtn::after {

        content:"DJ Player";

        font-size:
            17px !important;
    }


    /* =====================================================
       TOUCH EFFECT
    ===================================================== */

    html.parea-android-desktop-v3
    #logoutBtn:active,

    html.parea-android-desktop-v3
    #settingsBtn:active,

    html.parea-android-desktop-v3
    #openDjPlayerBtn:active {

        background:
            linear-gradient(
                180deg,
                #173b5e 0%,
                #0b2135 100%
            ) !important;

        border-color:
            #ffd12a !important;

        box-shadow:
            inset 0 0 8px rgba(0,180,255,.20),
            0 0 12px rgba(255,196,0,.22) !important;
    }

}

/* =========================================================
   PAREACLUB ANDROID V3.11.1
   PREMIUM TOP BUTTON ICON ALIGNMENT FIX
========================================================= */

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

    html.parea-android-desktop-v3
    #logoutBtn::before,

    html.parea-android-desktop-v3
    #settingsBtn::before,

    html.parea-android-desktop-v3
    #openDjPlayerBtn::before {

        position:static !important;

        top:auto !important;
        left:auto !important;
        right:auto !important;
        bottom:auto !important;

        inset:auto !important;

        display:inline-flex !important;

        align-items:center !important;
        justify-content:center !important;

        flex:0 0 auto !important;

        width:auto !important;
        height:auto !important;

        transform:none !important;

        opacity:1 !important;

        background:none !important;

        border:0 !important;

        pointer-events:none !important;
    }


    html.parea-android-desktop-v3
    #logoutBtn::after,

    html.parea-android-desktop-v3
    #settingsBtn::after,

    html.parea-android-desktop-v3
    #openDjPlayerBtn::after {

        position:static !important;

        top:auto !important;
        left:auto !important;
        right:auto !important;
        bottom:auto !important;

        inset:auto !important;

        display:inline-block !important;

        width:auto !important;
        height:auto !important;

        transform:none !important;

        opacity:1 !important;

        background:none !important;

        border:0 !important;

        pointer-events:none !important;
    }


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

    html.parea-android-desktop-v3
    #settingsBtn,

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

        justify-content:center !important;

        column-gap:10px !important;

        overflow:hidden !important;
    }


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

        margin:0 !important;

        content:"🚪";
    }


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

        margin:0 !important;

        content:"⚙️";
    }


    html.parea-android-desktop-v3
    #openDjPlayerBtn::before {

        margin:0 !important;

        content:"🎧";
    }

}


/* =========================================================
   PAREACLUB ANDROID STABLE LAYOUT HEIGHT V1

   IMPORTANT:
   Never use 100vh / 100dvh for the main 3-column layout.

   Chrome changes dynamic viewport units during pinch zoom.
   The layout must always follow the already-stable
   --parea-v3-height used by #mainApp.
========================================================= */

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

    html.parea-android-desktop-v3 .layout {

        height:
            calc(
                var(--parea-v3-height) - 45px
            ) !important;

        min-height:
            calc(
                var(--parea-v3-height) - 45px
            ) !important;

        max-height:
            calc(
                var(--parea-v3-height) - 45px
            ) !important;
    }


    html.parea-android-desktop-v3 .left,
    html.parea-android-desktop-v3 .center,
    html.parea-android-desktop-v3 .right {

        height:100% !important;
        min-height:0 !important;
        max-height:100% !important;

        overflow:hidden !important;
    }
}


/* =========================================================
   PAREACLUB CAMERA CONTROLS ONE ROW V1

   Normal:
   ⚙️  📹  🎤

   TALK available:
   ⚙️  📹  🎙  🎤
========================================================= */

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

    html.parea-android-desktop-v3
    .camera-panel .media-row {

        display:flex !important;
        flex-direction:row !important;
        flex-wrap:nowrap !important;

        align-items:center !important;
        justify-content:stretch !important;

        gap:4px !important;

        width:100% !important;

        padding:3px !important;

        box-sizing:border-box !important;

        overflow:hidden !important;
    }


    html.parea-android-desktop-v3
    .camera-panel .media-row
    #openCamSettings,

    html.parea-android-desktop-v3
    .camera-panel .media-row
    #cameraBtn,

    html.parea-android-desktop-v3
    .camera-panel .media-row
    #talkBtn,

    html.parea-android-desktop-v3
    .camera-panel .media-row
    #micBtn {

        position:relative !important;

        flex:1 1 0 !important;

        width:auto !important;
        min-width:0 !important;
        max-width:none !important;

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

        margin:0 !important;
        padding:0 3px !important;

        box-sizing:border-box !important;

        left:auto !important;
        right:auto !important;
        top:auto !important;
        bottom:auto !important;

        grid-column:auto !important;
        grid-row:auto !important;
    }


    /* ΣΕΙΡΑ */

    html.parea-android-desktop-v3
    #openCamSettings {
        order:1 !important;
    }

    html.parea-android-desktop-v3
    #cameraBtn {
        order:2 !important;
    }

    html.parea-android-desktop-v3
    #talkBtn {
        order:3 !important;
    }

    html.parea-android-desktop-v3
    #micBtn {
        order:4 !important;
    }


    /* ==========================================
       CAMERA / TALK / MIC = ICON ONLY
    ========================================== */

    html.parea-android-desktop-v3
    #cameraBtn,

    html.parea-android-desktop-v3
    #talkBtn,

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

        font-size:0 !important;

        text-align:center !important;
    }


    html.parea-android-desktop-v3
    #cameraBtn > *,

    html.parea-android-desktop-v3
    #talkBtn > *,

    html.parea-android-desktop-v3
    #micBtn > * {

        display:none !important;
    }


    html.parea-android-desktop-v3
    #cameraBtn::before {

        content:"📹";

        font-size:18px !important;
        line-height:1 !important;
    }


    html.parea-android-desktop-v3
    #talkBtn::before {

        content:"🎙";

        font-size:18px !important;
        line-height:1 !important;
    }


    html.parea-android-desktop-v3
    #micBtn::before {

        content:"🎤";

        font-size:18px !important;
        line-height:1 !important;
    }
}


/* =========================================================
   PAREACLUB VOLUME BAR FIX V1
   Τελικό override για το desktop camera panel.
========================================================= */

html.parea-android-desktop-v3 .camera-panel .volume-row {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    width: 100% !important;
    min-height: 34px !important;
    box-sizing: border-box !important;
}

html.parea-android-desktop-v3 .camera-panel #volumeSlider {
    display: block !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 70px !important;
    height: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    cursor: pointer !important;
    accent-color: #ffb800 !important;
}

html.parea-android-desktop-v3 .camera-panel #volumeSlider::-webkit-slider-runnable-track {
    height: 6px !important;
    border-radius: 999px !important;
    background: #303846 !important;
}

html.parea-android-desktop-v3 .camera-panel #volumeSlider::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 15px !important;
    height: 15px !important;
    margin-top: -5px !important;
    border-radius: 50% !important;
    border: 2px solid #ffe07a !important;
    background: #ffb800 !important;
}

html.parea-android-desktop-v3 .camera-panel #volumeSlider::-moz-range-track {
    height: 6px !important;
    border-radius: 999px !important;
    background: #303846 !important;
}

html.parea-android-desktop-v3 .camera-panel #volumeSlider::-moz-range-thumb {
    width: 15px !important;
    height: 15px !important;
    border-radius: 50% !important;
    border: 2px solid #ffe07a !important;
    background: #ffb800 !important;
}

html.parea-android-desktop-v3 .camera-panel #volumeValue {
    display: block !important;
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    text-align: right !important;
    color: #ffb800 !important;
    font-weight: 700 !important;
    font-size: 12px !important;
}