﻿.event-ui * {
    box-sizing: border-box;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif
}

.font-segoe {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.event-ui {
    background: #f4f6f6;
    border-radius:16px;
}

    .event-ui .container {
        width: 100%;
        background: #ffffff;
        border-radius: 16px;
        padding: 0px;
        box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    }

    /* Search Bar */
    .event-ui .search-bar {
        display: flex;
        align-items: center;
        gap: 8px;
/*        margin-bottom: 8px;*/
        justify-content: center;
        padding: 16px 24px;
/*        border-bottom: 2px solid #eee;*/
    }

        .event-ui .search-bar input {
            flex: 1;
            padding: 4px 8px 4px 8px;
            color: #2D5058;
            border: none;
            background: #E2EDEF;
            outline: none;
            font-size: 14px;
        }

            .event-ui .search-bar input::placeholder {
                color: rgba(45, 80, 88, 0.6);
            }

            .event-ui .search-bar input:focus {
                outline: none !important;
            }


.search-input.bg-DCF0F4 {
    border-radius: 200px;
    padding: 4px 4px 4px 16px;
    width: 100%;
}

    .event-ui .filter-btn {
        width: 38px;
        height: 38px;
        border-radius: 50%;
        background: #fff;
        color: white;
        display: flex;
        align-items: center;
        justify-content: center;
        border:none;
    }

.event-ui .scan-btn {
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 50%;
    color: white;
    background: #2D5058;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px;
}
/* Menu */
.event-ui .menu {
    display: flex;
    flex-direction: column;
    padding: 8px 16px;
    overflow-y: auto;
    max-height: calc(100vh - 240px);
    scrollbar-width: thin;
    scrollbar-color: #c0c0c0 transparent;
    border-top: 2px solid #eee;

    &::-webkit-scrollbar-thumb {
        background-color: #c0c0c0;
        border-radius: 4px;
    }

    &::-webkit-scrollbar-track {
        background: transparent;
    }

    &::-webkit-scrollbar-button {
        display: none;
    }
}



    .event-ui .menu-item {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 16px;
    }

        .event-ui .menu-item:hover {
            background: #f0f4f4;
            border-radius: 10px;
            cursor:pointer;
        }

    .event-ui .icon {
        width: 38px;
        height: 38px;
        background: #2d5058;
        color: white;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

.event-ui .text h4 {
    font-size: 14px;
    font-weight:600;
    color: #333;
    margin-bottom: 2px;
}

.event-ui .text p {
    font-size: 11px;
    color: #7a8a8a;
    margin-bottom: 0px;
}



/* Sessions Panel */
.sessions-panel {
    padding: 0px;
    background: white;
    border-radius: 16px;
}

.sessions-panel-icon {
    width: 45px;
    height: 45px;
    background: #2D5058;
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .sessions-panel-icon img {
        width: 20px;
        height: 24px;
        filter: brightness(0) invert(1);
    }

.sessions-filter-tags {
    gap: 6px;
}

    .sessions-filter-tags .all-btn {
        padding: 6px 12px;
        border-radius: 20px;
        border: 1px solid #cccccc;
        color: #505050;
        background-color: #FFFFFF;
        cursor: pointer;
        height: fit-content;
        text-wrap-mode: nowrap;
    }

        .sessions-filter-tags .all-btn:focus {
            outline: 1px solid #000000;
            outline-offset: -1px;
        }

    .sessions-filter-tags .sessions-filter-active {
        background-color: #2D5058;
        color: #FFFFFF;
        border-color: #2D5058;
    }

/* Live / Upcoming toggle */
.sessions-toggle {
    background-color: #EDEDED;
    border-radius: 25px;
    padding: 4px;
    gap: 0;
    display: inline-flex;
}

.sessions-toggle-btn {
    padding: 4px 24px;
    border: none;
    border-radius: 22px;
    background: transparent;
    color: #505050;
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s;
}

    .sessions-toggle-btn:focus {
        outline: 1px solid #000000;
        outline-offset: -1px;
    }

.sessions-toggle-active {
    background-color: #2D5058;
    color: #FFFFFF;
}

/* =========================
   FEEDBACK PANEL CONTAINER
========================= */
.feedback-panel {
    padding: 0px;
    background: white;
    border-radius: 16px;
}


.feedback-header {
    display: flex;
    align-items: center;
    padding: 12px 16px;
}


.feedback-icon {
    width: 45px;
    height: 45px;
    background: #2D5058;
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}


    .feedback-icon img {
        width: 20px;
        height: 24px;
        filter: brightness(0) invert(1);
    }


.feedback-text {
    display: flex;
    flex-direction: column;
    margin-left: 8px; 
}


.feedback-title {
    font-size: 18px;
    font-weight: 600;
    color: #242424;
}


.feedback-subtitle {
    font-size: 14px;
    font-weight: 400;
    color: #7D756E;
}

@media (max-width: 768px) {
    .feedback-div {
        display: block;
        background: white;
    }
}

.sponsors-card.session-card {
    margin-top:0px;
    margin-bottom: 12px;
}

/* Session card */
.session-card {
    background-color: #F6F5F2;
    border-radius: 24px;
    padding: 16px;
    margin-top: 6px;
    margin-bottom: 6px;
    transition: background-color 0.3s ease;
    &:hover {
        background-color: #EDEDED;
        cursor: pointer;
    }

    &:focus {
        outline: none !important;
    }
}

.session-detail-overview {
    overflow-y: auto;
    max-height: calc(100vh - 280px);
    margin-right:4px;

    &::-webkit-scrollbar {
        width: 4px;
    }

    &::-webkit-scrollbar-thumb {
        background-color: #c0c0c0;
        border-radius: 4px;
    }

    &::-webkit-scrollbar-track {
        background: transparent;
    }

    &::-webkit-scrollbar-button {
        display: none;
    }

}


.session-detail-speakers {
    padding-right: 6px;
}


.session-cards-container {
    overflow-y: auto;
    max-height: calc(100vh - 360px);
    padding-right: 4px;

    &::-webkit-scrollbar {
        width: 4px;
    }

    &::-webkit-scrollbar-thumb {
        background-color: #c0c0c0;
        border-radius: 10px;
    }

    &::-webkit-scrollbar-track {
        background: transparent;
    }
}

/* Bottom sheet base (mobile only) */

@media (max-width: 768px) {
    .session-detail-panel {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        height: 100vh;
        background: white;
        border-top-left-radius: 24px;
        border-top-right-radius: 24px;
        box-shadow: 0 -10px 25px rgba(0,0,0,0.1);
        transform: translateY(73vh);
        transition: transform 0.3s ease;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        touch-action: pan-y; /* Allow vertical panning */
        user-select: none; /* Prevent text selection during drag */
    }

    .is-dragging {
        transition: none !important;
        user-select: none !important;
    }

    .bottom-sheet-handle {
        width: 40px;
        height: 5px;
        background: #cbd5e1;
        border-radius: 10px;
        margin: 12px auto;
        cursor: grab;
        touch-action: none; /* Prevent scrolling on handle */
    }

    #header-drag-zone {
        touch-action: none; /* Prevent scrolling on header */
        cursor: grab;
    }

        #header-drag-zone:active,
        .bottom-sheet-handle:active {
            cursor: grabbing;
        }
}

.search-bar input {
    flex: 1;
    padding: 4px 8px 4px 8px;
    color: #2D5058;
    border: none;
    background: #E2EDEF;
    outline: none;
    font-size: 14px;
    border-radius:200px;
}

#zoom-in,#zoom-out{
    height:32px;
}

.left-content {
    max-height: calc(100vh - 60px);
    overflow: hidden;
    border-radius: 16px;
}

#upcomming-session-div, #live-session-div {
    max-height: calc(100vh - 340px) !important;
}

