.Common_table .table td .dropdown select {
    border: 1px solid #000000;
    background-color: #fff;
    border-radius: 10px;
    padding: 5px 25px;
    color: #008000;
    font-size: 14px;
    box-shadow: none;
}

.volate_table {
    min-width: 1760px !important;
}



.Retrieval_sec h2 {
    font-size: 24px;
    font-weight: 600;
    font-family: 'Poppins';
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.Retrieval_sec {
    margin: 50px 0 30px;
}

.Retrieval_sec .grid_box {
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    margin-top: 24px;
}

.Retrieval_sec .box {
    border: 1px solid #4A4AF6;
    box-shadow: 0px 4px 4px 0px #00000029;
    border-radius: 20px;
    padding: 24px;
}

.Retrieval_sec .box h3 {
    font-size: 22px;
    font-family: 'Poppins';
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: space-between;
}

.Retrieval_sec .box p {
    font-size: 15px;
    font-family: 'Poppins';
    margin: 0;
}

.Retrieval_sec .box h3 span {
    border: 1px solid #008D34;
    background: #008D341A;
    font-size: 14px;
    font-weight: 400;
    color: #008D34;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 10px;
    border-radius: 10px;
    letter-spacing: .5px;
}

.Retrieval_sec .box h3 span i {
    line-height: 0;
    font-size: 16px;
}


.Retrieval_sec .box .set {
    background: #F5F3FF;
    border-radius: 8px;
    margin: 20px 0 24px;
    padding: 20px 0;
    box-shadow: 0px 0px 7.94px 0px #00000026;
}

.Retrieval_sec .box .set ul {
    margin: 0;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 7px;
    padding: 10px 15px;
    border-radius: 8px;
}

.Retrieval_sec .box .set ul li {
    font-size: 15px;
    font-family: 'Poppins';
    display: flex;
    align-items: center;
    gap: 7px;
}

.Retrieval_sec .box .set ul li+li {
    border-left: 1px solid #0000001A;
}

.Retrieval_sec .box .set ul li+li {
    border-left: 1px solid #0000001A;
    padding-left: 12px;
}

.Retrieval_sec .box select option {
    text-align: start;
}

.Retrieval_sec .box select {
    width: 100%;
    background-color: #fff;
    height: 50px;
    border-radius: 10px;
    padding: 0 10px;
    font-weight: 500;
    font-size: 16px;
    font-family: 'Poppins';
    border: 1px solid #e6e6e6;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    appearance: none;
    cursor: pointer;
    text-align: center;
    text-align-last: center;
}



.Retrieval_sec .box .btn {
    background: #4A4AF6;
    color: #fff;
    width: 100%;
    height: 50px;
    font-weight: 500;
    font-size: 16px;
    font-family: 'Poppins';
    border-radius: 10px;
    letter-spacing: .5px;
}

.Retrieval_sec .box .select-box::after {
    content: "";
    width: 8px;
    height: 8px;
    border-right: 3px solid #878A99;
    border-bottom: 3px solid #878A99;
    transform: rotate(45deg);
    position: absolute;
    right: 0px;
    left: 180px;
    margin: auto;
    top: 37%;
    pointer-events: none;
    cursor: pointer;
}

.Retrieval_sec .box .select-box {
    position: relative;
}

.Retrieval_sec .box .select-box.hide-arrow::after {
    display: none;
}

.session_popup .modal-dialog {
    max-width: 730px;
}

.session_popup h2 {
    font-size: 24px;
    margin: 0;
    font-family: 'Nunito Sans';
    font-weight: 700;
}

.session_popup .modal-body {
    padding: 18px 24px;
}

.session_popup .modal-header {
    padding: 18px 24px;
}

.session_popup .nav {
    gap: 6px;
    justify-content: space-between;
    flex-wrap: nowrap;
    box-shadow: 0px 2px 4px 0px #00000024;
    padding: 10px;
    border-radius: 6px;
    margin-bottom: 20px;
}

.session_popup .nav .nav-link {
    color: #4A4AF6;
    font-size: 15px;
    font-weight: 500;
    font-family: poppins;
    width: 100%;
    border-radius: 6px;
    background: #f5f5f5;
    padding: 12px 5px;
}

.session_popup .nav .nav-link.active {
    color: #fff;
    background: #4A4AF6;
}

.session_popup .nav li {
    width: 100%;
}

.session_popup .nav .nav-link:hover {
    color: #fff;
    background: #4A4AF6;
}

.session_popup .code_box {
    padding: 20px 0;
}

.session_popup .code_box img {
    height: 200px;
}

.session_popup .code_box p {
    color: #00000080;
    font-size: 18px;
    margin: 20px 0 30px;
    font-family: poppins;
    text-align: center;
}

.session_popup .btn {
    background: #4A4AF6;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-family: Roboto;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: .5px;
    border: 2px solid #4A4AF6;
}

.session_popup .btn:hover {
    background: #000;
    border-color: #000;
}

.session_popup .code_box .btn_scan {
    max-width: 230px;
    margin: auto;
}

.modal-content {
    margin: 0 14px;
}

.session_popup .grid_box {
    grid-template-columns: 1fr 1fr;
    gap: 15px;
}

.session_popup .form-group label {
    font-size: 15px;
    font-family: 'Poppins';
    font-weight: 500;
    margin-bottom: 7px;
}

.session_popup .form-group .form-control {
    border: 1px solid #D9D9D9;
    height: 45px;
    font-size: 14px;
    font-family: 'Poppins';
    box-shadow: none;
}

.session_popup .code_box h3 {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 14px;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    row-gap: 6px;
    column-gap: 10px;
}

.session_popup {
    font-family: 'Poppins';
}

.session_popup .code_box h3 span {
    color: #4A4AF6;
    font-size: 14px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 3px;
    cursor: pointer;
}

.session_popup .code_box h3 span i {
    line-height: 0;
    -webkit-text-stroke: .5px;
}

/* ── Custom Multi-Select Tag Input ── */
.tag-select-wrapper {
    position: relative;
}

.tag-input-box {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    padding: 6px 36px 6px 10px;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    position: relative;
}

.tag-input-box:focus-within,
.tag-input-box.active {
    border-color: #4A4AF6;
    box-shadow: 0 0 0 3px rgba(74, 74, 246, 0.10);
}

.tag-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(74, 74, 246, 0.20); /* #4A4AF633 */
    color: #4A4AF6;
    border-radius: 6px;
    padding: 3px 8px;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
}


.tag-chip .chip-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    color: #000000;  /* changed from #4A4AF6 to black */
    font-size: 14px;
    font-weight: 400;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    opacity: 0.58;
    transition: opacity 0.15s;
}

.tag-chip .chip-remove:hover {
    opacity: 1;
}

.tag-input-box .tag-placeholder {
    color: #aaa;
    font-size: 13.5px;
    user-select: none;
}

.tag-dropdown-arrow {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: #555;
    font-size: 12px;
    line-height: 1;
}

.tag-dropdown {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    box-shadow: 0 6px 24px rgba(0,0,0,0.10);
    z-index: 999;
    max-height: 200px;
    overflow-y: auto;
    display: none;
}

.tag-dropdown.open {
    display: block;
}

.tag-dropdown-item {
    padding: 10px 14px;
    font-size: 13.5px;
    cursor: pointer;
    color: #333;
    transition: background 0.12s;
}

.tag-dropdown-item:hover {
    background: rgba(74, 74, 246, 0.08);
}

.tag-dropdown-item.selected {
    background: rgba(74, 74, 246, 0.13);
    color: #4A4AF6;
    font-weight: 500;
}

.session_popup .code_box .vehicle_info {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 16px;
    margin-bottom: 20px;
    
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;

    /* Hide the visual scrollbar */
    -ms-overflow-style: none;  /* IE/Edge */
    scrollbar-width: none;     /* Firefox */
}

/* Hide the visual scrollbar for Webkit browsers */
.session_popup .code_box .vehicle_info::-webkit-scrollbar {
    display: none;
}

.session_popup .code_box .vehicle_info .info {
    font-size: 15px;
    font-weight: 500;
    box-shadow: 0px 1px 4px 0px #0000001A;
    background: #BFBFF71A;
    padding: 10px;
    border-radius: 6px;
    flex: 0 0 180px;      
    text-align: center;
    cursor: pointer;      
    transition: 0.3s;
    border: 2px solid transparent;
}

.session_popup .code_box .vehicle_info::-webkit-scrollbar {
    height: 5px;
}

.session_popup .code_box .vehicle_info::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
}

.session_popup .code_box .vehicle_info::-webkit-scrollbar-thumb {
    background: #4A4AF650; /* Matches your theme color with transparency */
    border-radius: 10px;
}

.session_popup .code_box .vehicle_info .info.active {
    background: #4A4AF6;
    color: #fff;
}

.session_popup .code_box h4 {
    margin-top: 20px;
    font-size: 18px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: space-between;
}

