/* @import url('https://fonts.googleapis.com/css2?family=Lexend:wght@300;400;500;600;700&display=swap'); */
:root{
      --bg:#edfff8;        
      --white:#ffffff;        
      --text:#001e3c;    
      --heading:#001e3c;
      --light-green:#024b8b;   
      --dark-blue:#001d3b;    
      --cta:#5adce4;       
      --border:#ccc;
      --radius:14px;
      --shadow:0 6px 18px rgba(0,0,0,.05);
    }
    * {
        box-sizing:border-box
     }

    /* html,body{
      height:100%;
      margin:0;
      font-family: 'Lexend', sans-serif;
      color:var(--text);
      background:var(--bg);
    } */
    
    body .br-hidden,
    .steps_wrapper fieldset.step{
       display:none!important;
    }
    .steps_wrapper fieldset{
        padding-left: 0;
        padding-right: 0;
    }
    .steps_wrapper fieldset.step.active{
        display: flex!important;
        flex-direction: column;
        flex-wrap: wrap;
        border: none;
    }
    .vets_wrapper{
      max-width:1100px;
      margin:0 auto;
    }

    .vets_main_section{
       display: flex ;
        flex-direction: column;
        width: 100%;
        padding: 40px 0px;
    }
    .notify_txt{
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        align-content: center;
        justify-content: center;
        align-items: center;
        width: 100%;
        padding: 15px 0px;
    }
    .notify_txt p{
      text-align: center;
    }
    button.back-btn:hover,
    button.back-btn:focus,
    button.back-btn {
        background: transparent;
        border: none;
        cursor: pointer;
        padding: 0;
        min-width: 20px;
        line-height: 1;
        outline:none;
    }
    .back-btn img{
        width: 25px;
        height: 25px;
    }
    .background_image{
        bottom: 0;
        height: auto;
        position: absolute;
        right: 0;
        width: 30dvw;
    }
    .vets_img{
        background-color: var(--bg);
        width: 100%;
    } 
    .vets_form{
        background: var(--white);
        width: 100%;
        max-width: 48rem;
        z-index: 10 !important;
        padding: 0 4rem;
        box-shadow: 0 0 3.3px #00000040;
        margin: 0 auto;
        position: relative;
        padding:20px;
    }
    
    .header-wrapper{
        padding: 20px 0 10px 0;
        margin: 40px 0 0 0;
        display: flex;
        flex-direction: column;
        align-items: start;
        gap:40px;
    }
    .form-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
    }

    .notify_section{
        background-color: var(--white);
        padding: 10px 24px;
        text-align: center;
        width: 100%;
        position: fixed;
        left: 0;
        top:143px;
        z-index: 1000 !important;
    }
    .notify_section p{
        margin: 0;
        font-size: 14px;
        color: var(--text);
    }
    .displayPetName{
        color: #ea6f08;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-color: transparent;
        background-image: linear-gradient(180deg, #ea6f08 0%, #f9b600 60%);
    }
    .callback-btn {
        background: linear-gradient(180deg, #ea6f08 0%, #f9b600 60%);
        color: white;
        border: none;
        padding: 9.8px;
        border-radius: 7px;
        cursor: pointer;
        font-size: 14px;
        font-weight: 700;
        line-height: 20px;
        transition: background-color 0.3s;
    }

    .callback-btn:hover {
        background-color: var(--light-green);
    }
    .progress-bars-container {
        display: flex;
        gap: 8px;
        flex: 1;
    }
    .progress-segment {
        flex: 1;
        height: 6px;
        background-color: #E5E5E5;
        border-radius: 3px;
        transition: background-color 0.3s ease;
    }
    .progress-segment.active {
        background: linear-gradient(180deg, #ea6f08 0%, #f9b600 60%);
    }
    .progress_nav{
        display: flex;
        align-items: center;
        gap: 12px;
        width: 100%;
    }
    .progress-text {
        font-weight: 700;
        color: var(--text);
        font-size: 12px;
    }
    .vetsform{
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    .vetsform legend{
        margin-top: 0;
        margin-bottom: 40px;
        font-size: 32px;
        font-weight: 700;
        color: var(--heading);
    }
    .vetsform .form-group,
    .callbackform .form-group{
        display: flex;
        flex-direction: column;
        width: 100%;
        gap:10px;
    }
    .vetsform .form-group label,
    .callbackform .form-group label,
    .recap-date label{
        font-size: 14px;
        line-height: 18px;
        font-weight: 700;
        color: var(--text);
    }
    .vetsform .form-group input,
    .callbackform .form-group input,
    .slect_box select{
        border: 1px solid var(--border);
        padding: 15px;
        border-radius: .5rem;
        font-size: 16px;
        line-height: 1.5rem;
        font-weight: 400;
        color: var(--text);
    }
    .form-group.form-error  .select2-selection--single {
        border: 1px solid #e63946 !important;
        background-color: #ffe8e8 !important; 
    }
    .form-group  .has-error {
        border: 1px solid #e63946 !important;
        background-color: #ffe8e8 !important; 
    }
    
    .phone-input-box {
        display: flex;
        align-items: center;
        border: 1px solid #ccc;
        padding: 8px;
        border-radius: 6px;
        gap: 6px;
    }

    .phone-input-box input {
        border: none;
        outline: none;
        flex: 1;
    }

    .flag {
        font-size: 20px;
    }
    .prefix {
        font-weight: bold;
    }


     .vetsform .form-group  p.info-text{
        font-size: 12px;
        line-height: 14px;
        font-weight: 300;
        color: var(--text);
        margin: 0;
     }
     .field_spaceing{
        padding: 40px 0 30px 0;
     }

    .radio-group {
        display: flex;
        gap: 30px;
        flex-wrap: wrap;
    }

    .radio-option {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 12px;
        border: 1px solid var(--border);
        border-radius: 8px;
        cursor: pointer;
        transition: all 0.3s ease;
        background-color: var(--white);
        width: 100%;
        max-width: 197px;
        position: relative;
        box-shadow: 0 0 0 0px transparent; 
    }
    .radio-option.radio-simple{
        flex: 1;
        max-width: 100%;
        padding: 20px 0;
        justify-content: center;
    }
    .radio-option.radio-simple:hover{
         border-color:var(--cta);
         box-shadow: 0 0 0 1px var(--cta);
    }
    
    .radio-option:hover {
        border-color:var(--text);
    }
    .radio-option svg{
        width: 25x;
        height: 25px;
    }

    .radio-option input[type="radio"] {
        position: absolute;
        opacity: 0;
        cursor: pointer;
    }

    .radio-option:has(input[type="radio"]:checked) {
        border-color: var(--cta);
        background-color: var(--bg);
       box-shadow: 0 0 0 1px var(--cta);
    }
    .radio-option:has(input[type="radio"]:checked):hover{
        background-color: #e5f7f0;
    }
    .animal-icon {
        width: 40px;
        height: 40px;
        object-fit: cover;
        border-radius: 50%;
        transition: transform 0.3s ease;
    }
    .radio-option.radio-simple:hover span,
    .radio-option.radio-simple:has(input[type="radio"]:checked) span{
          color:var(--text);
          font-weight: 600;
    }
    .radio-option.radio-simple:hover svg path,
    .radio-option.radio-simple:has(input[type="radio"]:checked) svg path{
        stroke: var(--text) !important;
    }
    .radio-option.radio-simple span{
        color:#999999;
        flex: none;
        font-weight: 400;
        font-size: 16px;
    }
    .radio-option span {
        font-weight: 500;
        font-size: 16px;
        color: var(--text);
        flex: 1;
    }
    .radio-option:has(input[type="radio"]:checked) span {
        font-weight: 700;
    }
    .info_box{
        display: flex;
        align-items: center;
        justify-content: start;
        background-color: #ebf5fa;
        gap:10px;
        padding:10px 12px;
        border-radius: 8px;
        border: 1px solid #aed9ea;
    }
    .info_box p{
        font-size: 14px;
        line-height: 18px;
        color: #666666;
        margin: 0;

    }
    .info_box img{
        width: 12px;
        height: 12px;
    }
    .vets_condition p{
        font-size: 14px;
        font-weight: 400;
        line-height: 18px;
        color: var(--text);
    }
    .form_footer ul{
        display: flex;
        align-items: center;
        justify-content: center;
        gap:18px;
        padding: 10px 32px;
        margin:0;
    }
    .form_footer ul li{
        list-style: none;
    }
    .form_footer a{
        text-decoration: underline;
        color: #999;
        font-size: 12px;
        line-height: 16px;
        font-weight: 400;
        transition: color 0.3s;
    }
    .form_footer p{
        color: #999;
        font-size: 12px;
        line-height: 16px;
        font-weight: 400;
        text-align: center;
        margin:0;
    }
    .step-buttons{
        display: flex;
        justify-content: center;
        align-items: center;
        padding: .75rem; 
        background-color: var(--white);
        width: 100%;
        margin: 0 auto;
        box-shadow: 0 1px 4.6px #0000003b;
        border-radius: 12px;
    }
    .button_sticky{
        position: relative;
        width: 100%;
        max-width: 768px;
        padding: 20px 0;
    }
    .button_sticky[style*="position: absolute"] .step-buttons {
        max-width: 100% !important;
        margin: 0 auto;
        display: block;
    }

    .step-buttons button,
    #submit-btn{
        background: linear-gradient(180deg, #ea6f08 0%, #f9b600 60%);
        color:var(--white);
        border: 1px solid #f9b600;
        border-radius: 8px;
        padding: 12px 24px;
        font-size: 16px;
        font-weight: 600;
        cursor: pointer;
        width: 100%;
        opacity: .3;
    }
    .step-buttons .next-btn.active{
        opacity: 1 !important;
    }
    
    .button-loader {
      border: 2px solid #ffffff; 
      border-top: 2px solid #000;
      border-radius: 50%;
      width: 16px;
      height: 16px;
      animation: spin 0.8s linear infinite;
      display: inline-block;
      vertical-align: middle;
      margin-left: 8px;
    }

    @keyframes spin {
      0% { transform: rotate(0deg); }
      100% { transform: rotate(360deg); }
    }

    
    .select2-container .select2-selection--single {
        box-sizing: border-box;
        cursor: pointer;
        display: flex;
        height: 64px!important;
        padding: 15px 15px;
        user-select: none;
        -webkit-user-select: none;
        align-content: center;
        justify-content: flex-start;
        align-items: center;
        flex-direction: row;
        border: 1px solid var(--border) !important;
        flex-wrap: wrap;
    }
    .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 28px;
        top: 18px;
        right: 5px;
        width: 25px;
    }
    .select2-container--default .select2-selection--single .select2-selection__arrow b {
        border-color: #e5e7eb transparent transparent transparent;
        border-style: solid;
        border-width: 6px 5px 0 5px;
    }
    .select2-container--open .select2-dropdown--below{
        margin-top:20px;
        border-top:1px solid #aaa;
    }


    .select-group{
        display: flex;
        flex-direction: row;
        gap:20px;
    }
    .custom-select {
        position: relative;
        user-select: none;
        font-size: 15px;
    }

    .selected {
        border: 1.8px solid #ccc;
        border-radius: 0.5rem;
        background: #fff;
        padding: 18px 40px 18px 10px;
        cursor: pointer;
        position: relative;
    }

    .custom-select:not(.disabled) .selected:after,
    .search-select-selected:after {
        content: '';
        position: absolute;
        right: 18px;
        top: 50%;
        transform: translateY(-50%);
        width: 0; height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-top: 5px solid #333;
        display: block;
    }
    .custom-select.disabled .selected:after {
       display: none;
    }

    .custom-select.open .selected:after {
         display: block;
         transition: transform 0.2s;
    }
    .custom-select.open .selected:after {
         transform: translateY(-50%) rotate(180deg);
    }

    .options {
        display: none;
        position: absolute;
        top: 100%; left: 0; right: 0;
        background: #fff;
        border: 1.5px solid #ccc;
        border-top: none;
        z-index: 100;
        border-radius: 0.5rem;
        max-height: 180px;
        overflow-y: auto;
    }
    .options div:first-of-type{
        display: none;
    }

    .custom-select.open .options {
       display: block;
    }
    .custom-select.open .options {
         display: block;
    }

    .custom-select.disabled {
        pointer-events: none;
        opacity: 0.6;
    }
    .option {
        padding: 12px 10px;
        cursor: pointer;
        transition: background 0.2s;
    }
    .option:hover {
         background: #f0f0f0;
    }

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

    .search-select {
        position: relative;
        width: 100%;
    }

    .search-select-selected {
        border: 1px solid #ccc;
        border-radius: 0.5rem;
        padding: 18px 40px 18px 10px;
        background: #fff;
        cursor: pointer;
        display: flex;
        align-items: center;
    }
     .search-select-selected input{
        border: none !important;
        padding: 0 !important;
     }

    .search-select-selected input {
        border: none;
        background: transparent;
        width: 100%;
        font-size: 16px;
    }

    .search-select-selected input:focus {
        outline: none;
    }

    .search-select-arrow {
        position: absolute;
        right: 18px;
    }

    .search-select-dropdown {
        position: absolute;
        left: 0; right: 0;
        top: 100%;
        background: #fff;
        border: 1px solid #ccc;
        border-radius: 0.5rem;
        z-index: 100;
        display: none;
         height: auto;
         max-height: 260px;
         width: 100%;
    }

    .search-select.open .search-select-dropdown {
        display: block;
    }

    .search-select-search {
        padding: 10px;
        border-bottom: 1px solid #eee;
        position: relative;
    }

    .search-select-search input {
        width: 100%;
        padding: 7px;
        font-size: 14px;
        border: 1px solid #ccc;
        border-radius: 4px;
    }

    .search-select-clear {
        background: none;
        font-size: 10px;
        cursor: pointer;
        padding: 1px 4px;
        color: #888;
        position: absolute;
        border: 1px solid #888;
        border-radius: 50px;
        right: 18px;
        top: 29px;
    }

    .search-select-options-container  {
        max-height: 180px;
        overflow-y: auto;
    }
    .search-select-options {
        margin: 0;
        padding: 0;
        list-style: none;
        height: auto;
        max-height: 170px;
        overflow-y: auto;
    }

    .search-select-options li:not(:nth-child(1)):not(:nth-child(2)):not(:last-child) {
        border-bottom: 1px solid #ccc;
    }
    .search-select-option {
         padding: 15px 10px;
         cursor: pointer;
         font-size: 15px;
    }

    .search-select-option:hover {
        background: #f0f0f0;
    }
    .search-select-title {
        color: #999;
        font-size: 13px;
        padding: 3px 10px 8px 10px;
        cursor: default;
    }
    .bottom_spacing{
        padding-bottom: 30px;
    }
    .box_spacing{
        margin: 30px 0;
    }
    .search-select-label {
        padding: 8px 10px 0 10px;
        font-size: 13px;
        color: #999;
    }

    .search-select-noresult {
        padding: 10px 10px 18px 10px;
        color: #d00;
        font-size: 16px;
    }
    .radio-group.animal_detail{
        padding-bottom: 60px;
    }
    .radio-group.animal_detail label{
        max-width: 100%;
        padding: 24px;
        background-color: #f7f7f7 !important;
        border:none !important;
    }
    .radio-group.animal_detail img{
        width: 56px !important;
        height: 56px !important;
    }
    .radio-group.animal_detail p,
    .radio-group.animal_detail h3{
        margin: 0;
    }
    .vets_price .radio-group{
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }
    .price_box{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap:10px;
    }
    .price_box span{
        margin: 0;
        font-size: 16px;
        font-weight: 400;
        text-align: center;
    }
    .price_box span:first-of-type{
        font-size: 16px;
        font-weight: 700;
    }

    .info_description{
        color: #64748b;
        font-size: 16px;
        font-weight: 600;
        line-height: 24px;
    }
    .custom-checkbox {
        display: flex;
        align-items: flex-start;
        cursor: pointer;
        font-family: inherit;
        font-size: 16px;
        margin-bottom: 16px;
        user-select: none;
        line-height: 1.3;
        position: relative;
        padding-left: 32px;
    }
    .custom-checkbox input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }
    .custom-checkbox .checkmark {
        position: absolute;
        left: 0;
        top: 2px;
        height: 20px;
        width: 20px;
        background-color: #fff;
        border: 2px solid var(--cta);
        border-radius: 4px;
        box-sizing: border-box;
    }
    .custom-checkbox input:checked ~ .checkmark {
        background-color: var(--cta);
        border-color: var(--cta);
    }
    .custom-checkbox .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }
    .custom-checkbox input:checked ~ .checkmark:after {
        display: block;
    }
    .custom-checkbox .checkmark:after {
        left: 6px;
        top: 2px;
        width: 3px;
        height: 10px;
        border: solid #fff;
        border-width: 0px 1px 2px 0;
        transform: rotate(45deg);
    }
    .client_info_container{
        display: flex;
        flex-direction: column;
        gap:20px;
    }
    .privacy_text{
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
        color: #94a3b8;
        margin: 0;
    }

    /* call back form page css start here */

    .header-section{
        padding: 20px 0 10px 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin: 0 auto;
        gap:20px;
        background-color: var(--white);
    }

    .logo_img img{
        width: 70px;
        height: 70px;
    }
    .callback-header{
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        width: 60%;
    }
    .banner_txt{
        font-size: 16px;
        font-weight: 400;
        column-rule: var(--text);
        margin: 0;
    }
    .image-container img{
        height: 130vh;
        object-fit: cover;
        object-position: left ;
        overflow: hidden;
        position: absolute;
        width: 100%;
    }
    .callback-content-container{
        display: grid;               
        grid-template-columns: repeat(12, 1fr); 
        position: relative;          
        padding-left: 0;              
        padding-right: 0; 
        width: 100%;
        max-width: 1536px;
        margin: 0 auto;
    }
    .callback-form-container{
        grid-column: span 12 / span 12;
    }

    .callbackform-container,
    .callback-submit-container{
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap:3rem;
    }

    .call-me-options .radio-option.radio-simple{
        padding: .75rem 0;
    }
    .callback-form{
        background-color: #fff;
        border-radius: .75rem;
        padding: 2.5rem 1.5rem;
        box-shadow:
            0 0 #0000,
            0 0 transparent,
            0 0.625rem 1.9375rem rgba(15, 50, 83, 0.071);

    }
     .callback-form .personal-info{
        display: flex;
        flex-direction: column;
        gap: 20px;
     }

     .callback-container{
        padding: 2.5rem 1rem 0 1rem;
     }

     .callback-container .main-title{
        font-size: 36px;
        font-weight: 900;
        line-height: 40px;
        color:var(--heading);
        margin: 0;
        padding: 1rem;
     }
     .callback-container .subtitle{
        font-size: 18px;
        font-weight: 500;
        line-height: 28px;
        color:var(--text);
        margin: 0;
        padding:0 1rem 1rem 1rem;
      
     }
     .title-underline{
        border: 1px solid var(--cta);
        display: block;
        margin: 1.5rem 0 1rem;
        position: relative;
        width: 6rem;
     }
     .title-underline:after {
        background-color: var(--cta);
        border-radius: 50%;
        bottom: 0;
        content: "";
        height: .375rem;
        left: 33.3333%;
        position: absolute;
        transform: translate(-50%, 50%);
        width: .375rem;
    }

    .form-title{
        font-size: 24px;
        font-weight: 900;
        line-height: 32px;
        color: var(--heading);
    }
    .callback-form-submit{ 
        display: grid;
        grid-column-start: 2;
        margin-top: 1.7rem;
    }
    
    .callback-submit-container{
        padding: 2rem 0;
    }

    .form-header .callback-btn.mob-btn{
        display: none;
    }


    .elementor-column-gap-default>.elementor-column>.elementor-element-populated{
        padding: 0 !important;
    }



    /* client form css start here */

    .birth-place,
    .card_inner_details{
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 20px;
    }
    .recap-wrapper div:first-of-type,
    .recap-wrapper div:nth-child(2),
    .recap-animal,
    .recap-section div:first-of-type,
    .recap-total p,
    .total_price_desc p{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
     .total_price_desc p span{
        font-weight: 700;
        font-size: 18px;
     }
    .recap-animal{
        padding: 10px 0;
        border-bottom: 1px solid #ccc;
    }
    .recap-section div:first-of-type{
        padding: 10px 0;
        border-bottom: 1px solid #ccc;
    }
    #recap_total{
        font-size: 20px;
        font-weight: 600;
    }
    .recap-total {
        padding-bottom: 30px !important;
        border-top: 1px solid #ccc !important;
        padding-top: 10px !important;
    }
    .recap-table {
        width: 100%;
        border-collapse: collapse;
        margin-bottom: 15px;
    }
    .recap-table td {
        border: none;
        background: transparent !important;
        padding: 8px 0;
    }
    .pdf-wrapper a{
        font-size: 14px;
        text-decoration: underline;
        color: var(--text);
    }
    .toggle-box ul{
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: 5px;
    }
    .recap-wrapper p{
        margin: 0;
    }
    .recap-wrapper a{
        color: #9e9e9e;
    }

    .recap-date input{
        margin: 10px 0;
    }
    .recap-date small{
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 14px;
        font-weight: 600;
    }
    .recap-table tr td:nth-child(2){
        text-align: right;
    }
    .recap-title{
        font-size: 14px;
        font-weight: 700;
        color: #ea6f08;
    }


    .toggle-box {
        display: none; 
        border-radius: 8px;
        color: #222;
    }

    .toggle-link {
        display: inline-block;
        font-weight: 600;
        text-decoration: underline;
        cursor: pointer;
        color:var(--dark-blue);
        margin-bottom: 8px;
        user-select: none;
        transition: color 0.3s ease;
    }

    .toggle-link:hover {
        color: var(--light-green); 
    }

    .price-wrapper{
        padding-top: 20px;
    }
    .price_desc{
        padding: 20px;
        background-color: #f4faf9;
        border-radius: 12px;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .price_desc h4{
        font-size: 38px;
        font-weight: 700;
        color: var(--text);
    }
    .price-wrapper p{
        font-size: 14px;
        color: var(--text);
    }
    .coupen_field{
        padding: 20px;
        border-radius: 12px;
        background-color: #f2f2f2;
        margin: 20px 0;
        
    }
    .pdf-section{
        padding: 20px;
        border-radius: 12px;
        background-color: #edfff8;
        border: 2px solid var(--cta);
        display: flex;
        flex-direction: column;
        gap: 10px;
        margin-bottom: 10px;
    }
    .total_price_desc{
        padding: 20px;
        border-radius: 12px;
        background-color: #f2f2f2;
        margin-bottom: 20px;
    }
    .price-wrapper small{
        font-size: 14px;
        font-weight: 600;
        margin-top: 10px;
    }
    .price-wrapper a,
    .price-wrapper h3,
    .price-wrapper p,
    .price-wrapper h4,
    .card_info p{
        margin: 0 !important;
    }

    .payement-type-box{
        padding: 40px 16px;
        background: #fafbfd;
        border-radius: 12px;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin: 20px 0;
    }

    .cards_img{
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 25px;
        width: 100%;
        padding: 0 64px 36px 64px;
        border-bottom: 1px solid var(--border);
    }
    .card_info{
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 20px;
    }
    .payment-info{
        font-size: 14px;
        columns: var(--text);
    }

    .carte-wrapper,
    .domiciliation-wrapper{
        padding-top: 10px;
    }

    /* client form css end here */
    
    @media (min-width: 1024px) {        
        .callback-form-container {
            grid-column: span 7 / span 7;   
            grid-column-end: 13;     
                   
        }

    }

    @media (min-width: 768px) {    
        .callback-content-container {
            padding-left: 2rem;       
            padding-right: 2rem;
        }
    }

   @media (max-width: 1280px)  {
       .callbackform-container .radio-option.radio-simple{
          flex: 1 1 100%;
          width: 100%;
        }
        .callback-header{
            width: 70%;
        }
    }

    @media(max-width: 1023px){
      .page-wrapper .image-container img{
            display: none;
        }
        .header-section{
            padding: 20px 20px 10px 20px;
        }
        .banner_txt{
            text-align: center;
        }
        .callback-header{
            width: 100%;
            padding: 0 40px;
        }
        .callback-submit-container{
            grid-template-columns: 1fr ;
        }
        .callback-form-submit {
            grid-column-start: 1;
        }
        .callback-form-container{
            padding-bottom: 60px;
        }
    }
/* br-subscription CSS */

/* slider css */


.owl-item.active.center .shadow-effect {
	border: 3px solid #5adce4;
	background: #fff;
	padding: 20px;
	border-radius: 4px;
	text-align: center;
	border-radius: 16px;
	box-shadow: 0 19px 38px rgba(0, 0, 0, 0.10), 0 15px 12px rgba(0, 0, 0, 0.02);
}

#customers-testimonials .item,
#insurance-testimonials .item {
	text-align: center;
	margin-bottom: 80px;
	opacity: .2;
	-webkit-transform: scale3d(0.8, 0.8, 1);
	transform: scale3d(0.8, 0.8, 1);
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

#customers-testimonials .owl-item.active.center .item,
#insurance-testimonials .owl-item.active.center .item {
	opacity: 1;
	-webkit-transform: scale3d(1.0, 1.0, 1);
	transform: scale3d(1.0, 1.0, 1);
}

#customers-testimonials.owl-carousel .owl-dots .owl-dot.active span,
#customers-testimonials.owl-carousel .owl-dots .owl-dot:hover span,
#insurance-testimonials.owl-carousel .owl-dots .owl-dot.active span,
#insurance-testimonials.owl-carousel .owl-dots .owl-dot:hover span{
	background: #000;
	transform: translate3d(0px, -50%, 0px) scale(0.7);
}