#offerings-card {
    max-height: calc(100vh - 220px);
}

#offerings-panel{
    background:#fff;
}

@media only screen and (max-width:859px) {
    #upcomming-session-div, #live-session-div {
        max-height: calc(100dvh - 300px) !important;
        height: 100dvh;
    }
    #legend {
        display: none;
    }

    /* Hide scrollbars on mobile - keep panels scrollable via touch */
    .event-ui .menu,
    .session-detail-speakers,
    .session-cards-container,
    .building-level-dropdown-panel {
        scrollbar-width: none;
        -ms-overflow-style: none;

        &::-webkit-scrollbar {
            display: none;
        }
    }
}


.session-card:focus {
    outline: 1px solid #000000;
    outline-offset: -1px;
}

.session-card-title {
    line-height: 1.4;
}

/*.session-card-icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}*/

.session-card-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #5C4B00;
    border-radius: 4px;
    padding: 2px 8px;
    margin-left: 6px;
}

.session-card-badge-icon {
    width: 14px;
    height: 14px;
}

.sessions-panel .no-sessions-msg {
    text-align: center;
    padding: 16px 0;
    color: #333333;
    font-size: 16px;
    font-weight: 600;
}

.sessions-panel-header {
    display: flex;
    align-items: center;
}

/* Override d-flex on #no-session to show as block for card layout */
#no-session.d-flex {
    display: block !important;
}