.session_popup .code_box h4 .form-switch {
    padding: 0;
    margin: 0;
    min-height: inherit;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.session_popup .code_box h4 .form-switch label {
    color: #00000080;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
}

.session_popup .code_box h4 .form-switch input {
    float: initial;
    margin: 0;
    box-shadow: none;
    cursor: pointer;
}

.session_popup .form-check-input:checked {
    background-color: #4A4AF6;
    border-color: #4A4AF6;
}

.session_popup .form-group .form-select {
    border: 1px solid #D9D9D9;
    height: 45px;
    font-size: 14px;
    font-family: 'Poppins';
    box-shadow: none;
}

.session_popup .code_box .show_assign .assign {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 15px;
}

.session_popup .code_box .show_assign {
    margin-top: 20px;
}

.session_popup .code_box .show_assign .assign .form-group.two {
    grid-column: 1 / -1;
}

.Common_table .table .ticket span {
    border: 1px solid #D1D5DB;
    background: #F3F4F6;
    font-size: 14px;
    color: #374151;
    padding: 5px 9px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.Common_table .table .ticket span i {
    line-height: 0;
    font-size: 13px;
}

.Common_table .table .ticket {
    display: flex;
    align-items: center;
    gap: 6px;
}

.Common_table .table .red {
    color: #9F0712;
}

.Common_table .table .missing_key span {
    border: 1px solid #FCA5A5;
    background: #FEE2E2;
    font-size: 14px;
    color: #B91C1C;
    padding: 5px 9px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 4px;
    justify-content: center;

}


.Common_table .table .missing_key span i {
    line-height: 0;
}

.Common_table .table .missing_key.yellow span {
    color: #A16207;
    background: #FEF9C3;
    border-color: #FDE68A;
}

/* Multiple "missing field" chips (Phone Number, Vehicle Info, Photos, Notes)
   inside one cell — wrap onto new lines instead of stacking full-width. */
.Common_table .table .missing_fields_list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-start;
}

.Common_table .table .missing_fields_list span {
    white-space: nowrap;
}

@media (max-width: 767.98px) {
    .Common_table .table .missing_fields_list span,
    .Common_table .table .missing_key span,
    .Common_table .table .complete span {
        font-size: 12px;
        padding: 4px 7px;
    }
}

.valet_oprations .search_filter {
    margin: 0 !important;
    width: 100%;
    max-width: 550px;
}

.valet_oprations h2 {
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: space-between;
    margin-top: 24px;
}

.valet_oprations .search_filter .grid_box {
    grid-template-columns: 1.5fr 1fr !important;
}

.Retrieval_sec h2 .form-switch label {
    color: #000;
    font-size: 16px;
    font-weight: 400;
    cursor: pointer;
}

.Retrieval_sec h2 .form-switch input {
    float: initial;
    margin: 0;
    box-shadow: none;
    cursor: pointer;
}

.Retrieval_sec h2 .form-switch {
    padding: 0;
    margin: 0;
    min-height: inherit;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.valet_oprations h2 .form-control {
    width: 100%;
    border: 1px solid #D7D7D7;
    box-shadow: 0px 2px 4px 0px #00000029;
    height: 50px;
    border-radius: 4px;
    font-family: Poppins;
    font-size: 15px;
    padding: 0 12px 0 38px;
    color: #000;
}

.valet_oprations h2 .form-group button {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    border: none;
    width: 45px;
    background: transparent;
}

.valet_oprations h2 .form-group button img {
    height: 18px;
}

.valet_oprations h2 .form-group {
    position: relative;
    width: 100%;
    max-width: 350px;
}

.Common_table .table .complete span {
    border: 1px solid #4A4AF6;
    background: #EEEEFF;
    font-size: 14px;
    color: #4A4AF6;
    padding: 5px 9px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 4px;
    justify-content: center;
}

.valet_oprations .table td .paid {
    min-width: 100px;
    width: 100%;
    display: block;
    text-align: center;
}

.valet_oprations td .action_btn .btn.outline {
    min-width: 160px;
}

.Retrieval_sec .box .status_toggle {
    display: flex;
    font-size: 15px;
    color: #000;
    padding: 10px 15px 0;
    border-top: 1px solid #DDDBE6;
    gap: 10px;
    align-items: center;
}

.Retrieval_sec .box .status_toggle .buttnon_group {
    background: #E9E9E9;
    border-radius: 50px;
    padding: 6px;
    display: flex;
    align-items: center;
    gap: 2px;
}

.Retrieval_sec .box .status_toggle .buttnon_group span {
    color: #484848;
    font-size: 13px;
    font-weight: 500;
    border-radius: 50px;
    padding: 3px 12px 6px;
    letter-spacing: .4px;
    cursor: pointer;
    transition: all .3s;
}

.Retrieval_sec .box .status_toggle .buttnon_group .active {
    background: #4C4EEE;
    color: #fff;
}

.Retrieval_sec .box .status_toggle .buttnon_group span:hover {
    background: #4C4EEE;
    color: #fff;
}

.offline_pay .discount_group {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    margin-top: 12px;
}

.offline_pay .discount_group input {
    display: none;
}

.offline_pay .discount_btn {
    display: inline-block;
    padding: 8px 25px;
    background: #fff;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 500;
    transition: 0.3s;
    border: 1px solid #C9C9C9;
    box-shadow: 0px 2px 4px 0px #00000024;
    color: #000;
    font-size: 15px;
}

.offline_pay .discount_group input:checked+.discount_btn {
    background: #4A4AF6;
    color: #fff;
}

.offline_pay .flex_box {
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.offline_pay h3 {
    color: #000;
    font-size: 18px;
    margin: 0;
}

.offline_pay p {
    margin: 0;
    color: #000;
    font-size: 18px;
}

.offline_pay h3 span {
    color: #686868;
    font-weight: 400;
}

.offline_pay h5 {
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #0000001A;
    margin-top: 20px;
    padding-top: 20px;
    font-size: 22px;
    font-weight: 500;
}

.session_popup .button {
    display: flex;
    gap: 15px;
    margin-top: 24px;
}

.session_popup .button .btn.cancel {
    background: #fff;
    color: #4A4AF6;
}

.session_popup .button .btn.cancel:hover {
    background: #4A4AF6;
    color: #fff;
    border-color: #4A4AF6;
}

.Retrieval_sec .box.red {
    border-color: #B91C1C;
}

.Retrieval_sec .box.red h3 span {
    color: #DC2626;
    background: #DC26261A;
    border-color: #DC2626;

}

.Retrieval_sec .box.yellow {
    border-color: #FDE68A;
}

.Retrieval_sec .box.yellow h3 span {
    color: #A16207;
    background: #FEF9C3;
    border-color: #FDE68A;
}

/* Scheduled retrieval — not yet due, so deliberately neutral rather than the
   default green (which reads as "done") or red (which reads as "act now").
   A scheduled card carries no colour class, so this targets the badge itself. */
.Retrieval_sec .box h3 span.scheduled-badge {
    color: #475569;
    background: #F1F5F9;
    border-color: #CBD5E1;
    white-space: nowrap;
}

/* The ticking time sits on its own pill inside the badge. Tabular figures plus
   a min-width keep the chip from resizing as the digits change (9:59 -> 10:00)
   or as the minutes column drops away, so the badge edge stays put. */
.Retrieval_sec .box h3 span.scheduled-badge .countdown-pill {
    background: #4A4AF6;
    color: #fff;
    font-weight: 500;
    font-size: 13px;
    letter-spacing: .5px;
    line-height: 1;
    padding: 5px 9px;
    border-radius: 999px;
    min-width: 52px;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.session_popup .form-group label span {
    color: #4A4AF6;
}
.session_popup .new_vehicle h6 {
    text-align: center;
    position: relative;
    font-size: 14px;
}

.session_popup .new_vehicle {
    margin-top: 18px;
    display: none;
}

.session_popup .new_vehicle.main {
    display: block;
}

.session_popup .new_vehicle h6:before {
    position: absolute;
    content: "";
    background: #00000033;
    height: 1px;
    width: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

.session_popup .new_vehicle h6 span {
    background: #fff;
    position: relative;
    padding: 0 20px;
}

.session_popup .new_vehicle .info {
    border: 1px solid #D9D9D9;
    padding: 15px;
    border-radius: 6px;
    margin-top: 20px;
}


.session_popup .upload_img .upload_box {
    width: 100%;
    max-width: 300px;
    margin-top: 16px;
    position: relative;
    overflow: hidden;
}

.session_popup .upload_img .upload_label {
    display: block;
    border: 2px dashed #999;
    border-radius: 15px;
    padding: 40px 20px;
    text-align: center;
    cursor: pointer;
    transition: 0.3s;
    background: #F6F6F6;
}

.session_popup .upload_img .upload_label:hover {
    border-color: #5f5fff;
    background: #f3f3ff;
}

.session_popup .upload_img .upload_content i {
    font-size: 40px;
    color: #555;
    display: block;
    margin-bottom: 10px;
}

.session_popup .upload_img .upload_content p {
    margin: 0;
    font-size: 15px;
    color: #2D2D2D;
}


.session_popup .upload_img .preview_img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    object-fit: cover;
    height: 100% !important;
    border-radius: 15px;
}

.session_popup .upload_img .upload_box .canel {
    position: absolute;
    right: 10px;
    z-index: 9;
    top: 10px;
    color: #fff;
    cursor: pointer;
    background: #ff0000e0;
    width: 22px;
    height: 22px;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    display: none;
}

.session_popup .upload_img .upload_box .canel i {
    -webkit-text-stroke: .5px;
    line-height: 0;
    font-size: 11px;
}

.session_popup .code_box .matching_para {
    color: #3B3B3B;
    font-size: 15px;
}

.Lookup_customer .search {
    position: relative;
}

.Lookup_customer .search .form-control {
    border: 1px solid #D7D7D7;
    box-shadow: 0px 2px 4px 0px #00000029;
    height: 50px;
    font-size: 15px;
    padding: 0 12px 0 40px;
}

.Lookup_customer .search button {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 100%;
    border: none;
    width: 45px;
    background-color: transparent;
    padding: 0;
}

.Lookup_customer .search button img {
    height: 18px;
}

.Lookup_customer {
    padding-top: 10px;
}

/* Manual Entry's copy of the customer search sits directly above the form
   fields, unlike the Lookup tab where it stands alone. Even it out: drop the
   tab-specific top padding and add a bottom margin matching the form's own
   rhythm (.grid_box gap / heading margins) so it doesn't crowd License Plate.
   The dropdown is absolutely positioned so results overlay the form instead
   of shoving it down mid-search. */
.manual-lookup {
    padding-top: 0;
    margin-bottom: 22px;
    position: relative;
}

.manual-lookup .list {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 5;
    margin-top: 6px;
    max-height: 260px;
    overflow-y: auto;
    background: #fff;
    box-shadow: 0px 4px 12px 0px #0000001f;
}

.Lookup_customer .list {
    border: 1px solid #D9D9D9;
    padding: 15px;
    border-radius: 5px;
    margin-top: 20px;
}

.Lookup_customer .list h3 {
    font-size: 16px;
    color: #3B3B3B;
    margin-bottom: 12px;
}

.Lookup_customer .list h4 {
    color: #3B3B3B80;
    font-size: 16px;
    font-weight: 600;
}

.valet_profile .box {
    box-shadow: 0px 2px 4px 0px #00000029;
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 24px;
}

.valet_profile .grid_box {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.valet_profile h2 {
    font-family: 'Nunito Sans';
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
    letter-spacing: .5px;
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: space-between;
}

.valet_profile h2 span {
    color: #374151;
    font-size: 14px;
    font-weight: 400;
    border: 1px solid #D1D5DB;
    background: #F3F4F6;
    border-radius: 10px;
    padding: 6px 8px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
}

.valet_profile h2 span i {
    line-height: 0;
    font-size: 13px;
}

.valet_profile .box .set {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
     margin-top: 20px;
}

.valet_profile .left1 .box .set h3 {
    font-size: 16px;
    color: #3B3B3B;
}

.valet_profile .left1 .box .set .img img {
    width: 100%;
    border-radius: 10px;
}

.valet_profile .form-group label {
    font-size: 15px;
    font-family: 'Poppins';
    font-weight: 500;
    margin-bottom: 7px;
    color: #3B3B3B;
}

.valet_profile .form-group .form-control {
    border: 1px solid #D9D9D9;
    height: 45px;
    font-size: 14px;
    font-family: 'Poppins';
    box-shadow: none;

}

.valet_profile .form-group .form-select {
    border: 1px solid #D9D9D9;
    height: 45px;
    font-size: 14px;
    font-family: 'Poppins';
    box-shadow: none;
    box-shadow: none;

}

.valet_profile .form-group label span {
    color: #4A4AF6;
}

.valet_profile .form-group {
    position: relative;
}

.valet_profile .form-group .link {
    border: 1px solid #04A842;
    height: 45px;
    font-family: 'Poppins';
    border-radius: 4px;
    background: #F0FDF4;
    padding: 0 10px;
    display: flex;
    align-items: center;
    gap: 7px;
    color: #04A842;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .5px;
}

.valet_profile .copy_link .btn {
    background: #4A4AF6;
    color: #fff;
    border: 1px solid #4A4AF6;
    border-radius: 4px;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .5px;
    height: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
}

.valet_profile .copy_link {
    display: flex;
    align-items: end;
    gap: 10px;
}

.valet_profile .copy_link .btn.outline {
    background: #fff;
    color: #4A4AF6;
}

.valet_profile .copy_link .btn i {
    line-height: 0;
    font-size: 15px;
    padding-top: 4px;
}

.valet_profile .form-group.full-width {
    grid-column: 1/-1;
}

.valet_profile .form-group label span.red {
    color: #E65051;
}

.valet_profile .missing_key .btn {
    background: #E65051;
    color: #fff;
    width: 100%;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-size: 15px;
    letter-spacing: .5px;
    height: 45px;
    font-family: poppins;
}

.valet_profile .missing_key {
    display: flex;
    align-items: end;
}

.valet_profile .missing_key .btn i {
    line-height: 0;
}

.valet_profile .save_button .btn {
    background: #4A4AF6;
    color: #fff;
    width: 100%;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-size: 16px;
    letter-spacing: .5px;
    height: 45px;
    font-family: poppins;
}

.valet_profile .save_button {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
}

.valet_profile .save_button .btn.key {
    background: #E65051;
}

.valet_profile .copy_link .btn:hover {
    background: #000;
    color: #fff;
    border-color: #000;
}

.valet_profile .save_button .btn:hover {
    background: #000;
    color: #fff;
    border-color: #000;
}

.valet_profile .missing_key .btn:hover {
    background: #000;
    color: #fff;
    border-color: #000;
}

.valet_profile .status {
    font-size: 16px;
    color: #3B3B3B;
    font-weight: 500;
    font-family: 'Poppins';
    display: flex;
    align-items: center;
    gap: 6px;
}

.valet_profile .status span {
    color: #00000080;
    font-size: 14px;
}

.valet_profile .status .green {
    color: #04A842;
    background: #fff;
    border: 1px solid #04A842;
    padding: 2px 10px;
    border-radius: 10px;
    font-weight: 400;
}

.valet_profile .status .orange {
    color: #E67E00;
    background: #fff;
    border: 1px solid #E67E00;
    padding: 2px 10px;
    border-radius: 10px;
    font-weight: 400;
}

.valet_profile .status .red {
    color: #FF0000;
    background: #fff;
    border: 1px solid #FF0000;
    padding: 2px 10px;
    border-radius: 10px;
    font-weight: 400;
}

.valet_profile .status .gray {
    color: #888888;
    background: #fff;
    border: 1px solid #888888;
    padding: 2px 10px;
    border-radius: 10px;
    font-weight: 400;
}


.valet_profile .recent_activity .item h3 {
    font-size: 15px;
    color: #3b3b3b;
    font-family: poppins;
    display: flex;
    align-items: center;
    gap: 7px;
}

.valet_profile .recent_activity .item h3 i {
    -webkit-text-stroke: .5px;
    line-height: 0;
  font-size: 14px;
    margin-right: 5px;
}
.valet_profile .recent_activity .item {
    padding-top: 0px;
} 

.valet_profile .recent_activity .item ul {
    padding: 0 0 0 24px;
    margin: 0;
    display: flex;
    gap: 4px;
    color: #00000080;
    font-family: poppins;
    font-weight: 500;
    font-size: 15px;
}
.valet_profile .recent-activity h2 {
 margin-bottom: 30px !important;
}
.valet_profile .recent_activity .item ul li:first-child::marker {
    content: "";
}





.valet_profile .recent_activity .item+.item {
    /* border-top: 1px solid #00000038;
    padding-top: 14px; */
    margin-top: 14px;
}

.valet_performance {
    margin-top: 30px;
}

.valet_performance h2 {
    font-size: 20px;
    font-family: 'Nunito Sans';
    font-weight: 700;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: space-between;
}

.valet_performance .box {
    box-shadow: 0px 2px 4px 0px #00000029;
    background: #fff;
    padding: 20px 12px;
    border-radius: 10px;
}

.valet_performance .grid_box {
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.valet_performance .box .iteam {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: space-between;
    background: #FAFAFA;
    padding: 15px;
    border-radius: 10px;
}

.valet_performance .box .iteam .cont {
    display: flex;
    gap: 10px;
}

.valet_performance .box .iteam .icon span {
    background: #E2E2FF;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
}

.valet_performance .box .iteam .icon span i {
    color: #4A4AF6;
    font-size: 20px;
    line-height: 0;
    -webkit-text-stroke: .5px;
}

.valet_performance .box .iteam .details h3 {
    font-family: poppins;
    font-size: 16px;
    margin-bottom: 5px;
}


.valet_performance .box .iteam .details ul {
    padding: 0;
    margin: 0;
    display: flex;
    gap: 24px;
    color: #00000080;
    font-family: poppins;
    font-weight: 500;
    font-size: 14px;
}

.valet_performance .box .iteam .details ul li:first-child::marker {
    content: "";
}

.valet_performance .box .iteam .complete {
    border: 1px solid #4A4AF6;
    background: #EEEEFF;
    border-radius: 10px;
    padding: 6px 8px;
    color: #4A4AF6;
    font-size: 14px;
    font-weight: 500;
    font-family: poppins;
    letter-spacing: .5px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
}

.valet_performance .box .iteam .complete.red {
    background: #FEE2E2;
    border-color: #FCA5A5;
    color: #B91C1C;
}

.valet_performance .box .iteam+.iteam {
    margin-top: 12px;
}

.valet_performance .box .iteam .icon span {
    background: #E2E2FF;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    font-size: 17px;
    text-transform: uppercase;
    font-family: 'Poppins';
    font-weight: 600;
    color: #4A4AF6;
}

.valet_performance .box .iteam .number {
    color: #000;
    font-weight: 700;
    font-size: 24px;
}

.valet_performance .box .iteam .details .clock li {
    display: flex;
    align-items: center;
    gap: 7px;
}

.valet_performance .box .iteam .details .clock {
    gap: 16px;
}

.valet_performance .box .iteam .details .clock li i {
    line-height: 0;
    font-size: 15px;
    -webkit-text-stroke: .3px;
}

.parked_modal .modal-header {
    padding: 18px 24px;
}

.parked_modal .modal-body {
    padding: 18px 24px 30px;
}

.parked_modal .modal-dialog {
    max-width: 730px;
}

.parked_modal .nav {
    gap: 6px;
    justify-content: space-between;
    flex-wrap: nowrap;
    box-shadow: 0px 2px 4px 0px #00000024;
    padding: 10px;
    border-radius: 6px;
    margin-bottom: 30px;
}

.parked_modal .nav li {
    width: 100%;
}

.parked_modal .nav .nav-link.active {
    color: #fff;
    background: #4A4AF6;
}

.parked_modal .nav .nav-link {
    color: #000000;
    font-size: 15px;
    font-weight: 500;
    font-family: poppins;
    width: 100%;
    border-radius: 6px;
    background: #f5f5f5;
    padding: 12px 5px;
}

.parked_modal .modal-header h2 {
    font-size: 24px;
    margin: 0;
    font-family: 'Nunito Sans';
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 8px;
}

.parked_modal .modal-header h2 span {
    border: 1px solid #04A842;
    background: #fff;
    border-radius: 6px;
    padding: 4px 15px 3px;
    color: #008000;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .5px;
    text-align: center;
}

.parked_modal .modal-header p {
    margin: 0;
    color: #00000080;
    font-size: 15px;
    font-weight: 500;
}

.parked_modal .parked_box ul {
    padding-left: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 24px;
    position: relative;
}

.parked_modal .parked_box ul li:before {
    position: absolute;
    content: "";
    background: #4A4AF6;
    width: 20px;
    height: 20px;
    left: 0;
    border-radius: 100%;
    top: 4px;
}

.parked_modal .parked_box ul li::after {
    position: absolute;
    content: "";
    background: #000;
    width: 1px;
    height: 94%;
    left: 9px;
    border-radius: 100%;
    top: 27px;
    margin: auto;
}

.parked_modal .parked_box ul li:last-child::after {
    display: none;
}

.parked_modal .parked_box ul li {
    position: relative;
    padding-left: 30px;
    color: #3B3B3B;
    font-size: 16px;
    font-family: poppins;
    font-weight: 500;
}

.parked_modal .parked_box ul li p {
    color: #00000080;
    font-size: 14px;
    margin: 3px 0 0;
}

.parked_modal .parked_box ul li p span {
    background: #00000080;
    height: 7px;
    width: 7px;
    display: inline-block;
    border-radius: 100%;
    margin: 0 8px;
}

.parked_modal .parked_box .form-group label {
    font-size: 16px;
    color: #000;
    font-weight: 500;
    margin-bottom: 8px;
}

.parked_modal .parked_box .form-group textarea.form-control {
    border: 1px solid #D9D9D9;
    height: 105px;
    border-radius: 6px;
    font-size: 15px;
    box-shadow: none;
}

.parked_modal .parked_box .form-group .form-control {
    border: 1px solid #D9D9D9;
    height: 50px;
    border-radius: 6px;
    font-size: 15px;
    box-shadow: none;
}

.parked_modal .parked_box .button {
    text-align: end;
    margin-top: 16px;
}

.parked_modal .parked_box .button .btn {
    background: #4A4AF6;
    color: #fff;
    height: 50px;
    font-size: 16px;
    border-radius: 6px;
    max-width: 230px;
    width: 100%;
    font-family: poppins;
    letter-spacing: .5px;
}

.parked_modal .parked_box .button .btn:hover {
    background: #000;
}

.parked_modal .parked_box .grid_box {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
}

.parked_modal .parked_box .upload_box {
    border: 1px solid #D9D9D9;
    padding: 20px;
    border-radius: 6px;
}

.parked_modal .parked_box .upload_box .icon {
    border: 2px dashed #55555580;
    border-radius: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px 8px;
    text-align: center;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.parked_modal .parked_box .upload_box .icon input[type="file"] {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    height: 100%;
    width: 100%;
    cursor: pointer;
    opacity: 0;
}

.parked_modal .parked_box .upload_content {
    cursor: pointer;
}

.parked_modal .parked_box .upload_content i {
    font-size: 24px;
    line-height: 0;
    color: #18473B;
}

.parked_modal .parked_box .upload_content p {
    margin: 6px 0 0;
    font-size: 15px;
    color: #555555CC;
    font-family: poppins;
    font-weight: 500;
}

.parked_modal .parked_box .upload_img h3 {
    font-size: 18px;
    margin: 0 0 12px;
}

.parked_modal .parked_box .upload_box .preview_img {
    position: absolute;
    object-fit: cover;
    object-position: center;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.parked_modal .parked_box .Billing {
    border: 1px solid #D9D9D9;
    padding: 15px;
    border-radius: 6px;
}

.parked_modal .parked_box .Billing h3 {
    font-size: 20px;
    color: #000;
    margin-bottom: 16px;
}

.parked_modal .parked_box .Billing .flex_box {
    gap: 30px;
    align-items: center;
    border-bottom: 1px solid #00000080;
    padding-bottom: 14px;
    margin-bottom: 14px;
}

.parked_modal .parked_box .Billing h4 {
    font-size: 16px;
    color: #3B3B3B;
    font-family: 'Poppins';
    margin: 0;
}

.parked_modal .parked_box .Billing h4 span {
    color: #00000080;
}

.parked_modal .parked_box .Billing h5 {
    font-size: 20px;
    color: #000;
    font-family: 'Poppins';
    margin: 0;
    font-weight: 600;
}

.parked_modal .parked_box .Billing h5 span {
    color: #00000080;
    font-weight: 500;
    font-size: 17px;
}

.device_box .form-group {
    margin-bottom: 15px;
    position: relative;
}

.valet_oprations h2 .form-select {
    width: 100%;
    border: 1px solid #D7D7D7;
    box-shadow: 0px 2px 4px 0px #00000029;
    height: 50px;
    border-radius: 4px;
    font-family: Poppins;
    font-size: 15px;
    color: #000000B5;
    cursor: pointer;
}

.valet_oprations .filter_grid {
    display: grid;
    grid-template-columns: .8fr 1fr;
    gap: 12px;
    max-width: 600px;
    width: 100%;
}

.add_btnn .btn .bi-gear {
    -webkit-text-stroke: inherit;
}

.configuration_sec .set {
    background: #fff;
    padding: 20px;
    box-shadow: 0px 2px 4px 0px #00000029;
    border-radius: 8px;
}

.configuration_sec h2 {
    font-size: 24px;
    font-family: 'Poppins';
    font-weight: 600;
}

.configuration_sec .grid_box {
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-top: 24px;
}

.configuration_sec .box .item {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px 40px;
}

.configuration_sec .box .button {
    display: flex;
    gap: 12px;
    margin-top: 20px;
    justify-content: end;
}

.configuration_sec .box .bg_color {
    background: #f1f1f1;
    padding: 20px 15px;
    border-radius: 10px;
}

.configuration_sec .box h3 {
    font-size: 20px;
    font-family: 'Poppins';
    font-weight: 600;
    margin-bottom: 16px;
}

.configuration_sec .from-group label {
    color: #3B3B3B;
}

.configuration_sec .box {
    font-family: 'Poppins';
    margin-top: 20px;
}

.configuration_sec .from-group label {
    color: #3B3B3B;
    font-size: 15px;
    font-weight: 500;
    margin-bottom: 7px;
}

.configuration_sec .from-group .form-control {
    border: 1px solid #D9D9D9;
    background-color: #FAFAFA;
    height: 47px;
    font-size: 14px;
    color: #000;
    box-shadow: none;
}

.configuration_sec .from-group .form-select {
    border: 1px solid #D9D9D9;
    background-color: #FAFAFA;
    height: 47px;
    font-size: 14px;
    color: #000;
    box-shadow: none;
}

.configuration_sec .box .btn {
    background: #4A4AF6;
    width: 100%;
    color: #fff;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-size: 16px;
    font-weight: 500;
    max-width: 200px;

}

.configuration_sec .box .btn:hover {
    background: #000;
}

.configuration_sec .box .btn i {
    -webkit-text-stroke: .5px;
    line-height: 0;
}

.configuration_sec .box .item p {
    color: #000000B2;
    font-size: 14px;
}

.configuration_sec .right h4 {
    font-size: 16px;
    color: #000000;
    margin: 10px 0 0;
}

.configuration_sec .right h5 {
    font-size: 16px;
    color: #E7000B;
    margin: 10px 0 0;
}

.configuration_sec .right h4 span {
    color: #000000B2;
}

.configuration_sec .rack {
    background: #f1f1f1;
    padding: 15px;
    border-radius: 10px;
    font-family: Poppins;
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: space-between;
}



/* Session Popup - Multiple Image Upload */
.session_popup .upload_img.multi .upload_box {
    width: 100%;
    max-width: 300px;
    margin-top: 16px;
    position: relative;
    overflow: visible;
}
 
.session_popup .upload_img.multi .preview_list {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 14px;
}
 
.session_popup .upload_img.multi .preview_item {
    position: relative;
    width: 130px;
    height: 130px;
}
 
.session_popup .upload_img.multi .preview_item .preview_img {
    position: static;
    width: 100%;
    height: 100% !important;
    object-fit: cover;
    border-radius: 14px;
    display: block;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
    transition: transform 0.2s ease;
}
 
.session_popup .upload_img.multi .preview_item:hover .preview_img {
    transform: scale(1.03);
}
 
.session_popup .upload_img.multi .preview_item .canel {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 9;
    color: #fff;
    cursor: pointer;
    background: #ef4444;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
    transition: transform 0.15s ease;
}
 
.session_popup .upload_img.multi .preview_item .canel:hover {
    transform: scale(1.1);
}
 
.session_popup .upload_img.multi .preview_item .canel i {
    -webkit-text-stroke: .5px;
    line-height: 0;
    font-size: 11px;
}
 
/* Image Lightbox Preview */
.img_lightbox {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.85);
    z-index: 9999;
    align-items: center;
    justify-content: center;
    padding: 30px;
    cursor: zoom-out;
}
 
.img_lightbox.show {
    display: flex;
}
 
.img_lightbox .lightbox_img {
    max-width: 90vw;
    max-height: 85vh;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
    cursor: default;
}
 
.img_lightbox .lightbox_close {
    position: absolute;
    top: 20px;
    right: 25px;
    width: 38px;
    height: 38px;
    background: #ff0000e0;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 16px;
    z-index: 2;
    transition: transform 0.2s ease;
}
 
.img_lightbox .lightbox_close:hover {
    transform: scale(1.1);
}
 
.img_lightbox .lightbox_close i {
    line-height: 0;
}

.configuration_sec .rack.rack {
    margin-top: 10px;
}

.configuration_sec .rack_box {
    max-width: 50%;
    width: 100%;
    margin-top: 24px;
}

.configuration_sec .rack h4 {
    font-size: 16px;
    margin: 0;
}

.configuration_sec .rack h4 span {
    color: #000000B2;
    display: block;
    font-weight: 400;
    margin-top: 6px;
}

.configuration_sec .rack .btn {
    border: 1px solid #4A4AF6;
    padding: 3px 20px;
    color: #4A4AF6;
    font-size: 14px;
    font-weight: 500;
}

.configuration_sec .rack .flex_box {
    align-items: center;
    gap: 10px;
}

.configuration_sec .rack .delete {
    color: #E7000B;
    line-height: 0;
    font-size: 18px;
    cursor: pointer;
}

.configuration_sec .rack .btn:hover {
    background: #4A4AF6;
    color: #fff;
}

.location_form .form-group {
    position: relative;
}

.location_form .form-group .add {
    background: #4A4AF6;
    color: #fff;
    font-family: 'Poppins';
    font-size: 13px;
    padding: 6px 8px;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all .3s;
    cursor: pointer;
    gap: 2px;
}

.location_form .form-group .add:hover {
    background: #000;
}

.location_form .form-group .add i {
    -webkit-text-stroke: .5px;
}

.location_form .form-group ul {
    list-style: none;
    padding: 0;
    margin: 12px 0 0;
    display: flex;
    gap: 12px;
    flex-direction: column;
}

.location_form .form-group ul li {
    background: #fff;
    font-size: 14px;
    font-family: poppins;
    padding: 12px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    gap: 5px;
    font-weight: 500;
    border: 1px solid #D9D9D9;
    justify-content: space-between;
}

.location_form .form-group ul li i {
    -webkit-text-stroke: .1px;
    line-height: 0;
    font-size: 16px;
    color: #F94747;
    cursor: pointer;
}

.location_form .Structure_grid {
    display: grid;
    grid-template-columns: 1.7fr 1fr;
    gap: 12px;
}

.Common_table .table td .paid.blue {
    color: #000000B2;
    border-color: #000000B2;
}

.create_role {
    font-family: 'Poppins';
}

.create_role h2 {
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 20px;
}

.create_role .grid_box {
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.create_role .form-group label {
    color: #3B3B3B;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 7px;
}

.create_role .form-group .form-control {
    border: 1px solid #D9D9D9;
    height: 50px;
    font-size: 14px;
    border-radius: 6px;
}

.create_role h3 {
    font-size: 18px;
    font-weight: 500;
    margin: 24px 0 14px;
}

.create_role .box {
    border: 1px solid #D9D9D9;
    background: #fff;
    border-radius: 6px;
    padding: 20px;
}

.create_role .box h4 {
    color: #3B3B3B;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 10px;
}

.create_role .form-check {
    min-height: inherit;
    padding: 0;
    margin: 0;
}

.create_role .form-check input {
    width: 15px;
    height: 15px;
    box-shadow: none;
    accent-color: #4A4AF6;
}

.create_role .form-check label {
    border: 1px solid #D9D9D9;
    border-radius: 6px;
    padding: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-direction: row-reverse;
    justify-content: space-between;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
}

.create_role .form-check-input:checked {
    background-color: #4A4AF6;
    border-color: #4A4AF6;
}

.create_role .box .item {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.create_role .button .btn {
    background: #4A4AF6;
    height: 50px;
    color: #fff;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    font-size: 16px;
    border: 2px solid #4A4AF6;
    border-radius: 8px;
    max-width: 300px;
}

.create_role .button .btn:hover {
    background: #000;
    border-color: #000;
}

.create_role .button {
    display: flex;
    gap: 10px;
    margin-top: 30px;
    margin-bottom: 20px;
}

.create_role .button .btn.outline {
    background: transparent;
    color: #4A4AF6;
}

.create_role .button .btn.outline:hover {
    background: #000;
    color: #fff;
}

.common_heading .export_btn .dropdown-menu {
    right: 22px !important;
    top: 20px !important;
    left: inherit !important;
    min-width: 170px;
    width: 100%;
    padding: 6px 0;
    border: none;
    opacity: 0;
    transform: translate3d(22px, 4px, 0);
    animation: animdropdown 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
    transition: opacity 0.3s ease, transform 0.3s ease;
    box-shadow: 0px 2px 8px 0px #00000040;
    border-radius: 12px;
    background: #fff;
}

.common_heading .export_btn .dropdown-menu li a {
    padding: 10px 14px;
    display: flex;
    align-items: center;
    text-decoration: none;
    gap: 10px;
    color: #000000;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .5px;
    text-transform: capitalize;
}

.common_heading .export_btn .dropdown-menu li a img {
    height: 22px;
}

.common_heading .export_btn .dropdown-menu li+li {
    border-top: 1px solid #DDDDDD;
}

.common_heading .export_btn {
    display: flex;
    align-items: center;
    gap: 12px;
}

.common_heading .export_btn .form-select {
    height: 45px;
    font-family: Roboto;
    font-size: 16px;
    letter-spacing: .5px;
    border: 1px solid #D7D7D7;
    width: 100%;
    min-width: 166px;
    box-shadow: none;
    cursor: pointer;
}

.common_heading .export_btn .dropdown-menu li a:hover {
    color: #4A4AF6;
}

.report_dashboard .box {
    background: #fff !important;
    border: 1px solid #E5E5E5;
}

.report_dashboard .box h3 img {
    width: 21px;
    object-fit: contain;
}

.Transaction_box {
    border: 1px solid #E5E5E5;
    background: #FFFFFF;
    padding: 20px;
    border-radius: 10px;
    margin-top: 24px;
    min-height: 200px;
}

.Transaction_box h3 {
    font-size: 18px;
    font-weight: 600;
    color: #000;
}

.Transaction_box p {
    text-align: center;
    color: #000000B2;
    font-size: 16px;
    margin: 40px 0 0;
}

.Staff_boxs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-top: 24px;
}

.Staff_boxs .item {
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    background: #fff;
    padding: 20px;
    border-radius: 10px;
}

.Staff_boxs .item h3 {
    font-size: 18px;
    font-weight: 600;
    color: #000;
    margin-bottom: 15px;
}

.Staff_boxs .flex_box {
    gap: 15px;
    align-items: center;
    justify-content: space-between;
}

.Staff_boxs .item h4 {
    font-size: 15px;
    font-weight: 600;
    color: #000;
    margin-bottom: 0px;
}

.Staff_boxs .item p {
    color: #000000B2;
    margin: 0;
    font-size: 15px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 10px;
}

.Staff_boxs .item p span {
    color: #155DFC;
}

.Staff_boxs .flex_box+.flex_box {
    margin-top: 12px;
}

.valet_dashboard .box {
    background: #089A3126;
}

.valet_dashboard .box:nth-child(2) {
    background: #0A84F026;
}

.valet_dashboard .box:nth-child(3) {
    background: #4A3FF326;
}

.valet_dashboard .box:nth-child(4) {
    background: #FC4B0826;
}

.valet_dashboard .box:nth-child(5) {
    background: #E8920D26;
}

.valet_dashboard .box:nth-child(6) {
    background: #F21D2226;
}

.dashboard_box .box .orange {
    color: #FC4B08;
}

.dashboard_box .box .yellow {
    color: #E8920D;
}

.dashboard_location {
    margin-top: 40px;
    font-family: Poppins;
}

.dashboard_location h2 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 8px;
}

.dashboard_location p {
    font-size: 18px;
    color: #00000080;
    margin: 0;
}

.dashboard_location .grid_box {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 24px;
    margin-top: 24px;
}

.dashboard_location .box {
    background: #BFBFF71A;
    box-shadow: 0px 4px 4px 0px #00000029;
    border-radius: 20px;
    padding: 20px 15px;
}

.dashboard_location .box h3 {
    font-size: 18px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 600;
    border-bottom: 1px solid #00000033;
    padding-bottom: 16px;
    margin-bottom: 20px;
}

.dashboard_location .box h3 span {
    background: #4A4AF626;
    height: 50px;
    width: 50px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    color: #4A4AF6;
    font-weight: 600;
    font-size: 18px;
}

.dashboard_location .box .flex_box {
    gap: 10px;
    justify-content: space-between;
}

.dashboard_location .box h4 {
    font-size: 15px;
    color: #00000080;
    margin-bottom: 10px;
}

.dashboard_location .box h5 {
    font-size: 18px;
    color: #000;
    margin-bottom: 0px;
    font-weight: 600;

}

.dashboard_location .box .btn {
    background: #4A4AF6;
    width: 100%;
    height: 50px;
    color: #fff;
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    font-weight: 500;
    font-size: 16px;
}

.dashboard_location .box .btn:hover {
    background: #000;
}

.valet_performance .nav .nav-link {
    color: #575757;
    font-size: 14px;
    font-weight: 600;
    border: 1px solid #D9D9D9;
}

.valet_performance .nav {
    gap: 6px;
}

.valet_performance .nav .nav-link.active {
    color: #4A4AF6;
    background: #4A4AF61A;
    border-color: #4A4AF6;
}

.valet_performance .chart img {
    width: 100%;
}

.valet_performance .chart .flex_box {
    gap: 15px;
    justify-content: space-between;
    margin-top: 24px;
}

.valet_performance .chart .week h3 {
    color: #414141;
    font-size: 14px;
    font-weight: 400;
}

.valet_performance .chart .week {
    background: #FAFAFA;
    padding: 15px;
    border-radius: 10px;
    width: 100%;
}

.valet_performance .chart .week p {
    color: #14A041;
    font-size: 18px;
    margin: 0;
    font-weight: 500;
}

.valet_performance .chart .week p.blue {
    color: #155DFC;
}

.Common_table .table td .avail {
    border: 1px solid #56A756;
    background: #56A75633;
    color: #56A756;
    padding: 5px 14px;
    border-radius: 10px;
    font-weight: 500;
    max-width: 100px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.Common_table .table td .avail.blue {
    background: #338AF033;
    border-color: #338AF0;
    color: #338AF0;
}

.Common_table .table td .avail.orang {
    background: #FDAE1D33;
    border-color: #FDAE1D;
    color: #FDAE1D;
}

.Common_table .table td .avail.purple {
    background: #A655F533;
    border-color: #A655F5;
    color: #A655F5;
}

.Common_table .table td .avail.red {
    background: #FC1F2833;
    border-color: #FC1F28;
    color: #FC1F28;
}

.Common_table .table td .form-switch {
    margin: 0;
    padding: 0;
    min-height: inherit;
}

.Common_table .table td .form-switch input {
    margin: 0;
    float: inherit;
    height: 20px;
    width: 38px;
    box-shadow: none;
    cursor: pointer;
}

.Common_table .table td .form-check-input:checked {
    background-color: #4A4AF6;
    border-color: #4A4AF6;
}

.Common_table .table td .inactive {
    border: 1px solid #68686880;
    background: #6868680D;
    border-radius: 10px;
    padding: 5px 22px;
    color: #686868;
    font-size: 14px;
}

.location_form .form-group label {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.location_form .form-group ul li span {
    background: #388A5C33;
    color: #388A5C;
    font-size: 12px;
    padding: 5px 8px;
    border-radius: 20px;
    font-weight: 400;
    margin-left: 10px;
}

.device_box .form-group .form_check label {
    margin: 0;
    border: 1px solid #D9D9D9;
    display: flex;
    padding: 8px 12px;
    border-radius: 6px;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    transition: all .3s;
}

.device_box .form-group .form_check input {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: #4A4AF6;
}

.device_box .form-group .form_check label span {
    color: #3B3B3B;
    display: flex;
    flex-direction: column;
    font-size: 14px;
    font-weight: 500;
}

.device_box .form-group .form_check label span b {
    font-weight: 400;
}

.device_box .form-group .form_check label+label {
    margin-top: 10px;
}

.device_box .form-group .form_check label:has(input:checked) {
    background-color: #4A4AF61A;
    border-color: #4A4AF6;
}

.price_mode {
    padding: 30px 0;
}

.price_mode .grid_box {
    padding: 0 30px;
}

.price_mode_box {
    margin-top: 24px;
    font-family: poppins;
}

.price_mode_box .item {
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: space-between;
    padding: 16px 25px;
    border-top: 2px solid #E9ECF1;
}

.price_mode_box .item .field {
    display: flex;
    align-items: center;
    gap: 14px;
}

.price_mode_box .item .field .icon h3 {
    font-size: 16px;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.price_mode_box .item .field .icon h3 span {
    color: #4A4A4A;
    font-size: 13px;
    font-weight: 400;
}

.price_mode_box .item .field .form-check-input {
    height: 19px;
    width: 19px;
    box-shadow: none;
    cursor: pointer;
}

.price_mode_box .item .field .form-check-input:checked {
    background-color: #4243F7;
    border-color: #4243F7;
}

.price_mode_box .item .field .icon img {
    height: 40px;
}

.price_mode_box .item .field .icon {
    display: flex;
    align-items: center;
    gap: 12px;
}

.price_mode_box .item .price {
    position: relative;
}

.price_mode_box .item .price label {
    display: flex;
    color: #4A4A4A;
    font-size: 14px;
    margin-bottom: 6px;
    font-weight: 500;
}

.price_mode_box .item .price input {
    border: 1px solid #D9D9D9;
    border-radius: 6px;
    height: 32px;
    font-size: 14px;
    padding: 0 10px 0 35px;
    min-width: 245px;
    width: 100%;
    outline: none;
}

.price_mode_box .item .price span {
    background: #eee;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 30px;
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 6px 0px 0px 6px;
    font-size: 14px;
    color: #4A4A4A;
    font-weight: 500;
}

.price_mode_box .item .price .btn {
    border: 1px solid #4A4AF6;
    border-radius: 6px;
    color: #4A4AF6;
    font-size: 14px;
    font-weight: 500;
}

.price_mode_box .item .price .btn:hover {
    background: #4A4AF6;
    color: #fff !important;
    border-color: #4A4AF6 !important;
}

.price_mode_box .item .price .btn i {
    line-height: 0;
    -webkit-text-stroke: .6px;
    font-size: 13px;
}

.price_mode_box .custom-table {
    width: 100%;
    border: 2px solid #E9ECF1;
    border-radius: 10px;
    overflow: hidden;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
    margin-top: 10px;
    margin-bottom: 20px;
}

.price_mode_box .custom-table thead {
    background: #F3F3F3;
}

.custom-table th {
    padding: 15px;
    font-weight: 500;
    color: #000;
    font-size: 15px;
}

.price_mode_box .custom-table td {
    padding: 15px;
    border-top: 1px solid #E9ECF1;
    background: #fff;
}

.price_mode_box .custom-table input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #EAEAEA;
    border-radius: 6px;
    background: #fafaf9;
    outline: none;
    font-size: 14px;
    color: #4A4A4A;
}

.price_mode_box .price-box {
    display: flex;
    align-items: center;
    border: 1px solid #EAEAEA;
    border-radius: 6px;
    overflow: hidden;
    background: #fafaf9;
}

.price_mode_box .price-box span {
    padding: 9px 14px;
    background: #eee;
}

.price_mode_box .price-box input {
    border: none;
    background: transparent;
}

.price_mode_box .delete-btn {
    background: none;
    border: none;
    color: #FF2020;
    font-size: 18px;
    cursor: pointer;
    padding: 0;
}

.price_mode_box .table-responsive {
    padding: 0 25px;
}

.price_mode .button {
    padding: 0 25px;
}

.price_mode_box .item .price .minutes {
    display: flex;
    align-items: center;
    gap: 8px;
}

.price_mode_box .item .price .minutes input {
    min-width: unset;
    width: 100%;
    padding: 0 10px;
}

.price_mode_box .item .price .minutes span {
    position: static;
    width: auto;
    height: auto;
    background: #eee;
    border-radius: 6px;
    padding: 0 10px;
    height: 32px;
    display: flex;
    align-items: center;
    font-size: 13px;
    color: #4A4A4A;
    font-weight: 500;
    white-space: nowrap;
}

.price_mode_box .item .price .minutes .timezone {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    max-width: 245px;
    width: 100%;
}

.price_mode_box .item .price .minutes .timezone input {
    min-width: inherit;
    padding: 0 10px;
}

.price_mode_box .item .price .form-select {
    border: 1px solid #D9D9D9;
    border-radius: 6px;
    height: 32px;
    font-size: 14px;
    padding: 0 10px;
    width: 100%;
    outline: none;
    box-shadow: none;
}

.price_mode_box .item .price .btn.gray {
    border-color: #949494;
    color: #949494;
}

.Configure_box th {
    color: #3B3B3B;
    font-size: 16px;
    font-weight: 500;
    padding: 14px;
}

.Configure_box td {
    color: #000;
    font-size: 16px;
    font-weight: 400;
    padding: 14px;
    vertical-align: middle;
}

.Configure_box td .form-switch {
    margin: 0;
    padding: 0;
    min-height: inherit;
}

.Configure_box td .form-check-input:checked {
    background-color: #4A4AF6;
    border-color: #4A4AF6;
}

.Configure_box td .form-switch input {
    margin: 0;
    float: inherit;
    height: 20px;
    width: 38px;
    box-shadow: none;
    cursor: pointer;
}

.Configure_box td .price-box {
    display: flex;
    align-items: center;
    border: 1px solid #EAEAEA;
    border-radius: 6px;
    overflow: hidden;
    background: #fafaf9;
}

.Configure_box td .price-box span {
    padding: 7px 12px;
    background: #eee;
    font-size: 14px;
}

.Configure_box td .price-box input {
    width: 100%;
    padding: 6px 12px;
    border: none;
    border-radius: 6px;
    background: #fff;
    outline: none;
    font-size: 14px;
    color: #4A4A4A;
}

.Configure_box th:nth-child(3) {
    width: 42%;
}

.device_box .form-group .form_check.height label {
    margin: 0;
    height: 45px;
}

.device_box .form-group.price-box .symbol {
    background: #eee;
    font-size: 16px;
    position: absolute;
    bottom: 0;
    height: 45px;
    border-radius: 6px 0px 0px 6px;
    width: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.device_box .form-group.price-box .form-control {
    padding-left: 55px;
}

.details_tabs {
    margin-top: 30px;
    font-family: 'Poppins';
}

.details_tabs .nav {
    border-bottom: 2px solid #D9D9DE;
    padding-bottom: 5px;
    margin-bottom: 15px;
    gap: 16px;
}

.details_tabs .nav .nav-link {
    background: transparent;
    color: #595959;
    font-size: 15px;
    font-weight: 500;
    font-family: poppins;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    padding: 6px 8px;
}

.details_tabs .nav .nav-link.active {
    border-color: #4A4AF6;
    color: #4A4AF6;
    font-weight: 600;
}

.details_tabs .detail_box .dashboard_box {
    margin-top: 20px;
}

.details_tabs .detail_box .set .grid_box {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.details_tabs .detail_box .set {
    margin-top: 20px;
}

.details_tabs .detail_box .set .box {
    border: 1px solid #D9D9DE;
    background: #fff;
    border-radius: 10px;
    padding: 20px;
}

.details_tabs .detail_box .set .box h3 {
    font-size: 16px;
    font-weight: 600;
}

.details_tabs .detail_box .set .box h3 {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: space-between;
}

.details_tabs .detail_box .set .box h4 {
    color: #595959;
    font-size: 14px;
    display: grid;
    gap: 20px;
    grid-template-columns: 1fr 1.7fr;
    margin: 0;
}

.details_tabs .detail_box .set .box h4+h4 {
    margin-top: 15px;
}

.details_tabs .detail_box .set .box h4 span {
    color: #000;
    font-size: 15px;
}

.details_tabs .detail_box .set .box .btn {
    border: 2px solid #4A4AF6;
    height: 40px;
    min-width: 120px;
    margin-top: 20px;
    color: #4A4AF6;
    font-size: 16px;
    font-weight: 500;
}

.details_tabs .detail_box .set .box .btn:hover {
    background-color: #4A4AF6;
    color: #fff;
}

.details_tabs .detail_box .set .box .zones_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px;
}

.details_tabs .detail_box .set .box .zones_header h2 {
    font-size: 22px;
    font-weight: 700;
    color: #111;
}

.details_tabs .detail_box .set .box h3 a {
    color: #4A4AF6;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 5px;
}

.details_tabs .detail_box .set .box h3 a i {
    line-height: 0;
    -webkit-text-stroke: .4px;
    font-size: 13px;
}

.details_tabs .detail_box .set .box .zone_row {
    display: grid;
    grid-template-columns: 140px 160px 1fr 45px;
    align-items: center;
    gap: 10px;
    margin-top: 26px;
}

.details_tabs .detail_box .set .box .zone_name {
    font-size: 15px;
    font-weight: 500;
    color: #111;
}

.details_tabs .detail_box .set .box .zone_count {
    font-size: 14px;
    color: #595959;
}

.details_tabs .detail_box .set .box .progress_bar {
    width: 100%;
    height: 8px;
    background: #ececef;
    border-radius: 30px;
    overflow: hidden;
}

.details_tabs .detail_box .set .box .progress_fill {
    height: 100%;
    background: #4A4AF6;
    border-radius: 30px;
}

.details_tabs .detail_box .set .box .percent {
    text-align: right;
    font-size: 14px;
    color: #595959;
}

.details_tabs .detail_box .Staff_box {
    border: 1px solid #D9D9DE;
    background: #fff;
    border-radius: 10px;
    margin-top: 30px;
    padding: 20px;
}

.details_tabs .detail_box .Staff_box h2 {
    font-size: 18px;
    font-weight: 600;
}

.details_tabs .detail_box .Staff_box .grid_box {
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    margin-top: 24px;
}

.details_tabs .detail_box .Staff_box .item {
    border: 1px solid #D9D9D9;
    padding: 24px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.details_tabs .detail_box .Staff_box .item .icon span {
    background: #4A4AF633;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    font-size: 18px;
    color: #4A4AF6;
    font-weight: 500;
}


.details_tabs .detail_box .Staff_box .item h3 {
    font-size: 15px;
    font-weight: 600;
    margin: 0;
}

.details_tabs .detail_box .Staff_box .item h4 {
    margin: 6px 0 0;
    background: #1E5CCC33;
    border-radius: 14px;
    font-size: 13px;
    color: #1E5CCC;
    padding: 7px 10px;
    text-align: center;
}

.details_tabs .detail_box .Staff_box .item h4 svg {
    margin-right: 2px;
}

.details_tabs .detail_box .Staff_box .item h4.gold {
    background: #AD701C33;
    color: #AD701C;
}

.zone_title h2 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 8px;
}

.zone_title p {
    font-size: 16px;
    color: #595959;
    margin: 0;
}

.zone_title .btn {
    background: #4A4AF6;
    color: #fff;
    border-radius: 5px;
    padding: 10px 18px;
    display: flex;
    align-items: center;
    gap: 5px;
    font-family: Roboto;
    font-weight: 500;
    font-size: 16px;
    letter-spacing: .5px;
}

.zone_title .btn:hover {
    background: #000;
}


.zone_title .btn i {
    line-height: 0;
    -webkit-text-stroke: .6px;
    font-size: 16px;
}

.zone_title {
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: space-between;
}

.Parking_zones {
    background: #fff;
    padding: 20px;
    box-shadow: 0px 2px 4px 0px #00000029;
    border-radius: 10px;
}

.Parking_zones .Common_table .table thead tr {
    box-shadow: none;
}

.Common_table .table td .rang_box .progress_bar {
    width: 100%;
    height: 10px;
    background: #D9D9D9;
    border-radius: 30px;
    overflow: hidden;
}

.Common_table .table td .rang_box .progress_fill {
    height: 100%;
    background: #4A4AF6;
    border-radius: 30px;
}

.Common_table .table td .rang_box .percent {
    text-align: right;
    font-size: 14px;
    color: #595959;
}

.Common_table .table td .rang_box {
    display: flex;
    align-items: center;
    gap: 15px;
}

.zone_table {
    min-width: 1350px !important;
}

.price_zone .bg_color {
    background: #fff;
    padding: 20px;
    box-shadow: 0px 2px 4px 0px #00000029;
    border-radius: 10px;
}

.price_zone .alert_box {
    background: #4A4AF61A;
    border: 1px solid #4A4AF6;
    padding: 12px;
    border-radius: 10px;
    margin: 24px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.price_zone .alert_box h3 {
    color: #4A4AF6;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 5px;
    font-weight: 400;
    margin: 0;
}

.price_zone .alert_box h3 i {
    line-height: 0;
    font-size: 18px;
    -webkit-text-stroke: .2px;
}

.price_zone .alert_box h3 b {
    font-weight: 400;
    color: #000;
}

.price_zone .alert_box a {
    text-decoration: none;
    font-size: 14px;
    color: #4A4AF6;
    font-weight: 500;
}

.price_zone .alert_box a img {
    height: 17px;
    margin-right: 8px;
}

.price_zone .bg_color h3 {
    color: #595959;
    font-size: 16px;
    font-weight: 400;
}

.price_zone .cstm_table {
    width: 100%;
    border: 1px solid #D7D7D7;
    border-radius: 10px;
    overflow: hidden;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
    margin-top: 10px;
    margin-bottom: 20px;
}

.price_zone .cstm_table th {
    background: #F5F5F5;
    font-size: 16px;
    color: #191919;
    padding: 18px;
    font-weight: 500;
    width: 18%;
}

.price_zone .cstm_table td {
    padding: 18px;
    color: #000000;
    font-size: 16px;
    vertical-align: middle;
}

.price_zone .cstm_table td {
    padding: 18px;
    color: #000000;
    font-size: 16px;
    border-top: 1px solid #D7D7D7;
}

.price_zone .cstm_table td .action_btn {
    display: flex;
    align-items: center;
    gap: 8px;
}

.price_zone .cstm_table td .action_btn .btn {
    background: #4A4AF6;
    border: 1px solid #4A4AF6;
    color: #fff;
    padding: 0 8px;
    height: 30px;
    font-family: 'Poppins';
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 100px;
    border-radius: 8px;
}

.price_zone .cstm_table td .action_btn .btn.outline {
    background: #fff;
    color: #4A4AF6;
}

.price_zone .cstm_table td .action_btn .btn.disable {
    background: #FF0000;
    border-color: #FF0000;
}

.price_zone .Additional {
    background: #fff;
    padding: 20px;
    box-shadow: 0px 2px 4px 0px #00000029;
    border-radius: 10px;
    margin-top: 24px;
}

.price_zone .Additional h2 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 18px;
}

.price_zone .Additional .grid_box {
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.price_zone .Additional .item {
    border: 1px solid #D7D7D7;
    border-radius: 10px;
    padding: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.price_zone .Additional .item img {
    height: 50px;
}

.price_zone .Additional .item h3 {
    font-size: 16px;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
    font-weight: 400;
}

.price_zone .Additional .item h3 span {
    font-weight: 600;
}

.price_zone .other_price h2 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 18px;
}

.price_zone .other_price {
    margin: 30px 0;
}

.price_zone .other_price .grid_box {
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

.price_zone .other_price .box {
    border: 1px solid #D7D7D7;
    border-radius: 10px;
    padding: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: space-between;
    background: #fff;
}

.price_zone .other_price .box .icon img {
    height: 50px;
}

.price_zone .other_price .box .flex_box {
    gap: 10px;
}

.price_zone .other_price .box h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.price_zone .other_price .box h3 span {
    font-weight: 400;
}

.price_zone .other_price .box h4 {
    font-size: 16px;
    margin: 0;
}

.Notifications_box {
    margin-top: 30px;
    font-family: Poppins;
}

.Notifications_box h2 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 15px;
}

.Notifications_box .box {
    background: #fff;
    border: 1.18px solid #D9D9DE;
    padding: 20px;
    border-radius: 10px;
}

.Notifications_box .box label {
    font-size: 16px;
    font-weight: 500;
}

.Notifications_box .box .form-check-input:checked {
    background-color: #4A4AF6;
    border-color: #4A4AF6;
}

.Notifications_box .box .form-check-input {
    cursor: pointer;
    box-shadow: none;
}

.Notifications_box .box .form-check.form-switch {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #D9D9D9;
    padding: 10px 15px;
    border-radius: 7px;
}

.Security_box {
    margin-top: 30px;
    font-family: Poppins;
}

.Security_box h2 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 15px;
}

.Security_box .box {
    background: #fff;
    border: 1.18px solid #D9D9DE;
    padding: 20px;
    border-radius: 10px;
}

.Security_box .box .flex_box {
    align-items: center;
    gap: 10px;
    justify-content: space-between;
}

.Security_box h3 {
    font-size: 16px;
    font-weight: 500;
    display: flex;
    flex-direction: column;
    gap: 7px;
    margin: 0;
}

.Security_box h3 span {
    color: #595959;
    font-size: 14px;
    font-weight: 400;
}

.Security_box .btn {
    background: #4A4AF6;
    color: #fff;
    border: 2px solid #4A4AF6;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 195px;
    font-size: 16px;
    font-weight: 500;
    border-radius: 8px;
}

.Security_box .btn.outline {
    background: transparent;
    color: #4A4AF6;
}

.Security_box .box .flex_box+.flex_box {
    margin-top: 24px;
}

.Security_box .totp_actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Until the status call lands there's nothing to link or unlink yet — show
   that rather than let the click land silently. */
.Security_box .btn:disabled {
    cursor: not-allowed;
    opacity: .55;
}

/* Hover must not paint a disabled button as if it were actionable. */
.Security_box .btn.outline:disabled:hover {
    background: transparent;
    border-color: #4A4AF6;
    color: #4A4AF6;
}

.Security_box .btn:hover {
    background: #000;
    border-color: #000;
    color: #fff;
}

.account_actions {
    margin: 30px 0;
}

.account_actions h2 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 15px;
}

.account_actions .box {
    background: #fff;
    border: 1px solid #D9D9DE;
    padding: 20px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 15px;
}

.account_actions .btn {
    background: #DA131A1A;
    color: #DA131A;
    border: 2px solid #DA131A;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 195px;
    font-size: 16px;
    font-weight: 500;
    border-radius: 8px;
}

.account_actions .box span {
    color: #595959;
    font-size: 15px;
    font-weight: 500;
}

.account_actions .btn:hover {
    background: #DA131A;
    color: #fff;
}

.device_box .form-group .eye {
    position: absolute;
    bottom: 14px;
    right: 12px;
    cursor: pointer;
}

.device_box .form-group .eye i {
    line-height: 0;
    color: #696969;
    font-size: 18px;
}

.Account_profile .box {
    display: grid;
    grid-template-columns: .2fr 1fr;
    gap: 24px;
    align-items: flex-start;
}

.Account_profile .avatar-upload {
    margin: initial;
}

.Account_profile .button {
    grid-column: 1 / -1;
    display: flex;
    justify-content: end;
    gap: 10px;
    margin-top: 10px;
}

.profile_sec .full_width {
    grid-column: 1 / -1;
}

.Account_profile .button .outline {
    background: transparent;
    color: #4A4AF6;
    border-color: #4A4AF6;
}


/* RAHUL */

.ttp-header-wrapper {
  width: 100%;
  background-color: #000; 
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  box-sizing: border-box;
  
}

/* Centered Container Block */
.ttp-header-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
}

/* Left Logo Section */
.ttp-logo-container {
  display: flex;
  align-items: center;
  gap: 10px;
  user-select: none;
}
.ttp-logo-container img {
height: 36px;
}

.ttp-logo-text-alt {
  color: #ff6b00; /* Accent text color for "TO" */
}

/* Right Side Wrapper */
.ttp-header-right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex: 1;
}
.ttp-header-right .btn {
     border: 1px solid #fff;
    font-size: 18px;
    padding: 8px 28px;
    border-radius: 50px;
}


/* Outer Wrapper with Background Blur/Overlay Effect */
.ttp-footer-wrapper {
  width: 100%;
  background: linear-gradient(rgba(15, 23, 42, 0.92), rgba(15, 23, 42, 0.98)), 
              url('your-parking-bg-image.jpg') center/cover no-repeat; /* Image overlay setup */
  color: #ffffff;
  padding: 40px 0 20px 0;
     font-family: Poppins;
  box-sizing: border-box;
}

/* Responsive Grid Container */
.ttp-footer-container {

  padding: 0 24px;
  
  /* CSS Grid Layout */
  display: grid;
  grid-template-columns: 2fr 1.5fr 1.5fr;
  gap: 40px;
}

/* Base Column Styling */
.ttp-footer-col {
  display: flex;
  flex-direction: column;
}

/* Column 1 Specifics */
.ttp-footer-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
}
.ttp-logo-icon {
  width: 28px;
  height: 28px;
  color: #00e5ff; /* Cyan/Teal shade from image branding */
}
.ttp-logo-text {
  font-size: 24px;
  font-weight: 700;
  color: #ffffff;
}
.ttp-logo-text-alt {
  color: #00e5ff;
}
.brand-desc {
  color: #94a3b8; /* Muted slate text */
  font-size: 16px;
  line-height: 1.6;
  margin: 0 0 20px 0;
}
.social-links {
  display: flex;
  gap: 23px;
}
.social-links  svg {
  height: 25px;
}
.social-links a {
  color: #ffffff;
  width: 20px;
  height: 20px;
  transition: color 0.2s ease;
}
.social-links a:hover {
  color: #00e5ff;
}

/* Typography Headings */
.footer-heading {
  font-size: 18px;
  font-weight: 600;
  margin: 0 0 20px 0;
  color: #ffffff;
}

/* Column 2: Lists */
.footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}
.footer-links li {
  margin-bottom: 12px;
}
.footer-links a {
  color: #cbd5e1;
  text-decoration: none;
  font-size: 15px;
  transition: color 0.2s ease;
}
.footer-links a:hover {
  color: #ffffff;
  padding-left: 2px; /* Subtle hover slide effect */
}
.ttp-footer-logo img{
    height: 38px;
}
/* Column 3: Contact Details */
.contact-info {
  list-style: none;
  padding: 0;
  margin: 0;
}
.contact-info li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 16px;
  font-size: 14px;
  color: #cbd5e1;
  line-height: 1.4;
}
.contact-info a {
  color: #cbd5e1;
  text-decoration: none;
}
.contact-info a:hover {
  color: #ffffff;
}
.contact-icon {
  width: 18px;
  height: 18px;
  color: #cbd5e1;
  flex-shrink: 0;
  margin-top: 2px;
}

/* Bottom Border & Copyright */
.ttp-footer-bottom {
  
  margin: 40px auto 0 auto;
  padding: 20px 24px 0 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  text-align: center;
}
.ttp-footer-bottom p {
  margin: 0;
  font-size: 18px;
  color: #94a3b8;
}


.mob-session img{
    width: 100%;
     max-height: 500px;
}

.summary_activity {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px 20px;
    padding-top: 10px; 
}

.summary_item {
    display: flex;
    flex-direction: column; /* Label upar, Value neeche */
    gap: 4px;
}

.summary_item .label {
    font-size: 18px;
    color: #3B3B3B;
   
    font-weight: 600;
   
}

.summary_item .value {
      font-size: 16px;
    color: #00000080;
    font-weight: 600;
}


/* guest-session */

.session-summary-section {
  position: relative;
  padding: 30px 0 0px;
  overflow: hidden;
}

.session-summary-section .glow {
  position: absolute;
  top: -60px;
  left: 30%;
  width: 600px;
  height: 400px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(47, 107, 255, .16), transparent 65%);
  filter: blur(50px);
  pointer-events: none;
}

.session-summary-section .my-container {
  position: relative;
  z-index: 2;
}

.session-summary-section .session-topline {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}

.session-summary-section .status-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 15px;
  border-radius: 999px;
  background: rgba(25, 224, 208, .18);
  border: 1px solid rgba(25, 224, 208, .28);
  font-size: 13px;
  font-weight: 700;
  color: #5DECA0;
}

.session-summary-section .status-badge .dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #5DECA0;
}

.session-summary-section .session-id {
  font-size: 14px;
  color: #8593B4;
}

.session-summary-section .session-id strong {
  color: #EAF0FF;
  letter-spacing: .02em;
}

.session-summary-section h1 {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: 38px;
  letter-spacing: -.02em;
  margin-bottom: 10px;
}

.session-summary-section .session-subtitle {
  font-size: 16px;
  color: #9CA8C7;
      font-family: 'Poppins';
      margin-bottom: 0px;
}

/* ===================================================================
   PAYMENT MAIN
   =================================================================== */
.valet_profile .grid_box {
        display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 24px;
    align-items: start;
}
.valet_profile .left1{
    border-radius: 22px;
    background: rgba(255, 255, 255, .03);
    border: 1px solid rgba(255, 255, 255, .08);
    padding: 32px;
}
.valet_profile .left1 .box{
   
    padding: 0px;
     background: transparent;
      box-shadow: none;
}
.valet_profile .left1 .box .summary_activity{
        display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    border-bottom: .7px solid #ffffff14;
     padding-bottom: 30px;
  
    
}
.valet_profile .status {
    font-size: 15px;
    color: #fff;
    font-weight: 500;
    font-family: 'Poppins';
    display: flex;
    align-items: center;
    gap: 6px;
    justify-content: space-between;
}
.valet_profile .status span {
    color: #fff;
    font-size: 14px;
}



.valet_profile .left1 .box .summary_item {
    display: flex;
    flex-direction: column;
    gap: 4px;
    border-radius: 14px;
    background: rgba(255, 255, 255, .03);
    border: 1px solid rgba(255, 255, 255, .07);
    padding: 16px 18px;
}
.valet_profile .left .box  .summary_item .label {
    font-size: 11px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #8593B4;
}

.valet_profile .left1 .box .summary_item .value {
      
    font-size: 15px;
    font-weight: 500;
    color: #fff;
    margin-top: 2px;
}
.valet_profile .left1 .vechile-dtl {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 44px;
}
.valet_profile .box .set{
 display: grid;
    grid-template-columns: 1fr;
    gap: 16px;   
}
.left .recent-activity {
    border-radius: 22px;
    background: rgba(255, 255, 255, .03);
    border: 1px solid rgba(255, 255, 255, .08);
    padding: 32px;
    margin-top: 25px;
}


.recent_activity {
    position: relative;
    padding-left: 35px;
    margin-top: 20px;
}


.recent_activity::before {
    content: '';
    position: absolute;
    left: 10px; 
    top: 5px;
    bottom: 5px;
    width: 2px;
    background-color: #1a2438; 
    z-index: 1;
}


.recent_activity .item {
    position: relative;
    
}


.recent_activity .item:last-child {
    padding-bottom: 0;
}

.photo-prompt {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 26px 18px;
    background: #f8fbff2e;
    border: 1px solid #dde7f2;
    border-radius: 16px;
    font-family: 'Poppins';
    border-radius: 16px;
    background: rgba(255, 255, 255, .02) !important;
    border: 1px dashed rgba(255, 255, 255, .16) !important;
    margin-top: 15px;
}

.recent_activity .item::before {
    content: '';
    position: absolute;
    left: -30px; 
    top: 4px; 
    width: 12px;
    height: 12px;
    background-color: #00b4d8; 
    border-radius: 50%;
    z-index: 2; 
    box-shadow: 0 0 0 4px rgba(0, 180, 216, 0.2); 
}


.recent_activity .item:last-child::before {
    background-color: #ff9f1c; 
    box-shadow: 0 0 0 4px rgba(255, 159, 28, 0.2);
}

.valet_profile .right .vechile-pht {
    box-shadow: 0px 2px 4px 0px #00000029;
    background: #fff;
    padding: 22px !important;
    border-radius: 8px;
    margin-bottom: 24px;
    border-radius: 22px;
    background: rgba(255, 255, 255, .03);
    border: 1px solid rgba(255, 255, 255, .08);
    padding: 19px;
}
.recent_activity .item h3 {
    font-size: 15px;
    font-weight: 600;
    color: #ffffff;
    margin-bottom: 4px;
}
.action-state h3 {
    font-size: 17px;
    font-weight: 700;
    color: #fff !important;
    margin: 0;
}

.recent_activity .item .item-ul, 
.recent_activity .item ul {
    display: flex;
    flex-direction: column; 
    gap: 2px;
    padding: 0;
    margin: 0;
    list-style: none;
}
.photo-prompt__text {
     font-size: 18px;
     color: #fff !important;
     font-weight: 600;
    font-family: 'Poppins';
}

.recent_activity .item ul li {
    font-size: 13px;
    color: #8593B4; /* Muted subtitle color */
}


.vechile-dtl .box {
    background-color: #0b0f19; 
    padding: 20px;
    border-radius: 8px;
}


.vechile-dtl .form-group {
    display: flex;
    justify-content: space-between; 
    align-items: center;
    padding-bottom: 12px; 
    border-bottom: 1px solid rgba(255, 255, 255, 0.1); 
}

.vechile-dtl .form-group:last-child {
    border-bottom: none;
}

.vechile-dtl .form-group label {
       color: #8593B4;
    font-size: 13px;
    font-weight: 400;
    margin-bottom: 0;
    width: 100%;
    
}


.vechile-dtl .form-group .form-control[readonly],
.vechile-dtl .form-group .value {
    background: transparent !important;
    border: none !important;
    color: #ffffff !important; 
    font-size: 15px;
    font-weight: 700; 
    text-align: right;
    padding: 0;
    font-family: 'Space Grotesk', sans-serif;
    box-shadow: none !important;
    height: auto !important;
}

.valet_profile .right .box {
    box-shadow: 0px 2px 4px 0px #00000029;
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 24px;
    border-radius: 22px;
    background: rgba(255, 255, 255, .03);
    border: 1px solid rgba(255, 255, 255, .08);
    padding: 32px;
}
.valet_profile .right .pay-row{
     border-bottom: 0px;
}
.pay-row span:last-child {
    color: #ffffff !important; 
     font-size: 15px;
    font-weight: 600; 
}
.pay-row span:first-child {
    color: #C7D2EC !important; 
     font-size: 14px;
    font-weight: 600; 
}
.tip-section {
    margin: 14px 0 4px;
    padding: 14px;
    border-radius: 10px;
    margin-top: 20px;
    border-radius: 14px !important;
    background: rgba(47, 107, 255, .08) !important;
    border: 1px solid rgba(255, 255, 255, .1) !important;
    padding: 18px;
}
.tip-presets .tip-btn {
    flex: 1 1 auto;
    min-width: 56px;
    padding: 8px 10px;
    background: #fff !important;
    color: #374151;
    cursor: pointer;
    text-align: center;
    transition: border-color 0.2s, background 0.2s, color 0.2s;
    height: 46px;
    border-radius: 10px;
    background: rgba(255, 255, 255, .04) !important;
    border: 1px solid rgba(255, 255, 255, .16) !important;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    transition: all .2s ease;
}
.pay-box .total{
    border-top: 1px solid rgba(255, 255, 255, .08) !important;
}
.pay-box .total span:first-child {
    color: #fff !important;
    font-size: 19px;
    font-weight: 600;
}
.pay-box #grandTotal {
    color: #19E0D0 !important;
    font-size: 22px;
    font-weight: 600;
}

