/* Guide Batumi — premium liquid-glass bottom navigation, 2026-08-21. */
.bottomnav,body:not(.light-theme):has(#scrHome.active) .bottomnav{
 --nav-glow:color-mix(in srgb,var(--theme-accent) 16%,transparent);
 left:10px;right:10px;bottom:max(4px,calc(var(--safe-b) - 4px),calc(var(--tg-safe-bottom,0px) - 4px));
 height:68px;padding:5px;border:1px solid rgba(255,255,255,.18);border-top-color:rgba(255,255,255,.32);
 border-radius:26px;background:linear-gradient(180deg,rgba(45,56,66,.32) 0%,rgba(17,27,35,.23) 58%,rgba(8,16,23,.29) 100%)!important;
 box-shadow:0 22px 52px rgba(0,0,0,.32),0 7px 18px rgba(0,0,0,.14),0 0 0 .5px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(255,255,255,.045);
 backdrop-filter:blur(34px) saturate(1.7) contrast(1.04);-webkit-backdrop-filter:blur(34px) saturate(1.7) contrast(1.04);
 overflow:hidden;isolation:isolate;transform:translateZ(0)
}
.bottomnav::before{
 content:'';display:block;position:absolute;inset:0;height:auto;border-radius:inherit;z-index:0;pointer-events:none;opacity:1;
 background:radial-gradient(105% 115% at 10% -35%,rgba(255,255,255,.31) 0%,rgba(255,255,255,.07) 34%,transparent 58%),radial-gradient(55% 85% at 92% 115%,var(--nav-glow),transparent 70%),linear-gradient(110deg,rgba(255,255,255,.055),transparent 42%,rgba(255,255,255,.025))
}
.bottomnav::after{
 content:'';position:absolute;z-index:0;pointer-events:none;inset:1px;border-radius:25px;
 border:1px solid rgba(255,255,255,.045);box-shadow:inset 0 0 24px rgba(255,255,255,.018)
}
.bottomnav .bnav-item{
 z-index:1;flex:1;min-width:0;height:58px;padding:7px 3px 6px;gap:2px;border-radius:20px;
 transition:transform .28s cubic-bezier(.2,.8,.2,1),filter .28s ease
}
.bottomnav .bnav-item::after{display:none}
.bottomnav .bnav-item::before{
 inset:1px;border:1px solid transparent;border-radius:19px;background:transparent;box-shadow:none;z-index:-1;
 transition:background .3s cubic-bezier(.2,.8,.2,1),border-color .3s ease,box-shadow .3s ease,transform .3s cubic-bezier(.2,.8,.2,1),opacity .3s ease
}
.bottomnav .bnav-item.active{transform:translateY(-1px)}
.bottomnav .bnav-item.active::before,body:has(#scrHome.active) .bottomnav .bnav-item.active::before{
 inset:1px;border-radius:19px;border-color:rgba(255,255,255,.18);
 background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.055) 62%,rgba(255,255,255,.025));
 box-shadow:inset 0 1px 0 rgba(255,255,255,.23),inset 0 -1px 0 rgba(255,255,255,.035),0 8px 18px rgba(0,0,0,.19),0 0 24px var(--nav-glow);
 transform:translateZ(0)
}
.bottomnav .bnav-item .icon{display:grid;place-items:center;min-height:25px;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.bottomnav .bnav-item .icon svg{
 width:21px;height:21px;color:rgba(205,217,223,.57);stroke-width:1.8;
 filter:drop-shadow(0 1px 1px rgba(0,0,0,.3));transition:color .28s ease,filter .28s ease,transform .28s cubic-bezier(.2,.8,.2,1)
}
.bottomnav .bnav-item .label{
 min-height:auto;font-size:clamp(.51rem,2.25vw,.61rem);line-height:1.05;font-weight:590;letter-spacing:.008em;
 color:rgba(205,217,223,.56);transition:color .28s ease,opacity .28s ease,font-weight .28s ease
}
.bottomnav .bnav-item.active .icon{transform:translateY(-.5px)}
.bottomnav .bnav-item.active .icon svg,body:has(#scrHome.active) .bottomnav .bnav-item.active .icon svg{
 color:color-mix(in srgb,var(--theme-accent) 78%,#fff);filter:drop-shadow(0 2px 8px color-mix(in srgb,var(--theme-accent) 42%,transparent))
}
.bottomnav .bnav-item.active .label,body:has(#scrHome.active) .bottomnav .bnav-item.active .label{
 color:color-mix(in srgb,var(--theme-accent) 66%,#fff);font-weight:720
}
.bottomnav .bnav-item:active{transform:translateY(0) scale(.94);filter:brightness(1.08)}
.bottomnav .bnav-item.sos-tab.active::before,body:has(#scrHome.active) .bottomnav .bnav-item.sos-tab.active::before{
 border-color:rgba(255,137,161,.2);background:linear-gradient(180deg,rgba(255,130,156,.19),rgba(255,100,132,.065));
 box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 8px 18px rgba(0,0,0,.18),0 0 22px rgba(255,107,138,.1)
}
.bottomnav .bnav-item.sos-tab.active .icon svg{color:color-mix(in srgb,var(--coral) 80%,#fff);filter:drop-shadow(0 2px 8px rgba(255,107,138,.35))}
.bottomnav .bnav-item.sos-tab.active .label{color:color-mix(in srgb,var(--coral) 72%,#fff)}

body.light-theme .bottomnav,body.light-theme:has(#scrHome.active) .bottomnav{
 --nav-glow:color-mix(in srgb,var(--theme-accent) 10%,transparent);
 border-color:rgba(255,255,255,.86)!important;border-bottom-color:rgba(47,75,85,.14)!important;
 background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(240,247,248,.65) 62%,rgba(226,238,241,.68))!important;
 box-shadow:0 20px 48px rgba(35,63,73,.17),0 5px 14px rgba(35,63,73,.08),0 0 0 .5px rgba(40,70,80,.06),inset 0 1px 0 #fff!important;
 backdrop-filter:blur(34px) saturate(1.55) contrast(1.02)!important;-webkit-backdrop-filter:blur(34px) saturate(1.55) contrast(1.02)!important
}
body.light-theme .bottomnav::before{display:block;opacity:.62;background:radial-gradient(100% 120% at 8% -40%,#fff 0%,rgba(255,255,255,.32) 42%,transparent 66%),radial-gradient(55% 80% at 92% 115%,var(--nav-glow),transparent 70%)}
body.light-theme .bottomnav::after{border-color:rgba(255,255,255,.5)}
body.light-theme .bottomnav .bnav-item .icon svg{color:rgba(35,62,72,.52)}
body.light-theme .bottomnav .bnav-item .label{color:rgba(35,62,72,.56)}
body.light-theme .bottomnav .bnav-item.active::before{
 border-color:rgba(255,255,255,.82);background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,.45));
 box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(51,83,94,.035),0 8px 18px rgba(35,63,73,.1),0 0 22px var(--nav-glow)
}
#geoStickyBar{
 bottom:calc(max(4px,calc(var(--safe-b) - 4px),calc(var(--tg-safe-bottom,0px) - 4px)) + 74px);
 left:50%;transform:translateX(-50%)
}
@media(max-width:350px){
 .bottomnav,body:has(#scrHome.active) .bottomnav{left:6px;right:6px;padding-left:3px;padding-right:3px}
 .bottomnav .bnav-item .label{font-size:.49rem}
}
@media(prefers-reduced-motion:reduce){.bottomnav .bnav-item,.bottomnav .bnav-item::before,.bottomnav .bnav-item .icon,.bottomnav .bnav-item .icon svg{transition:none!important}}
@media(prefers-reduced-transparency:reduce){
 .bottomnav,body:not(.light-theme):has(#scrHome.active) .bottomnav{background:rgba(13,21,28,.9)!important}
 body.light-theme .bottomnav,body.light-theme:has(#scrHome.active) .bottomnav{background:rgba(244,249,250,.97)!important}
}