#customers-testimonials.owl-carousel .owl-dots,
#insurance-testimonials.owl-carousel .owl-dots {
	display: inline-block;
	width: 100%;
	text-align: center;

}

#customers-testimonials.owl-carousel .owl-dots .owl-dot,
#insurance-testimonials.owl-carousel .owl-dots .owl-dot {
	display: inline-block;
}

#customers-testimonials.owl-carousel .owl-dots .owl-dot span,
#insurance-testimonials.owl-carousel .owl-dots .owl-dot span {
	background: #d9d9d9;
	display: inline-block;
	height: 20px;
	margin: 0 2px 5px;
	transform: translate3d(0px, -50%, 0px) scale(0.3);
	transform-origin: 50% 50% 0;
	transition: all 250ms ease-out 0s;
	width: 20px;
	border-radius: 50%;
}


.vet-container div {
	padding: 10px 0;
}

.plan-card {
	display: flex;
	flex-direction: column;
	align-items: start;
	gap: 20px;

}

.plan-card h3 {
	font-size: 28px;
	font-weight: 600;
	color: #ea6f08;
	margin: 0;
}

.card-content {
	width: 100%;
}

.plan-card span {
	font-size: 14px;
}

.vet-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 40px;
}

 ul.br-subscription{
        max-width:40%;
        display: flex;
        flex-direction: row;
        gap: 3px;
        padding: 0;
        margin: 0;
        width: 100%;
        justify-content: center;
        align-items: center;
        align-content: center;
        flex-wrap: wrap;
    }
    ul.br-subscription li{
        padding:10px 30px;
        text-transform: capitalize;
        opacity: 0.3;
        list-style: none;
        font-size: 24px;
        font-weight: 600;
        color: #333333;
        text-align: center;
        border-bottom: 1px solid #000;
    }
    
     ul.br-subscription li.active{
        opacity:1;
        border-bottom: 2px solid #000;
     }

 

