/* Asegurar que el body y html ocupen toda la pantalla */
     html,#ms-error-body {
                height: 100%;
                margin: 0;
                display: flex;
                flex-direction: column;
                min-height: 100vh;
        }
     #ms-error-body {
         background: url("../img/bk_login.jpg") no-repeat center center;
         background-size: cover;
         width:100%;
     }
     .bk-color-green {
         background-color: #299191;
     }
     .bk-color-green:hover {
         background-color: #1f6f6f !important;
         color: white !important;
     }
     .bk-footer-color-green {
         background-color: #eaf6f2;
     }
     .password-wrapper {
         position: relative;
     }
     .toggle-password {
         position: absolute;
         right: 10px;
         top: 50%;
         transform: translateY(-50%);
         background: none;
         border: none;
         cursor: pointer;
         padding: 5px;
     }
     .toggle-password i {
         font-size: 1.2rem;
         color: #6c757d;
     }
     .toggle-password.active i {
         color: #299191;
     }
     .custom-link {
         color: #299191;
         text-decoration: none;
         font-weight: 500;
     }
     .custom-link:hover {
         color: #2c5252;
         text-decoration: underline;
     }
     .flip-box {
         perspective: 1000px;
     }
     .flip-box-inner {
         position: relative;
         transition: transform 0.8s;
         transform-style: preserve-3d;
     }
     .flip-box-front {
         backface-visibility: hidden;
     }
     .flip-box-back {
         backface-visibility: hidden;
         position: absolute;
         height: 100%;
         width: 100%;
         top: 0;
         left: 0;
         transform: rotateY(180deg);
         display: flex;
         justify-content: center;
         /*flex-direction: column;*/
     }
     .flip-box-inner.flip {
         transform: rotateY(180deg);
     }
     /* Aumenta el espacio a la derecha del input */
     .form-control {
         padding-right: 2.5rem !important;
     }
     /* Ajusta la posición del ícono de “toggle password” */
     .toggle-password {
         right: 2.2rem; /* Ajusta según necesites */
     }
     /* Opcional: Si deseas asegurar que el ícono de error de Bootstrap
se posicione correctamente cuando .is-invalid está presente */
     .form-control.is-invalid {
         background-position: right 0.75rem center !important;
         background-repeat: no-repeat;
         background-size: 1.25rem 1.25rem;
     }