.ul-tab .ul-tab-item.active {
    --tw-border-opacity: 1;
    border-color: rgba(139, 92, 246, var(--tw-border-opacity));
    border-bottom-width: 2px;
    --tw-text-opacity: 1;
    color: rgba(139, 92, 246, var(--tw-text-opacity));
    font-weight: 700;
}

.daterangepicker {
    box-shadow: 0 4px 20px 1px rgba(0, 0, 0, .06), 0 1px 4px rgba(0, 0, 0, .08);
    border-radius: 10px;
}
.min-h-0 {
    min-height: 0 !important;
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
    background-color: #c4b5fd;

}

.daterangepicker td.in-range {
    background-color: #ede9fe87;

}

.daterangepicker th.available:hover {
    background-color: #ede9fe;

}

.daterangepicker .ranges li.active {
    background-color: #c4b5fd;

}

.daterangepicker .ranges li:hover {
    background-color: #ede9fe;
}

.daterangepicker td.available:hover,
.daterangepicker th.available:hover {
    background-color: #ede9fe;

}

.center-div {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

button:focus {

    outline: none !important;
}

.datatable-input {
    font-size: .875rem;
    line-height: 1.25rem;
    height: 2.5rem;
    border-radius: 9999px;
    margin: 0;
    padding: 1rem 1.25rem !important;
    background-color: rgba(241, 245, 249);
}

.datatable-selector {
    font-size: .875rem;
    line-height: 1.25rem;
    border-radius: 4px;
    margin: 0;
    padding: 8px 10px 8px 10px !important;
    background-color: rgba(241, 245, 249);
}

.datatable-selector:focus-visible {
    outline: none;
}

.clickable-overall-widget {
    cursor: pointer;
}

.cp {
    cursor: pointer;
}

.clickable-event-widget {
    cursor: pointer;
}

.suggestion-item {
    cursor: pointer;
}

.platformwise-widget {
    cursor: pointer;
}

.nav-item.active:after {
    content: "";
    position: absolute;
    width: 30px;
    height: 30px;
    bottom: -15px;
    right: -15px;
    transform: rotate(45deg);
    --tw-bg-opacity: 1;
    background-color: rgba(139, 92, 246, var(--tw-bg-opacity));
}

.greenDot {
    height: 15px;
    min-height: 15px;
    width: 15px;
    min-width: 15px;
    border: 1px #20C043;
    border-radius: 50%;
    background-color: #20C043;
    margin: 0px 10px 0px 5px;
}

.redDot {
    height: 15px;
    min-height: 15px;
    width: 15px;
    min-width: 15px;
    border: 1px #ED7779;
    border-radius: 50%;
    background-color: #ED7779;
    margin: 0px 10px 0px 5px;
}

.eventStatusBar {
    background: #f1f5f9;
    padding: 10px 20px;
    border-radius: 10px;
}

.saleFigure {
    min-height: 32px;
}

.datatable-sorter::before,
.datatable-sorter::after {
    content: none !important;

}

.app-admin-wrap-layout-2 .main-content-wrap .side-content-wrap .sidebar-left-secondary ul.childNav li a.active {
    background-color: #f3f4f6;
    --tw-text-opacity: 1;
    color: rgba(139, 92, 246, var(--tw-text-opacity));
}

.actionBtn {
    cursor: pointer;
}

.gap-2 {
    gap: 0.5rem;
}

.gap-1 {
    gap: 0.25rem;
}

.bookingItemDetail {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.bookingItemDetail .ticketDetailBox {
    display: flex;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 8px;
    padding: 7px;
    border-radius: 8px;
    flex-direction: column;
    gap: 5px;
}

.action-container {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.action-btn {
    padding: 4px 12px;
    border-radius: 20px;
    border: 1px solid #ddd;
    background: white;
    cursor: pointer;
    font-size: 14px;
}

.edit-btn {
    border-color: #4e73df;
    color: #4e73df;
}

.delete-btn {
    border-color: #e74a3b;
    color: #e74a3b;
}

.mail-btn {
    border-color: #1cc88a;
    color: #1cc88a;
}

.download-btn {
    border-color: #36b9cc;
    color: #36b9cc;
    text-decoration: none;
    display: inline-block;
}

.custom-dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-toggle {
    padding: 4px 12px;
    border-radius: 20px;
    border: 1px solid #4e73df;
    background: white;
    color: #4e73df;
    cursor: pointer;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.dropdown-arrow {
    font-size: 10px;
}

.dropdown-menu {
    display: none;
    position: absolute;
    right: 0;
    background-color: white;
    min-width: 160px;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    border-radius: 4px;
    border: 1px solid #ddd;
}

.dropdown-item {
    padding: 8px 16px;
    display: block;
    color: #333;
    text-decoration: none;
}

.dropdown-item:hover {
    background-color: #f8f9fa;
    color: #333;
}

.multi-level-menu {
    margin-right: 50px;
}

/* Checkout / summer camp (no sidebar): profile flush right, no dashboard offset */
.pos-event-full-width .header-2-wrapper .multi-level-menu {
    margin-right: 0;
}

.multi-level-menu li>ul {
    transform: translatex(-100%) scale(0);
    left: 0;
    right: auto;
}

.multi-level-menu li:hover>ul {
    transform: translatex(-101%) scale(1);
}

.multi-level-menu li>button svg {
    transform: rotate(90deg);
}

.multi-level-menu li:hover>button svg {
    transform: rotate(270deg);
}

.multi-level-menu li a:hover {
    color: #7c3aed;
}

.multi-level-menu.group:hover .group-hover\:scale-100 {
    transform: scale(1);
}

.multi-level-menu.group:hover .multi-level-menu.group-hover\:-rotate-180 {
    transform: rotate(180deg);
}

.multi-level-menu .scale-0 {
    transform: scale(0);
}

.multi-level-menu .min-w-32 {
    min-width: 8rem;
}

.multi-level-menu .min-w-40 {
    min-width: 10rem;
}

.multi-level-menu .min-w-50 {
    min-width: 12rem;
}

#filter.ul-tab .ul-tab-item {
    padding: .5rem .5rem;

}

.search-suggestions {
    height: 600px;
    overflow: auto;
}

.app-admin-wrap-layout-2 .sidebar-left.ps {
    max-height: calc(100vh - 50px);
}

.app-admin-wrap-layout-2 .main-content-wrap .side-content-wrap .sidebar-left-secondary.ps {
    max-height: calc(100vh - 80px);
}

#eventVsitorsTable .payment-wrapper {
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: center;
}

#eventVsitorsTable .payment-wrapper p {
    text-transform: uppercase;
    font-weight: 900;
}

#eventVsitorsTable .payment-wrapper p.online-payment {
    text-transform: uppercase;
    color: #50a350;
    font-weight: 900;
}
#eventVsitorsTable .payment-wrapper .action-btn  {
    text-transform: uppercase;
    
}

