/*  === 📄 /styles_core/front/toponyms_map.css === */
  /* =========================================================
   MAP PAGE
   ========================================================= */

.map-back-wrap{
    position:relative;
    z-index:5000;

    padding:
        var(--space-4)
        var(--space-4)
        0
        var(--space-4);
}

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

html.map-page,
html.map-page body{
    margin:0;
    padding:0;
    height:100%;
}

html.map-page body{
    background:#161412;
}

.map-view{
    width:100%;
    height:100vh;
}

.map-back-wrap{
    position:absolute;

    top:var(--space-4);
    left:var(--space-4);

    z-index:5000;
}

.map-toolbar .ui-share-btn{
    margin-left:0;
}

.map-toolbar{
    position:absolute;

    top:var(--space-4);
    left:50%;

    transform:translateX(-50%);

    z-index:5000;

    display:flex;
    align-items:center;
    gap:var(--space-3);
}

.map-toolbar .ui-share-btn{
    margin-left:0;
}

.map-back-mobile{
    display:none;
}

@media (max-width:640px){

    .map-back-full{
        display:none;
    }

    .map-back-mobile{
        display:inline;
    }

}


/* =========================================================
   🏔 TOPONYM INFO
   ========================================================= */

.toponym-info{
    position:absolute;

    top:104px;
    left:50%;

    transform:translateX(-50%);

    z-index:5000;

    display:flex;
    flex-direction:column;
    gap:6px;

    width:calc(100% - 32px);
    max-width:420px;

    padding:
        var(--space-3)
        var(--space-4);

    border-radius:var(--radius-lg);

    background:rgba(12,10,9,0.58);

    backdrop-filter:blur(8px);

    box-shadow:
        0 10px 30px rgba(0,0,0,0.28);

    text-align:center;
}

.toponym-info__title{
    margin:0;

    color:#fff;

    font-size:1.4rem;
    line-height:1.1;
    font-weight:600;
}

.toponym-info__meta{
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;

    gap:10px;

    color:rgba(255,255,255,0.72);

    font-size:0.9rem;
}

.toponym-info__meta span{
    white-space:nowrap;
}

/* =========================================================
   📱 MOBILE
   ========================================================= */

@media (max-width:640px){

    .toponym-info{
        top:88px;

        max-width:none;

        padding:
            var(--space-3)
            var(--space-3);
    }

    .toponym-info__title{
        font-size:1.15rem;
    }

    .toponym-info__meta{
        font-size:0.82rem;
    }

}