.pay-now-btn {
    display: block;
    width: 100%;
    margin-top: 18px;
    
    color: #fff;
    border: none;
    border-radius: 15px !important;
    padding: 13px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    background: #1FA463 !important;
    box-shadow: 0 12px 15px rgba(31, 164, 99, .35);
    border: none;
}
.add-card-form label, .guest-card-form label
 {
    font-size: 13px;
    font-weight: 600;
    color: #495057;
    margin-bottom: 8px !important;
    display: block;
}

.add-card-form input, .guest-card-form input {
    height: 48px !important;
    border-radius: 11px !important;
    background: rgba(255, 255, 255, .04) !important;
    border: 1px solid rgba(255, 255, 255, .12) !important;
    padding: 0 16px;
    color: #EAF0FF !important;
    font-size: 15px;
}
.tip-section h4{
    color: #fff !important; 
     font-size: 16px;
}
.right .payment-heading p{
    display: block;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #19E0D0;
     margin-bottom: 0px;
    
}
.right .payment-heading h4{
       font-family: 'Space Grotesk', sans-serif;
    font-size: 26px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -.02em;
    margin-top: 8px;
     margin-bottom: 16px;
    
}

/* Mobile session responsive overrides */
@media (max-width: 992px) {
  .ttp-header-container {
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 12px;
  }

  .ttp-header-right {
    width: 100%;
    justify-content: flex-start;
  }

  .ttp-header-right .btn {
    width: 100%;
    max-width: 260px;
    padding: 10px 18px;
    font-size: 15px;
  }

  .ttp-footer-container {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .ttp-footer-wrapper {
    padding: 30px 0 20px;
  }

  .ttp-footer-bottom {
    margin: 30px auto 0;
    padding: 20px 24px 0;
  }

  .session-summary-section .my_container {
    padding: 0 16px;
  }

  .session-summary-section .session-topline {
    gap: 12px;
  }

  .session-summary-section h1 {
    font-size: 32px;
  }

  .session-summary-section .session-subtitle {
    font-size: 15px;
  }

  .valet_profile .grid_box {
    grid-template-columns: 1fr;
  }

  .valet_profile .left1 .box .summary_activity {
    grid-template-columns: 1fr;
  }

  .valet_profile .left1 .vechile-dtl {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .valet_profile .box,
  .valet_profile .right .box,
  .valet_profile .left1 {
    padding: 24px;
  }

  .vechile-dtl .form-group {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    align-items: start;
  }

  .recent_activity {
    padding-left: 22px;
  }

  .recent_activity::before {
    left: 5px;
  }

  .recent_activity .item::before {
    left: -18px;
  }

  .summary_activity {
    grid-template-columns: 1fr;
  }

  .summary_item {
    padding: 14px 16px;
  }
}

@media (max-width: 768px) {
  .ttp-header-right .btn {
    width: 100%;
    max-width: 100%;
  }

  .session-summary-section h1 {
    font-size: 28px;
  }

  .status-badge {
    padding: 7px 12px;
    font-size: 12px;
  }

  .session-summary-section .session-id {
    font-size: 13px;
  }

  .pay-box .pay-row {
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px;
  }

  .pay-row span {
    min-width: 0;
  }

  .pay-row span.detail {
    display: block;
    margin-top: 4px;
  }

  .tip-presets {
    gap: 10px;
  }

  .tip-custom-wrap {
    flex-direction: column;
    align-items: stretch;
  }

  .photo-prompt__buttons {
    flex-direction: column;
  }

  .photo-prompt__button {
    width: 100%;
  }

  .add-card-form .form-grid,
  .guest-card-form .form-grid {
    grid-template-columns: 1fr;
  }

  .pay-card-option {
    flex-wrap: wrap;
    align-items: flex-start;
  }
}

@media (max-width: 576px) {
  .ttp-header-wrapper {
    box-shadow: none;
  }

  .ttp-header-container {
    padding: 0 12px;
  }

  .session-summary-section {
    padding-top: 20px;
  }

  .session-summary-section .glow {
    width: 420px;
    height: 280px;
    left: 20%;
  }

  .session-summary-section h1 {
    font-size: 24px;
    line-height: 1.15;
  }

  .valet_profile .box,
  .valet_profile .right .box,
  .valet_profile .left1,
  .left .recent-activity {
    padding: 20px;
  }

  .valet_profile .status {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }

  .ttp-footer-wrapper {
    padding: 24px 0 16px;
  }

  .ttp-footer-container {
    padding: 0 16px;
  }

  .footer-links li {
    margin-bottom: 10px;
  }

  .contact-info li {
    gap: 10px;
  }

  .social-links {
    gap: 14px;
    flex-wrap: wrap;
  }

  .pay-now-btn {
    padding: 14px;
    font-size: 15px;
  }

  .tip-section {
    padding: 16px;
  }

  .tip-presets {
    gap: 6px;
  }

  .tip-presets .tip-btn {
    min-width: auto;
    flex: 1 1 45%;
  }

  .photo-prompt {
    padding: 18px;
  }

  .photo-prompt__text {
    font-size: 15px;
  }

  .mob-session .photo-prompt {
    width: 100%;
  }
}

.add-card-form label, .guest-card-form label {
 
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #AEB9D4 !important;
}
   .gs-main-section {
  padding: 20px 0 60px;
}

.gs-main-section .gs-main {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 24px;
  align-items: start;
}

.gs-main-section .gs-left {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.gs-card {
  border-radius: 22px;
  background: rgba(255, 255, 255, .03);
  border: 1px solid rgba(255, 255, 255, .08);
  padding: 32px;
}

.gs-card h2 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 22px;
}

.gs-card h3 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}

.gs-card hr {
  border: none;
  border-top: 1px solid rgba(255, 255, 255, .08);
  margin: 24px 0;
}

.gs-sum-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.gs-stat {
  border-radius: 14px;
  background: rgba(255, 255, 255, .03);
  border: 1px solid rgba(255, 255, 255, .07);
  padding: 16px 18px;
}

.gs-stat .stat-label {
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #8593B4;
}

.gs-stat .stat-value {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 17px;
  font-weight: 700;
  color: #fff;
  margin-top: 6px;
}

.gs-stat .stat-value.accent {
  color: #19E0D0;
}

.gs-2up {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 44px;
}

.gs-info-col h3 {
  margin-bottom: 14px;
}

.gs-info-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid rgba(255, 255, 255, .07);
  font-size: 14px;
}

