/* Долно меню — "течно стъкло" като в MySpot, в цветовете на VIP Reserve.
   Общо за всички страници (зарежда се СЛЕД вградените стилове на страницата, затова печели). */

.ios-bottom-nav {
    bottom: calc(10px + env(safe-area-inset-bottom));
    width: calc(100% - 28px);
    max-width: 430px;
    height: 58px;
    padding: 5px;
    box-sizing: border-box;
    justify-content: space-between;
    align-items: stretch;
    background: linear-gradient(180deg, rgba(255,255,255,0.20) 0%, rgba(255,255,255,0.07) 100%);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 0.5px solid rgba(255,255,255,0.34);
    border-radius: 100px;
    /* Менюто не се превърта — казваме го на браузъра още при докосването, иначе телефонът
       прекъсваше дърпането на капката (виж navpill.js) */
    touch-action: none;
    -webkit-user-select: none; user-select: none;
    -webkit-touch-callout: none;
    box-shadow:
        0 16px 42px rgba(0,0,0,0.5),
        inset 0 1px 0 rgba(255,255,255,0.5),
        inset 0 -1px 0 rgba(255,255,255,0.14),
        inset 0 0 22px rgba(255,255,255,0.06);
}
/* Блик по горния ляв ръб — придава "мокър" стъклен вид */
.ios-bottom-nav::before {
    content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
    background: radial-gradient(120% 150% at 18% -30%, rgba(255,255,255,0.32), rgba(255,255,255,0) 58%);
}

.ios-bottom-nav .nav-item {
    flex: 1 1 0; width: auto; min-width: 0; height: 100%;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
    border-radius: 100px;
    color: rgba(255,255,255,0.78);
    font-size: 9.5px; font-weight: 600; letter-spacing: 0.1px;
    transition: color 0.25s ease;
}
.ios-bottom-nav .nav-item svg { width: 22px; height: 22px; stroke-width: 1.8px; }
.ios-bottom-nav .nav-item.active { color: #f8b500; }
.ios-bottom-nav .nav-item.active svg { stroke-width: 2.1px; }

/* Движещата се "капка" — вече е голяма (запълва цялата клетка на активната икона) */
.ios-bottom-nav .nav-pill {
    left: 0;
    border-radius: 100px;
    background: linear-gradient(180deg, rgba(255,255,255,0.30) 0%, rgba(255,255,255,0.10) 100%);
    border: 0.5px solid rgba(255,255,255,0.55);
    box-shadow:
        0 6px 18px rgba(0,0,0,0.28),
        inset 0 1px 1px rgba(255,255,255,0.75),
        inset 0 -10px 18px rgba(248,181,0,0.14);
    will-change: transform;
}

/* ===== Малки бутони и полета — същото "течно стъкло" като менюто ===== */
/* (не пипаме златните бутони за действие и картите със съдържание) */

body .lang-toggle-btn,
body .floating-btn,
body .hero-btn,
body .v-heart,
body .v-pill,
body .filter-trigger-btn,
body .search-box,
body .btn-back {
    background: linear-gradient(180deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.07) 100%);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 0.5px solid rgba(255,255,255,0.36);
    box-shadow:
        0 6px 18px rgba(0,0,0,0.30),
        inset 0 1px 0 rgba(255,255,255,0.5),
        inset 0 -1px 0 rgba(255,255,255,0.12),
        inset 0 0 12px rgba(255,255,255,0.05);
    color: #fff;
}
/* В списъците (карти на клубове, търсачка, филтри) стъклото е БЕЗ размиване: размиването се смята
   наново на всеки кадър, докато страницата се превърта, и точно то насичаше превъртането. Тъмната
   подложка отдолу пази същия вид и четимост. Размиване остава само на малкото бутони в горната лента. */
body .v-heart,
body .v-pill,
body .filter-trigger-btn,
body .search-box {
    background: linear-gradient(180deg, rgba(255,255,255,0.20) 0%, rgba(255,255,255,0.06) 100%), rgba(14,10,24,0.45);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
/* Бутоните реагират веднага — без изчакване за евентуално двойно докосване */
a, button, [data-act], .nav-item, label { touch-action: manipulation; }
/* iPhone праща "click" към елемент без връзка/бутон (напр. сърчицето) само ако изглежда за натискане — иначе
   делегираното натискане се губи или закъснява */
[data-act], [data-action] { cursor: pointer; }

/* Блик по горния ръб, като на менюто */
body .floating-btn::before,
body .hero-btn::before,
body .v-heart::before,
body .filter-trigger-btn::before,
body .search-box::before,
body .btn-back::before {
    content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
    background: radial-gradient(120% 140% at 20% -35%, rgba(255,255,255,0.34), rgba(255,255,255,0) 60%);
}
/* Блясъкът е ::before и иска позициониран родител. Бутоните, които страницата вече позиционира
   (floating-btn, v-heart — fixed/absolute), не се пипат; останалите стават relative. */
body .hero-btn,
body .filter-trigger-btn,
body .search-box,
body .btn-back { position: relative; }

body .lang-toggle-btn:active,
body .floating-btn:active,
body .hero-btn:active,
body .filter-trigger-btn:active,
body .btn-back:active {
    background: linear-gradient(180deg, rgba(255,255,255,0.34) 0%, rgba(255,255,255,0.14) 100%);
    opacity: 1;
}
body .search-box:focus-within {
    background: linear-gradient(180deg, rgba(255,255,255,0.28) 0%, rgba(255,255,255,0.10) 100%);
    border-color: rgba(248,181,0,0.55);
}
body .search-box input { color: #fff; }
body .search-box input::placeholder { color: rgba(255,255,255,0.62); }
body .search-box svg { color: rgba(255,255,255,0.75); }

/* Любимо сърчице — остава червено */
body .v-heart.favorited,
body .hero-btn.favorited {
    color: var(--danger, #ff453a);
    border-color: var(--danger, #ff453a);
}

/* ===== "Назад" — кръгла стъклена стрелка (като във Viber, Instagram и iOS) ===== */
body .btn-back {
    width: 40px; height: 40px; min-width: 40px; padding: 0;
    border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center; gap: 0;
    font-size: 0; line-height: 0; text-transform: none;
    flex-shrink: 0;
}
body .btn-back svg {
    width: 22px; height: 22px; position: relative; z-index: 1;
    stroke: #fff; stroke-width: 2.6; margin-right: 2px; /* шеврон се центрира визуално */
}

/* ===== Затъмняващите слоеве зад диалози и менюта — БЕЗ размазване на цялата страница =====
   Размазването на цял екран (backdrop-filter) се смята наново на всеки кадър, докато менюто/диалогът се
   плъзга отгоре — точно тогава телефонът насичаше. Слоевете са достатъчно тъмни (60–90%) и без него. */
[class*="-overlay"], [class$="overlay"], [class*="backdrop"], #registrationSurveyOverlay {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}