/* Session Detail Panel */
.session-detail-panel {
    background-color: #FFFFFF;
    padding: 0;
    border-radius: 16px;
}

.session-detail-start-btn {
    background-color: #2D5058;
    color: #FFFFFF;
    border-radius: 25px;
    cursor: pointer;
    transition: background-color 0.2s;
}

    .session-detail-start-btn:hover {
        background-color: #1F3B42;
    }

    .session-detail-start-btn:focus {
        outline: 1px solid #000000;
        outline-offset: -1px;
    }

    .session-detail-start-btn img {
        width: 18px;
        height: 18px;
        filter: brightness(0) invert(1);
    }

.session-detail-divider {
/*    border-top: 1px solid #E8E8E8;*/
}

.session-detail-overview-text {
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

    .session-detail-overview-text.expanded {
        display: block;
        -webkit-line-clamp: unset;
        overflow: visible;
    }

.session-detail-showmore-btn {
    cursor: pointer;
    text-decoration: underline;
    font-weight: 600;
    color: #170D2B;
}

/*    .session-detail-showmore-btn:focus {
        outline: 1px solid #000000;
        outline-offset: -1px;
    }*/

/* Speaker card */
.speaker-card {
    background-color: #F6F5F2;
    border-radius: 16px;
    padding: 16px;
}

.speaker-card-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

/* Route Setup Panel */
.route-setup-panel {
    background-color: #FFFFFF;
    border-radius: 16px;
}

.route-setup-accessible-icon {
    width: 20px;
    height: 20px;
}

.route-setup-waypoints {
    position: relative;
}

.route-setup-dot {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    flex-shrink: 0;
}

.route-setup-dot-start {
    background-color: #008AED;
    border: 3px solid #DBF0FF;
}

.route-setup-dot-end {
    position: relative;
}

    .route-setup-dot-end::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 18px;
        height: 20px;
        background-image: url("data:image/svg+xml,%3Csvg width='18' height='20' viewBox='0 0 18 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.55022 2.55027C5.95061 -0.850076 11.4632 -0.850105 14.8636 2.55027C18.2638 5.95066 18.2639 11.4633 14.8636 14.8637L13.6771 16.0375C12.8022 16.8962 11.6666 18.0005 10.2709 19.35C9.39874 20.193 8.01502 20.193 7.14296 19.35L3.65178 15.9535C3.21317 15.5228 2.84599 15.1594 2.55022 14.8637C-0.85012 11.4633 -0.850027 5.95067 2.55022 2.55027ZM8.70643 5.98189C7.04961 5.98192 5.70645 7.32505 5.70645 8.98187C5.70661 10.6386 7.04971 11.9818 8.70643 11.9819C10.3632 11.9819 11.7063 10.6386 11.7064 8.98187C11.7064 7.32503 10.3633 5.98189 8.70643 5.98189Z' fill='%23FF3831'/%3E%3C/svg%3E");
        background-size: contain;
        background-repeat: no-repeat;
        border-radius: 0;
    }

.route-setup-connector {
    margin-left: 5px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 18px;
}

.route-setup-search-field {
    background-color: #DDF0F4;
    border-radius: 25px;
    padding: 10px 16px;
}