.gs-info-row.no-border {
  border-bottom: none;
}

.gs-info-row .k {
  color: #8593B4;
}

.gs-info-row .v {
  color: #EAF0FF;
  font-weight: 700;
  font-size: 15px;
}

/* activity timeline */
.gs-timeline {
  display: flex;
  flex-direction: column;
}

.gs-tl-step {
  position: relative;
  padding: 0 0 30px 30px;
}

.gs-tl-step.last,
.gs-tl-step:last-child {
  padding-bottom: 0;
}

.gs-tl-step .tl-dot {
  position: absolute;
  left: 0;
  top: 3px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #19E0D0;
  box-shadow: 0 0 0 4px rgba(25, 224, 208, .2);
}

.gs-tl-step .tl-dot.blue {
  background: #2F6BFF;
  box-shadow: 0 0 0 4px rgba(47, 107, 255, .2);
}

.gs-tl-step .tl-dot.pending {
  background: transparent;
  border: 2px solid rgba(255, 169, 64, .6);
  box-shadow: none;
}

.gs-tl-step .tl-line {
  position: absolute;
  left: 6px;
  top: 19px;
  bottom: 0;
  width: 2px;
  background: rgba(25, 224, 208, .4);
}

.gs-tl-step .tl-line.grey {
  background: rgba(255, 255, 255, .12);
}