.card-content ul {
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding: 0;
	margin: 0;
	width: 100%;

}

.card-content ul li {
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;

}

.center-line {
	display: flex;
	width: 90%;
	height: 1px;
	background: #cccc;
}
.card-content.last-section h4{
	border-bottom:1px solid #ccc;
	width:100%;
	text-align:start;
	padding-bottom:10px;
}

.price {
	font-size: 18px !important;
	font-weight: 700;
	color: black;
}

.card-content {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: start;
}

.card-content h4 {
	font-size: 16px;
	font-weight: 600;
	margin:0;
	margin-bottom:10px;
}

#customers-testimonials .owl-nav,
#insurance-testimonials .owl-nav   {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translateY(-50%);
  display: flex;
  justify-content: space-between;
  pointer-events: none; 
}

#customers-testimonials .owl-nav button,
#insurance-testimonials .owl-nav button   {
  background: #000 !important;
  color: #fff !important;
  width: 45px;
  height: 45px;
  line-height: 45px;
  font-size: 22px !important;
  border: none;
  pointer-events: all; 
  transition: all 0.3s ease;
}

#customers-testimonials .owl-nav button:hover,
#insurance-testimonials .owl-nav button:hover{
  background: #5adce4 !important;
}

.card-content.section-two ul {
  background: #fafafa !important;
  width: 100% !important;
  padding: 20px;
  border-radius: 8px;
}
.card-content.section-two span.price{
	color:#ea6f08!important;
}
.card-content.section-three ul{
  background: #ebf5fa !important;
  width: 100% !important;
  padding: 20px;
  border-radius: 8px;	
}
.vet-bottom {
  position: fixed;
  bottom: 0;
   left: 50%;
  transform: translateX(-50%);
  width: 100%;
	max-width:1024px;
  background: #fff;
   box-shadow: rgba(0, 0, 0, 0.25) 0px 0px 4px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 30px;
  z-index: 9999;
  border-radius:16px 16px 0 0;
}
.vet-bottom h3, .vet-bottom h4, .vet-bottom h6{
    margin:0;
}   
.vet-bottom h3{
    font-size: 24px;
    font-weight: 600;
  color: #ea6f08;
}
.vet-bottom .price{
    font-size: 20px;
    font-weight: 700;
    color: black;
}