@media screen and (max-width: 480px) {
    .bqfilterTabsWrapper {
        flex-direction: column;
    }

    .datatable-search {
        width: 100%;
    }

    .datatable-input {

        margin-top: 10px;
        width: 100%;
    }

    .filterWrapper {
        flex-direction: column;
    }

    #organiserGroupFilter {
        margin-bottom: 10px;
    }

    /* Hide logo only when dashboard search bar is present (not summer camp / checkout) */
    .app-admin-wrap-layout-2 .header-2-wrapper:has(.search-bar.custom) .logo.newtheme {
        display: none;
    }

    .app-admin-wrap-layout-2 .header-2-wrapper .search-bar.custom {
        display: block;

    }

    .app-admin-wrap-layout-2 .header-2-wrapper .search-bar.custom input {

        width: 100%;
    }

    .app-admin-wrap-layout-2 .header-2-wrapper {
        flex-wrap: nowrap;
    }
}


/* select:focus > option:checked { 
    background: #000 !important;
} */

/* Summer camp visitors table — unchecked checkbox must stay visible on card header */
.sc-camp-incomplete-checkbox.form-checkbox {
    width: 1.25rem !important;
    height: 1.25rem !important;
    border: 2px solid #6b7280 !important;
    background-color: #fff !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.8);
}

.sc-camp-incomplete-checkbox.form-checkbox:checked {
    border-color: transparent !important;
    background-color: currentColor !important;
}