body {
     font-family: "Inter", sans-serif;
     margin: 0;
     background: #f6f8fc;
     display: flex;
     justify-content: center;
     align-items: center;
     height: 100vh;
   }

   .login-container {
     background: #ffffff;
     padding: 40px;
     border-radius: 14px;
     max-width: 500px;
     width: 100%;
     box-shadow: 0 8px 28px rgba(0, 0, 0, 0.06);
     text-align: center;
   }


   .logo {
     width: 160px;
     margin-bottom: 24px;
   }

   h2 {
     font-size: 24px;
     margin-bottom: 16px;
     color: #111;
     font-weight: 600;
   }

   p.subtitle {
     color: #555;
     margin-bottom: 28px;
     font-size: 15px;
   }

   input {
     width: 100%;
     padding: 14px;
     border-radius: 8px;
     border: 1.5px solid #d6d9e2;
     margin-bottom: 16px;
     font-size: 15px;
   }

   button {
     width: 100%;
     border: none;
     border-radius: 8px !important;
     background: #067394;
     color: #fff;
     padding: 14px;
     border-radius: 10px;
     font-size: 16px;
     margin-top: 6px;
     cursor: pointer;
     transition: 0.25s;
     font-weight: 600;
   }

   button:hover {
     background: #FCD21C;
     color: #067394 !important;
   }

   .logos {
     display: flex;
     justify-content: center;
     gap: 24px;
     margin-top: 28px;
     align-items: center;
   }

   .logos img {
     height: 42px;
     opacity: 0.9;
   }

   a.link {
     margin-top: 20px;
     display: inline-block;
     color: #067394;
     text-decoration: none;
     font-size: 14px;
   }

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

   /******************************************
	LOADER DIV
*******************************************/
   .loader_page {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100vh;

     background-color: rgba(255, 255, 255, 0.8);
     z-index: 9999;

     display: flex;
     justify-content: center;
     align-items: center;
   }

   .container_loader {
     text-align: center;
     display: flex;
     flex-direction: column;
     /* apila verticalmente */
     align-items: center;
     /* centra horizontalmente */
     gap: 20px;
     /* espacio entre logo y spinner */
   }

   .loader_page .container_loader img {
     opacity: 0.8;
   }

   .spinner-border {
     display: inline-block;
     width: 1.5rem;
     /* 🔹 tamaño reducido */
     height: 1.5rem;
     /* 🔹 tamaño reducido */
     border: .3em solid currentColor;

     border-right-color: transparent;
     border-radius: 50%;
     animation: spinner-border .75s linear infinite;
     vertical-align: text-bottom;
   }

   @keyframes spinner-border {
     to {
       transform: rotate(360deg);
     }
   }

   .visually-hidden {
     position: absolute;
     width: 1px;
     height: 1px;
     padding: 0;
     overflow: hidden;
     clip: rect(0, 0, 0, 0);
     white-space: nowrap;
     border: 0;
   }

   .fontColor1 {
     color: #037394 !important;
   }

   .input-group .form-control {
     height: 54px !important;
     /* Ajusta si tu input tenía otro tamaño */
     padding: 8px 12px;
     border-radius: 8px;
   }

   .input-group-text {
     height: 54px !important;
     display: flex;
     align-items: center;
     padding: 6px 10px;
     border-radius: 0 8px 8px 0 !important;
   }

   .password-wrapper {
     position: relative;
   }

   .password-wrapper .field-icon {
     position: absolute;
     right: 10px;
     top: 50%;
     transform: translateY(-50%);
     cursor: pointer;
     color: #037394 !important;
     z-index: 5;
   }

   .password-wrapper input {
     padding-right: 40px;
     border-radius: 8px !important;
   }