.vet-bottom div:nth-child(3) {
display: flex;
align-items: center;
gap: 10px;  
}
.vet-bottom span{
    font-size: 14px;
}

.vet-bottom div:nth-child(4){
    display: flex;
    align-items: center;
    gap: 10px;  
}

.vet-bottom div:nth-child(4) button:first-of-type {
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 600;
  border: 1px solid #ea6f08; 
  border-radius: 4px;
  cursor: pointer;
  background: #fff; 
  color: #ea6f08;
}

.vet-bottom div:nth-child(4) button:last-of-type {
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 600;
  border: none;
  background: linear-gradient(180deg, #ea6f08 0%, #f9b600 60%);
  border-radius: 4px;
  cursor: pointer;
  color: #fff;
}

.vet-bottom div:nth-child(2) {
  position: relative;
  padding: 0 20px; 
}

.vet-bottom > div:nth-child(2)::before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
	left:-10px;
  height: 45px; 
  background-color: #ddd; 
}

.vet-bottom > div:nth-child(2)::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
	right:-10px;
  height: 45px; 
  background-color: #ddd; 
}

.plan-card .card-heading{

    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 20px;
    background-color: #edfff8;
     box-sizing: border-box;
     border-radius: 16px 16px 0 0;
     width: 100%;
     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
}
.plan-card .card-heading h5{
    margin: 0;
    font-size: 16px;
}

