/* ==========================================================
   HRMS Theme Overrides: Large Typography, Yellowgreen Highlights,
   Monochrome Black & White Base & Generous Margins
   ========================================================== */

:root {
  --color-yellowgreen: #9acd32;
  --color-yellowgreen-hover: #88b928;
  --color-yellowgreen-active: #78a620;
  
  --bs-primary: #9acd32 !important;
  --bs-primary-rgb: 154, 205, 50 !important;
}

/* ---- Primary Buttons: Yellowgreen with High-Contrast Dark Text ---- */
.btn-primary {
  background-color: var(--color-yellowgreen) !important;
  border-color: var(--color-yellowgreen) !important;
  color: #09090b !important;
  font-weight: 750 !important;
  letter-spacing: -0.01em;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08) !important;
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--color-yellowgreen-hover) !important;
  border-color: var(--color-yellowgreen-hover) !important;
  color: #000000 !important;
  box-shadow: 0 4px 12px rgba(154, 205, 50, 0.3) !important;
}
.btn-primary:active,
.btn-primary.active {
  background-color: var(--color-yellowgreen-active) !important;
  border-color: var(--color-yellowgreen-active) !important;
  color: #000000 !important;
}

.btn-outline-primary {
  color: #486809 !important;
  border-color: var(--color-yellowgreen) !important;
  border-width: 2px !important;
  background-color: transparent !important;
  font-weight: 700 !important;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus {
  background-color: var(--color-yellowgreen) !important;
  color: #09090b !important;
}

/* ---- Links ---- */
a {
  color: #09090b;
  text-decoration: none;
  font-weight: 600;
}
a:hover {
  color: #3b5507;
}

/* ---- Highlights & Text Utilities ---- */
.text-primary {
  color: #486809 !important;
}
.bg-primary {
  background-color: var(--color-yellowgreen) !important;
  color: #09090b !important;
}

/* ---- Sidebar Monochrome with Yellowgreen Accents ---- */
.sidebar {
  background-color: #09090b !important;
  color: #ffffff !important;
}
.sidebar .sidebar-brand {
  background-color: #09090b !important;
  color: #ffffff !important;
  border-bottom: 1px solid #27272a;
}
.sidebar .sidebar-nav .sidebar-item.active .sidebar-link,
.sidebar .sidebar-nav .sidebar-item .sidebar-link.active {
  color: #ffffff !important;
  background-color: #27272a !important;
  border-left: 3px solid var(--color-yellowgreen) !important;
}
.sidebar .sidebar-nav .sidebar-item.active .sidebar-link i {
  color: var(--color-yellowgreen) !important;
}

/* ---- Spacious Cards & Layout Margins ---- */
.card {
  border: 1px solid #e4e4e7 !important;
  border-radius: 14px !important;
  margin-bottom: 2rem !important;
  background-color: #ffffff;
}
.card-header {
  padding: 1.25rem 1.6rem !important;
}
.card-body {
  padding: 1.6rem 1.8rem !important;
}

/* ---- Form Controls ---- */
.form-control:focus,
.form-control-lg:focus {
  border-color: var(--color-yellowgreen) !important;
  box-shadow: 0 0 0 3px rgba(154, 205, 50, 0.25) !important;
}
.form-check-input:checked {
  background-color: var(--color-yellowgreen) !important;
  border-color: var(--color-yellowgreen) !important;
}

/* ---- Dropdown & Navigation ---- */
.dropdown-menu {
  border: 1px solid #e4e4e7;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}
.dropdown-item:hover {
  background-color: #f4fbe6;
  color: #3b5507;
}

/* ---- Tables ---- */
.table thead th {
  background-color: #f4f4f5;
  color: #52525b;
  font-weight: 750;
  border-bottom: 1px solid #e4e4e7;
}

/* ---- Pagination ---- */
.page-link {
  color: #09090b;
  border-color: #e4e4e7;
  font-weight: 650;
}
.page-item.active .page-link {
  background-color: var(--color-yellowgreen) !important;
  border-color: var(--color-yellowgreen) !important;
  color: #09090b !important;
  font-weight: 800;
}

/* ---- Auth Login Page ---- */
.auth-brand {
  background: #09090b;
  border-right: 1px solid #27272a;
}
.login-brand-logo {
  width: 72px;
  height: 72px;
  background: var(--color-yellowgreen);
  color: #09090b;
  border-radius: 16px;
}