/*
 * Bondisnar design refresh
 * Visual layer derived from the static kiosk prototype in /design.
 * Keep this file scoped: it should refine existing PHP surfaces without
 * changing navigation/data behavior.
 */

:root,
html[data-bon-theme="light"] {
    --bon-bg: #eef1f4;
    --bon-bg-soft: #f4f6f8;
    --bon-bg-ridge: #cdd3da;
    --bon-surface: #ffffff;
    --bon-surface-soft: #f3f5f8;
    --bon-surface-raised: #ffffff;
    --bon-surface-glass: rgba(255, 255, 255, 0.78);
    --bon-surface-strong: rgba(255, 255, 255, 0.96);
    --bon-glass: rgba(255, 255, 255, 0.74);
    --bon-text: #16202e;
    --bon-heading: #16202e;
    --bon-text-muted: #5c6776;
    --bon-text-soft: #6b7584;
    --bon-muted: #5c6776;
    --bon-border: #e6e9ee;
    --bon-border-strong: #cbd2dc;
    --bon-accent: #e4181c;
    --bon-brand: #e4181c;
    --bon-brand-dark: #c01015;
    --bon-red-soft: rgba(228, 24, 28, 0.12);
    --bon-on-brand: #ffffff;
    --bon-black: #0e0f12;
    --bon-dpad-bg: #16202e;
    --bon-dpad-fg: #ffffff;
    --bon-radius-panel: 32px;
    --bon-radius-card: 20px;
    --bon-radius-control: 999px;
    --bon-control-h: 56px;
    --bon-control-h-lg: 64px;
    --bon-shadow-panel: 0 30px 70px rgba(20, 30, 45, 0.22);
    --bon-shadow-card: 0 16px 38px rgba(20, 30, 45, 0.14);
    --bon-shadow-soft: 0 12px 28px rgba(20, 30, 45, 0.12);
    --bon-shadow-command: 0 26px 60px rgba(20, 30, 45, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

html[data-bon-theme="dark"],
html.dark {
    --bon-bg: #0e1320;
    --bon-bg-soft: #182034;
    --bon-bg-ridge: #080d18;
    --bon-surface: #171c25;
    --bon-surface-soft: #1e242f;
    --bon-surface-raised: #202735;
    --bon-surface-glass: rgba(23, 28, 37, 0.82);
    --bon-surface-strong: rgba(23, 28, 37, 0.96);
    --bon-glass: rgba(255, 255, 255, 0.12);
    --bon-text: #f3f6fb;
    --bon-heading: #ffffff;
    --bon-text-muted: #aab6c6;
    --bon-text-soft: #8c98aa;
    --bon-muted: #aab6c6;
    --bon-border: #2a313d;
    --bon-border-strong: #3b4657;
    --bon-dpad-bg: #ffffff;
    --bon-dpad-fg: #16202e;
    --bon-shadow-panel: 0 30px 80px rgba(0, 0, 0, 0.44);
    --bon-shadow-card: 0 18px 42px rgba(0, 0, 0, 0.38);
    --bon-shadow-soft: 0 14px 34px rgba(0, 0, 0, 0.32);
    --bon-shadow-command: 0 26px 60px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

body {
    letter-spacing: 0;
}

html:has(body.bon-kiosk-navigation) {
    overflow-x: hidden;
}

body.bon-kiosk-navigation {
    --bon-nav-bottom-h: 94px;
    --bon-nav-safe-bottom: 46px;
    --bon-kiosk-command-w: min(1020px, calc(100vw - 96px));
    --bon-kiosk-main-nav-w: clamp(560px, calc(100vw - 424px), 820px);
    --bon-kiosk-joystick-size: 164px;
    --bon-kiosk-side-gap: 16px;
    --bon-kiosk-map-controls-w: 110px;
    --bon-kiosk-map-controls-h: 126px;
    background:
        radial-gradient(130% 100% at 50% -20%, var(--bon-bg-soft) 0%, var(--bon-bg-ridge) 60%, #aab3bd 100%) !important;
    color: var(--bon-text) !important;
    overflow-x: hidden;
}

body.bon-kiosk-navigation .bon-nav-root {
    --bon-nav-bottom-h: 94px;
    --bon-nav-safe-bottom: 46px;
}

body.bon-kiosk-navigation .bon-bottom-panel {
    width: var(--bon-kiosk-main-nav-w);
    min-height: 84px;
    display: flex;
    grid-template-columns: none;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 20px;
    border-radius: 30px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    background: rgba(255, 255, 255, 0.22);
    color: var(--bon-text);
    box-shadow: var(--bon-shadow-command);
    backdrop-filter: blur(24px) saturate(1.65);
    -webkit-backdrop-filter: blur(24px) saturate(1.65);
}

html[data-bon-theme="dark"] body.bon-kiosk-navigation .bon-bottom-panel,
html.dark body.bon-kiosk-navigation .bon-bottom-panel {
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
}

body.bon-kiosk-navigation .bon-nav-item {
    min-width: 118px;
    min-height: 56px;
    border-radius: 20px;
    padding: 0 16px;
    gap: 10px;
    color: var(--bon-text);
    font-size: 18px;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

body.bon-kiosk-navigation .bon-main-detail-close {
    display: none;
    flex: 0 0 58px;
    width: 58px;
    height: 58px;
    min-width: 58px;
    padding: 0;
    place-items: center;
    border: 2px solid rgba(220, 252, 231, 0.95);
    border-radius: 999px;
    background: linear-gradient(145deg, #22c55e 0%, #16a34a 72%, #0f7a38 100%);
    color: #ffffff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.42), 0 12px 28px rgba(15, 118, 54, 0.32), 0 0 20px rgba(34, 197, 94, 0.22);
    cursor: pointer;
    opacity: 1;
}

body.bon-kiosk-navigation .bon-main-detail-close svg {
    width: 28px;
    height: 28px;
    stroke-width: 3;
}

body.bon-kiosk-navigation .bon-main-detail-close-mark {
    display: block;
    color: #ffffff;
    font-size: 44px;
    font-weight: 800;
    line-height: 0.86;
    transform: translateY(-1px);
}

body.bon-kiosk-navigation.bon-dpad-can-close .bon-main-detail-close {
    display: grid;
    animation: bon-main-detail-close-pulse 1.1s ease-in-out infinite;
}

body.bon-kiosk-navigation .bon-main-detail-close:disabled {
    opacity: 1;
    cursor: default;
}

@keyframes bon-main-detail-close-pulse {
    0%, 100% {
        transform: scale(1);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.42), 0 12px 28px rgba(15, 118, 54, 0.32), 0 0 14px rgba(34, 197, 94, 0.2);
    }
    50% {
        transform: scale(1.08);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.52), 0 16px 34px rgba(15, 118, 54, 0.4), 0 0 32px rgba(34, 197, 94, 0.38);
    }
}

body.bon-kiosk-navigation .bon-nav-item.is-icon-only {
    min-width: 64px;
    width: 64px;
    padding: 0;
    border-radius: 18px;
}

body.bon-kiosk-navigation .bon-nav-item svg {
    width: 28px;
    height: 28px;
    stroke-width: 2.15;
}

body.bon-kiosk-navigation .bon-nav-item:not(.is-active):hover,
body.bon-kiosk-navigation .bon-nav-item:not(.is-active):focus-visible {
    color: var(--bon-text);
    background: rgba(0, 0, 0, 0.06);
}

body.bon-kiosk-navigation .bon-nav-item.is-active {
    background: var(--bon-brand);
    color: #ffffff;
    box-shadow: 0 0 34px rgba(228, 24, 28, 0.5), 0 12px 30px rgba(228, 24, 28, 0.4);
}

body.bon-kiosk-navigation.is-index-page .bon-bottom-panel {
    background: #ffffff;
    border-color: rgba(226, 232, 240, 0.92);
    color: #16202e;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

body.bon-kiosk-navigation.is-index-page .bon-nav-item {
    min-width: 0;
    flex: 1 1 0;
    padding: 0 16px;
    gap: 10px;
    font-size: 18px;
    letter-spacing: 0.04em;
}

body.bon-kiosk-navigation.is-index-page .bon-nav-item svg {
    width: 26px;
    height: 26px;
}

html[data-bon-theme="dark"] body.bon-kiosk-navigation.is-index-page .bon-bottom-panel,
html.dark body.bon-kiosk-navigation.is-index-page .bon-bottom-panel {
    background: #ffffff;
    border-color: rgba(226, 232, 240, 0.92);
    color: #16202e;
}

html[data-bon-theme="dark"] body.bon-kiosk-navigation.is-index-page .bon-nav-item,
html.dark body.bon-kiosk-navigation.is-index-page .bon-nav-item {
    color: #16202e;
}

html[data-bon-theme="dark"] body.bon-kiosk-navigation.is-index-page .bon-nav-item.is-active,
html.dark body.bon-kiosk-navigation.is-index-page .bon-nav-item.is-active {
    color: #ffffff;
}

body.bon-kiosk-navigation .bon-kiosk-category-rail {
    position: fixed;
    left: 50%;
    right: auto;
    bottom: 150px;
    z-index: 10145;
    width: var(--bon-kiosk-command-w);
    max-width: var(--bon-kiosk-command-w);
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 13px 18px;
    border: 0;
    border-radius: 999px;
    background: var(--bon-surface);
    box-shadow: 0 20px 50px rgba(20, 30, 45, 0.2);
    transform: translateX(-50%);
    pointer-events: none;
}

body.bon-kiosk-navigation .bon-kiosk-category-tab {
    width: 76px;
    height: 76px;
    min-width: 0;
    min-height: 76px;
    flex: 0 0 76px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--bon-surface-soft);
    color: var(--bon-text);
    box-shadow: none;
    font-family: var(--bon-font);
    font-size: 18px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0;
    text-transform: uppercase;
    cursor: pointer;
    pointer-events: auto;
}

body.bon-kiosk-navigation .bon-kiosk-category-pin {
    width: auto;
    min-width: 300px;
    max-width: 420px;
    height: 76px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    padding: 0 24px;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(145deg, #22c55e 0%, #16a34a 72%, #0f7a38 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 12px 28px rgba(15, 118, 54, 0.28), 0 0 26px rgba(34, 197, 94, 0.18);
    font-size: 18px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
    pointer-events: auto;
}

body.bon-kiosk-navigation .bon-kiosk-category-pin:hover,
body.bon-kiosk-navigation .bon-kiosk-category-pin:focus-visible {
    background: linear-gradient(145deg, #22c55e 0%, #16a34a 72%, #0f7a38 100%) !important;
    color: #ffffff !important;
    outline: none;
}

body.bon-kiosk-navigation .bon-kiosk-category-pin svg {
    width: 25px;
    height: 25px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

body.bon-kiosk-navigation .bon-kiosk-category-tab svg {
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

body.bon-kiosk-navigation .bon-kiosk-category-tab span {
    display: none;
    min-width: 0;
    overflow: hidden;
    text-overflow: clip;
    white-space: nowrap;
}

body.bon-kiosk-navigation .bon-kiosk-category-place-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.bon-kiosk-navigation .bon-kiosk-category-place-chevron svg {
    width: 20px;
    height: 20px;
}

body.bon-kiosk-navigation .bon-kiosk-category-tab:hover,
body.bon-kiosk-navigation .bon-kiosk-category-tab:focus-visible {
    background: #e8edf3;
    outline: none;
}

body.bon-kiosk-navigation .bon-kiosk-category-tab.is-active,
body.bon-kiosk-navigation .bon-kiosk-category-tab.active {
    width: auto;
    min-width: 250px;
    flex: 0 0 auto;
    gap: 14px;
    padding: 0 32px;
    border-radius: 999px;
    background: var(--bon-brand);
    color: #ffffff;
    box-shadow: 0 0 34px rgba(228, 24, 28, 0.42), 0 12px 30px rgba(228, 24, 28, 0.34);
}

body.bon-kiosk-navigation .bon-kiosk-category-tab.is-active span,
body.bon-kiosk-navigation .bon-kiosk-category-tab.active span {
    display: inline;
}

html[data-bon-theme="dark"] body.bon-kiosk-navigation .bon-nav-item,
html.dark body.bon-kiosk-navigation .bon-nav-item {
    color: #ffffff;
}

html[data-bon-theme="dark"] body.bon-kiosk-navigation .bon-nav-item:not(.is-active):hover,
html.dark body.bon-kiosk-navigation .bon-nav-item:not(.is-active):hover {
    background: rgba(255, 255, 255, 0.12);
}

body.bon-kiosk-navigation .bon-floating-pad {
    width: var(--bon-kiosk-joystick-size);
    height: var(--bon-kiosk-joystick-size);
    left: max(22px, calc(50vw - (var(--bon-kiosk-main-nav-w) / 2) - var(--bon-kiosk-joystick-size) - var(--bon-kiosk-side-gap))) !important;
    bottom: calc(var(--bon-nav-safe-bottom) - 32px) !important;
    transform: none !important;
    display: none;
    z-index: 10160 !important;
    grid-template-columns: none;
    grid-template-rows: none;
    gap: 0;
    padding: 0;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    background: rgba(255, 255, 255, 0.18);
    box-shadow: var(--bon-shadow-command);
    backdrop-filter: blur(24px) saturate(1.65);
    -webkit-backdrop-filter: blur(24px) saturate(1.65);
    touch-action: none;
    -ms-touch-action: none;
    user-select: none;
    -webkit-user-select: none;
    overscroll-behavior: contain;
    pointer-events: none;
}

body.bon-has-dpad.bon-kiosk-navigation .bon-floating-pad {
    display: block;
}

body.bon-kiosk-navigation.bon-map-detail-active .bon-floating-pad,
body.bon-kiosk-navigation.iframe-detail-active .bon-floating-pad {
    z-index: 10260 !important;
}

body.bon-kiosk-navigation .bon-map-control-dock {
    position: absolute;
    width: var(--bon-kiosk-map-controls-w);
    min-height: var(--bon-kiosk-map-controls-h);
    pointer-events: auto;
    left: calc(var(--bon-kiosk-joystick-size) + var(--bon-kiosk-side-gap) + var(--bon-kiosk-main-nav-w) + var(--bon-kiosk-side-gap));
    right: auto;
    top: calc((var(--bon-kiosk-joystick-size) - var(--bon-kiosk-map-controls-h)) / 2);
    bottom: auto;
    z-index: 8;
    display: none;
    grid-template-columns: repeat(2, 44px);
    gap: 8px;
    padding: 8px;
    border: 1px solid rgba(226, 232, 240, 0.92);
    border-radius: 22px;
    background: #ffffff;
    box-shadow: 0 18px 44px rgba(20, 30, 45, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.7);
    transform: none;
    pointer-events: auto;
}

body.bon-map-controls-active.bon-kiosk-navigation .bon-map-control-dock {
    display: grid;
}

body.bon-kiosk-navigation .bon-map-control-btn {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0;
    border: 1px solid #dbe3ec;
    border-radius: 999px;
    background: #f8fafc;
    color: #16202e;
    box-shadow: 0 8px 18px rgba(20, 30, 45, 0.08);
    font-family: var(--bon-font);
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
}

body.bon-kiosk-navigation .bon-map-control-btn--wide {
    grid-column: span 2;
    width: 96px;
    padding: 0 12px;
}

body.bon-kiosk-navigation .bon-map-control-btn svg {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.45;
    stroke-linecap: round;
    stroke-linejoin: round;
}

body.bon-kiosk-navigation .bon-map-control-btn:hover,
body.bon-kiosk-navigation .bon-map-control-btn:focus-visible,
body.bon-kiosk-navigation .bon-map-control-btn.is-active {
    background: #e8edf3;
    color: #0f172a;
    outline: none;
}

body.bon-kiosk-navigation .bon-map-control-btn.is-active {
    border-color: rgba(22, 163, 74, 0.45);
    box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.12), 0 8px 18px rgba(20, 30, 45, 0.08);
}

@media (max-width: 1500px) {
    body.bon-kiosk-navigation .bon-map-control-dock {
        left: calc(var(--bon-kiosk-joystick-size) + var(--bon-kiosk-side-gap) + var(--bon-kiosk-main-nav-w) + var(--bon-kiosk-side-gap));
        right: auto;
        top: calc((var(--bon-kiosk-joystick-size) - var(--bon-kiosk-map-controls-h)) / 2);
        bottom: auto;
        grid-template-columns: repeat(2, 42px);
        transform: none;
    }

    body.bon-kiosk-navigation .bon-map-control-btn {
        width: 42px;
        height: 42px;
    }

    body.bon-kiosk-navigation .bon-map-control-btn--wide {
        grid-column: span 2;
        width: 92px;
    }
}

body.bon-kiosk-navigation .bon-dpad-place-tip {
    position: absolute;
    left: 50%;
    top: -75px;
    z-index: 6;
    min-width: 194px;
    max-width: min(320px, calc(100vw - 48px));
    display: grid;
    justify-items: center;
    gap: 3px;
    padding: 10px 28px 10px 16px;
    border: 1px solid rgba(226, 232, 240, 0.95);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 12px 26px rgba(20, 30, 45, 0.12);
    text-align: center;
    transform: translateX(-50%);
    pointer-events: auto;
}

body.bon-kiosk-navigation.is-tour-page .bon-dpad-place-tip {
    display: none;
}

body.bon-kiosk-navigation .bon-dpad-place-locality,
body.bon-kiosk-navigation .bon-dpad-place-zone {
    max-width: 100%;
    overflow-wrap: anywhere;
    line-height: 1.05;
    letter-spacing: 0;
}

body.bon-kiosk-navigation .bon-dpad-place-locality {
    color: rgba(22, 32, 46, 0.92);
    font-size: 18px;
    font-weight: 900;
}

body.bon-kiosk-navigation .bon-dpad-place-zone {
    color: rgba(22, 32, 46, 0.6);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

body.bon-kiosk-navigation .bon-dpad-place-change {
    position: absolute;
    right: -13px;
    top: -12px;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 2px solid rgba(220, 252, 231, 0.92);
    border-radius: 999px;
    background: linear-gradient(145deg, #22c55e 0%, #16a34a 74%, #0f7a38 100%);
    color: #ffffff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.42), 0 8px 18px rgba(15, 118, 54, 0.22), 0 0 12px rgba(34, 197, 94, 0.16);
    animation: bon-dpad-place-spin 2.8s linear infinite;
    cursor: pointer;
}

body.bon-kiosk-navigation .bon-dpad-place-change svg {
    width: 18px;
    height: 18px;
    stroke: currentColor;
    stroke-width: 2.7;
    stroke-linecap: round;
    stroke-linejoin: round;
    fill: none;
}

@keyframes bon-dpad-place-spin {
    to {
        transform: rotate(360deg);
    }
}

body.bon-kiosk-navigation .bon-floating-pad::before,
body.bon-kiosk-navigation .bon-floating-pad::after {
    content: "";
    position: absolute;
    inset: 18px;
    border-radius: 999px;
    border: 2px solid rgba(22, 32, 46, 0.12);
    pointer-events: none;
}

body.bon-kiosk-navigation .bon-floating-pad::after {
    inset: 49px;
    border-color: rgba(255, 255, 255, 0.62);
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-btn {
    position: absolute;
    z-index: 2;
    width: 42px;
    height: 42px;
    border-radius: 999px;
    background: transparent !important;
    color: var(--bon-text) !important;
    border: 0 !important;
    box-shadow: none !important;
    opacity: 0.46;
    transition: background-color 0.12s ease, color 0.12s ease, opacity 0.12s ease, box-shadow 0.12s ease;
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-btn:hover,
body.bon-kiosk-navigation .bon-floating-pad .bon-pad-btn.is-pressed,
body.bon-kiosk-navigation .bon-floating-pad .bon-pad-btn.is-joystick-active {
    background: rgba(59, 130, 246, 0.94) !important;
    color: #ffffff !important;
    opacity: 1;
    box-shadow: 0 0 0 7px rgba(96, 165, 250, 0.22), 0 0 24px rgba(59, 130, 246, 0.58) !important;
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-up {
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-up.is-pressed,
body.bon-kiosk-navigation .bon-floating-pad .bon-pad-up.is-joystick-active {
    transform: translateX(-50%);
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-down {
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-down.is-pressed,
body.bon-kiosk-navigation .bon-floating-pad .bon-pad-down.is-joystick-active {
    transform: translateX(-50%);
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-left {
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-left.is-pressed,
body.bon-kiosk-navigation .bon-floating-pad .bon-pad-left.is-joystick-active {
    transform: translateY(-50%);
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-right {
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-right.is-pressed,
body.bon-kiosk-navigation .bon-floating-pad .bon-pad-right.is-joystick-active {
    transform: translateY(-50%);
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-center {
    display: none;
}

body.bon-dpad-can-close.bon-kiosk-navigation .bon-floating-pad .bon-pad-center {
    position: absolute;
    z-index: 10270;
    right: -5px;
    top: -5px;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border: 2px solid rgba(220, 252, 231, 0.94) !important;
    border-radius: 999px;
    background: linear-gradient(145deg, #22c55e 0%, #16a34a 72%, #0f7a38 100%) !important;
    color: #ffffff !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.42), 0 10px 22px rgba(15, 118, 54, 0.28), 0 0 14px rgba(34, 197, 94, 0.18) !important;
    opacity: 1;
    pointer-events: auto;
    transform: none;
}

body.bon-map-detail-active.bon-dpad-can-close.bon-kiosk-navigation .bon-floating-pad .bon-pad-center,
body.iframe-detail-active.bon-dpad-can-close.bon-kiosk-navigation .bon-floating-pad .bon-pad-center {
    right: -18px;
    top: -18px;
    width: 52px;
    height: 52px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.42), 0 14px 32px rgba(15, 118, 54, 0.34), 0 0 26px rgba(34, 197, 94, 0.28) !important;
}

body.bon-dpad-can-close.bon-kiosk-navigation .bon-floating-pad .bon-pad-center svg {
    width: 21px;
    height: 21px;
    stroke-width: 3;
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-center,
body.bon-dpad-can-close.bon-kiosk-navigation .bon-floating-pad .bon-pad-center,
body.bon-map-detail-active.bon-dpad-can-close.bon-kiosk-navigation .bon-floating-pad .bon-pad-center,
body.iframe-detail-active.bon-dpad-can-close.bon-kiosk-navigation .bon-floating-pad .bon-pad-center {
    display: none !important;
    pointer-events: none !important;
}

body.bon-kiosk-navigation .bon-joystick-knob {
    position: absolute;
    z-index: 4;
    left: 50%;
    top: 50%;
    width: 64px;
    height: 64px;
    border-radius: 999px;
    border: 2px solid rgba(191, 219, 254, 0.92);
    background:
        linear-gradient(145deg, rgba(59, 130, 246, 0.92) 0%, rgba(14, 165, 233, 0.72) 100%) !important;
    color: #ffffff !important;
    display: grid;
    place-items: center;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.52), 0 10px 24px rgba(20, 30, 45, 0.3), 0 0 18px rgba(37, 99, 235, 0.18);
    transform: translate(-50%, -50%);
    transition: none;
    cursor: grab;
    pointer-events: auto;
    touch-action: none;
    -ms-touch-action: none;
    user-select: none;
    -webkit-user-select: none;
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-btn {
    touch-action: manipulation;
    -ms-touch-action: manipulation;
    user-select: none;
    -webkit-user-select: none;
}

body.bon-kiosk-navigation .bon-floating-pad.is-joystick-grab .bon-joystick-knob {
    transition: none;
    cursor: grabbing;
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-btn svg {
    width: 24px;
    height: 24px;
    stroke-width: 2.4;
}

body.bon-kiosk-navigation .bon-joystick-knob svg {
    width: 30px;
    height: 30px;
    stroke-width: 2.6;
}

body.bon-kiosk-navigation .bon-floating-pad .bon-pad-btn.bon-pad-down:not(:disabled),
body.bon-kiosk-navigation .bon-floating-pad .bon-pad-btn.bon-pad-center:not(:disabled) {
    animation: none;
}

body.bon-kiosk-navigation.bon-vertical-scroll-pad {
    --bon-kiosk-scroll-pad-w: 126px;
}

body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad {
    width: var(--bon-kiosk-scroll-pad-w);
    height: var(--bon-nav-bottom-h);
    min-height: 84px;
    left: max(22px, calc(50vw - (var(--bon-kiosk-main-nav-w) / 2) - var(--bon-kiosk-scroll-pad-w) - var(--bon-kiosk-side-gap))) !important;
    bottom: var(--bon-nav-safe-bottom) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px;
    border-radius: 30px;
}

body.bon-kiosk-navigation.bon-vertical-scroll-pad.is-toscpiu .bon-floating-pad {
    left: max(22px, calc((100vw - var(--bon-kiosk-main-nav-w)) / 2 - var(--bon-kiosk-scroll-pad-w) - 16px)) !important;
    bottom: var(--bon-nav-safe-bottom) !important;
}

body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad::before,
body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad::after,
body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-map-control-dock,
body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-joystick-knob,
body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-left,
body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-right,
body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-center {
    display: none !important;
    pointer-events: none !important;
}

body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-up,
body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-down {
    position: static;
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    opacity: 0.72;
    transform: none !important;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18) !important;
    color: var(--bon-text) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18) !important;
    pointer-events: auto;
}

body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-up:hover,
body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-down:hover,
body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-up:focus-visible,
body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-down:focus-visible,
body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-up.is-pressed,
body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-down.is-pressed {
    background: rgba(59, 130, 246, 0.94) !important;
    color: #ffffff !important;
    opacity: 1;
    box-shadow: 0 0 0 7px rgba(96, 165, 250, 0.22), 0 0 24px rgba(59, 130, 246, 0.48) !important;
    outline: none;
}

@keyframes bon-scroll-hint-down {
    0%, 100% {
        transform: translateY(0) scale(1);
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28), 0 4px 12px rgba(15, 23, 42, 0.08);
    }
    50% {
        transform: translateY(2.5px) scale(1.05);
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.45), 0 6px 18px rgba(15, 23, 42, 0.16);
    }
}

@keyframes bon-scroll-hint-up {
    0%, 100% {
        transform: translateY(0) scale(1);
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28), 0 4px 12px rgba(15, 23, 42, 0.08);
    }
    50% {
        transform: translateY(-2.5px) scale(1.05);
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.45), 0 6px 18px rgba(15, 23, 42, 0.16);
    }
}

body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-down:not(:disabled) {
    animation: bon-scroll-hint-down 2.6s ease-in-out infinite !important;
}

body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-up:not(:disabled) {
    animation: bon-scroll-hint-up 2.6s ease-in-out infinite !important;
}

body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-up:disabled,
body.bon-kiosk-navigation.bon-vertical-scroll-pad .bon-floating-pad .bon-pad-down:disabled {
    opacity: 0.22;
    background: rgba(255, 255, 255, 0.1) !important;
    color: rgba(22, 32, 46, 0.58) !important;
    box-shadow: none !important;
    pointer-events: none;
    animation: none !important;
}

body.bon-kiosk-navigation .bon-modal-layer {
    background: rgba(14, 15, 18, 0.24);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

body.bon-kiosk-navigation .bon-modal {
    border-radius: 32px !important;
    background: var(--bon-surface-strong) !important;
    border: 1px solid rgba(255, 255, 255, 0.46) !important;
    box-shadow: 0 34px 90px rgba(20, 30, 45, 0.28) !important;
}

body.bon-kiosk-navigation .bon-modal-head {
    padding: 24px 28px;
    border-color: var(--bon-border) !important;
}

body.bon-kiosk-navigation .bon-modal-title {
    font-size: 30px;
    font-weight: 900;
    letter-spacing: 0;
}

body.bon-kiosk-navigation .bon-modal-kicker {
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.16em;
    color: var(--bon-text-muted) !important;
}

body.bon-kiosk-navigation .bon-panel-option,
body.bon-kiosk-navigation .bon-language-option,
body.bon-kiosk-navigation .bon-theme-option,
body.bon-kiosk-navigation .bon-search-hit {
    min-height: 64px;
    border-radius: 22px !important;
    background: var(--bon-surface-soft) !important;
    border-color: var(--bon-border) !important;
    box-shadow: none !important;
}

body.bon-kiosk-navigation .bon-panel-option:hover,
body.bon-kiosk-navigation .bon-language-option:hover,
body.bon-kiosk-navigation .bon-theme-option:hover {
    background: #e8edf3 !important;
    border-color: var(--bon-border-strong) !important;
}

body.bon-kiosk-navigation .bon-theme-option.is-active,
body.bon-kiosk-navigation .bon-language-option.is-active {
    background: var(--bon-brand) !important;
    color: #ffffff !important;
    border-color: var(--bon-brand) !important;
    box-shadow: 0 12px 28px rgba(228, 24, 28, 0.32) !important;
}

body.bon-kiosk-navigation.is-toscpiu #tosc-topbar,
body.bon-kiosk-navigation.is-unpli-page #tosc-topbar {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Kiosk TOSC command center: location sheet + category pills */
body.bon-kiosk-navigation.is-toscpiu #tosc-topbar {
    width: var(--bon-kiosk-command-w);
    max-width: var(--bon-kiosk-command-w);
    left: 50% !important;
    bottom: 150px;
    flex-wrap: nowrap;
    gap: 10px;
    row-gap: 10px;
    padding: 13px 18px;
    border-radius: 999px;
    background: var(--bon-surface);
    border: 0;
    box-shadow: 0 20px 50px rgba(20, 30, 45, 0.2);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

body.bon-has-dpad.bon-kiosk-navigation.is-toscpiu #tosc-topbar {
    left: var(--bon-panel-safe-center, 50%) !important;
    width: var(--bon-panel-safe-width, var(--bon-kiosk-command-w));
    max-width: var(--bon-panel-safe-width, var(--bon-kiosk-command-w));
}

body.bon-kiosk-navigation.is-toscpiu #sidebar-toggle {
    width: 56px;
    height: 56px;
    border-radius: 999px;
    background: var(--bon-surface);
    color: var(--bon-text-muted);
    border: 2px solid var(--bon-border);
    box-shadow: none;
}

body.bon-kiosk-navigation.is-toscpiu #sidebar-toggle.active,
body.bon-kiosk-navigation.is-toscpiu #sidebar-toggle:hover {
    color: var(--bon-brand);
    border-color: var(--bon-brand);
    background: var(--bon-surface);
}

body.bon-has-place-selection.bon-kiosk-navigation.is-toscpiu #sidebar-toggle {
    color: #ffffff;
    border-color: rgba(220, 252, 231, 0.94);
    background: linear-gradient(145deg, #22c55e 0%, #16a34a 72%, #0f7a38 100%);
    animation: bon-place-pin-pulse 1.6s ease-in-out infinite;
}

@keyframes bon-place-pin-pulse {
    0%,
    100% {
        box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.34), 0 10px 24px rgba(15, 118, 54, 0.18);
    }
    50% {
        box-shadow: 0 0 0 9px rgba(34, 197, 94, 0), 0 14px 30px rgba(15, 118, 54, 0.28);
    }
}

body.bon-kiosk-navigation.is-toscpiu .tosc-tab {
    min-height: 56px;
    flex: 1 1 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-width: 0;
    padding: 0 12px;
    border-radius: 999px;
    background: var(--bon-surface-soft) !important;
    color: var(--bon-text) !important;
    border: 0 !important;
    box-shadow: none !important;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
}

body.bon-kiosk-navigation.is-toscpiu .tosc-tab svg {
    width: 18px;
    height: 18px;
    stroke-width: 2;
    flex: 0 0 auto;
}

body.bon-kiosk-navigation.is-toscpiu .tosc-tab span {
    min-width: 0;
    overflow: hidden;
    text-overflow: clip;
    white-space: nowrap;
}

body.bon-kiosk-navigation.is-toscpiu .tosc-tab.active {
    background: var(--bon-brand) !important;
    color: #ffffff !important;
    box-shadow: 0 12px 28px rgba(228, 24, 28, 0.4) !important;
}

body.bon-kiosk-navigation.is-toscpiu .area-badge {
    min-height: 26px;
    max-width: 250px;
    padding: 0 8px;
    gap: 5px;
    border-radius: 999px;
    background: var(--bon-surface-soft) !important;
    color: var(--bon-text-muted) !important;
    border: 0 !important;
    box-shadow: none !important;
    font-size: 8.3px;
    letter-spacing: 0.06em;
}

body.bon-kiosk-navigation.is-toscpiu .area-badge svg {
    width: 12px;
    height: 12px;
}

body.bon-kiosk-navigation.is-toscpiu .area-badge span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.bon-kiosk-navigation.is-toscpiu .area-badge.is-location {
    background: #eef2f7 !important;
}

body.bon-kiosk-navigation.is-toscpiu .tosc-selection-stack {
    position: fixed;
    left: calc((100vw - var(--bon-kiosk-command-w)) / 2 + 46px);
    bottom: calc(var(--bon-nav-safe-bottom) + 196px);
    transform: translateX(-50%);
    z-index: 10145;
    display: flex;
    align-items: center;
    gap: 7px;
    max-width: 232px;
    pointer-events: auto;
}

body.bon-kiosk-navigation.is-toscpiu.bon-has-dpad .tosc-selection-stack {
    display: none;
}

body.bon-kiosk-navigation.is-toscpiu .tosc-selection-values {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    min-width: 0;
}

body.bon-kiosk-navigation.is-toscpiu .tosc-selection-reopen {
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    border: 0;
    background: var(--bon-surface-soft);
    color: var(--bon-text-muted);
    box-shadow: 0 10px 24px rgba(20, 30, 45, 0.16);
}

body.bon-kiosk-navigation.is-toscpiu .tosc-selection-reopen:hover,
body.bon-kiosk-navigation.is-toscpiu .tosc-selection-reopen:focus-visible {
    color: var(--bon-brand);
}

body.bon-kiosk-navigation.is-toscpiu.bon-place-sheet-open .tosc-selection-stack {
    opacity: 0;
    pointer-events: none;
}

body.bon-kiosk-navigation.is-toscpiu #tosc-filter-panel {
    width: var(--bon-kiosk-command-w);
    max-width: var(--bon-kiosk-command-w);
    left: 50% !important;
    right: auto;
    bottom: 236px;
    top: auto;
    transform: translateX(-50%) translateY(24px);
    max-height: min(48vh, 520px);
    border-radius: 32px;
    background: var(--bon-surface);
    border: 0;
    box-shadow: 0 30px 70px rgba(20, 30, 45, 0.26);
    scrollbar-width: none;
    -ms-overflow-style: none;
}

body.bon-kiosk-navigation.is-toscpiu #tosc-filter-panel::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}

body.bon-kiosk-navigation.is-toscpiu #tosc-filter-panel.open {
    transform: translateX(-50%) translateY(0);
}

body.bon-kiosk-navigation.is-toscpiu .bon-floating-pad {
    left: max(22px, calc((100vw - var(--bon-kiosk-main-nav-w)) / 2 - var(--bon-kiosk-joystick-size) - 16px)) !important;
    bottom: calc(var(--bon-nav-safe-bottom) - 32px) !important;
    transform: none !important;
}

body.bon-kiosk-navigation.is-toscpiu .filter-panel-header {
    padding: 16px 58px 14px;
    background: transparent;
    border-bottom-color: var(--bon-border);
    color: var(--bon-text);
}

body.bon-kiosk-navigation.is-toscpiu .filter-panel-title {
    color: var(--bon-text);
    font-size: 26px;
    letter-spacing: 0;
    text-transform: none;
}

body.bon-kiosk-navigation.is-toscpiu .filter-section {
    padding: 18px 28px 14px;
}

body.bon-kiosk-navigation.is-toscpiu .filter-section-label {
    color: var(--bon-text-muted);
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: none;
    margin-bottom: 10px;
}

body.bon-kiosk-navigation.is-toscpiu .filter-chips {
    gap: 9px;
    padding-bottom: 0;
}

body.bon-kiosk-navigation.is-toscpiu .filter-chip {
    min-height: 42px;
    padding: 0 16px;
    border-radius: 999px;
    background: var(--bon-surface) !important;
    color: var(--bon-text) !important;
    border: 1px solid var(--bon-border) !important;
    box-shadow: none !important;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: none;
    line-height: 1;
}

body.bon-kiosk-navigation.is-toscpiu .filter-chip:hover {
    border-color: var(--bon-border-strong) !important;
    transform: translateY(-2px);
}

body.bon-kiosk-navigation.is-toscpiu .filter-chip.active {
    background: var(--bon-brand) !important;
    color: #ffffff !important;
    border-color: var(--bon-brand) !important;
    box-shadow: 0 12px 26px rgba(228, 24, 28, 0.4) !important;
}

/* Public desktop/mobile: same language, lower density. */
body.bon-site-navigation .bon-site-header {
    background: rgba(255, 255, 255, 0.84);
    border-bottom-color: rgba(22, 32, 46, 0.1);
    box-shadow: 0 18px 48px rgba(20, 30, 45, 0.08);
}

html.dark body.bon-site-navigation .bon-site-header,
html[data-bon-theme="dark"] body.bon-site-navigation .bon-site-header {
    background: rgb(13 19 31);
    border-bottom-color: rgba(22, 32, 46, 0.1);
    box-shadow: 0 18px 48px rgba(20, 30, 45, 0.08);
}

body.bon-site-navigation .bon-site-quickbar {
    border-radius: 999px;
    background: var(--bon-surface);
    box-shadow: 0 14px 34px rgba(20, 30, 45, 0.1);
}

body.bon-site-navigation .bon-site-quick-item,
body.bon-site-navigation .bon-site-categorybar button,
body.bon-site-navigation .bon-site-place-trigger {
    border-radius: 999px;
    font-weight: 900;
}

body.bon-site-navigation .bon-site-quick-item.is-active,
body.bon-site-navigation .bon-site-categorybar button.is-active,
body.bon-site-navigation .bon-site-place-trigger.has-place {
    background: var(--bon-brand);
    color: #ffffff;
    border-color: var(--bon-brand);
    box-shadow: 0 12px 26px rgba(228, 24, 28, 0.28);
}

body.bon-site-navigation .bon-site-categorybar {
    background: rgba(243, 245, 248, 0.92);
    border-bottom-color: rgba(22, 32, 46, 0.08);
}

body.bon-site-navigation .bon-site-categorygroup button,
body.bon-site-navigation .bon-site-place-trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
}

body.bon-site-navigation .bon-site-categorygroup button svg {
    width: 18px;
    height: 18px;
    stroke-width: 2;
    flex: 0 0 auto;
}

body.is-toscpiu .tosc-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.48rem;
}

body.is-toscpiu .tosc-tab svg {
    width: 1.05rem;
    height: 1.05rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    flex: 0 0 auto;
}

body.bon-mobile-navigation:not(.bon-kiosk-navigation) .bon-site-header {
    box-shadow: none;
    isolation: isolate;
}

body.bon-mobile-navigation:not(.bon-kiosk-navigation) .bon-site-header::before {
    content: "";
    position: absolute;
    inset: 8px 10px;
    z-index: 0;
    pointer-events: none;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12);
    backdrop-filter: blur(16px) saturate(1.08);
    -webkit-backdrop-filter: blur(16px) saturate(1.08);
}

body.bon-mobile-navigation:not(.bon-kiosk-navigation) .bon-site-logo,
body.bon-mobile-navigation:not(.bon-kiosk-navigation) .bon-site-menu-btn {
    position: relative;
    z-index: 1;
}

html.dark body.bon-mobile-navigation:not(.bon-kiosk-navigation) .bon-site-header::before,
html[data-bon-theme="dark"] body.bon-mobile-navigation:not(.bon-kiosk-navigation) .bon-site-header::before {
    border-color: rgba(255, 255, 255, 0.1);
    background: rgba(15, 23, 42, 0.82);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.28);
}

/* Kiosk touch scroll contract: keep the joystick locked, but let content panels pan. */
body.bon-kiosk-navigation.is-toscpiu #tosc-main,
body.bon-kiosk-navigation.is-toscpiu .bon-tosc-shell,
body.bon-kiosk-navigation.is-toscpiu .tosc-view,
body.bon-kiosk-navigation.is-toscpiu .tosc-view > div,
body.bon-kiosk-navigation.is-toscpiu #tosc_alloggi,
body.bon-kiosk-navigation.is-toscpiu #tosc_ristoranti,
body.bon-kiosk-navigation.is-toscpiu #tosc_eventi,
body.bon-kiosk-navigation.is-toscpiu #tosc_punti_interesse,
body.bon-kiosk-navigation.is-unpli-page #tosc-main,
body.bon-kiosk-navigation.is-unpli-page .bon-tosc-shell,
body.bon-kiosk-navigation.is-unpli-page .tosc-view,
body.bon-kiosk-navigation.is-unpli-page .tosc-view > div,
body.bon-kiosk-navigation.is-unpli-page #tosc_eventi,
body.bon-kiosk-navigation .bon-detail-page,
body.bon-kiosk-navigation .bon-detail-wrap,
body.bon-kiosk-navigation .bon-detail-main,
body.bon-kiosk-navigation .bon-detail-content,
body.bon-kiosk-navigation.is-mappa .poi-detail-panel,
body.bon-kiosk-navigation.is-mappa .poi-detail-info-col,
body.bon-kiosk-navigation.is-mappa .poi-detail-content,
body.bon-kiosk-navigation.is-mappa #poi-detail-body,
body.bon-kiosk-navigation.is-mappa #iframe-modal-overlay:not(.hidden) #iframe-modal-container,
body.bon-kiosk-navigation.is-mappa #iframe-modal-overlay:not(.hidden) #iframe-content,
body.bon-kiosk-navigation .dw-widget,
body.bon-kiosk-navigation dw-gen-detail-page,
body.bon-kiosk-navigation dw-gen-detail-page-list,
body.bon-kiosk-navigation dw-gen-product-detail,
body.bon-kiosk-navigation dw-gen-search-result,
body.bon-kiosk-navigation dw-gen-product-list {
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    overscroll-behavior: contain;
}

body.bon-kiosk-navigation #tosc-filter-panel,
body.bon-kiosk-navigation #tosc-wizard-box,
body.bon-kiosk-navigation .unpli-event-modal,
body.bon-kiosk-navigation .dolomititx-modal-card {
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    overscroll-behavior: contain;
}

body.bon-kiosk-navigation #tosc-topbar,
body.bon-kiosk-navigation .tosc-topbar,
body.bon-kiosk-navigation .bon-kiosk-category-rail,
body.bon-kiosk-navigation.is-mappa .poi-detail-thumbs,
body.bon-kiosk-navigation .custom-scrollbar-x,
body.bon-kiosk-navigation .forecast-strip {
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x;
    overscroll-behavior-x: contain;
}

body.bon-mobile-navigation:not(.bon-kiosk-navigation) .bon-site-quickbar {
    border-radius: 28px 28px 0 0;
}

body.bon-mobile-navigation:not(.bon-kiosk-navigation) .bon-site-quick-item:not(.is-active) {
    color: #050505 !important;
    -webkit-text-fill-color: #050505 !important;
    opacity: 1 !important;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.82), 0 0 12px rgba(255, 255, 255, 0.72), 0 2px 8px rgba(15, 23, 42, 0.28);
}

body.bon-mobile-navigation:not(.bon-kiosk-navigation) .bon-site-quick-item:not(.is-active) svg {
    color: #050505 !important;
    stroke: currentColor !important;
    opacity: 1 !important;
    filter: drop-shadow(0 1px 0 rgba(255, 255, 255, 0.9)) drop-shadow(0 0 7px rgba(255, 255, 255, 0.74)) drop-shadow(0 2px 5px rgba(15, 23, 42, 0.24));
}

html.dark body.bon-mobile-navigation:not(.bon-kiosk-navigation) .bon-site-quick-item:not(.is-active),
html[data-bon-theme="dark"] body.bon-mobile-navigation:not(.bon-kiosk-navigation) .bon-site-quick-item:not(.is-active) {
    color: #050505 !important;
    -webkit-text-fill-color: #050505 !important;
    opacity: 1 !important;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.86), 0 0 12px rgba(255, 255, 255, 0.78), 0 2px 8px rgba(15, 23, 42, 0.3);
}

html.dark body.bon-mobile-navigation:not(.bon-kiosk-navigation) .bon-site-quick-item:not(.is-active) svg,
html[data-bon-theme="dark"] body.bon-mobile-navigation:not(.bon-kiosk-navigation) .bon-site-quick-item:not(.is-active) svg {
    color: #050505 !important;
    stroke: currentColor !important;
    opacity: 1 !important;
    filter: drop-shadow(0 1px 0 rgba(255, 255, 255, 0.9)) drop-shadow(0 0 7px rgba(255, 255, 255, 0.76)) drop-shadow(0 2px 5px rgba(15, 23, 42, 0.28));
}

@media (max-width: 1100px) {
    body.bon-kiosk-navigation.is-index-page .bon-bottom-panel {
        width: min(760px, calc(100vw - 48px));
    }

    body.bon-kiosk-navigation.is-index-page .bon-nav-item {
        min-height: 58px;
        padding: 0 10px;
        gap: 7px;
        font-size: 14px;
        letter-spacing: 0.02em;
        white-space: nowrap;
    }

    body.bon-kiosk-navigation.is-index-page .bon-nav-item svg {
        width: 23px;
        height: 23px;
    }
}

@media (max-width: 900px) {
    body.bon-kiosk-navigation .bon-bottom-panel {
        width: calc(100vw - 24px);
        bottom: 18px;
        padding: 10px;
        border-radius: 24px;
        overflow: hidden;
        justify-content: center;
    }

    body.bon-kiosk-navigation .bon-nav-item {
        min-width: 0;
        min-height: 56px;
        flex: 1 1 0;
        flex-direction: column;
        gap: 4px;
        padding: 0 6px;
        font-size: 10px;
        letter-spacing: 0.08em;
    }

    body.bon-kiosk-navigation .bon-nav-item svg {
        width: 24px;
        height: 24px;
    }

    body.bon-kiosk-navigation .bon-map-control-dock {
        position: absolute;
        right: auto;
        left: 50%;
        top: auto;
        bottom: calc(100% + 12px);
        grid-template-columns: repeat(4, 42px);
        transform: translateX(-50%);
    }

    body.bon-kiosk-navigation .bon-map-control-btn {
        width: 42px;
        height: 42px;
    }

    body.bon-kiosk-navigation .bon-map-control-btn--wide {
        grid-column: span 2;
        width: 92px;
    }

    body.bon-kiosk-navigation .bon-kiosk-category-rail {
        width: calc(100vw - 24px);
        max-width: calc(100vw - 24px);
        bottom: 104px;
        min-height: 60px;
        padding: 10px;
        border-radius: 24px;
        overflow-x: auto;
        justify-content: flex-start;
    }

    body.bon-kiosk-navigation .bon-kiosk-category-tab {
        flex: 0 0 auto;
        min-width: 150px;
        min-height: 48px;
        padding: 0 14px;
        font-size: 12px;
    }

    body.bon-kiosk-navigation .bon-kiosk-category-pin {
        width: auto;
        min-width: min(260px, 46vw);
        max-width: min(360px, 52vw);
        height: 60px;
        flex-basis: auto;
        padding: 0 18px;
        font-size: 14px;
    }

    body.bon-kiosk-navigation.is-toscpiu #tosc-topbar {
        max-width: calc(100vw - 20px);
        width: calc(100vw - 20px);
        bottom: 104px;
        border-radius: 26px;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: flex-start;
        overflow-x: auto;
    }

    body.bon-kiosk-navigation.is-toscpiu .tosc-tab {
        flex: 0 0 auto;
        min-width: 150px;
        font-size: 12px;
        padding: 0 14px;
    }

    body.bon-kiosk-navigation.is-toscpiu #tosc-filter-panel {
        width: calc(100vw - 20px);
        bottom: 178px;
        max-height: 58vh;
    }

    body.bon-kiosk-navigation.is-toscpiu .tosc-selection-stack {
        display: none;
    }

    body.bon-kiosk-navigation.is-toscpiu .bon-floating-pad {
        display: none !important;
    }
}

/* Desktop public navigation: keep active buttons, remove the large capsule frame. */
html body.bon-desktop-navigation.bon-site-navigation:not(.bon-kiosk-navigation) .bon-site-quickbar {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 0 !important;
}

html body.bon-desktop-navigation.bon-site-navigation:not(.bon-kiosk-navigation) .bon-site-quick-item {
    min-height: 46px;
}

@media (max-width: 768px) {
    html body.bon-desktop-navigation.bon-site-navigation:not(.bon-kiosk-navigation) .bon-site-quickbar,
    html body.bon-site-navigation:not(.bon-kiosk-navigation) .bon-site-quickbar {
        background: rgba(255, 255, 255, 0.88) !important;
        border-color: rgba(15, 23, 42, 0.1) !important;
        box-shadow: 0 -12px 34px rgba(15, 23, 42, 0.16), inset 0 0 0 1px rgba(255, 255, 255, 0.74) !important;
        backdrop-filter: blur(16px) saturate(1.08) !important;
        -webkit-backdrop-filter: blur(16px) saturate(1.08) !important;
        border-radius: 28px !important;
    }

    html body.bon-site-navigation:not(.bon-kiosk-navigation) .bon-site-quick-item:not(.is-active) {
        color: #111827 !important;
        -webkit-text-fill-color: #111827 !important;
        opacity: 1 !important;
        text-shadow: none !important;
    }

    html body.bon-site-navigation:not(.bon-kiosk-navigation) .bon-site-quick-item:not(.is-active) svg {
        color: #111827 !important;
        stroke: currentColor !important;
        opacity: 1 !important;
        filter: none !important;
    }
}

html body.bon-desktop-navigation.bon-site-navigation:not(.bon-kiosk-navigation) .bon-site-categorygroup button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.55rem !important;
}

html body.bon-desktop-navigation.bon-site-navigation:not(.bon-kiosk-navigation) .bon-site-categorygroup button svg {
    width: 22px !important;
    height: 22px !important;
    flex: 0 0 22px !important;
    display: block !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2.15 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

html body.bon-desktop-navigation.bon-site-navigation:not(.bon-kiosk-navigation) .bon-site-categorygroup button[data-bon-category-section="eventi"] svg {
    fill: currentColor !important;
    stroke: none !important;
}

html body.bon-desktop-navigation.bon-site-navigation:not(.bon-kiosk-navigation) .bon-site-categorygroup button[data-bon-category-section="eventi"] svg path {
    fill: currentColor !important;
    stroke: none !important;
}