/* Front-end custom css */
/* Reserved Seating */
.modal-big .modal-container {
    width: 100%;
}

.modal-big .modal-container .modal-content {
    min-height: 800px;
}

.modal-small .modal-container {
    width: auto;
    margin: auto;
}

.modal-small .modal-container .modal-content {
    min-height: auto;
}

.is-relative {
    position: relative;
}

.seat-container {
    position: relative;
    overflow-x: auto;
    overflow-y: hidden;
    width: 100%;
    margin: 0 auto;
    padding: 0;
    display: block;
    transform-origin: 0 0;
}

.seat-img {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    border-radius: 8px;
    border: 2px solid var(--bs-border-color);
}

.seat-mark {
    position: absolute;
    z-index: 900;
    height: 24px;
    width: 24px;
    border-radius: 8px;
    background-color: var(--bs-primary);
    color: var(--bs-white);
    line-height: 2.5 !important;
    text-align: center;
    box-shadow: 1px 1px 5px -2px var(--bs-dark);
    font-size: 8px !important;
    font-weight: 800 !important;
    cursor: pointer;
}

.seat-disabled {
    background-color: var(--bs-gray);
    cursor: not-allowed !important;
}

.seat-reserved {
    background-color: var(--bs-danger);
    cursor: not-allowed !important;
}

.seat-select {
    background-color: var(--bs-success);
}

.seat-disabled-col {
    color: var(--bs-gray);
}

.seat-reserved-col {
    color: var(--bs-danger);
}

.seat-select-col {
    color: var(--bs-success);
}

.seat-available-col {
    color: var(--bs-primary);
}

.p-0 {
    padding: 0 !important;
}

.m-0 {
    margin: 0 !important;
}

.w-100 {
    width: 100% !important;
}

.m-auto {
    margin: auto;
}

.no-display {
    display: none;
}

.seat-checkbox {
    position: absolute;
    z-index: 999999;
    height: 24px;
    width: 24px;
    padding: 0 !important;
    margin: 0 !important;
    display: none;
    cursor: pointer;
}

/* Authorize.net */
.wrapper-cc {
    display: flex;
    padding: 2rem;
}

@media screen and (max-width: 700px), (max-height: 500px) {
    .wrapper-cc {
        flex-wrap: wrap;
        flex-direction: column;
    }
}

.card-form {
    max-width: 570px;
    margin: auto;
    width: 100%;
}

@media screen and (max-width: 576px) {
    .card-form {
        margin: 0 auto;
    }
}

.card-form__inner {
    background: var(--bs-white);
    box-shadow: 0 30px 60px 0 rgba(90, 116, 148, 0.4);
    border-radius: 10px;
    padding: 35px;
    padding-top: 180px;
}

@media screen and (max-width: 480px) {
    .card-form__inner {
        padding: 25px;
        padding-top: 165px;
    }
}

@media screen and (max-width: 360px) {
    .card-form__inner {
        padding: 15px;
        padding-top: 165px;
    }
}

.card-form__row {
    display: flex;
    align-items: flex-start;
}

@media screen and (max-width: 480px) {
    .card-form__row {
        flex-wrap: wrap;
    }
}

.card-form__col {
    flex: auto;
    margin-right: 35px;
}

.card-form__col:last-child {
    margin-right: 0;
}

@media screen and (max-width: 480px) {
    .card-form__col {
        margin-right: 0;
        flex: unset;
        width: 100%;
        margin-bottom: 20px;
    }

    .card-form__col:last-child {
        margin-bottom: 0;
    }
}

.card-form__col.-cvv {
    max-width: 150px;
}

@media screen and (max-width: 480px) {
    .card-form__col.-cvv {
        max-width: initial;
    }
}

.card-form__group {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}

.card-form__group .card-input__input {
    flex: 1;
    margin-right: 15px;
}

.card-form__group .card-input__input:last-child {
    margin-right: 0;
}

.card-form__button {
    width: 100%;
    height: 55px;
    background: var(--bs-primary);
    border: none;
    border-radius: 5px;
    font-size: 22px;
    font-weight: 500;
    box-shadow: 3px 10px 20px 0px rgba(var(--bs-primary-rgb), 0.3);
    color: var(--bs-white);
    margin-top: 20px;
    cursor: pointer;
}

@media screen and (max-width: 480px) {
    .card-form__button {
        margin-top: 10px;
    }
}

.card-item {
    max-width: 430px;
    height: 270px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 2;
    width: 100%;
}

@media screen and (max-width: 480px) {
    .card-item {
        max-width: 310px;
        height: 220px;
        width: 90%;
    }
}

@media screen and (max-width: 360px) {
    .card-item {
        height: 180px;
    }
}

.card-item.-active .card-item__side.-front {
    transform: perspective(1000px) rotateY(180deg) rotateX(0deg) rotateZ(0deg);
}

.card-item.-active .card-item__side.-back {
    transform: perspective(1000px) rotateY(0) rotateX(0deg) rotateZ(0deg);
}

.card-item__focus {
    position: absolute;
    z-index: 3;
    border-radius: 5px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transition: all 0.35s cubic-bezier(0.71, 0.03, 0.56, 0.85);
    opacity: 0;
    pointer-events: none;
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, 0.65);
}

.card-item__focus:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: #08142f;
    height: 100%;
    border-radius: 5px;
    filter: blur(25px);
    opacity: 0.5;
}

.card-item__focus.-active {
    opacity: 1;
}

.card-item__side {
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 20px 60px 0 rgba(14, 42, 90, 0.55);
    transform: perspective(2000px) rotateY(0deg) rotateX(0deg) rotate(0deg);
    transform-style: preserve-3d;
    transition: all 0.8s cubic-bezier(0.71, 0.03, 0.56, 0.85);
    backface-visibility: hidden;
    height: 100%;
}

.card-item__side.-back {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    transform: perspective(2000px) rotateY(-180deg) rotateX(0deg) rotate(0deg);
    z-index: 2;
    padding: 0;
    height: 100%;
}

.card-item__side.-back .card-item__cover {
    transform: rotateY(-180deg);
}

.card-item__bg {
    max-width: 100%;
    display: block;
    max-height: 100%;
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.card-item__cover {
    height: 100%;
    background-color: #1c1d27;
    position: absolute;
    height: 100%;
    background-color: #1c1d27;
    left: 0;
    top: 0;
    width: 100%;
    border-radius: 15px;
    overflow: hidden;
}

.card-item__cover:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(6, 2, 29, 0.45);
}

.card-item__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 40px;
    padding: 0 10px;
}

@media screen and (max-width: 480px) {
    .card-item__top {
        margin-bottom: 25px;
    }
}

@media screen and (max-width: 360px) {
    .card-item__top {
        margin-bottom: 15px;
    }
}

.card-item__chip {
    width: 60px;
}

@media screen and (max-width: 480px) {
    .card-item__chip {
        width: 50px;
    }
}

@media screen and (max-width: 360px) {
    .card-item__chip {
        width: 40px;
    }
}

.card-item__type {
    height: 45px;
    position: relative;
    display: flex;
    justify-content: flex-end;
    max-width: 100px;
    margin-left: auto;
    width: 100%;
}

@media screen and (max-width: 480px) {
    .card-item__type {
        height: 40px;
        max-width: 90px;
    }
}

@media screen and (max-width: 360px) {
    .card-item__type {
        height: 30px;
    }
}

.card-item__typeImg {
    max-width: 100%;
    object-fit: contain;
    max-height: 100%;
    object-position: top right;
}

.card-item__info {
    color: var(--bs-white);
    width: 100%;
    max-width: calc(100% - 85px);
    padding: 10px 15px;
    font-weight: 500;
    display: block;
    cursor: pointer;
}

@media screen and (max-width: 480px) {
    .card-item__info {
        padding: 10px;
    }
}

.card-item__holder {
    opacity: 0.7;
    font-size: 13px;
    margin-bottom: 6px;
}

@media screen and (max-width: 480px) {
    .card-item__holder {
        font-size: 12px;
        margin-bottom: 5px;
    }
}

.card-item__wrapper {
    padding: 25px 15px;
    position: relative;
    z-index: 4;
    height: 100%;
    text-shadow: 7px 6px 10px rgba(14, 42, 90, 0.8);
    user-select: none;
}

@media screen and (max-width: 480px) {
    .card-item__wrapper {
        padding: 20px 10px;
    }
}

.card-item__name {
    font-size: 18px;
    line-height: 1;
    white-space: nowrap;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: uppercase;
}

@media screen and (max-width: 480px) {
    .card-item__name {
        font-size: 16px;
    }
}

.card-item__nameItem {
    display: inline-block;
    min-width: 8px;
    position: relative;
}

.card-item__number {
    font-weight: 500;
    line-height: 1;
    color: var(--bs-white);
    font-size: 27px;
    margin-bottom: 35px;
    display: inline-block;
    padding: 10px 15px;
    cursor: pointer;
}

@media screen and (max-width: 480px) {
    .card-item__number {
        font-size: 21px;
        margin-bottom: 15px;
        padding: 10px 10px;
    }
}

@media screen and (max-width: 360px) {
    .card-item__number {
        font-size: 19px;
        margin-bottom: 10px;
        padding: 10px 10px;
    }
}

.card-item__numberItem {
    width: 16px;
    display: inline-block;
}

.card-item__numberItem.-active {
    width: 30px;
}

@media screen and (max-width: 480px) {
    .card-item__numberItem {
        width: 13px;
    }

    .card-item__numberItem.-active {
        width: 16px;
    }
}

@media screen and (max-width: 360px) {
    .card-item__numberItem {
        width: 12px;
    }

    .card-item__numberItem.-active {
        width: 8px;
    }
}

.card-item__content {
    color: var(--bs-white);
    display: flex;
    align-items: flex-start;
}

.card-item__date {
    flex-wrap: wrap;
    font-size: 18px;
    margin-left: auto;
    padding: 10px;
    display: inline-flex;
    width: 80px;
    white-space: nowrap;
    flex-shrink: 0;
    cursor: pointer;
}

@media screen and (max-width: 480px) {
    .card-item__date {
        font-size: 16px;
    }
}

.card-item__dateItem {
    position: relative;
}

.card-item__dateItem span {
    width: 22px;
    display: inline-block;
}

.card-item__dateTitle {
    opacity: 0.7;
    font-size: 13px;
    padding-bottom: 6px;
    width: 100%;
}

@media screen and (max-width: 480px) {
    .card-item__dateTitle {
        font-size: 12px;
        padding-bottom: 5px;
    }
}

.card-item__band {
    background: var(--bs-dark-rgb-80);
    width: 100%;
    height: 50px;
    margin-top: 30px;
    position: relative;
    z-index: 2;
}

@media screen and (max-width: 480px) {
    .card-item__band {
        margin-top: 20px;
    }
}

@media screen and (max-width: 360px) {
    .card-item__band {
        height: 40px;
        margin-top: 10px;
    }
}

.card-item__cvv {
    text-align: right;
    position: relative;
    z-index: 2;
    padding: 15px;
}

.card-item__cvv .card-item__type {
    opacity: 0.7;
}

@media screen and (max-width: 360px) {
    .card-item__cvv {
        padding: 10px 15px;
    }
}

.card-item__cvvTitle {
    padding-right: 10px;
    font-size: 15px;
    font-weight: 500;
    color: var(--bs-white);
    margin-bottom: 5px;
}

.card-item__cvvBand {
    height: 45px;
    background: var(--bs-white);
    margin-bottom: 30px;
    text-align: right;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 10px;
    color: var(--bs-dark);
    font-size: 18px;
    border-radius: 4px;
    box-shadow: 0px 10px 20px -7px rgba(32, 56, 117, 0.35);
}

@media screen and (max-width: 480px) {
    .card-item__cvvBand {
        height: 40px;
        margin-bottom: 20px;
    }
}

@media screen and (max-width: 360px) {
    .card-item__cvvBand {
        margin-bottom: 15px;
    }
}

.card-list {
    margin-bottom: -130px;
}

@media screen and (max-width: 480px) {
    .card-list {
        margin-bottom: -120px;
    }

    .site-slogan {
        text-wrap: wrap;
    }
}

.nav-header.header-position .navbar .site-slogan {
    font-size: 0.8rem;
    font-weight: 600;
    margin-left: 3.4rem !important;
    margin-top: 0.2rem !important;
}

.card-input {
    margin-bottom: 20px;
}

.card-input__label {
    font-size: 14px;
    margin-bottom: 5px;
    font-weight: 500;
    color: var(--bs-dark);
    width: 100%;
    display: block;
    user-select: none;
}

.card-input__input {
    width: 100%;
    height: 50px;
    border-radius: 5px;
    box-shadow: none;
    border: 1px solid var(--bs-border-color);
    transition: all 0.3s ease-in-out;
    font-size: 18px;
    padding: 5px 15px;
    background: var(--bs-white);
    color: var(--bs-body-color);
}

.card-input__input:hover,
.card-input__input:focus {
    border-color: var(--bs-primary);
    background: var(--bs-white);
    color: var(--bs-body-color);
}

.card-input__input:focus {
    box-shadow: 0px 10px 20px -13px rgba(32, 56, 117, 0.35);
}

.card-input__input.-select {
    -webkit-appearance: none;
    background-image: url("data:image/png; base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAeCAYAAABuUU38AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAUxJREFUeNrM1sEJwkAQBdCsngXPHsQO9O5FS7AAMVYgdqAd2IGCDWgFnryLFQiCZ8EGnJUNimiyM/tnk4HNEAg/8y6ZmMRVqz9eUJvRaSbvutCZ347bXVJy/ZnvTmdJ862Me+hAbZCTs6GHpyUi1tTSvPnqTpoWZPUa7W7ncT3vK4h4zVejy8QzM3WhVUO8ykI6jOxoGA4ig3BLHcNFSCGqGAkig2yqgpEiMsjSfY9LxYQg7L6r0X6wS29YJiYQYecemY+wHrXD1+bklGhpAhBDeu/JfIVGxaAQ9sb8CI+CQSJ+QmJg0Ii/EE2MBiIXooHRQhRCkBhNhBcEhLkwf05ZCG8ICCOpk0MULmvDSY2M8UawIRExLIQIEgHDRoghihgRIgiigBEjgiFATBACAgFgghEwSAAGgoBCBBgYAg5hYKAIFYgHBo6w9RRgAFfy160QuV8NAAAAAElFTkSuQmCC");
    background-size: 12px;
    background-position: 90% center;
    background-repeat: no-repeat;
    padding-right: 30px;
}

.slide-fade-up-enter-active {
    transition: all 0.25s ease-in-out;
    transition-delay: 0.1s;
    position: relative;
}

.slide-fade-up-leave-active {
    transition: all 0.25s ease-in-out;
    position: absolute;
}

.slide-fade-up-enter {
    opacity: 0;
    transform: translateY(15px);
    pointer-events: none;
}

.slide-fade-up-leave-to {
    opacity: 0;
    transform: translateY(-15px);
    pointer-events: none;
}

.slide-fade-right-enter-active {
    transition: all 0.25s ease-in-out;
    transition-delay: 0.1s;
    position: relative;
}

.slide-fade-right-leave-active {
    transition: all 0.25s ease-in-out;
    position: absolute;
}

.slide-fade-right-enter {
    opacity: 0;
    transform: translateX(10px) rotate(45deg);
    pointer-events: none;
}

.slide-fade-right-leave-to {
    opacity: 0;
    transform: translateX(-10px) rotate(45deg);
    pointer-events: none;
}

.iframe-full iframe {
    width: 100%;
    height: 80vh;
}

.star-active {
    color: var(--bs-warning);
    cursor: pointer;
}

.star-active:hover {
    color: var(--bs-warning);
}

.star-inactive {
    color: var(--bs-gray-400);
    cursor: pointer;
}

.profile-pic {
    width: 10%;
    border: 3px solid var(--bs-border-color);
}

.star-rating {
    direction: rtl;
    display: inline-block;
    padding: 20px;
}

.star-rating input[type="radio"] {
    display: none;
}

.star-rating label {
    color: var(--bs-gray-400);
    font-size: 18px;
    padding: 0;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.star-rating label:hover,
.star-rating label:hover ~ label,
.star-rating input[type="radio"]:checked ~ label {
    color: var(--bs-warning);
}

#review_modal {
    display: none;
}

.VueCarousel-pagination {
    position: absolute;
    bottom: 2%;
}

#card-element {
    margin-bottom: 2rem;
}

.w-95 {
    width: 95% !important;
}

@media (max-width: 767px) {
    .ticket-title {
        font-size: 0.9rem;
        font-weight: 700;
    }

    .ticket-price {
        font-size: 0.92rem;
        font-weight: 700;
        color: #1e293b;
    }

    .w-m-50 {
        width: 50% !important;
    }
}

.ticket-selected-text {
    color: var(--bs-success);
}

/* api-seat-img */
.api-seat-img {
    padding: 0 !important;
    margin: 0 !important;
    width: 100%;
    border-radius: 8px;
    border: 2px solid var(--bs-border-color);
}

@media (max-width: 768px) {
    .api-seat-img {
        width: unset;
    }
    .m-view {
        display: block !important;
    }
}

/* api-seat-img */

#loading-screen {
    z-index: 99999;
    position: fixed;
    overflow: hidden;
    top: 0;
    display: flex;
    bottom: 0;
    left: 0;
    right: 0;
    justify-content: center;
    width: 100%;
    align-items: center;
    height: 100%;
    background: linear-gradient(155deg, #7f18a8 0%, #1d0475 50%, #7c17a7 100%);
}

.invalid-feedback {
    display: block;
}

.custom-dropdown {
    position: relative;
}

.dropdownmenu {
    list-style: none;
    background-color: var(--bs-white);
    border: 1px solid var(--bs-border-color);
    border-radius: 10px;
    display: inline-block;
    position: absolute;
    width: 208px;
    right: 150px;
    z-index: 99999;
}

.dropdownmenu li {
    position: relative;
    left: -30px;
}

.dropdownmenu a {
    width: 200px;
    padding: 1px;
    color: var(--bs-body-color);
}

.dropdownmenu a:hover {
    background: var(--bs-light);
    color: var(--bs-primary);
}

@media only screen and (min-width: 1200px) {
    .dropdownmenu {
        position: absolute;
        right: 130px;
    }
}

@media only screen and (max-width: 1200px) {
    .dropdownmenu {
        position: absolute;
        top: -12px;
        right: 90px;
        z-index: 99999;
    }
}

/* Select ticket design START */
.avatar.xs {
    width: 16px;
    min-width: 16px;
    height: 16px;
}

.lgx-single-schedule .schedule-info:hover {
    background: var(--bs-light);
}

.lgx-single-schedule .schedule-info:hover p {
    color: var(--bs-primary);
}

.img-hover:hover {
    opacity: 0.8;
    transition: opacity 0.3s ease;
}
/* Select ticket design END */

.organizer-overlay {
    background-color: rgba(0, 0, 0, 0.5);
    border-bottom-left-radius: 1rem;
}

.organizer-overlay img {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    object-fit: cover;
}

.blurred-bg {
    background-size: cover;
    background-position: center;
    filter: blur(20px);
    transform: scale(1.2);
    z-index: 0;
}

.overlay-dark {
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
}
.featured-user-avatar {
    width: 36px;
    height: 36px;
    object-fit: cover;
}

/* Venues Homepage */
.section-title::after {
    content: "";
    display: block;
    width: 60px;
    height: 3px;
    background: #dc3545; /* Bootstrap 'danger' or any accent color */
    margin: 0.5rem auto 0;
}

.venue-card:hover {
    transform: translateY(-5px);
    transition: all 0.3s ease;
}

/* Blogs */
.card-img-top {
    width: 100%;
    height: 200px;
    object-fit: cover;
    background: var(--bs-white);
}

.card-img-top {
    width: 100%;
    aspect-ratio: 16 / 9; /* forces the image box to a 16:9 ratio */
    object-fit: cover; /* crops & scales the image to fill */
}

/* Homepage steps */
/* Hide native radios */
.howit-tabs input[type="radio"] {
    display: none;
}

/* Tab labels */
.howit-tabs .tab-label {
    display: inline-block;
    margin-right: 1rem;
    padding: 0.5rem 1rem;
    font-weight: 600;
    cursor: pointer;
    color: #555;
    border-bottom: 3px solid transparent;
    transition: color 0.2s, border-color 0.2s;
}
.howit-tabs .tab-label:hover {
    color: #000;
}

/* Active tab underline */
#tab-organiser:checked + label[for="tab-organiser"],
#tab-customer:checked + label[for="tab-customer"] {
    color: #000;
    border-color: #000;
}

/* Hide all panels */
.howit-tabs .tab-content .tab-panel {
    display: none;
}
/* Show organiser panel */
#tab-organiser:checked ~ .tab-content .tab-panel.organiser {
    display: block;
}
/* Show customer panel */
#tab-customer:checked ~ .tab-content .tab-panel.customer {
    display: block;
}

/* Step styling */
.step {
    padding-left: 3rem;
}
.step-icon {
    width: 48px;
    height: 48px;
    border: 2px solid #000;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    font-size: 1.25rem;
}
.step-number {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 4rem;
    font-weight: 700;
    color: rgba(0, 0, 0, 0.05);
    line-height: 1;
}
.border-bottom {
    border-bottom: 1px solid #dee2e6;
    margin-top: 2rem;
}

.app-cta-section {
    background-color: #000;
}
.gradient-circle {
    position: absolute;
    top: -155px;
    left: -170px;
    width: 600px;
    height: 500px;
    border-radius: 50%;
    background: radial-gradient(circle at top left, #2176ff, #2176ff);
    z-index: 0;
}
.app-cta-section .container,
.app-cta-section .row > div {
    position: relative; /* bring text & images above the circle */
    z-index: 1;
}
.app-cta-section h2,
.app-cta-section p {
    color: var(--bs-white);
}
.btn-store {
    display: inline-flex;
    align-items: center;
    background: var(--bs-white);
    color: #000;
    border-radius: 0.75rem;
    padding: 0.75rem 1.5rem;
    text-decoration: none;
}
.btn-store:hover {
    background: #f0f0f0;
}
.app-mockup {
    max-width: 150px;
    height: auto;
    border-radius: 1rem;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
}

/* Event page */
.organiser-avatar {
    width: 40px;
    height: 40px;
    object-fit: cover;
}

.organiser-name {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--bs-white);
}
.ticket-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #111;
    padding: 1rem 1.5rem;
    border-radius: 12px;
    max-width: 800px;
}

.ticket-subtitle {
    font-size: 0.9rem;
    opacity: 0.7;
    margin-top: 0.25rem;
}

.btn-buy {
    display: inline-block;
    background-color: #f5ee16; /* bright yellow */
    color: #111;
    font-weight: 600;
    text-decoration: none;
    padding: 0.7rem 1.5rem;
    border-radius: 50px;
    transition: background-color 0.2s ease;
}

.btn-buy:hover {
    background-color: #e0dd14;
}

/* Event schedule */
.schedule-row {
    border-radius: 0.5rem;
    padding: 0.75rem 1rem;
}

.schedule-col {
    flex: 1 1 0;
}

/* Date column gets more weight */
.schedule-date {
    flex: 2 1 0;
    font-size: 1rem;
}

/* Status centered, fixed width */
.schedule-status {
    flex: 0 0 120px;
}

/* Time column fixed width, right aligned */
.schedule-time {
    flex: 0 0 180px;
    font-size: 0.9rem;
}

.schedule-status .badge,
.schedule-time .badge {
    font-size: 0.85rem;
    padding: 0.4em 0.8em;
    border-radius: 999px;
}