#insurance-testimonials .card-content.section-one p{
    text-align: left;
    padding: 0 20px !important;
    box-sizing: border-box;
    margin: 0;
}

#insurance-testimonials .card-content ul li{
    list-style-type:  disc !important;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: start;
    text-align: left;
    padding:  5px 20px;
}



#insurance-testimonials .card-content ul li span{
    font-weight: 600;
    color: #ea6f08;
}

#insurance-testimonials .plan-card{
    padding-bottom: 80px;
}

.insurance-heading div{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 60px;
}
.insurance-heading h2{
    margin: 0;
    font-size: 32px;
    font-weight: 600;
}
.insurance-heading h5{
    margin: 0;
    font-size: 20px;
    font-weight: 400;
}
#insurance-testimonials .owl-item.active.center .shadow-effect{
    padding: 0 !important;
    border: 2px solid #ccc !important;
}
#subscriptionCarousel{
    width: 100%;
    max-width: 712px;
    overflow: hidden;
    padding-bottom: 50px;
}
   #subscriptionCarousel .owl-stage-outer{
    overflow-x: hidden;
   }
   .recap-date{
     width: 100%;
     max-width: 712px;
     padding-top: 10px;
   }

   #subscriptionCarousel .item{
    width: 100%;
   }
   .recap-card{
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 10px;
    width: 100%;
    padding: 0 10px;
   }
   #subscriptionCarousel .recap-card img{
    width: 60px;
    height: 60px;
   }

   #subscriptionCarousel .owl-nav button {
    background: #000 !important;
    color: #fff !important;
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 13px !important;
    border: none;
    pointer-events: all; 
    transition: all 0.3s ease;
    }

    #subscriptionCarousel .owl-nav button:hover{
    background: #5adce4 !important;
    }

    .recap-card > div:first-of-type > div{
        display: flex;
        gap: 10px;
    }
   #subscriptionCarousel .owl-nav{
    position: absolute;
    bottom: 7px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 10px;
   }
   #subscriptionCarousel .owl-nav.disabled {
        display: none !important;
    }
   .recap-price{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
   }
   .recap-card > div:first-of-type{
    width: 100%;

   }
   #subscriptionCarousel .recap-card table{
    border-bottom: 1px solid #e4e2e2;
    margin: 0;
   }
   #subscriptionCarousel .recap-card table tr:last-of-type td{
    padding-bottom: 20px;
   }
   
   /* Container */
