body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    margin: 0;
    font-family: 'Poppins', sans-serif;
}
.container {
    flex: 1;
}
.flex-grow-1 {
    flex-grow: 0 !important;
}
.main_heading_all_pages{
    font-size: 50px;
}
@media(max-width:575px){
    .main_heading_all_pages{
        font-size: 32px;
        text-align: center;
    }
}
.navbar {
    padding: 12px !important;
    position: sticky !important;
    top: 0;
    z-index: 2;
    background-color: #010c10;
    color: #e0e1dd;
    border-bottom: 1px solid #979797;
}

.navbar_links li a {
    color: white;
    font-size: 17px;
    font-family: 'Poppins', sans-serif;
    
}

.navbar_links li a:hover {
    font-weight: 600;
    color: white;
}

.navbar_links li {
    border-radius: 0.25rem;
}

.mobile_recharge_links {
    display: none;
}
.mobile_recharge {
    display: flex;
    justify-content: center;
    margin-right: 38px;
    font-weight: 600;
    align-items: center;
}

.header-menu .login {
    background-color: #fff;
    border-radius: 6px;
    border: none;
    padding: 4px;
    font-weight: 700;
    width: 6rem;
    margin-left: 35px;
    color: #000000 !important;
    font-family: 'Poppins', sans-serif;
}
/*  */
.buttons {
    display: none;
}

/* Ensure navbar is properly responsive */
@media (max-width: 992px) {
    .header-menu {
        display: flex;
        flex-direction: column-reverse;
        width: 100%;
        /* Ensure full-width for the collapsed menu */
        align-items: flex-start;
    }

    .navbar_links {
        /* flex-direction:column-reverse;
        padding: 0; */
        flex-direction: column;
        /* Stack links vertically */
        align-items: flex-start;
        /* Align links to the left */
        padding: 0;
    }

    .navbar_links li {
        width: auto;
        /* Allow links to take their natural width */
        padding: 5px 0;
    }

    .navbar_links li a {
        text-align: left;
        font-size: 21px;
    }

    .mobile_recharge {
        font-weight: 700;
        font-size: 30px;
    }

    .mobile_recharge_links {
        display: inherit;
        list-style: none;
    }

    .mobile_recharge_links li a {
        text-decoration: none;
        font-weight: 100;
        font-size: 19px;
    }

    .navbar_links li .login {
        display: none;
    }

    .headerSec .buttons {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        width: 100%;
    }
    .headerSec .buttons .mob_btn {
        text-decoration: none;
        font-weight: 500;
    }

    .country-selector .recharge_home_dropdown {
        width: 100%;
    }
    .headerSec .navbar-toggler {
        font-size: unset;
    }
    .country-selector .flagImgup {
        left: 83% !important;
    }
}

/* sub_navbar Css */
.sub_navbar {
    background-color: #133c55;
    margin-top: 0;
    display: none;
}

.sub_navbar_links {
    display: flex;
    list-style: none;
    gap: 32px;
    padding: 7px;
}

.sub_navbar_links li a {
    text-decoration: none;
    color: white;
    font-family: "Dm Sans";
    font-size: 18px;
}

@media (max-width: 992px) {
    .sub_navbar {
        display: block;
    }
}

/* footer Css */
.footer {
    background-color: #fff;
    color: #000000;
    padding: 2rem 0;
}

.footer a {
    color: #000000;
    text-decoration: none;
}

.footer a:hover {
    text-decoration: underline;
}

.footer .social-icons a {
    margin: 0 0.5rem;
}

.footerCol {
    display: flex;
}
.footerCol hr{
    
    margin-left: 10px;
    height: 2px;
    background-color: #000000;
}

/* footer media query */
@media (max-width: 495px) {
    .footer .container {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .footer .row.footerCol {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .footer .row.footerCol > div {
        margin-bottom: 1.5rem;
        width: 100%;
        /* Ensure full width for better alignment */
        text-align: center;
    }

    .footer .social-icons {
        justify-content: center;
        margin-top: 1rem;
    }

    .footer .row.mt-2,
    .footer .row.mt-3 {
        justify-content: center;
    }

    .footer .d-flex.justify-content-center {
        flex-direction: column;
        align-items: center;
    }

    .footer .footerCol .media-icons{
    
        justify-content: center;
    
    }
}

/* Log in & Sign up  page */
.login_form {
    margin-top: 4rem;
    margin-bottom: 4rem;
    font-family: 'Poppins', sans-serif;
}

/* Social Media Icons */
.social_media {
    display: flex;
    justify-content: space-around;
    align-items: center;
}

#sign_up_form .form-control {
    padding: 14px;

}

.img-container,
.img-container1,
.img-container2 {
    padding: 10px;
    text-align: center;
    cursor: pointer;
    width: 4rem;
}

/* Error Styles */
.error {
    display: block;
    color: red;
    font-weight: 500;
}

.error.show {
    visibility: visible;
}

/* Password Toggle */
.password-container {
    position: relative;
}

.password-container .form-control {
    padding-right: 2.5rem;
}

.toggle-password {
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    cursor: pointer;
}

.sign_up {
    font-size: 19px;
    font-weight: 500;
}

#sign_up_form #currency-select {
    border-radius: 7px;
    padding: 13px;
    border-color: rgb(214, 211, 211);
}

#sign_up_form #currency-select:focus {
    box-shadow: none;
}

.divider {
    display: flex;
    align-items: center;
    text-align: center;
    border: none;
    margin: 1rem 0;
    letter-spacing: 1px;
}

.divider::before,
.divider::after {
    content: "";
    flex: 1;
    border-bottom: 1px solid gray;
}

.divider::before {
    margin-right: 10px;
}

.divider::after {
    margin-left: 10px;
}