/* Complimentary booking */
/* Enlarge the toggle, change colors */
.form-switch .form-check-input {
    width: 50px;
    height: 1.8rem;
    margin-left: 0;
    cursor: pointer;
    background-color: #ccc;
    transition: background-color 0.3s;
}

.form-switch .form-check-input:checked {
    background-color: var(--bs-primary);
}

.form-switch .form-check-input:focus {
    box-shadow: 0 0 0 0.25rem rgba(40, 167, 69, 0.25);
}

.form-switch .form-check-input::before {
    width: 1.6rem;
    height: 1.6rem;
    top: 0.1rem;
    left: 0.1rem;
    background-color: var(--bs-white);
    transition: transform 0.3s;
}

.form-switch .form-check-input:checked::before {
    transform: translateX(28px);
}

/* Adjust label spacing */
.form-switch .form-check-label {
    margin-left: 0.75rem;
    cursor: pointer;
}

/* Checkout Popup */
/* Section heading */
.payment-options > p.h6 {
    font-weight: 600;
    margin-bottom: 1rem;
    color: #333;
}

/* Container for all radios */
.payment-options .list-group-flush {
    padding: 0;
    margin: 0;
}

/* Each radio "row" */
.payment-options .radio-inline {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #eee;
    transition: background-color 0.2s;
}

/* Last item: remove bottom border */
.payment-options .radio-inline:last-of-type {
    border-bottom: none;
}

/* Hide the default radio bullet, style custom */
.payment-options input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 1.2rem;
    height: 1.2rem;
    border: 2px solid #bbb;
    border-radius: 50%;
    position: relative;
    outline: none;
    cursor: pointer;
    transition: border-color 0.2s;
    flex-shrink: 0;
}

/* Inner dot when checked */
.payment-options input[type="radio"]:checked {
    border-color: var(--bs-primary);
}

.payment-options input[type="radio"]:checked::after {
    content: "";
    position: absolute;
    top: 0.2rem;
    left: 0.2rem;
    width: 9px;
    height: 9px;
    background-color: var(--bs-primary);
    border-radius: 50%;
}

/* Icon color */
.payment-options .radio-inline i,
.payment-options .radio-inline svg {
    font-size: 1.25rem;
    color: var(--bs-primary);
    flex-shrink: 0;
}

/* Label text */
.payment-options .radio-inline label {
    margin: 0;
    font-size: 1rem;
    color: #333;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Small side-notes (like "(Cash on Arrival)") */
.payment-options .radio-inline small {
    color: #666;
    font-size: 0.875rem;
}

/* Terms text at the end */
.payment-options p.text-mute.h6 {
    font-size: 0.875rem;
    color: #666;
    margin-top: 1rem;
}

.slick-prev,
.slick-next {
    z-index: 99999;
    top: 40% !important;
}

.slick-prev {
    left: 0% !important;
}
.slick-prev:before {
    content: "‹" !important;
}
.slick-next {
    right: 0% !important;
}
.slick-next:before {
    content: "›" !important;
}

[data-bs-theme="dark"] .card-form__inner {
    background: var(--bs-white);
}

[data-bs-theme="dark"] .card-input__input {
    background: var(--bs-white);
    color: var(--bs-body-color);
    border-color: var(--bs-border-color);
}

/* Dark mode styles for sidebar */
[data-bs-theme="dark"] #db-wrapper-two .navbar-vertical-compact {
    background-color: var(--bs-dark);
}

[data-bs-theme="dark"] #db-wrapper-two .navbar-vertical-compact .nav-link {
    color: var(--bs-light);
}

[data-bs-theme="dark"]
    #db-wrapper-two
    .navbar-vertical-compact
    .nav-link:hover {
    color: var(--bs-white);
}

[data-bs-theme="dark"] #db-wrapper-two .navbar-vertical-compact .nav-icon i {
    color: var(--bs-text-dark);
}

[data-bs-theme="dark"]
    #db-wrapper-two
    .navbar-vertical-compact
    .nav-link:hover
    .nav-icon
    i {
    color: var(--bs-white);
}

/* Fix for text-inherit and table-light classes in dark mode */
[data-bs-theme="dark"] .text-inherit,
[data-bs-theme="dark"]
    a.text-inherit:not(.btn):not(.nav-link):not(.dropdown-item):not(
        .footer-link
    ) {
    color: var(--bs-body-color) !important;
}

[data-bs-theme="dark"] .table-light {
    --bs-table-bg: rgba(var(--bs-light-rgb), 0.1);
    --bs-table-color: var(--bs-body-color);
    --bs-table-border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .table-light th,
[data-bs-theme="dark"] .table-light td {
    background-color: var(--bs-table-bg);
    color: var(--bs-table-color);
    border-color: var(--bs-table-border-color);
}

/* Fix for button classes in dark mode */
[data-bs-theme="dark"] .btn-outline-secondary {
    color: var(--bs-text-dark);
    border-color: var(--bs-text-dark);
}

[data-bs-theme="dark"] .btn-outline-secondary:hover,
[data-bs-theme="dark"] .btn-outline-secondary:focus,
[data-bs-theme="dark"] .btn-outline-secondary:active {
    color: var(--bs-btn-hover-color);
    background-color: var(--bs-white);
    border-color: var(--bs-btn-hover-border-color);
}

/* Fix for modal close button */
.modal .modal-content .modal-header .close span {
    font-size: 1rem !important;
    font-weight: 600 !important;
}
.modal .modal-content .modal-header .close {
    padding: 0.2rem 0.5rem !important;
}

/* Fix for Vue Confirm dialog in dark mode */
[data-bs-theme="dark"] .vc-overlay {
    background-color: rgba(0, 0, 0, 0.7);
}

[data-bs-theme="dark"] .vc-container {
    background-color: var(--bs-dark);
    border-color: var(--bs-border-color);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
}

[data-bs-theme="dark"] .vc-title {
    color: var(--bs-white);
}

[data-bs-theme="dark"] .vc-text {
    color: var(--bs-light);
}

[data-bs-theme="dark"] .vc-btn {
    background-color: var(--bs-secondary);
    color: var(--bs-text-dark);
    border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .vc-btn:hover {
    background-color: var(--bs-primary);
}

[data-bs-theme="dark"] .vc-btn.left {
    background-color: var(--bs-primary);
    color: var(--bs-text-dark);
}

[data-bs-theme="dark"] .vc-btn.left:hover {
    background-color: var(--bs-primary-darker, #0d6efd);
}

/* Fix for multiselect in dark mode */
[data-bs-theme="dark"] .multiselect__tags {
    background-color: var(--bs-dark);
    border-color: var(--bs-border-color);
    color: var(--bs-light);
}

[data-bs-theme="dark"] .multiselect__input,
[data-bs-theme="dark"] .multiselect__single {
    background-color: var(--bs-dark);
    color: var(--bs-light);
}

[data-bs-theme="dark"] .multiselect__content-wrapper {
    background-color: var(--bs-dark);
    border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .multiselect__option {
    color: var(--bs-light);
}

[data-bs-theme="dark"] .multiselect__option--highlight {
    background-color: var(--bs-primary);
    color: var(--bs-white);
}

[data-bs-theme="dark"] .multiselect__option--selected {
    background-color: rgba(var(--bs-primary-rgb), 0.2);
    color: var(--bs-white);
}

[data-bs-theme="dark"] .multiselect__placeholder {
    color: var(--bs-gray-500);
}

/* Fix for color classes in dark mode */
[data-bs-theme="dark"] .text-primary {
    color: var(--bs-primary) !important;
}

[data-bs-theme="dark"] .text-success {
    color: var(--bs-success) !important;
}

[data-bs-theme="dark"] .form-horizontal .text-danger {
    color: var(--bs-danger) !important;
}
[data-bs-theme="dark"] .lgx-contactform .text-danger {
    color: var(--bs-danger) !important;
}
[data-bs-theme="dark"] .modal-body form .text-danger {
    color: var(--bs-danger) !important;
}

[data-bs-theme="dark"] .text-danger {
    color: var(--bs-danger) !important;
}

[data-bs-theme="dark"] .text-warning {
    color: var(--bs-warning) !important;
}

[data-bs-theme="dark"] .text-info {
    color: var(--bs-info) !important;
}

[data-bs-theme="dark"] .text-secondary {
    color: var(--bs-secondary) !important;
}

/* Fix for table text color in dark mode */
[data-bs-theme="dark"] .table > :not(caption) > * > * {
    color: var(--bs-body-color);
}

/* Dark mode border overrides */
[data-bs-theme="dark"] .border-dark,
[data-bs-theme="dark"] .border-black {
    border-color: #ffffff !important;
}

[data-bs-theme="dark"] .border-dark-subtle {
    border-color: rgba(255, 255, 255, 0.5) !important;
}

/* SweetAlert toast styling */
.swal2-container.swal2-top-end .swal2-popup,
.swal2-container.swal2-top-right .swal2-popup {
    width: auto !important;
    max-width: 350px !important;
}

.swal2-popup.swal2-toast {
    width: auto !important;
    padding: 0.5rem 1rem !important;
}

.swal2-toast div:where(.swal2-html-container),
.swal2-container .swal2-popup .swal2-html-container,
div.swal2-html-container {
    margin: 0rem 0rem 0 !important;
    padding: 0px 0px !important;
    line-height: unset !important;
    width: fit-content !important;
    max-width: 100% !important;
}

/* Custom dropdown styling */

.custom-dropdown .dropdownmenu {
    display: none;
    list-style: none;
    background-color: var(--bs-white);
    border: 1px solid var(--bs-border-color);
    border-radius: 10px;
    position: absolute;
    width: max-content;
    left: 0;
    top: 100%;
    z-index: 99999;
    padding: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    left: auto;
}

.custom-dropdown:hover .dropdownmenu,
.custom-dropdown:focus-within .dropdownmenu {
    display: block;
}

.custom-dropdown .dropdownmenu li {
    margin: 3px 0;
    position: relative;
    left: 0;
}

.custom-dropdown .dropdownmenu a {
    display: block;
    width: 100%;
    padding: 3px 10px;
    text-decoration: none;
    border-radius: 6px;
    transition: all 0.2s ease;
    font-size: 0.9rem;
    color: inherit;
}

.custom-dropdown .dropdownmenu a i {
    margin-right: 8px;
    width: 16px;
    text-align: center;
}

/* Light mode specific styles */
.custom-dropdown .dropdownmenu a.btn-dark {
    background-color: #212529;
    color: #fff;
}

.custom-dropdown .dropdownmenu a.btn-primary {
    background-color: #0d6efd;
    color: #fff;
}

.custom-dropdown .dropdownmenu a.disabled {
    opacity: 0.65;
    pointer-events: none;
}

/* Dark mode border fixes */
[data-bs-theme="dark"] .border-bottom {
    border-bottom-color: var(--bs-border-color) !important;
}

/* Dark mode styles for custom dropdown */
[data-bs-theme="dark"] .custom-dropdown .dropdownmenu {
    background-color: #2b3035;
    border-color: #495057;
}

[data-bs-theme="dark"] .custom-dropdown .dropdownmenu a.btn-dark {
    background-color: #495057;
    color: #fff;
}

[data-bs-theme="dark"] .custom-dropdown .dropdownmenu a.btn-primary {
    background-color: #0d6efd;
    color: #fff;
}

[data-bs-theme="dark"] .custom-dropdown .dropdownmenu a.disabled {
    background-color: #495057;
    color: #adb5bd;
}

/* Dropdown section dividers & labels */
.custom-dropdown .dropdownmenu .dropdown-section-divider {
    height: 1px;
    background-color: var(--bs-border-color);
    margin: 6px 0;
    padding: 0;
    left: 0;
}

.custom-dropdown .dropdownmenu .dropdown-section-label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #999;
    padding: 4px 10px 2px;
    left: 0;
    cursor: default;
    user-select: none;
}

[data-bs-theme="dark"] .custom-dropdown .dropdownmenu .dropdown-section-label {
    color: #8a9199;
}

[data-bs-theme="dark"] .custom-dropdown .dropdownmenu .dropdown-section-divider {
    background-color: #495057;
}

/* Uniform dropdown action style (replaces btn-dark / btn-primary alternation) */
.custom-dropdown .dropdownmenu a.dropdown-action {
    display: block;
    width: 100%;
    padding: 6px 10px;
    text-decoration: none;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--bs-body-color);
    background: transparent;
    border: none;
    transition: background 0.15s ease, color 0.15s ease;
    cursor: pointer;
    white-space: nowrap;
}

.custom-dropdown .dropdownmenu a.dropdown-action:hover {
    background-color: var(--bs-primary);
    color: #fff;
}

.custom-dropdown .dropdownmenu a.dropdown-action.disabled {
    opacity: 0.45;
    pointer-events: none;
}

.custom-dropdown .dropdownmenu a.dropdown-action i {
    margin-right: 8px;
    width: 16px;
    text-align: center;
    font-size: 0.8rem;
}

[data-bs-theme="dark"] .custom-dropdown .dropdownmenu a.dropdown-action {
    color: #dee2e6;
}

[data-bs-theme="dark"] .custom-dropdown .dropdownmenu a.dropdown-action:hover {
    background-color: var(--bs-primary);
    color: #fff;
}

/* Fix for SweetAlert confirmation dialog in dark mode */
[data-bs-theme="dark"] .swal2-popup.swal2-modal .custom-swal-title,
[data-bs-theme="dark"] .swal2-popup.swal2-modal .swal2-title {
    color: var(--bs-white) !important;
}

.swal2-popup.swal2-modal.custom-swal-popup .swal2-html-container {
    text-align: center !important;
    margin: 1em auto !important;
    width: 100% !important;
}

[data-bs-theme="dark"]
    .swal2-popup.swal2-modal.custom-swal-popup-success
    .swal2-html-container {
    color: var(--bs-success) !important;
}

.nav-item.dropdown .dropdown-menu {
    left: auto !important;
    right: 100% !important;
    top: 0 !important;
    margin-right: 0.125rem !important;
    transform-origin: right top !important;
}
.dropdown-item.dropdown-toggle::after {
    transform: rotate(180deg);
    margin-left: 0;
    margin-right: 0.255em;
    vertical-align: 0.255em;
}
.dropdown-menu {
    min-width: 12rem;
}

/* Vue Good Table Dark Mode Styles */

/* Table base */
[data-bs-theme="dark"] .vgt-table {
    background-color: var(--bs-dark) !important;
    border-color: var(--bs-gray-600) !important;
}

[data-bs-theme="dark"] .vgt-table th {
    border-color: var(--bs-gray-600) !important;
    font-weight: 600 !important;
}

[data-bs-theme="dark"] .vgt-table td {
    background-color: #1f2937 !important;
    border-color: none !important;
}

[data-bs-theme="dark"] .vgt-table th.sortable:hover {
    background-color: var(--bs-gray-600) !important;
}

/* Alternating row colors */
[data-bs-theme="dark"] .vgt-table tr:nth-child(even) td {
    background-color: #1b212b !important;
}

/* Footer */
[data-bs-theme="dark"] .vgt-wrap__footer {
    border-color: var(--bs-gray-600) !important;
    color: var(--bs-body-color) !important;
}

/* Search */
[data-bs-theme="dark"] .vgt-global-search {
    border-color: var(--bs-gray-600) !important;
    padding: 12px !important;
}

[data-bs-theme="dark"]
    .vgt-global-search__input
    .input__icon
    .magnifying-glass {
    border-color: var(--bs-light) !important;
}

[data-bs-theme="dark"]
    .vgt-global-search__input
    .input__icon
    .magnifying-glass:before {
    background-color: var(--bs-light) !important;
}

/* Form elements */
[data-bs-theme="dark"] .vgt-input,
[data-bs-theme="dark"] .vgt-select {
    background-color: var(--bs-gray-700) !important;
    border-color: var(--bs-gray-600) !important;
    color: var(--bs-body-color) !important;
}

/* Footer elements */
[data-bs-theme="dark"] .vgt-wrap__footer .footer__row-count__label,
[data-bs-theme="dark"] .vgt-wrap__footer .footer__row-count__select,
[data-bs-theme="dark"] .vgt-wrap__footer .footer__navigation__page-btn,
[data-bs-theme="dark"] .vgt-wrap__footer .footer__navigation__info,
[data-bs-theme="dark"] .vgt-wrap__footer .footer__navigation__page-info {
    color: #2b3035 !important;
}

[data-bs-theme="dark"] .vgt-wrap__footer .footer__navigation__page-btn.disabled,
[data-bs-theme="dark"]
    .vgt-wrap__footer
    .footer__navigation__page-btn.disabled:hover {
    color: var(--bs-gray-600) !important;
}

/* Sort indicators */
[data-bs-theme="dark"] .vgt-table th.sortable:after {
    border-top-color: var(--bs-light) !important;
}

[data-bs-theme="dark"] .vgt-table th.sortable:before {
    border-bottom-color: var(--bs-light) !important;
}
[data-bs-theme="dark"] .vgt-table thead th {
    color: #343a40 !important;
}

/* Special columns */
[data-bs-theme="dark"] .vgt-table th.line-numbers,
[data-bs-theme="dark"] .vgt-table th.vgt-checkbox-col {
    background: #343a40 !important;
    color: var(--bs-body-color) !important;
}

[data-bs-theme="dark"] .vgt-table td.vgt-checkbox-col {
    background-color: var(--bs-dark) !important;
}

/* Table inputs */
[data-bs-theme="dark"] .vgt-table .vgt-input,
[data-bs-theme="dark"] .vgt-table .vgt-select {
    background-color: var(--bs-gray-700) !important;
    border-color: var(--bs-gray-600) !important;
    color: var(--bs-body-color) !important;
}

[data-bs-theme="dark"] .vgt-table .vgt-input::placeholder {
    color: var(--bs-gray-500) !important;
}

/* Hover states */
[data-bs-theme="dark"] .vgt-wrap__footer .footer__navigation__page-btn:hover {
    color: var(--bs-primary) !important;
}

[data-bs-theme="dark"] .vgt-table tbody tr:hover td {
    background-color: var(--bs-gray-600) !important;
}

[data-bs-theme="dark"] .vgt-table .is--active {
    background-color: var(--bs-gray-600) !important;
}

/* Loading state */
[data-bs-theme="dark"] .vgt-loading {
    background: rgba(33, 37, 41, 0.7) !important;
}

[data-bs-theme="dark"] .vgt-loading__content {
    background-color: var(--bs-gray-800) !important;
    color: var(--bs-body-color) !important;
}

/* Pagination */
[data-bs-theme="dark"] .vgt-wrap__footer .footer__navigation__page-btn,
[data-bs-theme="dark"] .vgt-wrap__footer .footer__navigation__info {
    color: var(--bs-body-color) !important;
}

[data-bs-theme="dark"]
    .vgt-wrap__footer
    .footer__navigation__page-btn:hover:not(.disabled),
[data-bs-theme="dark"]
    .vgt-wrap__footer
    .footer__navigation__page-btn:focus:not(.disabled) {
    color: var(--bs-primary) !important;
}

/* Colored text */
[data-bs-theme="dark"] .text-primary {
    color: var(--bs-primary) !important;
}

[data-bs-theme="dark"] .text-success {
    color: var(--bs-success) !important;
}

[data-bs-theme="dark"] .text-danger {
    color: var(--bs-danger) !important;
}

[data-bs-theme="dark"] .text-warning {
    color: var(--bs-warning) !important;
}

[data-bs-theme="dark"] .text-info {
    color: var(--bs-info) !important;
}

[data-bs-theme="dark"] .text-muted {
    color: var(--bs-gray-600) !important;
}

/* Event Tickets Statistics Table - Additional Styling */
.vgt-table {
    border-collapse: collapse;
    width: 100%;
    border-radius: 0.375rem;
    overflow: hidden;
}

/* Light Mode Table */
[data-bs-theme="light"] .vgt-table th {
    background-color: #f8f9fa;
    color: #212529;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.8rem;
    padding: 1rem 0.75rem;
    border-bottom: 2px solid #dee2e6;
}

[data-bs-theme="light"] .vgt-table td {
    padding: 0.75rem;
    border-bottom: 1px solid #dee2e6;
    vertical-align: middle;
}

[data-bs-theme="light"] .vgt-table tr:hover td {
    background-color: rgba(0, 0, 0, 0.03);
}

/* Dark Mode Table - Additional Styles */
[data-bs-theme="dark"] .vgt-table th {
    color: #f0f5ff !important;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.8rem;
    padding: 1rem 0.75rem;
    border-bottom: 2px solid #495057;
}

[data-bs-theme="dark"] .vgt-table td {
    padding: 0.75rem;
    border-bottom: 1px solid #495057;
    vertical-align: middle;
}

/* Override for table text in dark mode */
[data-bs-theme="dark"] .vgt-table .fw-bold.text-primary {
    color: var(--bs-primary) !important;
}

[data-bs-theme="dark"] .vgt-table .small.text-muted {
    color: var(--bs-gray-500) !important;
}

/* Fix for table header and footer text in dark mode */

[data-bs-theme="dark"] .card span {
    color: #a7a7a7 !important;
}

[data-bs-theme="dark"] .vgt-wrap__footer .footer__row-count__label,
[data-bs-theme="dark"] .vgt-wrap__footer .footer__navigation__info,
[data-bs-theme="dark"] .vgt-wrap__footer .footer__navigation__page-info,
[data-bs-theme="dark"]
    .vgt-wrap__footer
    .footer__navigation__page-btn:not(.disabled) {
    color: #495057 !important;
}

/* Fix for search input in dark mode */
[data-bs-theme="dark"]
    .vgt-global-search__input
    .input__icon
    .magnifying-glass {
    border-color: var(--bs-gray-600) !important;
}

[data-bs-theme="dark"]
    .vgt-global-search__input
    .input__icon
    .magnifying-glass:before {
    background-color: var(--bs-gray-600) !important;
}

/* Event Total Styling */
.fw-bold.text-primary {
    font-size: 1rem;
}

/* Search Input Styling */
.vgt-global-search {
    border-radius: 0.375rem;
    margin-bottom: 1rem;
}

/* Dark Mode Footer Styling */
[data-bs-theme="dark"] div.footer {
    background-color: #121212;
    color: #f8f9fa;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

[data-bs-theme="dark"] .footer-link {
    color: rgba(255, 255, 255, 0.75);
    transition: color 0.2s ease;
}

[data-bs-theme="dark"] .footer-link:hover {
    color: #0d6efd;
    text-decoration: none;
}

[data-bs-theme="dark"] .footer h6 {
    color: #f8f9fa;
}

[data-bs-theme="dark"] .footer .text-gray-400 {
    color: #000 !important;
}

[data-bs-theme="dark"] .footer .btn-outline-light {
    border-color: rgba(255, 255, 255, 0.2);
}

[data-bs-theme="dark"] .footer .btn-outline-light:hover {
    background-color: rgba(255, 255, 255, 0.1);
    color: #fff;
}
[data-bs-theme="dark"] .app-cta-section h2,
.app-cta-section p {
    color: #fff;
}

.vgt-global-search__input input {
    border-radius: 0.25rem;
    padding: 0.5rem 1rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

[data-bs-theme="light"] .vgt-global-search__input input:focus {
    border-color: #86b7fe;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

[data-bs-theme="dark"] .vgt-global-search__input input:focus {
    border-color: #86b7fe;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

/* Pagination Styling */
.vgt-wrap__footer {
    padding: 1rem;
    border-radius: 0 0 0.375rem 0.375rem;
}

.footer__navigation__page-btn {
    border-radius: 0.25rem;
    padding: 0.375rem 0.75rem;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .vgt-table th,
    .vgt-table td {
        padding: 0.5rem;
    }

    .vgt-global-search {
        padding: 0.75rem !important;
    }
}

[data-bs-theme="dark"]
    a:not(.btn):not(.nav-link):not(.dropdown-item):not(.footer-link) {
    color: var(--bs-body-color) !important;
}


/* Style for active schedule */
.lgx-single-schedule.schedule-active {
    transform: scale(1.02);
    z-index: 1;
}

.lgx-single-schedule.schedule-active .card {
    border-color: var(--bs-primary) !important;
    background-color: var(--bs-primary) !important;
    border-width: 2px !important;
}

.weekly-timing {
    position:absolute;
    bottom:-70%;
}
.monthly-timing {
    position:absolute;
    bottom: -50%;
    left: -2.3%;
}
@media (max-width: 768px) {
    .weekly-timing {
        bottom: -3%;
        left: 5%;
    }
    .monthly-timing {
        bottom: -37%;
        left: -7%;
    }
}
#seatmap-root {
    width: 100%;
    height: 600px; /* force non-zero height */
    min-height: 600px;
}
.list-group li {
    border-radius: 0px !important;
}
.list-group {
    --bs-list-group-color: var(--bs-body-color);
    --bs-list-group-bg: var(--bs-body-bg);
    --bs-list-group-border-color: var(--bs-border-color);
    --bs-list-group-border-width: var(--bs-border-width);
    --bs-list-group-border-radius: var(--bs-border-radius);
    --bs-list-group-item-padding-x: 1rem;
    --bs-list-group-item-padding-y: .5rem;
    --bs-list-group-action-color: var(--bs-secondary-color);
    --bs-list-group-action-hover-color: var(--bs-emphasis-color);
    --bs-list-group-action-hover-bg: var(--bs-tertiary-bg);
    --bs-list-group-action-active-color: var(--bs-body-color);
    --bs-list-group-action-active-bg: var(--bs-secondary-bg);
    --bs-list-group-disabled-color: var(--bs-secondary-color);
    --bs-list-group-disabled-bg: var(--bs-body-bg);
    --bs-list-group-active-color: #fff;
    --bs-list-group-active-bg: #f54b09;
    --bs-list-group-active-border-color: #f54b09;
    display: flex;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    border-radius: var(--bs-list-group-border-radius);
}
.list-group-cart {
    background: linear-gradient(62deg, #fbfbfb, #fa9c77)!important;
    border-radius: 0px;
}
.selected-ticket-bg {
    background: linear-gradient(62deg, #fbfbfb, #fa9c77)!important;
    color: #22223b !important;
}
.text-primary {
    --bs-text-opacity: 1;
    color: rgba(var(--bs-primary-rgb), var(--bs-text-opacity)) !important;
}
.alert, .event-category-badge, .buy-tickets-now-accordion, .event-hero-image {
    border-radius: 0 !important;
}
.event-datetime, .organizer-card, .css-accordion {
    border-radius: 0!important;
}
.css-accordion-item:first-child .css-accordion-label {
    border-radius: 0 / 0px;
}
.venue-card:before {
    border-radius: 0;
}
.venue-card {
    border-radius: 0;
}
.navbar, .header-white, .nav-header.menu-fixed {
    background-color:
#fff!important;
}
@media (min-width: 991px) {
    .nav-header.header-white .navbar .nav-link, .nav-header.header-white .navbar .nav-link:hover {
        color: #343a40 !important;
    }
}
.custom-dropdown .dropdownmenu a.btn-primary {
    background-color: #f54b09!important;
    color: #fff;
}
.catImg {
    background: #fff;
    text-align: center;
    opacity: 0.7;
}
.nav-header.menu-fixed .navbar-toggler .icon-bar {
    background-color: #343a40!important;
}
.nav-header.menu-fixed .navbar .nav-link {
    color: #343a40 !important;
}
.card-cat {
    background-color: #fff !important;
}

/* Lock background scroll ONLY */
html.modal-open,
body.modal-open {
  overflow: hidden !important;
}

/* Re-enable touch scrolling inside modal */
.ph-modal-body {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* Ensure modal remains interactive */
.ph-modal-root,
.ph-modal-shell,
.ph-modal-body {
  pointer-events: auto!important;
}

@media only screen and (orientation: portrait) and (max-width: 768px) {

    /* Sticky button at the bottom */
    .sticky-button {
        position: fixed; /* Fixes the button position */
        bottom: 0; /* Aligns it to the bottom of the viewport */
        left: 0;
        right: 0; /* Stretch to full width */
        background-color: #fff; /* Optional: Add background to make it clear */
        padding: 10px 0; /* Padding for top and bottom */
        box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.2); /* Optional: Shadow effect */
        z-index: 1000; /* Ensures it stays on top of other content */
        text-align: center; /* Centers the button */
    }

    /* Button styling */
    .sticky-button .btn {
        font-size: 18px; /* Adjust the font size */
        background-color: #f54b09; ; /* Customize button color */
        color: #fff; /* Text color */
        border: none; /* Remove default border */
        padding: 12px 20px;
        border-radius: 5px;
        text-decoration: none; /* Remove underline */
    }

    .sticky-button .btn:hover {
        background-color: #c82333; /* Darker color on hover */
    }
    
}

/* ========================================================================
   JEB DESIGN SYSTEM — JustEasyBook UI/UX Modernization
   All new classes use jeb- prefix with BEM methodology
   ======================================================================== */

/* ─── 1. DESIGN TOKENS (CSS Variables) ─── */
:root {
    /* Brand Colors */
    --color-primary: #f54b09;
    --color-primary-hover: #e04000;
    --color-primary-light: #ff6b35;
    --color-primary-subtle: #fff5f2;
    --color-secondary: #212425;
    --color-secondary-light: #3a3f42;

    /* Neutrals (10-step gray scale) */
    --color-white: #ffffff;
    --color-gray-50: #fafafa;
    --color-gray-100: #f5f5f5;
    --color-gray-200: #e5e5e5;
    --color-gray-300: #d4d4d4;
    --color-gray-400: #a3a3a3;
    --color-gray-500: #737373;
    --color-gray-600: #525252;
    --color-gray-700: #404040;
    --color-gray-800: #262626;
    --color-gray-900: #171717;

    /* Semantic Colors */
    --color-success: #10b981;
    --color-success-light: #d1fae5;
    --color-warning: #f59e0b;
    --color-warning-light: #fef3c7;
    --color-error: #ef4444;
    --color-error-light: #fee2e2;
    --color-info: #3b82f6;
    --color-info-light: #dbeafe;

    /* Typography */
    --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-size-xs: 0.75rem;
    --font-size-sm: 0.8125rem;
    --font-size-base: 0.875rem;
    --font-size-md: 1rem;
    --font-size-lg: 1.125rem;
    --font-size-xl: 1.25rem;
    --font-size-2xl: 1.5rem;
    --font-size-3xl: 1.875rem;
    --font-size-4xl: 2.25rem;

    /* Spacing (4px base) */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;

    /* Border Radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-2xl: 24px;
    --radius-full: 9999px;

    /* Shadows */
    --shadow-xs: 0 1px 2px rgba(0,0,0,0.05);
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.1), 0 1px 2px rgba(0,0,0,0.06);
    --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
    --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
    --shadow-xl: 0 20px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04);
    --shadow-primary: 0 4px 14px rgba(245,75,9,0.25);

    /* Transitions */
    --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-normal: 250ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 350ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* ─── 2. GLOBAL BASE STYLES & TYPOGRAPHY ─── */
* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-family: var(--font-family);
    color: var(--color-gray-800);
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    line-height: 1.2;
    color: var(--color-gray-900);
}

a {
    transition: color var(--transition-fast);
}

img {
    max-width: 100%;
    height: auto;
}

/* ─── 3. BUTTON SYSTEM ─── */
/* Bootstrap overrides */
.btn {
    font-weight: 600;
    border-radius: var(--radius-md);
    transition: all var(--transition-normal);
}

.btn-primary,
.lgx-btn {
    background: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: var(--color-white) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.lgx-btn:hover {
    background: var(--color-primary-hover) !important;
    border-color: var(--color-primary-hover) !important;
    box-shadow: var(--shadow-primary);
}

/* jeb- Button System */
.jeb-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-weight: 600;
    font-size: var(--font-size-base);
    padding: 0.625rem 1.25rem;
    border-radius: var(--radius-md);
    border: 2px solid transparent;
    cursor: pointer;
    text-decoration: none;
    transition: all var(--transition-normal);
    line-height: 1.4;
}

.jeb-btn--primary {
    background: var(--color-primary);
    color: var(--color-white);
    box-shadow: var(--shadow-primary);
}

.jeb-btn--primary:hover,
.jeb-btn--primary:focus {
    background: var(--color-primary-hover);
    color: var(--color-white);
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(245,75,9,0.35);
}

.jeb-btn--secondary {
    background: var(--color-secondary);
    color: var(--color-white);
}

.jeb-btn--secondary:hover {
    background: var(--color-secondary-light);
    color: var(--color-white);
    transform: translateY(-1px);
}

.jeb-btn--outline {
    background: transparent;
    border-color: var(--color-gray-300);
    color: var(--color-gray-700);
}

.jeb-btn--outline:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
    background: var(--color-primary-subtle);
}

.jeb-btn--lg {
    padding: 0.875rem 1.75rem;
    font-size: var(--font-size-md);
    border-radius: var(--radius-lg);
}

.jeb-btn--sm {
    padding: 0.375rem 0.875rem;
    font-size: var(--font-size-sm);
}

/* ─── 4. FORM ENHANCEMENTS ─── */
.form-control,
.form-select {
    border-radius: var(--radius-md);
    border: 1px solid var(--color-gray-300);
    padding: 0.625rem 0.875rem;
    font-size: var(--font-size-base);
    transition: all var(--transition-fast);
    color: var(--color-gray-800);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(245,75,9,0.1);
    outline: none;
}

.form-label {
    font-weight: 600;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    margin-bottom: 0.375rem;
}

textarea.form-control {
    resize: vertical;
    min-height: 100px;
}

/* ─── 5. BADGE SYSTEM ─── */
.jeb-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.4;
}

.jeb-badge--primary {
    background: var(--color-primary-subtle);
    color: var(--color-primary);
}

.jeb-badge--danger {
    background: var(--color-error-light);
    color: var(--color-error);
}

.jeb-badge--success {
    background: var(--color-success-light);
    color: var(--color-success);
}

.jeb-badge--info {
    background: var(--color-info-light);
    color: var(--color-info);
}

.jeb-badge--warning {
    background: var(--color-warning-light);
    color: var(--color-warning);
}

/* ─── 6. NAVBAR (jeb-navbar) ─── */
.jeb-navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1030;
    background: rgba(255,255,255,0.95);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(0,0,0,0.06);
    transition: all var(--transition-normal);
    padding: 0.5rem 0;
}

.jeb-navbar--scrolled {
    background: rgba(255,255,255,0.98);
    box-shadow: var(--shadow-lg);
    padding: 0.25rem 0;
}

.jeb-navbar--scrolled .jeb-navbar__brand img {
    max-height: 44px;
    height: 44px;
}

@media (max-width: 576px) {
    .jeb-navbar--scrolled .jeb-navbar__brand img {
        max-height: 40px;
        height: 40px;
    }
}

body {
    padding-top: 80px;
}

/* Dashboard pages: the fixed navbar is ~70px. The sidebar uses mt-9 (64px)
   and the content section uses mt-14 (104px) to clear it. We only need
   a small body padding so the layout doesn't tuck under the navbar. */
body.dashboard-body-bg {
    padding-top: 10px;
}

/* On dashboard pages, bump the sidebar z-index so content doesn't bleed over it */
body.dashboard-body-bg .navbar-vertical-compact {
    z-index: 2;
}

/* On dashboard pages, push modals below the fixed navbar */
body.dashboard-body-bg .modal {
    padding-top: 80px !important;
}

.jeb-navbar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 1rem;
}

.jeb-navbar__brand {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
    color: var(--color-gray-900);
    flex-shrink: 0;
}

.jeb-navbar__logo {
    max-height: 52px;
    height: 52px;
    width: auto;
    max-width: 220px;
    object-fit: contain;
    display: block;
    transition: max-height var(--transition-normal), height var(--transition-normal);
}

/* Mobile: keep the logo prominent and don't let flex squash it */
@media (max-width: 992px) {
    .jeb-navbar__brand {
        flex-shrink: 0;
        min-width: 0;
    }
    .jeb-navbar__logo {
        max-height: 48px;
        height: 48px;
        max-width: 180px;
    }
}

@media (max-width: 576px) {
    .jeb-navbar__logo {
        max-height: 44px;
        height: 44px;
        max-width: 160px;
    }
}

@media (max-width: 360px) {
    .jeb-navbar__logo {
        max-height: 40px;
        height: 40px;
        max-width: 140px;
    }
}

.jeb-navbar__brand-text {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.jeb-navbar__brand-text strong {
    font-size: var(--font-size-md);
    font-weight: 700;
    color: var(--color-gray-900);
}

.jeb-navbar__brand-text small {
    font-size: var(--font-size-xs);
    color: var(--color-gray-500);
}

/* Hamburger toggler */
.jeb-navbar__toggler {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    z-index: 1031;
}

.jeb-navbar__toggler-icon {
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 24px;
}

.jeb-navbar__toggler-icon span {
    display: block;
    width: 100%;
    height: 2px;
    background: var(--color-gray-800);
    border-radius: 2px;
    transition: all var(--transition-normal);
    transform-origin: center;
}

/* Hamburger → X animation */
.jeb-navbar__toggler[aria-expanded="true"] .jeb-navbar__toggler-icon span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.jeb-navbar__toggler[aria-expanded="true"] .jeb-navbar__toggler-icon span:nth-child(2) {
    opacity: 0;
}

.jeb-navbar__toggler[aria-expanded="true"] .jeb-navbar__toggler-icon span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

/* Nav links */
.jeb-navbar__collapse {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.jeb-navbar__nav {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0.125rem;
}

.jeb-navbar__item {
    position: relative;
}

.jeb-navbar__link {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-gray-600);
    text-decoration: none;
    border-radius: var(--radius-md);
    transition: all var(--transition-fast);
    white-space: nowrap;
}

.jeb-navbar__link:hover,
.jeb-navbar__link:focus {
    color: var(--color-primary);
    background: var(--color-primary-subtle);
}

.jeb-navbar__link i {
    font-size: var(--font-size-base);
    width: 18px;
    text-align: center;
}

/* Chevron */
.jeb-navbar__chevron {
    font-size: 0.625rem;
    margin-left: 0.25rem;
    transition: transform var(--transition-fast);
}

.jeb-navbar__item.show .jeb-navbar__chevron,
.jeb-navbar__dropdown.show .jeb-navbar__chevron {
    transform: rotate(180deg);
}

/* Dropdown menus */
.jeb-navbar__dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 220px;
    background: rgba(255,255,255,0.98);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    padding: 0.5rem;
    margin-top: 0.25rem;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: all var(--transition-normal);
    max-height: 400px;
    overflow-y: auto;
    z-index: 1050;
    list-style: none;
}

.jeb-navbar__dropdown.show .jeb-navbar__dropdown-menu,
.jeb-navbar__item.show .jeb-navbar__dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.jeb-navbar__dropdown-menu li {
    list-style: none;
}

.jeb-navbar__dropdown-menu .dropdown-item,
.jeb-navbar__dropdown-menu a {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.75rem;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border-radius: var(--radius-md);
    transition: all var(--transition-fast);
    text-decoration: none;
}

.jeb-navbar__dropdown-menu .dropdown-item:hover,
.jeb-navbar__dropdown-menu a:hover {
    background: var(--color-primary-subtle);
    color: var(--color-primary);
}

/* Notification bell */
.jeb-navbar__notification-bell {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full);
    background: var(--color-gray-100);
    color: var(--color-gray-600);
    font-size: var(--font-size-md);
    transition: all var(--transition-fast);
    cursor: pointer;
    border: none;
}

