body {
    font-family: "Mulish", sans-serif !important;
    font-optical-sizing: auto;
    
    font-style: normal;
}

/* Botón flotante */
.chatbot-button {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background-color: #ee7c00;
    color: white;
    border: none;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    z-index:5;
}

#descuento-content {
    display: none; /* Ocultar por defecto */
}
    
    .chatbot-button:hover {
        background-color: #999999;
    }

    /* Icono dentro del botón */
    .chatbot-button i {
        font-size: 24px;
    }

/* Menu */
.navbar {
    border-bottom-width: 7px;
    border-style: solid;
    border-top-width: 0px;
    border-image: linear-gradient(to right, white,#f2f2f2, #ee7c00) 6;
    border-left-width: 0px;
    border-right-width: 0px;
}

.btn:hover {
    color: #ee7c00;
    background-color: #ee7c00;
    border-color: #ee7c00;
}
.aqui:hover {
    color: white !important;
}

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {

    background-color: white !important;
    

}


.btn-primary:not(:disabled):not(.disabled):active {
    color:;
    background-color: #ee7c00 !important;
    border-color: #ee7c00;
}


.navbar-brand{
    padding-left: 18px;
    }

.navbar-brand, .nav-link {
    color: #878784 ;
}
.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link{
    color: #ee7c00 !important;
}

.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover{
    color: #ee7c00 !important;
}

.dropdown-item.active, .dropdown-item:active {
    color: var(--bs-dropdown-link-active-color);
    text-decoration: none;
    background-color: #df7400 !important;
    border-radius: 7px;
}

.dropdown-item:focus, .dropdown-item:hover {
    color: white !important;
    background-color: #df7400 !important;
}
a:hover {
    color: #e47c00 !important;
   
}

/* Header */
.custom-header {
    text-align: center;
    padding: 20px 0;
}
.custom-header img {
    max-width: 150px;
}
.custom-header h1 {
    color: #878784;
    margin-top: 20px;
}
.custom-header p {
    color: #666;
    max-width: 600px;
    margin: 0 auto;
}
.navbar-nav {
  
    padding-left: 20px !important;
}
.navbar-light .navbar-nav .nav-link {
    color: #6c6c6c !important;
}

/* Titulos y Parrafos */
.parrafo {
    font-weight: 200;
    color: #6c6c6c !important;
    font-size: 20px;
}
.h2, h2 {
    font-size: 30px !important;
}

.info-header {
    text-align: center;
   
    position: relative;
    display: inline-block;
   
}
.info-header h2 {
    color: #878784;
    font-size: 2rem;
    position: relative;
    display: inline-block;
    padding-bottom: 10px;
}

.info-header h2::after {
    content: '';
    position: absolute;
    width: 50%;
    height: 3px;
    background-color: #ccc;
    bottom: 0;
    left: 0;
}
.info-header h2::before {
    content: '';
    position: absolute;
    width: 50%;
    height: 3px;
    background-color: #ee7c00;
    
    bottom: 0;
    right: 0;
}


/* slider */
.h2slider{
    margin-bottom: 0rem ;
}

.custom-section {
    padding: 16px 0% 31px 0px;
}
.carousel-item img {

    object-fit: cover;
}
.consultenos-section {
    background-color: #ee7c00;
    padding: 20px;
    border-top-left-radius: 0px;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 0px;
    color: white;
    width: 129%;
    height: 110px;
    font-weight: 100;
    margin-left: -12px;
}

.consultenos-section1 {
    background-color: #ee7c00;
    padding: 20px;
    padding-bottom: 20px;
    border-top-left-radius: 0px;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 0px;
    color: white;
    width: 117%;
    height: 110px;
    font-weight: 100;
    margin-left: -12px;
}

.consultenos-section h2, .consultenos-section p, .consultenos-section a {
    color: white;
    
}
.consultenos-section a {
  
    color: #ee7c00;
    
}
.consultenos-section a:hover {
    background-color: #ee7c00;
    color: white;
}

.cards-slider{
    padding-left: 10% !important;
    padding-right: 7% !important;
}
    
.slider-content{
max-width: 140% !important;
width:100% !important ;
}

/* Cards */

.info-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(/Content/img/Mujer-libre1.png);
    background-size: auto;
    background-position: top;
    filter: opacity(8%);
    filter:contrast(-50%);
    z-index: -1;
}

.form-check-inline .form-check-input {
  
    height: 22px !important;
    width: 26px !important;
}

.info-section {
    
    position: relative;
    padding: 60px 0;
    color: #333;
    text-align: center;
    
    }

.info-header {
    text-align: center;
    
    }
.card {
    color: #6c6c6c !important;
    border: var(--bs-card-border-width) var(--bs-card-border-color) !important;
} 
.card {
   
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);
    margin-bottom: 30px;
    position: relative;
    padding-top: 60px;
    height: 280px !important;
     }