/* Button Styling */
.loginbtn {
    /* background: linear-gradient(45deg, #2f2f2f, #6c6c6c9e); */
    background-color: #023040;
    color: white;
    border: none;
    padding: 11px 0;
    width: 100%;
    font-size: 21px;
    font-weight: 700;
    letter-spacing: 2px;
    border-radius: 10px;
}

.forgotbtn {
    background-color: #023040;
    color: white;
    border: none;
    
    padding: 8px 0;
    width: 100%;
    font-size: 21px;
    letter-spacing: 2px;
    border-radius: 5px;
}
@media(max-width:575px){
    .login_signup_right_part{
        margin-top: unset !important;
    }
    .divider{
        display: block;
    }
}
/* Forgot Password and Terms */

.termconditions a {
    color: gray;
    text-decoration: none;
}
.forgot_pass a{
    color: #001D5A;
}
.forgot_pass a:hover,
.termconditions a:hover {
    color: inherit;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .login_form {
        margin-top: 3rem;
        margin-bottom: 3rem;
    }

    .img-container,
    .img-container1,
    .img-container2 {
        width: 6rem;
    }
}

@media (max-width: 992px) {
    .home_container {
        min-height: 70vh !important;
    }
    .home_page_left h2 {
        font-size: 25px !important;
        margin-top: unset !important;
    }
}
@media (max-width: 576px) {
    .login_form {
        margin-top: 2rem;
        margin-bottom: 2rem;
    }

    .img-container,
    .img-container1,
    .img-container2 {
        width: 5rem;
    }

    .loginbtn {
        font-size: 18px;
    }
}

.home_page_left h2 {
    margin-top: 4rem;
    letter-spacing: 2px;
    font-size: 50px;
    color: white;
    font-family: 'Poppins', sans-serif;
}
.new_dropdown .new_dropdown_form{
    display: flex;
    gap: 20px;
}
.new_dropdown button {
    width: 100%;
    padding: 10px 30px 10px 30px;
    border-radius: 10px;
    background-color: #023040;

    /* outline: none; */
    border: none;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 20px;
    color: #fff;
}

.Key_points p {
    font-size: 18px;
    letter-spacing: 1px;
    /* margin-top: 1rem; */
    color: white;
    font-family: 'Poppins', sans-serif;
}

.home_dropdown {
    width: 100% !important;
    padding: 12px;
    border-radius: 26px;
    background-color: #fff;
}

.home_dropdown option {
    color: black;
}

.select_country {
    font-size: 20px;
}

.home_page_right {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.custom-ok-button {
    color: #fff !important;
    border: none !important;
    border-radius: 4px;
    padding: 8px 16px;
}
/* Recharbe process  image*/

.recharge-process-container img {
         max-width: 100%;
  }
  .mobile-recharge-process{
    display: none;
  }
  @media(max-width :575px){
    .home_page_left h2{
        text-align: center;
    }
     .mobile-recharge-process{
        display: block;
     }
     .mobile-recharge-process img{
        width: 100%;
     }
     .recharge-process-container{
        display: none;
     }
  }
@media (max-width: 992px) {

    .home_page_right {
        display: none;
    }

    .Key_points p {
        font-size: 14px;
    }
    .home_dropdown {
        outline: none;
        width: 100%;
        padding: 5px !important;
        background-color: unset;
        color: white;
        font-size: 20px;
        appearance: none;
    }
    .new_dropdown .new_dropdown_form{
        flex-direction: column;
    }
}

/* trusted section */
.trusted-section {
    background-color: #ffffff; /* Adjust as needed */
    color: #000000;
    /* margin-top: 20rem; */
}

.trusted-title {
    font-family: 'Poppins', sans-serif;
    line-height: 1.4;
    font-weight: 600;
}

.highlighted-text {
    background-color: #69a2cd; /* Match the blue box color */
    color: #ffffff;
    padding: 0.2rem 0.5rem;
    border-radius: 0.3rem;
}

.trusted-description {
    font-size: 1.1rem;
    color: #1D1B20;
    margin: 0 auto;
    /* line-height: 1.8; */
}
@media (max-width: 992px) {
    .trusted-title{
        font-size: 1.8rem;
    }
    .trusted-description{
        font-size: 18px;
        text-align: center;
    }
}



/* //////////////////// */
.operator-img {
    transition: all 0.3s ease;
    /* Smooth transition */
}

.operator-img.blurred {
    opacity: 0.4;
}

.plandetail_card.active {
    background-color: #E3F3FF; /*#000b7c;*/
    color: #000;
}

/* slick slider css */
.new-home-page-slider2 {
    background-color: #023040;
    color: #ffffff;
}

.new-home-page-slider2 .slider-images .show-slider-images {
    max-width: 100%;
    height: auto;
}

#card-slider2,
.slick-prev {
    left: unset !important;
    right: 105% !important;
}
#card-slider2,
.slick-next {
    right: 0% !important;
}
#card-slider2 .slick-dots li button:before {
    color: white !important;
    font-size: 10px !important;
}

#card-slider2 .slick-prev:before,
#card-slider2 .slick-next:before {
    content: unset !important;
}
#card-slider2 .slick-dots li button:before {
    color: #66c5ff !important;
}
@media (max-width: 768px) {
    #card-slider2 .slick-next {
        display: none !important;
    }

    #card-slider2 .slick-prev {
        display: none !important;
    }
}

/* Auto_top_up section */
.Auto_top_up {
    background-color: #05108a;
    color: white;
    font-family: 'Poppins', sans-serif;
}
.Auto_top_up .top_up_btn {
    background-color: #05108a;
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    font-weight: 500;
    font-size: 1rem;
    cursor: pointer;
    font-family: 'Poppins', sans-serif;
    
}