.jeb-navbar__notification-bell:hover {
    background: var(--color-primary-subtle);
    color: var(--color-primary);
}

.jeb-navbar__notification-dot {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 8px;
    height: 8px;
    background: var(--color-error);
    border-radius: 50%;
    border: 2px solid var(--color-white);
    animation: jeb-pulse 2s infinite;
}

@keyframes jeb-pulse {
    0% { box-shadow: 0 0 0 0 rgba(239,68,68,0.4); }
    70% { box-shadow: 0 0 0 6px rgba(239,68,68,0); }
    100% { box-shadow: 0 0 0 0 rgba(239,68,68,0); }
}

/* User toggle */
.jeb-navbar__user-toggle {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.75rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-gray-700);
    text-decoration: none;
    border-radius: var(--radius-full);
    transition: all var(--transition-fast);
    cursor: pointer;
    border: 1px solid var(--color-gray-200);
    background: var(--color-white);
}

.jeb-navbar__user-toggle:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
    background: var(--color-primary-subtle);
}

.jeb-navbar__user-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--color-primary-subtle);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-sm);
    color: var(--color-primary);
}

/* CTA button */
.jeb-navbar__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1.25rem;
    background: linear-gradient(135deg, var(--color-primary), var(--color-primary-hover));
    color: var(--color-white) !important;
    font-size: var(--font-size-sm);
    font-weight: 600;
    border-radius: var(--radius-full);
    text-decoration: none;
    transition: all var(--transition-normal);
    box-shadow: var(--shadow-primary);
    white-space: nowrap;
    border: none;
}

.jeb-navbar__cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(245,75,9,0.35);
    color: var(--color-white) !important;
}

/* Hidden on desktop — only visible in mobile drawer */
.jeb-navbar__scrim { display: none; }
.jeb-navbar__close { display: none; }

/* Mobile responsive */
@media (max-width: 991.98px) {
    .jeb-navbar__toggler {
        display: flex;
    }

    /* ── Slide-down drawer ── */
    .jeb-navbar__collapse {
        position: fixed;
        top: 0;
        right: 0;
        width: 300px;
        height: 100dvh;
        background: var(--color-white);
        flex-direction: column;
        padding: 0;
        overflow: hidden;
        transform: translateX(100%);
        opacity: 0;
        visibility: hidden;
        transition: transform 0.3s cubic-bezier(.4,0,.2,1), opacity 0.2s ease, visibility 0s 0.3s;
        box-shadow: -4px 0 24px rgba(0,0,0,0.12);
        z-index: 1040;
    }

    .jeb-navbar__collapse.show {
        transform: translateX(0);
        opacity: 1;
        visibility: visible;
        transition: transform 0.3s cubic-bezier(.4,0,.2,1), opacity 0.2s ease, visibility 0s;
    }

    /* Scrim / backdrop — real element behind drawer */
    .jeb-navbar__scrim {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.4);
        z-index: 1039;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .jeb-navbar__scrim.show {
        display: block;
        opacity: 1;
    }

    /* Close button inside drawer */
    .jeb-navbar__close {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        border: none;
        background: var(--color-gray-100);
        color: var(--color-gray-600);
        border-radius: var(--radius-full);
        font-size: 1.1rem;
        cursor: pointer;
        margin: 0.75rem 0.75rem 0 auto;
        flex-shrink: 0;
        transition: all var(--transition-fast);
    }

    .jeb-navbar__close:hover {
        background: var(--color-gray-200);
        color: var(--color-gray-900);
    }

    /* Scrollable area */
    .jeb-navbar__nav {
        flex-direction: column;
        width: 100%;
        gap: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding: 1rem 0.75rem;
        flex: 1;
    }

    /* Nav items */
    .jeb-navbar__item {
        width: 100%;
    }

    .jeb-navbar__link {
        padding: 0.625rem 0.875rem;
        border-radius: var(--radius-md);
        font-size: 0.9rem;
        color: var(--color-gray-700);
    }

    .jeb-navbar__link:hover,
    .jeb-navbar__link:active {
        background: var(--color-gray-100);
        color: var(--color-primary);
    }

    .jeb-navbar__link i {
        width: 22px;
        text-align: center;
        font-size: 0.95rem;
        color: var(--color-gray-500);
    }

    .jeb-navbar__link:hover i,
    .jeb-navbar__link:active i {
        color: var(--color-primary);
    }

    /* Mobile section dividers */
    .jeb-navbar__mobile-divider {
        display: block;
        height: 1px;
        background: var(--color-gray-200);
        margin: 0.5rem 0.875rem;
    }

    .jeb-navbar__mobile-label {
        display: block;
        padding: 0.625rem 0.875rem 0.25rem;
        font-size: 0.675rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.08em;
        color: var(--color-gray-400);
    }

    /* Mobile dropdowns */
    .jeb-navbar__dropdown-menu {
        position: static;
        box-shadow: none;
        border: none;
        background: var(--color-gray-50);
        margin: 0.125rem 0 0.25rem 0;
        padding: 0.25rem 0 0.25rem 0.5rem;
        border-radius: var(--radius-md);
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        visibility: hidden;
        transform: none;
        transition: max-height 0.25s ease, opacity 0.2s ease;
    }

    .jeb-navbar__dropdown.show > .jeb-navbar__dropdown-menu,
    .jeb-navbar__item.show > .jeb-navbar__dropdown-menu {
        max-height: 500px;
        overflow-y: auto;
        opacity: 1;
        visibility: visible;
    }

    .jeb-navbar__dropdown-menu a {
        font-size: 0.85rem;
        padding: 0.5rem 0.75rem;
    }

    /* Notification bell — row style on mobile */
    .jeb-navbar__notification-bell {
        width: 100%;
        height: auto;
        border-radius: var(--radius-md);
        background: transparent;
        padding: 0.625rem 0.875rem;
        font-size: 0.9rem;
        font-weight: 500;
        color: var(--color-gray-700);
        gap: 0.625rem;
        justify-content: flex-start;
    }

    .jeb-navbar__notification-bell i {
        width: 22px;
        text-align: center;
        font-size: 0.95rem;
        color: var(--color-gray-500);
    }

    .jeb-navbar__notification-bell::after {
        content: 'Notifications';
        font-size: 0.9rem;
        font-weight: 500;
    }

    .jeb-navbar__notification-bell:hover {
        background: var(--color-gray-100);
        color: var(--color-primary);
    }

    .jeb-navbar__notification-bell:hover i {
        color: var(--color-primary);
    }

    .jeb-navbar__notification-dot {
        position: static;
        border: none;
        width: 7px;
        height: 7px;
        flex-shrink: 0;
    }

    /* User toggle — card-like on mobile */
    .jeb-navbar__user-toggle {
        width: 100%;
        border-radius: var(--radius-lg);
        padding: 0.75rem 0.875rem;
        border: 1px solid var(--color-primary);
        background: var(--color-primary-subtle);
        color: var(--color-primary);
        font-weight: 600;
        margin-bottom: 0.25rem;
    }

    .jeb-navbar__user-toggle .jeb-navbar__user-avatar {
        background: var(--color-primary);
        color: var(--color-white);
    }

    .jeb-navbar__user-toggle .jeb-navbar__chevron {
        margin-left: auto;
    }

    /* CTA button — sticky at bottom */
    .jeb-navbar__cta {
        width: calc(100% - 1.5rem);
        justify-content: center;
        margin: 0.5rem 0.75rem 0.75rem;
        padding: 0.625rem 1rem;
        flex-shrink: 0;
    }

    /* Desktop-only buttons hidden on mobile (they appear as nav items instead) */
    .d-none.d-lg-flex {
        display: none !important;
    }
}

/* ─── 7. EVENT CARDS — LISTINGS ─── */
.jeb-event-card {
    background: var(--color-white);
    border-radius: var(--radius-xl);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: box-shadow var(--transition-normal);
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.jeb-event-card:hover {
    box-shadow: var(--shadow-lg);
}

.jeb-event-card__image-wrap {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
    flex-shrink: 0;
}

/* Force image to cover the full card area — no white gaps */
.jeb-event-card__image-wrap .thumb-img-bg {
    height: 220px;
    background-size: cover;
    background-position: center;
}

.jeb-event-card__image-wrap .thumb-img-bg .thumb-img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    object-position: center;
}

