
/* =========================================================
   LUMINA SHARED UI
   Tek alt bar + bilgi + dil
   ========================================================= */

[hidden]{
    display:none !important;
}

body.lumina-modal-open{
    overflow:hidden !important;
}


/* ---------------------------------------------------------
   BAR
--------------------------------------------------------- */

.lumina-shared-dock{
    z-index:9990 !important;
}

.lumina-shared-dock button,
.lumina-shared-dock a{
    appearance:none;
    -webkit-appearance:none;
    cursor:pointer;
}


/* ---------------------------------------------------------
   MODAL LAYER
--------------------------------------------------------- */

#infoModal,
#langModal{
    position:fixed !important;
    inset:0 !important;
    z-index:10000 !important;
}

#infoModal .info-modal__backdrop,
.lumina-lang-backdrop{
    position:absolute !important;
    inset:0 !important;
    background:rgba(3,8,5,.68) !important;
    backdrop-filter:blur(7px);
    -webkit-backdrop-filter:blur(7px);
}


/* ---------------------------------------------------------
   INFO
--------------------------------------------------------- */

#infoModal .info-modal__sheet{
    position:absolute !important;
    left:50% !important;
    bottom:0 !important;
    transform:translateX(-50%) !important;

    width:min(540px,100%) !important;
    max-height:90dvh !important;

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

    overflow:hidden !important;

    background:#0e1712 !important;
    color:#eef4ef !important;

    border:1px solid rgba(177,207,186,.15) !important;
    border-bottom:0 !important;

    border-radius:28px 28px 0 0 !important;

    box-shadow:
        0 -20px 70px rgba(0,0,0,.42) !important;
}

#infoModal .info-modal__scroll{
    overflow-y:auto !important;
    overflow-x:hidden !important;

    overscroll-behavior:contain;

    padding:
        0
        0
        calc(26px + env(safe-area-inset-bottom,0px))
        !important;
}

#infoModal .info-modal__handle{
    flex:0 0 auto;
    height:24px;

    display:flex;
    align-items:center;
    justify-content:center;

    position:relative;
    z-index:2;
}

#infoModal .info-modal__handle span{
    display:block;
    width:42px;
    height:4px;

    border-radius:999px;

    background:rgba(196,218,203,.32);
}

#infoModal .info-modal__close-btn{
    position:absolute !important;
    right:15px !important;
    top:15px !important;

    width:38px !important;
    height:38px !important;

    display:grid !important;
    place-items:center !important;

    padding:0 !important;

    border-radius:50% !important;

    border:1px solid rgba(190,215,198,.13) !important;

    background:rgba(255,255,255,.055) !important;
    color:#dce8df !important;

    cursor:pointer !important;

    z-index:10 !important;
}

#infoModal .info-modal__close-btn svg{
    width:17px !important;
    height:17px !important;
}


/* marka */

#infoModal .info-modal__brand{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;

    padding:16px 20px 24px !important;
}

#infoModal .info-modal__brand-medallion{
    width:76px !important;
    height:76px !important;

    display:grid !important;
    place-items:center !important;

    margin-bottom:12px !important;

    border-radius:50% !important;

    background:#14211a !important;

    border:
        1px solid
        rgba(177,207,186,.20) !important;
}

#infoModal .info-modal__brand-initial{
    color:#a9c4b1 !important;

    font-family:Georgia,serif !important;
    font-size:37px !important;
    line-height:1 !important;
}

#infoModal .info-modal__brand-name{
    color:#f2f6f3 !important;

    font-size:25px !important;
    font-weight:600 !important;

    line-height:1.15 !important;
}

#infoModal .lumina-unified-sub{
    margin-top:7px !important;

    color:#7e9787 !important;

    font-size:8px !important;
    font-weight:700 !important;

    letter-spacing:2px !important;
}


/* kart */

#infoModal .lumina-unified-card{
    width:auto !important;

    margin:
        0
        14px
        12px
        !important;

    padding:17px !important;

    border-radius:18px !important;

    background:#15221b !important;

    border:
        1px solid
        rgba(172,205,182,.13) !important;

    box-shadow:none !important;

    color:#eaf0eb !important;
}

#infoModal .info-block__label,
#infoModal .info-block__title{
    margin:0 0 11px !important;

    color:#9fbbaa !important;

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

    font-weight:700 !important;

    letter-spacing:1.45px !important;

    text-transform:uppercase !important;
}


/* ---------------------------------------------------------
   WIFI
--------------------------------------------------------- */