@media (max-width: 768px) {
    .Auto_top_up {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .Auto_top_up img {
        max-width: 135%;
    }

    .Auto_top_up p {
        font-size: 15px;
        text-align: center;
    }
}

@media (max-width: 992px) {
    .Auto_top_up {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .Auto_top_up img {
        max-width: 135%;
    }

    .Auto_top_up p {
        font-size: 15px;
        text-align: center;
    }
}

.recharge_summary {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

/* Customer feedback section*/
.customer_feedback {
    display: flex;
    justify-content: center;
}

.customer_feedback_1_left {
    display: flex;
    flex-direction: column;
    text-align: center;
}

.rateing_star {
    font-size: 27px;
    background-color: yellowgreen;
    color: white;
}

/* news_letter_section */
.newsletter {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
}

.newsletter input {
    outline: none;
    padding: 10px;
    width: 15rem;
    background-color: transparent;
    border: 1px solid;
    color: black;
    border-radius: 6px;
    font-weight: 500;
    letter-spacing: 1px;
}

.newsletter input::placeholder {
    color: black;
    font-size: 15px;
}

.newsletter button {
    /* background: linear-gradient(45deg, #2f2f2f, #6c6c6c); */
    background-color: #05108a;
    letter-spacing: 1px;
    color: white;
    width: 10rem;
    border: none;
    height: 3rem;
    font-weight: 600;
    font-size: 18px;
    border-radius: 6px;
}

@media (max-width: 768px) {
    .newsletter {
        flex-direction: column;
        justify-content: center;
        text-align: center;
    }

    .newsletter button {
        margin-top: 20px;
    }
}

/*Recharge Page html css  */
.recharge_step__container {
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 40px;
    border-radius: 15px;
    box-shadow: 0px 0px 10px rgba(206, 206, 206, 0.5);
    background-color: #023040;
    
}

.recharge_container_left {
    text-align: center;
    margin-top: 20px;
    letter-spacing: 1px;
}

.recharge_container_right {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.recharge_home_dropdown {
    border: 1px solid;
    outline: none;
    font-size: 18px;
    width: 21rem;
    padding: 8px;
    width: 100%;
}
.phone-number-section .input-group > .form-control,
.input-group > .form-floating,
.input-group > .form-select {
    width: 100% !important;
}
.display_phone_num {
    margin-left: 10px;
    margin-top: 10px;
}

.recharge_container_right .recharge {
    /* display: none; */
    /* background: linear-gradient(45deg, #2f2f2f, #6c6c6c9e); */
    background-color: #ffaa00;
    cursor: pointer;
    border-radius: 26px;
    font-weight: 700;
    font-size: 17px;
    border: none;
    width: 20rem;
    letter-spacing: 1px;
    padding: 7px;
    font-family: 'Poppins', sans-serif;
    
}

.display_blured_btn {
    opacity: 0.5;
    pointer-events: none;
    width: 100%;
    border-radius: 10px;
    color: white;
    padding: 8px;
    font-size: 20px;
    border: 1px solid white;
    background-color: transparent;
}
.recharge{
    width: 100%;
    border-radius: 10px;
    color: white;
    padding: 8px;
    font-size: 20px;
    border: 1px solid white;
    background-color: transparent;
}
.dhtbtn {
    background-color: #023040;
    cursor: pointer;
    color: white;
    width: 100% !important;
    border-radius: 6px;
    font-weight: 500;
    font-size: 21px;
    border: none;
    width: 14rem;
    letter-spacing: 1px;
    padding: 7px;
}

.phone-number-section .phone_number_error {
    background-color: #ffa0a099;
    max-width: 22rem;
    font-size: 15px;
    padding: 14px;
    font-weight: 600;
    text-align: center;
    color: #7a050596;
}

.custom_input {
    width: 19rem !important;
}

.form-control:focus {
    box-shadow: none !important;
    border-color: rgb(148, 144, 144) !important;
}

.input-group > .form-control,
.input-group > .form-floating,
.input-group > .form-select {
    /*flex-grow: unset !important;*/
    padding: 10px !important;
}

.planTypeBtn {
    background-color: #05108a;
    margin: 4px;
    padding: 4px;
    width: 6rem;
    border-radius: 6px;
    font-weight: 500;
    letter-spacing: 1px;
    border: 1px solid #ccc;
    /* background: linear-gradient(45deg, #2f2f2f, #6c6c6c9e);  */
    color: white;
}
.disabled-card {
    pointer-events: none;
    opacity: 0.6;
}
.Choose_us_container {
    display: flex;
    flex-direction: column;
    text-align: center;
}

.Choose_us_container_left p {
    font-size: 18px;
    letter-spacing: 1px;
}

.Choose_us_container_right i {
    font-size: 31px;
    color: #bdb7b7;
}

@media (max-width: 768px) {
    .Choose_us_container_right {
        flex-direction: column;
    }

    .Choose_us_container_left p {
        font-size: 15px;
    }
    .phone-number-section .input-group .form-control {
        width: 76% !important;
    }
}

.recharge_mob_steps {
    display: flex;
    justify-content: space-evenly;
    text-align: center;
}

.recharge_mob_steps i {
    font-size: 57px;
}

.recharge_mob_steps_icons {
    background: linear-gradient(45deg, #2f2f2f, #6c6c6c9e);
    width: 18rem;
    border-radius: 46px;
    padding: 19px;
    margin-top: 2rem;
}

@media (max-width: 768px) {
    .recharge_mob_steps {
        flex-direction: column;
    }
}

/* Checkout Page CSS */
.checkout_left {
    background-color: #9393931f;
    letter-spacing: 1px;
    padding: 0px !important;
}

.checkout_left .accordion-button:focus {
    z-index: unset;
    border-color: unset;
    outline: unset;
    box-shadow: unset;
}

.checkout_left .accordion-button {
    width: 23%;
    border: none !important;
    /* Removes the border from the button */
    box-shadow: none !important;
    /* Removes shadow */
    color: #000 !important;
}

.checkout_left .accordion-item {
    background-color: transparent !important;
    /* Makes the accordion item's background transparent */
    border: none !important;
    /* Removes the border */
}

.checkout_left .accordion-item:last-of-type .accordion-button.collapsed {
    background-color: transparent;
}

.checkout_right {
    background-color: #9393931f;
    padding: 0px !important;
}

.checkout_left h3 {
    /* background: linear-gradient(45deg, #673ab778, #512DA8, #1976d27a); */
    background-color: midnightblue;
    color: white;
    padding: 10px;
}

.checkout_right h3 {
    /* background: linear-gradient(45deg, #673ab778, #512DA8, #1976d27a); */
    background-color: midnightblue;
    color: white;
    padding: 10px;
    text-align: center;
}

.checkout_coupon {
    background-color: #9393931f;
    padding: 3px;
}

.checkout_coupon_content {
    margin-left: 1rem;
}

.checkout_coupon_content .input-group > .form-control {
    width: 40%;
    border-radius: unset;
}

.checkout_btn {
    outline: none;
    border: none;
    background-color: midnightblue;
    color: white;
    width: 8rem;
}

.checkout_total {
    display: flex;
    justify-content: space-between;
    margin-left: 1rem;
}

.checkout_mobile_view {
    display: none;
}

.checkout_mobile_total {
    display: none;
}

@media (max-width: 768px) {
    .checkout_right {
        display: none;
    }

    .processing_fee {
        display: none;
    }

    .checkout_mobile_view {
        display: block;
    }

    .checkout_total {
        display: none;
    }

    .checkout_mobile_total {
        display: block;
    }
    .checkout_left .accordion-item:last-of-type .accordion-button.collapsed {
        background-color: transparent;
        width: 13rem !important;
        /* margin: 0 auto;s */
    }
}

.checkout_info {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.checkout_info span {
    color: mediumblue;
    font-weight: 500;
}

.checkout_info i {
    font-size: 24px;
    color: mediumblue;
}

@media (max-width: 768px) {
    .checkout_info {
        max-width: 100% !important;
        display: flex;
        flex-direction: column; /* Stack the items vertically */
        align-items: center; /* Center the items horizontally */
        justify-content: center; /* Optional: Center items vertically if necessary */
    }
    .checkout_info_1 {
        margin-top: 10px !important;
    }
    .checkout_info_2 {
        margin-top: 10px !important;
    }
}

/* Billing information and payment method checkout_page */
.checkout_billing {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.checkout_billing_info .input_size {
    width: 100%;
    padding: 18px;
    font-weight: 500;
    border-radius: unset;
}

.checkout_billing_info ::placeholder {
    font-size: 19px;
}

.checkout_billing_info .form-select {
    font-size: 19px;
}

.checkout_billing_info .form-select:focus {
    box-shadow: none;
    border-color: gray;
}

/* Responsive for smaller screens */
@media (max-width: 768px) {
    .checkout_billing {
        flex-direction: column;
    }

    .checkout_billing_info .input_size {
        width: 100%;
    }
    .checkout_margin_bottom {
        margin-bottom: 15px;
    }
}

@media (max-width: 576px) {
    .checkout_billing_info h3 {
        font-size: 1.5rem;
    }

    .checkout_billing_info .input_size,
    .checkout_billing_info .form-select {
        font-size: 16px;
    }
}

.checkout_payment .input_size {
    width: 100%;
    padding: 18px;
    font-weight: 500;
    border-radius: unset;
}

.checkout_payment ::placeholder {
    font-size: 19px;
}

.checkout_payment .form-select {
    font-size: 19px;
}

.payment_methods {
    text-decoration: none;
    color: inherit;
    letter-spacing: 0.7px;
}

.payment_methods:hover {
    text-decoration: none;
    color: inherit;
}
.payment-section .form-select:focus {
    border-color: unset;
    border: 1px solid rgb(197 188 188);
    outline: 0;
    box-shadow: unset;
}
.active-method {
    /* background: linear-gradient(45deg, #2f2f2f, #6c6c6c9e); */
    background-color: #05108a;
    color: white;
    padding: 6px;
    border-radius: 6px;
}

.active-method:hover {
    color: white;
}

#cardSection .form-select:focus {
    box-shadow: none;
    border: 1px solid gray;
}

.place_order {
    display: flex;
    justify-content: center;
    align-items: center;
}

.place_order button {
    /* background: linear-gradient(45deg, #2f2f2f, #6c6c6c9e); */
    background-color: #05108a;
    border-radius: 6px;
    font-weight: 500;
    border: 1px solid;
    padding: 8px;
    width: 12rem;
    margin-left: 10px;
    color: white;
    font-size: 19px;
    letter-spacing: 1px;
}
/* .payment_loader{
    display: flex;
    justify-content: center;
    align-items: center;
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100vh;
    background-color: rgba(0, 0, 0, 0.2);
} */

.payment_success_and_failed_section button {
    background-color: #348558;
    letter-spacing: 1px;
    font-size: 18px;
    color: white;
    font-family: "DM Sans";
    padding: 7px;
    width: 16rem;
}
.payment_failed {
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    padding: 20px;
    background-color: #fff;
    transition: all 0.3s ease;
}

/* Add a hover effect to make it more interactive */
.payment_failed:hover {
    box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.15);
    transform: translateY(-5px);
}

.payment_success {
    text-align: center;
}
.payment_success h3 {
    color: gray;
    letter-spacing: 1px;
}
.payment_success p {
    font-weight: 500;
    letter-spacing: 1px;
}
.payment_failed .btn {
    width: 15rem;
    padding: 10px 20px;
    border-radius: 5px;
    font-weight: bold;
    transition: background-color 0.3s ease, transform 0.3s ease;
}
.payment_failed .payment_failed_text {
    text-align: center;
    letter-spacing: 1px;
    color: gray;
}
.payment_failed_text h3 {
    color: #c92525;
}

.navbar_links .login_parent {
    display: flex;
    justify-content: center;
    align-items: center;
}
.navbar_links .login_parent .dropdown-menu{
    --bs-dropdown-border-radius : 0px 0px .375rem .375rem;
}
#estimatePrice.input-group > .form-control,
.input-group > .form-floating,
.input-group > .form-select {
    position: relative;
    flex: 1 1 auto;
    width: 65% !important;
    min-width: 0;
}
#estimatePrice .input-group-text {
 
}

#promotionModal .bonus-details-modal {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 10px;
}

#promotionModal .upper_bonus_part {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: rgb(3 34 78);
    color: white;
    padding: 5px;
}

#estimatePrice .extra-bonus input {
    width: 66%;
    padding: 10px;
    outline: none;
    border: 1px solid gray;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.extra_bonus_img {
    border: 1px solid;
    padding: 11px 25px 12px 19px;
    border-right: none;
    margin-right: -4px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
#promotionModal .upper_bonus_part h1 {
    font-size: 6.5rem;
    color: #bbcfff;
    border-radius: 23px;
    text-shadow: 0 0 15px rgba(255, 255, 255, 0.5),
        0 0 30px rgba(255, 255, 255, 0.4);
}
#promotionModal .upper_bonus_part h5 p {
    letter-spacing: 1px;
}
.upper_bonus_part i {
    font-size: 68px;
    color: #a10000;
    text-shadow: 0 0 15px rgba(255, 255, 255, 0.5),
        0 0 30px rgba(255, 255, 255, 0.4);
}
#promotionModal .modal-body p:hover {
    transform: scale(1.02);
    transition: transform 0.3s ease;
}
#promotionModal a {
    text-decoration: none;
    border-bottom: 1px solid;
    color: brown;
    font-weight: 500;
}
#promotionModal .lower_bonus_part {
    text-align: center;
    color: #060e50cc;
    letter-spacing: 0.3px;
    line-height: 25px;
}
#promotionModal .modal-header {
    border-bottom: none;
    background-color: rgb(3 34 78);
    color: white;
}
#promotionModal .modal-header .btn-close {
    background-color: white;
    opacity: unset;
}
#promotionModal .modal-body {
    max-height: 350px;
    overflow-y: scroll;
    scrollbar-width: thin;
    scrollbar-color: #9b9b9c #f9f4f4;
}
.bonus-text {
    display: inline-block;
    animation: flipText 2s linear infinite; /* Infinite flip animation */
}
/* Keyframe for flip animation */
@keyframes flipText {
    0% {
        transform: rotateX(0deg);
    }
    100% {
        transform: rotateX(360deg); /* Completes the flip */
    }
}