.card-header {
    border-radius: 15px 15px 0 0;
    padding: 0;
    overflow: visible;
    position: absolute;
    top: -100px; 
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    background-color: rgb(0 0 0 / 0%) !important;
    border-bottom: 1px solid rgb(0 0 0 / 0%) !important;
    }

.card-header img {
    width: 225px; 
    height: 200px;       
        }

.card-body {
     text-align: center;
     padding-top: 80px; 
    }

        .card-body h3 {
            color: #878784;
            margin: 20px 0;
        }
    .card-body p {
        color: #6c6c6c;
        margin-bottom: 20px;
    }
        .card-body a {
            color: #ff6600;
            font-weight: bold;
            text-decoration: none;
        }
        .card-body a:hover {
            text-decoration: underline;
        }

        .bigcard {
            --bs-card-spacer-y: 1rem;
            --bs-card-spacer-x: 1rem;
            --bs-card-title-spacer-y: 0.5rem;
            --bs-card-title-color: ;
            --bs-card-subtitle-color: ;
            --bs-card-border-width: var(--bs-border-width);
            --bs-card-border-color: var(--bs-border-color-translucent);
            --bs-card-border-radius: 13px;
            --bs-card-box-shadow: ;
            --bs-card-inner-border-radius: calc(var(--bs-border-radius) -(var(--bs-border-width)));
            --bs-card-cap-padding-y: 0.5rem;
            --bs-card-cap-padding-x: 1rem;
            --bs-card-cap-bg: rgba(var(--bs-body-color-rgb), 0.03);
            --bs-card-cap-color: ;
            --bs-card-height: ;
            --bs-card-color: ;
            --bs-card-bg: var(--bs-body-bg);
            --bs-card-img-overlay-padding: 1rem;
            --bs-card-group-margin: 0.75rem;
            position: relative;
            display: flex;
            flex-direction: column;
            min-width: 0;
            height: var(--bs-card-height);
            color: var(--bs-body-color);
            word-wrap: break-word;
            background-color: var(--bs-card-bg);
            background-clip: border-box;
           
            border-radius: var(--bs-card-border-radius);
        }
        .bigcard {
            box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
            margin-bottom: 30px;
            position: relative;
            padding-top: 20px;
   
        }


        .circle {
            background-color: #ee7c00;
            border-radius: 50% 50% 48% 51% / 52% 52% 48% 48%;
            width: 33px;
            height: 30px;
            display:inline-block;
            color: white;
            padding-left: 11px;
            margin-right: 10px;
        }
.card {
    box-sizing: border-box;
    
    background: rgba(217, 217, 217, 0.58);
    border: 1px solid white;
    box-shadow: 12px 17px 51px rgba(0, 0, 0, 0.22);
    backdrop-filter: blur(6px);
    border-radius: 17px;
    text-align: center;
    cursor: pointer;
    transition: all 0.5s;
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    font-weight: bolder;
    color: black;
}

    .card:hover {
        border: 1px solid black;
        transform: scale(1.05);
    }

    .card:active {
        transform: scale(0.95) rotateZ(1.7deg);
    }

        /*buttons*/
        .btn-primary {
            --bs-btn-hover-bg: #d07511!important;
            --bs-btn-bg: #ee7c00!important;
            --bs-btn-border-color: #ee7c00!important;
            border-radius: 13px !important;
            --bs-btn-hover-border-color: #ee7c00 !important;
            --bs-btn-disabled-bg: #ee7c00 !important;
    --bs-btn-disabled-border-color: #ee7c00 !important;

        }

        .orange-box {
            background-color: #ee7c00;
            color: white;
            padding: 20px;
          border-radius:10px 0px 0px 10px; */
    height: 170px;
    width: 100%;
        }


.step-number {
    background-color: #ee7c00;
    color: white;
    border-radius: 50%;
    padding: 8px 17px;
    font-weight: bold;
    margin-right: 10px;
    width: 47px;
}

        .step-list {
            list-style: none;
            padding-left: 0;
        }

        .step-list li {
            display: flex;
            align-items: center;
            margin-bottom: 15px;
        }

        .form-check-input:checked {
            background-color: #ee7c00 !important;
            border-color: #e0e0dd !important;
        }

       

          /* Container for Table */