#infoModal .info-wifi{
    padding:0 !important;
    margin:0 !important;

    background:none !important;
    border:0 !important;
}

#infoModal .info-wifi__head{
    display:flex !important;
    align-items:center !important;

    gap:10px !important;

    margin-bottom:14px !important;
}

#infoModal .info-wifi__icon{
    width:37px !important;
    height:37px !important;

    flex:0 0 37px !important;

    display:grid !important;
    place-items:center !important;

    border-radius:12px !important;

    background:rgba(151,190,165,.09) !important;
    color:#9ab9a5 !important;
}

#infoModal .info-wifi__icon svg{
    width:19px !important;
    height:19px !important;
}

#infoModal .info-wifi__title{
    color:#edf3ef !important;

    font-size:13px !important;
    font-weight:650 !important;
}

#infoModal .info-wifi__qr-toggle{
    margin-left:auto !important;

    min-height:35px !important;

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

    gap:6px !important;

    padding:7px 10px !important;

    border-radius:11px !important;

    border:
        1px solid
        rgba(163,198,175,.13) !important;

    background:
        rgba(163,198,175,.075) !important;

    color:#a8c4b1 !important;

    font-size:9px !important;
    font-weight:650 !important;

    cursor:pointer !important;
}

#infoModal .info-wifi__qr-toggle svg{
    width:15px !important;
    height:15px !important;
}

#infoModal .info-wifi__rows{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;

    gap:8px !important;
}

#infoModal .info-wifi__cell{
    min-width:0 !important;

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

    padding:11px 12px !important;

    border-radius:12px !important;

    background:
        rgba(190,216,198,.045) !important;

    border:
        1px solid
        rgba(190,216,198,.075) !important;
}

#infoModal .info-wifi__cell--pass{
    justify-content:space-between !important;
}

#infoModal .info-wifi__cell-txt,
#infoModal .info-wifi__cell:not(.info-wifi__cell--pass){
    flex-direction:column !important;
    align-items:flex-start !important;
}

#infoModal .info-wifi__k{
    display:block !important;

    color:#71877a !important;

    font-size:7px !important;
    font-weight:700 !important;

    letter-spacing:.8px !important;

    text-transform:uppercase !important;
}

#infoModal .info-wifi__v{
    display:block !important;

    margin-top:3px !important;

    color:#e7eee9 !important;

    font-size:11px !important;
    font-weight:550 !important;
}

#infoModal .info-wifi__act{
    position:relative !important;

    width:35px !important;
    height:35px !important;

    flex:0 0 35px !important;

    display:grid !important;
    place-items:center !important;

    padding:0 !important;

    border-radius:10px !important;

    border:
        1px solid
        rgba(169,201,179,.10) !important;

    background:
        rgba(169,201,179,.065) !important;

    color:#9cb8a5 !important;

    cursor:pointer !important;
}

#infoModal .info-wifi__act svg{
    width:15px !important;
    height:15px !important;
}

#infoModal .info-wifi__act.is-copied{
    color:#dff3e6 !important;
    background:rgba(128,184,147,.18) !important;
}

.lumina-copy-toast{
    position:absolute;

    right:0;
    top:-28px;

    padding:5px 8px;

    border-radius:8px;

    background:#25382d;
    color:#dfece3;

    font-size:8px;
    white-space:nowrap;

    box-shadow:0 5px 18px rgba(0,0,0,.25);
}


/* QR */

#infoModal .info-wifi__qr{
    margin-top:13px !important;

    padding:17px !important;

    text-align:center !important;

    border-radius:14px !important;

    background:#101b15 !important;

    border:
        1px solid
        rgba(172,205,182,.10) !important;
}

#infoModal .lumina-wifi-qr-image{
    width:200px !important;
    max-width:100% !important;

    margin:0 auto !important;

    padding:10px !important;

    display:flex !important;
    justify-content:center !important;

    border-radius:14px !important;

    background:#fff !important;
}

#infoModal [data-lumina-qr-target]{
    width:180px !important;
    height:180px !important;

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

#infoModal [data-lumina-qr-target] canvas,
#infoModal [data-lumina-qr-target] img{
    width:180px !important;
    height:180px !important;

    display:block !important;
}

#infoModal .info-wifi__qr-hint{
    max-width:260px !important;

    margin:
        12px
        auto
        0
        !important;

    color:#8aa092 !important;

    font-size:9px !important;
    line-height:1.55 !important;
}

.lumina-qr-error{
    color:#1c1c1c;
    font-size:11px;
}


/* ---------------------------------------------------------
   SOSYAL
--------------------------------------------------------- */

