
/* =========================================================

   PDR SZERENCSEKERÉK MULTIPLAYER UI v0.7.1

   ========================================================= */



#pdrsk-app.pdrsk-mp-active .pdrsk-controls,

#pdrsk-app.pdrsk-mp-active .pdrsk-player-panel {

    display: none !important;

}



.pdrsk-mp-lobby {

    position: relative;

    z-index: 20;

    margin: 0 0 16px;

    padding: 14px;

    border: 1px solid rgba(255,105,15,.42);

    border-radius: 16px;

    background:

        radial-gradient(circle at 50% 0, rgba(255,95,0,.14), transparent 60%),

        linear-gradient(180deg, rgba(24,15,10,.97), rgba(7,7,8,.98));

    box-shadow:

        inset 0 1px 0 rgba(255,255,255,.05),

        0 10px 28px rgba(0,0,0,.25);

}



.pdrsk-mp-lobby-title {

    text-align: center;

    font-weight: 900;

    color: #fff;

    font-size: 16px;

    margin-bottom: 10px;

}



.pdrsk-mp-start-row,

.pdrsk-mp-join-row,

.pdrsk-mp-room-row {

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    align-items: center;

    gap: 8px;

}



.pdrsk-mp-start-row {

    margin-bottom: 10px;

}



.pdrsk-mp-lobby button,

.pdrsk-mp-actions button,