.ui-datepicker {
    padding: 15px;
    background: #FFFFFF !important;
    border: 1px solid #d9d9d9 !important;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    width: 290px;
    font-family: inherit;
}

/* Header */
.ui-datepicker-header {
    background: #001E3C !important;
    color: #FFFFFF !important;
    padding: 12px 0;
    border-radius: 10px 10px 0 0;
}

/* Month/Year title */
.ui-datepicker-title {
    font-size: 15px;
    font-weight: 600;
    color: #FFFFFF !important;
}

/* Prev/Next buttons */
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    cursor: pointer;
    color: #FFFFFF !important;
}

.ui-datepicker .ui-datepicker-prev:hover,
.ui-datepicker .ui-datepicker-next:hover {
    color: #F9B600 !important;
}

/* Calendar table */
.ui-datepicker table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 6px;
}

/* Weekday headings */
.ui-datepicker th {
    padding-bottom: 8px;
    font-size: 12px;
    color: #001E3C;
}

/* Each cell */
.ui-datepicker td {
    padding: 3px;
}

/* Day buttons */
.ui-datepicker td a {
    display: block;
    padding: 8px 0;
    text-align: center;
    font-size: 14px;
    border-radius: 6px;
    color: #001E3C !important;
    border: 1px solid transparent;
    transition: 0.25s ease;
}