#infoModal .info-socials{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    gap:10px !important;
}

#infoModal .lumina-social-btn{
    width:43px !important;
    height:43px !important;

    display:grid !important;
    place-items:center !important;

    padding:0 !important;

    border-radius:13px !important;

    border:
        1px solid
        rgba(175,207,185,.12) !important;

    background:
        rgba(175,207,185,.065) !important;

    color:#9fbba8 !important;

    cursor:pointer !important;

    text-decoration:none !important;
}

#infoModal .lumina-social-btn svg{
    width:20px !important;
    height:20px !important;
}

#infoModal .lumina-social-btn:hover{
    background:
        rgba(175,207,185,.12) !important;

    color:#dbe9df !important;
}


/* ---------------------------------------------------------
   ANKET
--------------------------------------------------------- */

#infoModal .lumina-unified-survey{
    width:calc(100% - 28px) !important;

    margin:
        0
        14px
        12px
        !important;

    padding:15px 16px !important;

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

    gap:12px !important;

    border-radius:18px !important;

    border:
        1px solid
        rgba(170,203,180,.13) !important;

    background:#17251d !important;

    color:#edf3ef !important;

    text-align:left !important;

    cursor:pointer !important;
}

#infoModal .info-survey-entry__icon{
    width:40px !important;
    height:40px !important;

    flex:0 0 40px !important;

    display:grid !important;
    place-items:center !important;

    border-radius:12px !important;

    background:
        rgba(171,205,182,.09) !important;

    color:#9fbba8 !important;
}

#infoModal .info-survey-entry__icon svg{
    width:19px !important;
    height:19px !important;
}

#infoModal .info-survey-entry__body{
    min-width:0 !important;
    flex:1 !important;

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

#infoModal .info-survey-entry__title{
    color:#eaf1ec !important;

    font-size:11px !important;
    font-weight:650 !important;
}

#infoModal .info-survey-entry__sub{
    margin-top:3px !important;

    color:#788e80 !important;

    font-size:8px !important;
}

#infoModal .info-survey-entry__chev{
    width:15px !important;
    height:15px !important;

    color:#7f9b89 !important;
}


/* ---------------------------------------------------------
   HOURS
--------------------------------------------------------- */

#infoModal .info-hours{
    background:none !important;
    border:0 !important;
}

#infoModal .info-hours__row{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    gap:15px !important;

    padding:0 !important;

    background:none !important;
    border:0 !important;
}

#infoModal .info-hours__day{
    color:#c5d0c8 !important;

    font-size:11px !important;
}

#infoModal .info-hours__time{
    color:#edf3ef !important;

    font-size:11px !important;
    font-weight:650 !important;
}


/* ---------------------------------------------------------
   ADDRESS
--------------------------------------------------------- */

#infoModal .info-address{
    display:flex !important;
    align-items:flex-start !important;

    gap:12px !important;

    padding:0 !important;

    background:none !important;
    border:0 !important;
}

#infoModal .info-address__icon{
    width:41px !important;
    height:41px !important;

    flex:0 0 41px !important;

    display:grid !important;
    place-items:center !important;

    border-radius:12px !important;

    background:
        rgba(164,197,175,.085) !important;

    color:#9ab8a4 !important;
}

#infoModal .info-address__icon svg{
    width:19px !important;
    height:19px !important;
}

#infoModal .info-address__body{
    flex:1 !important;
    min-width:0 !important;
}

#infoModal .info-address__top{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    gap:10px !important;
}

#infoModal .info-address__label{
    color:#738a7b !important;

    font-size:8px !important;
    font-weight:700 !important;

    letter-spacing:.7px !important;

    text-transform:uppercase !important;
}

#infoModal .info-address__link{
    color:#8fb19b !important;

    font-size:9px !important;
    font-weight:600 !important;

    text-decoration:none !important;

    white-space:nowrap !important;
}

#infoModal .info-address__text{
    margin:7px 0 0 !important;

    color:#c8d2cb !important;

    font-size:10px !important;
    line-height:1.65 !important;
}


/* ---------------------------------------------------------
   PHONE
--------------------------------------------------------- */

#infoModal .info-block--phone{
    padding:10px !important;
}

#infoModal .info-phone{
    min-height:62px !important;

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

    gap:11px !important;

    padding:9px 11px !important;

    border-radius:13px !important;

    background:
        rgba(177,209,187,.045) !important;

    border:
        1px solid
        rgba(177,209,187,.075) !important;

    color:#e9f0eb !important;

    text-decoration:none !important;
}