.header-menu .badge {
    position: relative;
}
.header-menu .badge .badge-icon {
    background-color: #ff5f57;
    color: white;
    font-size: 10px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 3px;
    border-radius: 6px;
    font-weight: bold;
    position: absolute;
    top: -11px;
    left: 62%;
    transform: translateX(-50%);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    animation: pulse 1.5s infinite ease-in-out;
}
@keyframes pulse {
    0% {
        transform: scale(0);
    }
    50% {
        transform: scale(0.9);
    }
    100% {
        transform: scale(1);
    }
}

/* About Section */
.about-us-section {
    padding: 28px 0;
    background-color: #f8f9fa;
    letter-spacing: 1px;
}
.about-us-section .about-us-section-content {
    padding: 40px;
    border-radius: 15px;
    box-shadow: 0px 0px 10px rgba(206, 206, 206, 0.5); /* Light shadow around all sides */
    background-color: #023040;
    color: white;
}
.about-us-section p {
    font-size: 1.125rem;

    line-height: 1.8;
    margin-bottom: 20px;
}


/* Privacy policy section */
.privacy-policy-section {
    padding: 26px 0;
    font-family: 'Poppins', sans-serif;
    
}

.privacy-policy-content {
    padding: 40px;
    border-radius: 15px;
    box-shadow: 0px 0px 10px rgba(206, 206, 206, 0.5); /* Light shadow around all sides */
    background-color: #023040;
    color: white;
}

