/* Resetzinhos leves */
body {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background: #f5f6f8;
  color: #1f2933;
}

/* Navbar / topo (para header genérico e admin) */
.navbar {
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}

.navbar-brand {
  font-weight: 600;
  letter-spacing: 0.01em;
}

/* Cartões principais */
.card {
  border: none;
  border-radius: 16px;
}

.card.shadow-sm {
  box-shadow: 0 20px 25px -20px rgba(15, 23, 42, 0.25);
}

/* Botões */
.btn {
  border-radius: 999px;
  font-weight: 500;
  cursor: pointer;
}

.btn-primary {
  background: linear-gradient(135deg, #2563eb, #7c3aed);
  border: none;
  color: #ffffff;
}

.btn-primary:hover {
  background: linear-gradient(135deg, #1d4ed8, #6d28d9);
}

.btn-outline-secondary {
  border-color: #cbd2e1;
  color: #4b5563;
  background: #ffffff;
}

.btn-outline-secondary:hover {
  background-color: #f3f4f6;
  border-color: #9ca3af;
}

/* Formulários genéricos */
.form-control {
  border-radius: 999px;
  padding: 0.65rem 0.9rem;
  border: 1px solid #d0d7e2;
  font-size: 0.95rem;
}

.form-control:focus {
  border-color: #6366f1;
  outline: none;
  box-shadow: 0 0 0 0.15rem rgba(99, 102, 241, 0.25);
}

.form-label {
  font-size: 0.9rem;
  font-weight: 500;
  color: #4b5563;
}

/* Tabelas admin */
.table {
  background-color: #ffffff;
  border-radius: 12px;
  overflow: hidden;
}

.table thead {
  background-color: #f3f4f6;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.table > :not(caption) > * > * {
  padding: 0.6rem 0.75rem;
  vertical-align: middle;
}

/* Badges de estado */
.badge {
  border-radius: 999px;
  padding: 0.35rem 0.75rem;
  font-weight: 500;
}

/* Layout container */
.container {
  max-width: 1040px;
}

/* Títulos */
h1.h4,
h2.h5 {
  font-weight: 600;
  color: #111827;
}

/* Dashboard de vídeos */
.card .ratio {
  border-radius: 12px;
  overflow: hidden;
  background-color: #020617;
}

.card video {
  display: block;
}

/* Alertas genéricos */
.alert {
  border-radius: 12px;
  border: none;
  box-shadow: 0 10px 20px -15px rgba(15, 23, 42, 0.35);
}

/* Pequenas melhorias responsivas */
@media (max-width: 576px) {
  .navbar {
    padding-inline: 1rem;
  }

  .card-body {
    padding: 1.25rem;
  }
}

/* Programas no dashboard */
.program-body.collapsed {
  display: none;
}

.show-more-videos {
  cursor: pointer;
}

/* ===========================
   LOGIN / AUTH PAGES
   =========================== */

.auth-body {
  background: #f5f6f8;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* Topo com o nome da PT / Nutri */
.auth-header {
  padding: 16px 24px;
  background: #ffffff;
  border-bottom: 1px solid #e5e7eb;
  display: flex;
  align-items: center;
}

/* Reaproveita o estilo da navbar-brand */
.auth-header .navbar-brand {
  margin: 0;
}

/* Centro da página de auth */
.auth-main {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

/* Cartão de login / registo */
.auth-card {
  width: 100%;
  max-width: 420px;
  background: #ffffff;
  padding: 28px 24px;
  border-radius: 16px;
  box-shadow: 0 22px 45px rgba(15, 23, 42, 0.12);
}

/* Título principal */
.auth-card h1 {
  font-size: 26px;
  margin-bottom: 8px;
}

/* Subtexto (descrição do tenant) */
.auth-card > p {
  color: #6b7280;
  margin-bottom: 20px;
}

/* Campos */
.auth-field {
  margin-bottom: 16px;
}

.auth-field label {
  display: block;
  font-size: 14px;
  margin-bottom: 6px;
  color: #374151;
}

.auth-field input {
  width: 95%;
}

/* Botão de submit dentro do cartão de auth */
.auth-card .btn-primary {
  width: 100%;
  margin-top: 4px;
  padding: 10px 0;
}

/* Alertas de erro de auth */
.auth-alert {
  background: #fee2e2;
  color: #991b1b;
  padding: 10px 12px;
  border-radius: 10px;
  margin-bottom: 16px;
  font-size: 14px;
}

/* Footer "Ainda não tens conta" */
.auth-footer {
  margin-top: 18px;
  font-size: 14px;
  text-align: center;
}

.auth-footer a {
  color: #2563eb;
  font-weight: 500;
  text-decoration: none;
}

.auth-footer a:hover {
  text-decoration: underline;
}

/* Mobile tweaks específicos de auth */
@media (max-width: 480px) {
  .auth-card {
    padding: 22px 18px;
  }

  .auth-card h1 {
    font-size: 22px;
  }
}