#infoModal .info-phone__icon{
    width:40px !important;
    height:40px !important;

    flex:0 0 40px !important;

    display:grid !important;
    place-items:center !important;

    border-radius:11px !important;

    background:
        rgba(165,200,177,.09) !important;

    color:#99b7a3 !important;
}

#infoModal .info-phone__icon svg{
    width:18px !important;
    height:18px !important;
}

#infoModal .info-phone__body{
    min-width:0 !important;
    flex:1 !important;

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

#infoModal .info-phone__label{
    color:#708779 !important;

    font-size:7px !important;
    font-weight:700 !important;

    letter-spacing:.9px !important;

    text-transform:uppercase !important;
}

#infoModal .info-phone__value{
    margin-top:2px !important;

    color:#eaf1ec !important;

    font-size:13px !important;
    font-weight:600 !important;
}

#infoModal .info-phone__chev{
    color:#829e8c !important;

    font-size:22px !important;
}


/* ---------------------------------------------------------
   TEXT
--------------------------------------------------------- */

#infoModal .info-block__text{
    color:#bac7be !important;

    font-size:10px !important;
    line-height:1.7 !important;
}

#infoModal .lumina-unified-footer{
    padding:9px 20px 2px !important;

    text-align:center !important;

    color:#50675a !important;

    font-size:7px !important;
    font-weight:700 !important;

    letter-spacing:2px !important;
}


/* =========================================================
   LANGUAGE MODAL
========================================================= */

.lumina-lang-sheet{
    position:absolute;

    left:50%;
    bottom:0;

    transform:translateX(-50%);

    width:min(500px,100%);

    padding:
        24px
        18px
        calc(24px + env(safe-area-inset-bottom,0px));

    background:#101914;

    border:
        1px solid
        rgba(177,208,187,.15);

    border-bottom:0;

    border-radius:26px 26px 0 0;

    box-shadow:
        0 -20px 60px rgba(0,0,0,.38);

    color:#edf3ef;
}

.lumina-lang-close{
    position:absolute;

    right:15px;
    top:15px;

    width:38px;
    height:38px;

    display:grid;
    place-items:center;

    padding:0;

    border:
        1px solid
        rgba(180,210,189,.12);

    border-radius:50%;

    background:
        rgba(255,255,255,.05);

    color:#dfe9e2;

    font-size:22px;

    cursor:pointer;
}

.lumina-lang-sheet .eyebrow{
    display:block;

    margin-bottom:6px;

    color:#789081;

    font-size:8px;
    font-weight:700;

    letter-spacing:1.8px;
}

.lumina-lang-sheet h2{
    margin:
        0
        0
        20px;

    color:#eef3ef;

    font-size:23px;
    font-weight:600;
}

.lumina-lang-choice{
    width:100%;

    min-height:60px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    margin-top:9px;

    padding:0 17px;

    border-radius:15px;

    border:
        1px solid
        rgba(177,208,187,.10);

    background:#16221b;

    color:#dfe8e2;

    font-size:13px;
    font-weight:600;

    cursor:pointer;
}

.lumina-lang-choice small{
    color:#73897a;

    font-size:9px;
    font-weight:700;

    letter-spacing:1px;
}

.lumina-lang-choice.is-active{
    border-color:
        rgba(164,202,177,.32);

    background:#1a2a20;

    color:#b7d0bf;
}

.lumina-lang-choice.is-active::after{
    content:'✓';

    margin-left:10px;

    color:#9fc2aa;
}


/* ---------------------------------------------------------
   DESKTOP
--------------------------------------------------------- */

@media(min-width:768px){

    #infoModal .info-modal__sheet,
    .lumina-lang-sheet{
        bottom:20px !important;

        border-radius:27px !important;

        border-bottom:
            1px solid
            rgba(177,207,186,.15) !important;
    }

}


/* ---------------------------------------------------------
   MOBILE
--------------------------------------------------------- */

@media(max-width:480px){

    #infoModal .info-wifi__rows{
        grid-template-columns:1fr 1fr !important;
    }

    #infoModal .info-wifi__qr-toggle{
        padding:7px 8px !important;

        font-size:8px !important;
    }

    #infoModal .lumina-wifi-qr-image{
        width:190px !important;
    }

}


/* =========================================================
   WIFI QR FINAL FIX
   ========================================================= */

#infoModal .info-wifi__qr{
    display:block !important;
    width:100% !important;
    box-sizing:border-box !important;

    margin-top:14px !important;
    padding:18px 14px !important;

    overflow:hidden !important;

    text-align:center !important;

    background:#101b15 !important;

    border:
        1px solid
        rgba(172,205,182,.10) !important;

    border-radius:15px !important;
}