.privacy-policy-section h1,
.privacy-policy-section h2 {
    font-weight: 700;
}

.privacy-policy-section h1 {
    font-size: 30px;
    margin-bottom: 20px;
    display: inline-block;
    padding-bottom: 8px;
    font-family: 'Poppins', sans-serif;
    
}

.privacy-policy-section h2 {
    font-size: 23px;
    margin-top: 30px;
    margin-bottom: 15px;
}

.privacy-policy-section p,
.privacy-policy-section ul {
    font-size: 1.125rem;

    line-height: 1.8;
    margin-bottom: 20px;
}

/* Terms and conditions section */
.terms-section .terms-section2{
    box-shadow: 0px 0px 10px rgba(206, 206, 206, 0.5);
    background-color: #023040;
    color: white;
    /* padding: 60px 0; */
    padding: 38px;
    border-radius: 2rem;
    font-family: 'Poppins', sans-serif;
    margin-top: 2rem;
}
.terms-section h1 {
    font-size: 30px;
    margin-bottom: 20px;
    font-family: 'Poppins', sans-serif;
    
}

.terms-section p,
.terms-section li {
    font-size: 1.125rem;
    line-height: 1.8;
}

.terms-section ol li {
    margin-bottom: 10px;
}

.terms-section .terms-box h2 {
    font-size: 25px;
    margin-top: 20px;
    padding-bottom: 10px;
}

.terms-section ul {
    padding-left: 20px;
}

/* How to recharge section Css */

.how-to-recharge {
    background-color: #d9ebf9;
    border-radius: 10px;
    /* box-shadow: 0 4px 20px rgba(0,0,0,0.1); */
    padding: 50px 20px;
    font-family: 'Poppins', sans-serif;
    position: relative;
}
.how-to-recharge .aeroplane{
    position: absolute;
    top: -47px;
    right: 108px;
}
.how-to-recharge .title {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    
}