.route-setup-search-icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.route-setup-search-input {
    background: transparent;
    outline: none;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

    .route-setup-search-input:focus {
        outline: none !important;
    }

.route-setup-walk-icon {
    width: 32px;
    height: 32px;
    flex-shrink: 0;
}

.route-setup-nav-btn {
    background-color: #FFFFFF;
    border-radius: 8px;
    color: #2D5058;
    padding: 10px 16px;
    cursor: pointer;
    transition: background-color 0.2s;
}

    .route-setup-nav-btn:hover {
        background-color: #DDF0F4;
    }

    .route-setup-nav-btn:focus {
        outline: 1px solid #000000;
        outline-offset: -1px;
    }

.route-setup-nav-icon {
    width: 14px;
    height: 14px;
}

.route-setup-nav-icon-next {
    transform: rotate(180deg);
}

.clr-7B2D8B {
    color: #7B2D8B;
}

.clr-2D5058 {
    color: #2D5058;
}

.bg-2D5058{
    background-color:#2D5058;
}

.clr-7D756E {
    color: #7D756E;
}

.clr-7C746D {
    color: #7C746D;
}

.clr-6B4D00 {
    color: #6B4D00;
}

.clr-0E1726 {
    color: #0E1726;
}

.clr-8D518F {
    color: #8D518F;
}

.clr-17253D {
    color: #17253D;
}

.clr-170D2B {
    color: #170D2B;
}

.bg-DCF0F4 {
    background-color: #DCF0F4;
}

.search-input-style-panel::placeholder {
    color: rgba(45, 80, 88, 0.6);
}

.bg-DDF0F4 {
    background-color: #DDF0F4;
}

.search-input-style-panel {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-top-right-radius: 200px;
    border-bottom-right-radius: 200px;
    padding: 12px;


    &:focus {
        outline: none !important;
    }
}

.search-input-style-panel-btn {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-top-left-radius: 200px;
    border-bottom-left-radius: 200px;
}

.border-radius-16px {
    border-radius: 16px;
}

.gap-4px {
    gap: 4px;
}

.gap-8px {
    gap: 8px;
}

.font-size-18px {
    font-size: 1.125rem !important;
}

    .font-size-12px {
    font-size: 0.75rem;
}

.font-size-11px {
    font-size: 0.6875rem;
}

.font-size-16px {
    font-size: 1rem;
}

.font-size-17px {
    font-size: 1.0625rem !important;
}

.font-size-14px {
    font-size: 0.875rem;
}

.font-size-13px {
    font-size: 0.8125rem;
}

.bgcol-E2EDEF {
    background-color: #E2EDEF;
}
.height-16px{
    height:16px;
}
/* Hotels and Shuttles Panel */
.hotels-shuttles-panel {
    padding: 0px;
    background: white;
    border-radius: 16px;
}

    .hotels-shuttles-panel .sessions-panel-header {
        padding-bottom: 8px;
    }

    .hotels-shuttles-panel .session-card {
        cursor: pointer;
    }

        .hotels-shuttles-panel .session-card .hotel-card-name {
            font-size: 14px;
            font-weight: 600;
            color: #0E1726;
            margin-bottom: 8px;
        }

        .hotels-shuttles-panel .session-card .hotel-card-address,
        .hotels-shuttles-panel .session-card .hotel-card-distance {
            font-size: 12px;
            font-weight: 600;
            color: #7C746D;
        }

    .hotels-shuttles-panel .no-sessions-msg {
        text-align: center;
        padding: 40px 16px;
    }

.hotel-card-icon {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.hotels-search-sort-btn {
    background: transparent;
    border: none;
    padding: 4px;
    cursor: pointer;
}

.shuttle-info-description {
    padding-top: 8px;
}

.shuttle-route-card .shuttle-route-hotels {
    list-style-type: disc;
}

    .shuttle-route-card .shuttle-route-hotels li::marker {
        color: #242424;
        font-size: 10px;
    }

.search-bar-hotels {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
    padding: 16px 24px;
}

    .search-bar-hotels input {
        flex: 1;
        padding: 4px 8px 4px 8px;
        color: #2D5058;
        border: none;
        background: #E2EDEF;
        outline: none;
        font-size: 14px;

        &::placeholder {
            color: rgba(45, 80, 88, 0.6);
        }

        &:focus {
            outline: none !important;
        }
    }

.search-input.bg-DCF0F4 {
    border-radius: 200px;
    padding: 4px 4px 4px 16px;
    width: 100%;
}

.search-bar-hotels .filter-btn {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #fff;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
}

.session-cards-container.shuttle-container {
    max-height: none;
}

.session-cards-container.hotels-container {
    max-height: calc(100vh - 310px);
}

.clr-1A1A1A {
    color: #1a1a1a;
}

.clr-4D4D4D {
    color: #4d4d4d;
}

/* Refiner dropdown attached to the search bar's .filter-btn (in _SearchBar partial). */
.filter-dropdown-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.filter-dropdown-wrap .search-dropdown-menu {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    min-width: 160px;
    background: #fff;
    border: none;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    padding: 0;
    z-index: 1000;
    overflow: hidden;
}

.filter-dropdown-wrap .search-dropdown-menu.d-none {
    display: none !important;
}

    .filter-dropdown-wrap .search-dropdown-list {
        background: #fff;
        padding: 12px 12px;
        border: none;
        border-bottom: 1px solid #dbdbdb;
        border-radius: 0;
        cursor: pointer;
        position: relative;
    }

.filter-dropdown-wrap .search-dropdown-list:last-child {
    border-bottom: none;
}

    .filter-dropdown-wrap .search-dropdown-list:hover,
    .filter-dropdown-wrap .search-dropdown-list:focus {
        background: #f4f4f4;
        outline: none;
    }

.filter-dropdown-wrap .search-dropdown-list.selected {
    font-weight: 600;
    color: #2d5058;
}

.filter-dropdown-wrap .search-dropdown-list.selected::before {
    content: '';
    position: absolute;
    left: 4px;
    top: 12px;
    bottom: 4px;
    width: 4px;
    height: 26px;
    background: #2D5058;
    border-radius: 2px;
    z-index: 2;
}

.building-floor-selector {
    position: fixed;
    top: 24px; /* Adjust as needed */
    right: 24px; /* Adjust as needed */
    z-index: 1000; /* Make sure it stays above other elements */
    width: 220px;
    font-family: Arial, sans-serif;
}

.building-group {
    margin-bottom: 0;
}

.gap-4px{
    gap:4px;
}

.building-header {
    background: #e2edef;
    text-wrap-mode: nowrap;
    color: #2D5058;
    font-size: 12px;
    font-weight: 600;
    border: none;
    outline: none;
    width: 100%;
    padding: 8px 12px;
    text-align: left;
    cursor: pointer;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 0;
    transition: background 0.2s;
}

    .building-header.active,
    .building-header:focus {
        background: #E2EDEF;
    }

.level-arrow {
    width: 12px;
    height: 12px;
    transition: transform 0.2s;
}

    .level-arrow.level-rotate {
        transform: rotate(180deg);
    }

/* Trigger button */
#level-dropdown-container {
    position: fixed;
    z-index: 1002;
    top: 24px;
    width: max-content;
}

.building-level-trigger {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 8px;
    cursor: default;
    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

.building-level-trigger-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 10px 20px;
    flex: 1 1 auto;
}

.trigger-venue-name {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: #242424;
    line-height: 18px;
}

.trigger-floor-name {
    font-size: 14px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: #242424;
    line-height: 16px;
    margin-top:4px;
}

.building-level-trigger-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #2D5058;
    border: none;
    outline: none;
    padding: 0 10px;
    cursor: pointer;
    color: #fff;
    flex: 0 0 auto;
    border-bottom-right-radius: 8px;
    border-top-right-radius: 8px;
}