.pdrsk-mp-modal button {

    border: 0;

    border-radius: 11px;

    padding: 10px 14px;

    cursor: pointer;

    color: #fff;

    font-weight: 900;

    background:

        linear-gradient(180deg,#4a4a4d,#19191b);

    box-shadow:

        inset 0 1px 0 rgba(255,255,255,.15),

        0 6px 14px rgba(0,0,0,.32);

}



.pdrsk-mp-lobby button.mp-primary,

.pdrsk-mp-actions button.mp-primary,

.pdrsk-mp-modal button.mp-primary {

    background:

        linear-gradient(180deg,#ff812f,#c23a00);

}



.pdrsk-mp-lobby button:disabled,

.pdrsk-mp-actions button:disabled {

    opacity: .35;

    cursor: not-allowed;

}



.pdrsk-mp-code {

    width: 118px;

    height: 42px;

    border-radius: 10px;

    border: 1px solid rgba(255,255,255,.18);

    background: #080808;

    color: #fff;

    text-transform: uppercase;

    text-align: center;

    font-size: 17px;

    font-weight: 900;

    letter-spacing: 2px;

}



.pdrsk-mp-room-code {

    color: #ff7b22;

    font-weight: 1000;

    letter-spacing: 2px;

}



.pdrsk-mp-share {

    font-size: 11px;

}



.pdrsk-mp-players {

    display: grid;

    grid-template-columns: repeat(3,minmax(0,1fr));

    gap: 10px;

    margin: 14px 0 12px;

}



.pdrsk-mp-player {

    min-width: 0;

    display: flex;

    align-items: center;

    gap: 9px;

    padding: 10px;

    border: 1px solid rgba(255,255,255,.09);

    border-radius: 13px;

    background:

        linear-gradient(180deg,rgba(30,30,32,.94),rgba(9,9,10,.98));

}



.pdrsk-mp-player.is-current {

    border-color: rgba(255,112,22,.85);

    box-shadow:

        0 0 18px rgba(255,92,0,.18),

        inset 0 0 0 1px rgba(255,130,40,.14);

}



.pdrsk-mp-player-avatar {

    width: 43px;

    height: 43px;

    flex: 0 0 43px;

    border-radius: 50%;

    overflow: hidden;

    background: #1b1b1b;

    border: 2px solid rgba(255,104,20,.55);

}



.pdrsk-mp-player-avatar img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.pdrsk-mp-player-info {

    min-width: 0;

    flex: 1 1 auto;

}



.pdrsk-mp-player-name {

    color: #fff;

    font-size: 13px;

    font-weight: 900;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}



.pdrsk-mp-player-score {

    margin-top: 2px;

    color: #ff7920;

    font-size: 12px;

    font-weight: 900;

}



.pdrsk-mp-turn {

    margin-top: 2px;

    color: #7aff9c;

    font-size: 10px;

    font-weight: 900;

}



.pdrsk-mp-actions {

    display: flex;

    flex-wrap: wrap;

    gap: 8px;

    align-items: center;

    margin-top: 14px;

    padding: 12px;

    border: 1px solid rgba(255,100,15,.25);

    border-radius: 14px;

    background: rgba(0,0,0,.38);

}



.pdrsk-mp-letter {

    width: 66px;

    height: 43px;

    border-radius: 10px;

    border: 1px solid rgba(255,255,255,.22);

    background: #070707;

    color: #fff;

    text-align: center;

    font-size: 22px;

    font-weight: 1000;

    text-transform: uppercase;

}



.pdrsk-mp-wallet {

    margin-left: auto;

    padding: 8px 11px;

    border-radius: 10px;

    background: rgba(255,100,0,.08);

    border: 1px solid rgba(255,110,15,.24);

    color: #bbb;

    font-size: 11px;

}



.pdrsk-mp-wallet b {

    color: #ff7920;

    font-size: 17px;

}



.pdrsk-mp-viewer {

    color: #ffb47d;

    font-weight: 900;

    font-size: 12px;

}



#pdrsk-app.pdrsk-mp-active .pdrsk-letter.mp-open {

    color: #111 !important;

    background:

        linear-gradient(180deg,#fff,#d9d9dc) !important;

    box-shadow:

        inset 0 1px 0 #fff,

        0 5px 10px rgba(0,0,0,.35) !important;

}



#pdrsk-app.pdrsk-mp-active .pdrsk-letter.mp-punct {

    background: transparent !important;

    border: 0 !important;

    box-shadow: none !important;

    color: #fff !important;

}



.pdrsk-mp-modal-backdrop {

    display: none;

    position: fixed;

    z-index: 999999;

    inset: 0;

    padding: 20px;

    align-items: center;

    justify-content: center;

    background: rgba(0,0,0,.72);

    backdrop-filter: blur(4px);

}



.pdrsk-mp-modal-backdrop.is-open {

    display: flex;

}



.pdrsk-mp-modal {

    width: min(92vw,520px);

    padding: 20px;

    border-radius: 20px;

    border: 1px solid rgba(255,105,15,.5);

    background:

        radial-gradient(circle at 50% 0,rgba(255,90,0,.18),transparent 55%),

        linear-gradient(180deg,#1b1b1e,#09090a);

    box-shadow: 0 25px 75px rgba(0,0,0,.55);

}



.pdrsk-mp-modal h3 {

    margin: 0 0 7px;

    color: #fff;

}



.pdrsk-mp-modal p {

    color: #bbb;

    font-size: 13px;

}



.pdrsk-mp-vowels {

    display: grid;

    grid-template-columns: repeat(7,1fr);

    gap: 7px;

    margin-top: 12px;

}



.pdrsk-mp-vowels button {

    padding: 11px 3px;

    font-size: 17px;

}



.pdrsk-mp-solve-input {

    box-sizing: border-box;

    width: 100%;

    height: 50px;

    margin: 8px 0 12px;

    border: 1px solid rgba(255,120,20,.4);

    border-radius: 11px;

    padding: 0 13px;

    background: #070707;

    color: #fff;

    font-size: 16px;

}



.pdrsk-mp-modal-actions {

    display: flex;

    justify-content: flex-end;

    gap: 8px;

}



@media(max-width:800px) {



    .pdrsk-mp-players {

        grid-template-columns: 1fr;

    }



    .pdrsk-mp-wallet {

        width: 100%;

        margin-left: 0;

        text-align: center;

    }



    .pdrsk-mp-vowels {

        grid-template-columns: repeat(5,1fr);

    }

}






/* =========================================================

   PDRSK SIMPLE LOBBY v0.7.2

   ========================================================= */





/*

 * Kód / link / kézi szoba nyitás eltűnik.

 */



#pdrsk-mp-lobby .pdrsk-mp-join-row,

#pdrsk-mp-lobby #pdrsk-mp-room-row {

    display: none !important;

}





.pdrsk-mp-discovery {

    width: 100%;

    margin-top: 12px;

}





.pdrsk-disc-heading {

    margin: 5px 0 10px;

    color: #ddd;

    text-align: center;

    font-size: 12px;

    font-weight: 900;

}





.pdrsk-disc-list {

    display: flex;

    flex-direction: column;

    gap: 8px;

}





.pdrsk-disc-game {

    display: flex;

    align-items: center;

    gap: 12px;

    min-height: 62px;

    padding: 9px 11px;

    border-radius: 13px;

    border: 1px solid rgba(255,255,255,.09);

    background:

        linear-gradient(

            180deg,

            rgba(35,24,18,.97),

            rgba(10,10,11,.98)

        );

}





.pdrsk-disc-game.is-mine {

    border-color: rgba(255,105,15,.68);

    box-shadow:

        inset 0 0 0 1px rgba(255,110,20,.08),

        0 7px 18px rgba(0,0,0,.25);

}





.pdrsk-disc-main {

    min-width: 0;

    flex: 1 1 auto;

}





.pdrsk-disc-people {

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 7px;

}





.pdrsk-disc-player {

    display: inline-flex;

    align-items: center;

    gap: 6px;

    color: #fff;

    font-size: 13px;

}





.pdrsk-disc-player img,

.pdrsk-disc-avatar-fallback {

    width: 32px;

    height: 32px;

    flex: 0 0 32px;

    border-radius: 50%;

    object-fit: cover;

    border: 1px solid rgba(255,108,20,.75);

    background: #191919;

}





.pdrsk-disc-avatar-fallback {

    display: inline-flex;

    align-items: center;

    justify-content: center;

}





.pdrsk-disc-plus {

    color: #777;

    font-weight: 900;

}





.pdrsk-disc-meta {

    display: flex;

    flex-wrap: wrap;

    gap: 7px;

    align-items: center;

    margin-top: 6px;

}





.pdrsk-disc-status {

    display: inline-flex;

    align-items: center;

    min-height: 20px;

    padding: 2px 7px;

    border-radius: 20px;

    font-size: 9px;

    font-weight: 1000;

    letter-spacing: .4px;

}





.pdrsk-disc-status.is-waiting {

    color: #ffe3a5;

    border: 1px solid rgba(255,175,0,.35);

    background: rgba(255,175,0,.08);

}





.pdrsk-disc-status.is-playing {

    color: #74ff98;

    border: 1px solid rgba(50,255,110,.28);

    background: rgba(30,255,100,.07);

}





.pdrsk-disc-count {

    color: #999;

    font-size: 10px;

}





.pdrsk-disc-action {

    flex: 0 0 auto;

    border: 0;

    border-radius: 10px;

    padding: 10px 13px;

    cursor: pointer;

    color: #fff;

    font-size: 11px;

    font-weight: 1000;

    background:

        linear-gradient(

            180deg,

            #444,

            #181818

        );

    box-shadow:

        inset 0 1px 0 rgba(255,255,255,.14),

        0 5px 12px rgba(0,0,0,.28);

}





.pdrsk-disc-action.is-join {

    background:

        linear-gradient(

            180deg,

            #ff812f,

            #c83b00

        );

}





.pdrsk-disc-action:disabled {

    opacity: .45;

    cursor: wait;

}





.pdrsk-disc-empty {

    padding: 12px;

    border: 1px dashed rgba(255,255,255,.12);

    border-radius: 11px;

    text-align: center;

    color: #858585;

    font-size: 12px;

}





.pdrsk-disc-login {

    color: #888;

    font-size: 10px;

}





@media(max-width:620px) {



    .pdrsk-disc-game {

        flex-direction: column;

        align-items: stretch;

    }





    .pdrsk-disc-action,

    .pdrsk-disc-login {

        width: 100%;

        text-align: center;

    }



}






/* =========================================================

   PDRSK CORE VIEWERS SHARE V095

   ========================================================= */





#pdrsk-app .pdrsk-core-viewers {

    box-sizing:border-box;

    width:100%;

    margin:8px 0;

    padding:7px 9px;

    border:1px solid rgba(255,100,15,.48);

    border-radius:10px;

    background:rgba(8,8,9,.92);

}