.how-to-recharge .subtitle {
    font-size: 1.1rem;
    margin-bottom: 40px;
    font-weight: 500;
}

.how-to-recharge .icon-box {
    display: flex;
    flex-direction: column;
    height: 100%;
    align-items: center;
    justify-content: center;
    padding: 20px;
    
    

    transition: all 0.3s ease;

    text-align: center;
}
.how-to-recharge .icon-box img {
    margin-bottom: 15px;
}
.how-to-recharge .icon-box h5 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 22px;
    font-weight: 700;
}
.how-to-recharge .icon-box p {
    font-size: 0.9rem;
    margin-bottom: 0;
}

@media (max-width: 768px) {
    .how-to-recharge {
        margin-top: 6rem;
    }
    .how-to-recharge .icon-box {
        margin-bottom: 20px;
    }
    .how-to-recharge .icon-box-margin{
        margin-top: 15px;
    }
}
@media(max-width:575px){
    .aeroplane{
        right: 22px !important;
    }
}
/* My Account Page CSS */
.login_parent .dropdown-toggle::after {
    display: none;
}
.login_parent .dropdown-toggle {
    border-radius: 20px;
}
.headerSec .navbar-toggler {
    border: unset;
    outline: unset;
    background-color: #fff;
    color: black;
    padding: 8px;
    padding-left: 10px;
    padding-right: 10px;
}
/*.header-menu .dropdown-menu.show {
  text-align: center;
}
.header-menu .dropdown-menu.show .dropdown-item{
  padding: unset;
}*/
.login_parent .dropdown .dropdown-item {
    color: #000 !important;
}
.login_parent .dropdown-menu[data-bs-popper]{
    right: 0px !important;
    left: unset;
    top: 56px;
}
.header-menu .dropdown-menu.show .dropdown-item:hover {
    background-color: rgb(197 197 197 / 35%);

    font-weight: 500;
}

.Myaccount_container .transaction-history {
    border: 1px solid #e0e0e0;
    background-color: #fff;
    border-radius: 10px;
}

.Myaccount_container .table-dark {
    background-color: #343a40;
    color: #fff;
}

.Myaccount_container .table img {
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease;
}

.Myaccount_container .table img:hover {
    transform: scale(1.05);
}
.Myaccount_container .recharge-desc {
    font-size: 11px;
    font-weight: 500;
    color: #606060;
}
@media(max-width:992px){
    .Myaccount_container .table img{
        display: none;
    }
}
/* Dth Recharge html */
.dth-container {
    padding: 50px 0;
    letter-spacing: 0.8px;
}
.dth-container .select-card-operator{
    font-size: 22px;
    color: white;
}

.dth-container .dthphase-child{
    padding: 40px;
    border-radius: 15px;
    box-shadow: 0px 0px 10px rgba(206, 206, 206, 0.5);
    background-color: #023040;
}
.dth-container .dth-phase-1 .card {
    width: 19%;
    height: 10rem;
}
#product-list .dth-product .card{
    width: 9rem !important;
}
.dth-container
    .dth-phase-2
    .input-group
    > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(
        .valid-feedback
    ):not(.invalid-tooltip):not(.invalid-feedback) {
    /* width: 80%; */
    background-color: #023040;
    color: white;
}
.dth-phase-2 .usd-doller{
    display: flex;
    justify-content: end;
    font-size: 14px;
}
.dth-container .modal{
    --bs-modal-header-border-color : "unset" !important;
}

.dth-container .dth-phase-2 {
    justify-content: center;
    align-items: center;
}
.dth-container .dth-phase-2 .input-group-text {
    background-color: unset;
}
.dth-container .dth-phase-1 .dth_operators a {
    text-decoration: none;
    font-weight: 500;
    border-bottom: 1px solid;
    letter-spacing: 0.3px;
    color: #0000a5;
    cursor: pointer;
}

.phone-number-section .input-group {
    position: relative;
    display: flex;
    align-items: stretch;
    width: 100%;
    flex-wrap: unset;
    height: 58px;
}
@media (max-width: 992px) {
    .dth-container .dth-phase-1 .card {
        width: 100%;
    }
    .dth-container .dth-phase-1 .dth_operators {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .dth-container .dth-phase-1 h5 {
        text-align: center;
    }
    .dth-container.dth-phase-1 {
        text-align: center;
    }
    .dth-container .dth-phase-1 {
        flex-direction: column;
        justify-content: center;
    }
    .dth-container .dth-phase-2 {
        flex-direction: column;
        text-align: center;
    }
    .dth-container .dth-phase-2 .input-group {
        display: flex;
        justify-content: center;
    }
    .login_parent {
        display: none !important;
    }
    .mobile_recharge {
        display: none;
    }

}

/* under customer feedback section made  new  attrctive section */
.all-world-operators {
    background-color: #edebe3b0;
    /* padding: 20px; */

    padding-bottom: 3rem;
}
.all-world-operators .all-world-operators-left {
    display: flex;
    justify-content: center;
}
.all-world-operators .all-world-operators-right h2 {
    font-family: 'Poppins', sans-serif;
    
}
.all-world-operators .all-world-operators-right li {
    letter-spacing: 1px;
    font-size: 18px;
    line-height: 2;
}
@media (max-width: 992px) {
    .all-world-operators .all-world-operators-left img {
        max-width: 100%;
    }
}
/* choose_unicharge  section  */
.choose_unicharge h2 {
    font-family: 'Poppins', sans-serif;
    
}
.choose_unicharge .feature-icon {
    font-size: 2.5rem;
    color: #05108a; /* Custom color for icons */
}
.choose_unicharge .feature-card {
    transition: transform 0.3s;
}
.choose_unicharge .feature-card:hover {
    transform: scale(1.05);
}
.choose_unicharge .card {
    height: 100%;
}

#estimatePrice .input-group {
    position: relative;
    display: flex;
    flex-wrap: unset;
    align-items: stretch;
    width: 100%;
}

