/* Theme (Novabase-like) - loaded AFTER bootstrap.min.css */
body {
  padding: 0 3em; /* give some horizontal breathing room */
}
/* 1) Brand palette (from the provided image - approximated) */
:root {
  --nb-red: #CE101F;
  --nb-red-dark: #8A0814;

  --nb-black: #1F1F1F;
  --nb-gray-900: #1F1F1F;
  --nb-gray-700: #595A5D;
  --nb-gray-500: #939498;
  --nb-gray-200: #E6E6E7;

  --nb-white: #FFFFFF;
}

/* 2) Bootstrap 5 theme variables override */
:root {
  /* primary */
  --bs-primary: var(--nb-red);
  --bs-primary-rgb: 206, 16, 31;

  /* Complementary “primary” tokens used across BS5 (alerts, subtle backgrounds, emphasis text) */
  --bs-primary-text-emphasis: #8A0814;              /* dark red for text emphasis */
  --bs-primary-bg-subtle: #F7D6D9;                  /* very light red tint */
  --bs-primary-border-subtle: #F1B6BC;              /* subtle border tint */

  /* links */
  --bs-link-color: var(--nb-red);
  --bs-link-hover-color: var(--nb-red-dark);

  /* focus ring (forms/buttons) */
  --bs-focus-ring-color: rgba(206, 16, 31, 0.25);

  /* optional: tune grays to match the brand look a bit closer */
  --bs-body-color: var(--nb-gray-900);
  --bs-body-bg: var(--nb-white);

  --bs-secondary-color: var(--nb-gray-700);
  --bs-tertiary-color: var(--nb-gray-500);

  --bs-border-color: var(--nb-gray-200);
}

/* 3) A couple of practical component tweaks (Bootstrap 5 uses variables in many places) */
.btn-primary {
  --bs-btn-bg: var(--nb-red);
  --bs-btn-border-color: var(--nb-red);
  --bs-btn-hover-bg: var(--nb-red-dark);
  --bs-btn-hover-border-color: var(--nb-red-dark);
  --bs-btn-active-bg: var(--nb-red-dark);
  --bs-btn-active-border-color: var(--nb-red-dark);

  /* Disabled state (make it "opaque red" instead of blue/washed out) */
  --bs-btn-disabled-bg: rgba(206, 16, 31, 0.55);
  --bs-btn-disabled-border-color: rgba(206, 16, 31, 0.35);
  --bs-btn-disabled-color: rgba(255, 255, 255, 0.90);
}

/* Ensure Bootstrap's default opacity doesn't wash it out too much */
.btn-primary:disabled,
.btn-primary.disabled {
  opacity: 1;
}

.btn-outline-primary {
  --bs-btn-color: var(--nb-red);
  --bs-btn-border-color: var(--nb-red);
  --bs-btn-hover-bg: var(--nb-red);
  --bs-btn-hover-border-color: var(--nb-red);
  --bs-btn-hover-color: var(--nb-white);
  --bs-btn-active-bg: var(--nb-red-dark);
  --bs-btn-active-border-color: var(--nb-red-dark);
}

.form-control:focus,
.form-select:focus {
  border-color: rgba(206, 16, 31, 0.5);
  box-shadow: 0 0 0 .25rem rgba(206, 16, 31, 0.25);
}

/* 3.1) Fix: links inside tables staying blue (specificity win) */
.table a,
.table a:visited {
  color: var(--nb-red);
  text-decoration-color: rgba(206, 16, 31, 0.55);
}
.table a:hover,
.table a:focus {
  color: var(--nb-red-dark);
  text-decoration-color: rgba(138, 8, 20, 0.65);
}