.gs-tl-step .tl-time {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .02em;
  color: #8593B4;
}

.gs-tl-step .tl-time.pending {
  color: #FFB84D;
}

.gs-tl-step .tl-title {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  margin-top: 5px;
}

.gs-tl-step .tl-title.pending {
  color: #FFB84D;
}

.gs-tl-step .tl-desc {
  font-size: 13px;
  line-height: 19.5px;
  color: #9CA8C7;
  margin-top: 6px;
}

/* payment card */
.gs-right .gs-pay-head {
  margin-bottom: 24px;
}

.gs-right .eyebrow {
  display: block;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #19E0D0;
}

.gs-right h2 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 26px;
  font-weight: 700;
  color: #fff;
  letter-spacing: -.02em;
  margin-top: 8px;
}

.gs-charges {
  margin-top: 22px;
}

.gs-charges .charge-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
  font-size: 15px;
}

.gs-charges .charge-row span {
  color: #C7D2EC;
}

.gs-charges .charge-row small {
  font-size: 13px;
  color: #8593B4;
  margin-left: 4px;
}

.gs-charges .charge-row strong {
  color: #fff;
  font-weight: 600;
}

.gs-tip-box {
  margin-top: 20px;
  border-radius: 14px;
  background: rgba(47, 107, 255, .08);
  border: 1px solid rgba(255, 255, 255, .1);
  padding: 18px;
}