#pdrsk-app .pdrsk-core-viewers-head {

    display:flex;

    align-items:center;

    gap:7px;

    margin:0 0 6px;

    color:#ff762e;

    font-size:10px;

    font-weight:900;

}





#pdrsk-app .pdrsk-core-viewers-head strong {

    display:inline-flex;

    align-items:center;

    justify-content:center;

    min-width:18px;

    height:18px;

    padding:0 5px;

    border-radius:999px;

    background:#f25b12;

    color:#fff;

    font-size:9px;

}





#pdrsk-app .pdrsk-core-viewer-list {

    display:flex;

    flex-wrap:wrap;

    gap:6px;

}





#pdrsk-app .pdrsk-core-viewer {

    display:inline-flex;

    align-items:center;

    gap:5px;

    padding:3px 8px 3px 3px;

    border:1px solid rgba(255,255,255,.08);

    border-radius:999px;

    background:#111;

    color:#eee;

    font-size:10px;

}





#pdrsk-app .pdrsk-core-viewer img {

    width:24px;

    height:24px;

    border-radius:50%;

    object-fit:cover;

    border:1px solid rgba(255,100,15,.75);

}





#pdrsk-app .pdrsk-core-viewer-empty {

    color:#777;

    font-size:10px;

}





#pdrsk-app .pdrsk-core-share {

    margin:10px 0 8px;

}