tbody, td, tfoot, th, thead, tr {
    border-color: inherit;
    border-style: solid;
    border-width: 0;
   
}

          .container1 {
          
            border-radius: 8px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
        }

        /* Custom Table Styling */
        tbody, td, tfoot, th, thead, tr {
            
            padding-bottom: 15px;
            padding-top: 15px;
        }

        .custom-table1 {
            width: 100%;
            border-collapse: separate;
            border-spacing: 0;
           
            border-radius: 7px;
            overflow: hidden;
        }

        .custom-table th,
        .custom-table td {
            padding: 15px;
            text-align: left;
        }

        thead {
            background: #ee7c00;
            width: 37px;
            height: 42px;
        }

        th {
            text-align: center !important;
            color: white;
        }

        /* Custom Button */
        .btn-create-discount {
            background-color: #ee7c00;
            color: white;
            border: none;
            border-radius: 13px;
            padding: 10px 20px;
            cursor: pointer;
            transition: background-color 0.3s ease;
            text-align: center;
            width:195px;

        }

        .btn-create-discount:hover {
            background-color: #e65c00;
        }


        .circle1{
            margin-bottom: 0;
}
        

      

/* footer */

         .footer-section {
            background-color: #333;
            color: white;
            padding: 30px 0 0 0;
            position: relative;
        }
        

        .col-md-6.footer-content {
            padding-right: 3rem;
        }

        .footer-menu {
            margin-bottom: 15px;
            text-align: center;
            z-index: 2;
            position: relative;
        }
        .footer-menu a {
            color: white;
            text-decoration: none;
            margin: 0 15px;
            font-size: 1rem;
        }
        .footer-menu a:hover {
            text-decoration: underline;
        }
        .footer-submenu {
            text-align: center;
            margin-bottom: 15px;
            z-index: 2;
            position: relative;
        }
        .footer-submenu a {
            color: white;
            text-decoration: none;
            margin: 0 10px;
            font-size: 0.875rem;
            display: inline-block;
            border: 1px solid white;
            padding: 5px 20px;
            border-radius: 12px;
        }
        .footer-submenu a:hover {
            background-color: white;
            color: #ff6600;
        }
        .footer-content {
            text-align: center;
            z-index: 2;
            position: relative;
        }
        .footer-content p {
            margin: 0;
        }
        .footer-content .approval-code {
            float: right;
            text-align: right;
            margin-top: -30px;
        }
        .footer-bottom{
            background-color: #e47c00;
           
            width: 100%;
        }
        .codigo{
            margin-left:110px;

        }
        .img-footer{
            margin-top:-5%;
        }
        .subfooter{
            margin-left:54px !important;
        }


         

/* Search Filters */
.filters {
    display: flex;
    gap: 15px;
   
}

.filters input,
.filters select,
.filters button {
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #ddd;
    font-size: 16px;
}

.filters button {
    background-color: #ee7c00;
    color: white;
    border: none;
    cursor: pointer;
}

.filters button:hover {
    background-color: #e65c00;
}
/* formualario inscripcion pacientes */

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

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

.form-footer input[type="checkbox"] {
    margin-right: 10px;
}

.btn-orange {
    background-color: #ee7c00;
    color: white;
}

.btn-orange:hover {
    background-color: #ee7c00;
}


  .linea {
    border: 0;
    width: 100%;
    height: .1rem;
    background-image: linear-gradient(to right,transparent,#ee7c00,transparent);
    opacity: .9;
  
  }

/*Beneficios*/

#extra-content {
    display: none; /* Inicialmente oculto */
}


  /*contacto formulario*/
  .contact-section {
    display: flex;
    align-items: center;
    padding: 20px;
    background-color: #fff;
}
.contact-info {
    flex: 1;
   
}
.contact-info img {
   
    height: 85px;
    margin-bottom: 10px;
}
.contact-info p {
    margin-bottom: 20px;
    font-size: 14px;
}
.contact-info .info-item {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}
.contact-info .info-item img {
    margin-right: 10px;
}
.contact-form {
    flex: 1;
}
.contact-form textarea {
    resize: none;
}
.btn-orange {
    background-color: #ff6f00;
    color: white;
}
.btn-orange:hover {
    background-color: #e65c00;
}