#estimatePrice .custom_input {
    width: 100% !important;
}

/* New dropdown page */

.new_dropdown .dropdown .btn {
    width: 100% !important;
    padding: 12px;
    border-radius: 26px;
    border: 1px solid;
}
.new_dropdown .dropdown .btn:hover {
    color: unset;
    background-color: unset;
    border-color: unset;
}
.new_dropdown .dropdown button img {
    width: 25px;
    margin-right: 10px;
    border-radius: 5px;
}

.new_dropdown .dropdown-menu {
    width: 100%;
}
.new_dropdown .start-top-up {
    margin-top: 2rem;
}
.new_dropdown .start-top-up button {
    width: 100%;
    padding: 8px;
    border-radius: 26px;
    background-color: #ffaa00;

    /* outline: none; */
    border: none;
    font-family: 'Poppins', sans-serif;
    
    font-weight: 700;
    font-size: 20px;
}

/* Faq section at home page */
.faq-background-color {
    background-color: #023040;
}
.faq-paragraph {
    font-size: 18px;
}
.faq-section .faq-question-heading {
    font-family: 'Poppins', sans-serif;
     
}
.faq-section {
    font-family: 'Poppins', sans-serif;
    
}
.faq-section .accordion-button:not(.collapsed) {
    color: #000;
    font-weight: 700;
    background-color: unset;
    box-shadow: none;
}
.faq-section .accordion .accordion-item {
    border: none;
}
.faq-section .accordion {
    --bs-accordion-btn-focus-box-shadow: unset;
    border: 1px solid #FFFFFFB2 !important; 
    border-radius: 7px;
}
.faq-section .accordion-button::after {
    --bs-accordion-btn-icon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAIvSURBVHgBvVfRccIwDFXK8R82cCdoOkHpBO0G7QbtBrABbBA2oEwQmAA6AdkgFPjjwNUDBdwQYoeGvLt3cLElPTm2InvkCK21zz+vzCdmwFRMX4YXzJg5Y06YX57nLagKcGDF7DHnzIj5yQxE0FEcsy1jQ31ACFu6FuIUgRNm1wzoKLorontlbE0HMO6XNj73MxBfytUoEINPqgjyauAzsE1MM3+nigGfhSsh77zSzHNipCvh5w1is4R0Y8i+6mUfqlIb5X8CfDlZynwY4thQTZAj2jcV6TqyNwSk+82/o0N5HXHpjKkmSJmOERsCUNvHVD9GiA0BKA6zopnr9XoOJkmiyALMSedbpo4RGwKUTcBut9uflGazGRWJwBjmYC5sLIgRGwJ826dzu90+s9O4SIQZHHNhU+RTYvrITJMDEGC5XM5Xq5XOvo502TGGOS6vCkBsD0WB/9+7NBBw3Gg0Ip6rcGo2m80+y2zmrVYrdgiOcjzHn6n1K5URYa7ENZmLADQwU+yBb2bb1RDZmXuibOYG9qcPAsbMlxKGWRHXBAdQfyZ/yiLVBFk1vS/FsvlQlW7WB+TgjTk4bnxRlNSxChc//bmNwm0EhMdPcWagjpbso3C/GcvzRhUDPrVL13WjtvzDqS03DNKVCK2Ki/2kt6uLmd/lPZTu6JH5w4zYuFNGiATuEGo9u4OvqzsufbpeAUPp7dv6/HIayFikT9c6ZfPvkSP06XreZj5QRdfzXw8uxSaPnJ+sAAAAAElFTkSuQmCC");
    /* Apply the white active icon */
    --bs-accordion-btn-active-icon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAIvSURBVHgBvVfRccIwDFXK8R82cCdoOkHpBO0G7QbtBrABbBA2oEwQmAA6AdkgFPjjwNUDBdwQYoeGvLt3cLElPTm2InvkCK21zz+vzCdmwFRMX4YXzJg5Y06YX57nLagKcGDF7DHnzIj5yQxE0FEcsy1jQ31ACFu6FuIUgRNm1wzoKLorontlbE0HMO6XNj73MxBfytUoEINPqgjyauAzsE1MM3+nigGfhSsh77zSzHNipCvh5w1is4R0Y8i+6mUfqlIb5X8CfDlZynwY4thQTZAj2jcV6TqyNwSk+82/o0N5HXHpjKkmSJmOERsCUNvHVD9GiA0BKA6zopnr9XoOJkmiyALMSedbpo4RGwKUTcBut9uflGazGRWJwBjmYC5sLIgRGwJ826dzu90+s9O4SIQZHHNhU+RTYvrITJMDEGC5XM5Xq5XOvo502TGGOS6vCkBsD0WB/9+7NBBw3Gg0Ip6rcGo2m80+y2zmrVYrdgiOcjzHn6n1K5URYa7ENZmLADQwU+yBb2bb1RDZmXuibOYG9qcPAsbMlxKGWRHXBAdQfyZ/yiLVBFk1vS/FsvlQlW7WB+TgjTk4bnxRlNSxChc//bmNwm0EhMdPcWagjpbso3C/GcvzRhUDPrVL13WjtvzDqS03DNKVCK2Ki/2kt6uLmd/lPZTu6JH5w4zYuFNGiATuEGo9u4OvqzsufbpeAUPp7dv6/HIayFikT9c6ZfPvkSP06XreZj5QRdfzXw8uxSaPnJ+sAAAAAElFTkSuQmCC");
}

.faq-section .accordion .accordion-header {
    border-bottom: none;
}

