:root {
      --primary: #2568a7;
      --primary-dark: #1a4d7a;
      --secondary: #4db8ff;
      --accent: #ff7e33;
      --light: #f8f9fa;
      --light-gray: #e9ecef;
      --medium-gray: #ced4da;
      --dark: #343a40;
  }

  body {
      font-family: 'Inter', 'Segoe UI', 'Roboto', sans-serif;
      background-color: var(--light);
  }

  /* Estilos para el contenedor principal */
  .login-container {
      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
  }

  /* Estilos para el panel de branding */
  .brand-panel {
      background: linear-gradient(135deg, var(--primary), var(--primary-dark));
      /*background-image: url('https://placehold.co/1200x900/2568a7/ffffff?text=TravelVigor&font=raleway');*/
      background-size: cover;
      background-position: center;
      position: relative;
      color: white;
      display: flex;
      /* Usamos flex para alinear contenido */
      flex-direction: column;
      justify-content: space-between;
  }

  .brand-panel::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: linear-gradient(135deg, rgba(37, 104, 167, 0.85), rgba(26, 77, 122, 0.95));
      z-index: 1;
  }

  .brand-content {
      position: relative;
      z-index: 2;
  }

  /* Estilos para los inputs y botones */
  .form-control:focus {
      border-color: var(--primary);
      box-shadow: 0 0 0 0.25rem rgba(37, 104, 167, 0.25);
  }

  .btn-primary {
      background-color: var(--primary);
      border-color: var(--primary);
  }

  .btn-primary:hover {
      background-color: var(--primary-dark);
      border-color: var(--primary-dark);
  }

  .form-check-input:checked {
      background-color: var(--primary);
      border-color: var(--primary);
  }

  .link-primary {
      color: var(--primary);
  }

  .link-primary:hover {
      color: var(--primary-dark);
  }

  /* Estilos para el botón de mostrar/ocultar contraseña */
  .password-eye {
      cursor: pointer;
      color: var(--medium-gray);
      transition: color 0.3s ease;
  }

  .password-eye:hover {
      color: var(--primary);
  }

  .reset-container {
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
        }