.jeb-event-card__image-wrap .back-image,
.jeb-event-card__image-wrap .thumb-img-bg {
    transition: transform var(--transition-slow);
}

.jeb-event-card:hover .jeb-event-card__image-wrap .back-image,
.jeb-event-card:hover .jeb-event-card__image-wrap .thumb-img-bg {
    transform: scale(1.08);
}

.jeb-event-card__date {
    position: absolute;
    top: 12px;
    left: 12px;
    background: var(--color-primary-subtle);
    color: var(--color-primary);
    padding: 4px 10px;
    border-radius: var(--radius-md);
    font-size: var(--font-size-xs);
    font-weight: 700;
    z-index: 2;
}

.jeb-event-card__category-badge {
    position: absolute;
    top: 12px;
    right: 12px;
    background: rgba(255,255,255,0.85);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    padding: 4px 10px;
    border-radius: var(--radius-md);
    font-size: var(--font-size-xs);
    font-weight: 600;
    color: var(--color-gray-700);
    z-index: 2;
}

.jeb-event-card__body {
    padding: 24px 28px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.jeb-event-card__title {
    font-size: var(--font-size-xl);
    font-weight: 700;
    color: var(--color-gray-900);
    margin-bottom: 0.5rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.jeb-event-card__excerpt {
    font-size: var(--font-size-sm);
    color: var(--color-gray-500);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 1rem;
}

.jeb-event-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.jeb-event-card__price {
    font-size: var(--font-size-lg);
    font-weight: 700;
    color: var(--color-primary);
    margin-top: auto;
}

.jeb-event-card__price--free {
    color: var(--color-success);
}

/* Online event badge with pulse */
.jeb-event-card__online-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 4px 10px;
    background: var(--color-info-light);
    color: var(--color-info);
    border-radius: var(--radius-full);
    font-size: var(--font-size-xs);
    font-weight: 600;
}

.jeb-event-card__online-dot {
    width: 6px;
    height: 6px;
    background: var(--color-info);
    border-radius: 50%;
    animation: jeb-pulse-info 2s infinite;
}

@keyframes jeb-pulse-info {
    0% { box-shadow: 0 0 0 0 rgba(59,130,246,0.4); }
    70% { box-shadow: 0 0 0 6px rgba(59,130,246,0); }
    100% { box-shadow: 0 0 0 0 rgba(59,130,246,0); }
}

/* Sold out state */
.jeb-event-card--sold-out {
    filter: grayscale(0.3);
    opacity: 0.85;
}

/* ANTI-FLICKER: Ticket section variant */
.jeb-event-card--tickets {
    transition: none !important;
    transform: none !important;
    will-change: auto !important;
    overflow: visible !important;
    display: block !important;
    height: auto !important;
}

.jeb-event-card--tickets .img-hover:hover {
    transform: none !important;
}

.jeb-event-card--tickets .modal {
    z-index: 9999 !important;
}

/* Card section header */
.jeb-event-card__section-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 20px 28px;
    border-bottom: 1px solid var(--color-gray-200);
    font-size: var(--font-size-lg);
    font-weight: 700;
    color: var(--color-gray-900);
}

.jeb-event-card__section-header i {
    color: var(--color-primary);
    font-size: var(--font-size-xl);
}

/* Share bar */
.jeb-event-card__share {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 16px 28px;
    border-top: 1px solid var(--color-gray-200);
}

.jeb-share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--color-gray-100);
    color: var(--color-gray-600);
    font-size: var(--font-size-sm);
    transition: all var(--transition-fast);
    text-decoration: none;
    border: none;
    cursor: pointer;
}

.jeb-share-btn:hover {
    transform: translateY(-2px);
}