.gs-tip-box .tip-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 16px;
}

.gs-tip-box .tip-options {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.gs-tip-box .tip-options button {
  height: 46px;
  border-radius: 10px;
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .16);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: all .2s ease;
}

.gs-tip-box .tip-options button:hover,
.gs-tip-box .tip-options button.active {
  background: rgba(25, 224, 208, .16);
  border-color: rgba(25, 224, 208, .4);
  color: #19E0D0;
}

.gs-tip-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 0;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  font-size: 15px;
}

.gs-tip-row span {
  color: #C7D2EC;
}

.gs-tip-row strong {
  color: #fff;
  font-weight: 600;
}

.gs-total-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 0;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 22px;
  font-weight: 700;
}

.gs-total-row span {
  color: #fff;
}

.gs-total-row strong {
  color: #19E0D0;
}

.gs-card-note {
  font-size: 13px;
  color: #8593B4;
  margin-top: 8px;
}

.gs-form {
  margin-top: 22px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.gs-form .form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.gs-form label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #AEB9D4;
  margin-bottom: 8px;
}

.gs-form input {
  width: 100%;
  height: 48px;
  border-radius: 11px;
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .12);
  padding: 0 16px;
  color: #EAF0FF;
  font-size: 15px;
}

.gs-form input::placeholder {
  color: #5A688A;
}