#infoModal .lumina-wifi-qr-image{
    display:block !important;

    width:200px !important;
    height:200px !important;

    max-width:200px !important;
    min-width:0 !important;

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

    box-sizing:border-box !important;
    overflow:hidden !important;

    background:#ffffff !important;
    border-radius:15px !important;
}

#infoModal [data-lumina-qr-target]{
    display:block !important;

    width:180px !important;
    height:180px !important;

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

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

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

    overflow:hidden !important;

    background:#fff !important;
}

#infoModal [data-lumina-qr-target] canvas,
#infoModal [data-lumina-qr-target] img{
    display:block !important;

    width:180px !important;
    height:180px !important;

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

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

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

    object-fit:contain !important;
}

#infoModal .info-wifi__qr-hint{
    display:block !important;

    position:static !important;
    float:none !important;

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

    margin:14px auto 0 !important;
    padding:0 !important;

    clear:both !important;

    color:#82988a !important;

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

    text-align:center !important;
}

@media(max-width:480px){

    #infoModal .lumina-wifi-qr-image{
        width:190px !important;
        height:190px !important;
        max-width:190px !important;
    }

    #infoModal [data-lumina-qr-target],
    #infoModal [data-lumina-qr-target] canvas,
    #infoModal [data-lumina-qr-target] img{
        width:170px !important;
        height:170px !important;

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

        min-height:170px !important;
        max-height:170px !important;
    }

}


/* QR başlangıçta kesinlikle kapalı */
#infoModal [data-lumina-wifi-qr][hidden]{
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    height:0 !important;
    min-height:0 !important;
    max-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
}

#infoModal [data-lumina-wifi-qr]:not([hidden]){
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    height:auto !important;
    max-height:none !important;
    margin-top:14px !important;
    padding:18px 14px !important;
}

/* Desktop: ortak alt bar ekrana sabit */
@media (min-width: 769px) {
    .lumina-shared-dock,
    nav.home-dock.lumina-shared-dock {
        position: fixed !important;
        left: 50% !important;
        bottom: 24px !important;
        transform: translateX(-50%) !important;

        width: auto !important;
        min-width: 340px !important;
        max-width: calc(100vw - 48px) !important;

        z-index: 9999 !important;

        margin: 0 !important;
        top: auto !important;
        right: auto !important;
    }

    body {
        padding-bottom: 110px !important;
    }
}

/* Desktop final: dock video ile aynı genişlikte, scroll yok */
@media (min-width: 769px) {

    html,
    body {
        height: 100% !important;
        min-height: 100% !important;
        overflow: hidden !important;
    }

    body {
        padding-bottom: 0 !important;
    }

    .lumina-shared-dock,
    nav.home-dock.lumina-shared-dock {
        position: fixed !important;

        /* Video kartının genişliğiyle aynı */
        width: min(36vw, 640px) !important;
        min-width: 0 !important;
        max-width: 640px !important;

        left: 50% !important;
        bottom: 14px !important;
        transform: translateX(-50%) !important;

        margin: 0 !important;
        top: auto !important;
        right: auto !important;

        z-index: 9999 !important;
    }
}

/* Desktop: bar videonun tam altına hizalansın */
@media (min-width: 769px) {
    .lumina-shared-dock,
    nav.home-dock.lumina-shared-dock {
        position: fixed !important;

        width: min(36vw, 640px) !important;
        min-width: 0 !important;
        max-width: 640px !important;

        left: 50% !important;
        transform: translateX(-50%) !important;

        /* Videonun altına yakın konum */
        bottom: 10px !important;

        margin: 0 !important;
        top: auto !important;
        right: auto !important;

        z-index: 9999 !important;
    }
}

/* Desktop: feature + dock tek ekran içinde */
@media (min-width: 769px) {

    html,
    body {
        height: 100vh !important;
        overflow: hidden !important;
    }

    body {
        padding-bottom: 0 !important;
    }

    nav.home-dock.lumina-shared-dock {
        z-index: 9999 !important;
    }
}

/* =========================================================
   KATEGORİ / MENÜ SAYFALARINDA DESKTOP SCROLL
   Ana sayfadaki sabit viewport düzeninden etkilenmesin.
   ========================================================= */
@media (min-width: 769px) {
    html:has(body.lumina-menu-page) {
        height: auto !important;
        min-height: 100% !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }

    body.lumina-menu-page {
        height: auto !important;
        min-height: 100vh !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        padding-bottom: 110px !important;
    }
}
