body {
      background-color: #1d1d1f;
      color: #fff;
      font-family: "SF Pro Display", "Segoe UI", Arial, sans-serif;
    }

    /* 🔹 Logo no canto superior esquerdo (sem texto, mais próxima) */
    .brand-logo {
      position: absolute;
      top: 3px;
      left: 5px;
      opacity: 0.95;
    }

    .brand-logo img {
      height: 50px;
      width: auto;
      filter: brightness(0.98);
    }

    /* Centralização vertical */
    .login-wrapper {
      height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    /* 🔹 Card estilo iCloud */
    .card-login {
      background-color: #1d1d1f;
      border: none;
      border-radius: 22px;
      box-shadow: 0 6px 50px rgba(0, 0, 0, 0.65);
      width: 400px;
      padding: 50px 35px 40px;
      text-align: center;
    }

    /* 🔹 Logo do card (logo-O.png) */
    .card-login .inner-logo {
      width: 90px;
      height: auto;
      margin-bottom: 25px;
    }

    /* 🔹 Inputs escuros fixos */
    .form-control {
      background-color: #1d1d1f !important;
      border: 1px solid #333 !important;
      border-radius: 12px !important;
      color: #fff !important;
      padding: 12px 42px 12px 14px;
      font-size: 1rem;
    }

    .form-control::placeholder {
      color: #888;
    }

    .form-control:focus {
      background-color: #1d1d1f !important;
      border-color: #ff5a00 !important;
      box-shadow: 0 0 0 0.2rem rgba(255, 90, 0, 0.22) !important;
      color: #fff !important;
    }

    /* 🔒 Impede autofill branco no Chrome */
    input:-webkit-autofill,
    input:-webkit-autofill:hover,
    input:-webkit-autofill:focus,
    input:-webkit-autofill:active {
      -webkit-box-shadow: 0 0 0 1000px #1d1d1f inset !important;
      -webkit-text-fill-color: #fff !important;
      transition: background-color 9999s ease-in-out 0s !important;
      caret-color: #fff !important;
    }

    .input-group-text {
      background: transparent;
      border: none;
      position: absolute;
      right: 10px;
      top: 8px;
      color: #ff5a00;
      font-size: 1.3rem;
      cursor: pointer;
    }

    footer {
      font-size: 0.85rem;
      color: #999;
      margin-top: 25px;
    }

    /* 🔹 Toast moderno */
    #toast {
      position: fixed;
      top: 20px;
      left: 50%;
      transform: translateX(-50%);
      background: rgba(0, 0, 0, 0.9);
      color: #fff;
      padding: 12px 20px;
      border-radius: 10px;
      font-size: 0.95rem;
      opacity: 0;
      transition: opacity 0.3s ease, transform 0.3s ease;
      z-index: 9999;
      backdrop-filter: blur(5px);
    }

    #toast.show {
      opacity: 1;
      transform: translate(-50%, 10px);
    }

    #toast.success {
      border-left: 4px solid #28a745;
    }

    #toast.error {
      border-left: 4px solid #dc3545;
    }

    #toast.info {
      border-left: 4px solid #0dcaf0;
    }


    .input-group-text:hover,
    .input-group-text:focus,
    .input-group-text:focus-visible,
    .form-control:focus + .input-group-text {
      color: #ff5a00;
      outline: none;
      box-shadow: none;
    }