/* //////// */
.faq-section .accordion-item {
    background-color: transparent !important; /* Transparent background */
    /* border: 1px solid #FFFFFFB2 !important;  */
}

.faq-section .accordion-button {
    background-color: transparent !important; /* Transparent background */
    color: white !important; /* White text */
    border: none; /* Remove default button border */
}

.faq-section .accordion-button:focus {
    box-shadow: none; /* Remove focus outline */
}

 .faq-section .accordion-button::after {
    color: white !important; /* White icon for expand/collapse */
}

.faq-section .accordion-button.collapsed {
    color: white !important; /* White text when collapsed */
}

.faq-section .accordion-body {
    color: white; /* White text inside accordion content */
    background-color: transparent !important; /* Transparent background for content */
}

 .accordion-header {
    border-bottom: none; /* Optional: Remove header bottom border */
}
.chatbot-modal .modal-header{
    background-color: #023040;
}
.chatbot-modal .modal-footer input{
    width: 90%;
    outline: none;
    border: none;
}
/* Chat Message Styles */
.chatbot-modal .chat-message {
    margin-bottom: 15px;
  }
  
  .chatbot-modal .chat-message.bot {
    text-align: left;
  }
  
  .chatbot-modal .chat-message.user {
    text-align: right;
  }
  
  .chatbot-modal .chat-message p {
    display: inline-block;
    padding: 10px;
    border-radius: 10px;
    max-width: 70%;
    word-wrap: break-word;
  }
  
  .chatbot-modal .chat-message.bot p {
    background-color: #e9ecef;
    color: #333;
  }
  
  .chatbot-modal .chat-message.user p {
    background-color: #1a3942;
    color: white;
  }
  
  /* Scrollbar Styling */
  .chatbot-modal .chat-window::-webkit-scrollbar {
    width: 5px;
  }
  
  .chatbot-modal .chat-window::-webkit-scrollbar-thumb {
    background: #c9c9c9;
    border-radius: 5px;
  }
  .chatbot-modal {
    position: fixed;
    bottom: 82px; 
    right: 29px; 
    margin: 0;
    width: 100%;
  }
 .faq-background-color .modal-dialog{
    position: fixed !important;
   }
  .chatbot-modal .msgbox{
    position: absolute;
    bottom: -105px;
    right: -35px;
  }
  .faq-background-color .modal{
    --bs-modal-width:430px;
    --bs-modal-border-radius:1.5rem;
  }
@media(max-width:992px){
    .faq-section .accordion{
        margin-top: 20px;
    }
    .faq-question-heading{ 
       text-align: center;
    }
    .chatbot-modal{
        right: 0px;
    }
    .chatbot-modal .modal-footer input{
        width: 89%;
    }
}
/* //////////// */

/* Additional customization for the accordion button */
.faq-section .accordion-button {
    /* border: none; */
    background-color: transparent;
    box-shadow: none;
    font-weight: 700;
    font-size: 20px;
}
.faq-section .accordion-body p {
    font-weight: 400;
    color: #BFBFBF;
}

.font-family-set {
    font-family: 'Poppins', sans-serif;
}
.font-family-mon {
    font-family: 'Poppins', sans-serif;
}

/* Account Details Css */
.customer_detail_container {
    font-family: 'Poppins', sans-serif;
    
}
.customer_detail_container .customer-detail-form-right {
    height: 93%;
    padding: 10px;
    color: #606060;
    background-color: rgb(237, 237, 237, 0.56);
    width: 100%;
}

.customer_detail_container .customer-detail-form-left {
    height: 93%;
    padding: 10px;
    color: #606060;
}

.customer-detail-form-right .customer-input-details-phase-1 input,
.customer-detail-form-right .customer-input-details-phase-1 select {
    flex-grow: 1;
    width: 100%;
}

.customer-input-details-phase-2 {
    display: flex;
    justify-content: center;
}

.customer-detail-form-right .customer-input-details-phase-2 input {
    width: 100%;
    padding: 10px;
}
.customer-detail-form-left .set-eye-icon {
    position: relative;
}
.set-eye-icon .eye-icon {
    position: absolute;
    top: 50%;
    right: 25px;
    transform: translateY(-50%);
    cursor: pointer;
    color: #606060;
}
@media (max-width: 768px) {
    .customer-input-details-phase-1,
    .customer-input-details-phase-2 {
        flex-direction: column;
        gap: 0.5rem;
    }
    .customer-input-details-phase-1 input,
    .customer-input-details-phase-1 select,
    .customer-input-details-phase-2 input {
        width: 100%;
    }
}

/* Contact us page */
.contact-us{
    background-color: #023040;
    margin-top: 20px;
    padding: 20px;
    border-radius: 10px;
}
.contact-us .form-label{
   color: white;
}
.contact-us .form-control{
    padding: 12px;
}

 .mobile-number input{
    width: 100%;
    padding: 11px;
    padding-top: 14px;
    padding-left: 56px;
    outline: none;
    border-radius: 5px;
    border: 1px solid #063747;
    /* margin-top: 2px */
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.mobile-number .code{
    color: white;
    border: 1px solid rgb(52 86 108);
    padding: 10px;
    border-top-right-radius: 10px;
    /* padding-left: 12px; */
    border-bottom-right-radius: 10px;
    padding-top: 13px !important;
    position: absolute;
    padding-bottom: 12px !important;
    left: 51%;
    background-color: #063747;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}
@media(max-width:575px){
    .code{
        left: 8%!important;
    }
}
.contact-us textarea{
    width: 100%;
    border-radius: 5px;
    outline: none;
    padding-left: 10px;
}

.contact-us .mobile-group{
    border: 2px solid #023040;
}

.contact-us .submit-contact-form button{
    background-color: transparent;
    color: white;
    padding: 10px;
    border-radius: 5px;
    border: 1px solid white;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 1px;
    width: 100%;
}