.gs-form input:focus {
  outline: none;
  border-color: rgba(25, 224, 208, .5);
  background: rgba(255, 255, 255, .06);
}

.gs-pay-btn {
  margin-top: 26px;
  width: 100%;
  height: 54px;
  border-radius: 12px;
  background: #1FA463;
  box-shadow: 0 12px 15px rgba(31, 164, 99, .35);
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  transition: transform .2s ease;
}

.gs-pay-btn:hover {
  transform: translateY(-2px);
}

.gs-secure {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 16px;
  font-size: 12px;
  color: #6E7C9C;
}

/* inspection photos */
.gs-inspection-card {
  margin-top: 24px;
}

.gs-inspection-box {
  margin-top: 22px;
  border-radius: 16px;
  background: rgba(255, 255, 255, .02);
  border: 1px dashed rgba(255, 255, 255, .16);
  padding: 30px;
  text-align: center;
}

.gs-inspection-box p {
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 20px;
}

.gs-inspection-box .store-badges {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}

.gs-inspection-box .store-badges a {
  display: inline-flex;
  flex-shrink: 0;
  text-decoration: none;
  transition: transform .2s ease;
}

.gs-inspection-box .store-badges a:hover {
  transform: translateY(-2px);
}

.gs-inspection-box .store-badges img {
  width: 140px;
  max-width: 100%;
  height: auto;
  display: block;
}




/*  */