#pdrsk-app #pdrsk-core-facebook {

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:9px;

    min-height:42px;

    padding:8px 16px;

    border:1px solid #75a9ff;

    border-radius:11px;

    background:linear-gradient(180deg,#3287ef,#1766c8 55%,#0d4898);

    box-shadow:

        0 5px 0 #07336f,

        0 9px 18px rgba(0,0,0,.42),

        inset 0 1px 0 rgba(255,255,255,.32);

    color:#fff;

    cursor:pointer;

    font-size:11px;

    font-weight:900;

    text-shadow:0 1px 1px rgba(0,0,0,.55);

}





#pdrsk-app #pdrsk-core-facebook span {

    display:inline-flex;

    align-items:center;

    justify-content:center;

    width:22px;

    height:22px;

    border-radius:5px;

    background:#fff;

    color:#1877f2;

    font-family:Arial,sans-serif;

    font-size:20px;

    font-weight:900;

}





#pdrsk-app #pdrsk-core-facebook:disabled {

    opacity:.55;

    cursor:wait;

}





@media(max-width:620px) {



    #pdrsk-app #pdrsk-core-facebook {

        width:100%;

    }

}







/*

 * ==========================================================

 * PDRSK DISCOVERY WATCH CENTER V0100

 *

 * Csak a játékon belüli / lobby aktív játék

 * NÉZEM ÉLŐBEN gombja.

 * Az infobarhoz NEM nyúl.

 * ==========================================================

 */



@media (min-width: 621px) {



    #pdrsk-app

    .pdrsk-disc-game {



        position:

            relative;

    }





    #pdrsk-app

    .pdrsk-disc-action[data-pdrsk-game-action="watch"] {



        position:

            absolute !important;



        left:

            50% !important;



        right:

            auto !important;



        margin:

            0 !important;



        transform:

            translateX(-50%) !important;



        z-index:

            3;

    }

}









/*

 * ==========================================================

 * PDRSK DISCOVERY WATCH CENTER FINAL V011

 *

 * Kizárólag a szürke NÉZEM ÉLŐBEN gomb.

 * A narancssárga csatlakozás gombhoz nem nyúl.

 * Az infobarhoz nem nyúl.

 * ==========================================================

 */



@media (min-width: 621px) {



    #pdrsk-app .pdrsk-disc-game {

        position: relative !important;

    }



    /*

     * A játékhoz csatlakozó gomb .is-join osztályú.

     * Minden más discovery action a szürke megnyitás /

     * NÉZEM ÉLŐBEN gomb.

     */

    #pdrsk-app

    .pdrsk-disc-game

    button.pdrsk-disc-action:not(.is-join) {



        position: absolute !important;



        left: 50% !important;

        right: auto !important;



        top: 50% !important;



        margin: 0 !important;



        transform:

            translate(-50%, -50%) !important;



        z-index: 20 !important;

    }

}








/*

 * PDRSK_SAFE_FACEBOOK_V09111

 */

#pdrsk-app #pdrsk-facebook-safe-v09111 {

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:7px;

    min-height:40px;

    border:0;

    border-radius:10px;

    padding:0 15px;

    background:#1877f2;

    color:#fff;

    font-weight:900;

    cursor:pointer;

    white-space:nowrap;

}



#pdrsk-app #pdrsk-facebook-safe-v09111 span {

    display:inline-flex;

    align-items:center;

    justify-content:center;

    width:20px;

    height:20px;

    border-radius:4px;

    background:#fff;

    color:#1877f2;

    font-family:Arial,sans-serif;

    font-size:18px;

    font-weight:900;

}



@media(max-width:620px) {

    #pdrsk-app #pdrsk-facebook-safe-v09111 {

        width:100%;

    }

}