.table-responsive {
    display: inline-table;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.ceroenrojo{
    padding-right:33%;
}
/*terminos*/
.containerterms {
    max-width: 1000px;
  
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}


/*Modal*/


.modal-content {
    font-weight: 200;
    color: #6c6c6c !important;
    font-size: 20px;
    text-align: justify !important;
}

.modal-body {
 
    padding-left: 40px !important;
    padding-right: 40px !important;
}


.modal {
   
    --bs-modal-width: 1200px !important;
  
}
/* Transiciones */
    .shimmer {
    display: inline-block;
    color:white;
    
    background: #acacac -webkit-gradient(linear, 100% 0, 0 0, from(#acacac), color-stop(0.5, #ffffff), to(#acacac));
    
    background-position: -4rem top; /*50px*/
    background-repeat: no-repeat;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-animation-name: shimmer;
    -webkit-animation-duration: 2.2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-background-size: 4rem 100%; /*50px*/
    
  }
  
  @-webkit-keyframes shimmer {
      0% {
          background-position: -4rem top; /*50px*/
      }
  
      70% {
          background-position: 12.5rem top; /*200px*/
      }
  
      100% {
          background-position: 12.5rem top; /*200px*/
      }
  }

 /* Responsive adjustments */
 @media (max-width: 768px) {
    .custom-table th,
    .custom-table td {
        padding: 10px;
        font-size: 14px;
    }

    .btn-create-discount {
        padding: 8px 15px;
        font-size: 14px;
    }
}
@media only screen and (max-width: 576px) {






    .ceroenrojo {
        padding-right: 0% !important;
    }

    .login-container button {
       
        padding: 10px 27px !important;
       
    }

    .login-container form {
      
        padding: 0 21px !important;
       
    }

    .img-footer {
        margin-top: 0px!important;
    }

    .footer-submenu a {
        margin-bottom: 15px;
        margin-left: 32px;
    }

    .login-container {
      
        min-height: 900px!important;
    }
    .consultenos-section1 {
        height: 170px !important;
        width: 100%;
        padding-bottom: 20px;
    }
      .consultenos-section {
        height: 130px;
        width: 100%;
      
      }

      .card{
        margin-bottom: 100px;
      }

      .codigo{
       width: 100% !important;
       font-size: 13px;
       text-align: center;
       margin-left:4%;
      }
      .footer-menu{
      
      }
      .col-md-6.footer-content {
        padding-right: 0rem !important;
    }
    .footer-menu a {
       
        font-size: 13px;
    }

    .container1 {
      
        margin-left: 0px;
        

    }

    .table-responsive {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .card-paso{

    padding-bottom: 53px;
    }

    .email{
        margin-left: 50px;
    }
    .subfooter {
        margin-left: 12px !important;
        text-align:center !important;
    }

   

     }

.login-container {
    background-color: #fff;
    border-radius: 30px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.35);
    position: relative;
    overflow: hidden;
    width: 925px;
    max-width: 100%;
    min-height: 714px;
}

   
    .login-container span {
        font-size: 12px;
    }

    .login-container a {
      
        text-decoration: none;
     
    }


    .login-container button {
        background-color: #ee7c00;
        color: #fff;
        font-size: 12px;
        padding: 10px 45px;
        border: 1px solid transparent;
        border-radius: 8px;
        font-weight: 600;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        margin-top: 10px;
        cursor: pointer;
    }

        .login-container button.hidden {
            background-color: transparent;
            border-color: #fff;
        }

    .login-container form {
        background-color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        padding: 0 40px;
        height: 100%;
    }

    .login-container input {
        background-color: #eee;
        border: none;
        margin: 8px 0;
        padding: 10px 15px;
        font-size: 13px;
        border-radius: 8px;
        width: 100%;
        outline: none;
    }

.form-container {
    position: absolute;
    top: 0;
    height: 100%;
    transition: all 0.6s ease-in-out;
}

.sign-in {
    left: 0;
    width: 50%;
    z-index: 2;
}

.login-container.active .sign-in {
    transform: translateX(100%);
}

.sign-up {
    left: 0;
    width: 50%;
    opacity: 0;
    z-index: 1;
}

.login-container.active .sign-up {
    transform: translateX(100%);
    opacity: 1;
    z-index: 5;
    animation: move 0.6s;
}

@keyframes move {
    0%, 49.99% {
        opacity: 0;
        z-index: 1;
    }

    50%, 100% {
        opacity: 1;
        z-index: 5;
    }
}

.social-icons {
    margin: 20px 0;
}

    .social-icons a {
        border: 1px solid #ccc;
        border-radius: 20%;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        margin: 0 3px;
        width: 40px;
        height: 40px;
    }

.toggle-container {
    position: absolute;
    top: 0;
    left: 50%;
    width: 50%;
    height: 100%;
    overflow: hidden;
    transition: all 0.6s ease-in-out;
    border-radius: 150px 0 0 100px;
    z-index: 1000;
}

.login-container.active .toggle-container {
    transform: translateX(-100%);
    border-radius: 0 150px 100px 0;
}

.toggle {
    background-color: #010d48;
    height: 100%;
    background: #ee7c00;
    color: #fff;
    position: relative;
    left: -100%;
    height: 100%;
    width: 200%;
    transform: translateX(0);
    transition: all 0.6s ease-in-out;
}

.login-container.active .toggle {
    transform: translateX(50%);
}

.toggle-panel {
    position: absolute;
    width: 50%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 0 30px;
    text-align: center;
    top: 0;
    transform: translateX(0);
    transition: all 0.6s ease-in-out;
}

.toggle-left {
    transform: translateX(-200%);
}

.login-container.active .toggle-left {
    transform: translateX(0);
}

.toggle-right {
    right: 0;
    transform: translateX(0);
}

.login-container.active .toggle-right {
    transform: translateX(200%);
}