/* Hover */
.ui-datepicker td a:hover {
    background: #F2F2F2;
}

/* Disabled days */
.ui-datepicker-unselectable span {
    background: #EFEFEF !important;
    color: #BBBBBB !important;
    border-radius: 6px;
    cursor: not-allowed;
}

/* Selected date (Active day) */
.ui-datepicker .ui-state-active {
    background: #001E3C !important;
    color: #FFFFFF !important;
    border-color: #001E3C !important;
}

/* Allowed special dates (from your API) */
.allowed-date a {
    background: #FFF5D1 !important; /* soft accent background */
    border: 1px solid #F9B600 !important;
    color: #001E3C !important;
    font-weight: 600;
}

/* Highlight today's date border */
.ui-datepicker-today a {
    border: 1px solid #014285 !important; /* using your color */
}

/* Input styling */
#recap_start_date {
    padding: 12px;
    border: 1px solid #d6d6d6;
    border-radius: 8px;
    width: 100%;
    font-size: 15px;
}

#recap_start_date:focus {
    border-color: #001E3C;
    box-shadow: 0 0 4px rgba(0, 30, 60, 0.3);
}

   .recap-card  h4{
     width: 100%;
     border-top: 1px solid #e4e2e2;
     border-bottom: 1px solid #e4e2e2;
    padding: 10px 0 12px 0;
    margin: 0;
   }
    .header-wrapper .callback-btn a{
        color: #fff !important;
    }

     @media (max-width: 1024px){
        .vet-bottom{
            max-width: 85% !important;
        }
     }

    @media (max-width: 768px) {
        .vets_form{
            padding: 0 24px;
        }
        .form_footer ul{
            flex-wrap: wrap;
            gap:10px;
        }
        .radio-option{
          max-width: 100%;
        }
       .field_spaceing{
         padding: 5px 0 5px 0;
       }
       .step-buttons{
          max-width: 100%;
          border-radius:12px 12px 0 0;
       }
       .button_sticky{
          bottom: 0;
       }
        .radio-option.radio-simple {
          flex: 1 1 100%;
          width: 100%;
        }
        .vets_img img{
            display: none;
        }
        .select-group{
            flex-direction: column;
        }
        .radio-group{
            gap:20px;
        }
        .header-wrapper{
            margin: 20px 0 0 0 !important;
        }
        .callbackform-container{
            grid-template-columns: 1fr ;
        }
         .callback-header{
            width: 100%;
            padding: 0 24px;
        }
        .callback-form{
            margin:0 24px;
        }
        .callback-btn img{
            width: 22px;
            height: 22px;
        }   
        .form-header .callback-btn.mob-btn{
            display: flex;
        }
        
        .form-header .callback-btn{
            display: none;
        }
        .vets_main_section{
            padding-bottom: 0;
        }
        .button_sticky{
            padding-bottom: 0;
        }
        .birth-place{
            flex-direction: column;
        }
        #santevet-lead-form .field_spaceing{
            padding: 20px 0;
        }
        .select2-container--open .select2-dropdown--below{
           margin-top:35px;
           border-top:1px solid #aaa;
        }
        .vetsform legend{
            font-size: 28px;
            margin-bottom: 20px;
        }
        #subscriptionCarousel .owl-stage,
        .recap-date{
            width: calc(100vw - 48px) !important;
        }
        #subscriptionCarousel .owl-stage .owl-item{
            margin: 0 !important;
        }
        #subscriptionCarousel .owl-stage .recap-card{
            padding: 0;
        }
        .recap-card .vet-infoo{
            flex-wrap: wrap;
            gap: 5px !important;
            align-items: start !important;
            justify-content: start !important;
        }
        .recap-wrapper div:first-of-type{
            gap: 5px;
        }
        #subscriptionCarousel{
            padding-bottom: 40px;
        }
        .notify_txt{
            padding: 0 10px;
        }
        #insurance-testimonials .plan-card {
            padding-bottom: 40px !important;
        }
          .recap-card{
            display: flex;
            flex-direction: column;
            align-items: start;
            gap: 10px;
            width: auto !important;
            padding: 0 10px;
        }
        #subscriptionCarousel .owl-nav{
            left: 0;
            transform: translateX(0);
        }
        .card-content ul li span{
            text-align: start;
        }
        .card-content ul li span:nth-child(2){
            text-align: end;
            font-weight: bold;
        }
        .card-content ul li{
            gap: 5px;
        }
        .owl-item.active.center .shadow-effect{
            padding: 16px !important;
        }
        #customers-testimonials .owl-nav,
        #insurance-testimonials .owl-nav,
         .vet-bottom div:first-of-type,
        .vet-bottom div:nth-child(2),
        .vet-bottom div:nth-child(3){
            display: none;
        }
        .vet-container,
        .insurance-heading{
            margin-bottom: 20px;
        }
        .vet-container div,
        .insurance-heading div h2,
        .insurance-heading div h5{
            text-align: center;
        }
        .vet-bottom div:nth-child(4),
        .vet-bottom div:nth-child(4) button.btn-continue{
            width: 100%;
        }
       
    }