@media (max-width: 1399.98px) {
    .price_zone .cstm_table th {
        width: 24%;
    }

    .price_zone .other_price .grid_box {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .price_zone .Additional .grid_box {
        grid-template-columns: repeat(3, 1fr);
    }

    .details_tabs .detail_box .Staff_box {
        margin-top: 20px;
    }

    .details_tabs .detail_box .set .grid_box {
        gap: 16px;
    }

    .details_tabs .detail_box .Staff_box .grid_box {
        gap: 14px;
    }

    .details_tabs .detail_box .Staff_box .item {
        padding: 14px;
    }

    .configuration_sec .box .item {
        gap: 16px;
    }

    .dashboard_location {
        margin-top: 30px;
    }

    .dashboard_location .grid_box {
        grid-template-columns: 1fr 1fr;
        gap: 16px;
        margin-top: 20px;
    }

    .create_role .box {
        padding: 15px;
    }

    .create_role .grid_box {
        gap: 14px;
    }

    .configuration_sec .grid_box {
        gap: 20px;
    }

    .valet_performance .grid_box {
        grid-template-columns: 1fr;
    }

    

    .Retrieval_sec .grid_box {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

@media (max-width: 1199.98px) {

    .account_actions {
        margin: 20px 0;
    }

    .Security_box {
        margin-top: 20px;
    }

    .Notifications_box {
        margin-top: 20px;
    }

    .account_actions h2 {
        font-size: 20px;
        margin-bottom: 12px;
    }

    .Security_box h2 {
        font-size: 20px;
        margin-bottom: 12px;
    }

    .Notifications_box h2 {
        font-size: 20px;
        margin-bottom: 12px;
    }

    .price_zone .Additional .grid_box {
        grid-template-columns: repeat(2, 1fr);
    }

    .price_zone .alert_box a {
        font-size: 13px;
    }

    .price_zone .alert_box h3 i {
        font-size: 16px;
    }

    .price_zone .bg_color h3 {
        font-size: 14px;
    }

    .price_zone .other_price h2 {
        font-size: 20px;
        margin-bottom: 14px;
    }

    .price_zone .Additional h2 {
        font-size: 20px;
        margin-bottom: 14px;
    }

    .price_zone .Additional {
        padding: 20px 15px;
    }

    .price_zone .bg_color {
        padding: 20px 15px;
    }

    .price_zone .cstm_table {
        min-width: 750px !important;
    }

    .price_zone .cstm_table td {
        padding: 14px;
        font-size: 14px;
    }

    .price_zone .cstm_table th {
        padding: 14px;
        font-size: 15px;
    }

    .zone_title .btn {
        font-size: 15px;
    }

    .zone_title p {
        font-size: 14px;
    }

    .zone_title h2 {
        font-size: 20px;
    }

    .details_tabs .detail_box .Staff_box .grid_box {
        grid-template-columns: repeat(2, 1fr);
    }

    .details_tabs .detail_box .set .grid_box {
        grid-template-columns: 1fr;
    }

    .details_tabs {
        margin-top: 20px;
    }

    .price_mode_box .table-responsive {
        padding: 0 15px;
    }

    .location_form .form-group ul li span {
        margin-left: 0;
        display: inline-flex;
        margin-top: 8px;
    }

    .price_mode .button {
        padding: 0 15px;
    }

    .price_mode_box .item {
        padding: 10px 15px;
    }

    .price_mode .grid_box {
        padding: 0 15px;
    }

    .configuration_sec .rack_box {
        max-width: 100%;
    }

    .dashboard_location p {
        font-size: 15px;
    }

    .dashboard_location h2 {
        font-size: 20px;
    }

    .Staff_boxs {
        grid-template-columns: 1fr;
        gap: 16px;
        margin-top: 20px;
    }

    .create_role h2 {
        font-size: 24px;
    }

    .create_role .box .item {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .location_form .Structure_grid {
        grid-template-columns: 1fr;
    }

    .configuration_sec .set {
        padding: 20px 15px;
    }

    .configuration_sec .grid_box {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .all_keys {
        min-width: 750px !important;
    }

    .valet_oprations .filter_grid {
        max-width: 450px;
    }

    .valet_oprations .search_filter {
        max-width: 430px;
    }

    .Retrieval_sec h2 {
        font-size: 22px;
    }
}

@media (max-width: 991.98px) {

    .Account_profile .avatar-upload {
        margin: 10px auto 30px;
    }

    .Account_profile .box {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .price_zone .alert_box a {
        font-size: 15px;
    }

    .price_zone .alert_box {
        margin: 16px 0;
        gap: 12px;
    }

    .price_zone .bg_color {
        padding: 20px 15px;
    }

    .Parking_zones {
        padding: 20px 15px;
    }

    .Common_table .table td .rang_box .progress_bar {
        height: 8px;
    }

    .zone_table {
        min-width: 1200px !important;
    }

    .details_tabs .detail_box .set .box {
        padding: 20px 15px;
    }

    .details_tabs .detail_box .Staff_box {
        padding: 20px 15px;
    }

    .custom-table th {
        padding: 10px;
    }

    .price_mode_box .custom-table td {
        padding: 10px;
    }

    .configuration_sec .box h3 {
        font-size: 18px;
    }

    .dashboard_location .box .btn {
        font-size: 15px;
    }

    .location_form .Structure_grid {
        grid-template-columns: 1.7fr 1fr;
    }

    .Retrieval_sec {
        margin: 30px 0 30px;
    }

    .volate_table {
        min-width: 1700px !important;
    }
    ttp-footer-container {
    grid-template-columns: 1fr 1fr; 
    gap: 30px;
  }
  .brand-col {
    grid-column: span 2; 
  }
  .valet_profile .grid_box {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {

    .Notifications_box .box label {
        font-size: 14px;
    }

    .Security_box h3 {
        font-size: 15px;
    }

    .account_actions .btn {
        font-size: 14px;
        min-width: 155px;
    }

    .Security_box .btn {
        font-size: 14px;
        min-width: 155px;
    }

    .account_actions .box {
        padding: 14px;
    }

    .Notifications_box .box {
        padding: 14px;
    }

    .Notifications_box .box {
        padding: 14px;
    }

    .price_zone .bg_color h3 {
        flex-wrap: wrap;
        justify-content: center;
    }

    .price_zone .alert_box {
        flex-direction: column;
    }

    .zone_title {
        flex-direction: column;
        align-items: start;
    }

    .Configure_box th:nth-child(3) {
        width: 38%;
    }

    .Configure_box td .form-switch input {
        height: 17px;
        width: 32px;
    }

    .Configure_box td {
        font-size: 14px;
        padding: 10px;
    }

    .Configure_box th {
        font-size: 15px;
        padding: 10px;
    }

    .price_mode_box .custom-table {
        min-width: 500px;
    }

    .price_mode_box .item .price .minutes .timezone {
        max-width: 200px;
    }

    .price_mode_box .item .price input {
        min-width: 175px;
    }

    .configuration_sec .box .item {
        gap: 14px;
        grid-template-columns: 1fr;
    }

    .dashboard_location .grid_box {
        grid-template-columns: 1fr;
    }

    .Staff_boxs .item {
        padding: 20px 15px;
    }

    .Staff_boxs .flex_box+.flex_box {
        margin-top: 8px;
    }

    .Staff_boxs .item p {
        font-size: 14px;
    }

    .Staff_boxs .item h4 {
        font-size: 14px;
    }

    .Transaction_box p {
        margin: 30px 0 0;
    }

    .Transaction_box {
        padding: 20px 15px;
        margin-top: 16px;
        min-height: 170px;
    }

    .create_role .button .btn {
        height: 46px;
        font-size: 14px;
    }

    .create_role .button {
        display: grid;
        gap: 14px;
        margin-top: 20px;
        margin-bottom: 10px;
        grid-template-columns: 1fr 1fr;
    }

    .create_role .form-group .form-control {
        height: 46px;
    }

    .create_role .form-group label {
        font-size: 15px;
    }

    .create_role h2 {
        font-size: 22px;
        margin-bottom: 14px;
    }

    .location_form .Structure_grid {
        grid-template-columns: 1fr;
    }

    .configuration_sec .box .btn {
        height: 45px;
        font-size: 14px;
        max-width: 100%;
    }

    .configuration_sec .box .button {
        gap: 8px;
        margin-top: 16px;
    }

    .configuration_sec .box h3 {
        font-size: 18px;
        margin-bottom: 12px;
    }

    .configuration_sec h2 {
        font-size: 22px;
    }

    .valet_oprations .filter_grid {
        max-width: 100%;
    }

    .parked_modal .parked_box .Billing h5 span {
        font-size: 16px;
    }

    .parked_modal .parked_box .Billing h5 {
        font-size: 18px;
    }

    .parked_modal .parked_box .Billing h4 {
        font-size: 15px;
    }

    .parked_modal .parked_box .Billing h3 {
        font-size: 18px;
    }

    .parked_modal .parked_box .upload_box {
        padding: 12px;
    }

    .parked_modal .parked_box .upload_img h3 {
        font-size: 16px;
        margin: 0 0 10px;
    }

    .parked_modal .parked_box .grid_box {
        grid-template-columns: 1fr 1fr;
    }

    .parked_modal .parked_box .form-group textarea.form-control {
        height: 90px;
    }

    .parked_modal .parked_box .form-group label {
        font-size: 15px;
    }

    .parked_modal .parked_box .button .btn {
        font-size: 15px;
        max-width: 200px;
    }

    .parked_modal .parked_box ul li {
        padding-left: 26px;
        font-size: 15px;
    }

    .parked_modal .parked_box ul li::after {
        height: 100%;
        left: 7px;
        top: 23px;
    }

    .parked_modal .parked_box ul li:before {
        width: 16px;
        height: 16px;
    }

    .parked_modal .nav .nav-link {
        font-size: 14px;
        padding: 10px 5px;
    }

    .parked_modal .nav {
        margin-bottom: 24px;
    }

    .parked_modal .modal-body {
        padding: 15px 15px 20px;
    }

    .parked_modal .modal-header {
        padding: 15px;
    }

    .parked_modal .modal-header p {
        margin: 4px 0 0;
        font-size: 14px;
    }

    .parked_modal .modal-header h2 {
        font-size: 18px;
    }

    .valet_performance .box .iteam .details h3 {
        font-size: 15px;
    }

    .valet_performance .box .iteam .number {
        font-size: 20px;
    }

    .session_popup .upload_img .upload_content i {
        font-size: 34px;
    }

    .session_popup .upload_img .upload_label {
        padding: 30px 10px;
    }

    .session_popup .upload_img .upload_box {
        max-width: 240px;
    }

    .session_popup .form-group label {
        font-size: 14px;
    }

    .session_popup .grid_box {
        gap: 10px;
    }

    .session_popup .code_box .vehicle_info {
        gap: 10px;
        flex-direction: column;
    }

    /* The base rule's `flex: 0 0 180px` sizes each chip for the desktop
       horizontal-scroll layout, where 180px is a WIDTH. In this column
       layout that same flex-basis controls HEIGHT instead, forcing every
       chip into a fixed 180px-tall box — reset it to a normal-height,
       full-width row here. */
    .session_popup .code_box .vehicle_info .info {
        flex: 0 0 auto;
        width: 100%;
        white-space: normal;
    }

    .offline_pay .button {
        gap: 10px;
        margin-top: 18px;
    }

    .offline_pay h5 {
        margin-top: 15px;
        padding-top: 15px;
        font-size: 20px;
    }

    .offline_pay .discount_group {
        gap: 7px;
    }

    .offline_pay .discount_btn {
        font-size: 14px;
    }

    .offline_pay .flex_box {
        margin-bottom: 12px;
    }

    .offline_pay p {
        font-size: 16px;
    }

    .offline_pay h3 {
        font-size: 16px;
    }

    .valet_oprations h2 .form-group {
        max-width: 100%;
    }

    .valet_oprations .search_filter .form-group.one {
        grid-column: inherit;
    }

    .valet_oprations .search_filter {
        max-width: 100%;
    }

    .valet_oprations h2 {
        align-items: start;
        margin-top: 16px;
        flex-direction: column-reverse;
    }

    .session_popup .code_box .btn_scan {
        max-width: 100%;
    }

    .session_popup .btn {
        font-size: 16px;
    }

    .session_popup .code_box p {
        font-size: 16px;
        margin: 16px 0 20px;
    }

    .session_popup .code_box img {
        height: 150px;
    }

    .session_popup .nav .nav-link {
        font-size: 14px;
    }

    .session_popup h2 {
        font-size: 20px;
    }

    .session_popup .modal-body {
        padding: 18px 16px;
    }

    .session_popup .modal-header {
        padding: 15px;
    }

    .Retrieval_sec .box p {
        font-size: 14px;
    }

    .Retrieval_sec .box h3 {
        font-size: 18px;
    }

    .Retrieval_sec .grid_box {
        gap: 16px;
        margin-top: 18px;
    }

    .Retrieval_sec .box h3 span i {
        font-size: 14px;
    }

    .Retrieval_sec .box h3 span {
        font-size: 14px;
    }

    .Retrieval_sec .box .btn {
        font-size: 15px;
    }

    .Retrieval_sec .box select {
        font-size: 15px;
    }

    .Retrieval_sec .box .set ul li img {
        height: 17px;
    }

    .Retrieval_sec .box .set ul li {
        font-size: 14px;
        gap: 5px;
    }

    .Retrieval_sec .box .set {
        margin: 16px 0;
        padding: 10px;
    }

    .Retrieval_sec .box {
        border-radius: 8px;
        padding: 16px 12px;
    }

}

@media (max-width: 575.98px) {

    .price_zone .Additional .grid_box {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .details_tabs .detail_box .Staff_box h2 {
        font-size: 16px;
    }

    .details_tabs .detail_box .set .box h4 span {
        font-size: 14px;
    }

    .details_tabs .detail_box .set .box .zone_row {
        grid-template-columns: 100px 100px 1fr 45px;
        margin-top: 18px;
    }

    .price_mode_box .item .price .minutes  .timezone{
        max-width: 100%;
    }

    .price_mode_box .item .price {
        width: 100%;
        text-align: end;

    }

    .price_mode_box .item .price .minutes .timezone {
        max-width: 100%;
    }

    .price_mode_box .item .price label {
        font-size: 15px;
    }

    .price_mode_box .item {
        flex-direction: column;
        align-items: start;
    }

    .valet_performance .chart .flex_box {
        gap: 10px;
        margin-top: 18px;
        flex-wrap: wrap;
    }

    .valet_performance h2 {
        align-items: start;
        flex-direction: column;
    }

    .create_role .button {
        gap: 8px;
    }

    .create_role .box h4 {
        margin-bottom: 14px;
    }

    .create_role .grid_box {
        grid-template-columns: 1fr;
    }

    .location_form .Structure_grid {
        grid-template-columns: 1.7fr 1fr;
    }

    .parked_modal .nav {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }

    .valet_performance .box .iteam .number {
        width: 100%;
        text-align: end;
    }

    .valet_performance .box .iteam .complete {
        width: 100%;
        padding: 10px 8px;
        gap: 6px;
    }

    .valet_performance .box .iteam {
        gap: 15px;
        flex-direction: column;
        align-items: start;
    }

    .valet_profile .box {
        padding: 14px;
        margin-bottom: 20px;
    }

    .valet_profile .recent_activity .item h3 {
        font-size: 16px;
    }

    .valet_profile .box .set {
        grid-template-columns: 1fr;
    }

    .session_popup .code_box h3 span {
        font-size: 13px;
    }

    .session_popup .code_box h3 {
        font-size: 16px;
    }

    .session_popup .code_box h4 {
        font-size: 16px;
    }

    .session_popup .code_box .vehicle_info .info {
        font-size: 14px;
    }

    .session_popup .button {
        gap: 6px;
        margin-top: 18px;
    }

    .session_popup .code_box .show_assign .assign {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .session_popup .grid_box {
        grid-template-columns: 1fr;
    }

    .Retrieval_sec h2 {
        flex-direction: column;
        align-items: start;
        gap: 12px;
    }

    .modal-content {
        margin: 0;
    }

    .session_popup .nav {
        gap: 4px;
    }

    .session_popup .nav {
        gap: 6px;
        margin-bottom: 15px;
    }

    .Retrieval_sec .box .set ul li+li {
        border-left: none;
        padding-left: 0;
    }

    .Retrieval_sec .box .set ul {
        flex-wrap: wrap;
        justify-content: start;
        gap: 12px 20px;
    }
     .ttp-footer-wrapper {
    padding: 20px 0 20px 0;
  }
  .ttp-footer-container {
    grid-template-columns: 1fr; 
    gap: 35px;
  }
  .brand-col {
    grid-column: span 1;
  }
  .footer-heading {
    margin-bottom: 14px;
  }
  .summary_activity {
        grid-template-columns: 1fr; /* Mobile par single column ho jayega */
        gap: 12px;
    }
}

@media (max-width: 480px) {

    .details_tabs .detail_box .Staff_box .grid_box {
        grid-template-columns: repeat(1, 1fr);
    }

    .parked_modal .parked_box .grid_box {
        grid-template-columns: 1fr;
    }

    .parked_modal .nav {
        grid-template-columns: 1fr 1fr;
    }

    .valet_performance h2 {
        margin-bottom: 10px;
        text-align: center;
    }

    .valet_performance .box .iteam .details .clock {
        gap: 6px;
    }

    .valet_performance .box .iteam .details .clock li {
        justify-content: center;
    }

    .valet_performance .box .iteam .number {
        text-align: center;
    }

    .valet_performance .box .iteam .details ul {
        justify-content: center;
        flex-direction: column;
        gap: 2px;
        list-style: none;
    }

    .valet_performance .box .iteam .icon span {
        margin: auto;
    }

    .valet_performance .box .iteam .cont {
        flex-direction: column;
        justify-content: center;
        width: 100%;
        text-align: center;
    }

    .session_popup .code_box .show_assign .assign {
        grid-template-columns: 1fr;
    }
}

/* iOS Safari auto-zooms into any form field whose font-size is under 16px and
   never zooms back out. Our controls are 14-15px throughout, so bump them to
   16px on touch devices only - desktop keeps the original sizing. */
@media (hover: none) and (pointer: coarse) {

    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
    select,
    textarea,
    .form-control,
    .form-select {
        font-size: 16px !important;
    }

    /* Safari also zooms on date/time pickers, which ignore font-size unless the
       inner field text is sized too. */
    input[type="date"]::-webkit-date-and-time-value,
    input[type="time"]::-webkit-date-and-time-value,
    input[type="datetime-local"]::-webkit-date-and-time-value {
        font-size: 16px !important;
    }
}