@font-face {
  font-family: 'Gordita';
  src: url('../fonts/Gordita-Black.otf') format('opentype');
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: 'Gordita';
  src: url('../fonts/Gordita-Light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Gordita';
  src: url('../fonts/Gordita-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Gordita';
  src: url('../fonts/Gordita-Bold.otf') format('opentype');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Gordita';
  src: url('../fonts/Gordita-Regular-Italic.otf Italic.otf') format('opentype');
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: 'Gordita';
  src: url('../fonts/Gordita-Medium-Italic.otf') format('opentype');
  font-weight: 500;
  font-style: italic;
}

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root{
    --primary-color--: #6D0000;
    --secondary-color--: #2B3148; 
}

a{
    text-decoration: none !important;
    font-size: 16px;
    line-height: 1;
    color: #000;
}

ul{
    margin: 0;
    padding: 0;
    list-style: none;
}

body{
    font-family: 'Gordita';
    font-size: 16px;
}

h1,h2,h3,h4,h5,h6{
    color: #000;
    margin-bottom: 0;
}

p{
    font-size: 16px;
    margin: 0;
    color: #000;
}

section{
    overflow: hidden;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.top_header{
    display: none;
}

header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 4%;
    background: var(--primary-color--);
    /* position: sticky; */
    z-index: 99;
    top: 0;
}

header .logo, header .right_side{
    flex: 1;
}

header .logo{
    display: flex;
    align-items: center;
}

header .logo img{
    width: 180px;
}

.location_btn{
    color: #fff;
    display: flex;
    margin-left: 10px;
    padding: 5px 0;
    padding-left: 10px;
    border-left: 1px solid #fff;
    gap: 5px;
}

.location_btn:hover{
    color: #fff;
}

.location_btn{
    font-size: 14px;
}

header nav ul{
    display: flex;
    align-items: center;
    gap: 20px;
}

header nav ul li a{
    font-size: 14px;
    color: #DDDDDD;
    transition: 0.3s;
}

header nav ul li a:hover{
    color: #fff;
}

header nav ul li.drop_btn{
    position: relative;
}

header nav ul li.drop_btn::after{
    content: '\f107';
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    color: #fff;
    display: inline-block;
    transition: 0.3s;
}

header nav ul li.drop_btn:hover::after{
    transform: rotateX(-180deg);
}

header nav ul li.drop_btn:hover a{
    color: #fff;
}

header nav ul li.drop_btn .drop_menu{
    position: absolute;
    top: 100%;
    background: #fff;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    padding: 15px 25px;
    border-radius: 10px;
    padding-left: 15px;
    opacity: 0;
    transform-origin: center top;
    transform: scale(0);
    transition: 0.3s ease-in-out;
    left: -40%;
}

header nav ul li.drop_btn:hover .drop_menu{
    opacity: 1;
    transform: scale(1);
}

header nav ul li.drop_btn .drop_menu ul{
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
}

header nav ul li.drop_btn .drop_menu ul li a{
    color: var(--primary-color--);
}

header nav ul li.drop_btn .drop_menu ul li a:hover{
    color: var(--secondary-color--);
}

header .right_side{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 15px;
}


header .right_side ul li a{
    color: #fff;
}

header .right_side ul li.login_drop_btn{
    position: relative;
}

header .right_side ul li.login_drop_btn .login_drop{
    position: absolute;
    width: 150px;
    right: -20px;
    background: #fff;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    padding: 10px 0;
    border-radius: 10px;
    opacity: 0;
    transform-origin: right top;
    z-index: 9999;
    transform: scale(0);
    transition: 0.3s ease-in-out;
}

header .right_side ul li.login_drop_btn:hover .login_drop{
    opacity: 1;
    transform: scale(1);
}

header .right_side ul li.login_drop_btn .login_drop ul{
    flex-direction: column;
    align-items: inherit;
    gap: 0;
}

header .right_side ul li.login_drop_btn .login_drop ul li a{
    color: var(--secondary-color--);
    padding: 10px 20px;
    display: block;
    transition: .3s;
}

header .right_side ul li.login_drop_btn .login_drop ul li a:hover{
    background: #6d000037;
    color: var(--primary-color--);
}


.search_bar {
    overflow: visible !important;
}

.search_suggestions {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 12px;
    margin-top: 8px;
    max-height: 360px;
    overflow-y: auto;
    z-index: 9999;
    box-shadow: 0 12px 32px rgba(0,0,0,.18);
    padding: 8px;
    animation: suggestion_fade 0.15s ease-out;
}

@keyframes suggestion_fade {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.search_suggestions::-webkit-scrollbar {
    width: 6px;
}
.search_suggestions::-webkit-scrollbar-thumb {
    background: #ddd;
    border-radius: 10px;
}

.suggestion_group_label {
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #8B0000 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 10px 12px 6px;
}

.search_suggestions .suggestion_item {
    display: flex !important;
    align-items: center !important;
    gap: 12px;
    padding: 10px 12px !important;
    text-decoration: none !important;
    border-radius: 8px;
    color: #222 !important;
    white-space: normal;
    transition: background 0.15s ease, padding-left 0.15s ease;
}

.search_suggestions .suggestion_item:hover {
    background: #fdf2f2;
    padding-left: 16px !important;
}

.suggestion_icon {
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #8B0000;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
}

.suggestion_title {
    font-size: 14px !important;
    color: #222 !important;
    line-height: 1.4;
    flex: 1;
}

.suggestion_arrow {
    font-size: 11px;
    color: #bbb;
    opacity: 0;
    transform: translateX(-4px);
    transition: all 0.15s ease;
}

.suggestion_item:hover .suggestion_arrow {
    opacity: 1;
    transform: translateX(0);
    color: #8B0000;
}

/* himanchal code end  */
header .search_bar{
    position: static;
    width: 280px;
    height: 44px;
    display: flex;
    align-items: center;
    background: #fff;
    border-radius: 50px;
    overflow: hidden;
    box-shadow: 0 8px 25px rgba(0,0,0,.12);
    z-index: 999;
}

header .search_bar input{
    flex: 1;
    height: 100%;
    border: none;
    outline: none;
    padding: 0 18px;
    font-size: 15px;
    background: transparent;
}

header .search_bar button{
    width: 45px;
    height: 100%;
    border: none;
    background: var(--primary-color--);
    cursor: pointer;
    border: 2px solid #6D0000;
    transition: .3s;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%; 
}

header .search_bar button:hover {
    background: #6D0000;
    color: white !important;
}

/*button:not(:disabled){
    color: white;
}
*/
.mb_menu_btn{
    cursor: pointer;
    display: none;
    margin-left: 17px;
}

.mb_menu_btn i{
    color: #fff;
    font-size: 32px;
}

.mobile_menu{
    position: fixed;
    height: 100vh;
    width: 300px;
    left: 0;
    top: 0;
    background: #fff;
    overflow: auto;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    z-index: 9999;
    transform: translateX(-100%);
    transition: 0.5s;
}

.mobile_menu.active{
    transform: translateX(0);
}

.mobile_menu > ul{
    padding: 10px;
}

.mobile_menu ul li a{
    display: block;
}

.mobile_menu > ul > li > a{
    padding: 10px 20px;
}

.mobile_menu > ul > li.drop_btn > a.active{
    background: var(--primary-color--);
    color: #fff;
    position: relative;
}

.mobile_menu ul li.drop_menu > a{
    display: flex;
    justify-content: space-between;
}

.mobile_menu ul li.drop_menu > a > i{
    display: none;
}

.mobile_menu ul li.drop_menu > a::after{
    content: '\f107';
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    color: var(--primary-color--);
    padding-left: 5px;
}

.mobile_menu ul li.drop_menu > a.active::after{
    content: '\f106';
    color: #fff;
}

.mobile_menu > ul > li > a:hover{
    color: var(--primary-color--);
}

.mobile_menu .drop_menu ul{
    padding: 10px 20px;
    border: 1px solid #173653;
}

.mobile_menu .drop_menu ul li{
    margin-bottom: 10px;
}

.mobile_menu .drop_menu ul li a{
    color: #111;
}

.mobile_menu .drop_menu{
    display: none;
}

.mobile_menu > ul > li{
    border-bottom: 1px solid var(--primary-color--);
}

.mobile_menu > ul > li:last-child{
    border: none;
}

.mobile_menu .nav_close_btn{
    padding: 10px 20px;
    border-bottom: 1px solid #000;
    /* margin-bottom: 20px; */
    text-align: end;
}

.mobile_menu .nav_close_btn a{
    font-size: 24px
}

.v_scroll{
    display: none;
    flex-wrap: nowrap;
    gap: 10px;
    padding: 5px 10px;
    overflow: auto;
}

.v_scroll .filter_btn{
    font-size: 14px;
    padding: 5px 12px;
}

.banner_content{
    max-width: 1032px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    padding: 0 20px;
}

.banner_content h1{
    /*font-family: 'Noto Sans Devanagari', sans-serif;*/
     /*font-family: "Hind", sans-serif;*/
      font-family: "Mukta", sans-serif !important;
       font-weight: 800;
  font-style: normal;
    font-size: 24px;
    color: #fff;
    margin-top: 8px;
}

.bg_primary{
    background: var(--primary-color--);
    padding-bottom: 30px;
}

.banner img{
    border-radius: 20px;
    /*height: 500px;*/
    /* aspect-ratio: 5/2; */
    /* object-fit: cover; */
    /* aspect-ratio: 2 / 1; */
     width: 100%;
    height: 380px;
    overflow: hidden;
    position: relative;
}

section.bg_primary {
    position: relative;
}

.heading{
    font-weight: 600;
    font-size: 36px;
    color: #121212;
}

.view_all_btn{
    font-size: 20px;
    color: #FE5D5D;
    text-decoration: underline !important;
    transition: .3s;
}

.view_all_btn:hover{
    color: var(--secondary-color--);
}

.view_all_btn_h_w:hover{
    color: #fff;
}

.filter_btn{
    display: inline-block;
    color: #121212;
    font-size: 16px;
    border: 1px solid #D9D9D9;
    border-radius: 10px;
    padding: 10px 15px;
    transition: .3s;
}

.filter_btn i{
    padding-right: 5px;
}

.filter_btn:hover{
    background: #121212;
    color: #fff;
}

.filter_btns_flex{
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.show_cards{
    border: 1px solid #D9D9D9;
    border-radius: 15px;
    overflow: hidden;
    position: relative;
    height: 100%;
    background-color: #6D0000;
}

.show_cards .show_cat{
    position: absolute;
    right: 0;
    top: 20px;
    display: inline-block;
    padding: 14px 13px;
    border-radius: 50px 0 0 50px;
    background: #B50000;
    color: #fff;
    font-size: 10px;
}

.show_cards .show_img{
    overflow: hidden;
}

.show_cards .show_img img{
    aspect-ratio: 1/1;
    object-fit: cover;
    object-position: top;
    transition: 1s;
}

.show_cards:hover .show_img img{
    transform: scale(1.1);
}

.show_cards .content{
    padding: 10px;
    padding-bottom: 15px;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.show_cards .content h3{
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 10px;
    color: white !important;
    /* clamp title to 2 lines so different lengths don't push dates around */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 44px; /* ~2 lines at 18px/1.2 line-height, adjust if needed */
}

.show_cards .content p{
    font-size: 14px;
    color: white;
    margin-top: auto; /* pushes date to bottom of the content area */
}

#natak_result .col-lg-3,
.show_slider .slick-slide{
    height: auto;
    display: flex;
}

#natak_result .col-lg-3 > a,
.show_slider .slick-slide > div{
    display: flex;
    width: 100%;
}

#natak_result .col-lg-3 > a > .show_cards,
.show_slider .slick-slide .show_cards{
    width: 100%;
}


.bg_secondary{
    background: var(--secondary-color--);
}

.show_slider{
    position: relative;
}

.show_slider .slick-arrow{
    position: absolute;
    width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    color:  #121212;
    border: none;
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
}

.show_slider .slick-arrow:hover{
    background: #FE5D5D;
    color: #fff;
}

.show_slider .slick-arrow.slick-prev{
    left: 0;
}

.show_slider .slick-arrow.slick-next{
    right: 0;
}

.mid_banner img{
    border-radius: 15px;
    aspect-ratio: 13/5;
    object-fit: cover;
}

.featured_card .show_img img{
    aspect-ratio: 1/1;
}

.featured_slider .slick-list{
    overflow: hidden;
}

.event_card{
    position: relative;
    border-radius: 15px;
    overflow: hidden;
}

.event_card::before{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 31.73%, rgba(0, 0, 0, 0.47) 100%);
    z-index: 2;
}

.event_card img{
    aspect-ratio: 8/4;
    object-fit: cover;
}

.event_card .get_btn{
    position: absolute;
    bottom: 10%;
    right: 5%;
    z-index: 3;
}

.get_btn{
    display: inline-block;
    padding: 10px 20px;
    background: #B50000;
    font-size: 20px;
    transition: 0.3s;
    color: #fff;
    border-radius: 10px;
}

.get_btn i{
    padding-left: 5px;
}

.get_btn:hover{
    transform: scale(1.1);
}

.event_slider .slick-list{
    overflow: hidden;
}


/*footer*/
footer{
    background: #2C0000;
}

.footer_top{
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
    align-items: center;
    justify-content: space-between;
}

.footer_top .content p{
    font-size: 20px;
    color: #fff;
}

.contact_btn{
    display: inline-block;
    padding: 10px 20px;
    font-size: 16px;
    background: #B50000;
    color: #fff;
    border-radius: 10px;
    transition: .3s;
}

.contact_btn:hover{
    transform: scale(1.1);
    color: #fff;
}

.bg_dark{
    background: #521717;
}

.customer_care{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

.customer_care i{
    font-size: 36px;
    color: #fff;
}

.customer_care p{
    font-size: 20px;
    color: #fff;
}

.footer_heading{
    font-size: 20px;
    color: #fff;
    font-weight: 600;
    /*text-align: left;*/
    margin-left: 93px;
}

.f_content p{
    color: #FFFFFF;
    font-size: 20px;
}

.f_s ul{
    display: flex;
    gap: 10px;
}

.f_s ul li a{
    width: 31px;
    height: 31px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    color: #fff !important;
    font-size: 14px;
    transition: 0.3s;
}

.f_s ul li a:hover{
    background: #521717;
    color: var(--primary-color--);
}

.footer_menu{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.footer_menu li a{
    color: #fff;
    transition: .3s;
}

.footer_menu li a:hover{
    color: #B50000;
}

.border_1{
    background: #F0F0F01A;
    opacity: 1;
}

.f_14{
    font-size: 14px;
}

.featured_slider .slick-track{
    display: flex;
}

.featured_slider .slick-track .slick-slide{
    height: auto;
}

.mb_menu{
    position: sticky;
    bottom: 0;
    width: 100%;
    z-index: 99;
    background: #fff;
    display: none;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.mb_menu ul{
    display: flex;
}

.mb_menu ul li{
    flex: 1;
}

.mb_menu ul li:not(:last-child){
    border-right: 1px solid #878787;
}

.mb_menu ul li a{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    color: #000;
    padding: 10px 0;
}

.mb_menu ul li a.active{
    color: #E10101;
}

.mb_menu ul li a{
    font-size: 11px;
}

.mb_menu ul li a i{
    font-size: 16px;
    color: #878787;
}

.mb_menu ul li a.active i{
    color: #E10101;
}

.show_slider .slick-track{
    display: flex;
}

.show_slider .slick-track .slick-slide{
    height: auto;
}

.inner_heading{
    color: #121212;
    font-size: 30px;
    font-weight: 600;
}

.filter_btns_flex li{
    position: relative;
}

.filter_btns_flex li .filter_drop_down{
    position: absolute;
    z-index: 2;
    width: 575px;
    background: #fff;
    border: 1px solid #DDDDDD;
    box-shadow: 0px 4px 3.8px 0px #0000000D;
    border-radius: 15px;
    padding: 20px;
    left: 0;
    top: 110%;
    transform: translateY(-20px);
    visibility: hidden;
    opacity: 0;
    transition: 0.3s;
}

.filter_btns_flex li .filter_drop_down.active{
    transform: translateY(0);
    visibility: visible;
    opacity: 1;
}

.filter_btns_flex li .filter_drop_down p{
    color: #121212;
    font-size: 18px;
    font-weight: 600;
}

.new_filter_btns_flex{
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
}

.new_label {
    display: inline-block;
    color: #121212;
    font-size: 14px;
    border: 1px solid #D9D9D9;
    border-radius: 10px;
    padding: 10px 15px;
    transition: .3s;
    cursor: pointer;
}

.new_label input{
    display: none;
}

.new_label:has(input:checked) {
  background: #121212;
  color: #fff;
}

.clear_btn{
    display: inline-block;
    background: #EDEDED;
    color: #121212;
    border-radius: 10px;
    font-size: 20px;
    border: none;
    padding: 5px 20px;
}

.btn_flex{
    display: flex;
    gap: 20px;
}

.apply_btn{
    display: inline-block;
    background: linear-gradient(90deg, #B50000 0%, #E80C0C 98.56%);
    color: #fff;
    border-radius: 10px;
    font-size: 20px;
    border: none;
    padding: 5px 20px;
}

.book_now_form button {
    width: 100%;
    padding: 10px 20px;
    background: linear-gradient(90deg, #B50000 0%, #E80C0C 98.56%);
    color: #fff;
    font-size: 16px;
    border-radius: 5px;
    border: none;
    /* border-radius: 0 20px 20px 0; */
}

.new_sub_btn{
    width: 100%;
    padding: 10px 20px;
    background: linear-gradient(90deg, #B50000 0%, #E80C0C 98.56%);
    color: #fff;
    font-size: 16px;
    border-radius: 5px;
    border: none;
    /* border-radius: 0 20px 20px 0; */
}

.location_modal .modal-content{
    border-radius: 20px;
    padding: 20px 20px;
}

.location_modal .modal-header{
    border: none;
    text-align: center;
    position: relative;
}

.location_modal .modal-header img{
    width: 140px;
    margin: 0 auto;
}

.location_modal .modal-header .btn-close{
    position: absolute;
    opacity: 1;
    right: 11px;
    top: 20px;
    border: 1px solid;
    border-radius: 50%;
    width: 8px;
    height: 8px;
    background-size: 10px;
}

.location_modal .location_heading h3{
    font-size: 24px;
    display: inline-block;
    position: relative;
    padding-bottom: 5px;
}

.location_modal .location_heading h3::before{
    content: '';
    position: absolute;
    width: 120%;
    height: 4px;
    background: var(--primary-color--);
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}

.location_modal .modal-body ul.locations{
    display: flex;
    flex-wrap: wrap;
    gap: 10px 0;
}

.location_modal .modal-body ul.locations li{
    width: 50%;
    padding: 0 5px;
}

.location_modal .modal-body ul.locations li a{
    padding: 15px 0;
    display: block;
    color: #000;
    border: 1px solid #DEDEDE;
    border-radius: 5px;
    text-align: center;
    transition: 0.3s;
}

.location_modal .modal-body ul.locations li a:hover, .location_modal .modal-body ul.locations li a.active{
    color: var(--primary-color--);
    border: 1px solid var(--primary-color--);
}

.book_now_form .input-group{
    background: none;
    border-bottom: 1px solid #dedede;
    border-radius: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.book_now_form .input-group i{
    color: var(--primary-color--);
    font-size: 22px;
}

.book_now_form .input-group-text{
    background: none;
    border: none;
}

.book_now_form .form-control{
    border: none;
    box-shadow: none !important;
    padding-left: 0;
    font-size: 12px;
}

.book_now_form .form-label{
    font-weight: 500;
}

.terms_modal{
    color: #676767;
    text-align: center;
    font-size: 10px;
}

.terms_modal a{
    color: #53aafc;
    text-decoration: underline !important;
    font-size: 10px;
}

.location_modal h5{
    font-weight: 500;
    font-size: 16px;
}

.location_modal .modal-header{
    position: relative;
    justify-content: center;
}

.otp-input-container {
    display: flex;
    justify-content: space-between;
    max-width: 100%;
    margin: auto;
}

.otp-input {
    width: 100%;
    /* height: 40px; */
    text-align: center;
    font-size: 22px;
    margin: 5px;
    border: 1px solid #dedede;
    border-radius: 4px;
    aspect-ratio: 1 / 1;
}

.otp-input:focus {
    border-color: var(--primary-color--);
    outline: none;
    box-shadow: 0 0 5px var(--primary-color--);
}

.resend_otp a{
    color: var(--primary-color--);
    text-decoration: underline !important;
}

.change_num{
    color: var(--primary-color--) !important;
    text-decoration: underline !important;
    font-size: 12px;
}

.otp_num_1{
    font-size: 10px;
    color: #676767;
}

.tabs_bg{
    background: #F6F6F6;
}

.nav_pro{
    border: none !important;
}

.nav-tabs.nav_pro .nav-link{
    border: none !important;
    font-size: 14px;
    color: #121212;
    border-radius: 0;
}

.nav_pro.nav-tabs .nav-item.show .nav-link, .nav_pro.nav-tabs .nav-link.active{
    border: none !important;
    background: #888888;
    color: #fff;
}

.profile_img{
    width: 150px;
    position: relative;
    background: #EDEDED;
    padding: 5px;
    border-radius: 50%;
}

.profile_img img{
    border-radius: 50%;
}

.profile_img .edit_profile_btn{
    position: absolute;
    width: 40px;
    height: 40px;
    border: 2px solid #fff;
    background: #FF4040;
    color: #fff;
    border-radius: 50%;
    display: grid;
    place-items: center;
    right: 0;
    bottom: 5%;
    cursor: pointer;
}

.pro_name{
    font-size: 30px;
    color: #121212;
    font-weight: 600;
}

.a_det{
    font-size: 18px;
    color: #121212;
    font-weight: 600;
}

.form_label{
    font-size: 18px;
    /* font-weight: bold; */
    color: #121212;
}

.form_label_bold{
    font-weight: bold;
}

.form_control{
    background-color: #fff !important;
    border: 1px solid #DDDDDD;
    outline: none !important;
    box-shadow: none;
    color: #000 !important;
    padding-top: 10px;
    padding-bottom: 10px;
    accent-color: #fff;
}

.form_control:focus{
    border-color: var(--primary-color--);
    outline: none;
    box-shadow: 0 0 5px var(--primary-color--);
    background-color: #111;
}

.form_control:disabled, .form_control[readonly] {
    background-color: #e9ecef00;
    opacity: 1;
    color: #0000007d !important;
}

.sub_new_btn{
    width: 100%;
    padding: 10px 20px;
    background: linear-gradient(90deg, #B50000 0%, #E80C0C 98.56%);

    color: #fff;
    font-size: 20px;
    border-radius: 5px;
    border: none;
    font-weight: 600;
}

.edit_btn{
    width: 100%;
    padding: 10px 20px;
    background: var(--primary-color--);
    color: #fff;
    font-size: 20px;
    border-radius: 5px;
    border: none;
}

.edit_btn.cancel_btn{
    background: var(--primary-color--);
    color: #fff;
}

.booking_card{
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    gap: 25px;
}

.booking_card .content{
    width: 70%;
    border: 2px solid #EAEAEA;
    padding: 20px 40px;
    border-radius: 10px;
    /* border-right: none; */
    flex: 0 0 auto;
    position: relative;
}
.booking_card .content::before{
    content: '';
    position: absolute;
    width: 31px;
    height: 100%;
    right: 0;
    background: #fff;
    transform: translateX(100%);
    z-index: 1;
    top: 0;
}

.booking_card .content::after{
    content: '';
    position: absolute;
    width: 2px;
    height: 90%;
    right: 0;
    border-left: 2px dashed #EAEAEA;
    top: 0;
    z-index: 1;
    transform: translateX(15px) translateY(10px);
}

.booking_card .content .egg_circle{
    width: 31px;
    height: 20px;
    background: #fff;
    border: 2px solid #EAEAEA;
    position: absolute;
    right: -30px;
    z-index: 2;
}

.booking_card .content .egg_circle.egg_circle_1{
    top: 3px;
    border-top: none;
    border-radius: 0 0 50% 50%;
}

.booking_card .content .egg_circle.egg_circle_2{
    bottom: 3px;
    border-bottom: none;
    border-radius: 50% 50% 0 0;
}

.booking_card .content h2{
    font-weight: 700;
    font-size: 22px;
    color: #121212;
}

.booking_card .content .time_date{
    font-size: 14px;
    font-weight: 600;
    color: #121212;
}

.booking_card .content .address{
    font-size: 11px;
    color: #121212;
}

.booking_card .content .qty{
    font-size: 12px;
    color: #121212;
}

.booking_card .content .seat_no{
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 10px 0;
}

.booking_card .content .seat_no img{
    width: 20px;
}

.booking_card .content .seat_no p{
    font-size: 15px;
    font-weight: 600;
    color: #121212;
}

.booking_card .content ul{
    display: flex;
    flex-direction: column;
    gap: 17px;
}

.booking_card .content ul li{
    display: flex;
    justify-content: space-between;
    line-height: 1;
}

.booking_card .content ul li span{
    font-size: 16px;
    color: #121212;
}

.booking_card .content ul li span small{
    font-size: 9px;
    color: #9A9A9A;
}

.booking_card .content .total_amt p{
    font-weight: 600;
    color: #121212;
    font-size: 14px;
    display: flex;
    justify-content: space-between;
}

.booking_card .booking_img{
    width: 30%;
    border: 2px solid #EAEAEA;
    padding: 20px 10px;
    border-radius: 10px;
    /* border-left: none; */
    /* flex: 0 0 auto; */
}

.booking_card .booking_img img{
    aspect-ratio: 2/2.7;
    object-fit: cover;
    border-radius: 10px;
}

.dash_border{
    border-top: 2px dashed #3D5685E0;
    background: none;
}

.booking_info{
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
}

.booking_info p{
    font-size: 14px;
    color: #676767;
    line-height: 1.1;
}

.booking_info p span{
    font-size: 11px;
}

.payment_status{
    display: flex;
    align-items: center;
    gap: 10px;
}

.payment_status p{
    font-size: 16px;
    line-height: 1;
}

.payment_status p span{
    font-size: 11px;
}

.payment_status.successful_p p span{
    color: #10BD00;
}

.payment_status.failed_p p span{
    color: #FF4040;
}

.payment_status i{
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    flex: 0 0 auto;
}

.payment_status.successful_p i{
    background: #10BD00;
    color: #fff;
}

.payment_status.failed_p i{
    background: #FF4040;
    color: #fff;
}

.no_more{
    font-size: 18px;
    color: #676767;
    font-weight: 600;
}

.natak_detail_bg{
    position:relative;
    z-index:1;

    width:100%;
    height:26vw;
    min-height:400px;
    max-height:600px;

    display:flex;
    align-items:center;

    margin-bottom:-80px;
    padding-bottom:120px !important;

    overflow:hidden;
}


/* overlay */
/* .natak_detail_bg::before{
    content:"";
    position:absolute;
    inset:0;
background:
linear-gradient(to right, rgb(24,24,24) 45%, rgb(24,24,24) 39.5%, rgb(24,24,24) 41.5%, rgba(24,24,24,0.04) 85%, rgb(24,24,24) 95%) 0px 0px no-repeat,
url("https://php1.dvworks.in/marathi_natak/uploads/natak/New_Project_(1).webp") 90% 0px / 52vw min(26vw,500px) no-repeat;
    z-index:1;
} */



/* background image */
.natak_detail_bg_img{
    position:absolute;
    top:0;
    right:0;
    width:100%;
    height:100%;
    z-index:0;
}


.natak_detail_bg_img img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:right center;
}

/* content */
.natak_detail_bg .container{
    position:relative;
    z-index:2;
}

.natak_name h1{

    font-size:38px;
    line-height:1.2;
    font-weight:600;

    color:#fff;

}



.natak_name p{
    font-size:24px;
    color:#fff;
}



.n_details p{

    font-size:15px;
    line-height:1.6;

    color:#fff;

}


.save_btn{
    display: inline-block;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    border: 1px solid #D9D9D9;
    color: #fff;
    border-radius: 50%;
}

.save_btn:hover{
    color: #fff;
}

.b_t{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
}

.n_detail_img{
    width: 100%;
    height: 500px;
}

.n_detail_img img{
    border-radius: 30px;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.border_2{
    background: #EAEAEA;
    opacity: 1;
}

.natak_details{
    padding: 40px 30px;
    border: 1px solid #E5E5E5;
    border-radius: 15px;
    background: #fff;
}

.price p{
    font-size: 12px;
    color: #676767;
}

.price h3{
    font-size: 20px;
    font-weight: 600;
}

.status{
    font-size: 15px;
    color: #1BA200;
    display: block;
}

.natak_details .content h2{
    font-size: 20px;
    font-weight: 600;
    color: #121212;
}

.natak_details .content p{
    color: #797979;
    font-size: 15px;
}

.natak_details_info{
    display: flex;
    flex-wrap: wrap;
    gap: 20px 0;
}

.natak_details_info .info_card{
    width: 50%;
}

.info_card{
    display: flex;
    gap: 15px;
    align-items: flex-start;
}

.info_card i{
    color: #676767;
    font-size: 16px;
}

.info_card p{
    color: #121212;
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
}

.info_card p span{
    font-weight: 400;
    color: #676767;
    display: block;
    margin-top: 2px ;
}

.artists_card{
    display: flex;
    gap: 10px;
    align-items: center;
}

.artists_card img{
    width: 110px;
    object-fit: cover;
    aspect-ratio: 1/1;
    border-radius: 10px;
    filter: grayscale(100%);
}

.artists_card p{
    font-size: 16px !important;
    color: #121212 !important;
}

.artists_card p span{
    font-size: 14px !important;
    color: #676767 !important;
    display: block;
}

.cast_info p{
    color: #121212 !important;
    margin-bottom: 8px;
}

.disclaimer_list{
    /* display: flex;
    flex-direction: column;
    gap: 15px; */
    list-style: disc;
    margin-left: 20px;
}

.disclaimer_list li{
    font-size: 16px;
    color: #121212;
    margin-bottom: 15px;
}

.read_more_di{
    font-size: 17px;
    font-weight: 600;
    text-decoration: underline !important;
}

.natak_side_bar{
    border: 1px solid #E5E5E5;
    background: #fff;
    border-radius: 15px;
    padding: 40px 20px;
    position: sticky;
    top: 100px;
}

.book_tickets{
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 20px;
    background: linear-gradient(90deg, #B50000 0%, #E80C0C 98.56%);
    border: none;
    color: #fff;
    width: 100%;
    padding: 10px 20px;
    border-radius: 10px;
    transition: .3s;
}

.book_tickets:hover{
    color: #fff;
}

.upcoming_show h3{
    font-size: 20px;
    font-weight: 600;
    color: #121212;
}

.show_list p{
    font-size: 16px;
    font-weight: 600;
    color: #121212;
}

.show_list span{
    color: #676767;
}

.breadcrumb_new ul{
    display: flex;
    gap: 10px;
}

.breadcrumb_new ul li{
    font-size: 14px;
    color: #121212;
}

.back_btn{
    background: none;
    border: none;
    color: #676767;
    font-size: 20px;
}

.back_sec{
    position: relative;
}

.back_sec .back_btn{
    position: absolute;
    left: 0;
    top: 5px;
}

.your_ticket_card{
    background: #F9F9F9;
    overflow: hidden;
}

.your_ticket_card .your_ticket_card_box{
    padding: 20px;
    border: 1px solid #EAEAEA;
    border-radius: 20px 20px 0 0;
    border-bottom: none;
}

.your_ticket_card .ticket_card_b{
    border: 1px solid #EAEAEA;
    border-radius: 0 0 20px 20px;
    border-top: none;
}

.your_ticket_card .your_ticket_info{
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

.your_ticket_card .your_ticket_info img{
    width: 105px;
    aspect-ratio: 1/1.4;
    object-fit: cover;
    border-radius: 10px;
}

.your_ticket_card .your_ticket_info h3{
    font-size: 22px;
    font-weight: 600;
    color: #121212;
}

.your_ticket_card .your_ticket_info p{
    font-size: 14px;
    color: #121212;
    margin: 5px 0;
}

.your_ticket_card .your_ticket_info span{
    font-size: 12px;
    color: #3D3D3D;
    line-height: 1.3;
    display: block;
}

.support_btn{
    display: block;
    padding: 10px 20px;
    background: #FFFFFF;
    font-size: 10px;
    color: #101010;
    text-align: center;
    transition: .3s;
    border-radius: 50px;
}

.support_btn:hover{
    background: var(--primary-color--);
    color: #fff;
}

.ticket_seat .qty{
    font-size: 15px;
    font-weight: 600;
    color: #121212;
}

.seat_no{
    display: flex;
    justify-content: center;
    gap: 8px;
    align-items: center;
}

.seat_no span{
    font-size: 20px;
    font-weight: 600;
    color: #121212;
}

.seat_no img{
    width: 25px;
}

.b_id{
    font-size: 10px;
    font-weight: 600;
}

.cancellation{
    font-size: 10px;
    color: #707070;
    text-align: center;
    padding: 0 20px;
}

.amt_paid{
    border-top: 1px dashed #DDDDDD;
    padding: 20px;
}

.amt_paid p{
    font-size: 14px;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
}

.info_p{
    display: flex;
    align-items: center;
    gap: 10px;
}

.info_p i{
    color: #FE5D5D;
}

.info_p span{
    font-size: 14px;
    color: #121212;
}

.share_btn{
    display: inline-flex;
    align-items: center;
    font-size: 18px;
    font-weight: 600;
    color: #121212;
    gap: 10px;
}

.share_btn i{
    color: #0D99FF;
    font-size: 26px;
}

.two_circles{
    display: flex;
    justify-content: space-between;
}

.two_circles .circles{
    width: 50px;
    height: 50px;
    background: #fff;
    border: 2px solid #EAEAEA;
}

.two_circles .circles.circles_1{
    /* border-left: none; */
    border-radius: 50% 50% 50% 50%;
    transform: translateX(-50%);
}

.two_circles .circles.circles_2{
    /* border-left: none; */
    border-radius: 50% 50% 50% 50%;
    transform: translateX(50%);
}

.inner_heading_new{
    font-size: 26px;
    font-weight: 600;
    color: #121212;
}

.disclaimer_list_new{
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 11;
    -webkit-box-orient: vertical;
    transition: 0.3s;
}

.disclaimer_list_new.active{
    -webkit-line-clamp: inherit;
}

.upcoming_show{
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    transition: 0.3s;
}

.upcoming_show.active{
    -webkit-line-clamp: inherit;
}

.num_list{
    display: flex;
    gap: 15px;
    align-items: center;
    flex-wrap: wrap;
}

.num_list li{
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #676767;
}

.num_list li.active{
    color: #121212;
}

.num_list li span{
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    /* background: #B50000; */
    background: #D9D9D9;
    color: #fff;
    border-radius: 50%;
    display: grid;
    place-items: center;
    margin-right: 10px;
}

.num_list li.active span{
    background: #B50000;
}

.num_list li i{
    margin-left: 15px;
}

.location_sec{
    box-shadow: 0px 4px 13.4px 0px #0000001A;
    border: 1px solid #D9D9D9;
    border-radius: 17px;
}

.location_sec .location_head{
    padding: 15px 20px;
    border-bottom: 1px solid #D9D9D9;
}

.location_sec .location_head h3{
    font-size: 24px;
    color: #FF4040;
    font-weight: 700;
}

.location_sec .locations{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 10px 20px;
    position: relative;
    justify-content: space-between;
}

.location_sec .locations:not(:last-child)::before{
    content: '';
    width: calc(100% - 40px);
    height: 1px;
    background: #D9D9D9;
    position: absolute;
    left: 20px;
    bottom: 0;
}

.location_sec .locations .time{
    display: flex;
    align-items: center;
    gap: 10px;
    width: 20%;
}

.location_sec .locations .time p{
    font-size: 18px;
    font-weight: 500;
    color: #121212;
}

.location_sec .locations .time p span{
    color: #676767;
    font-size: 14px;
    display: block;
}

.location_sec .locations .maps{
    display: flex;
    align-items: center;
    gap: 10px;
    width: 50%;
    padding: 0 15px;
}

.location_sec .locations .maps p{
    font-size: 18px;
    font-weight: 500;
    color: #121212;
}

.location_sec .locations .maps span{
    font-size: 14px;
    color: #9A9A9A;
    display: block;
}

.location_sec .locations .maps a{
    font-size: 14px;
    color: #FF4040;
}

.location_sec .locations .status{
    width: 20%;
    padding-left: 20px;
}

.location_sec .locations .go_next{
    width: 10%;
    text-align: end;
}

.location_sec .locations .go_next a{
    /* font-size: 16px; */
    /* color: #676767; */
    font-size: 14px;
    background: linear-gradient(90deg, #B50000 0%, #E80C0C 98.56%);
    border: none;
    color: #fff;
    padding: 8px 15px;
    border-radius: 10px;
    transition: .3s;
    white-space: nowrap;
}
 
/* .location_sec .locations .go_next a:hover{
    color: #FF4040;
} */

.location_sec .locations .status p{
    font-size: 18px;
    font-weight: 500;
}

.fast_filling{
    color: #FF9933;
}

.almost_full{
    color: #FF1B1B;
}

.available{
    color: #0D9700;
}

.text_dark{
    color: #121212 !important;
}

.natak_name_flex{
    display: flex;
    gap: 15px;
    align-items: baseline;
    flex-wrap: wrap;
}

.pickup_info_head h3{
    font-size: 20px;
    font-weight: 700;
}

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

.pickup_add h3{
    font-size: 15px;
    font-weight: 500;
}

.pickup_add p{
    font-size: 13px;
    color: #676767;
}

.pickup_info{
    background: #F9F9F9;
    padding: 20px;
    border-radius: 15px;
}

.natak_banner_img img{
    border-radius: 10px;
}

.pickup_ul li{
    font-size: 14px;
    margin-bottom: 10px;
}

.pickup_side_bar{
    border-radius: 15px;
    border: 1px solid #E5E5E5;
    padding: 10px;
}

.pickup_ticket_card{
    background: #FFF9F9;
    border: 1px solid #FFE2E2;
    border-radius: 10px;
    padding: 10px;
}

.pickup_ticket_card .head{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.pickup_ticket_card .head .name h4{
    font-size: 18px;
    font-weight: 700;
}

.pickup_ticket_card .head .name span{
    font-size: 16px;
}

.pickup_ticket_card .head .amount p{
    font-size: 18px;
    font-weight: 500;
}

.ticket_info{
    display: flex;
    gap: 10px;
    align-items: center;
}

.ticket_info i{
    font-size: 20px;
}

.ticket_info p{
    font-size: 14px;
    font-weight: 500;
    color: #121212;
}

.ticket_info span{
    display: block;
    color: #676767;
    line-height: 1.1;
}

.border_3{
    background: #EEEEEE;
    opacity: 1;
}

.ticket_info_list{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.row_p{
    font-size: 18px;
    color: #121212;
    font-weight: 500;
}

.coupon_code_btn{
    border: 1px solid #D9D9D9;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
    font-size: 18px;
    color: #121212;
    font-weight: 500;
    border-radius: 10px;
}

.coupon_code_btn img{
    width: 35px;
    margin-right: 5px;
}

.total_d{
    display: flex;
    gap: 10px;
    flex-direction: column;
}

.total_d p, .total_d a{
    display: flex;
    justify-content: space-between;
    color: #121212;
    font-size: 16px;
}

.total_d a:hover{
    color: #121212;
}

.text_d{
    color: #1BA200;
}

.banner_4{
    opacity: 1;
    background: #E9E9E9;
}

.booking_fee{
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.booking_fee p{
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: #121212;
}

.save_mp{
    color: #676767;
    font-size: 12px;
}

.t_amount p{
    display: flex;
    color: #FF4040;
    font-size: 18px;
    font-weight: 700;
    justify-content: space-between;
}

.email_id_flex{
    display: flex;
    justify-content: space-between;
}

.email_id span{
    font-size: 12px;
    color: #676767;
}

.email_id p{
    font-size: 14px;
    color: #121212;
}

.booking_fee_d_none{
    display: none;
}

.u_list{
    display: flex;
    gap: 20px;
}

.u_list li{
    font-size: 14px;
    align-items: center;
    display: flex;
    gap: 5px;
}

.u_list li span{
    width: 12px;
    height: 12px;
    flex: 0 0 auto;
    border-radius: 50%;
}

.unavailable{
    background: #B8B7B7;
}

.available_1{
    border: 1px solid #FF4040
}

.selected{
    background: #FF4040;
}

.members{
    border: 1px solid #ff0000 !important;
}

.u_list_flex{
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 20px;
}

.num_seat{
    display: flex;
    gap: 2px;
}

.num_seat label{
    flex: 1;
    aspect-ratio: 1/1;
    border: 1px solid #FF4040;
    color: #121212;
    border-radius: 5px;
    display: grid;
    place-items: center;
}

.num_seat label input{
    display: none;
}

.num_seat label:has(input:checked){
    background: #FF4040;
    color: #fff;
}

.seat_sec_part ul{
    display: flex;
    gap: 3px;
    align-items: center;
}

.seat_sec_part ul.ul_end{
    justify-content: end;
}

.seat_sec_part ul li label {
    width: 25px;
    height: 25px;
    border: 1px solid #FF4040;
    color: #121212;
    display: grid;
    place-items: center;
    font-size: 12px;
    border-radius: 50%;
    margin: 2px 0;
}

/* Sirf "Not for Sale" seats ke liye — inhi pe apply hoga, baaki sab pe nahi */
.seat_sec_part ul li label.blocked-seat {
    background: #e5e5e5 !important;
    border: 1px solid #b5b5b5 !important;
    color: #e5e5e5 !important;
    cursor: not-allowed !important;
}
.seat_sec_part ul li label.purple_c{
    border-color: #7b2d96;
    background: none;
}

.seat_sec_part ul li label.green_c{
    border-color: #06899e;
    background: none;
}

.seat_sec_part ul li label.disibled{
    pointer-events: none;
    background: #b8b7b7; 
    color: #eee !important;
    border: 1px solid #b8b7b7 !important;
    cursor: not-allowed !important;
}

.seat_sec_part ul li label input{
    display: none;
}

.seat_sec_part ul li label.disibled *{
    pointer-events: none !important;
}

.seat_sec_part ul li label:has(input:checked){
    background: #FF4040;
    color: #fff;
}

.seat_sec_part ul li label.purple_c:has(input:checked){
    background: #7b2d96;
}

.seat_sec_part ul li label.green_c:has(input:checked){
    background: #06899e;
}

.seat_sec_part ul li label.members:has(input:checked){
    background: #2C0000;
}

.row_name p, .row_name_p{
    color: #000;
    font-size: 10px;
    text-transform: uppercase;
}

.seat_sec{
    display: table;
    margin: 0 auto;
}
.seat_arrangment{
    /* overflow: hidden; */
}

.seat_sec .seat_sec_part{
    display: table-row;
}

.seat_sec .seat_sec_part > * {
    display: table-cell;
    padding: 0 5px;
    vertical-align: middle;
}

.exit_btn{
    display: inline-block;
    padding: 3px 10px;
    font-size: 6px;
    border: 1px solid #B8B7B7;
    border-radius: 2px;
    text-transform: uppercase;
    color: #000;
}

.balcony_btn{
    display: inline-block;
    padding: 3px 10px;
    font-size: 10px;
    border: 1px solid #B8B7B7;
    border-radius: 2px;
    text-transform: uppercase;
    color: #000;
}

.row_name {
  width: 44px;
}

.amt_total{
    display: flex;
    padding: 10px;
    background: #FF4040;
    border-radius: 10px;
    color: #fff;
    align-items: center;
    width: auto;
}

.amt_total .seat_selection_btn{
    color: #fff;
    font-size: 14px;
    font-weight: 500;
}

.amt_total .pay_btn{
    font-size: 18px;
    font-weight: 500;
    color: #fff;
}

.amt_total span{
    height: 37px;
    width: 1px;
    display: inline-block;
    background: #fff;
    margin: 0 10px;
}

.seat_selection{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
}

.stage span{
    width: 250px;
    display: inline-block;
    padding: 3px;
    font-size: 18px;
    color: #B8B7B7;
    border: 2px solid #B8B7B7;
    border-bottom: none;
    text-align: center;
    font-weight: 600;
}

.seat_map{
    height: calc(100vh - 250px);
    text-align: center;
}

#seat-map {
    /* display: inline-block;
    transform-origin: center center;
    will-change: transform; */
    /* height: calc(100vh - 200px); /* adjust 200px to leave top/bottom padding */
    /* width: auto; */
    display: inline-block;
    transform-origin: 0 0;
    image-rendering: crisp-edges;
    image-rendering: pixelated;
    backface-visibility: hidden;
    will-change: transform;
    /* transform: translateX(30%); */
}

.price-range-slider {
    width: 100%;
    /* float: left; */
    /* padding: 10px 20px; */
}
.price-range-slider .range-value {
    margin: 0;
    width: 100%;
}
.price-range-slider .range-value input {
    width: 100%;
    background: none;
    color: #000 !important;
    font-size: 12px!important;
    font-weight: initial;
    box-shadow: none;
    border: none;
    /* margin: 20px 0 20px 0; */
}
.price-range-slider .range-bar {
    border: none;
    background: var(--secondary-color--);
    height: 3px;
    width: 96%;
    margin-left: 8px;
}
.price-range-slider .range-bar .ui-slider-range {
    background: var(--primary-color--);
}
.price-range-slider .range-bar .ui-slider-handle {
    border: none;
    border-radius: 25px;
    background: #fff;
    border: 2px solid var(--primary-color--);
    height: 17px;
    width: 17px;
    top: -0.52em;
    cursor: pointer;
}
.price-range-slider .range-bar .ui-slider-handle + span {
    background: var(--primary-color--);
}

.price-range-slider .form-label span{
    flex: 0 0 auto;
}

.location_modal .location_heading h3{
    font-size: 24px;
    display: inline-block;
    position: relative;
    padding-bottom: 5px;
}

.location_modal .location_heading h3::before{
    content: '';
    position: absolute;
    width: 120%;
    height: 4px;
    background: var(--primary-color--);
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}

.location_modal .modal-body ul.locations{
    display: flex;
    flex-wrap: wrap;
    gap: 10px 0;
}

.location_modal .modal-body ul.locations li{
    width: 50%;
    padding: 0 5px;
}

.location_modal .modal-body ul.locations li a{
    padding: 15px 0;
    display: block;
    color: #000;
    border: 1px solid #DEDEDE;
    border-radius: 5px;
    text-align: center;
    transition: 0.3s;
}

.location_modal .modal-body ul.locations li a:hover, .location_modal .modal-body ul.locations li a.active{
    color: var(--primary-color--);
    border: 1px solid var(--primary-color--);
}

.choose_item_card{
    display: flex;
    justify-content: space-between;
    gap: 0px 20px;
    align-items: center;
    padding: 10px 0;
    flex-wrap: wrap;
    border-bottom: 1px solid #E7E7E7;
}

.choose_item_card img{
    width: 80px;
    flex: 0 0 auto;
}

.choose_item_card .content{
    /* flex: 1;
    width: calc(100% - 230px); */
}

.choose_item_card .content h3{
    font-size: 18px;
}

.choose_item_card .content p{
    white-space: nowrap;
}

.choose_item_card{
    display: flex;
    justify-content: space-between;
    gap: 0px 20px;
    align-items: center;
    padding: 10px 0;
    flex-wrap: wrap;
    border-bottom: 1px solid #E7E7E7;
}

.choose_item_card img{
    width: 80px;
    flex: 0 0 auto;
}

.choose_item_card .content{
    flex: 1;
}

.choose_item_card .content h3{
    font-size: 18px;
}

.choose_item_card_new {
    background: #F7F7F7;
    border-bottom: none;
    margin-bottom: 10px;
    padding: 20px;
    border-radius: 20px;
}

.book_tickets.text-center{
    justify-content: center;
}

.ul_center{
    justify-content: center;
}

.transform_r_1{
    transform: rotate(-2deg);
    transform-origin: right;
}

.transform_r_2{
    transform: rotate(-4deg) translateY(8px);
    transform-origin: right;
}
.transform_r_2_1{
    transform: rotate(-4deg) translateY(4px);
    transform-origin: right;
}

.transform_r_3{
    transform: rotate(-2deg) translateY(23px);
    transform-origin: right;
}

.transform_l_1{
    transform: rotate(2deg);
    transform-origin: left;
}

.transform_l_2{
    transform: rotate(4deg) translateY(8px);
    transform-origin: left;
}

.transform_l_2_1{
    transform: rotate(4deg) translateY(4px);
    transform-origin: left;
}


.transform_l_3{
    transform: rotate(2deg) translateY(23px);
    transform-origin: left;
}

.opacity_0{
    opacity: 0;
    pointer-events: none;
}

.exit_btn.r_90{
    transform: rotate(90deg);
}

.transform_r_2_2 {
  transform: rotate(-4deg) translateY(13px);
  transform-origin: right;
}

.transform_l_2_2 {
  transform: rotate(4deg) translateY(13px);
  transform-origin: right;
}

.transform_r_2_new{
    transform: rotate(-13deg) translateY(5px);
    transform-origin: right;
}

.transform_l_2_new{
    transform: rotate(13deg) translateY(5px);
    transform-origin: left;
}

.floating_btn {
    position: fixed;
    right: -34px;
    top: 50%;
    transform: rotate(-90deg) translateY(42px);
    border-radius: 0;
    display: inline-block;
    padding: 10px 25px;
    background: var(--primary-color--);
    color: #fff;
    z-index: 99;
    box-shadow: rgba(255, 255, 255, 0.2) 0px 7px 29px 0px;
}

.floating_btn:hover{
    color: #fff;
}


.order_summery{
    background: #111;
    /* padding: 20px 20px; */
    /* border-radius: 10px; */
}

.summery_heading h3{
    color: #fff;
    font-size: 18px;
    padding-bottom: 15px;
    border-bottom: 1px dashed #A7A7A7;
    margin-bottom: 15px;
}

.order_summery .summery_price {
    padding-bottom: 15px;
    border-bottom: 1px dashed #A7A7A7;
    margin-bottom: 15px;  
}

.order_summery .summery_price ul{
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.order_summery .summery_price ul li{
    display: flex;
    justify-content: space-between;
    color: #fff;
}

.text_browm{
    color: var(--primary-color--);
}

.order_summery .summary_total{
    display: flex;
    justify-content: space-between;
    margin-bottom: 15px;
}

.order_summery .summary_total p{
    font-size: 24px;
}

.order_summery .summary_total p.summary_total_heading{
    font-weight: 700;
    color: #fff;
}

.order_summery .summary_total p.summary_total_price{
    font-weight: 500;
    color: var(--primary-color--);
}

.border_dashed{
    border-bottom: 1px dashed #323232;
}

.order_summery_new{
    background: #FAFAFA;
}

.order_summery.order_summery_new .summery_price ul li {
    color: #000;
}

.order_summery.order_summery_new .summary_total p.summary_total_heading {
    color: #000;
}

.final_billing{
    display: flex;
    align-items: flex-start;
    gap: 5px;
    color: var(--secondary-color--);
    font-size: 12px;
}

.final_billing i{
    width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    background: var(--secondary-color--);
    color: #fff;
    font-size: 10px;
    border-radius: 50%;
}

div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm){
    background: var(--secondary-color--) !important;
}

.sub_new_btn.cancel_btn{
    color: #121212;
    border: 1px solid #D9D9D9;
    background: none;
}

#seat-map {
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

.price_listing li span{
    border-radius: 0;
    width: 15px;
    height: 15px;
}

.purple_c{
   
    background: #7b2d96;
   
}
.green_c{
   
    background: #06899e;
   
}
.red_c{
    background: #FF4040;
}

.price_heading{
    font-size: 20px;
    font-weight: 700;
}
label.disabled {
    background: #e5e5e5 !important;
    border: 1px solid #999 !important;
    cursor: not-allowed !important;
    opacity: 0.7;
}
label.disabled * {
    pointer-events: none;
}

.overflow_visible{
    overflow: visible;
}

.filter_backdrop{
    opacity: .5;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1040;
    width: 100vw;
    height: 100vh;
    background-color: #000;
    display: none;
}
.locked-seat {
    background-color: #1e7e34 !important;
    border: 1px solid #1e7e34 !important;
    color: #ffffff !important;
    cursor: not-allowed !important;
}

.locked-seat input {
    cursor: not-allowed !important;
}

.search_bar_mobile{
    display: none !important;
}

@media (max-width: 768px){

    header{
        display: grid;
        grid-template-columns: 1fr auto;
        grid-template-areas:
            "logo user"
            "search search";
        row-gap: 12px;
        align-items: center;
    }

    .logo{
        grid-area: logo;
        display: flex;
        align-items: center;
        gap: 10px;
        flex-wrap: wrap;
    }

    .right_side{
        grid-area: user;
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }

    .right_side .search_bar{
        display: none;
    }

    .search_bar_mobile{
        display: block !important;
    }

    .search_bar_mobile{
        grid-area: search;
        width: 100%;
        display: flex;
          display: block !important;
    }

    .search_bar_mobile input{
        flex: 1;
          display: block !important;
    }

    /* Chrome, Safari, Edge */
input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
    display: none;
}

/* Remove default search styling */
input[type="search"] {
    -webkit-appearance: textfield;
}
}

/* slider arrow */
.slider_wrapper {
    position: relative;
}

.banner_btns {
    position: absolute;
    top: 50%;
    left: 0;
    color: #6D0000;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    padding: 0 10px;
    pointer-events: none;
    z-index: 10;
}

.arrow-left,
.arrow-right {
    pointer-events: all;
    color: #6D0000;
}

.arrow-left button,
.arrow-right button {
    border: none;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    border: 2px solid #6D0000;
    color: #6D0000;
    font-size: 20px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.3s;
}

.arrow-left button:hover,
.arrow-right button:hover {
      border: 2px solid #6D0000;
    color: #6D0000;

}

#natak_result .col-lg-3,
.show_slider .slick-slide{
    height: auto;
    display: flex;
}

#natak_result .col-lg-3 > a,
.show_slider .slick-slide > div{
    display: flex;
    width: 100%;
}

#natak_result .col-lg-3 > a > .show_cards,
.show_slider .slick-slide .show_cards{
    width: 100%;
}

/* ================================================================
   CONTACT US PAGE — append this block to your global style.css
   Uses existing --primary-color-- / --secondary-color-- variables,
   so it automatically matches the rest of the site.
   ================================================================ */

/* ===== Banner ===== */
.contact_banner{
    background: linear-gradient(180deg, #6D0000 0%, #3a0000 100%);
    padding: 70px 20px 110px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.contact_banner::before{
    content: '';
    position: absolute;
    width: 400px;
    height: 400px;
    border-radius: 50%;
    background: rgba(255,255,255,0.04);
    top: -150px;
    right: -100px;
}

.contact_banner::after{
    content: '';
    position: absolute;
    width: 250px;
    height: 250px;
    border-radius: 50%;
    background: rgba(255,255,255,0.04);
    bottom: -120px;
    left: -60px;
}

.contact_banner .eyebrow{
    display: inline-block;
    color: #FFD9D9;
    font-size: 13px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 600;
    padding: 6px 16px;
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: 50px;
    margin-bottom: 18px;
    opacity: 0;
    animation: fadeUp .6s ease forwards;
}

.contact_banner h1{
    color: #fff;
    font-size: 40px;
    font-weight: 700;
    margin-bottom: 12px;
    opacity: 0;
    animation: fadeUp .6s ease .1s forwards;
}

.contact_banner p{
    color: #EFCFCF;
    font-size: 16px;
    max-width: 480px;
    margin: 0 auto;
    opacity: 0;
    animation: fadeUp .6s ease .2s forwards;
}

@keyframes fadeUp{
    from{ opacity: 0; transform: translateY(16px); }
    to{ opacity: 1; transform: translateY(0); }
}

/* ===== Cards wrapper ===== */
.contact_wrap{
    max-width: 900px;
    margin: -70px auto 0;
    padding: 0 20px 80px;
    position: relative;
    z-index: 2;
}

.contact_grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.contact_card{
    background: #fff;
    border-radius: 18px;
    padding: 34px 28px;
    box-shadow: rgba(100,100,111,0.2) 0px 12px 30px 0px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    opacity: 0;
    transform: translateY(20px);
    animation: cardIn .5s ease forwards;
    transition: transform .3s ease, box-shadow .3s ease;
    position: relative;
    overflow: hidden;
}

.contact_grid .contact_card:nth-child(1){ animation-delay: .25s; }
.contact_grid .contact_card:nth-child(2){ animation-delay: .35s; }

@keyframes cardIn{
    to{ opacity: 1; transform: translateY(0); }
}

.contact_card:hover{
    transform: translateY(-6px);
    box-shadow: rgba(109,0,0,0.25) 0px 20px 40px 0px;
}

.contact_card .icon_circle{
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, #B50000 0%, #E80C0C 100%);
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 22px;
    flex: 0 0 auto;
    transition: transform .3s ease;
}

.contact_card:hover .icon_circle{
    transform: rotate(-8deg) scale(1.08);
}

.contact_card h3{
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #9A9A9A;
    font-weight: 600;
}

.contact_card .value_row{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}


.action_btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: auto;
    padding: 12px 20px;
    border-radius: 10px;
    background: linear-gradient(90deg, #B50000 0%, #E80C0C 98.56%);
    color: #fff !important;
    font-size: 15px;
    font-weight: 600;
    transition: .3s;
}

.action_btn:hover{
    transform: scale(1.03);
    box-shadow: 0 8px 20px rgba(180,0,0,0.35);
}

/* ===== Contact form ===== */
.form_card{
    background: #fff;
    border-radius: 18px;
    margin-top: 24px;
    padding: 36px 32px;
    box-shadow: rgba(100,100,111,0.2) 0px 12px 30px 0px;
    opacity: 0;
    transform: translateY(20px);
    animation: cardIn .5s ease .4s forwards;
}

.form_card h3{
    font-size: 22px;
    font-weight: 700;
    color: #121212;
    margin-bottom: 6px;
}

.form_card .sub_text{
    font-size: 14px;
    color: #9A9A9A;
    margin-bottom: 26px;
}

.form_row{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    margin-bottom: 18px;
}

.field{
    position: relative;
}

.field.full{
    grid-column: 1 / -1;
}

.field input,
.field textarea{
    width: 100%;
    border: 1px solid #DDDDDD;
    border-radius: 10px;
    padding: 16px 14px 8px;
    font-size: 15px;
    font-family: inherit;
    color: #121212;
    outline: none;
    transition: border-color .25s ease, box-shadow .25s ease;
    background: #fff;
}

.field textarea{
    resize: vertical;
    min-height: 100px;
    padding-top: 18px;
}

.field label{
    position: absolute;
    left: 14px;
    top: 14px;
    font-size: 15px;
    color: #9A9A9A;
    pointer-events: none;
    transition: all .2s ease;
    background: #fff;
    padding: 0 4px;
}

.field input:focus,
.field textarea:focus{
    border-color: var(--primary-color--);
    box-shadow: 0 0 0 3px rgba(109,0,0,0.08);
}

.field input:focus + label,
.field input:not(:placeholder-shown) + label,
.field textarea:focus + label,
.field textarea:not(:placeholder-shown) + label{
    top: -9px;
    left: 10px;
    font-size: 11px;
    font-weight: 600;
    color: var(--primary-color--);
}

.field .error_msg{
    display: none;
    font-size: 12px;
    color: #E80C0C;
    margin-top: 6px;
    padding-left: 4px;
}

.field.invalid input,
.field.invalid textarea{
    border-color: #E80C0C;
    animation: shake .35s ease;
}

.field.invalid .error_msg{
    display: block;
}

@keyframes shake{
    0%, 100%{ transform: translateX(0); }
    20%{ transform: translateX(-6px); }
    40%{ transform: translateX(6px); }
    60%{ transform: translateX(-4px); }
    80%{ transform: translateX(4px); }
}

.submit_btn{
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 15px 20px;
    border: none;
    border-radius: 10px;
    background: linear-gradient(90deg, #B50000 0%, #E80C0C 98.56%);
    background-size: 200% 100%;
    background-position: 0% 0%;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background-position .5s ease, transform .2s ease, box-shadow .3s ease;
    overflow: hidden;
}

.submit_btn:hover{
    background-position: 100% 0%;
    box-shadow: 0 10px 24px rgba(180,0,0,0.35);
    transform: translateY(-2px);
}

.submit_btn:active{
    transform: translateY(0);
}

.submit_btn:disabled{
    opacity: .85;
    cursor: not-allowed;
    transform: none;
}

.submit_btn .btn_text,
.submit_btn .btn_spinner,
.submit_btn .btn_success{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: opacity .2s ease, transform .2s ease;
}

.submit_btn .btn_spinner,
.submit_btn .btn_success{
    display: none;
}

.submit_btn.loading .btn_text{ display: none; }
.submit_btn.loading .btn_spinner{ display: inline-flex; }

.submit_btn.success .btn_text,
.submit_btn.success .btn_spinner{ display: none; }
.submit_btn.success .btn_success{ display: inline-flex; }
.submit_btn.success{
    background: linear-gradient(90deg, #10BD00 0%, #0DA100 98.56%);
}

.spinner_ring{
    width: 18px;
    height: 18px;
    border: 2.5px solid rgba(255,255,255,0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin .7s linear infinite;
}

@keyframes spin{
    to{ transform: rotate(360deg); }
}

/* ===== Social ===== */
.social_card{
    background: #fff;
    border-radius: 18px;
    margin-top: 24px;
    padding: 30px 28px;
    box-shadow: rgba(100,100,111,0.2) 0px 12px 30px 0px;
    text-align: center;
    opacity: 0;
    transform: translateY(20px);
    animation: cardIn .5s ease .5s forwards;
}

.social_card h3{
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #9A9A9A;
    font-weight: 600;
    margin-bottom: 18px;
}

.social_icons{
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
}

.social_icons a{
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid #E5E5E5;
    display: grid;
    place-items: center;
    color: var(--primary-color--);
    font-size: 19px;
    transition: .3s ease;
}

.social_icons a:hover{
    background: var(--primary-color--);
    color: #fff;
    border-color: var(--primary-color--);
    transform: translateY(-4px);
}

/* ===== Toast ===== */
.toast_msg{
    position: fixed;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    background: #121212;
    color: #fff;
    padding: 12px 22px;
    border-radius: 50px;
    font-size: 14px;
    opacity: 0;
    pointer-events: none;
    transition: .3s ease;
    z-index: 999;
    display: flex;
    align-items: center;
    gap: 8px;
}

.toast_msg.show{
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.toast_msg i{ color: #10BD00; }

@media (max-width: 640px){
    .contact_banner{ padding: 50px 20px 90px; }
    .contact_banner h1{ font-size: 28px; }
    .contact_grid{ grid-template-columns: 1fr; }
    .contact_wrap{ margin-top: -60px; }
    .contact_card .value_row a.value_link{ font-size: 18px; }
    .form_row{ grid-template-columns: 1fr; }
    .form_card{ padding: 28px 20px; }
    .customer_care{
    display: flex;
    justify-content: start;
   
}
}

.fa-magnifying-glass {
    color: white;
    transition: color 0.3s ease;
}


.col-xl-2-4 {
    width: 20%;
}

@media (max-width: 768px) {
    .col-xl-2-4 {
        width: 50%;
    }
}

.footer_menu img{
    height: 100px;
}


/* event page css */
    /* ── Background ── */
        .cs_bg {
            position: fixed; inset: 0;
            z-index: 0; pointer-events: none; overflow: hidden;
        }

        .cs_orb {
            position: absolute; border-radius: 50%;
        }

        .cs_orb--1 {
            top: -120px; left: -120px;
            width: 460px; height: 460px;
            background: radial-gradient(circle, rgba(109,0,0,0.45) 0%, transparent 70%);
            animation: cs_float1 8s ease-in-out infinite;
        }

        .cs_orb--2 {
            bottom: -120px; right: -120px;
            width: 560px; height: 560px;
            background: radial-gradient(circle, rgba(109,0,0,0.3) 0%, transparent 70%);
            animation: cs_float2 10s ease-in-out infinite;
        }

        .cs_orb--3 {
            top: 50%; left: 50%;
            width: 640px; height: 640px;
            transform: translate(-50%, -50%);
            background: radial-gradient(circle, rgba(109,0,0,0.12) 0%, transparent 70%);
            animation: cs_pulse_bg 6s ease-in-out infinite;
        }

        .cs_note {
            position: absolute;
            color: rgba(109,0,0,0.5);
            animation: cs_floatNote linear infinite;
            user-select: none;
        }

        /* ── Section ── */
        .cs_section {
            position: relative; z-index: 1;
            min-height: 90vh;
            display: flex; align-items: center; justify-content: center;
            padding: 80px 20px 100px;
        }

        /* ── Icon ── */
        .cs_icon_wrap {
            position: relative;
            display: flex; flex-direction:column; align-items: center; justify-content: center;

        }

        .cs_icon {
            width: 100px; height: 100px;
            background: linear-gradient(135deg, #6D0000, #b50000);
            border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            box-shadow: 0 0 40px rgba(109,0,0,0.7);
            position: relative; z-index: 1;
            animation: cs_iconBreathe 3s ease-in-out infinite;
            margin-bottom: 32px;
            
        }

        .cs_icon i { font-size: 42px; color: #fff; }

        .cs_icon_ring {
            position: absolute; border-radius: 50%;
            border: 1px solid rgba(109,0,0,0.4);
            animation: cs_ringPulse 3s ease-out infinite;
        }

        .cs_ring--1 { width:130px; height:130px; animation-delay:0s; }
        .cs_ring--2 { width:165px; height:165px; animation-delay:0.6s; }
        .cs_ring--3 { width:200px; height:200px; animation-delay:1.2s; }

        /* ── Badge ── */
        .cs_badge {
            display: inline-block;
            padding: 8px 22px;
            background: rgba(109,0,0,0.18);
            border: 1px solid rgba(109,0,0,0.5);
            border-radius: 30px;
            color: #ff7070;
            font-size: 0.85rem;
            font-weight: 600;
            letter-spacing: 1.5px;
            text-transform: uppercase;
            margin-bottom: 24px;
            animation: cs_fadeDown 0.7s ease both;
        }

        /* ── Heading ── */
        .cs_heading {
            font-size: clamp(2.4rem, 6vw, 4.2rem);
            font-weight: 900;
            color: #fff;
            line-height: 1.15;
            margin-bottom: 16px;
            animation: cs_fadeUp 0.7s ease 0.15s both;
        }

        .cs_heading_shine {
            display: block;
            background: linear-gradient(90deg, #6D0000, #ff5555, #ff9999, #ff5555, #6D0000);
            background-size: 300%;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            animation: cs_shimmer 4s linear infinite;
        }

        /* ── Sub ── */
        .cs_sub {
            color: #999;
            font-size: clamp(0.95rem, 2.5vw, 1.1rem);
            line-height: 1.85;
            max-width: 580px;
            margin: 0 auto 44px;
            animation: cs_fadeUp 0.7s ease 0.25s both;
        }

        /* ── Countdown ── */
        .cs_countdown {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            margin-bottom: 48px;
            animation: cs_fadeUp 0.7s ease 0.35s both;
            flex-wrap: wrap;
        }

        .cs_cd_block {
            display: flex; flex-direction: column; align-items: center;
            background: rgba(255,255,255,0.04);
            border: 1px solid rgba(109,0,0,0.35);
            border-radius: 14px;
            padding: 18px 24px 14px;
            min-width: 90px;
            backdrop-filter: blur(6px);
            transition: border-color 0.3s, transform 0.3s;
        }

        .cs_cd_block:hover {
            border-color: rgba(109,0,0,0.7);
            transform: translateY(-4px);
        }

        .cs_cd_num {
            font-size: 2.6rem;
            font-weight: 900;
            color: #fff;
            line-height: 1;
            font-variant-numeric: tabular-nums;
            transition: transform 0.15s;
        }

        .cs_cd_num.flip {
            transform: scaleY(0);
        }

        .cs_cd_label {
            font-size: 10px;
            color: #ff7070;
            text-transform: uppercase;
            letter-spacing: 1.5px;
            margin-top: 8px;
            font-weight: 600;
        }

        .cs_cd_sep {
            font-size: 2.4rem;
            font-weight: 900;
            color: rgba(109,0,0,0.6);
            padding-bottom: 18px;
            animation: cs_blink 1s step-end infinite;
        }

        /* ── Notify ── */
        .cs_notify {
            background: rgba(255,255,255,0.03);
            border: 1px solid rgba(109,0,0,0.25);
            border-radius: 16px;
            padding: 28px 28px 22px;
            max-width: 520px;
            margin: 0 auto 40px;
            animation: cs_fadeUp 0.7s ease 0.45s both;
            backdrop-filter: blur(8px);
        }

        .cs_notify_title {
            color: #ccc;
            font-size: 0.9rem;
            margin-bottom: 14px;
            text-transform: uppercase;
            letter-spacing: 1px;
            font-weight: 600;
        }

        .cs_notify_row {
            display: flex; gap: 10px;
        }

        .cs_notify_input_wrap {
            position: relative; flex: 1;
        }

        .cs_notify_input_wrap i {
            position: absolute; left: 13px; top: 50%;
            transform: translateY(-50%);
            color: #666; font-size: 14px; pointer-events: none;
        }

        .cs_notify_input_wrap input {
            width: 100%;
            padding: 12px 14px 12px 38px;
            background: rgba(255,255,255,0.06);
            border: 1.5px solid rgba(109,0,0,0.3);
            border-radius: 10px;
            color: #fff;
            font-size: 14px;
            outline: none;
            transition: border-color 0.2s, background 0.2s;
        }

        .cs_notify_input_wrap input::placeholder { color: #555; }

        .cs_notify_input_wrap input:focus {
            border-color: rgba(109,0,0,0.7);
            background: rgba(255,255,255,0.09);
        }

        .cs_notify_btn {
            position: relative;
            background: linear-gradient(135deg, #6D0000, #a50000);
            color: #fff;
            border: none;
            border-radius: 10px;
            padding: 12px 24px;
            font-size: 14px;
            font-weight: 700;
            cursor: pointer;
            min-width: 120px;
            overflow: hidden;
            transition: transform 0.2s, box-shadow 0.2s;
        }

        .cs_notify_btn:hover {
            transform: translateY(-2px);
            box-shadow: 0 8px 24px rgba(109,0,0,0.5);
        }

        .nb_text, .nb_loader, .nb_done {
            display: flex; align-items: center; justify-content: center;
            gap: 6px; transition: opacity 0.15s, transform 0.15s;
        }

        .nb_loader, .nb_done {
            position: absolute; inset: 0;
            opacity: 0; transform: translateY(8px);
        }

        .cs_notify_btn.loading .nb_text   { opacity:0; transform:translateY(-8px); }
        .cs_notify_btn.loading .nb_loader { opacity:1; transform:translateY(0); }
        .cs_notify_btn.done    { background: #1a7a40; }
        .cs_notify_btn.done .nb_text   { opacity:0; }
        .cs_notify_btn.done .nb_loader { opacity:0; }
        .cs_notify_btn.done .nb_done   { opacity:1; transform:translateY(0); }

        .cs_notify_msg {
            font-size: 12.5px;
            margin-top: 10px;
            min-height: 18px;
        }

        /* ── Divider ── */
        .cs_divider {
            display: flex; align-items: center; gap: 14px;
            max-width: 320px; margin: 0 auto 24px;
            animation: cs_fadeUp 0.7s ease 0.55s both;
        }

        .cs_divider::before,
        .cs_divider::after {
            content: ''; flex: 1;
            height: 1px; background: rgba(109,0,0,0.3);
        }

        .cs_divider span {
            color: #555; font-size: 11px;
            text-transform: uppercase; letter-spacing: 1.5px;
            white-space: nowrap;
        }

        /* ── Socials ── */
        .cs_socials {
            display: flex; justify-content: center; gap: 14px;
            animation: cs_fadeUp 0.7s ease 0.65s both;
        }

        .cs_social {
            width: 46px; height: 46px;
            background: rgba(109,0,0,0.15);
            border: 1px solid rgba(109,0,0,0.4);
            border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            color: #ff7070; font-size: 17px;
            text-decoration: none;
            transition: background 0.25s, color 0.25s, transform 0.25s, box-shadow 0.25s;
        }

        .cs_social:hover {
            background: #6D0000; color: #fff;
            transform: translateY(-4px);
            box-shadow: 0 8px 20px rgba(109,0,0,0.5);
        }

        /* ── Equalizer ── */
        .cs_eq {
            position: fixed; bottom: 0; left: 0;
            width: 100%; height: 50px;
            display: flex; align-items: flex-end; justify-content: center;
            gap: 3px; padding: 0; z-index: 0; opacity: 0.35;
            pointer-events: none;
        }

        .cs_eq_bar {
            width: 5px;
            background: linear-gradient(to top, #6D0000, #ff4444);
            border-radius: 3px 3px 0 0;
            animation: cs_eq ease-in-out infinite alternate;
        }

   
        /* ── Mobile ── */
        @media (max-width: 540px) {
            .cs_cd_block  { min-width: 70px; padding: 14px 16px 10px; }
            .cs_cd_num    { font-size: 2rem; }
            .cs_notify_row { flex-direction: column; }
            .cs_notify_btn { width: 100%; }
        }



        
        :root {
            --mn-maroon:     #7a0000;
            --mn-maroon-dk:  #5c0000;
            --mn-maroon-lt:  #fdf3f3;
            --mn-white:      #ffffff;
            --mn-bg:         #f3f3f3;
            --mn-text:       #1a1a1a;
            --mn-text-sub:   #666666;
            --mn-text-muted: #aaaaaa;
            --mn-border:     #e5e5e5;
            --mn-radius-sm:  8px;
            --mn-radius-md:  12px;
            --mn-radius-lg:  16px;
        }

        .mn-page { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: var(--mn-bg); color: var(--mn-text); min-height: 100vh; }

    
        /* banner */
        .mn-banner { background: linear-gradient(135deg, var(--mn-maroon-dk) 0%, var(--mn-maroon) 60%, #9c0000 100%); padding: 24px 20px 56px; position: relative; overflow: hidden; }
        .mn-banner::before { content: ''; position: absolute; top: -40px; right: -40px; width: 200px; height: 200px; border-radius: 50%; background: rgba(255,255,255,0.04); }
        .mn-banner::after  { content: ''; position: absolute; bottom: -20px; left: -20px; width: 140px; height: 140px; border-radius: 50%; background: rgba(255,255,255,0.03); }
        .mn-user-row { display: flex; align-items: center; justify-content: center; gap: 14px; position: relative; z-index: 1; }
        .mn-avatar { width: 54px; height: 54px; border-radius: 50%; background: rgba(255,255,255,0.18); border: 2px solid rgba(255,255,255,0.35); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 20px; font-weight: 700; flex-shrink: 0; }
        .mn-user-name {text-align: center; font-size: 22px; font-weight: 700; margin-bottom: 10px; }
        .mn-banner-stats { display: flex; margin-top: 24px; background: rgba(255,255,255,0.1); border-radius: var(--mn-radius-md); overflow: hidden; position: relative; z-index: 1; }
        .mn-bstat { flex: 1; padding: 12px 0; text-align: center; }
        .mn-bstat + .mn-bstat { border-left: 1px solid rgba(255,255,255,0.15);  }
        .mn-bstat-num   { color: #fff; font-size: 20px; font-weight: 800; }
        .mn-bstat-label { color: rgba(255,255,255,0.6); font-size: 16px; margin-top: 3px; text-transform: uppercase; letter-spacing: 0.5px; }

        /* body */
        .mn-body { margin-top: -28px; padding: 0 16px 32px; position: relative; z-index: 2; }
        .mn-section-label { font-size: 14px; text-align: center; font-weight: 700; color: var(--mn-text-muted); text-transform: uppercase; letter-spacing: 1px; margin: 20px 0 12px; }

        /* card */
        .main-card { max-width: 600px; max-height: 800px; margin: auto; background: var(--mn-white); border-radius: var(--mn-radius-lg); border: 1px solid var(--mn-border); padding: 18px; margin-bottom: 12px; transition: border-color 0.2s, transform 0.15s; }
        .mn-card { max-width: 400px; margin: auto; background: var(--mn-white); border-radius: var(--mn-radius-lg); border: 1px solid var(--mn-border); padding: 18px; margin-bottom: 12px; transition: border-color 0.2s, transform 0.15s; }
        .mn-card:hover { border-color: #ccc; transform: translateY(-1px); }
        .mn-card--expired { border-color: #f5c6c6; }
        .mn-card-top { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 3px; }
        .mn-city-row { display: flex; align-items: center; gap: 6px; }
        .mn-city-icon { color: var(--mn-maroon); font-size: 14px; }
        .mn-city-name { font-size: 16px; font-weight: 700; color: var(--mn-text); }

        /* badges */
        .mn-badge { font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 20px; flex-shrink: 0; letter-spacing: 0.3px; }
        .mn-badge--active   { background: #e8f5e9; color: #2e7d32; }
        .mn-badge--expiring { background: #fff3e0; color: #bf5e00; }
        .mn-badge--expired  { background: #fce8e8; color: #b71c1c; }

        /* tier */
        .mn-tier-row { display: flex; align-items: center; gap: 6px; margin-bottom: 12px; }
        .mn-tier-icon          { font-size: 13px; }
        .mn-tier-icon--gold    { color: #f59e0b; }
        .mn-tier-icon--silver  { color: #94a3b8; }
        .mn-tier-icon--bronze  { color: #c2732e; }
        .mn-tier-name          { font-size: 13px; color: var(--mn-text-sub); }

        /* progress */
        /* .mn-prog { margin-bottom: 14px; } */
        .mn-prog-meta { display: flex; flex-direction: column; gap: 5px; justify-content: start; margin: 8px 0px; }
        .mn-prog-date { font-size: 15px; color: var(--mn-text-muted); }
        .mn-prog-date_1 { font-size: 12px; font-weight: 500; color: #2e7d32; display: flex; align-items: center; gap: 4px; }
        .mn-prog-date_2 { font-size: 12px;  font-weight: 500;color: #b71c1c; display: flex; align-items: center; gap: 4px; }
        

        /* buttons */
        .mn-btn-row { display: flex; gap: 8px; }
        .mn-btn { flex: 1; padding: 10px 0; border-radius: var(--mn-radius-sm); font-size: 13px; font-weight: 700; cursor: pointer; text-align: center; transition: all 0.18s; border: none; font-family: inherit; }
        .mn-btn--ghost           { background: #fff; border: 1.5px solid var(--mn-border); color: var(--mn-text); }
        .mn-btn--ghost:hover     { border-color: var(--mn-maroon); color: var(--mn-maroon); }
        .mn-btn--primary         { background: var(--mn-maroon); color: #fff; }
        .mn-btn--primary:hover   { background: var(--mn-maroon-dk); }
        .mn-btn--danger          { background: #fff; border: 1.5px solid var(--mn-border); color: #b71c1c; }
        .mn-btn--danger:hover    { background: #fce8e8; border-color: #b71c1c; }

        /* add city */
        .mn-add-btn { max-width: 400px; margin: auto; display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 15px; border-radius: var(--mn-radius-md); border: 1.5px dashed #ccc; background: #fff; color: var(--mn-maroon); font-size: 14px; font-weight: 700; cursor: pointer; transition: all 0.2s; margin-top: 4px; font-family: inherit; }
        .mn-add-btn:hover { border-color: var(--mn-maroon); background: var(--mn-maroon-lt); }

        /* overlay */
        .mn-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 100; animation: mn-fade-in 0.2s ease; }
        .mn-overlay--open { display: block; }
        @keyframes mn-fade-in { from { opacity: 0; } to { opacity: 1; } }

        /* sheet */
        .mn-sheet { position: fixed; bottom: 0; left: 0; right: 0; background: #fff; border-radius: 20px 20px 0 0; padding: 12px 20px 32px; z-index: 101; transform: translateY(100%); transition: transform 0.3s cubic-bezier(0.34, 1.1, 0.64, 1); max-height: 80vh; overflow-y: auto; }
        .mn-sheet--open { transform: translateY(0); }
        .mn-sheet-handle { width: 40px; height: 4px; background: #e0e0e0; border-radius: 2px; margin: 4px auto 18px; }
        .mn-sheet-title  { font-size: 17px; font-weight: 700; color: var(--mn-text); margin-bottom: 16px; }

        /* sheet — benefits */
        .mn-benefit-item { display: flex; align-items: flex-start; gap: 10px; padding: 10px 0; border-bottom: 1px solid #f0f0f0; font-size: 14px; color: var(--mn-text); }
        .mn-benefit-item:last-child { border-bottom: none; }
        .mn-benefit-icon { color: #4caf50; margin-top: 2px; flex-shrink: 0; }


        /* sheet — city picker */
        .mn-city-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 4px; }
        .mn-city-pick { padding: 14px 12px; border: 1.5px solid var(--mn-border); border-radius: var(--mn-radius-md); background: #fff; font-size: 14px; font-weight: 600; color: var(--mn-text); cursor: pointer; display: flex; align-items: center; gap: 8px; transition: all 0.18s; font-family: inherit; }
        .mn-city-pick:hover { border-color: var(--mn-maroon); background: var(--mn-maroon-lt); color: var(--mn-maroon); }
        .mn-city-pick-icon { font-size: 15px; color: var(--mn-maroon); }

        /* sheet — remove */
        .mn-remove-warn { background: #fce8e8; border-radius: var(--mn-radius-sm); border-left: 3px solid #b71c1c; padding: 12px 14px; font-size: 13px; color: #7f1d1d; line-height: 1.6; margin-bottom: 20px; }




.seat.block label {
    background: gray !important;
    color: gray !important;
    opacity: 1 !important;
}