body {
      min-height: 100vh;
      margin: 0;
      background: linear-gradient(to right, #a3d9fd, #f0f9ff);
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: 'Poppins', sans-serif;
      padding: 20px;
    }

    .login-form {
      width: 100%;
      max-width: 420px;
      padding: 30px 25px;
      background: #ffffff;
      border-radius: 10px;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
    }

    .form-control:focus {
      border-color: #337ab7;
      box-shadow: none;
    }

    .form-group {
      position: relative;
    }

    .form-group .glyphicon {
      position: absolute;
      top: 50%;
      left: 12px;
      transform: translateY(-50%);
      color: #6c757d;
    }

    .form-control {
      padding-left: 35px;
    }

    .toggle-password {
      position: absolute;
      right: 12px;
      top: 50%;
      transform: translateY(-50%);
      cursor: pointer;
      color: #6c757d;
      font-size: 16px;
    }

    .login-title {
      color: #1e3a8a;
      font-weight: 600;
    }

    .info-apotek {
      color: #64748b;
    }

    @media (max-width: 576px) {
      .login-form {
        padding: 20px 15px;
      }

      .login-title {
        font-size: 1.3rem;
      }
    }