.building-level-trigger-toggle:hover {
    background: #2d5062;
}

.trigger-arrow {
    width: 14px;
    height: 14px;
    transition: transform 0.2s;
}

/* Dropdown panel */
.building-level-dropdown-panel {
    gap: 8px;
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 100%;
    right: 0;
    min-width: 100%;
    width: max-content;
    z-index: 1001;
    background: #fff;
    border: 1px solid #ccc;
    border-top: none;
    border-radius: 0 0 8px 8px;
    max-height: 300px;
    overflow-y: auto;
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
    padding:8px;
}

.floor-list {
    display: flex;
    flex-direction: column;
    gap:4px;
    margin-top:4px;
}

/* Floor buttons in dropdown */
.building-level-dropdown-panel .floor-button {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 8px 16px;
    border: none;
    border-radius: 8px;
    background: #fff;
    width: 100%;
    text-align: left;
    cursor: pointer;
}

    .building-level-dropdown-panel .floor-button:hover {
        background: #F6F6F6;
        color: #2D5058;
    }

    .building-level-dropdown-panel .floor-button.selected {
        background: #F6F6F6;
        color: #2D5058;
        position: relative;
    }

    .building-level-dropdown-panel .floor-button.selected::before {
        content: '';
        position: absolute;
        left: 0;
        top: 4px;
        bottom: 4px;
        width: 3px;
        background: #2D5058;
        border-radius: 2px;
    }

