/* ==============================================================
   Custom Theme Overrides
   Loaded last (after main.css and all vendor CSS) so it can win
   the cascade without editing any vendor/template files.
   Safe to delete this file + its <link> in header.view.php to
   fully revert to the original look.
   ============================================================== */

/* ---------- 1. Color palette ----------
   main.css defines its palette as CSS custom properties scoped to
   `body`, so redeclaring them here (loaded after main.css) retints
   every component that already reads var(--primary-color) etc. —
   buttons, badges, sidebar, links — with no per-page changes needed. */
body {
  --primary-color: #5b4bda;
  --primary-alpha-Dot75: rgba(91, 75, 218, 0.75);
  --primary-alpha-Dot5: rgba(91, 75, 218, 0.5);
  --primary-alpha-Dot25: rgba(91, 75, 218, 0.25);
  --primary-alpha-Dot15: rgba(91, 75, 218, 0.15);
  --primary-alpha-Dot1: rgba(91, 75, 218, 0.1);
  --primary-alpha-Dot05: rgba(91, 75, 218, 0.05);
  --primary-dark: #4638b0;

  --secondary-color: #8b96a5;
  --light-color: #f4f5fa;

  --dark-color: #23283b;
  --dark-alpha-Dot5: rgba(35, 40, 59, 0.5);
  --dark-alpha-Dot95: rgba(35, 40, 59, 0.95);

  --success-color: #2fbf71;
  --success-alpha-Dot5: rgba(47, 191, 113, 0.5);
  --danger-color: #ef4b5f;
  --danger-alpha-Dot5: rgba(239, 75, 95, 0.5);
  --warning-color: #f5a623;
  --warning-alpha-Dot5: rgba(245, 166, 35, 0.5);

  background-color: var(--light-color);
  color: #33384a;
}

/* ---------- 2. Typography ---------- */
body {
  font-family: 'Inter', 'Roboto', -apple-system, BlinkMacSystemFont, sans-serif;
}
h1, h2, h3, h4, h5, h6,
.section-title h5,
.block-heading h5 {
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #1c1f2b;
}
.section-title {
  margin-bottom: 4px;
}

/* ---------- 3. Page shell spacing ---------- */
.page-container .page-content-wrapper .content {
  padding-top: 8px;
}
.container-fluid.padding-25 {
  padding: 24px 28px;
}

/* ---------- 4. Cards (form-block / table-block) ----------
   These classes exist in the markup but had zero CSS anywhere in
   the theme, so every "card" on the site was an unstyled div. */
.form-block,
.table-block {
  background: #ffffff;
  border-radius: 14px;
  padding: 24px 26px;
  box-shadow: 0 1px 2px rgba(23, 26, 41, 0.04), 0 4px 16px rgba(23, 26, 41, 0.06);
  border: 1px solid rgba(23, 26, 41, 0.05);
}

/* ---------- 5. Forms ---------- */
.form-control {
  border-radius: 8px;
  border: 1px solid #dde1ea;
  padding: 10px 14px;
  height: auto;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.form-control:focus {
  border-color: var(--primary-color);
  box-shadow: 0 0 0 3px var(--primary-alpha-Dot15);
}
.control-label {
  font-weight: 600;
  font-size: 13px;
  color: #565c72;
  margin-top: 16px;
  margin-bottom: 6px;
  display: inline-block;
}

/* ---------- 6. Buttons ---------- */
.btn {
  border-radius: 8px;
  font-weight: 600;
  padding: 9px 18px;
  letter-spacing: 0.01em;
}
.btn-primary {
  box-shadow: 0 2px 8px var(--primary-alpha-Dot25);
}
.btn-small {
  border-radius: 6px;
  padding: 5px 12px;
  font-weight: 600;
  font-size: 12px;
}

/* ---------- 7. Tables ---------- */
.table {
  margin-bottom: 0;
}
.table thead th {
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.04em;
  color: #7b8194;
  border-bottom: 2px solid #eef0f5;
  font-weight: 700;
  background: transparent;
}
.table td {
  vertical-align: middle;
  border-color: #f0f1f6;
}
.table-striped tbody tr:nth-of-type(odd) {
  background-color: #fafbfd;
}
.table-hover tbody tr:hover,
.table tbody tr:hover {
  background-color: var(--primary-alpha-Dot05);
}

/* ---------- 8. Badges / status pills (Active/Inactive on Languages page, etc.) ---------- */
.badge {
  border-radius: 999px;
  font-weight: 600;
  padding: 5px 12px;
  font-size: 11px;
  letter-spacing: 0.02em;
}

/* ---------- 9. Sidebar ---------- */
.navigation-sidebar.bg-primary {
  background: var(--dark-color) !important;
}
.navigation-sidebar .menu-items li a.have-submenu:hover,
.navigation-sidebar .menu-items li a:hover {
  background: rgba(255, 255, 255, 0.06);
}

/* ---------- 10. Sidebar scroll fix ----------
   The menu was height:100% of the full-height fixed sidebar, so with the logo
   header + welcome line stacked above it the list overflowed past the screen
   bottom and the last items (Languages, etc.) were unreachable. Flex column
   makes the header/welcome take their natural height and the menu fill the
   rest and scroll — pixel-independent. */
.navigation-sidebar {
  display: flex;
  flex-direction: column;
}
.navigation-sidebar .navigation-header,
.navigation-sidebar .welcome {
  flex: 0 0 auto;
}
.navigation-sidebar .navigation-menu {
  flex: 1 1 auto;
  min-height: 0;      /* allow this flex child to shrink so overflow can scroll */
  height: auto;
  overflow: hidden;
}
.navigation-sidebar .navigation-menu .menu-items {
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
}