/*
* TPIMS overrides (loaded after the Vuexy theme CSS)
******************************************************************************/

/* Sidebar: filled with the theme primary gradient
******************************************************************************/

:root {
  --tp-menu-bg: linear-gradient(180deg, #d24a4a 0%, #b83c3c 100%);
  --tp-menu-bg-solid: #d24a4a;
  --tp-menu-color: rgba(255, 255, 255, 0.95);
  --tp-menu-color-hover: #fff;
  --tp-menu-muted: rgba(255, 255, 255, 0.75);
  --tp-menu-hover-bg: rgba(255, 255, 255, 0.12);
  --tp-menu-open-bg: rgba(255, 255, 255, 0.16);
  --tp-menu-active-bg: #fff;
  --tp-menu-active-color: #c24242;
}

.dark-style {
  --tp-menu-bg: linear-gradient(180deg, #a83f3f 0%, #7a2c2c 100%);
  --tp-menu-bg-solid: #a83f3f;
  --tp-menu-active-color: #a83f3f;
}

.layout-menu.menu-vertical.bg-menu-theme {
  background: var(--tp-menu-bg) !important;
  color: var(--tp-menu-color);
}

.layout-menu.menu-vertical.bg-menu-theme .menu-inner-shadow {
  background: linear-gradient(var(--tp-menu-bg-solid) 41%, transparent 95%);
}

/* Brand */
.layout-menu.menu-vertical.bg-menu-theme .app-brand-text,
.layout-menu.menu-vertical.bg-menu-theme .layout-menu-toggle {
  color: #fff !important;
}
.layout-menu.menu-vertical.bg-menu-theme .app-brand-logo svg g {
  fill: #fff;
}

/* Links, icons, headers */
.layout-menu.menu-vertical.bg-menu-theme .menu-link,
.layout-menu.menu-vertical.bg-menu-theme .menu-text,
.layout-menu.menu-vertical.bg-menu-theme .menu-item.open:not(.menu-item-closing) > .menu-toggle,
.layout-menu.menu-vertical.bg-menu-theme .menu-item.active > .menu-link {
  color: var(--tp-menu-color);
}
.layout-menu.menu-vertical.bg-menu-theme .menu-link:hover,
.layout-menu.menu-vertical.bg-menu-theme .menu-link:focus {
  color: var(--tp-menu-color-hover);
}
.layout-menu.menu-vertical.bg-menu-theme .menu-header,
.layout-menu.menu-vertical.bg-menu-theme .menu-inner .menu-sub .menu-item:not(.active) > .menu-link::before {
  color: var(--tp-menu-muted) !important;
}
.layout-menu.menu-vertical.bg-menu-theme .menu-block::before {
  background-color: var(--tp-menu-muted);
}

/* Hover / open parent */
html:not(.layout-menu-collapsed) .layout-menu.menu-vertical.bg-menu-theme .menu-inner .menu-item:not(.active) > .menu-link:hover,
.layout-menu-hover.layout-menu-collapsed .layout-menu.menu-vertical.bg-menu-theme .menu-inner .menu-item:not(.active) > .menu-link:hover {
  background: var(--tp-menu-hover-bg);
}
.layout-menu.menu-vertical.bg-menu-theme .menu-inner .menu-item.open > .menu-link.menu-toggle,
.layout-menu.menu-vertical.bg-menu-theme .menu-inner .menu-item.active > .menu-link.menu-toggle,
.layout-menu-hover.layout-menu-collapsed .layout-menu.menu-vertical.bg-menu-theme .menu-inner .menu-item.open > .menu-link.menu-toggle {
  background: var(--tp-menu-open-bg) !important;
  color: #fff;
}

/* Active page: white pill with primary text */
.layout-menu.menu-vertical.bg-menu-theme .menu-item.active > .menu-link:not(.menu-toggle) {
  background: var(--tp-menu-active-bg);
  color: var(--tp-menu-active-color) !important;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.15);
}
.layout-wrapper:not(.layout-horizontal) .layout-menu.menu-vertical.bg-menu-theme .menu-inner > .menu-item.active:before {
  background: #fff;
}

/* Open submenus: darker inset panel so child items don't blend with the main menu
******************************************************************************/

:root {
  --tp-menu-sub-bg: rgba(0, 0, 0, 0.16);
  --tp-menu-sub2-bg: rgba(0, 0, 0, 0.14);
  --tp-menu-sub-line: rgba(255, 255, 255, 0.55);
  --tp-menu-sub-color: rgba(255, 255, 255, 0.86);
}

/* open top-level parent: bold label */
.layout-menu.menu-vertical.bg-menu-theme .menu-inner > .menu-item.open > .menu-link {
  font-weight: 600;
}

/* level 1 panel */
.layout-menu.menu-vertical.bg-menu-theme .menu-inner > .menu-item > .menu-sub {
  background: var(--tp-menu-sub-bg);
  border-left: 3px solid var(--tp-menu-sub-line);
  border-radius: 0 0.5rem 0.5rem 0;
  margin: 0.25rem 0.875rem 0.375rem;
  padding: 0.375rem 0;
}
.layout-menu.menu-vertical.bg-menu-theme .menu-inner > .menu-item > .menu-sub .menu-link {
  margin: 0 0.375rem;
  padding-left: 1.75rem;
  font-size: 0.8125rem;
  color: var(--tp-menu-sub-color);
}
/* bullet dot: moved in with the smaller indent so it doesn't sit on the text */
.layout-menu.menu-vertical.bg-menu-theme .menu-inner > .menu-item > .menu-sub .menu-link::before {
  inset-inline-start: 0.75rem !important;
}
.layout-menu.menu-vertical.bg-menu-theme .menu-inner > .menu-item > .menu-sub .menu-link:hover {
  color: #fff;
}
/* sub-parent that opens another level (e.g. Candidates, Mobilizer Profile) */
.layout-menu.menu-vertical.bg-menu-theme .menu-sub .menu-item > .menu-link.menu-toggle {
  font-weight: 600;
  color: #fff;
}

/* level 2 panel (one step darker, further in) */
.layout-menu.menu-vertical.bg-menu-theme .menu-sub .menu-sub {
  background: var(--tp-menu-sub2-bg);
  border-left: 2px solid rgba(255, 255, 255, 0.35);
  border-radius: 0 0.375rem 0.375rem 0;
  margin: 0.125rem 0.375rem 0.25rem 1.25rem;
  padding: 0.25rem 0;
}
.layout-menu.menu-vertical.bg-menu-theme .menu-inner > .menu-item > .menu-sub .menu-sub .menu-link {
  padding-left: 1.75rem;
  font-size: 0.78rem;
}

/* keep the white "active page" pill readable inside panels */
.layout-menu.menu-vertical.bg-menu-theme .menu-sub .menu-item.active > .menu-link:not(.menu-toggle) {
  color: var(--tp-menu-active-color) !important;
  font-weight: 600;
}

/* collapsed sidebar (icons only): no panel until it expands on hover */
.layout-menu-collapsed:not(.layout-menu-hover) .layout-menu.menu-vertical.bg-menu-theme .menu-inner > .menu-item > .menu-sub {
  background: none;
  border-left: 0;
  margin: 0;
}

/* Scrollbar */
.layout-menu.menu-vertical.bg-menu-theme .ps__thumb-y,
.layout-menu.menu-vertical.bg-menu-theme .ps__rail-y.ps--clicking > .ps__thumb-y {
  background: rgba(255, 255, 255, 0.4) !important;
}

/* Font sizes: 1px smaller across the panels
******************************************************************************/

:root {
  --bs-body-font-size: 0.875rem; /* 15px -> 14px */
}
body {
  font-size: 0.875rem;
}

/* body prefix: the template customizer re-adds core.css after this file, equal specificity would lose */
body .form-control,
body .form-select,
body .btn,
body .dropdown-menu,
body .input-group-text,
body .menu-vertical .menu-item .menu-link {
  font-size: 0.875rem; /* 15px -> 14px */
}
body .form-control-sm,
body .form-select-sm,
body .btn-sm,
body .btn-group-sm > .btn,
body .input-group-sm > .form-control,
body .input-group-sm > .form-select,
body .input-group-sm > .input-group-text,
body .input-group-sm > .btn {
  font-size: 0.75rem; /* 13px -> 12px */
}

/* Tables — compact everywhere. Selectors start with body: the template customizer re-adds core.css after
   this file, so equal-specificity rules would lose. (template default is 20px side padding, tall headers, 1px letter-spacing) */
body .table {
  font-size: 0.8125rem; /* 15px -> 13px */
  line-height: 1.35;
}
body .table:not(.table-sm) > :not(caption) > * > * {
  padding: 0.4rem 0.625rem; /* was 0.55rem 1.25rem */
}
body .table-sm > :not(caption) > * > * {
  padding: 0.25rem 0.5rem;
}
body .table th {
  font-size: 0.6875rem; /* 13px -> 11px */
  letter-spacing: 0.3px; /* was 1px */
  padding-top: 0.55rem;
  padding-bottom: 0.55rem;
  vertical-align: middle;
}
/* keep room for the DataTables sort arrows */
body table.dataTable thead > tr > th.sorting,
body table.dataTable thead > tr > th.sorting_asc,
body table.dataTable thead > tr > th.sorting_desc {
  padding-right: 1.375rem;
}
/* nested name / sub-line blocks used in most list columns */
body .table td h6,
body .table td .h6 {
  font-size: 0.8125rem;
  line-height: 1.3;
}
body .table td small,
body .table td .small {
  font-size: 0.7rem;
}
body .table td .badge {
  font-size: 0.7rem;
}
body .table td .btn-sm,
body .table td .btn-group-sm > .btn {
  padding: 0.2rem 0.5rem;
}
body .table td .btn-icon.btn-sm {
  width: 1.75rem;
  height: 1.75rem;
}
body .table td .avatar {
  width: 2rem;
  height: 2rem;
}
/* DataTables toolbar (length / search / buttons) and footer */
body div.dataTables_wrapper div.dataTables_length select,
body div.dataTables_wrapper div.dataTables_filter input {
  font-size: 0.8125rem;
  padding-top: 0.3rem;
  padding-bottom: 0.3rem;
}
body div.dataTables_wrapper div.dataTables_info {
  font-size: 0.75rem; /* 13px -> 12px */
}
body div.dataTables_wrapper div.dataTables_paginate ul.pagination .page-link {
  font-size: 0.6875rem; /* 12px -> 11px */
}
body div.dataTables_wrapper .dt-buttons .btn {
  padding: 0.3rem 0.75rem;
  font-size: 0.8125rem;
}

/* Navbar search (global-search.js): results scroll inside the dropdown instead of spilling over the page */
.navbar-search-suggestion {
  max-height: min(32rem, calc(100vh - 6rem));
  overflow-y: auto;
  overscroll-behavior: contain;
}
.navbar-search-suggestion .suggestion small {
  font-size: 0.75rem;
}

/* Footer: light brand tint + top border so it stands apart from the page (body prefix — see table block) */
body .content-footer.bg-footer-theme {
  background-color: #fdf1f1 !important;
  border-top: 1px solid #f3d3d3;
  color: #6f5f5f;
}
body .content-footer.bg-footer-theme .footer-container {
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important;
}
body.dark-style .content-footer.bg-footer-theme,
.dark-style body .content-footer.bg-footer-theme {
  background-color: #3a2f38 !important;
  border-top-color: #4d3f4a;
  color: #cfc4cc;
}