.floor-button-name {
    font-size: 14px;
    font-weight: 500;
    color: #333;
}

.floor-button-level {
    font-size: 12px;
    color: #666;
}

/* Mobile bottom sheet layout for level dropdown */
@media only screen and (max-width: 859px) {
    .level-arrow {
        transform: rotate(180deg);
    }

    .level-arrow.level-rotate {
        transform: rotate(360deg);
    }
        .session-cards-container.hotels-container {
        max-height: calc(100vh - 270px);
    }

    #level-dropdown-container {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 1002;
        display: flex;
        flex-direction: column-reverse;
        width: auto;
        height: fit-content;
        top: auto;
    }

    .event-ui .search-bar {
        border-bottom: none;
    }

    .event-ui .container {
/*        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;*/
        border-radius:0px;
    }

    .event-ui .menu {
        border-top: 2px solid #eee;
    }

    .building-level-trigger {
        border-radius: 0;
        border: none;
        border-top: 1px solid #ccc;
        box-shadow: 0 -2px 8px rgba(0,0,0,0.1);
    }

    .building-level-trigger-text {
        padding: 10px 14px;
    }

    .trigger-venue-name {
        font-size: 15px;
    }

    .trigger-floor-name {
        font-size: 13px;
    }

    .building-level-trigger-toggle {
        padding: 0 14px;
    }

    .trigger-arrow {
        transition: transform 0.2s;
    }

    .building-level-trigger-toggle[aria-expanded="true"] .trigger-arrow {
        transform: rotate(180deg);
    }

    .building-level-dropdown-panel {
        position: relative;
        top: auto;
        bottom: auto;
        left: auto;
        right: auto;
        border-radius: 16px 16px 0 0;
        border: none;
        box-shadow: 0 -4px 16px rgba(0,0,0,0.2);
        max-height: 55vh;
        overflow-y: auto;
        padding:0px 16px 16px;
    }

    /* Drag handle indicator */
        .building-level-dropdown-panel::before, .session-detail-divider::before, .session-details-mobile::before, .explore-popup-div::before {
            content: '';
            display: block;
            width: 80px;
            height: 4px;
            background: #939393;
            border-radius: 2px;
            margin: 6px auto 6px;
        }

    .building-level-dropdown-panel .building-group {
        margin-bottom: 0;
    }

        .building-level-dropdown-panel .building-header {
            background: #E2EDEF;
            color: #333;
            font-weight: 600;
            padding: 14px 16px;
            border-bottom: 1px solid #eee;
            gap: 10px;
            border-radius:8px;
        }

    .building-level-dropdown-panel .building-header .level-arrow {
        color: #555;
    }

    .building-level-dropdown-panel .building-header.active,
    .building-level-dropdown-panel .building-header:focus {
        background: #e2edef;
    }

        .building-level-dropdown-panel .floor-button {
            padding: 12px 20px 12px 28px;
            border-radius: 8px;
        }

    .building-level-dropdown-panel .floor-button.selected {
        background: #f6f6f6;
        padding-left: 25px;
    }

    .floor-button-name {
        font-size: 15px;
    }

    .floor-button-level {
        font-size: 13px;
    }
}

/* Base backdrop (hidden by default) */
.home-panel-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 10;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

/* Mobile only */
@media (max-width: 768px) {

    /* Show backdrop when menu is visible (i.e., NOT d-none) */
    .home-panel-wrapper:has(.home-panel-menu:not(.d-none)):has(.home-panel:not(.d-none)) .home-panel-backdrop {
        opacity: 1;
        pointer-events: auto;
    }

    .feedback-div:not(.d-none) + .home-panel-backdrop {
        opacity: 1;
        pointer-events: auto;
    }

    /* Keep panel above backdrop */
    .home-panel, .feedback-div{
        position: relative;
        z-index: 11;
    }
}