/* 3.2) Pagination: keep brand palette + clearer active/disabled states */
.pagination .page-link {
  color: var(--nb-red);
  border-color: var(--nb-gray-200);
  background-color: var(--nb-white);
}
.pagination .page-link:hover {
  color: var(--nb-red-dark);
  background-color: var(--bs-primary-bg-subtle);
  border-color: var(--bs-primary-border-subtle);
}
.pagination .page-link:focus {
  color: var(--nb-red-dark);
  box-shadow: 0 0 0 .25rem rgba(206, 16, 31, 0.25);
}

.pagination .page-item.active .page-link {
  color: var(--nb-white);
  background-color: var(--nb-red);
  border-color: var(--nb-red);
}

.pagination .page-item.disabled .page-link {
  color: var(--nb-gray-500);
  background-color: var(--nb-white);
  border-color: var(--nb-gray-200);
  opacity: 0.85;
}

/* 4) Optional helper classes */
.nb-brand-red { color: var(--nb-red) !important; }
.nb-brand-bg-red { background-color: var(--nb-red) !important; color: var(--nb-white) !important; }

.nb-gray-900 { color: var(--nb-gray-900) !important; }
.nb-gray-700 { color: var(--nb-gray-700) !important; }
.nb-gray-500 { color: var(--nb-gray-500) !important; }
.nb-gray-200 { color: var(--nb-gray-200) !important; }

/* 5) Top title bar (navbar): dark background + gray text (brand palette) */
.navbar.bg-light.fixed-top {
  background-color: var(--nb-black) !important; /* overrides .bg-light */
  border-bottom: 1px solid rgba(230, 230, 231, 0.20); /* subtle divider using nb-gray-200 */
}

.navbar.bg-light.fixed-top .navbar-brand,
.navbar.bg-light.fixed-top .nav-link,
.navbar.bg-light.fixed-top .navbar-text,
.navbar.bg-light.fixed-top span {
  color: var(--nb-gray-200) !important; /* “letras cinzas” com bom contraste */
}

.navbar.bg-light.fixed-top .nav-link:hover,
.navbar.bg-light.fixed-top .nav-link:focus {
  color: var(--nb-red) !important; /* hover na cor da marca */
}

.navbar.bg-light.fixed-top .nav-link.active {
  color: var(--nb-white) !important;
}

/* Optional: remover “background” no hover/focus que alguns temas aplicam */
.navbar.bg-light.fixed-top .nav-link {
  background: transparent;
}

.navbar.bg-light.fixed-top {
  border-radius: 0; /* remove any default rounding */
  overflow: hidden; /* important to clip inner backgrounds to the radius */
}

/* ... existing code ... */

/* 6) Login page layout */
body.login-page {
  padding: 0;              /* override global body padding */
  min-height: 100vh;
  position: relative;
  background: #fff;
}

/* Background image + light overlay */
body.login-page .login-bg {
  position: fixed;
  inset: 0;
  background-image: url("/img/People_02.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 0;
}

body.login-page .login-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.78); /* “bem clarinha” */
}

/* Centered card */
body.login-page .login-wrap {
  position: relative;
  z-index: 1;
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 2rem 1rem;
}

body.login-page .login-card {
  width: min(420px, 92vw);
  background: var(--nb-white);
  border-radius: 1rem;
  box-shadow: 0 16px 50px rgba(31, 31, 31, 0.18);
  border: 1px solid rgba(230, 230, 231, 0.7); /* nb-gray-200 */
  padding: 2rem 2rem 1.5rem;
}

body.login-page .login-logo {
  display: flex;
  justify-content: center;
  margin-bottom: 1.25rem;
}

body.login-page .login-logo img {
  max-width: 220px;
  width: 70%;
  height: auto;
}

body.login-page .login-actions {
  margin-top: 0.25rem;
}

body.login-page .login-title {
  margin: 0 0 1.25rem;
  text-align: center;
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--nb-gray-900);
}

body.login-page .login-title .login-title-acronym {
  color: var(--nb-gray-700);
  font-weight: 600;
}

body.login-page .login-actions a {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25rem;
  padding: 0.75rem 1.5rem;
  border-radius: 0.375rem;
}