.jeb-share-btn--facebook:hover { background: #1877f2; color: white; }
.jeb-share-btn--twitter:hover { background: #1da1f2; color: white; }
.jeb-share-btn--linkedin:hover { background: #0a66c2; color: white; }
.jeb-share-btn--whatsapp:hover { background: #25d366; color: white; }
.jeb-share-btn--reddit:hover { background: #ff4500; color: white; }
.jeb-share-btn--copy:hover { background: var(--color-primary); color: white; }

/* ─── 8. EVENT DETAILS PAGE ─── */

/* Keep the navbar dropdown above the page content on mobile */
.nav-header {
    position: relative;
    z-index: 2;
}

/* Ensure db-wrapper contains its children and doesn't let backgrounds bleed */
.db-wrapper {
    position: relative;
    z-index: 1;
    overflow: hidden;
}

/* Dashboard pages: don't clip modals/popups */
body.dashboard-body-bg .db-wrapper {
    overflow: visible;
}

.jeb-event-hero {
    position: relative;
    width: 100%;
    min-height: auto;
    margin-top: -80px;
    z-index: 1;
}

/* Background image clipping handled by background-size; do NOT use overflow:hidden here
   as that cuts off the accordion content when Get Tickets is expanded */
.jeb-event-hero.cover-img-bg {
    overflow: visible !important;
    background-attachment: scroll;
}

/* Event content area below the hero (inside the same section) */
.jeb-event-content {
    position: relative;
    background: var(--color-gray-50, #f8f9fa);
    padding: 2rem 0 1rem;
    z-index: 3;
    border-radius: var(--radius-lg, 12px) var(--radius-lg, 12px) 0 0;
    margin-top: 1rem;
    color: var(--color-gray-800, #343a40);
}

/* ── Override accordion white-on-dark styles inside the light content area ── */
.jeb-event-content .css-accordion {
    color: var(--color-gray-800, #343a40);
    background: #fff;
    border: 1px solid var(--color-gray-200, #e9ecef);
    border-radius: var(--radius-lg, 12px);
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    backdrop-filter: none;
}

/* css-accordion-label overrides — see full rules in JEB Tickets Label section below */

.jeb-event-content .css-accordion-content {
    color: var(--color-gray-700, #495057);
    background: transparent;
}

.jeb-event-content .css-accordion-content p,
.jeb-event-content .css-accordion-content span,
.jeb-event-content .css-accordion-content li,
.jeb-event-content .css-accordion-content a {
    color: var(--color-gray-700, #495057);
}

.jeb-event-content .css-accordion-content a {
    color: var(--color-primary, #f54b09);
}

.jeb-event-content .border-gradient-purple {
    border-image-source: linear-gradient(291deg, rgba(0,0,0,0.08), rgba(0,0,0,0.03));
}

/* Buy tickets accordion in content area */
.jeb-event-content .buy-tickets-now-accordion {
    color: var(--color-gray-800, #343a40);
    background: transparent;
    border: none;
    border-radius: 14px;
    box-shadow: none;
    backdrop-filter: none;
    overflow: visible;
    margin-bottom: 1.25rem;
}
/* Override theme's overflow:hidden on the outer wrapper */
.buy-tickets-now-accordion {
    overflow: visible !important;
    border: none !important;
    background: transparent !important;
    backdrop-filter: none !important;
    box-shadow: none !important;
}

/* ── JEB Tickets Label — Professional CTA ── */
.jeb-tickets-label {
    display: flex !important;
    align-items: center !important;
    gap: 0.85rem !important;
    background: linear-gradient(135deg, #ff6b35 0%, #f54b09 60%, #e03d00 100%) !important;
    border: none !important;
    color: #fff !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    padding: 0.9rem 1.25rem !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 20px rgba(245,75,9,0.35), 0 1px 4px rgba(0,0,0,0.1) !important;
    cursor: pointer !important;
    margin-bottom: 0 !important;
    text-align: left !important;
    position: relative !important;
    overflow: hidden !important;
    transition: box-shadow 0.3s ease, transform 0.2s ease !important;
    justify-content: flex-start !important;
    -webkit-tap-highlight-color: transparent;
}

/* Kill the theme's ▼ pseudo-element */
.jeb-tickets-label::after,
.buy-tickets-now-accordion-label.jeb-tickets-label::after {
    content: none !important;
    display: none !important;
}

/* Subtle shimmer sweep on hover */
.jeb-tickets-label::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg, transparent 40%, rgba(255,255,255,0.08) 52%, transparent 64%);
    transform: translateX(-100%);
    transition: transform 0.6s ease;
}
.jeb-tickets-label:hover::before {
    transform: translateX(100%);
}

.jeb-tickets-label:hover {
    box-shadow: 0 6px 24px rgba(0,0,0,0.2), 0 0 0 1px rgba(255,255,255,0.08) inset !important;
    transform: translateY(-1px) !important;
}
.jeb-tickets-label:active {
    transform: scale(0.985) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
}

/* Idle pulse glow — draws attention on page load */
@keyframes jeb-cta-pulse {
    0%, 100% { box-shadow: 0 4px 20px rgba(245,75,9,0.35), 0 0 0 0 rgba(245,75,9,0); }
    50%      { box-shadow: 0 4px 20px rgba(245,75,9,0.35), 0 0 0 7px rgba(245,75,9,0.15); }
}
.jeb-tickets-label {
    animation: jeb-cta-pulse 2.4s ease-in-out 3; /* pulse 3 times then stop */
}

/* Icon — frosted pill on orange background */
.jeb-tl-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: rgba(255,255,255,0.22);
    border-radius: 10px;
    flex-shrink: 0;
    font-size: 1.05rem;
    color: #fff;
    transition: transform 0.2s ease, background 0.2s ease;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.jeb-tickets-label:hover .jeb-tl-icon {
    transform: scale(1.06);
    background: rgba(255,255,255,0.32);
}

/* Text stack */
.jeb-tl-text {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}
.jeb-tl-main {
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: 0.01em;
    line-height: 1.2;
    color: #fff;
}
.jeb-tl-sub {
    font-size: 0.72rem;
    font-weight: 400;
    color: rgba(255,255,255,0.68);
    margin-top: 3px;
    letter-spacing: 0.03em;
}

/* Right-side arrow — shows tap affordance */
.jeb-tl-chevron {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    background: rgba(255,255,255,0.18);
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: 50%;
    flex-shrink: 0;
    font-size: 0.72rem;
    color: rgba(255,255,255,0.9);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), background 0.2s ease, color 0.2s ease;
}
.jeb-tickets-label:hover .jeb-tl-chevron {
    background: rgba(255,255,255,0.28);
    color: #fff;
    border-color: rgba(255,255,255,0.35);
}
.buy-tickets-now-checkbox:checked + .jeb-tickets-label .jeb-tl-chevron {
    transform: rotate(180deg);
    background: rgba(255,255,255,0.28);
    color: #fff;
}

/* When open — flatten bottom corners, remove pulse */
.buy-tickets-now-checkbox:checked + .jeb-tickets-label {
    border-radius: 14px 14px 0 0 !important;
    transform: none !important;
    box-shadow: 0 4px 20px rgba(245,75,9,0.25) !important;
    animation: none !important;
}

/* Content panel */
.jeb-event-content .buy-tickets-now-accordion-content {
    color: var(--color-gray-800, #343a40);
    background: #fff;
    border-radius: 0 0 14px 14px;
    border: 1px solid rgba(0,0,0,0.06);
    border-top: 2px solid #f54b09;
}

/* ── Content section accordion labels ── */
.jeb-event-content .css-accordion-label {
    color: var(--color-gray-800, #343a40) !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    padding: 0.95rem 1.25rem !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.6rem !important;
    border-bottom: 1px solid var(--color-gray-200, #e9ecef) !important;
    transition: background 0.18s ease, color 0.18s ease !important;
}

.jeb-event-content .css-accordion-label .jeb-acc-icon {
    color: var(--color-primary, #f54b09);
    font-size: 1rem;
    width: 20px;
    text-align: center;
    flex-shrink: 0;
}

.jeb-event-content .css-accordion-label:hover {
    background: #fff8f5 !important;
    color: var(--color-primary, #f54b09) !important;
    box-shadow: none !important;
    transform: none !important;
}
.jeb-event-content .css-accordion-label:hover .jeb-acc-icon {
    color: var(--color-primary, #f54b09) !important;
}

/* Chevron rotates when open */
.jeb-event-content .css-accordion-label::after {
    content: "›";
    font-size: 1.4rem;
    font-weight: 300;
    color: var(--color-gray-400, #adb5bd);
    margin-left: auto;
    transition: transform 0.25s ease;
    line-height: 1;
}
.jeb-event-content .css-accordion input[type="checkbox"]:checked + .css-accordion-label::after {
    transform: rotate(90deg);
    color: var(--color-primary, #f54b09);
}
.jeb-event-content .css-accordion input[type="checkbox"]:checked + .css-accordion-label {
    color: var(--color-primary, #f54b09) !important;
}

/* Mobile tweaks for ticket label */
@media (max-width: 576px) {
    .jeb-tickets-label {
        padding: 0.75rem 0.9rem !important;
        gap: 0.7rem !important;
        border-radius: 12px !important;
    }
    .jeb-tl-icon {
        width: 36px;
        height: 36px;
        font-size: 0.95rem;
        border-radius: 9px;
    }
    .jeb-tl-main {
        font-size: 0.95rem;
    }
    .jeb-tl-sub {
        font-size: 0.68rem;
    }
    .jeb-tl-chevron {
        width: 28px;
        height: 28px;
        font-size: 0.65rem;
    }
    .buy-tickets-now-checkbox:checked + .jeb-tickets-label {
        border-radius: 12px 12px 0 0 !important;
    }
    .jeb-event-content .buy-tickets-now-accordion-content {
        border-radius: 0 0 12px 12px;
    }
}



/* ── Mobile Font Visibility Fixes ── */
@media (max-width: 768px) {
    /* Hero excerpt text — was 0.7rem, too small to read */
    .about-text {
        font-size: 0.9rem !important;
        line-height: 1.6 !important;
        color: rgba(255, 255, 255, 0.92) !important;
    }

    /* Event title — bump up for readability */
    .event-title {
        font-size: 1.5rem !important;
        font-weight: 700 !important;
        line-height: 1.25 !important;
    }

    /* Date/time pill — slightly larger text */
    .event-datetime {
        font-size: 0.95rem !important;
        padding: 0.75rem 1rem !important;
    }

    /* Accordion labels — ensure readable on mobile */
    .jeb-event-content .css-accordion-label {
        font-size: 1rem !important;
        padding: 1rem !important;
    }

    /* Accordion content text — ensure readable */
    .jeb-event-content .css-accordion-content p,
    .jeb-event-content .css-accordion-content span,
    .jeb-event-content .css-accordion-content li {
        font-size: 0.95rem !important;
        line-height: 1.7 !important;
    }

    /* Venue card text */
    .venue-card-content .venue-title {
        font-size: 1rem !important;
    }
    .venue-card-content .venue-address {
        font-size: 0.85rem !important;
    }
}

@media (max-width: 480px) {
    .event-title {
        font-size: 1.3rem !important;
        font-weight: 700 !important;
    }

    .event-datetime {
        font-size: 0.88rem !important;
        padding: 0.65rem 0.85rem !important;
    }

    .about-text {
        font-size: 0.85rem !important;
    }
}

/* Share buttons in content area */
.jeb-event-content .jeb-event-card__share span {
    color: var(--color-gray-600, #6c757d) !important;
}

/* Location section - override text-light for tags */
.jeb-event-content .text-light {
    color: var(--color-gray-700, #495057) !important;
}

.jeb-event-content h5 {
    color: var(--color-gray-800, #343a40);
}

.jeb-event-content .small {
    color: var(--color-gray-600, #6c757d);
}

.jeb-event-hero__banner {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    filter: blur(3px);
    transform: scale(1.1);
}

/* Note: .jeb-event-hero__overlay is a CONTENT wrapper, not an absolute overlay.
   The dark overlay effect comes from .cover-img-bg-2::before pseudo-element.
   Do NOT set position:absolute here or content will collapse. */
.jeb-event-hero__overlay {
    position: relative;
    z-index: 2;
}

.jeb-event-hero__img {
    position: relative;
    z-index: 2;
    max-width: 400px;
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-xl);
}

.jeb-event-detail {
    background: var(--color-gray-50);
    min-height: 100vh;
}

.jeb-event-detail__wrapper {
    padding: 2rem 0;
}

/* Sidebar */
.jeb-event-sidebar__sticky {
    position: sticky;
    top: 88px;
}

.jeb-event-card--cta {
    background: linear-gradient(135deg, var(--color-primary), var(--color-primary-hover));
    border-radius: var(--radius-xl);
    padding: 1.5rem;
    text-align: center;
}

.jeb-event-card--cta .jeb-btn {
    width: 100%;
    background: var(--color-white);
    color: var(--color-primary);
    font-weight: 700;
}

.jeb-event-card--cta .jeb-btn:hover {
    background: var(--color-gray-50);
}

@media (max-width: 991.98px) {
    .jeb-event-hero { min-height: auto; }
    .jeb-event-hero__img { max-width: 280px; }
}

@media (max-width: 575.98px) {
    .jeb-event-hero { min-height: auto; }
    .jeb-event-hero__img { max-width: 200px; }
    .jeb-event-card__body { padding: 16px 20px; }
    .jeb-event-card__section-header { padding: 14px 20px; }
    .jeb-event-card__share { padding: 12px 20px; }
    .jeb-event-content { padding: 1rem 0; }
}

/* ─── 9. TICKET MODAL — SLEEK BUTTONS ─── */

/* Fix: prevent modal top from being cut off (flexbox centering overflow bug) */
.custom_model .modal.show,
.custom_model .show {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 9998 !important;
    margin: 0 !important;
    padding: 80px 0 1.75rem !important;
}

.custom_model .modal-dialog {
    margin: auto !important;
    max-width: 800px;
    width: 100%;
    pointer-events: auto;
}

.custom_model .modal-content {
    pointer-events: auto;
}

.custom_model .btn {
    font-size: 0.8rem;
    padding: 6px 14px;
    border-radius: 8px;
    font-weight: 600;
    transition: all 0.2s ease;
}

.custom_model .btn-primary {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.custom_model .btn-primary:hover {
    background-color: var(--color-primary-hover);
    border-color: var(--color-primary-hover);
}

.custom_model .btnSeatMob {
    font-size: 0.75rem;
    padding: 4px 12px;
    border-radius: 20px;
}

.custom_model .btn-success.btn-lg {
    font-size: 0.9rem;
    padding: 10px 20px;
    border-radius: 10px;
    background: linear-gradient(135deg, #10b981, #059669);
    border: none;
}

.custom_model .btn-close {
    border-radius: 50%;
    width: 32px;
    height: 32px;
    opacity: 0.6;
}

.custom_model .btn-close:hover {
    opacity: 1;
}

.custom_model .modal-header {
    padding: 16px 20px;
    border-bottom: 1px solid var(--color-gray-200);
}

.custom_model .modal-header .modal-title {
    font-size: 1.1rem;
    font-weight: 700;
}

.custom_model .form-select-lg {
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
}

.custom_model .input-group .form-control {
    border-radius: var(--radius-md) 0 0 var(--radius-md);
}

.custom_model .input-group .btn {
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
}

.custom_model .btn-dark {
    font-size: 0.8rem;
    padding: 6px 14px;
    border-radius: 8px;
}

.custom_model .btn-secondary {
    font-size: 0.8rem;
    padding: 6px 14px;
    border-radius: 8px;
}

.custom_model .btn-outline-secondary {
    font-size: 0.8rem;
    padding: 6px 14px;
    border-radius: 8px;
}

.custom_model .btn-danger {
    font-size: 0.8rem;
    padding: 6px 14px;
    border-radius: 8px;
}

/* ─── 10. NEO SEAT MAP ─── */
.neo-seat-map {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    overflow: hidden;
    width: 100%;
}

.neo-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 0.75rem 0;
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--color-gray-200);
}

.neo-legend-item {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    color: var(--color-gray-600);
    font-weight: 500;
}

.neo-dot {
    width: 12px;
    height: 12px;
    border-radius: 3px;
}

.neo-dot.neo-available { background: #22c55e; }
.neo-dot.neo-wheelchair { background: #3b82f6; }
.neo-dot.neo-booked { background: #d1d5db; }
.neo-dot.neo-selected { background: #f54b09; }
.neo-dot.neo-premium { background: #eab308; }
.neo-dot.neo-vip { background: #ec4899; }

.neo-selection-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 0;
    margin-bottom: 1rem;
}

.neo-selection-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--color-primary);
    color: var(--color-white);
    font-size: 0.75rem;
    font-weight: 700;
}

.neo-seat-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    background: var(--color-primary-subtle);
    color: var(--color-primary);
    border-radius: var(--radius-full);
    font-size: 0.7rem;
    font-weight: 600;
}

.neo-seat-grid {
    overflow: visible;
    transform-origin: left top;
}

.neo-stage {
    background: var(--color-secondary);
    color: var(--color-white);
    text-align: center;
    padding: 0.5rem 1rem;
    border-radius: var(--radius-md);
    margin-bottom: 1.5rem;
    font-size: var(--font-size-sm);
    font-weight: 600;
}

.neo-row {
    display: flex;
    align-items: center;
    margin-bottom: 4px;
}

.neo-row-label {
    width: 28px;
    text-align: center;
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--color-gray-500);
    flex-shrink: 0;
}

.neo-row-seats {
    display: flex;
    gap: 3px;
    flex-wrap: nowrap;
}

.neo-seat-wrapper {
    position: relative;
}

.neo-seat {
    width: 22px;
    height: 22px;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all var(--transition-fast);
    border: none;
    position: relative;
}

.neo-seat-num {
    font-size: 8px;
    color: white;
    font-weight: 600;
    pointer-events: none;
    line-height: 1;
}

/* Seat type colors */
.neo-seat-available { background: #22c55e; }
.neo-seat-available:hover { background: #16a34a; transform: scale(1.15); }

.neo-seat-wheelchair { background: #3b82f6; }
.neo-seat-wheelchair:hover { background: #2563eb; transform: scale(1.15); }

.neo-seat-premium { background: #eab308; }
.neo-seat-premium:hover { background: #ca8a04; transform: scale(1.15); }

.neo-seat-vip { background: #ec4899; }
.neo-seat-vip:hover { background: #db2777; transform: scale(1.15); }

.neo-seat-booked {
    background: #d1d5db;
    cursor: not-allowed;
    opacity: 0.7;
}

.neo-seat-selected {
    background: #f54b09 !important;
    box-shadow: 0 0 0 3px rgba(245,75,9,0.3);
    transform: scale(1.1);
}

.neo-seat-space {
    background: transparent;
    cursor: default;
}

.neo-seat-hidden {
    background: var(--color-gray-300);
    opacity: 0.4;
    cursor: default;
}

@media (max-width: 575.98px) {
    .neo-seat { width: 18px; height: 18px; }
    .neo-seat-num { font-size: 6px; }
    .neo-row-label { width: 22px; font-size: 0.6rem; }
    .neo-row-seats { gap: 2px; }
}

/* ─── 11. LANDING PAGE (Welcome) ─── */
/* .jeb-hero base rule is defined in section 15.1 below */

.jeb-search-bar {
    position: relative;
    z-index: 10;
    background: rgba(255,255,255,0.9);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: var(--radius-2xl);
    box-shadow: var(--shadow-xl);
    padding: 1rem 1.5rem;
    margin-top: -40px;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.jeb-search-bar__form {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.jeb-search-bar__field {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-lg);
    background: var(--color-white);
    transition: all var(--transition-fast);
}

.jeb-search-bar__field:focus-within {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(245,75,9,0.1);
}

.jeb-search-bar__field i {
    color: var(--color-gray-400);
    font-size: var(--font-size-base);
}

.jeb-search-bar__field input,
.jeb-search-bar__field select {
    border: none;
    outline: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-800);
    width: 100%;
}

.jeb-search-bar__submit {
    flex-shrink: 0;
}

@media (max-width: 767.98px) {
    .jeb-search-bar__form {
        flex-direction: column;
    }
    .jeb-search-bar__field {
        width: 100%;
    }
    .jeb-search-bar__submit {
        width: 100%;
    }
    .jeb-search-bar__submit .jeb-btn {
        width: 100%;
    }
}

/* Section system */
.jeb-section {
    padding: 64px 0;
}

.jeb-section--light {
    background: var(--color-gray-50);
}

.jeb-section--dark {
    background: var(--color-secondary);
    color: var(--color-white);
}

.jeb-section--dark h2,
.jeb-section--dark h3 {
    color: var(--color-white);
}

.jeb-section__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 2rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.jeb-section__header--center {
    justify-content: center;
    text-align: center;
}

.jeb-section__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 5px 12px;
    background: var(--color-primary-subtle);
    color: var(--color-primary);
    border-radius: var(--radius-full);
    font-size: var(--font-size-xs);
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.jeb-section__title {
    font-size: var(--font-size-3xl);
    font-weight: 800;
    margin-bottom: 0.25rem;
}

.jeb-section__subtitle {
    color: var(--color-gray-500);
    font-size: var(--font-size-base);
}

.jeb-section__link {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    color: var(--color-primary);
    font-weight: 600;
    font-size: var(--font-size-sm);
    text-decoration: none;
    transition: all var(--transition-fast);
}

.jeb-section__link:hover {
    gap: 0.625rem;
    color: var(--color-primary-hover);
}

/* Category cards */
/* Old .jeb-category-card styles removed — replaced by .jeb-cat-card below */

/* City cards */
.jeb-city-card {
    position: relative;
    height: 260px;
    border-radius: var(--radius-xl);
    overflow: hidden;
    cursor: pointer;
    background-size: cover;
    background-position: center;
}

.jeb-city-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.2) 100%);
    transition: all var(--transition-normal);
}

.jeb-city-card:hover::before {
    background: linear-gradient(to top, rgba(245,75,9,0.8) 0%, rgba(245,75,9,0.4) 100%);
}

.jeb-city-card__content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 1.25rem;
    color: var(--color-white);
    z-index: 2;
}

.jeb-city-card__name {
    font-size: var(--font-size-lg);
    font-weight: 700;
}

.jeb-city-card__location {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: var(--font-size-sm);
    opacity: 0.9;
}

/* Step cards */
.jeb-step-card {
    position: relative;
    background: var(--color-white);
    border-radius: var(--radius-xl);
    padding: 2rem;
    text-align: center;
    overflow: hidden;
    transition: all var(--transition-normal);
    box-shadow: var(--shadow-sm);
}

.jeb-step-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}

.jeb-step-card__number {
    position: absolute;
    top: -10px;
    right: 10px;
    font-size: 6rem;
    font-weight: 900;
    opacity: 0.04;
    line-height: 1;
    color: var(--color-gray-900);
}

.jeb-step-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    margin-bottom: 1rem;
    font-size: 1.5rem;
    transition: all var(--transition-normal);
}

.jeb-step-card__icon--orange {
    background: var(--color-primary-subtle);
    color: var(--color-primary);
}

.jeb-step-card:hover .jeb-step-card__icon--orange {
    background: var(--color-primary);
    color: var(--color-white);
}

.jeb-step-card__icon--blue {
    background: var(--color-info-light);
    color: var(--color-info);
}

.jeb-step-card:hover .jeb-step-card__icon--blue {
    background: var(--color-info);
    color: var(--color-white);
}

.jeb-step-card__icon--green {
    background: var(--color-success-light);
    color: var(--color-success);
}

.jeb-step-card:hover .jeb-step-card__icon--green {
    background: var(--color-success);
    color: var(--color-white);
}

.jeb-step-card__title {
    font-size: var(--font-size-md);
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.jeb-step-card__desc {
    font-size: var(--font-size-sm);
    color: var(--color-gray-500);
    line-height: 1.6;
}

/* CTA section */
.jeb-cta {
    position: relative;
    background: linear-gradient(135deg, var(--color-primary), var(--color-primary-hover));
    padding: 80px 0;
    overflow: hidden;
    text-align: center;
    color: var(--color-white);
}

.jeb-cta::before,
.jeb-cta::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    background: rgba(255,255,255,0.08);
}

.jeb-cta::before {
    width: 300px;
    height: 300px;
    top: -100px;
    left: -100px;
}

.jeb-cta::after {
    width: 200px;
    height: 200px;
    bottom: -60px;
    right: -60px;
}

.jeb-cta__title {
    font-size: var(--font-size-4xl);
    font-weight: 800;
    margin-bottom: 1rem;
}

.jeb-cta__subtitle {
    font-size: var(--font-size-lg);
    opacity: 0.9;
    margin-bottom: 2rem;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.jeb-cta__buttons {
    display: flex;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.jeb-cta .jeb-btn--primary {
    background: var(--color-white);
    color: var(--color-primary);
    box-shadow: var(--shadow-lg);
}

.jeb-cta .jeb-btn--primary:hover {
    background: var(--color-gray-50);
    color: var(--color-primary-hover);
}

.jeb-cta .jeb-btn--outline {
    border-color: rgba(255,255,255,0.5);
    color: var(--color-white);
}

.jeb-cta .jeb-btn--outline:hover {
    background: rgba(255,255,255,0.1);
    border-color: var(--color-white);
}

/* Blog cards */
.jeb-blog-card {
    background: var(--color-white);
    border-radius: var(--radius-xl);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all var(--transition-normal);
}

.jeb-blog-card:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-4px);
}

.jeb-blog-card__image {
    height: 200px;
    overflow: hidden;
}

.jeb-blog-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-slow);
}

.jeb-blog-card:hover .jeb-blog-card__image img {
    transform: scale(1.08);
}

.jeb-blog-card__body {
    padding: 1.25rem;
}

.jeb-blog-card__title {
    font-size: var(--font-size-md);
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.jeb-blog-card__title a {
    color: var(--color-gray-900);
    text-decoration: none;
}

.jeb-blog-card__title a:hover {
    color: var(--color-primary);
}

.jeb-blog-card__excerpt {
    font-size: var(--font-size-sm);
    color: var(--color-gray-500);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 1rem;
}

.jeb-blog-card__link {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    color: var(--color-primary);
    font-weight: 600;
    font-size: var(--font-size-sm);
    text-decoration: none;
    transition: all var(--transition-fast);
}

.jeb-blog-card__link:hover {
    gap: 0.625rem;
    color: var(--color-primary-hover);
}

/* ─── 11.9 STICKY GET TICKETS FLOATING BUTTON ─── */
/* Override theme CSS (loaded after this file) which sets display:none and position:fixed !important */
.scrollEvent {
    display: block !important;
    position: fixed !important;
    bottom: 28px !important;
    right: 28px !important;
    left: auto !important;
    z-index: 100000 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(12px) scale(0.95) !important;
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease !important;
    pointer-events: none !important;
    cursor: pointer;
    padding: 0 !important;
    background: none !important;
    backdrop-filter: none !important;
    border: none !important;
    border-top: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    text-align: left !important;
}

.scrollEvent.showBtn {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) scale(1) !important;
    pointer-events: auto !important;
}

.scrollEvent .jeb-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.75rem 1.35rem;
    font-size: 0.95rem;
    font-weight: 700;
    background: linear-gradient(135deg, #f54b09, #ff6b35);
    color: #fff !important;
    border: none;
    border-radius: 50px;
    box-shadow: 0 6px 24px rgba(245, 75, 9, 0.45), 0 2px 8px rgba(0,0,0,0.15);
    text-decoration: none;
    white-space: nowrap;
    letter-spacing: 0.02em;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.scrollEvent .jeb-btn:hover {
    background: linear-gradient(135deg, #e04000, #f54b09);
    transform: translateY(-2px) scale(1.03);
    box-shadow: 0 10px 32px rgba(245, 75, 9, 0.55), 0 4px 12px rgba(0,0,0,0.2);
    color: #fff !important;
}

.scrollEvent .jeb-btn:active {
    transform: translateY(0) scale(0.98);
}

/* On mobile — always-visible bottom-center full-width strip */
@media (max-width: 768px) {
    .scrollEvent {
        bottom: 0 !important;
        right: 0 !important;
        left: 0 !important;
        padding: 10px 16px !important;
        background: rgba(255,255,255,0.97) !important;
        backdrop-filter: blur(8px) !important;
        -webkit-backdrop-filter: blur(8px) !important;
        border-top: 1px solid #e8eaed !important;
        box-shadow: 0 -4px 16px rgba(0,0,0,0.1) !important;
        border-radius: 0 !important;
        text-align: center !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(0) !important;
        pointer-events: auto !important;
        display: block !important;
    }
    .scrollEvent .jeb-btn {
        width: 100%;
        justify-content: center;
        border-radius: 10px;
        font-size: 1rem;
        padding: 0.85rem 1rem;
    }
}

/* ─── 12. FOOTER ─── */
.jeb-footer {
    background: linear-gradient(180deg, #1a1a2e 0%, #0f0f1a 100%) !important;
    color: rgba(255,255,255,0.85) !important;
    padding: 3rem 0 1.5rem;
    margin-top: 0;
    position: relative;
    z-index: 10;
}

/* Ensure footer is outside any white background containers */
body.bg-white .jeb-footer,
.bg-white .jeb-footer,
section + .jeb-footer {
    background: linear-gradient(180deg, #1a1a2e 0%, #0f0f1a 100%) !important;
}

.jeb-footer h6 {
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--color-white);
    margin-bottom: 1rem;
}

.jeb-footer a {
    color: rgba(255,255,255,0.7);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.jeb-footer a:hover {
    color: var(--color-primary-light);
}

.jeb-footer__bottom {
    border-top: 1px solid rgba(255,255,255,0.1);
    margin-top: 2rem;
    padding-top: 1.5rem;
    font-size: var(--font-size-sm);
    color: rgba(255,255,255,0.5);
}

/* ─── 13. SCROLL ANIMATIONS ─── */
.jeb-animate {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.jeb-animate.jeb-visible {
    opacity: 1;
    transform: translateY(0);
}

.jeb-animate:nth-child(2) { transition-delay: 0.1s; }
.jeb-animate:nth-child(3) { transition-delay: 0.2s; }
.jeb-animate:nth-child(4) { transition-delay: 0.3s; }

/* ─── 14. SEAT MAP — Professional Styling ─── */

/* ╔══════════════════════════════════════════════════════╗
   ║  14.1  COLLAPSIBLE SEAT PANEL                        ║
   ╚══════════════════════════════════════════════════════╝ */
.collapsible-content {
    background: #f8f9fb;
    border-radius: 12px;
    padding: 0.65rem;
    margin-top: 0.5rem;
    border: 1px solid #e9ecf0;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

/* Fade-expand transition */
.fade-expand-enter-active,
.fade-expand-leave-active {
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    max-height: 2000px;
    overflow: hidden;
}
.fade-expand-enter,
.fade-expand-leave-to {
    opacity: 0;
    max-height: 0;
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 0;
}

/* ╔══════════════════════════════════════════════════════╗
   ║  14.2  LEGEND STRIP                                  ║
   ╚══════════════════════════════════════════════════════╝ */
.jeb-seat-legend {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    background: #fff;
    border-radius: 8px;
    padding: 0.35rem 0.6rem;
    margin-bottom: 0.4rem;
    border: 1px solid #eaecf0;
    box-shadow: none;
    gap: 0.35rem;
}

/* "LEGEND" title */
.jeb-seat-legend__title {
    font-size: 0.6rem;
    font-weight: 700;
    color: #9ca3af;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    margin-right: 0.15rem;
    white-space: nowrap;
}

/* Items wrapper */
.jeb-seat-legend__items {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem;
}

/* Each legend chip */
.jeb-seat-legend__item {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: transparent;
    border: none;
    border-radius: 4px;
    padding: 0.15rem 0.35rem;
    transition: background 0.15s ease;
}
.jeb-seat-legend__item:hover {
    background: #f3f4f6;
}

/* Legend chip label text */
.jeb-seat-legend__item span {
    font-size: 0.62rem;
    font-weight: 600;
    color: #6b7280;
    white-space: nowrap;
    line-height: 1;
}

/* ── Colour swatches ── */
.jeb-seat-swatch {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    flex-shrink: 0;
    display: inline-block;
}
.jeb-seat-swatch--available {
    background: #22c55e;
    border: 1.5px solid #16a34a;
}
.jeb-seat-swatch--wheelchair {
    background: #3b82f6;
    border: 1.5px solid #2563eb;
}
.jeb-seat-swatch--selected {
    background: #f54b09;
    border: 1.5px solid #c73a00;
}
.jeb-seat-swatch--booked {
    background: #e5e7eb;
    border: 1.5px solid #d1d5db;
}
.jeb-seat-swatch--reserved1 {
    background: #e879a8;
    border: 1.5px solid #d1558a;
}
.jeb-seat-swatch--reserved2 {
    background: #d1d5db;
    border: 1.5px solid #9ca3af;
    position: relative;
}
.jeb-seat-swatch--reserved2::after {
    content: '';
    position: absolute;
    top: 2px;
    right: 2px;
    width: 6px;
    height: 6px;
    background: #14b8a6;
    border-radius: 50%;
}

/* ╔══════════════════════════════════════════════════════╗
   ║  14.3  SELECTED SEATS STRIP                          ║
   ╚══════════════════════════════════════════════════════╝ */
.jeb-selected-seats {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    background: #fff;
    border-radius: 8px;
    padding: 0.3rem 0.6rem;
    margin-bottom: 0.35rem;
    border: 1px solid #eaecf0;
    box-shadow: none;
    gap: 0.3rem;
}

/* "SELECTED SEATS" title */
.jeb-selected-seats__title {
    font-size: 0.6rem;
    font-weight: 700;
    color: #9ca3af;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    white-space: nowrap;
    line-height: 1.6;
    margin-right: 0.15rem;
}

/* Badges wrapper */
.jeb-selected-seats__badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.2rem;
}

/* Each selected seat badge */
.jeb-seat-badge {
    display: inline-block;
    background: #f54b09;
    color: #fff;
    font-size: 0.6rem;
    font-weight: 700;
    padding: 0.15em 0.45em;
    border-radius: 4px;
    letter-spacing: 0.03em;
    box-shadow: none;
    transition: transform 0.12s ease;
    cursor: default;
    white-space: nowrap;
}
.jeb-seat-badge:hover {
    transform: scale(1.05);
    box-shadow: 0 2px 6px rgba(245,75,9,0.2);
}

/* "No seats selected" placeholder */
.jeb-selected-seats__empty {
    font-size: 0.65rem;
    color: #9ca3af;
    font-style: italic;
    font-weight: 500;
    padding: 0;
}

/* ╔══════════════════════════════════════════════════════╗
   ║  14.4  ZOOM CONTROLS BAR — Sleek Inline              ║
   ╚══════════════════════════════════════════════════════╝ */
.collapsible-content > .break-flex.mt-2.text-center {
    display: flex !important;
    justify-content: flex-end;
    align-items: center;
    gap: 0.2rem;
    padding: 0.15rem 0 0.25rem;
    margin-bottom: 0.25rem;
}

.collapsible-content > .break-flex.mt-2.text-center .btn {
    width: 26px;
    height: 26px;
    border-radius: 6px;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    font-size: 0.68rem;
    background: #fff;
    border: 1px solid #d1d5db !important;
    color: #6b7280;
    transition: all 0.15s ease;
    box-shadow: none;
}
.collapsible-content > .break-flex.mt-2.text-center .btn:hover {
    background: #f54b09 !important;
    color: #fff !important;
    border-color: #f54b09 !important;
    box-shadow: 0 2px 6px rgba(245,75,9,0.2);
    transform: scale(1.08);
}
.collapsible-content > .break-flex.mt-2.text-center .btn:active {
    transform: scale(0.93);
}

/* ╔══════════════════════════════════════════════════════╗
   ║  14.5  SEAT GRID WRAPPER                             ║
   ╚══════════════════════════════════════════════════════╝ */

/* The .neo-seat-map.seat-container is the zoom target — it should
   fill available width and provide horizontal scroll when zoomed */
.collapsible-content .neo-seat-map {
    background: #fff !important;
    border-radius: 10px !important;
    border: 1px solid #eaecf0 !important;
    box-shadow: none !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    width: 100% !important;
    padding: 0.75rem !important;
}

/* Card inside — no extra border/shadow, fit to content */
.collapsible-content .neo-seat-map > .card {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    border-radius: 0 !important;
    overflow: visible !important;
    width: fit-content;
    margin: 0 auto;
}
.collapsible-content .neo-seat-map .card {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* Card body — the seat grid. Center it, no extra scroll */
.collapsible-content .neo-seat-map .card-body {
    padding: 0.5rem !important;
    overflow: visible !important;
    width: fit-content;
    margin: 0 auto;
}

/* "Enter guest details" button — keep subtle */
.collapsible-content .break-flex.my-2.text-center .btn-primary {
    font-size: 0.78rem;
    padding: 0.4rem 1rem;
    border-radius: 8px;
    background: #1e293b !important;
    border: none !important;
    font-weight: 600;
    letter-spacing: 0.02em;
}
.collapsible-content .break-flex.my-2.text-center .btn-primary:hover {
    background: #f54b09 !important;
    box-shadow: 0 2px 8px rgba(245,75,9,0.2);
}
.collapsible-content .break-flex.my-2.text-center {
    margin-top: 0.35rem !important;
    margin-bottom: 0.35rem !important;
}

/* ╔══════════════════════════════════════════════════════╗
   ║  14.6  ROW LABELS & ROW LAYOUT                       ║
   ╚══════════════════════════════════════════════════════╝ */
.neo-row {
    display: flex;
    align-items: center;
    margin-bottom: 3px;
}

.neo-row-label {
    width: 26px;
    min-width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.6rem;
    font-weight: 800;
    color: #fff;
    flex-shrink: 0;
    background: #374151;
    border-radius: 5px;
    margin-right: 6px;
    letter-spacing: 0.02em;
}

.neo-row-seats {
    display: flex;
    gap: 4px;
    flex-wrap: nowrap;
}

/* ╔══════════════════════════════════════════════════════╗
   ║  14.7  STAGE BANNER                                  ║
   ╚══════════════════════════════════════════════════════╝ */
.neo-stage {
    background: linear-gradient(135deg, #1e293b, #334155);
    color: #e2e8f0;
    text-align: center;
    padding: 0.35rem 1rem;
    border-radius: 8px;
    margin-bottom: 0.5rem;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    box-shadow: 0 1px 4px rgba(0,0,0,0.12);
    border: 1px solid rgba(255,255,255,0.06);
}

/* ╔══════════════════════════════════════════════════════╗
   ║  14.8  VIEW SEATS BUTTON — Sleek Compact Toggle      ║
   ╚══════════════════════════════════════════════════════╝ */
.viewTickbutton .btn-primary.btnSeatMob,
.btn.btn-primary.btnSeatMob {
    background: transparent !important;
    border: 1.5px solid #f54b09 !important;
    color: #f54b09 !important;
    font-size: 0.68rem;
    font-weight: 700;
    padding: 0.25rem 0.7rem;
    border-radius: 20px;
    letter-spacing: 0.03em;
    transition: all 0.2s ease;
    box-shadow: none;
    margin-top: 0.25rem;
    text-transform: uppercase;
    line-height: 1.4;
    white-space: nowrap;
}
.viewTickbutton .btn-primary.btnSeatMob:hover,
.btn.btn-primary.btnSeatMob:hover {
    background: #f54b09 !important;
    color: #fff !important;
    transform: none;
    box-shadow: 0 2px 8px rgba(245, 75, 9, 0.2);
}

/* ╔══════════════════════════════════════════════════════╗
   ║  14.9  RESPONSIVE — Sleek Mobile                     ║
   ╚══════════════════════════════════════════════════════╝ */
@media (max-width: 767.98px) {
    .collapsible-content {
        padding: 0.5rem;
        border-radius: 10px;
    }

    /* Legend + Selected Seats — stay horizontal on mobile */
    .jeb-seat-legend,
    .jeb-selected-seats {
        flex-direction: row;
        align-items: center;
        gap: 0.25rem;
        padding: 0.25rem 0.45rem;
    }
    .jeb-seat-legend__title,
    .jeb-selected-seats__title {
        font-size: 0.55rem;
    }
    .jeb-seat-legend__items {
        gap: 0.15rem;
    }
    .jeb-seat-legend__item {
        padding: 0.1rem 0.25rem;
    }
    .jeb-seat-legend__item span {
        font-size: 0.58rem;
    }
    .jeb-seat-swatch {
        width: 10px;
        height: 10px;
        border-radius: 2px;
    }
    .jeb-seat-badge {
        font-size: 0.55rem;
        padding: 0.12em 0.35em;
    }
    .jeb-selected-seats__empty {
        font-size: 0.58rem;
    }

    /* Zoom controls — smaller on mobile */
    .collapsible-content > .break-flex.mt-2.text-center {
        justify-content: flex-end;
        gap: 0.15rem;
        padding: 0.1rem 0 0.15rem;
        margin-bottom: 0.15rem;
        margin-top: 0 !important;
    }
    .collapsible-content > .break-flex.mt-2.text-center .btn {
        width: 24px;
        height: 24px;
        font-size: 0.6rem;
    }

    /* View/Hide Seats button — even more compact on mobile */
    .viewTickbutton .btn-primary.btnSeatMob,
    .btn.btn-primary.btnSeatMob {
        font-size: 0.6rem;
        padding: 0.2rem 0.55rem;
        margin-top: 0.15rem;
    }

    /* Enter guest details button — compact on mobile */
    .collapsible-content .break-flex.my-2.text-center .btn-primary {
        font-size: 0.72rem !important;
        padding: 0.35rem 0.85rem !important;
        border-radius: 8px !important;
    }

    /* Seat row labels */
    .neo-row-label {
        width: 22px;
        min-width: 22px;
        height: 22px;
        font-size: 0.55rem;
        border-radius: 4px;
        margin-right: 4px;
    }
    .neo-row-seats { gap: 3px; }

    /* Ticket row — tighter when seats are shown */
    .ticket-title-padding {
        padding: 0.35rem 0 !important;
    }

    /* viewTickbutton column — better alignment */
    .viewTickbutton {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        justify-content: center;
    }
}


/* ========================================================================
   SECTION 16: TICKET BOOKING PANEL — Professional JEB Redesign
   Schedule picker, View Seat Chart, Admin panel, Complimentary toggle
   ======================================================================== */

/* ╔══════════════════════════════════════════════════════╗
   ║  16.1  SCHEDULE HINT (Date selection prompt)         ║
   ╚══════════════════════════════════════════════════════╝ */
.jeb-schedule-hint {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 12px;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}
.jeb-hint-step {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    min-width: 30px;
    background: #f54b09;
    color: #fff;
    border-radius: 50%;
    font-size: 0.78rem;
    font-weight: 700;
    flex-shrink: 0;
    line-height: 1;
}
.jeb-hint-step i {
    font-size: 0.8rem;
}
.jeb-hint-body {
    flex: 1;
    min-width: 0;
}
.jeb-hint-body strong {
    display: block;
    font-size: 0.875rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.3;
    margin-bottom: 2px;
}
.jeb-hint-body span {
    font-size: 0.75rem;
    font-weight: 400;
    color: #6B7280;
    line-height: 1.4;
}

/* ╔══════════════════════════════════════════════════════╗
   ║  16.2  SELECTED SCHEDULE (Active Date Card)          ║
   ╚══════════════════════════════════════════════════════╝ */
/* The active orange date pill — professional redesign */
.lgx-single-schedule.schedule-active {
    transform: none;
    z-index: 1;
}
.lgx-single-schedule.schedule-active .card,
.lgx-single-schedule.schedule-active .schedule-info {
    background: linear-gradient(135deg, #f54b09 0%, #ff6b35 100%) !important;
    border: 1.5px solid #c73a00 !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 16px rgba(245,75,9,0.28) !important;
    transition: all 0.2s ease;
}
.lgx-single-schedule.schedule-active .card:hover {
    box-shadow: 0 6px 22px rgba(245,75,9,0.38) !important;
    transform: translateY(-1px);
}
.lgx-single-schedule.schedule-active .card p,
.lgx-single-schedule.schedule-active .schedule-info p {
    color: #fff !important;
}

/* Non-active schedule cards */
.lgx-single-schedule .schedule-info,
.lgx-single-schedule .card.schedule-info {
    border: 1.5px solid #e2e5ea !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05) !important;
    transition: all 0.2s ease;
    padding: 0.6rem 0.75rem !important;
}
.lgx-single-schedule .schedule-info p,
.lgx-single-schedule .card.schedule-info p {
    color: #212529 !important;
}
.lgx-single-schedule .schedule-info:hover,
.lgx-single-schedule .card.schedule-info:hover {
    border-color: #f54b09 !important;
    background: #fff7f5 !important;
    box-shadow: 0 3px 12px rgba(245,75,9,0.12) !important;
    transform: translateY(-1px);
}
.lgx-single-schedule .schedule-info:hover p {
    color: #f54b09 !important;
}

/* Non-repetitive single event — the schedule-row display */
.schedule-row {
    background: #fff;
    border: 1.5px solid #e2e5ea;
    border-radius: 12px;
    padding: 0.85rem 1.1rem;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
    transition: all 0.2s ease;
}
.schedule-row:hover {
    border-color: #f54b09;
    box-shadow: 0 3px 12px rgba(245,75,9,0.10);
}

/* Schedule date text */
.schedule-date {
    flex: 2 1 0;
    font-size: 0.92rem;
    font-weight: 700;
    color: #1e293b;
}

/* Schedule time badge */
.schedule-time .badge {
    background: #f0f4ff !important;
    color: #374151 !important;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.4em 0.85em;
    border-radius: 8px;
    border: 1px solid #e2e5ea;
}

/* ── Professional event date card ── */
.jeb-event-date-card {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    background: #fff;
    border: 1.5px solid #E5E7EB;
    border-radius: 14px;
    padding: 0.875rem 1.25rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    cursor: pointer;
    transition: border-color 0.2s, box-shadow 0.2s;
    width: 100%;
}
.jeb-event-date-card:hover {
    border-color: #f54b09;
    box-shadow: 0 4px 16px rgba(245,75,9,0.12);
}
.jeb-edc-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    min-width: 42px;
    background: linear-gradient(135deg, #f54b09 0%, #ff6b35 100%);
    border-radius: 10px;
    color: #fff;
    font-size: 1rem;
    flex-shrink: 0;
}
.jeb-edc-body {
    flex: 1;
    min-width: 0;
}
.jeb-edc-date {
    font-size: 0.95rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.3;
}
.jeb-edc-time {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.78rem;
    color: #6B7280;
    margin-top: 3px;
}
.jeb-edc-time i {
    color: #f54b09;
    font-size: 0.72rem;
    flex-shrink: 0;
}
.jeb-edc-status {
    flex-shrink: 0;
}

/* Month nav arrows */
.arrow-btn {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: 1.5px solid #e2e5ea;
    background: #fff;
    color: #374151;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    cursor: pointer;
    transition: all 0.15s ease;
}
.arrow-btn:hover:not(:disabled) {
    background: #f54b09;
    color: #fff;
    border-color: #f54b09;
    box-shadow: 0 2px 8px rgba(245,75,9,0.25);
}
.arrow-btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

/* ╔══════════════════════════════════════════════════════╗
   ║  16.2b TICKET PANEL — Compact Spacing Overrides      ║
   ║  Fix wasted whitespace on mobile/tablet/desktop       ║
   ╚══════════════════════════════════════════════════════╝ */

/* ── Global: tighten the accordion content panel padding ── */
.buy-tickets-now-accordion-content {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
}

/* Override theme's generous checked-state padding */
.buy-tickets-now-checkbox:checked + .buy-tickets-now-accordion-label + .buy-tickets-now-accordion-content {
    padding: 0.75rem 0.75rem !important;
    max-height: none !important;
    overflow: visible !important;
}

/* ── Reduce padding inside .tab-content.p-3 areas ── */
.buy-tickets-now-accordion-content .tab-content.p-3 {
    padding: 0.5rem !important;
}

/* ── Date navigation row — inline arrows beside dates on mobile ── */
@media (max-width: 767px) {
    /* Keep arrows + dates on one row on mobile */
    .buy-tickets-now-accordion-content .row.d-flex.gap-2 {
        flex-wrap: nowrap !important;
        gap: 0.5rem !important;
        align-items: center !important;
    }

    /* Arrows: shrink to auto width, don't take col-12 */
    .buy-tickets-now-accordion-content .row.d-flex.gap-2 > .col-12.avatar-xs {
        flex: 0 0 36px !important;
        width: 36px !important;
        max-width: 36px !important;
        padding: 0 !important;
    }

    /* Date scroller: take remaining space */
    .buy-tickets-now-accordion-content .row.d-flex.gap-2 > a.col-12 {
        flex: 1 1 0 !important;
        width: auto !important;
        max-width: none !important;
        padding: 0 !important;
    }

    /* Compact schedule date cards on mobile */
    .lgx-single-schedule .schedule-info,
    .lgx-single-schedule .card.schedule-info {
        padding: 0.45rem 0.6rem !important;
    }
    .lgx-single-schedule .schedule-info p {
        font-size: 0.8rem !important;
    }

    /* Tighter selected date row */
    .single-schedule {
        margin-top: 0.5rem !important;
    }
    .single-schedule .schedule-row {
        padding: 0.6rem 0.85rem !important;
        border-radius: 10px !important;
    }
    .schedule-date {
        font-size: 0.85rem !important;
    }
    .schedule-time .badge {
        font-size: 0.72rem !important;
        padding: 0.3em 0.65em !important;
    }

    /* Professional date card — mobile */
    .jeb-event-date-card {
        padding: 0.75rem 0.9rem !important;
        border-radius: 12px !important;
        gap: 0.65rem !important;
    }
    .jeb-edc-icon {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        font-size: 0.875rem !important;
        border-radius: 8px !important;
    }
    .jeb-edc-date {
        font-size: 0.875rem !important;
    }
    .jeb-edc-time {
        font-size: 0.72rem !important;
    }
    .jeb-edc-status .badge {
        font-size: 0.7rem !important;
    }

    /* d-w-m (daily/weekly/monthly) block — reduce top margin */
    .d-w-m {
        margin-top: 0.5rem !important;
    }

    /* Ticket rows — reduce gap between tickets */
    .buy-tickets-now-accordion-content .list-group-item {
        margin-bottom: 0.5rem !important;
        padding: 0.6rem 0.75rem !important;
    }

    /* ── Ticket row — WRAP on mobile ── */
    /* The row uses d-flex with w-50 + w-25 + w-25 which is too cramped.
       Force it to wrap: title takes full width, qty + total go on row 2 */
    .ticket-title-padding,
    .d-flex.justify-content-between.lh-condensed {
        flex-wrap: wrap !important;
    }

    /* Title + price column — full width on mobile */
    .ticket-title-padding > .w-50,
    .d-flex.justify-content-between.lh-condensed > .w-50 {
        width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 0.45rem;
    }

    /* Qty column — half width on second row */
    .ticket-title-padding > .w-25:nth-child(2),
    .d-flex.justify-content-between.lh-condensed > .w-25:nth-child(2) {
        width: 45% !important;
        flex: 0 0 45% !important;
    }

    /* Total / View Seats column — half width on second row, right-aligned */
    .ticket-title-padding > .w-25:nth-child(3),
    .d-flex.justify-content-between.lh-condensed > .w-25:nth-child(3),
    .ticket-title-padding > .ticket-price.w-25,
    .ticket-title-padding > .viewTickbutton.w-25 {
        width: 50% !important;
        flex: 0 0 50% !important;
        text-align: right !important;
    }

    /* Qty dropdown — proper sizing now it has room */
    .form-select.form-select-lg {
        font-size: 0.88rem !important;
        padding: 0.4rem 2rem 0.4rem 0.65rem !important;
        border-radius: 8px !important;
        min-width: 70px;
        max-width: 120px;
        height: auto !important;
        border-width: 1.5px !important;
    }

    /* Ticket title — readable on mobile */
    .ticket-title {
        font-size: 0.92rem !important;
        font-weight: 700 !important;
    }
    /* Ticket price — prominent on mobile */
    .ticket-price {
        font-size: 0.95rem !important;
        font-weight: 800 !important;
        color: #1e293b !important;
    }
    .ticket-price del {
        font-size: 0.75rem !important;
        color: #9ca3af !important;
        font-weight: 500 !important;
    }
    .ticket-price small {
        font-size: 0.72rem !important;
        font-weight: 600 !important;
        color: #6b7280 !important;
    }

    /* View Seats btn — pill, properly sized now it has room */
    .viewTickbutton .btn-primary.btnSeatMob,
    .btn.btn-primary.btnSeatMob {
        font-size: 0.68rem !important;
        padding: 0.25rem 0.65rem !important;
        margin-top: 0.2rem;
    }

    /* View Seat Chart btn — compact */
    .jeb-seat-chart-btn {
        margin-bottom: 0.5rem !important;
        padding: 0.4rem 0.75rem !important;
        font-size: 0.78rem !important;
    }

    /* Schedule hint — tighter on mobile */
    .jeb-schedule-hint {
        padding: 0.55rem 0.75rem !important;
        margin-bottom: 0.6rem !important;
    }
    .jeb-hint-step {
        width: 26px;
        height: 26px;
        min-width: 26px;
        font-size: 0.72rem;
    }
    .jeb-hint-body strong {
        font-size: 0.8rem;
    }
    .jeb-hint-body span {
        font-size: 0.7rem;
    }

    /* Remove v-scroll max-height on mobile — let content flow naturally */
    .mh-30 {
        max-height: none !important;
    }

    /* Fix dropdown/select being clipped by overflow-x:hidden on .v-scroll */
    .v-scroll {
        overflow-x: visible !important;
        overflow-y: visible !important;
    }

    /* Month nav dropdown — compact */
    .buy-tickets-now-accordion-content .btn.border-white {
        padding: 0.25rem 0.5rem !important;
        margin-bottom: 0.5rem !important;
    }

    /* The .mt-3 on ticket component wrapper */
    .buy-tickets-now-accordion-content .mt-3 {
        margin-top: 0.75rem !important;
    }

    /* Hide Seats / Show Seats button — compact */
    .buy-tickets-now-accordion-content .btn-sm {
        font-size: 0.78rem !important;
        padding: 0.3rem 0.6rem !important;
    }

    /* Seat legend & selected seats boxes — tighter */
    .buy-tickets-now-accordion-content .card {
        margin-bottom: 0.5rem !important;
    }
}

/* ── Ticket Price — Make pricing prominent across all screens ── */
.ticket-price {
    font-size: 1rem !important;
    font-weight: 800 !important;
    color: #1e293b !important;
    letter-spacing: -0.01em;
    line-height: 1.3;
}
.ticket-price del {
    font-size: 0.78rem !important;
    color: #9ca3af !important;
    font-weight: 500 !important;
    text-decoration: line-through;
}
.ticket-price small {
    font-size: 0.72rem !important;
    font-weight: 600 !important;
    color: #6b7280 !important;
}

/* ── Ticket Title — clear and bold ── */
.ticket-title {
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    color: #1e293b !important;
}

/* ╔══════════════════════════════════════════════════════╗
   ║  TICKET CARD REDESIGN — Visual separation & hierarchy ║
   ╚══════════════════════════════════════════════════════╝ */

/* ── Individual ticket cards — elevated card feel ── */
.list-group .list-group-item.mb-3.border-2 {
    border: 1px solid #e5e7eb !important;
    border-left: 4px solid var(--bs-primary, #f54b09) !important;
    border-radius: 10px !important;
    padding: 1rem 1.1rem !important;
    margin-bottom: 0.85rem !important;
    background: #fff;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.list-group .list-group-item.mb-3.border-2:hover {
    border-color: #d1d5db !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.07);
}

/* ── When ticket is selected (quantity > 0) ── */
.list-group .list-group-item.mb-3.border-2:has(.selected-ticket-bg) {
    border-left-color: #16a34a !important;
    background: linear-gradient(135deg, #f0fdf4 0%, #fff 60%) !important;
    box-shadow: 0 2px 10px rgba(22,163,74,0.1);
}

/* Fallback: keep the existing selected-ticket-bg working too */
.selected-ticket-bg {
    background: transparent !important;
    color: inherit !important;
}

/* ── Block headers (VIP, etc.) — bold & prominent ── */
.block-header {
    border: none !important;
    border-left: 4px solid #1e293b !important;
    border-radius: 8px !important;
    padding: 0.75rem 1rem !important;
    margin-top: 1.2rem !important;
    margin-bottom: 0.5rem !important;
    background: #f8fafc !important;
    align-items: center;
}

.block-header strong {
    font-size: 1rem !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #1e293b !important;
}

.block-header .btn-dark {
    font-size: 0.78rem !important;
    font-weight: 600;
    padding: 0.35rem 0.9rem !important;
    border-radius: 6px;
    background-color: #1e293b !important;
    border-color: #1e293b !important;
}

/* ── Nested tickets inside blocks — indented with connecting line ── */
.block-header + ul.list-group {
    margin-left: 1rem;
    padding-left: 1rem;
    border-left: 2px solid #e5e7eb;
    margin-bottom: 0.5rem;
    padding-top: 0.25rem;
}

/* Child ticket cards inside a block — subtler accent */
.block-header + ul.list-group > .list-group-item.mb-3.border-2 {
    border-left: 3px solid #94a3b8 !important;
    background: #fafbfc !important;
    margin-bottom: 0.6rem !important;
    border-radius: 8px !important;
}

.block-header + ul.list-group > .list-group-item.mb-3.border-2:hover {
    border-left-color: var(--bs-primary, #f54b09) !important;
}

/* Selected child ticket inside a block */
.block-header + ul.list-group > .list-group-item.mb-3.border-2:has(.selected-ticket-bg) {
    border-left-color: #16a34a !important;
    background: linear-gradient(135deg, #f0fdf4 0%, #fafbfc 60%) !important;
}

/* Dark mode: nested block tickets */
[data-bs-theme="dark"] .block-header + ul.list-group {
    border-left-color: #374151;
}

[data-bs-theme="dark"] .block-header + ul.list-group > .list-group-item.mb-3.border-2 {
    border-left-color: #64748b !important;
    background: #22272c !important;
}

[data-bs-theme="dark"] .block-header + ul.list-group > .list-group-item.mb-3.border-2:hover {
    border-left-color: var(--bs-primary, #f54b09) !important;
}

[data-bs-theme="dark"] .block-header + ul.list-group > .list-group-item.mb-3.border-2:has(.selected-ticket-bg) {
    border-left-color: #22c55e !important;
    background: linear-gradient(135deg, #14291e 0%, #22272c 60%) !important;
}

/* ── Promo code row — subtle, not competing ── */
.list-group-item .input-group {
    max-width: 260px;
}

/* ── VIEW SEATS button — outlined style ── */
.list-group-item .btn-outline-primary,
.list-group-item a.btn[class*="seat"] {
    font-size: 0.78rem !important;
    font-weight: 600;
    border-radius: 6px;
    padding: 0.35rem 0.8rem !important;
}

/* ── Quantity display (Qty: 0) — muted when zero ── */
.list-group-item .w-25 p:has(small) {
    font-size: 0.82rem;
    color: #9ca3af;
}

/* ── Subtotal per ticket — right-aligned, prominent ── */
.ticket-title-padding > .w-25:last-child {
    text-align: right;
}

/* ── Dark mode overrides ── */
[data-bs-theme="dark"] .list-group .list-group-item.mb-3.border-2 {
    background: #1e2328 !important;
    border-color: #374151 !important;
    border-left-color: var(--bs-primary, #f54b09) !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.2);
}

[data-bs-theme="dark"] .list-group .list-group-item.mb-3.border-2:hover {
    border-color: #4b5563 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

[data-bs-theme="dark"] .list-group .list-group-item.mb-3.border-2:has(.selected-ticket-bg) {
    border-left-color: #22c55e !important;
    background: linear-gradient(135deg, #14291e 0%, #1e2328 60%) !important;
}

[data-bs-theme="dark"] .block-header {
    background: #262b31 !important;
    border-left-color: #e5e7eb !important;
}

[data-bs-theme="dark"] .block-header strong {
    color: #f3f4f6 !important;
}

[data-bs-theme="dark"] .ticket-title {
    color: #f3f4f6 !important;
}

[data-bs-theme="dark"] .ticket-price {
    color: #f3f4f6 !important;
}

/* ── Add-Ons Header — ensure full visibility ── */
.buy-tickets-now-accordion-content .col-12 > .h6,
.buy-tickets-now-accordion-content .col-12 > p.h6 {
    font-size: 0.95rem !important;
    font-weight: 800 !important;
    color: #1e293b !important;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding-left: 0.25rem;
    margin-top: 0.75rem !important;
    margin-bottom: 0.6rem !important;
    border-left: 3px solid #f54b09;
    padding-left: 0.6rem;
}

/* ── Qty dropdown — ensure it's not clipped ── */
.v-scroll {
    overflow: visible !important;
}
.tab-content.v-scroll.mh-30 {
    overflow: visible !important;
    max-height: none !important;
}
/* Only apply scroll behavior when content is long on desktop */
@media (min-width: 992px) {
    .tab-content.v-scroll.mh-30 {
        overflow-y: auto !important;
        overflow-x: visible !important;
        max-height: 42rem !important;
    }
}

/* ── Tablet (768px–991px) — still compact but more room ── */
@media (min-width: 768px) and (max-width: 991px) {
    .buy-tickets-now-accordion-content {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    .buy-tickets-now-accordion-content .tab-content.p-3 {
        padding: 0.75rem !important;
    }

    .single-schedule .schedule-row {
        padding: 0.7rem 1rem !important;
    }

    .buy-tickets-now-accordion-content .list-group-item {
        margin-bottom: 0.6rem !important;
    }

    .ticket-title {
        font-size: 0.95rem !important;
    }
    .ticket-price {
        font-size: 0.95rem !important;
    }

    /* Allow overflow for dropdowns on tablet too */
    .v-scroll {
        overflow: visible !important;
    }
    .tab-content.v-scroll.mh-30 {
        overflow: visible !important;
        max-height: none !important;
    }
}

/* ── Desktop (992px+) — clean up minor gaps ── */
@media (min-width: 992px) {
    .buy-tickets-now-accordion-content .tab-content.p-3 {
        padding: 0.75rem 1rem !important;
    }

    .single-schedule {
        margin-top: 0.75rem !important;
    }
}

/* ╔══════════════════════════════════════════════════════╗
   ║  16.3  VIEW SEAT CHART BUTTON                        ║
   ╚══════════════════════════════════════════════════════╝ */
.jeb-seat-chart-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: #fff;
    border: 1.5px solid #e2e5ea;
    border-radius: 10px;
    padding: 0.5rem 1rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-bottom: 1rem;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}
.jeb-seat-chart-btn i {
    color: #f54b09;
    font-size: 0.85rem;
}
.jeb-seat-chart-btn:hover {
    background: #f54b09;
    color: #fff;
    border-color: #f54b09;
    box-shadow: 0 4px 14px rgba(245,75,9,0.25);
    transform: translateY(-1px);
}
.jeb-seat-chart-btn:hover i {
    color: #fff;
}

/* ╔══════════════════════════════════════════════════════╗
   ║  16.4  ADMIN / ORGANISER PANEL                       ║
   ╚══════════════════════════════════════════════════════╝ */
.jeb-admin-panel {
    background: #fff;
    border: 1.5px solid #e2e5ea;
    border-radius: 14px;
    margin-bottom: 1.25rem;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

/* Panel header (info strip) */
.jeb-admin-panel__header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 1rem;
    background: linear-gradient(135deg, #f8f9fb 0%, #f0f2f5 100%);
    border-bottom: 1px solid #e9ecef;
    font-size: 0.72rem;
    font-weight: 600;
    color: #6b7280;
    letter-spacing: 0.02em;
}
.jeb-admin-panel__header i {
    font-size: 0.7rem;
    color: #9ca3af;
}

/* Panel body — two-column grid */
.jeb-admin-panel__body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}
.jeb-admin-panel__body > .jeb-admin-panel__col:first-child {
    border-right: 1px solid #e9ecef;
}

/* Each column */
.jeb-admin-panel__col {
    padding: 1rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Field group */
.jeb-admin-field {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

/* Field labels */
.jeb-admin-field__label {
    font-size: 0.72rem;
    font-weight: 700;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin: 0;
}
.jeb-admin-field__label i {
    font-size: 0.65rem;
    color: #9ca3af;
}

/* Customer search select override */
.jeb-customer-select .vs__dropdown-toggle {
    border: 1.5px solid #e2e5ea !important;
    border-radius: 10px !important;
    background: #f9fafb !important;
    padding: 0.4rem 0.6rem !important;
    min-height: 40px;
    transition: border-color 0.2s ease;
}
.jeb-customer-select .vs__dropdown-toggle:hover,
.jeb-customer-select .vs__dropdown-toggle:focus-within {
    border-color: #f54b09 !important;
    box-shadow: 0 0 0 3px rgba(245,75,9,0.08) !important;
}
.jeb-customer-select .vs__search::placeholder {
    color: #9ca3af;
    font-size: 0.82rem;
}
.jeb-customer-select .vs__selected {
    font-size: 0.82rem;
    font-weight: 600;
    color: #1e293b;
}

/* Admin input */
.jeb-admin-input {
    border: 1.5px solid #e2e5ea !important;
    border-radius: 10px !important;
    background: #f9fafb !important;
    padding: 0.5rem 0.75rem !important;
    font-size: 0.82rem !important;
    color: #1e293b !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.jeb-admin-input:focus {
    border-color: #f54b09 !important;
    box-shadow: 0 0 0 3px rgba(245,75,9,0.08) !important;
    outline: none;
}

/* Create Attendee button */
.jeb-create-attendee-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: #1e293b;
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 0.45rem 0.9rem;
    font-size: 0.76rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    width: fit-content;
}
.jeb-create-attendee-btn i {
    font-size: 0.72rem;
}
.jeb-create-attendee-btn:hover {
    background: #f54b09;
    box-shadow: 0 3px 10px rgba(245,75,9,0.25);
    transform: translateY(-1px);
}

/* ╔══════════════════════════════════════════════════════╗
   ║  16.5  COMPLIMENTARY TOGGLE (Custom)                  ║
   ╚══════════════════════════════════════════════════════╝ */
.jeb-toggle-row {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}
.jeb-toggle-row__label {
    font-size: 0.82rem;
    font-weight: 600;
    color: #374151;
}

/* Custom toggle switch */
.jeb-toggle {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
}
.jeb-toggle__input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}
.jeb-toggle__slider {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: #d1d5db;
    border-radius: 24px;
    cursor: pointer;
    transition: background 0.25s ease;
}
.jeb-toggle__slider::before {
    content: '';
    position: absolute;
    width: 18px;
    height: 18px;
    left: 3px;
    bottom: 3px;
    background: #fff;
    border-radius: 50%;
    transition: transform 0.25s ease;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}
.jeb-toggle__input:checked + .jeb-toggle__slider {
    background: linear-gradient(135deg, #f54b09 0%, #ff6b35 100%);
}
.jeb-toggle__input:checked + .jeb-toggle__slider::before {
    transform: translateX(20px);
}

/* ╔══════════════════════════════════════════════════════╗
   ║  16.6  CHECKOUT TIMER                                ║
   ╚══════════════════════════════════════════════════════╝ */
.alert-primary {
    background: linear-gradient(135deg, #fff7f5 0%, #fef3f0 100%) !important;
    border: 1.5px solid #fed7c7 !important;
    border-radius: 12px !important;
    color: #1e293b !important;
    padding: 0.7rem 1rem !important;
}

/* ╔══════════════════════════════════════════════════════╗
   ║  16.7  RESPONSIVE                                    ║
   ╚══════════════════════════════════════════════════════╝ */
@media (max-width: 767.98px) {
    .jeb-admin-panel__body {
        grid-template-columns: 1fr;
    }
    .jeb-admin-panel__body > .jeb-admin-panel__col:first-child {
        border-right: none;
        border-bottom: 1px solid #e9ecef;
    }
    .jeb-admin-panel__col {
        padding: 0.85rem 1rem;
    }
    .jeb-schedule-hint {
        padding: 0.55rem 0.75rem;
    }
    .schedule-date {
        font-size: 0.84rem;
    }
    .schedule-time .badge {
        font-size: 0.72rem;
    }
}


/* ========================================================================
   SECTION 15: HOMEPAGE — JEB Design System
   Eventbrite-quality homepage styling
   ======================================================================== */

/* ─── 15.1 HERO BANNER ─── */
.jeb-hero {
    position: relative;
    overflow: hidden;
    background: var(--color-gray-900);
    margin-top: -80px;
    border-radius: 0 0 20px 20px;
}

.jeb-hero__slider-wrap {
    position: relative;
}

.jeb-hero__slide {
    width: 100%;
    height: 540px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.jeb-hero__img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: top center;
    will-change: transform;
    contain: layout style;
}

/* Subtle gradient overlay for polish */
.jeb-hero__slide::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 120px;
    background: linear-gradient(to top, rgba(0,0,0,0.35) 0%, transparent 100%);
    pointer-events: none;
    z-index: 2;
}

/* Placeholder hero when no banners */
.jeb-hero__slide--placeholder {
    min-height: 360px;
    max-height: 420px;
    background: linear-gradient(135deg, #1a1a2e 0%, #2d1b4e 40%, var(--color-primary) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
}

.jeb-hero__slide--placeholder::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 70% 30%, rgba(245,75,9,0.2) 0%, transparent 60%);
    pointer-events: none;
}

.jeb-hero__slide--placeholder::after {
    display: none;
}

.jeb-hero__placeholder-content {
    position: relative;
    z-index: 3;
    padding: 2rem;
}

.jeb-hero__placeholder-content h1 {
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--color-white);
    margin-bottom: 0.5rem;
    text-shadow: 0 2px 20px rgba(0,0,0,0.2);
    letter-spacing: -0.02em;
}

.jeb-hero__placeholder-content p {
    font-size: 1.1rem;
    color: rgba(255,255,255,0.8);
    margin-bottom: 1.75rem;
    font-weight: 400;
}

/* Slider Navigation */
.jeb-hero__nav {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    padding: 0 1rem;
    z-index: 10;
    pointer-events: none;
}

.jeb-hero__nav-btn {
    pointer-events: auto;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    background: rgba(255,255,255,0.85);
    backdrop-filter: blur(10px);
    border: none;
    color: var(--color-gray-800);
    font-size: 0.85rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all var(--transition-normal);
    box-shadow: 0 2px 12px rgba(0,0,0,0.15);
    opacity: 0.7;
}

.jeb-hero:hover .jeb-hero__nav-btn {
    opacity: 1;
}

.jeb-hero__nav-btn:hover {
    background: var(--color-white);
    transform: scale(1.1);
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
}

/* ─── 15.2 SECTIONS ─── */
.jeb-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.jeb-section {
    padding: 4rem 0;
    background: var(--color-white);
}

.jeb-section--accent {
    background: linear-gradient(135deg, var(--color-primary) 0%, #d63d00 100%);
}

.jeb-section--muted {
    background: var(--color-gray-50);
}

.jeb-section--categories {
    background: var(--color-gray-50);
    padding-bottom: 3rem;
}

/* Section Header */
.jeb-section__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 2rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.jeb-section__title {
    font-size: 1.75rem;
    font-weight: 800;
    color: var(--color-gray-900);
    margin: 0 0 0.25rem 0;
    display: flex;
    align-items: center;
    gap: 0.625rem;
    line-height: 1.3;
}

.jeb-section__title--light {
    color: var(--color-white);
}

.jeb-section__icon {
    font-size: 1.25rem;
}

.jeb-section__icon--gold { color: #f59e0b; }
.jeb-section__icon--blue { color: #3b82f6; }
.jeb-section__icon--gray { color: #9ca3af; }
.jeb-section__icon--purple { color: #8b5cf6; }

.jeb-section--accent .jeb-section__icon {
    color: rgba(255,255,255,0.85);
}

.jeb-section__subtitle {
    font-size: var(--font-size-base);
    color: var(--color-gray-500);
    margin: 0;
    font-weight: 400;
}

.jeb-section__subtitle--light {
    color: rgba(255,255,255,0.75);
}

/* ─── 15.3 BUTTONS ─── */
.jeb-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.5rem;
    border-radius: var(--radius-full);
    font-weight: 600;
    font-size: var(--font-size-sm);
    text-decoration: none;
    transition: all var(--transition-normal);
    cursor: pointer;
    border: 2px solid transparent;
    line-height: 1.4;
    white-space: nowrap;
}

.jeb-btn--primary {
    background: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
}

.jeb-btn--primary:hover {
    background: var(--color-primary-hover);
    border-color: var(--color-primary-hover);
    color: var(--color-white);
    transform: translateY(-1px);
    box-shadow: var(--shadow-primary);
}

.jeb-btn--outline {
    background: transparent;
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.jeb-btn--outline:hover {
    background: var(--color-primary);
    color: var(--color-white);
    transform: translateY(-1px);
}

.jeb-btn--outline-light {
    background: transparent;
    color: var(--color-white);
    border-color: rgba(255,255,255,0.6);
}

.jeb-btn--outline-light:hover {
    background: var(--color-white);
    color: var(--color-primary);
    border-color: var(--color-white);
}

.jeb-btn--white {
    background: var(--color-white);
    color: var(--color-primary);
    border-color: var(--color-white);
}

.jeb-btn--white:hover {
    background: var(--color-gray-100);
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.jeb-btn--outline-white {
    background: transparent;
    color: var(--color-white);
    border-color: rgba(255,255,255,0.5);
}

.jeb-btn--outline-white:hover {
    background: rgba(255,255,255,0.15);
    border-color: var(--color-white);
    color: var(--color-white);
}

.jeb-btn--sm { padding: 0.375rem 1rem; font-size: var(--font-size-xs); }
.jeb-btn--lg { padding: 0.8rem 2rem; font-size: var(--font-size-md); }

/* ─── 15.4 EVENT CARD GRID ─── */
.jeb-event-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

@media (max-width: 1100px) {
    .jeb-event-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px) {
    .jeb-event-grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
}

@media (max-width: 480px) {
    .jeb-event-grid { grid-template-columns: 1fr; }
}

/* Single-row variant: clip past-events grid to its first row at every breakpoint */
.jeb-event-grid--single-row {
    grid-auto-rows: 0;
    grid-template-rows: auto;
    overflow: hidden;
}
.jeb-event-grid--single-row > * {
    grid-row: 1;
}

/* ─── 15.5 EVENT CARD ─── */
.jeb-event-card {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: all var(--transition-normal);
    cursor: pointer;
    border: 1px solid var(--color-gray-200);
    position: relative;
}

.jeb-event-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-xl);
    border-color: transparent;
}

/* Card on accent section */
.jeb-section--accent .jeb-event-card {
    border-color: transparent;
    box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}

.jeb-section--accent .jeb-event-card:hover {
    box-shadow: 0 12px 40px rgba(0,0,0,0.25);
}

/* Card Image */
.jeb-event-card__image-wrap {
    position: relative;
    overflow: hidden;
    background: var(--color-gray-100);
    height: 220px;
    flex-shrink: 0;
}

.jeb-event-card__image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.jeb-event-card:hover .jeb-event-card__image {
    transform: scale(1.08);
}

/* Hover overlay */
.jeb-event-card__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background var(--transition-normal);
}

.jeb-event-card:hover .jeb-event-card__overlay {
    background: rgba(0,0,0,0.3);
}

.jeb-event-card__quick-view {
    opacity: 0;
    transform: translateY(10px);
    transition: all var(--transition-normal);
    background: var(--color-white);
    color: var(--color-gray-900);
    padding: 0.5rem 1.25rem;
    border-radius: var(--radius-full);
    font-size: var(--font-size-sm);
    font-weight: 600;
    box-shadow: var(--shadow-lg);
}

.jeb-event-card:hover .jeb-event-card__quick-view {
    opacity: 1;
    transform: translateY(0);
}

/* Date Badge */
.jeb-event-card__date {
    position: absolute;
    top: 0.75rem;
    left: 0.75rem;
    background: var(--color-white);
    border-radius: var(--radius-md);
    padding: 0.25rem 0.5rem;
    text-align: center;
    line-height: 1;
    box-shadow: var(--shadow-md);
    z-index: 2;
    display: flex;
    flex-direction: column;
    min-width: 44px;
}

.jeb-event-card__date-day {
    font-size: 1.125rem;
    font-weight: 800;
    color: var(--color-primary);
    display: block;
}

.jeb-event-card__date-month {
    font-size: 0.625rem;
    font-weight: 700;
    color: var(--color-gray-500);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: block;
}

/* Status & Feature Badges */
.jeb-event-card__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.5rem;
    border-radius: var(--radius-full);
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-white);
    position: absolute;
    z-index: 2;
}

.jeb-event-card__badge--danger {
    background: var(--color-error);
    bottom: 0.75rem;
    left: 0.75rem;
}

.jeb-event-card__badge--status {
    bottom: 0.75rem;
    left: 0.75rem;
}

.jeb-event-card__badge--success {
    background: var(--color-success);
}

.jeb-event-card__badge--warning {
    background: var(--color-warning);
}

.jeb-event-card__badge--secondary {
    background: var(--color-gray-600);
}

.jeb-event-card__badge--info {
    background: var(--color-info);
}

.jeb-event-card__badges-right {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    z-index: 2;
}

.jeb-event-card__badges-right .jeb-event-card__badge {
    position: static;
    font-size: 0.6rem;
    padding: 0.2rem 0.4rem;
}

/* Card Body */
.jeb-event-card__body {
    padding: 1rem 1rem 0.5rem;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.jeb-event-card__category {
    display: inline-block;
    font-size: var(--font-size-xs);
    font-weight: 600;
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.375rem;
}

.jeb-event-card__title {
    font-size: var(--font-size-base);
    font-weight: 700;
    color: var(--color-gray-900);
    margin: 0 0 0.5rem;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.jeb-event-card__location {
    font-size: var(--font-size-xs);
    color: var(--color-gray-500);
    margin: 0;
    display: flex;
    align-items: flex-start;
    gap: 0.375rem;
    line-height: 1.4;
    flex: 1;
}

.jeb-event-card__location i {
    color: var(--color-primary);
    margin-top: 0.125rem;
    flex-shrink: 0;
}

/* Card Footer */
.jeb-event-card__footer {
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--color-gray-100);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.jeb-event-card__price {
    display: flex;
    flex-direction: column;
}

.jeb-event-card__price-label {
    font-size: 0.625rem;
    color: var(--color-gray-400);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 600;
}

.jeb-event-card__price-value {
    font-size: var(--font-size-md);
    font-weight: 800;
    color: var(--color-gray-900);
    line-height: 1.2;
}

.jeb-event-card__price-value small {
    font-size: 0.625rem;
    font-weight: 500;
    color: var(--color-gray-400);
}

.jeb-event-card__price-original {
    text-decoration: line-through;
    color: var(--color-gray-400);
    font-size: var(--font-size-xs);
    font-weight: 500;
    margin-left: 0.25rem;
}

.jeb-event-card__book-btn {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 1rem;
    background: var(--color-primary);
    color: var(--color-white);
    border-radius: var(--radius-full);
    font-size: var(--font-size-xs);
    font-weight: 700;
    text-decoration: none;
    transition: all var(--transition-fast);
    white-space: nowrap;
}

.jeb-event-card__book-btn:hover {
    background: var(--color-primary-hover);
    color: var(--color-white);
    transform: scale(1.05);
    box-shadow: var(--shadow-primary);
}

/* Sale Timer Strip */
.jeb-event-card__sale-timer {
    background: linear-gradient(90deg, #fef3c7, #fde68a);
    color: #92400e;
    padding: 0.375rem 1rem;
    font-size: 0.6875rem;
    font-weight: 700;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
}

.jeb-event-card__sale-timer i {
    color: #f59e0b;
    animation: jeb-pulse 1.5s ease-in-out infinite;
}

@keyframes jeb-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* ─── 15.6 EMPTY STATES ─── */
.jeb-empty-state {
    text-align: center;
    padding: 3rem 1rem;
    background: var(--color-gray-50);
    border-radius: var(--radius-xl);
    border: 2px dashed var(--color-gray-200);
}

.jeb-empty-state--light {
    background: rgba(255,255,255,0.1);
    border-color: rgba(255,255,255,0.2);
}

.jeb-empty-state--light .jeb-empty-state__icon {
    color: rgba(255,255,255,0.5);
}

.jeb-empty-state--light .jeb-empty-state__text {
    color: rgba(255,255,255,0.7);
}

.jeb-empty-state__icon {
    font-size: 2.5rem;
    color: var(--color-gray-300);
    margin-bottom: 1rem;
    display: block;
}

.jeb-empty-state__text {
    font-size: var(--font-size-base);
    color: var(--color-gray-500);
    margin-bottom: 1.25rem;
    font-weight: 500;
}

/* ─── 15.7 CATEGORY CARDS (matches browse page) ─── */

/* Horizontal scroll container */
.jeb-cat-scroll {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 8px;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: var(--color-gray-200) transparent;
}

.jeb-cat-scroll::-webkit-scrollbar {
    height: 4px;
}

.jeb-cat-scroll::-webkit-scrollbar-track {
    background: transparent;
}

.jeb-cat-scroll::-webkit-scrollbar-thumb {
    background: var(--color-gray-200);
    border-radius: 4px;
}

/* ── Category Card ── */
.jeb-cat-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    padding: 1rem 1.25rem;
    border-radius: var(--radius-lg);
    background: var(--color-white);
    border: 1px solid var(--color-gray-200);
    min-width: 120px;
    max-width: 140px;
    flex-shrink: 0;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    cursor: pointer;
}

.jeb-cat-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 20px -6px rgba(0, 0, 0, 0.12);
    border-color: var(--color-primary);
    text-decoration: none;
}

/* ── Icon ── */
.jeb-cat-card__icon {
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.625rem;
    position: relative;
}

.jeb-cat-card__icon img {
    width: 52px;
    height: 52px;
    object-fit: contain;
}

.jeb-cat-card__icon i {
    font-size: 1.75rem;
    color: var(--color-gray-400);
    transition: color 0.2s ease;
}

.jeb-cat-card:hover .jeb-cat-card__icon i {
    color: var(--color-primary);
}

/* Fallback icon when image fails to load */
.jeb-cat-card__fallback {
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-gray-100);
    border-radius: var(--radius-lg);
    color: var(--color-gray-400);
    font-size: 1.5rem;
}

.jeb-cat-card:hover .jeb-cat-card__fallback {
    color: var(--color-primary);
    background: var(--color-primary-subtle, rgba(245, 75, 9, 0.06));
}

/* ── Name ── */
.jeb-cat-card__name {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--color-gray-800);
    text-align: center;
    line-height: 1.3;
    transition: color 0.2s ease;
    word-break: break-word;
    max-width: 100%;
}

.jeb-cat-card:hover .jeb-cat-card__name {
    color: var(--color-primary);
}

/* ── Event count ── */
.jeb-cat-card__count {
    font-size: 0.6875rem;
    font-weight: 500;
    color: var(--color-gray-400);
    margin-top: 0.125rem;
}

/* ── Mobile tweaks ── */
@media (max-width: 480px) {
    .jeb-cat-scroll {
        gap: 8px;
    }
    .jeb-cat-card {
        min-width: 100px;
        max-width: 120px;
        padding: 0.75rem 0.75rem;
    }
    .jeb-cat-card__icon {
        width: 44px;
        height: 44px;
    }
    .jeb-cat-card__icon img {
        width: 44px;
        height: 44px;
    }
    .jeb-cat-card__name {
        font-size: 0.75rem;
    }
}

/* ── Desktop: center categories if they don't overflow ── */
@media (min-width: 769px) {
    .jeb-cat-scroll {
        justify-content: center;
        flex-wrap: wrap;
        overflow-x: visible;
        gap: 16px;
    }
    .jeb-cat-card {
        min-width: 130px;
        max-width: 150px;
    }
}

/* ─── 15.8 CTA SECTION ─── */
.jeb-cta {
    background: linear-gradient(135deg, var(--color-gray-900) 0%, #1a1a2e 100%);
    padding: 4rem 0;
}

.jeb-cta__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    flex-wrap: wrap;
}

.jeb-cta__content {
    flex: 1;
    min-width: 300px;
}

.jeb-cta__title {
    font-size: 2rem;
    font-weight: 800;
    color: var(--color-white);
    margin: 0 0 0.5rem;
    line-height: 1.2;
}

.jeb-cta__text {
    font-size: var(--font-size-md);
    color: rgba(255,255,255,0.7);
    margin: 0;
    max-width: 500px;
}

.jeb-cta__actions {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

/* ─── 15.9 AI-POWERED PLATFORM STRIP ─── */
.jeb-ai-strip {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
    border-top: none;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    padding: 1.15rem 0;
    margin-top: 0;
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
}
/* Subtle mesh glow */
.jeb-ai-strip::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 15% 50%, rgba(6,182,212,0.08) 0%, transparent 60%),
                radial-gradient(ellipse at 85% 50%, rgba(245,75,9,0.06) 0%, transparent 60%);
    pointer-events: none;
}

.jeb-ai-strip__grid {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    flex-wrap: wrap;
    position: relative;
    z-index: 1;
}

.jeb-ai-strip__item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1 1 180px;
    min-width: 160px;
}

/* Icon — glowing pill */
.jeb-ai-strip__icon {
    width: 42px;
    height: 42px;
    border-radius: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.05rem;
    flex-shrink: 0;
    position: relative;
    transition: transform 0.2s ease;
}
.jeb-ai-strip__item:hover .jeb-ai-strip__icon {
    transform: scale(1.08);
}

/* Icon colour variants */
.jeb-ai-strip__icon--cyan {
    background: rgba(6,182,212,0.15);
    color: #22d3ee;
    box-shadow: 0 0 12px rgba(6,182,212,0.15);
}
.jeb-ai-strip__icon--orange {
    background: rgba(245,75,9,0.15);
    color: #f97316;
    box-shadow: 0 0 12px rgba(245,75,9,0.15);
}
.jeb-ai-strip__icon--violet {
    background: rgba(139,92,246,0.15);
    color: #a78bfa;
    box-shadow: 0 0 12px rgba(139,92,246,0.15);
}
.jeb-ai-strip__icon--emerald {
    background: rgba(16,185,129,0.15);
    color: #34d399;
    box-shadow: 0 0 12px rgba(16,185,129,0.15);
}
.jeb-ai-strip__icon--amber {
    background: rgba(245,158,11,0.15);
    color: #fbbf24;
    box-shadow: 0 0 12px rgba(245,158,11,0.15);
}

/* Text */
.jeb-ai-strip__text {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}
.jeb-ai-strip__text strong {
    font-size: 0.88rem;
    font-weight: 700;
    color: #fff;
}
.jeb-ai-strip__text span {
    font-size: 0.72rem;
    color: rgba(255,255,255,0.45);
    font-weight: 500;
}

/* Tablet — 2-column grid */
@media (max-width: 768px) {
    .jeb-ai-strip { padding: 1rem 0 0.8rem; }
    .jeb-ai-strip__grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.65rem;
    }
    .jeb-ai-strip__item { min-width: 0; flex: unset; gap: 0.55rem; }
    .jeb-ai-strip__icon { width: 36px; height: 36px; border-radius: 9px; font-size: 0.95rem; }
    .jeb-ai-strip__text strong { font-size: 0.78rem; }
    .jeb-ai-strip__text span { font-size: 0.65rem; }
}

/* Small mobile — single column */
@media (max-width: 380px) {
    .jeb-ai-strip__grid { grid-template-columns: 1fr; }
}

/* ─── 15.10 STATS COUNTER — Social Proof Strip ─── */
.jeb-stats {
    background: linear-gradient(160deg, #0f172a 0%, #1e293b 50%, #0f172a 100%);
    padding: 4rem 0 3rem;
    overflow: hidden;
    position: relative;
}
/* Subtle grain texture overlay */
.jeb-stats::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 20% 80%, rgba(245,75,9,0.06) 0%, transparent 50%),
                radial-gradient(circle at 80% 20%, rgba(245,75,9,0.04) 0%, transparent 50%);
    pointer-events: none;
}

/* Section header */
.jeb-stats__header {
    text-align: center;
    margin-bottom: 2.5rem;
}
.jeb-stats__tagline {
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #f54b09;
    margin-bottom: 0.5rem;
}
.jeb-stats__heading {
    font-size: 1.75rem;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.01em;
    line-height: 1.25;
}

.jeb-stats__grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 1.5rem;
    text-align: center;
}

.jeb-stats__item {
    position: relative;
    padding: 1rem 0.5rem;
    border-radius: 12px;
    transition: transform 0.2s ease, background 0.2s ease;
}
.jeb-stats__item:hover {
    transform: translateY(-3px);
    background: rgba(255,255,255,0.04);
}

.jeb-stats__icon {
    font-size: 1.35rem;
    color: #f54b09;
    margin-bottom: 0.65rem;
}

.jeb-stats__value {
    display: flex;
    align-items: baseline;
    justify-content: center;
    white-space: nowrap;
    gap: 0;
}

.jeb-stats__number {
    font-size: 2.5rem;
    font-weight: 800;
    color: #fff;
    line-height: 1;
    letter-spacing: -0.02em;
}

.jeb-stats__suffix {
    font-size: 1.6rem;
    font-weight: 700;
    color: #f54b09;
}

.jeb-stats__label {
    font-size: 0.82rem;
    color: rgba(255,255,255,0.55);
    margin-top: 0.4rem;
    font-weight: 500;
    letter-spacing: 0.02em;
}

/* Trust badges row */
.jeb-stats__trust {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 1.5rem;
    margin-top: 2.5rem;
    padding-top: 1.75rem;
    border-top: 1px solid rgba(255,255,255,0.08);
}
.jeb-stats__trust span {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: rgba(255,255,255,0.5);
    letter-spacing: 0.02em;
}
.jeb-stats__trust span i {
    color: #f54b09;
    font-size: 0.85rem;
}

/* Tablet: 3 columns */
@media (max-width: 991px) {
    .jeb-stats__grid { grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
    .jeb-stats__number { font-size: 2.1rem; }
    .jeb-stats__suffix { font-size: 1.4rem; }
    .jeb-stats__heading { font-size: 1.5rem; }
}

/* Mobile: 2 columns */
@media (max-width: 575px) {
    .jeb-stats { padding: 2.5rem 0 2rem; }
    .jeb-stats__header { margin-bottom: 1.75rem; }
    .jeb-stats__heading { font-size: 1.25rem; }
    .jeb-stats__tagline { font-size: 0.7rem; }
    .jeb-stats__grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
    .jeb-stats__item { padding: 0.75rem 0.25rem; }
    .jeb-stats__number { font-size: 1.75rem; }
    .jeb-stats__suffix { font-size: 1.2rem; }
    .jeb-stats__label { font-size: 0.72rem; }
    .jeb-stats__icon { font-size: 1.1rem; margin-bottom: 0.4rem; }
    .jeb-stats__trust { gap: 0.75rem 1.25rem; margin-top: 1.5rem; padding-top: 1.25rem; }
    .jeb-stats__trust span { font-size: 0.68rem; }
}

/* ─── 15.11 WHY CHOOSE US ─── */
/* ─── 15.11 ORGANISER POWER TOOLS SECTION ─── */
.jeb-organiser-section {
    background: #f8f9fc;
    padding: 5rem 0 3.5rem;
}

/* Header */
.jeb-organiser-section__header {
    text-align: center;
    max-width: 640px;
    margin: 0 auto 3.5rem;
}

.jeb-organiser-section__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    background: linear-gradient(135deg, #fff3ed, #ffe8da);
    color: var(--color-primary, #f54b09);
    font-size: 0.8rem;
    font-weight: 700;
    padding: 6px 14px;
    border-radius: 999px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 1rem;
}

.jeb-organiser-section__title {
    font-size: clamp(1.75rem, 3.5vw, 2.5rem);
    font-weight: 800;
    color: #1a1a2e;
    line-height: 1.2;
    margin-bottom: 1rem;
}

.jeb-organiser-section__title-highlight {
    background: linear-gradient(135deg, var(--color-primary, #f54b09) 0%, #ff8c42 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.jeb-organiser-section__subtitle {
    font-size: 1rem;
    color: #6b7280;
    line-height: 1.7;
    margin: 0;
}

/* 3-pillar top row */
.jeb-organiser-pillars {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
    margin-bottom: 1.25rem;
}

.jeb-organiser-pillar {
    border-radius: 20px;
    padding: 2rem 1.75rem;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.jeb-organiser-pillar--dark {
    background: linear-gradient(160deg, #1a1a2e 0%, #16213e 60%, #0f3460 100%);
    border: none;
}

.jeb-organiser-pillar--light {
    background: #fff;
    border: 1px solid #f1f3f4;
}

.jeb-organiser-pillar__icon {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: rgba(245, 75, 9, 0.15);
    color: #ff6b35;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    margin-bottom: 1.25rem;
    border: 1px solid rgba(245, 75, 9, 0.2);
    flex-shrink: 0;
}

.jeb-organiser-pillar__icon--blue {
    background: linear-gradient(135deg, #eff6ff, #dbeafe);
    color: #2563eb;
    border-color: #dbeafe;
}

.jeb-organiser-pillar__icon--orange {
    background: linear-gradient(135deg, #fff7ed, #ffedd5);
    color: #ea580c;
    border-color: #ffedd5;
}

.jeb-organiser-pillar__label {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 0.4rem;
}

.jeb-organiser-pillar--dark .jeb-organiser-pillar__label { color: #ff8c42; }
.jeb-organiser-pillar--light .jeb-organiser-pillar__label { color: var(--color-primary, #f54b09); }

.jeb-organiser-pillar__title {
    font-size: 1.15rem;
    font-weight: 800;
    margin-bottom: 0.85rem;
    line-height: 1.25;
}

.jeb-organiser-pillar--dark .jeb-organiser-pillar__title { color: #fff; }
.jeb-organiser-pillar--light .jeb-organiser-pillar__title { color: #1a1a2e; }

.jeb-organiser-pillar__desc {
    font-size: 0.85rem;
    line-height: 1.7;
    margin-bottom: 1.25rem;
}

.jeb-organiser-pillar--dark .jeb-organiser-pillar__desc { color: rgba(255,255,255,0.68); }
.jeb-organiser-pillar--light .jeb-organiser-pillar__desc { color: #6b7280; }

.jeb-organiser-pillar__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.jeb-organiser-pillar__list li {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    font-size: 0.82rem;
}

.jeb-organiser-pillar--dark .jeb-organiser-pillar__list li { color: rgba(255,255,255,0.82); }
.jeb-organiser-pillar--light .jeb-organiser-pillar__list li { color: #374151; }

.jeb-organiser-pillar__list li i {
    font-size: 0.8rem;
    flex-shrink: 0;
}

.jeb-organiser-pillar--dark .jeb-organiser-pillar__list li i { color: #4ade80; }
.jeb-organiser-pillar--light .jeb-organiser-pillar__list li i { color: #059669; }

/* 4-card secondary row */
.jeb-organiser-cards {
    display: grid;
    gap: 1rem;
}

.jeb-organiser-cards--row {
    grid-template-columns: repeat(4, 1fr);
    margin-bottom: 1.5rem;
}

.jeb-organiser-card {
    background: #fff;
    border: 1px solid #f1f3f4;
    border-radius: 16px;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    transition: all 0.25s ease;
}

.jeb-organiser-card:hover {
    border-color: transparent;
    box-shadow: 0 8px 32px rgba(0,0,0,0.08);
    transform: translateY(-3px);
}

.jeb-organiser-card__icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.jeb-organiser-card__icon--blue {
    background: linear-gradient(135deg, #eff6ff, #dbeafe);
    color: #2563eb;
}

.jeb-organiser-card__icon--green {
    background: linear-gradient(135deg, #ecfdf5, #d1fae5);
    color: #059669;
}

.jeb-organiser-card__icon--orange {
    background: linear-gradient(135deg, #fff7ed, #ffedd5);
    color: #ea580c;
}

.jeb-organiser-card__icon--purple {
    background: linear-gradient(135deg, #f5f3ff, #ede9fe);
    color: #7c3aed;
}

.jeb-organiser-card__title {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1a1a2e;
    margin: 0 0 0.25rem;
}

.jeb-organiser-card__text {
    font-size: 0.82rem;
    color: #6b7280;
    line-height: 1.6;
    margin: 0;
}

/* CTA button (reused) */
.jeb-organiser-feature__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--color-primary, #f54b09);
    color: #fff;
    font-size: 0.9rem;
    font-weight: 700;
    padding: 12px 28px;
    border-radius: 10px;
    text-decoration: none;
    transition: all 0.2s ease;
}

.jeb-organiser-feature__cta:hover {
    background: #d43d05;
    color: #fff;
    transform: translateY(-2px);
    text-decoration: none;
    box-shadow: 0 8px 24px rgba(245,75,9,0.3);
}

/* Footer row — stats + CTA */
.jeb-organiser-footer {
    display: flex;
    align-items: center;
    gap: 2rem;
    flex-wrap: wrap;
}

.jeb-organiser-footer .jeb-organiser-stats {
    flex: 1;
}

.jeb-organiser-footer__cta {
    flex-shrink: 0;
}

/* Stat bar */
.jeb-organiser-stats {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid #f1f3f4;
    border-radius: 16px;
    padding: 1.25rem 1.5rem;
    flex-wrap: wrap;
    gap: 0;
}

.jeb-organiser-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 1.75rem;
    text-align: center;
    flex: 1;
    min-width: 130px;
}

.jeb-organiser-stat__number {
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--color-primary, #f54b09);
    line-height: 1;
    margin-bottom: 0.25rem;
}

.jeb-organiser-stat__label {
    font-size: 0.78rem;
    color: #6b7280;
    line-height: 1.4;
}

.jeb-organiser-stat__sep {
    width: 1px;
    height: 36px;
    background: #e5e7eb;
    flex-shrink: 0;
}

/* Responsive */
@media (max-width: 1100px) {
    .jeb-organiser-cards--row { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 992px) {
    .jeb-organiser-pillars { grid-template-columns: 1fr; }
    .jeb-organiser-stat__sep { display: none; }
    .jeb-organiser-stat { min-width: 48%; padding: 0.75rem; }
    .jeb-organiser-footer { flex-direction: column; align-items: stretch; }
    .jeb-organiser-footer__cta { text-align: center; }
}

@media (max-width: 576px) {
    .jeb-organiser-cards--row { grid-template-columns: 1fr; }
    .jeb-organiser-stat { min-width: 100%; }
}

/* ─── 15.12 TESTIMONIALS ─── */
.jeb-testimonials {
    position: relative;
    overflow: hidden;
}

.jeb-testimonial-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.jeb-testimonial-card {
    background: rgba(255,255,255,0.08);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 16px;
    padding: 1.75rem;
    transition: all 0.3s ease;
}

.jeb-testimonial-card:hover {
    background: rgba(255,255,255,0.12);
    transform: translateY(-4px);
}

.jeb-testimonial-card__stars {
    color: #fbbf24;
    font-size: 0.9rem;
    margin-bottom: 1rem;
    letter-spacing: 2px;
}

.jeb-testimonial-card__quote {
    color: rgba(255,255,255,0.9);
    font-size: 0.95rem;
    line-height: 1.7;
    font-style: italic;
    margin-bottom: 1.25rem;
}

.jeb-testimonial-card__author {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.jeb-testimonial-card__avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, #f54b09, #ff6b35);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1rem;
}

.jeb-testimonial-card__avatar--blue {
    background: linear-gradient(135deg, #2563eb, #60a5fa);
}

.jeb-testimonial-card__avatar--green {
    background: linear-gradient(135deg, #059669, #34d399);
}

.jeb-testimonial-card__author strong {
    color: #fff;
    display: block;
    font-size: 0.9rem;
}

.jeb-testimonial-card__author span {
    color: rgba(255,255,255,0.5);
    font-size: 0.8rem;
}

/* ─── 15.13 HOMEPAGE RESPONSIVE ─── */
@media (max-width: 768px) {
    .jeb-hero__slide { height: 360px; }
    .jeb-hero__img { object-position: top center; }

    .jeb-hero__placeholder-content h1 { font-size: 1.75rem; }
    .jeb-hero__placeholder-content p { font-size: 0.95rem; }

    .jeb-hero__nav-btn {
        width: 32px;
        height: 32px;
        font-size: 0.75rem;
    }

    .jeb-section { padding: 1.5rem 0; }

    .jeb-section__header {
        flex-direction: column;
        align-items: flex-start;
    }

    .jeb-section__title { font-size: 1.375rem; }

    .jeb-event-card__body { padding: 0.75rem 0.75rem 0.375rem; }
    .jeb-event-card__footer { padding: 0.625rem 0.75rem; }
    .jeb-event-card__title { font-size: var(--font-size-sm); }
    .jeb-event-card__book-btn { padding: 0.3rem 0.75rem; font-size: 0.6875rem; }

    .jeb-category-card__thumb { width: 72px; height: 72px; }
    .jeb-category-card__name { font-size: var(--font-size-xs); }

    .jeb-cta { padding: 3rem 0; }
    .jeb-cta__title { font-size: 1.5rem; }
    .jeb-cta__inner { flex-direction: column; text-align: center; }
    .jeb-cta__actions { justify-content: center; }

    /* How It Works responsive */
    .jeb-hiw-grid { flex-direction: column; gap: 1.5rem; }
    .jeb-hiw-card { max-width: 100%; }
    .jeb-hiw-connector { display: none; }

    /* Why Choose Us responsive */
    .jeb-why-grid { grid-template-columns: 1fr; }

    /* Testimonials responsive */
    .jeb-testimonial-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .jeb-hero__slide { height: 280px; }
    .jeb-hero__img { object-position: top center; }

    .jeb-hero__slide--placeholder { min-height: 200px; max-height: none; }
    .jeb-hero__placeholder-content h1 { font-size: 1.4rem; }

    .jeb-event-card__date { padding: 0.2rem 0.375rem; min-width: 36px; }
    .jeb-event-card__date-day { font-size: 0.875rem; }
    .jeb-event-card__date-month { font-size: 0.5625rem; }
    .jeb-event-card__price-value { font-size: var(--font-size-sm); }

    .jeb-btn--lg { padding: 0.625rem 1.25rem; font-size: var(--font-size-sm); }
}

/* ─── 15.14 SMOOTH SCROLL ANIMATIONS ─── */
.jeb-event-card.jeb-animate {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}

.jeb-event-card.jeb-animate.jeb-visible {
    opacity: 1;
    transform: translateY(0);
}

.jeb-event-card.jeb-animate:nth-child(1) { transition-delay: 0s; }
.jeb-event-card.jeb-animate:nth-child(2) { transition-delay: 0.08s; }
.jeb-event-card.jeb-animate:nth-child(3) { transition-delay: 0.16s; }
.jeb-event-card.jeb-animate:nth-child(4) { transition-delay: 0.24s; }

/* Override the old .package-card-delta styles so they don't conflict on main page */
body.home .package-card-delta { all: unset; }
body.home .package-area { all: unset; }

/* ─── 15.16 HEADER TRANSPARENT OVERLAY ON HERO ─── */
body.home .header-area.header-style-four {
    background: transparent;
    transition: background var(--transition-normal);
}

body.home .header-area.header-style-four.scrolled,
body.home .header-area.header-style-four:not(.transparent-header) {
    background: rgba(255,255,255,0.95);
    backdrop-filter: blur(10px);
    box-shadow: var(--shadow-sm);
}

/* ═══════════════════════════════════════════════════════
   15.17 IMAGE PERFORMANCE OVERRIDES
   Fix heavy paint/GPU operations from _user.scss
   ═══════════════════════════════════════════════════════ */

/* Remove expensive background-attachment: fixed (causes repaint on every scroll) */
.cover-img-bg {
    background-attachment: scroll !important;
}

/* Reduce blur intensity on banner/thumbnail pseudo-element overlays */
.cover-img-bg:before {
    filter: blur(20px) !important;
}
.thumb-img-bg:before {
    filter: blur(15px) !important;
}

/* ═══════════════════════════════════════════════════════
   SECTION 17: TICKET SECTION — Compact Space Optimization
   Tighter sale badge, ticket rows, legend, seat map area
   ═══════════════════════════════════════════════════════ */

/* ── 17.1 Sale Timer Badge — Compact Pill ── */
.sale-timer-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    padding: 0.42rem 0.9rem !important;
    background: #fff9f7 !important;
    border: 1px solid rgba(245,75,9,0.28) !important;
    border-radius: 12px !important;
    font-size: 0.76rem !important;
    line-height: 1 !important;
    margin-bottom: 0.5rem !important;
    color: #1e293b !important;
    flex-wrap: nowrap !important;
    white-space: nowrap;
    box-shadow: 0 2px 10px rgba(245,75,9,0.12), 0 1px 3px rgba(0,0,0,0.04) !important;
}
.sale-timer-badge .fa-bolt {
    color: #f54b09 !important;
    font-size: 0.82rem !important;
    margin-right: 0 !important;
}
.sale-timer-badge .fa-clock {
    font-size: 0.65rem !important;
    margin-right: 0 !important;
}
.sale-timer-badge .fw-semibold {
    font-weight: 700 !important;
    color: #f54b09 !important;
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    margin-right: 0.05rem !important;
}

/* ── Countdown units ── */
.sale-timer-units {
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
}
.sale-timer-unit {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #f54b09;
    color: #fff;
    border-radius: 6px;
    padding: 0.26rem 0.44rem;
    min-width: 34px;
    line-height: 1;
}
.sale-timer-unit b {
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
}
.sale-timer-unit small {
    font-size: 0.48rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    opacity: 0.82;
    margin-top: 2px;
}
.sale-timer-sep {
    color: rgba(245,75,9,0.35);
    font-weight: 700;
    font-size: 0.82rem;
    line-height: 1;
    align-self: flex-start;
    margin-top: 4px;
}

/* ── Sale Label Badge ── */
.sale-label-badge {
    background: linear-gradient(135deg, #f97316, #ef4444);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 0.25em 0.65em;
    border-radius: 20px;
    margin-left: 0.25rem;
    vertical-align: middle;
}

/* ── 17.2 Ticket List Items — Reduce Gaps ── */
.buy-tickets-now-accordion-content .list-group .list-group-item {
    margin-bottom: 0.4rem !important;
    padding: 0.55rem 0.75rem !important;
    border-radius: 10px !important;
    border: 1.5px solid #e5e7eb !important;
    transition: border-color 0.15s ease;
}
.buy-tickets-now-accordion-content .list-group .list-group-item:last-child {
    margin-bottom: 0 !important;
}
.buy-tickets-now-accordion-content .list-group .list-group-item:hover {
    border-color: #f54b09 !important;
}

/* ── 17.3 Ticket Row — Tighter Columns ── */
.ticket-title-padding,
.d-flex.justify-content-between.lh-condensed.d-flex-wrap {
    padding: 0.25rem 0 !important;
    gap: 0.25rem;
    align-items: center !important;
}

/* Title column — use 45% instead of 50% */
.ticket-title-padding > .w-50,
.d-flex.justify-content-between.lh-condensed.d-flex-wrap > .w-50 {
    width: 45% !important;
    flex: 0 0 45% !important;
}

/* Qty column */
.ticket-title-padding > .w-25:nth-child(2),
.d-flex.justify-content-between.lh-condensed.d-flex-wrap > .w-25:nth-child(2) {
    width: 22% !important;
    flex: 0 0 22% !important;
}

/* Total / price column */
.ticket-title-padding > .w-25:nth-child(3),
.d-flex.justify-content-between.lh-condensed.d-flex-wrap > .w-25:nth-child(3),
.ticket-title-padding > .ticket-price.w-25,
.ticket-title-padding > .viewTickbutton.w-25 {
    width: 28% !important;
    flex: 0 0 28% !important;
    text-align: right !important;
}

/* Qty dropdown — smaller, refined */
.buy-tickets-now-accordion-content .form-select.form-select-lg {
    font-size: 0.85rem !important;
    padding: 0.35rem 1.8rem 0.35rem 0.5rem !important;
    border-radius: 8px !important;
    height: auto !important;
    min-width: 60px;
    max-width: 90px;
    border: 1.5px solid #d1d5db !important;
}
.buy-tickets-now-accordion-content .form-select.form-select-lg:focus {
    border-color: #f54b09 !important;
    box-shadow: 0 0 0 2px rgba(245,75,9,0.12) !important;
}

/* ── 17.4 Ticket title / price — already styled above, fine-tune spacing ── */
.ticket-title-padding .ticket-title {
    margin-bottom: 0.1rem !important;
}
.ticket-title-padding .ticket-price,
.ticket-title-padding .my-0.h6 {
    margin-bottom: 0 !important;
    margin-top: 0 !important;
}

/* ── 17.5 Selected ticket highlight — subtler ── */
.selected-ticket-bg {
    background: linear-gradient(135deg, #fff7f5 0%, #ffe8de 100%) !important;
    border-radius: 8px !important;
    padding: 0.35rem 0.5rem !important;
}

/* ── 17.6 Seat Legend — Inline Compact ── */
.jeb-seat-legend {
    padding: 0.4rem 0.65rem !important;
    margin-bottom: 0.35rem !important;
    border-radius: 8px !important;
    border: 1px solid #e5e7eb !important;
    background: #fafafa !important;
}
.jeb-seat-legend__title {
    font-size: 0.68rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #9ca3af !important;
    margin-bottom: 0.2rem !important;
}
.jeb-seat-legend__items {
    display: flex !important;
    gap: 0.75rem !important;
    flex-wrap: wrap !important;
}
.jeb-seat-legend__item {
    font-size: 0.72rem !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
}
.jeb-seat-swatch {
    width: 14px !important;
    height: 14px !important;
    border-radius: 3px !important;
}

/* ── 17.7 Selected Seats — Compact ── */
.jeb-selected-seats {
    padding: 0.35rem 0.65rem !important;
    margin-bottom: 0.35rem !important;
    border-radius: 8px !important;
    border: 1px solid #e5e7eb !important;
    background: #fafafa !important;
}
.jeb-selected-seats__title {
    font-size: 0.68rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #9ca3af !important;
    margin-bottom: 0.15rem !important;
}
.jeb-selected-seats__empty {
    font-size: 0.72rem !important;
    color: #9ca3af !important;
    font-style: italic !important;
}
.jeb-seat-badge {
    font-size: 0.7rem !important;
    padding: 0.15rem 0.45rem !important;
    border-radius: 4px !important;
}

/* ── 17.8 Zoom Controls — Compact Row ── */
.buy-tickets-now-accordion-content .break-flex.mt-2.text-center .btn.btn-sm {
    padding: 0.2rem 0.45rem !important;
    font-size: 0.72rem !important;
}

/* ── 17.9 View Seats / Hide Seats Button — Compact ── */
.btn.btn-primary.btnSeatMob,
.viewTickbutton .btn-primary.btnSeatMob {
    font-size: 0.72rem !important;
    padding: 0.3rem 0.7rem !important;
    border-radius: 6px !important;
    letter-spacing: 0.01em;
}

/* ── 17.10 Cart Summary — Tighter ── */
.buy-tickets-now-accordion-content .list-group .list-group-item .d-flex.justify-content-between h6 {
    font-size: 0.82rem !important;
    margin: 0 !important;
}

/* ── 17.11 Overall Wrapper Spacing ── */
.buy-tickets-now-accordion-content > .mt-3 {
    margin-top: 0.5rem !important;
}
.buy-tickets-now-accordion-content .row {
    --bs-gutter-y: 0.35rem;
}

/* ── 17.12 Promo Code Input — Compact ── */
.buy-tickets-now-accordion-content .input-group.mt-3 {
    margin-top: 0.5rem !important;
}
.buy-tickets-now-accordion-content .input-group .form-control.form-control-sm {
    padding: 0.3rem 0.6rem !important;
    font-size: 0.8rem !important;
    border-radius: 6px 0 0 6px !important;
}

/* ── 17.13 Tax Info — Compact ── */
.buy-tickets-now-accordion-content .list-group-flush .list-group-item.small {
    padding: 0.15rem 0.4rem !important;
    font-size: 0.72rem !important;
    margin-bottom: 0 !important;
    border: none !important;
}

/* ── 17.14 Mobile Overrides ── */
@media (max-width: 767px) {
    /* Sale timer — mobile */
    .sale-timer-badge {
        padding: 0.4rem 0.7rem !important;
        gap: 0.4rem !important;
    }
    .sale-timer-badge .fw-semibold {
        font-size: 0.68rem !important;
    }
    .sale-timer-unit { min-width: 30px; padding: 0.22rem 0.35rem; border-radius: 6px; }
    .sale-timer-unit b { font-size: 0.9rem; }
    .sale-timer-unit small { font-size: 0.44rem; }
    .sale-timer-badge .fw-light {
        font-size: 0.66rem !important;
    }

    /* Ticket items — very tight on mobile */
    .buy-tickets-now-accordion-content .list-group .list-group-item {
        margin-bottom: 0.3rem !important;
        padding: 0.45rem 0.55rem !important;
    }

    /* Legend & selected seats — compact */
    .jeb-seat-legend,
    .jeb-selected-seats {
        padding: 0.3rem 0.5rem !important;
        margin-bottom: 0.25rem !important;
    }
    .jeb-seat-legend__items {
        gap: 0.45rem !important;
    }
    .jeb-seat-legend__item {
        font-size: 0.65rem !important;
    }
    .jeb-seat-swatch {
        width: 12px !important;
        height: 12px !important;
    }
}