@charset "UTF-8";
/* Variables */
/* Colors */
/* Color palette */
/* Mixins */
/* Display-flex mixins */
/* Font mixins */
/* Media query mixins */
/* Functions */
/* Global */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  height: 100%;
  overflow: hidden;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 140%;
  font-style: normal;
  /* Base text color lives on body, not #page: dialogs printed via wp_footer
     land outside #page and must still inherit it */
  color: rgb(240, 246, 252);
  background: rgb(13, 15, 20);
}

body.admin-bar {
  padding: 0 !important;
  margin: 0 !important;
}

#page {
  display: flex;
  flex-direction: column;
  /* 100vw includes the scrollbar gutter on desktop; 100% never does */
  width: 100%;
  /* Mobile browsers measure 100vh against the *large* viewport — the one with
     the URL bar scrolled away. With body{overflow:hidden} that surplus height
     has nowhere to go, so the bottom of every page sits under the URL bar and
     cannot be reached. dvh tracks the visible viewport as the bar shows/hides;
     vh stays as the fallback for browsers without dvh. */
  height: 100vh;
  height: 100dvh;
  background: transparent;
}

a {
  color: inherit;
  text-decoration: none;
  transition: all 0.3s ease-in-out;
}
a:hover {
  cursor: pointer;
}

.db-link {
  padding: 0;
  color: rgb(94, 116, 255);
  cursor: pointer;
  background: none;
  border: none;
}
.db-link:hover {
  color: rgb(126, 144, 255);
}
.db-link:active {
  color: rgb(85, 104, 230);
}

/* Global styles */
h1,
h2,
h3,
h4,
h5,
h6,
p {
  padding: 0;
  margin: 0;
  font-family: "Inter";
}

:where(input[type=text],
input[type=password],
input[type=email],
input[type=url],
input[type=tel],
input[type=number],
input[type=date],
select,
textarea) {
  padding: 0;
  margin: 0;
  resize: none;
  font-family: "Inter", sans-serif;
  color: rgb(240, 246, 252);
  font-size: 14px;
  line-height: 140%;
  font-style: normal;
}

button,
input[type=button],
input[type=submit] {
  all: unset;
  /* all: unset resets box-sizing to content-box — restore it, otherwise
     width: 100% + padding on buttons overflows the parent */
  box-sizing: border-box;
  display: inline;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  text-align: inherit;
  cursor: pointer;
  background: none;
  border: none;
}

/* Images */
img {
  display: block;
  transition: 0.2s;
}

/* Author styles always beat the browser's [hidden] { display: none } —
   the img reset above was un-hiding empty <img hidden> previews. Restore
   the attribute's meaning theme-wide. */
[hidden] {
  display: none !important;
}

/* Page container — 1440px content centered; side padding 40px,
   80px on very wide screens, 16px on mobile */
.db-container {
  width: 100%;
  max-width: 1520px;
  padding: 0 40px;
  margin: 0 auto;
}
@media (width >= 1921px) {
  .db-container {
    max-width: 1600px;
    padding: 0 80px;
  }
}
@media (width <= 767px) {
  .db-container {
    padding: 0 16px;
  }
}

/* Map */
#app {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  flex: 1;
  height: 100%;
}

#map-container {
  position: relative;
  flex: 1;
  overflow: hidden;
}

#world {
  display: block;
  width: 100%;
  height: 100%;
}
#world .country {
  cursor: pointer;
}

.leaflet-container {
  font-family: inherit;
  cursor: default;
}

.leaflet-grab,
.leaflet-crosshair {
  cursor: default;
}

.map-pin-marker {
  overflow: visible;
  background: none;
  border: none;
}
.map-pin-marker svg {
  overflow: visible;
}

.leaflet-interactive.unlisted {
  cursor: default;
}

.map-cluster-marker {
  cursor: pointer;
  background: none;
  border: none;
}
.map-cluster-marker .map-cluster {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 24px;
  height: 24px;
  color: rgb(13, 15, 20);
  border-radius: 50%;
  transition: transform 0.15s;
}
.map-cluster-marker:hover .map-cluster {
  transform: scale(1.12);
}

.map-zoom-controls {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex-wrap: wrap;
  position: absolute;
  right: 20px;
  bottom: 20px;
  z-index: 499;
  overflow: hidden;
}
.map-zoom-controls .ctrl-btn {
  width: 33px;
  height: 33px;
  font-size: 16px;
  line-height: 30px;
  color: rgb(240, 246, 252);
  text-align: center;
  cursor: pointer;
  background: rgb(19, 21, 25);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 8px;
  transition: background 0.15s;
}
.map-zoom-controls .ctrl-btn:hover {
  background: rgb(33, 38, 48);
}

#map-tooltip {
  position: absolute;
  z-index: 600;
  display: none;
  min-width: 120px;
  padding: 8px 12px;
  pointer-events: none;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 6px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6);
}
#map-tooltip .db-map-tooltip-name {
  margin: 0 0 3px;
  font-weight: 600;
  color: rgb(240, 246, 252);
}
#map-tooltip .db-map-tooltip-meta {
  color: rgb(137, 137, 137);
}
#map-tooltip .db-map-tooltip-stats {
  margin: 5px 0 0;
  color: rgb(137, 137, 137);
}
#map-tooltip .db-map-tooltip-stats b {
  color: rgb(240, 246, 252);
}
#map-tooltip .db-map-tooltip-type-badge {
  display: inline-block;
  padding: 1px 6px;
  margin: 0 0 0 4px;
  font-weight: 500;
  border-radius: 3px;
}
#map-tooltip .db-map-tooltip-count-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  font-weight: 700;
  color: rgb(240, 246, 252);
  vertical-align: middle;
  background: rgb(19, 21, 25);
  border: 1.5px solid;
  border-radius: 50%;
}

#country-popup {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 700;
  display: none;
  transform: translate(-50%, -50%);
}
#country-popup.visible {
  display: block;
}
#country-popup.anchored {
  transform: none;
}
#country-popup .db-country-popup {
  min-width: 340px;
  padding: 24px;
  overflow: hidden;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 12px;
  box-shadow: 0 12px 32px 0 rgba(0, 0, 0, 0.5);
}
#country-popup .db-country-popup .db-country-popup-header {
  display: flex;
  flex-direction: column;
  gap: 8px;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 0 0 16px;
  border-bottom: 1px solid rgb(44, 49, 54);
}
#country-popup .db-country-popup .db-country-popup-header .db-country-popup-title-wrap {
  display: flex;
  flex-direction: row;
  gap: 14px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
#country-popup .db-country-popup .db-country-popup-header .db-country-popup-title-wrap .db-country-popup-title {
  display: flex;
  flex-direction: row;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}
#country-popup .db-country-popup .db-country-popup-header .db-country-popup-title-wrap button {
  width: 32px;
  height: 32px;
}
#country-popup .db-country-popup .db-country-popup-header .db-country-popup-title-wrap button:hover {
  color: rgb(164, 177, 216);
}
#country-popup .db-country-popup .db-country-popup-header .db-country-popup-subtitle {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: center;
  flex-wrap: wrap;
  color: rgb(240, 246, 252);
}
#country-popup .db-country-popup .db-country-popup-header .db-country-popup-subtitle .db-country-popup-avatar {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  object-fit: cover;
  border-radius: 50%;
}
#country-popup .db-country-popup .db-country-popup-header .db-country-popup-subtitle .db-country-popup-avatar.fallback {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  font-weight: 700;
  color: rgb(240, 246, 252);
  background: rgb(33, 38, 48);
}
#country-popup .db-country-popup .db-country-popup-header .db-country-popup-subtitle .db-country-popup-recruiter {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#country-popup .db-country-popup .db-country-popup-header .db-country-popup-subtitle .db-country-popup-recruiter:hover {
  color: rgb(29, 184, 154);
}
#country-popup .db-country-popup .db-country-popup-header .db-country-popup-subtitle .db-country-popup-reports-count {
  flex-shrink: 0;
  color: rgb(137, 137, 137);
}
#country-popup .db-country-popup .db-country-popup-rows {
  display: flex;
  flex-direction: column;
  gap: 12px;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 16px 0;
}
#country-popup .db-country-popup .db-country-popup-rows .db-country-popup-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
#country-popup .db-country-popup .db-country-popup-rows .db-country-popup-row .db-country-popup-label {
  flex-shrink: 0;
  color: rgb(137, 137, 137);
}
#country-popup .db-country-popup .db-country-popup-rows .db-country-popup-row .db-country-popup-value {
  color: rgb(240, 246, 252);
}
#country-popup .db-country-popup .db-country-popup-rows .db-country-popup-row .db-country-popup-value.agency {
  font-weight: 600;
}
#country-popup .db-country-popup .db-country-popup-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
#country-popup .db-country-popup .db-country-popup-stats .db-country-popup-stat {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  flex-wrap: wrap;
  padding: 12px;
  background: rgb(13, 15, 20);
  border-radius: 8px;
}
#country-popup .db-country-popup .db-country-popup-stats .db-country-popup-stat .db-country-popup-stat-label {
  color: rgb(137, 137, 137);
}
#country-popup .db-country-popup .db-country-popup-stats .db-country-popup-stat .db-country-popup-stat-value {
  margin: 0 0 6px;
  color: rgb(137, 137, 137);
}
#country-popup .db-country-popup .db-country-popup-stats .db-country-popup-stat .db-country-popup-stat-value.interested {
  color: rgb(164, 177, 216);
}
#country-popup .db-country-popup .db-country-popup-stats .db-country-popup-stat .db-country-popup-stat-value.signed {
  color: rgb(94, 116, 255);
}
#country-popup .db-country-popup .db-country-popup-stats .db-country-popup-stat .db-country-popup-stat-cost {
  display: flex;
  flex-direction: column;
  gap: 2px;
  align-items: flex-start;
  flex-wrap: wrap;
  color: rgb(240, 246, 252);
}
#country-popup .db-country-popup .db-country-popup-stats .db-country-popup-stat .db-country-popup-stat-cost span {
  color: rgb(137, 137, 137);
}
#country-popup .db-country-popup .db-country-popup-button-wrap {
  padding: 16px 0 0;
}
#country-popup .db-country-popup .db-country-popup-button-wrap .db-country-popup-button {
  width: 100%;
  height: 36px;
}

#stats-bar {
  display: flex;
  flex-direction: row;
  gap: 8px 20px;
  align-items: center;
  flex-wrap: wrap;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 400;
  padding: 10px 20px;
}
@media (width <= 992px) {
  #stats-bar {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: flex-start;
    flex-wrap: wrap;
  }
}
#stats-bar #stats-agencies {
  display: contents;
}
#stats-bar .db-stats-bar-item {
  display: flex;
  flex-shrink: 0;
  gap: 6px;
  align-items: center;
  font-size: 12px;
  color: rgb(137, 137, 137);
  white-space: nowrap;
}
#stats-bar .db-stats-bar-dot,
#stats-bar .db-stats-bar-dot-alt {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  background: rgb(137, 137, 137);
  border-radius: 50%;
}
#stats-bar .db-stats-bar-dot-alt {
  display: none;
}
@media (width <= 992px) {
  #stats-bar .db-stats-bar-dot-alt {
    display: block;
  }
}
#stats-bar .db-stats-bar-value {
  font-weight: 600;
  color: rgb(240, 246, 252);
}

/* Components */
.db-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  flex-shrink: 0;
  height: 72px;
  padding: 0 40px;
  border-bottom: 1px solid rgb(44, 49, 54);
}
@media (width <= 767px) {
  .db-header {
    height: 64px;
    padding: 0 16px;
  }
}
.db-header .db-navbar {
  display: flex;
  flex-direction: row;
  gap: 64px;
  align-items: center;
  flex-wrap: wrap;
}
.db-header .db-navbar .db-logo {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  flex-shrink: 0;
  text-decoration: none;
}
@media (width <= 767px) {
  .db-header .db-navbar .db-logo {
    display: none;
  }
}
.db-header .db-navbar .db-logo img {
  display: block;
  width: auto;
  height: 50px;
}
.db-header .db-navbar .db-main-menu {
  display: flex;
  flex-direction: row;
  gap: 32px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.db-header .db-navbar .db-main-menu .db-nav-item {
  font-size: 14px;
  font-weight: 400;
  color: rgb(137, 137, 137);
  text-decoration: none;
  transition: color 0.15s, background 0.15s;
}
.db-header .db-navbar .db-main-menu .db-nav-item:hover {
  color: rgb(164, 177, 216);
}
.db-header .db-navbar .db-main-menu .db-nav-item.active {
  color: rgb(29, 184, 154);
}
.db-header .db-navbar .db-main-menu .db-nav-item.active:hover {
  color: rgb(164, 177, 216);
}
.db-header .db-actions {
  display: flex;
  flex-direction: row;
  gap: 20px;
  align-items: center;
  flex-wrap: wrap;
}
@media (width <= 767px) {
  .db-header .db-actions {
    gap: 16px;
  }
}
.db-header .db-actions .db-notifications {
  display: flex;
  flex-direction: row;
  gap: 64px;
  align-items: center;
  flex-wrap: wrap;
  color: rgb(137, 137, 137);
  cursor: pointer;
  background: none;
  border: none;
  transition: color 0.15s;
}
.db-header .db-actions .db-notifications:hover {
  color: rgb(240, 246, 252);
}
.db-header .db-actions .db-notifications[aria-expanded=true] svg {
  color: rgb(29, 184, 154);
}
.db-header .db-actions a {
  height: 36px;
  padding: 8px 16px;
}
@media (width <= 767px) {
  .db-header .db-actions a {
    display: none;
  }
}
.db-header .db-actions .db-avatar-menu {
  position: relative;
}
.db-header .db-actions .db-avatar-menu:hover .db-avatar-dropdown {
  display: block;
}
.db-header .db-actions .db-avatar-menu .db-avatar {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  overflow: hidden;
  cursor: pointer;
  border-radius: 50%;
}
@media (width <= 767px) {
  .db-header .db-actions .db-avatar-menu .db-avatar {
    width: 32px;
    height: 32px;
  }
}
.db-header .db-actions .db-avatar-menu .db-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.db-header .db-actions .db-avatar-menu .db-avatar-dropdown {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  z-index: 900;
  display: none;
  min-width: 87px;
  padding: 0;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 8px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5);
}
.db-header .db-actions .db-avatar-menu .db-avatar-dropdown::before {
  position: absolute;
  top: -14px;
  right: 0;
  left: 0;
  height: 14px;
  content: "";
}
.db-header .db-actions .db-avatar-menu .db-avatar-dropdown .db-avatar-dropdown-item {
  display: block;
  height: auto;
  padding: 10px 16px;
  font-size: 14px;
  color: rgb(137, 137, 137);
  text-decoration: none;
  white-space: nowrap;
  border-radius: 0;
  transition: color 0.12s, background 0.12s;
}
.db-header .db-actions .db-avatar-menu .db-avatar-dropdown .db-avatar-dropdown-item:hover {
  color: rgb(240, 246, 252);
  background: rgb(33, 38, 48);
}

/* Header notifications — bell badge, dropdown feed, bottom toast.
   Markup in template-parts/header/navbar.php, logic in assets/js/notifications.js */
.db-notif {
  position: relative;
}
.db-notif .db-notifications {
  position: relative;
}
.db-notif .db-notif-badge {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  position: absolute;
  top: -8px;
  right: -8px;
  width: 18px;
  height: 18px;
  line-height: 100%;
  color: rgb(19, 21, 25);
  background: rgb(29, 184, 154);
  border-radius: 50%;
}
.db-notif .db-notif-panel {
  position: absolute;
  top: 30px;
  right: -10px;
  z-index: 600;
  width: 400px;
  overflow: hidden;
  background: rgb(19, 21, 25);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 12px;
  box-shadow: 0 12px 32px 0 rgba(0, 0, 0, 0.502);
}
@media (width <= 560px) {
  .db-notif .db-notif-panel {
    width: 320px;
  }
}
.db-notif .db-notif-panel .db-notif-head {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 20px;
  border-bottom: 1px solid rgb(44, 49, 54);
}
.db-notif .db-notif-panel .db-notif-mark-read {
  color: rgb(29, 184, 154);
  cursor: pointer;
  background: none;
  border: none;
}
.db-notif .db-notif-panel .db-notif-mark-read:hover {
  color: rgb(74, 198, 174);
}
.db-notif .db-notif-panel .db-notif-list {
  max-height: 380px;
  overflow-y: auto;
  scrollbar-color: rgb(44, 49, 54) transparent;
  scrollbar-width: thin;
}
.db-notif .db-notif-panel .db-notif-list .db-notif-item {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: flex-start;
  flex-wrap: nowrap;
  padding: 16px 20px 16px 6px;
  cursor: pointer;
  border-bottom: 1px solid rgb(44, 49, 54);
}
.db-notif .db-notif-panel .db-notif-list .db-notif-item:last-child {
  border-bottom: none;
}
.db-notif .db-notif-panel .db-notif-list .db-notif-item:hover {
  background: rgb(22, 27, 34);
}
.db-notif .db-notif-panel .db-notif-list .db-notif-item.is-unread {
  background: rgba(255, 255, 255, 0.05);
}
.db-notif .db-notif-panel .db-notif-list .db-notif-item.is-unread .db-notif-dot {
  opacity: 1;
}
.db-notif .db-notif-panel .db-notif-list .db-notif-item .db-notif-dot {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  margin: 14px 0 0;
  background: rgb(29, 184, 154);
  border-radius: 50%;
  opacity: 0;
}
.db-notif .db-notif-panel .db-notif-list .db-notif-item .db-notif-avatar {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  object-fit: cover;
  border-radius: 50%;
}
.db-notif .db-notif-panel .db-notif-list .db-notif-item .db-notif-avatar--initial {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  font-size: 14px;
  font-weight: 600;
  color: rgb(240, 246, 252);
  background: rgb(33, 38, 48);
}
.db-notif .db-notif-panel .db-notif-list .db-notif-item .db-notif-body {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex-wrap: nowrap;
  min-width: 0;
}
.db-notif .db-notif-panel .db-notif-list .db-notif-item .db-notif-body .db-notif-text {
  font-size: 14px;
  color: rgb(137, 137, 137);
}
.db-notif .db-notif-panel .db-notif-list .db-notif-item .db-notif-body .db-notif-text b {
  font-weight: 600;
  color: rgb(240, 246, 252);
}
.db-notif .db-notif-panel .db-notif-list .db-notif-item .db-notif-body .db-notif-meta {
  color: rgb(29, 184, 154);
}
.db-notif .db-notif-panel .db-notif-list .db-notif-item .db-notif-body .db-notif-time {
  margin: 4px 0 0;
  color: rgb(137, 137, 137);
}
.db-notif .db-notif-panel .db-notif-list .db-notif-empty {
  padding: 24px 16px;
  color: rgb(137, 137, 137);
  text-align: center;
}

/* Bottom toast — one fresh report, appears while polling detects news.
   Lives outside .db-notif (fixed at the page root, see navbar.php), so its
   avatar/body sub-styles are repeated here rather than shared with .db-notif-item. */
.db-notif-toast {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  flex-wrap: nowrap;
  position: fixed;
  bottom: 28px;
  left: 50%;
  z-index: 900;
  min-width: 378px;
  padding: 18px 16px;
  cursor: pointer;
  background: rgb(33, 38, 48);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 8px;
  box-shadow: 0 8px 24px 0 rgba(0, 0, 0, 0.4);
  opacity: 0;
  transition: opacity 0.25s, transform 0.25s;
  transform: translate(-50%, 10px);
}
.db-notif-toast.is-visible {
  opacity: 1;
  transform: translate(-50%, 0);
}
.db-notif-toast .db-notif-avatar {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  object-fit: cover;
  border-radius: 50%;
}
.db-notif-toast .db-notif-avatar.initial {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  font-size: 14px;
  font-weight: 600;
  color: rgb(240, 246, 252);
  background: rgb(33, 38, 48);
}
.db-notif-toast .db-notif-body {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex-wrap: nowrap;
  min-width: 0;
}
.db-notif-toast .db-notif-body .db-notif-text {
  color: rgb(137, 137, 137);
}
.db-notif-toast .db-notif-body .db-notif-text span {
  font-weight: 600;
  color: rgb(240, 246, 252);
}
.db-notif-toast .db-notif-body .db-notif-meta {
  font-weight: 600;
  color: rgb(29, 184, 154);
}

.db-heading-h1 {
  font-family: "Inter", sans-serif;
  font-size: 26px;
  font-weight: 600;
  line-height: 100%;
  font-style: normal;
}

.db-heading-h2 {
  font-family: "Inter", sans-serif;
  font-size: 22px;
  font-weight: 600;
  line-height: 100%;
  font-style: normal;
  letter-spacing: -0.3px;
}

.db-heading-h3 {
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 100%;
  font-style: normal;
  letter-spacing: -0.3px;
}

.db-heading-h4 {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 100%;
  font-style: normal;
}

/* Button */
.db-button-tertiary, .db-button-secondary, .db-button-primary {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 140%;
  font-style: normal;
  width: auto;
  height: 44px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border-radius: 8px;
  transition: 0.2s;
}
.db-button-tertiary:disabled, .db-button-secondary:disabled, .db-button-primary:disabled, [disabled].db-button-tertiary, [disabled].db-button-secondary, [disabled].db-button-primary {
  pointer-events: none;
  cursor: default;
  opacity: 0.35;
}

.db-button-primary {
  color: rgb(19, 21, 25);
  background: rgb(29, 184, 154);
}
.db-button-primary:hover {
  background: rgb(74, 198, 174);
}
.db-button-primary:active {
  background: rgb(26, 166, 139);
}

.db-button-secondary {
  color: rgb(164, 177, 216);
  background: transparent;
  border: 1px solid rgb(44, 49, 54);
}
.db-button-secondary:hover {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgb(164, 177, 216);
}
.db-button-secondary:active {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgb(164, 177, 216);
}

.db-button-tertiary {
  color: rgb(22, 27, 34);
  background: rgb(164, 177, 216);
}
.db-button-tertiary:hover {
  background: rgb(182, 193, 224);
}
.db-button-tertiary:active {
  background: rgb(148, 159, 194);
}

/* Filter pill — rounded dropdown filter shared by the Reports and Statistics
   pages. Markup:
   .db-filters > .db-filter-pill > .db-filter-button (.db-filter-label +
   .db-filter-chevron) + .db-filter-dropdown > .db-filter-option
   JS toggles .is-open on the pill; page-level margins stay on page classes. */
.db-filters {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.db-filter-pill {
  position: relative;
}
.db-filter-pill.is-open .db-filter-dropdown {
  display: block;
}
@media (width <= 767px) {
  .db-filter-pill.is-open .db-filter-dropdown {
    position: fixed;
    inset: auto 12px;
    min-width: 0;
    max-height: 58vh;
    transform: none;
  }
}
.db-filter-pill.is-open .db-filter-chevron {
  transform: rotate(180deg);
}
.db-filter-pill.is-open .db-filter-button {
  background: rgb(33, 38, 48);
  border-color: rgb(29, 184, 154);
}
.db-filter-pill.has-value .db-filter-button {
  background: rgb(164, 177, 216);
  border-color: transparent;
}
.db-filter-pill.has-value .db-filter-button .db-filter-label,
.db-filter-pill.has-value .db-filter-button .db-filter-chevron {
  color: rgb(22, 27, 34);
}
.db-filter-pill[data-align=end] .db-filter-dropdown {
  right: 0;
  left: auto;
}
.db-filter-pill[data-align=center] .db-filter-dropdown {
  left: 50%;
  transform: translateX(-50%);
}

.db-filter-button {
  display: flex;
  flex-direction: row;
  gap: 6px;
  align-items: center;
  flex-wrap: nowrap;
  height: 38px;
  padding: 0 16px;
  white-space: nowrap;
  cursor: pointer;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 30px;
  transition: border-color 0.15s;
}
.db-filter-button:hover {
  background: rgb(33, 38, 48);
  border-color: rgb(29, 184, 154);
}

.db-filter-chevron {
  flex-shrink: 0;
  color: rgb(137, 137, 137);
  transition: transform 0.2s;
}

.db-filter-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 300;
  display: none;
  min-width: 180px;
  max-height: 320px;
  overflow-y: auto;
  scrollbar-width: thin;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  scrollbar-color: rgb(33, 38, 48) rgba(0, 0, 0, 0);
  border-radius: 8px;
  box-shadow: 0 8px 20px -6px rgba(0, 0, 0, 0.4);
}

/* Hover highlight runs edge-to-edge with square corners (design: dropdown
   menu states) — side inset lives on the option, not the box */
.db-filter-option {
  display: block;
  width: 100%;
  padding: 10px 16px;
  color: rgb(137, 137, 137);
  text-align: left;
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 0;
  transition: background 0.12s, color 0.12s;
}
.db-filter-option:hover {
  color: rgb(240, 246, 252);
  background: rgb(33, 38, 48);
}
.db-filter-option.is-active {
  color: rgb(29, 184, 154);
}

.db-pagination {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.db-pagination .db-page-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 32px;
  height: 32px;
  color: rgb(137, 137, 137);
  cursor: pointer;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  transition: background 0.12s, border-color 0.12s;
}
.db-pagination .db-page-button:hover:not(.is-active) {
  background: rgb(19, 21, 25);
}
.db-pagination .db-page-button.is-active {
  color: rgb(29, 184, 154);
  background: rgb(33, 38, 48);
  border-color: rgb(29, 184, 154);
}
.db-pagination .db-page-nav {
  padding: 0 8px;
  color: rgb(240, 246, 252);
  cursor: pointer;
  background: none;
  border: none;
  transition: color 0.12s;
}
.db-pagination .db-page-nav:hover:not(.is-disabled) {
  color: rgb(164, 177, 216);
}
.db-pagination .db-page-nav.is-disabled {
  color: rgb(137, 137, 137);
  cursor: default;
  opacity: 0.4;
}
.db-pagination .db-page-ellipsis {
  padding: 0 4px;
  color: rgb(137, 137, 137);
}

/* Input */
.db-input-secondary, .db-input-primary, .db-input {
  box-sizing: border-box;
  width: 100%;
  height: 40px;
  padding: 11px 14px;
  appearance: none;
  background: rgb(33, 38, 48);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 8px;
  outline: none;
  transition: border-color 0.2s, background-color 0.2s;
  font-family: "Inter", sans-serif;
  color: rgb(137, 137, 137);
  font-size: 14px;
  font-weight: 400;
  line-height: 140%;
  font-style: normal;
}
.db-input-secondary:not(:placeholder-shown), .db-input-primary:not(:placeholder-shown), .db-input:not(:placeholder-shown) {
  color: rgb(240, 246, 252);
}
.db-input-secondary::placeholder, .db-input-primary::placeholder, .db-input::placeholder {
  color: rgb(137, 137, 137);
}
.db-input-secondary:hover:not(:disabled), .db-input-primary:hover:not(:disabled), .db-input:hover:not(:disabled) {
  border-color: rgb(29, 184, 154);
}
.db-input-secondary:focus, .db-input-primary:focus, .db-input:focus, .db-input-secondary:active, .db-input-primary:active, .db-input:active {
  color: rgb(240, 246, 252);
  border-color: rgb(29, 184, 154);
}
.db-input-secondary:disabled, .db-input-primary:disabled, .db-input:disabled, [disabled].db-input-secondary, [disabled].db-input-primary, [disabled].db-input {
  color: rgb(137, 137, 137);
  cursor: default;
  background: rgb(22, 27, 34);
  border-color: rgb(44, 49, 54);
}
.db-invalid.db-input-secondary, .db-invalid.db-input-primary, .db-invalid.db-input {
  border-color: rgb(224, 84, 105);
}
.db-input-secondary:-webkit-autofill, .db-input-primary:-webkit-autofill, .db-input:-webkit-autofill {
  caret-color: rgb(240, 246, 252);
  box-shadow: 0 0 0 1000px rgb(33, 38, 48) inset;
  transition: background-color 5000s ease-in-out 0s;
  -webkit-text-fill-color: rgb(240, 246, 252);
}

.db-input-primary {
  color: rgba(240, 246, 252, 0.6);
}

.db-input-secondary {
  color: rgb(137, 137, 137);
  background: rgb(13, 15, 20);
}

.db-input-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
  flex-wrap: wrap;
}
.db-input-field label {
  color: rgb(137, 137, 137);
}

.db-input-error {
  font-family: "Inter", sans-serif;
  color: rgb(224, 84, 105);
  font-size: 12px;
  font-weight: 700;
  line-height: 140%;
  font-style: normal;
  margin: 8px 0 0;
}

/* Select2 — dark theme matching %input-base (.db-input).
   Vendor select2.min.css is a dependency of disobey.css, so these load after it. */
.select2-container--default {
  /* Closed field */
  /* Dropdown */
  /* Search */
  /* Options list */
  /* Options */
}
.select2-container--default .select2-selection--single {
  box-sizing: border-box;
  height: 40px;
  background: rgb(19, 21, 25);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 8px;
  outline: none;
  transition: border-color 0.2s, background-color 0.2s;
}
.select2-container--default .select2-selection--single:hover {
  border-color: rgb(29, 184, 154);
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  font-family: "Inter", sans-serif;
  color: rgb(137, 137, 137);
  font-size: 14px;
  font-weight: 400;
  line-height: 140%;
  font-style: normal;
  padding: 10px 32px 10px 12px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered .select2-selection__empty {
  color: rgb(137, 137, 137);
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  top: 0;
  right: 14px;
  bottom: 0;
  width: 14px;
  height: 100%;
  background-color: rgb(137, 137, 137);
  mask-image: url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3.5 5.25L7 8.75L10.5 5.25" stroke="black" stroke-linecap="round"/></svg>');
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: 14px;
  transition: transform 0.2s;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
  display: none;
}
.select2-container--default.select2-container--focus .select2-selection--single, .select2-container--default.select2-container--open .select2-selection--single {
  border-color: rgb(29, 184, 154);
}
.select2-container--default.select2-container--focus .select2-selection--single .select2-selection__rendered, .select2-container--default.select2-container--open .select2-selection--single .select2-selection__rendered {
  color: rgb(240, 246, 252);
}
.select2-container--default.select2-container--open .select2-selection__arrow {
  transform: rotate(180deg);
}
.select2-container--default.select2-container--disabled .select2-selection--single {
  cursor: default;
  background: rgb(13, 15, 20);
  border-color: rgb(44, 49, 54);
}
.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__rendered {
  color: rgb(137, 137, 137);
}
.select2-container--default .select2-dropdown {
  padding: 0;
  overflow: hidden;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 8px;
}
.select2-container--default .select2-dropdown--below {
  margin: 4px 0 0;
}
.select2-container--default .select2-dropdown--above {
  margin: 0 0 4px;
}
.select2-container--default .select2-search--dropdown {
  padding: 8px;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
  font-family: "Inter", sans-serif;
  color: rgb(240, 246, 252);
  font-size: 14px;
  font-weight: 400;
  line-height: 140%;
  font-style: normal;
  padding: 8px 10px;
  background: rgb(13, 15, 20);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 6px;
  outline: none;
}
.select2-container--default .select2-search--dropdown .select2-search__field:focus {
  border-color: rgb(29, 184, 154);
}
.select2-container--default .select2-results > .select2-results__options {
  max-height: 300px;
  scrollbar-color: rgb(44, 49, 54) transparent;
  scrollbar-width: thin;
}
.select2-container--default .select2-results__option {
  font-family: "Inter", sans-serif;
  color: rgb(137, 137, 137);
  font-size: 14px;
  font-weight: 400;
  line-height: 140%;
  font-style: normal;
  padding: 10px 14px;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  color: rgb(240, 246, 252);
  background: rgb(33, 38, 48);
}
.select2-container--default .select2-results__option--selected {
  color: rgb(29, 184, 154);
  background: transparent;
}

/* select2 now draws the arrow itself — hide the wrap's native-select triangle */
.reports-select-wrap,
.team-select-wrap {
  /* select2 hides the source <select>; style its sibling container instead */
}
.reports-select-wrap:has(.select2-container)::after,
.team-select-wrap:has(.select2-container)::after {
  display: none;
}
.reports-select-wrap .select2-container--default .select2-selection--single,
.team-select-wrap .select2-container--default .select2-selection--single {
  background: rgb(13, 15, 20);
}
.reports-select-wrap select.db-invalid + .select2-container--default .select2-selection--single,
.team-select-wrap select.db-invalid + .select2-container--default .select2-selection--single {
  border-color: rgb(224, 84, 105);
}

/* Datepicker — Air Datepicker skinned to the dark theme.
   Vendor air-datepicker.min.css is a dependency of disobey.css, so these
   direct selector overrides load after it and win the cascade (project rule:
   no CSS custom properties — style the vendor selectors, not its --adp-* vars).
   Init via DB.datepicker($input) (main.js); the input keeps the yyyy-MM-dd
   value (REST format). Clicking the calendar title navigates
   days → months grid → years grid, matching the design mockup.

   Input markup: <span class="db-date-wrap"><input ...></span> — the calendar
   icon is the wrap's ::after (mask, palette-colorable). */
.db-date-wrap {
  position: relative;
  display: block;
}
.db-date-wrap input {
  width: 100%;
  padding: 11px 40px 11px 14px;
}
.db-date-wrap::after {
  position: absolute;
  top: 50%;
  right: 14px;
  width: 16px;
  height: 16px;
  pointer-events: none;
  content: "";
  background: rgb(137, 137, 137);
  mask-image: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.33333 1.33301V3.99989M10.6667 1.33301V3.99989M2 6.66677H14M3.33333 2.66645H12.6667C13.403 2.66645 14 3.26345 14 3.99989V13.334C14 14.0704 13.403 14.6674 12.6667 14.6674H3.33333C2.59695 14.6674 2 14.0704 2 13.334V3.99989C2 3.26345 2.59695 2.66645 3.33333 2.66645Z" stroke="black" stroke-linecap="round"/></svg>');
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: 16px;
  transform: translateY(-50%);
}

/* Above the report/member panel overlays (z-index 800/900) */
.air-datepicker-global-container {
  z-index: 2000;
}

/* Card */
.air-datepicker {
  font-family: "Inter", sans-serif;
  color: rgb(240, 246, 252);
  font-size: 14px;
  font-weight: 400;
  line-height: 140%;
  font-style: normal;
  padding: 24px;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54) !important;
  border-radius: 16px;
  box-shadow: 0 12px 32px 0 rgba(0, 0, 0, 0.502);
  /* Caret triangle clashes with the dark card */
}
.air-datepicker .air-datepicker--pointer {
  display: none;
}
.air-datepicker .air-datepicker--navigation .air-datepicker-nav {
  padding: 0;
  border-bottom: none;
}
.air-datepicker .air-datepicker--navigation .air-datepicker-nav .air-datepicker-nav--action path {
  stroke: rgb(240, 246, 252);
}
.air-datepicker .air-datepicker--navigation .air-datepicker-nav .air-datepicker-nav--action:hover {
  background: transparent;
}
.air-datepicker .air-datepicker--navigation .air-datepicker-nav .air-datepicker-nav--action:hover path {
  stroke: rgb(164, 177, 216);
}
.air-datepicker .air-datepicker--navigation .air-datepicker-nav .air-datepicker-nav--title {
  font-weight: 600;
  color: rgb(240, 246, 252);
}
.air-datepicker .air-datepicker--navigation .air-datepicker-nav .air-datepicker-nav--title i {
  color: rgb(137, 137, 137);
}
.air-datepicker .air-datepicker--navigation .air-datepicker-nav .air-datepicker-nav--title:hover {
  background: rgb(33, 38, 48);
}
.air-datepicker .air-datepicker--content {
  padding: 0;
}
.air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--day-names {
  display: none;
  /* Weekday row */
}
.air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--day-names .air-datepicker-body--day-name {
  color: rgb(137, 137, 137);
}
.air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells {
  gap: 3px;
  margin: 6px 0 0;
  /* Day / month / year cells */
}
.air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells .air-datepicker-cell {
  color: rgb(240, 246, 252);
  background-color: transparent;
}
.air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells .air-datepicker-cell.-current- {
  font-weight: 600;
  color: rgb(29, 184, 154);
}
.air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells .air-datepicker-cell.-in-range- {
  color: rgb(13, 15, 20);
  background: rgb(29, 184, 154);
  border-radius: 6px;
}
.air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells .air-datepicker-cell.-in-range-.-focus- {
  background: rgba(29, 184, 154, 0.2);
}
.air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells .air-datepicker-cell.-range-from-, .air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells .air-datepicker-cell.-range-to- {
  background: rgba(29, 184, 154, 0.12);
  border: 1px solid rgb(29, 184, 154);
}
.air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells .air-datepicker-cell.-focus-, .air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells .air-datepicker-cell.-selected-, .air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells .air-datepicker-cell.-selected-.-current- {
  font-weight: 600;
  color: rgb(13, 15, 20);
  background: rgb(29, 184, 154);
  border-radius: 6px;
}
.air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells .air-datepicker-cell.-selected-.-focus- {
  color: rgb(13, 15, 20);
  background: rgb(74, 198, 174);
}
.air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells.-months-, .air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells.-years- {
  gap: 8px 12px;
}
.air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells.-months- .air-datepicker-cell, .air-datepicker .air-datepicker--content .air-datepicker-body .air-datepicker-body--cells.-years- .air-datepicker-cell {
  color: rgb(137, 137, 137);
  background-color: rgb(44, 49, 54);
  border-radius: 8px;
}

.db-text-medium-bold {
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 140%;
  font-style: normal;
}

.db-text-medium {
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 140%;
  font-style: normal;
}

.db-text-small-bold {
  font-family: "Inter", sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 140%;
  font-style: normal;
}

.db-text-small {
  font-family: "Inter", sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 140%;
  font-style: normal;
}

.db-text-caption-medium {
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 100%;
  font-style: normal;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.db-text-caption-small {
  font-family: "Inter", sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 100%;
  font-style: normal;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.db-text-mono-extra-large {
  font-family: "Geist Mono", sans-serif;
  font-size: 34px;
  font-weight: 700;
  line-height: 100%;
  font-style: normal;
}

.db-text-mono-large {
  font-family: "Geist Mono", sans-serif;
  font-size: 28px;
  font-weight: 700;
  line-height: 100%;
  font-style: normal;
}

.db-text-mono-medium {
  font-family: "Geist Mono", sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 100%;
  font-style: normal;
}

.db-text-mono-body {
  font-family: "Geist Mono", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 100%;
  font-style: normal;
}

.db-text-mono-delta {
  font-family: "Geist Mono", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 100%;
  font-style: normal;
}

/* Pages */
/* 404 */
.db-page-404 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  min-height: calc(100vh - 200px);
  padding: 120px 27px;
}
.db-page-404 .db-button-404 {
  width: 50%;
  margin: 0 auto;
}
.db-page-404 .db-404-content {
  width: 100%;
  max-width: 620px;
  text-align: center;
}
.db-page-404 .db-404-text {
  margin: 0 0 32px;
}

.db-login-page {
  height: 100%;
  overflow: hidden;
  background: rgb(13, 15, 20);
}

.db-login-layout {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  height: 100vh;
  height: 100dvh;
}
.db-login-layout .db-login-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  padding: 16px 24px;
}
.db-login-layout .db-login-header .db-login-header-inner {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  max-width: 438px;
}
.db-login-layout .db-login-header .db-login-header-inner .db-login-logo img {
  display: block;
  width: auto;
  height: 50px;
}
.db-login-layout .db-login-main {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  flex: 1;
  padding: 40px 16px;
}
.db-login-layout .db-login-main .db-login-card {
  display: flex;
  flex-direction: column;
  gap: 24px;
  flex-wrap: wrap;
  width: 100%;
  max-width: 438px;
  color: rgb(240, 246, 252);
}
.db-login-layout .db-login-main .db-login-card .db-login-form {
  display: flex;
  flex-direction: column;
  gap: 24px;
  flex-wrap: wrap;
}

#statistics-page {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  flex: 1;
  min-height: 0;
  padding: 40px 0;
  overflow-y: auto;
  /* Filters */
  /* Period chips */
  /* KPI cards */
  /*  Line chart */
  /* Signed models */
  /* Tables (models + agency breakdown) */
  /* Boards row (donuts + strategies) */
  /* Strategies */
  /* Toast */
}
@media (width <= 767px) {
  #statistics-page {
    padding: 24px 0;
  }
}
#statistics-page .stats-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 0 0 20px;
}
@media (width <= 767px) {
  #statistics-page .stats-header {
    margin: 0 0 16px;
  }
}
#statistics-page .stats-export-button {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  flex-wrap: nowrap;
  padding: 10px 20px;
}
#statistics-page .stats-filters-row {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: nowrap;
  margin: 0 0 20px;
}
@media (width <= 767px) {
  #statistics-page .stats-filters-row {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: stretch;
    flex-wrap: wrap;
  }
}
#statistics-page .stats-filters-row .stats-filters {
  flex: 1;
  min-width: 0;
  margin: 0;
}
@media (width <= 767px) {
  #statistics-page .stats-filters-row .stats-filters {
    flex-wrap: nowrap;
    max-width: 100%;
    padding: 0 0 4px;
    overflow-x: auto;
    scrollbar-width: none;
  }
}
#statistics-page .stats-period-row {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  position: relative;
  margin: 0 0 40px;
}
@media (width <= 767px) {
  #statistics-page .stats-period-row {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
    flex-wrap: wrap;
    margin: 0 0 24px;
  }
}
#statistics-page .stats-period-row .stats-period-chips {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  flex-wrap: nowrap;
}
@media (width <= 767px) {
  #statistics-page .stats-period-row .stats-period-chips {
    max-width: 100%;
    padding: 0 0 4px;
    overflow-x: auto;
    scrollbar-width: none;
  }
}
#statistics-page .stats-period-row .stats-period-chips .stats-period-chip {
  height: 38px;
  padding: 9px 16px;
  white-space: nowrap;
  cursor: pointer;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 30px;
  transition: color 0.12s, background 0.12s, border-color 0.12s;
}
#statistics-page .stats-period-row .stats-period-chips .stats-period-chip:hover {
  color: rgb(13, 15, 20);
  background: rgb(199, 205, 245);
}
#statistics-page .stats-period-row .stats-period-chips .stats-period-chip.is-active {
  color: rgb(13, 15, 20);
  background: rgb(164, 177, 216);
  border-color: transparent;
}
#statistics-page .stats-period-row .stats-period-picker {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 500;
}
#statistics-page .stats-period-row .stats-range-label {
  margin: 0 0 0 auto;
  color: rgb(137, 137, 137);
}
@media (width <= 767px) {
  #statistics-page .stats-period-row .stats-range-label {
    margin: 0;
  }
}
#statistics-page .stats-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
  margin: 0 0 40px;
}
@media (width <= 1200px) {
  #statistics-page .stats-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (width <= 767px) {
  #statistics-page .stats-kpis {
    gap: 16px;
    margin: 0 0 24px;
  }
}
#statistics-page .stats-kpis .stats-kpi-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex-wrap: nowrap;
  padding: 24px;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 12px;
}
@media (width <= 767px) {
  #statistics-page .stats-kpis .stats-kpi-card {
    gap: 8px;
    padding: 16px;
  }
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-top {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-top .stats-kpi-label {
  color: rgb(137, 137, 137);
}
@media (width <= 767px) {
  #statistics-page .stats-kpis .stats-kpi-card .stats-kpi-top .stats-kpi-label {
    font-size: 12px;
  }
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-top .stats-kpi-icon {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 40px;
  height: 40px;
  color: rgb(164, 177, 216);
  background: rgb(33, 38, 48);
  border-radius: 8px;
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-top .stats-kpi-icon.spent {
  color: rgb(29, 184, 154);
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-top .stats-kpi-icon.contacted {
  color: rgb(137, 137, 137);
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-top .stats-kpi-icon.signed {
  color: rgb(94, 116, 255);
}
@media (width <= 767px) {
  #statistics-page .stats-kpis .stats-kpi-card .stats-kpi-top .stats-kpi-icon {
    width: 32px;
    height: 32px;
    border-radius: 6px;
  }
}
@media (width <= 767px) {
  #statistics-page .stats-kpis .stats-kpi-card .stats-kpi-top .stats-kpi-icon svg {
    width: 16px;
    height: 16px;
  }
}
@media (width <= 767px) {
  #statistics-page .stats-kpis .stats-kpi-card .stats-kpi-value {
    font-size: 24px;
  }
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-value-row {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  flex-wrap: nowrap;
}
@media (width <= 767px) {
  #statistics-page .stats-kpis .stats-kpi-card .stats-kpi-value-row {
    flex-wrap: wrap;
  }
}
@media (width <= 767px) {
  #statistics-page .stats-kpis .stats-kpi-card .stats-kpi-value-row .stats-kpi-value {
    font-size: 24px;
  }
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-value-row .stats-kpi-avg {
  padding: 9px 12px;
  white-space: nowrap;
  background: rgb(33, 38, 48);
  border-radius: 30px;
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-value-row .stats-kpi-avg span {
  color: rgb(137, 137, 137);
}
@media (width <= 767px) {
  #statistics-page .stats-kpis .stats-kpi-card .stats-kpi-value-row .stats-kpi-avg {
    padding: 0;
    background: transparent;
    border-radius: 0;
  }
}
@media (width <= 767px) {
  #statistics-page .stats-kpis .stats-kpi-card .stats-kpi-value-row {
    display: contents;
  }
  #statistics-page .stats-kpis .stats-kpi-card .stats-kpi-avg {
    order: 1;
  }
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-bottom {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: -10px 0 0;
}
@media (width <= 767px) {
  #statistics-page .stats-kpis .stats-kpi-card .stats-kpi-bottom {
    margin: 0;
  }
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-bottom .stats-kpi-delta {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: center;
  flex-wrap: nowrap;
  display: inline-flex;
  white-space: nowrap;
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-bottom .stats-kpi-delta.is-up {
  color: rgb(29, 184, 154);
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-bottom .stats-kpi-delta.is-down {
  color: rgb(255, 150, 166);
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-bottom .stats-kpi-delta svg {
  flex-shrink: 0;
}
#statistics-page .stats-kpis .stats-kpi-card .stats-kpi-bottom .stats-kpi-delta .stats-kpi-delta-label {
  color: rgb(137, 137, 137);
}
@media (width <= 767px) {
  #statistics-page .stats-kpis .stats-kpi-card .stats-kpi-bottom .stats-kpi-delta span {
    font-size: 12px;
  }
}
@media (width <= 767px) {
  #statistics-page .stats-chart-models {
    display: flex;
    flex-direction: column;
    gap: 24px;
    flex-wrap: nowrap;
  }
  #statistics-page .stats-chart-models > * {
    min-width: 0;
  }
  #statistics-page .stats-chart-models .stats-chart-card {
    order: 1;
  }
}
#statistics-page .stats-chart-card {
  position: relative;
  padding: 24px;
  margin: 0 0 40px;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 12px;
}
#statistics-page .stats-chart-legend {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: center;
  flex-wrap: wrap;
  margin: 0 0 16px;
}
#statistics-page .stats-legend-item {
  display: flex;
  flex-direction: row;
  gap: 6px;
  align-items: center;
  flex-wrap: nowrap;
  color: rgb(137, 137, 137);
}
#statistics-page .stats-legend-dot {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
#statistics-page .stats-chart-wrap {
  position: relative;
  height: 260px;
}
#statistics-page .stats-chart-tooltip {
  position: absolute;
  z-index: 400;
  min-width: 270px;
  padding: 16px;
  pointer-events: none;
  background: rgb(33, 38, 48);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 8px;
  box-shadow: 0 10px 24px -8px rgba(0, 0, 0, 0.4);
  opacity: 0;
  transition: opacity 0.1s;
}
#statistics-page .stats-tooltip-title {
  margin: 0 0 16px;
  color: rgb(137, 137, 137);
}
#statistics-page .stats-tooltip-row {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: center;
  flex-wrap: nowrap;
  padding: 4px 0;
}
#statistics-page .stats-tooltip-avg {
  margin: 0 0 0 auto;
  color: rgb(137, 137, 137);
}
#statistics-page .stats-section-header {
  margin: 0 0 16px;
}
#statistics-page .stats-section-count {
  color: rgb(137, 137, 137);
}
#statistics-page .stats-models-chips {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  flex-wrap: nowrap;
  margin: 0 0 16px;
}
@media (width <= 767px) {
  #statistics-page .stats-models-chips {
    max-width: 100%;
    padding: 0 0 4px;
    overflow-x: auto;
    scrollbar-width: none;
  }
}
#statistics-page .stats-model-chip {
  display: flex;
  flex-direction: row;
  gap: 5px;
  align-items: center;
  flex-wrap: nowrap;
  height: 38px;
  padding: 9px 16px;
  white-space: nowrap;
  cursor: pointer;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 30px;
  transition: color 0.12s, background 0.12s, border-color 0.12s;
}
#statistics-page .stats-model-chip:hover {
  color: rgb(13, 15, 20);
  background: rgb(199, 205, 245);
}
#statistics-page .stats-model-chip.is-active {
  color: rgb(13, 15, 20);
  background: rgb(164, 177, 216);
  border-color: transparent;
}
#statistics-page .stats-chip-count {
  color: inherit;
  color: rgb(137, 137, 137);
}
#statistics-page .stats-table-card {
  overflow: hidden;
  border: 1px solid rgb(44, 49, 54);
  border-radius: 12px;
}
#statistics-page .stats-table-scroll {
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: rgb(33, 38, 48) rgba(0, 0, 0, 0);
}
#statistics-page .stats-table {
  width: 100%;
  border-collapse: collapse;
}
#statistics-page .stats-table .stats-thead {
  background: rgb(22, 27, 34);
}
#statistics-page .stats-table .stats-thead th {
  padding: 16px 6px;
  color: rgb(137, 137, 137);
  text-align: left;
  white-space: nowrap;
  vertical-align: baseline;
}
#statistics-page .stats-table tr:nth-child(even) {
  background: rgb(19, 21, 25);
}
#statistics-page .stats-table td {
  padding: 18px 6px;
  white-space: nowrap;
  vertical-align: middle;
}
#statistics-page .stats-table th:first-child,
#statistics-page .stats-table td:first-child {
  padding: 0 6px 0 24px;
}
#statistics-page .stats-type-badge {
  display: inline-block;
  padding: 4px 8px;
  color: rgb(137, 137, 137);
  background: rgb(33, 38, 48);
  border-radius: 4px;
}
#statistics-page .stats-type-badge-date {
  color: rgb(137, 137, 137);
}
#statistics-page .stats-platform-badge {
  display: inline-block;
  padding: 4px 8px;
  margin: 0 4px 4px 0;
  color: rgb(137, 137, 137);
  background: rgb(33, 38, 48);
  border-radius: 4px;
}
#statistics-page .stats-model-links {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex-wrap: nowrap;
}
#statistics-page .stats-model-links a {
  word-break: break-all;
}
#statistics-page .stats-agency-card .stats-thead th {
  padding: 16px 6px;
  white-space: normal;
}
#statistics-page .stats-agency-card td {
  padding: 20px 6px;
  white-space: nowrap;
}
#statistics-page .stats-agency-card th {
  width: 110px;
  white-space: normal;
}
#statistics-page .stats-agency-card th:nth-child(n+3),
#statistics-page .stats-agency-card td:nth-child(n+3) {
  text-align: center;
}
#statistics-page .stats-agency-card th:nth-child(8) {
  max-width: none;
  white-space: nowrap;
}
#statistics-page .stats-agency-card th:first-child,
#statistics-page .stats-agency-card td:first-child {
  width: 140px;
  padding: 0 6px 0 24px;
}
#statistics-page .stats-agency-card th:nth-child(2),
#statistics-page .stats-agency-card td:nth-child(2) {
  width: 620px;
  min-width: 200px;
  max-width: 620px;
  white-space: normal;
}
#statistics-page .stats-agency-card .stats-platform-badge {
  vertical-align: top;
}
#statistics-page .stats-agency-card th:last-child,
#statistics-page .stats-agency-card td:last-child {
  width: 186px;
  padding: 0 24px;
  text-align: right;
}
@media (width <= 1921px) {
  #statistics-page .stats-agency-card th:last-child,
  #statistics-page .stats-agency-card td:last-child {
    width: 166px;
  }
}
#statistics-page .stats-agency-name {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  flex-wrap: nowrap;
  white-space: nowrap;
}
@media (width <= 767px) {
  #statistics-page .stats-agency-name {
    font-weight: 600;
  }
}
#statistics-page .stats-cell-dim,
#statistics-page .stats-cell-contracted {
  color: rgb(137, 137, 137);
}
#statistics-page .stats-cell-interested {
  color: rgb(164, 177, 216);
}
#statistics-page .stats-cell-signed {
  color: rgb(94, 116, 255);
}
#statistics-page .stats-cell-empty {
  padding: 32px 16px;
  color: rgb(137, 137, 137);
  text-align: center;
}
#statistics-page .stats-table-footer {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  flex-shrink: 0;
  margin: 22px 0 0 24px;
}
@media (width <= 767px) {
  #statistics-page .stats-table-footer {
    margin: 16px 0 0 14px;
  }
}
#statistics-page .stats-table-footer .stats-showing {
  color: rgb(137, 137, 137);
}
@media (width <= 767px) {
  #statistics-page .stats-table-footer .stats-showing {
    display: none;
  }
}
#statistics-page .stats-boards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin: 40px 0;
}
@media (width <= 1200px) {
  #statistics-page .stats-boards {
    grid-template-columns: 1fr;
  }
}
@media (width <= 767px) {
  #statistics-page .stats-boards {
    margin: 24px 0;
  }
}
#statistics-page .stats-board-card {
  display: flex;
  flex-direction: column;
  gap: 24px;
  flex-wrap: nowrap;
  position: relative;
  min-width: 0;
  max-height: fit-content;
  padding: 24px;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 12px;
}
@media (width <= 767px) {
  #statistics-page .stats-board-card {
    padding: 16px;
  }
}
#statistics-page .stats-donut-row {
  display: flex;
  flex-direction: row;
  gap: 20px;
  align-items: center;
  flex-wrap: nowrap;
}
@media (width <= 767px) {
  #statistics-page .stats-donut-row {
    gap: 16px;
  }
}
#statistics-page .stats-donut-wrap {
  position: relative;
  flex-shrink: 0;
  width: 160px;
  height: 160px;
}
@media (width <= 767px) {
  #statistics-page .stats-donut-wrap {
    width: 120px;
    height: 120px;
  }
}
#statistics-page .stats-donut-legend {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex-wrap: nowrap;
  min-width: 0;
  padding: 0;
  margin: 0;
  list-style: none;
}
#statistics-page .stats-donut-legend li {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  flex-wrap: nowrap;
  color: rgb(137, 137, 137);
}
#statistics-page .stats-donut-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#statistics-page .stats-donut-value {
  flex-shrink: 0;
}
@media (width <= 767px) {
  #statistics-page .stats-donut-value {
    margin: 0 0 0 -5px;
  }
}
#statistics-page .stats-strategies {
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex-wrap: nowrap;
}
#statistics-page .stats-strategy {
  position: relative;
  padding: 0 0 16px 12px;
  border-bottom: 1px solid rgb(44, 49, 54);
}
#statistics-page .stats-strategy::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 4px;
  max-height: 44px;
  content: "";
  background: rgb(128, 72, 181);
  border-radius: 2px;
}
#statistics-page .stats-strategy:nth-child(2n)::before {
  background: rgb(69, 203, 227);
}
#statistics-page .stats-strategy:last-child {
  padding: 0 0 0 12px;
  border-bottom: none;
}
#statistics-page .stats-strategy-head {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 0 0 8px;
}
#statistics-page .stats-strategy-contacted,
#statistics-page .stats-strategy-description {
  color: rgb(137, 137, 137);
}
#statistics-page .stats-toast {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  flex-wrap: nowrap;
  position: fixed;
  bottom: 24px;
  left: 50%;
  z-index: 900;
  padding: 12px 18px;
  font-size: 14px;
  color: rgb(240, 246, 252);
  background: rgb(33, 38, 48);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.2s, transform 0.2s;
  transform: translate(-50%, 8px);
}
#statistics-page .stats-toast.is-visible {
  opacity: 1;
  transform: translate(-50%, 0);
}
#statistics-page .stats-toast.stats-toast--error {
  border-color: rgb(224, 84, 105);
}
#statistics-page .stats-toast.stats-toast--success {
  border-color: rgb(29, 184, 154);
}

#reports-page {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  flex: 1;
  min-height: 0;
  padding: 40px 0;
  overflow-y: auto;
}
@media (width <= 767px) {
  #reports-page {
    padding: 24px 0 40px;
  }
}
#reports-page .reports-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  flex-shrink: 0;
  margin: 0 0 16px;
}
#reports-page .reports-filters {
  flex-shrink: 0;
  flex-wrap: nowrap;
  margin: 0 0 32px;
}
#reports-page .reports-filters .reports-date-dropdown {
  max-height: none;
  overflow: visible;
  background: none;
  border: none;
  box-shadow: none;
}
#reports-page .reports-table-wrap {
  flex-shrink: 0;
  overflow-x: auto;
  border: 1px solid rgb(44, 49, 54);
  border-radius: 12px;
}
#reports-page .reports-table-wrap .reports-table {
  width: 100%;
  min-width: 900px;
  border-collapse: collapse;
}
#reports-page .reports-table-wrap .reports-table .reports-thead {
  background: rgb(22, 27, 34);
}
#reports-page .reports-table-wrap .reports-table .reports-thead th {
  padding: 17px 16px;
  color: rgb(137, 137, 137);
  text-align: left;
  white-space: nowrap;
}
#reports-page .reports-table-wrap .reports-table .reports-row:nth-child(odd) {
  background: rgb(19, 21, 25);
}
#reports-page .reports-table-wrap .reports-table td {
  padding: 18px 16px;
  white-space: nowrap;
  vertical-align: middle;
}
#reports-page .reports-table-wrap .reports-table td.reports-agency-name {
  font-weight: 600;
}
#reports-page .reports-table-wrap .reports-table td.strategy, #reports-page .reports-table-wrap .reports-table td.contracted {
  color: rgb(137, 137, 137);
}
#reports-page .reports-table-wrap .reports-table td.interested {
  color: rgb(164, 177, 216);
}
#reports-page .reports-table-wrap .reports-table td.signed {
  color: rgb(94, 116, 255);
}
#reports-page .reports-table-wrap .reports-table td.signed .reports-view-models {
  text-decoration: underline;
}
#reports-page .reports-table-wrap .reports-table td.recruiter .reports-recruiter-wrap {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  vertical-align: middle;
}
#reports-page .reports-table-wrap .reports-table td.recruiter .reports-recruiter-wrap:hover:not(span) {
  color: rgb(29, 184, 154);
}
#reports-page .reports-table-wrap .reports-table td.reports-cell-actions {
  text-align: right;
}
#reports-page .reports-table-wrap .reports-table td.reports-cell-actions .reports-actions-wrap {
  display: inline-flex;
  gap: 16px;
  align-items: center;
  vertical-align: middle;
}
#reports-page .reports-table-wrap .reports-table .reports-avatar {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  object-fit: cover;
  border-radius: 50%;
}
#reports-page .reports-table-wrap .reports-table .reports-avatar.reports-avatar-initial {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  font-size: 10px;
  font-weight: 700;
  color: rgb(240, 246, 252);
  background: rgb(33, 38, 48);
}
#reports-page .reports-table-wrap .reports-table .reports-icon-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 28px;
  height: 28px;
  color: rgb(137, 137, 137);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 6px;
  transition: background 0.12s, color 0.12s;
}
#reports-page .reports-table-wrap .reports-table .reports-icon-button:hover {
  color: rgb(240, 246, 252);
  background: rgb(33, 38, 48);
}
#reports-page .reports-table-wrap .reports-table .reports-row--loading td,
#reports-page .reports-table-wrap .reports-table .reports-row--empty td {
  padding: 40px;
  color: rgb(137, 137, 137);
  text-align: center;
}
#reports-page .reports-table-wrap .reports-table .reports-spinner {
  display: inline-block;
  width: 14px;
  height: 14px;
  margin: 0 6px 0 0;
  vertical-align: middle;
  border: 2px solid rgb(44, 49, 54);
  border-top-color: rgb(29, 184, 154);
  border-radius: 50%;
  animation: reports-spin 0.7s linear infinite;
}
@keyframes reports-spin {
  to {
    transform: rotate(360deg);
  }
}
#reports-page .reports-footer {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  flex-shrink: 0;
  margin: 22px 0 0 24px;
}
#reports-page .reports-footer .reports-showing {
  color: rgb(137, 137, 137);
}
#reports-page .reports-add-mobile {
  display: none;
  height: 36px;
  padding: 8px 16px;
}
#reports-page .reports-cards {
  display: none;
}
@media (width <= 767px) {
  #reports-page .reports-add-mobile {
    display: flex;
  }
  #reports-page .reports-filters {
    max-width: 100%;
    padding: 0 0 4px;
    margin: 0 0 24px;
    overflow-x: auto;
    scrollbar-width: none;
  }
  #reports-page .reports-table-wrap {
    display: none;
  }
  #reports-page .reports-cards {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex-wrap: nowrap;
  }
  #reports-page .reports-cards .reports-card {
    display: flex;
    flex-direction: column;
    gap: 16px;
    flex-wrap: nowrap;
    padding: 12px;
    background: rgb(19, 21, 25);
    border: 1px solid rgb(44, 49, 54);
    border-radius: 12px;
  }
  #reports-page .reports-cards .reports-card .reports-card-top {
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    color: rgb(137, 137, 137);
  }
  #reports-page .reports-cards .reports-card .reports-card-top .reports-actions-wrap {
    display: flex;
    flex-direction: row;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  #reports-page .reports-cards .reports-card .reports-card-top .reports-actions-wrap .reports-icon-button {
    width: 24px;
    height: 24px;
  }
  #reports-page .reports-cards .reports-card .reports-card-row {
    display: flex;
    flex-direction: row;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  #reports-page .reports-cards .reports-card .reports-card-row + .reports-card-row {
    margin: -6px 0 0;
  }
  #reports-page .reports-cards .reports-card .reports-card-stats {
    display: flex;
    flex-direction: row;
    gap: 12px;
    justify-content: space-between;
    flex-wrap: nowrap;
    padding: 16px 0 0;
    border-top: 1px solid rgb(44, 49, 54);
  }
  #reports-page .reports-cards .reports-card .reports-card-stats > div {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex-wrap: nowrap;
    flex: 1;
    color: rgb(137, 137, 137);
  }
  #reports-page .reports-cards .reports-card .reports-card-stats .interested {
    color: rgb(164, 177, 216);
  }
  #reports-page .reports-cards .reports-card .reports-card-stats .reports-card-signed {
    padding: 0;
    color: rgb(94, 116, 255);
    text-align: left;
    cursor: pointer;
    background: none;
    border: none;
  }
  #reports-page .reports-cards .reports-card .reports-card-stats .reports-card-signed.reports-view-models {
    text-decoration: underline;
  }
  #reports-page .reports-cards .reports-card .reports-card-recruiter {
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: center;
    flex-wrap: nowrap;
    padding: 16px 0 0;
    border-top: 1px solid rgb(44, 49, 54);
  }
  #reports-page .reports-cards .reports-card .reports-card-recruiter .reports-avatar {
    width: 24px;
    height: 24px;
    border-radius: 50%;
  }
  #reports-page .reports-footer {
    margin: 22px 0 0;
  }
}

[data-dialog-name=report-panel] {
  position: fixed;
  inset: 0;
  z-index: 800;
  display: none;
  justify-content: flex-end;
}
[data-dialog-name=report-panel][data-overlay] {
  display: flex;
  background: rgba(0, 0, 0, 0.5);
}
[data-dialog-name=report-panel][data-dialog-active] .reports-panel {
  transform: translateX(0);
}

.reports-panel {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  width: 480px;
  max-width: 100vw;
  height: 100%;
  overflow: hidden;
  background: rgb(22, 27, 34);
  border-left: 1px solid rgb(44, 49, 54);
  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  transform: translateX(100%);
}
.reports-panel .reports-panel-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  flex-shrink: 0;
  padding: 24px;
  border-bottom: 1px solid rgb(44, 49, 54);
}
.reports-panel .reports-panel-header .member-models-count {
  color: rgb(137, 137, 137);
}
.reports-panel .reports-panel-body {
  display: flex;
  flex-direction: column;
  gap: 24px;
  flex-wrap: nowrap;
  flex: 1;
  padding: 24px;
  overflow-y: auto;
}
.reports-panel .reports-panel-footer {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  flex-shrink: 0;
  padding: 16px 24px;
  border-top: 1px solid rgb(44, 49, 54);
}
.reports-panel .reports-panel-footer .db-button-secondary {
  flex: 1;
}
.reports-panel .reports-panel-footer .db-button-primary {
  flex: 2;
}

.reports-form-label {
  display: block;
  margin: 0 0 7px;
  color: rgb(137, 137, 137);
  text-transform: uppercase;
}
.reports-form-label .reports-required {
  color: rgb(224, 84, 105);
}

.reports-form-field {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}

.reports-select-wrap {
  position: relative;
}
.reports-select-wrap select {
  padding: 0 32px;
  appearance: none;
}
.reports-select-wrap::after {
  position: absolute;
  top: 50%;
  right: 12px;
  width: 14px;
  height: 14px;
  pointer-events: none;
  content: "";
  mask-image: url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3.5 5.25L7 8.75L10.5 5.25" stroke="%23898989" stroke-linecap="round"/></svg>');
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: 14px;
  transform: translateY(-50%);
}

.reports-add-link {
  padding: 0;
  margin: 8px 0 0;
  font-size: 14px;
  color: rgb(29, 184, 154);
  text-align: left;
  cursor: pointer;
  background: none;
  border: none;
}
.reports-add-link:hover {
  color: rgb(240, 246, 252);
}

.reports-strategy-description {
  margin: 8px 0 0;
  color: rgb(137, 137, 137);
}

.reports-agency-hint {
  margin: 8px 0 0;
  color: rgb(29, 184, 154);
}

.reports-input-prefix-wrap {
  position: relative;
}
.reports-input-prefix-wrap .reports-input-prefix {
  position: absolute;
  top: 50%;
  left: 14px;
  color: rgb(137, 137, 137);
  pointer-events: none;
  transform: translateY(-50%);
}
.reports-input-prefix-wrap .reports-input-prefixed {
  padding: 0 0 0 28px;
}

.reports-location-wrap {
  position: relative;
}
.reports-location-wrap svg {
  position: absolute;
  top: 50%;
  left: 12px;
  z-index: 1;
  color: rgb(137, 137, 137);
  pointer-events: none;
  transform: translateY(-50%);
}
.reports-location-wrap .reports-location-input {
  padding: 0 0 0 32px;
}
.reports-location-wrap .reports-location-dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  z-index: 50;
  display: none;
  max-height: 200px;
  overflow: hidden;
  overflow-y: auto;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 0 0 8px 8px;
  box-shadow: 0 8px 20px -6px rgba(0, 0, 0, 0.4);
  scrollbar-width: thin;
  scrollbar-color: rgb(33, 38, 48) rgba(0, 0, 0, 0);
}
.reports-location-wrap .reports-location-dropdown .reports-city-option {
  padding: 9px 14px;
  font-size: 13px;
  color: rgb(137, 137, 137);
  cursor: pointer;
  transition: background 0.1s;
}
.reports-location-wrap .reports-location-dropdown .reports-city-option:hover {
  color: rgb(240, 246, 252);
  background: rgb(33, 38, 48);
}

.reports-model-counts-row {
  display: flex;
  flex-direction: row;
  gap: 12px;
  flex-wrap: nowrap;
}
.reports-model-counts-row .reports-model-count-field {
  flex: 1;
}
.reports-model-counts-row .reports-model-count-field .reports-model-count-label {
  display: block;
  margin: 12px 0 8px;
  color: rgb(137, 137, 137);
}

.reports-textarea {
  min-height: 80px;
  resize: vertical;
}

.reports-close-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 28px;
  height: 28px;
  color: rgb(137, 137, 137);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 6px;
  transition: color 0.12s, background 0.12s;
}
.reports-close-button:hover {
  color: rgb(164, 177, 216);
}

.reports-signed-models-section {
  margin: 4px 0 0;
}

.reports-model-accordion {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex-wrap: wrap;
  margin: 10px 0 0;
}
.reports-model-accordion .reports-model-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgb(44, 49, 54);
  border-radius: 8px;
}
.reports-model-accordion .reports-model-card::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -1px;
  width: 5px;
  content: "";
  background: rgb(29, 184, 154);
}
.reports-model-accordion .reports-model-card .reports-model-card-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 11px 12px;
  cursor: pointer;
  user-select: none;
}
.reports-model-accordion .reports-model-card .reports-model-card-chevron {
  flex-shrink: 0;
  color: rgb(137, 137, 137);
  transition: transform 0.2s;
}
.reports-model-accordion .reports-model-card .reports-model-card-body {
  display: none;
  padding: 12px;
}
.reports-model-accordion .reports-model-card.is-open .reports-model-card-chevron {
  transform: rotate(180deg);
}
.reports-model-accordion .reports-model-card.is-open .reports-model-card-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex-wrap: wrap;
}

.reports-model-name-row {
  display: flex;
  flex-direction: row;
  gap: 10px;
  flex-wrap: wrap;
}
.reports-model-name-row > .reports-form-field {
  flex: 1;
}

.reports-model-links-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex-wrap: wrap;
  margin: 4px 0 0;
}
.reports-model-links-list .reports-model-link-input {
  color: rgb(94, 116, 255);
}
.reports-model-links-list .reports-model-link-input:hover {
  color: rgb(94, 116, 255);
}

[data-dialog-name=delete-report],
[data-dialog-name=new-platform],
[data-dialog-name=new-strategy] {
  position: fixed;
  inset: 0;
  z-index: 900;
  display: none;
  align-items: center;
  justify-content: center;
}
[data-dialog-name=delete-report][data-overlay],
[data-dialog-name=new-platform][data-overlay],
[data-dialog-name=new-strategy][data-overlay] {
  display: flex;
  background: rgba(0, 0, 0, 0.65);
}

/* View Models — right-side panel, same treatment as the report panel
   (reuses .reports-panel container/header/body classes) */
[data-dialog-name=view-models] {
  position: fixed;
  inset: 0;
  z-index: 900;
  display: none;
  justify-content: flex-end;
}
[data-dialog-name=view-models][data-overlay] {
  display: flex;
  background: rgba(0, 0, 0, 0.5);
}
[data-dialog-name=view-models][data-dialog-active] .reports-panel {
  transform: translateX(0);
}

.reports-modal {
  display: flex;
  flex-direction: column;
  gap: 20px;
  flex-wrap: nowrap;
  position: relative;
  width: 480px;
  max-width: calc(100vw - 32px);
  padding: 21px;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 12px;
  box-shadow: 0 12px 32px 0 rgba(0, 0, 0, 0.5);
}
.reports-modal.reports-modal-delete {
  gap: 36px;
}
.reports-modal.modal-body-sm {
  width: 400px;
  max-width: 100%;
  padding: 20px;
}
.reports-modal .reports-modal-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.reports-modal .reports-modal-header .reports-modal-title {
  padding: 0 30px 0 0;
}
.reports-modal .reports-modal-header .reports-modal-close {
  position: absolute;
  top: 20px;
  right: 20px;
}
.reports-modal .reports-modal-actions {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}
.reports-modal .reports-modal-actions .db-button-secondary {
  flex: 1;
}
.reports-modal .reports-modal-actions .db-button-primary {
  flex: 2;
}
.reports-modal .reports-modal-submit {
  width: 100%;
}

.reports-toast {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  position: fixed;
  bottom: 20px;
  left: 50%;
  z-index: 1000;
  padding: 12px 20px;
  pointer-events: none;
  background: rgb(33, 38, 48);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 8px;
  box-shadow: 0 8px 24px 0 rgba(0, 0, 0, 0.4);
  opacity: 0;
  transition: opacity 0.25s, transform 0.25s;
  transform: translateX(-50%) translateY(20px);
}
.reports-toast.is-visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.reports-toast.reports-toast-success svg {
  color: rgb(29, 184, 154);
}
.reports-toast.reports-toast-error {
  color: rgb(255, 150, 166);
  border-color: rgb(255, 150, 166);
}

#team-page {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  position: relative;
  flex: 1;
  min-height: 0;
}
#team-page .team-sidebar {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 500;
  width: 280px;
  background: rgb(19, 21, 25);
  border-right: 1px solid rgb(44, 49, 54);
}
@media (width <= 560px) {
  #team-page .team-sidebar {
    justify-content: center;
    width: 100%;
    height: 50vh;
    margin: auto 0 0;
    border-right: none;
    border-radius: 24px 24px 0 0;
  }
}
#team-page .team-members-list {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  flex: 1;
  min-height: 0;
  padding: 4px 0;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgb(33, 38, 48) rgba(0, 0, 0, 0);
}
@media (width <= 560px) {
  #team-page .team-members-list {
    padding: 14px 0 0;
    margin: 0 0 60px;
  }
}
#team-page .team-list-loading {
  padding: 32px 16px;
  color: rgb(137, 137, 137);
  text-align: center;
}
#team-page .team-sidebar-footer {
  flex-shrink: 0;
  padding: 16px 16px 16px 40px;
}
@media (width <= 560px) {
  #team-page .team-sidebar-footer {
    position: absolute;
    right: 0;
    bottom: 16px;
    left: 0;
    padding: 0 16px;
  }
}
#team-page .team-sidebar-footer .team-add-button {
  width: 100%;
  max-width: 260px;
}
@media (width <= 560px) {
  #team-page .team-sidebar-footer .team-add-button {
    max-width: 100%;
  }
}
#team-page .team-map-wrap {
  position: relative;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}
#team-page #team-map {
  width: 100%;
  height: 100%;
}

.team-member-row {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  position: relative;
  flex-wrap: nowrap;
  padding: 8px 16px 8px 40px;
  cursor: pointer;
  transition: background 0.12s;
}
@media (width <= 560px) {
  .team-member-row {
    padding: 6px 24px;
  }
}
.team-member-row:hover, .team-member-row.is-map-hover {
  background: rgb(22, 27, 34);
}
.team-member-row.is-inactive .team-member-avatar {
  filter: grayscale(1);
  opacity: 0.7;
}
.team-member-row.is-inactive .team-member-name {
  color: rgb(137, 137, 137);
}
.team-member-row .team-member-avatar {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  object-fit: cover;
  border-radius: 50%;
}
.team-member-row .team-member-avatar.team-member-avatar-initial {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  color: rgb(240, 246, 252);
  background: rgb(33, 38, 48);
}
.team-member-row .team-member-info {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  flex: 1;
  min-width: 0;
}
.team-member-row .team-member-info .team-member-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.team-member-row .team-member-info .team-member-location {
  display: flex;
  flex-direction: row;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
  overflow: hidden;
  color: rgb(137, 137, 137);
  white-space: nowrap;
}
.team-member-row .team-member-dot {
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

.team-inactive-badge {
  flex-shrink: 0;
  padding: 1px 6px;
  font-size: 10px;
  font-weight: 500;
  color: rgb(137, 137, 137);
  background: rgb(33, 38, 48);
  border-radius: 4px;
}

.team-avatar-marker {
  background: none;
  border: none;
}

.team-avatar-pin {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 32px;
  height: 32px;
  overflow: hidden;
  background: rgb(33, 38, 48);
  border: 4px solid rgb(29, 184, 154);
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
}
.team-avatar-pin img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.team-avatar-pin i {
  color: rgb(240, 246, 252);
}

[data-dialog-name=member-panel] {
  position: fixed;
  inset: 0;
  z-index: 800;
  display: none;
  justify-content: flex-end;
}
[data-dialog-name=member-panel][data-overlay] {
  display: flex;
  background: rgba(0, 0, 0, 0.5);
}
[data-dialog-name=member-panel][data-dialog-active] .team-panel {
  transform: translateX(0);
}
[data-dialog-name=member-panel] .team-panel {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  width: 480px;
  max-width: 100vw;
  height: 100%;
  overflow: hidden;
  background: rgb(22, 27, 34);
  border-left: 1px solid rgb(44, 49, 54);
  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  transform: translateX(100%);
}
[data-dialog-name=member-panel] .team-panel-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  flex-shrink: 0;
  padding: 20px 24px;
  border-bottom: 1px solid rgb(44, 49, 54);
}
[data-dialog-name=member-panel] .team-panel-body {
  display: flex;
  flex-direction: column;
  gap: 20px;
  flex-wrap: nowrap;
  flex: 1;
  padding: 24px;
  overflow-y: auto;
}
[data-dialog-name=member-panel] .team-panel-footer {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  flex-shrink: 0;
  padding: 24px;
  border-top: 1px solid rgb(44, 49, 54);
}
[data-dialog-name=member-panel] .team-panel-footer .db-button-secondary {
  flex: 1;
}
[data-dialog-name=member-panel] .team-panel-footer .db-button-primary {
  flex: 2;
}
[data-dialog-name=member-panel] .team-photo-upload {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  flex-wrap: nowrap;
  padding: 8px 0;
}
[data-dialog-name=member-panel] .team-photo-upload .team-photo-circle {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  position: relative;
  width: 100px;
  height: 100px;
  overflow: hidden;
  color: rgb(137, 137, 137);
  cursor: pointer;
  background: rgb(13, 15, 20);
  border: 1px dashed rgb(44, 49, 54);
  border-radius: 50%;
  transition: border-color 0.15s, color 0.15s;
}
[data-dialog-name=member-panel] .team-photo-upload .team-photo-circle:hover {
  background: rgb(19, 21, 25);
  border-color: rgb(29, 184, 154);
}
[data-dialog-name=member-panel] .team-photo-upload .team-photo-preview {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
[data-dialog-name=member-panel] .team-photo-upload .team-photo-label {
  color: rgb(29, 184, 154);
  cursor: pointer;
  background: none;
  border: none;
}

.team-form-field {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
}
.team-form-field .team-form-label {
  display: block;
  margin: 0 0 7px;
  font-family: "Geist Mono";
  font-size: 11px;
  font-weight: 700;
  color: rgb(137, 137, 137);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.team-form-field .team-form-hint {
  margin: 7px 0 0;
  color: rgb(164, 177, 216);
  text-transform: none;
}

.team-select-wrap {
  position: relative;
}
.team-select-wrap select {
  padding: 0 32px 0 0;
  appearance: none;
}
.team-select-wrap::after {
  position: absolute;
  top: 50%;
  right: 12px;
  width: 0;
  height: 0;
  pointer-events: none;
  content: "";
  border-top: 5px solid rgb(137, 137, 137);
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  transform: translateY(-50%);
}

.team-location-wrap {
  position: relative;
}
.team-location-wrap svg {
  position: absolute;
  top: 50%;
  left: 12px;
  z-index: 1;
  color: rgb(137, 137, 137);
  pointer-events: none;
  transform: translateY(-50%);
}
.team-location-wrap .team-location-input {
  padding: 0 0 0 32px;
}
.team-location-wrap .team-location-dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  z-index: 50;
  display: none;
  max-height: 200px;
  overflow: hidden;
  overflow-y: auto;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  border-top: none;
  border-radius: 0 0 8px 8px;
}
.team-location-wrap .team-location-dropdown .team-city-option {
  padding: 9px 14px;
  font-size: 13px;
  color: rgb(137, 137, 137);
  cursor: pointer;
  transition: background 0.1s;
}
.team-location-wrap .team-location-dropdown .team-city-option:hover {
  color: rgb(240, 246, 252);
  background: rgb(33, 38, 48);
}

.team-close-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 24px;
  height: 24px;
  color: rgb(137, 137, 137);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 6px;
  transition: color 0.12s, background 0.12s;
}
.team-close-button:hover {
  color: rgb(164, 177, 216);
}

.team-toast {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  position: fixed;
  bottom: 24px;
  left: 50%;
  z-index: 1000;
  padding: 12px 20px;
  font-size: 13px;
  font-weight: 500;
  color: rgb(240, 246, 252);
  pointer-events: none;
  background: rgb(33, 38, 48);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.25s, transform 0.25s;
  transform: translateX(-50%) translateY(20px);
}
.team-toast.is-visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.team-toast.team-toast--success svg {
  color: rgb(29, 184, 154);
}
.team-toast.team-toast--error {
  color: rgb(255, 150, 166);
  border-color: rgb(255, 150, 166);
}

.member-header {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  flex-shrink: 0;
  padding: 0 0 40px;
  margin: 0 0 40px;
  border-bottom: 1px solid rgb(44, 49, 54);
}
@media (width <= 1200px) {
  .member-header {
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: flex-start;
    flex-wrap: wrap;
  }
}
.member-header .member-identity {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: center;
  flex-wrap: wrap;
  min-width: 0;
}
.member-header .member-identity .member-avatar {
  flex-shrink: 0;
  width: 64px;
  height: 64px;
  object-fit: cover;
  border-radius: 50%;
}
.member-header .member-identity .member-avatar.member-avatar-initial {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  font-size: 24px;
  font-weight: 700;
  color: rgb(240, 246, 252);
  background: rgb(33, 38, 48);
}
.member-header .member-identity .member-identity-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex-wrap: nowrap;
  min-width: 0;
}
.member-header .member-identity .member-identity-info .member-name {
  overflow: hidden;
  color: rgb(240, 246, 252);
  text-overflow: ellipsis;
  white-space: nowrap;
}
.member-header .member-identity .member-identity-info .member-name.is-inactive {
  color: rgb(137, 137, 137);
}
.member-header .member-identity .member-identity-info .member-location {
  display: flex;
  flex-direction: row;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
  color: rgb(137, 137, 137);
}
.member-header .member-actions {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  margin: 0 0 0 12px;
}
.member-header .member-actions .member-edit-button {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: center;
  flex-wrap: wrap;
  height: 32px;
  padding: 0 12px 0 8px;
  color: rgb(137, 137, 137);
}
.member-header .member-actions .member-edit-button svg {
  color: rgb(137, 137, 137);
}
.member-header .member-actions .member-menu {
  position: relative;
}
.member-header .member-actions .member-menu .member-menu-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 32px;
  height: 32px;
  padding: 0;
}
.member-header .member-actions .member-menu .member-menu-button:hover svg {
  color: rgb(164, 177, 216);
}
.member-header .member-actions .member-menu.is-open .member-menu-dropdown {
  display: block;
}
.member-header .member-actions .member-menu.is-open .member-menu-button {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgb(164, 177, 216);
}
.member-header .member-actions .member-menu.is-open .member-menu-button svg {
  color: rgb(164, 177, 216);
}
.member-header .member-actions .member-menu .member-menu-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 300;
  display: none;
  min-width: 103px;
  padding: 0;
  overflow: hidden;
  background: rgb(22, 27, 34);
  border: 1px solid rgb(44, 49, 54);
  border-radius: 8px;
  box-shadow: 0 8px 20px -6px rgba(0, 0, 0, 0.4);
}
.member-header .member-actions .member-menu .member-menu-dropdown .member-menu-item {
  display: block;
  width: 100%;
  padding: 10px 16px;
  color: rgb(137, 137, 137);
  text-align: center;
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 0;
  transition: background 0.12s;
}
.member-header .member-actions .member-menu .member-menu-dropdown .member-menu-item:hover {
  background: rgb(33, 38, 48);
}
.member-header .member-stat-tiles {
  display: flex;
  flex-direction: row;
  gap: 16px;
  flex-wrap: wrap;
  flex-shrink: 0;
}
@media (width <= 1200px) {
  .member-header .member-stat-tiles {
    flex-wrap: wrap;
  }
}
@media (width <= 767px) {
  .member-header .member-stat-tiles {
    align-self: stretch;
  }
}
.member-header .member-stat-tiles .member-stat-tile {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex-wrap: nowrap;
  min-width: 163px;
  padding: 16px;
  background: rgb(22, 27, 34);
  border: 1px solid "border";
  border-radius: 10px;
}
@media (width <= 767px) {
  .member-header .member-stat-tiles .member-stat-tile {
    flex: 1 1 calc(50% - 8px);
    min-width: 0;
  }
}
.member-header .member-stat-tiles .member-stat-tile .member-stat-label {
  color: rgb(137, 137, 137);
}
.member-header .member-stat-tiles .member-stat-tile .member-stat-value {
  color: rgb(240, 246, 252);
}

.member-reports-header .reports-add-button {
  height: 36px;
  padding: 8px 16px;
}
@media (width <= 767px) {
  .member-reports-header .reports-add-button {
    display: none;
  }
}

.reports-add-button-mobile {
  display: none;
}
@media (width <= 767px) {
  .reports-add-button-mobile {
    display: block;
    width: 100%;
    height: 41px;
    margin: 16px 0 0;
  }
}

.member-models-list {
  gap: 20px;
}
.member-models-list .member-models-empty {
  color: rgb(137, 137, 137);
  text-align: center;
}
.member-models-list .member-model {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex-wrap: nowrap;
}
.member-models-list .member-model .member-model-head {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}
.member-models-list .member-model .member-model-head .member-model-type {
  padding: 4px 8px;
  color: rgb(137, 137, 137);
  background: rgb(33, 38, 48);
  border-radius: 4px;
}
.member-models-list .member-model .member-model-link {
  overflow: hidden;
  white-space: nowrap;
}
.member-models-list .member-model:first-child {
  padding: 24px 0;
}

/*# sourceMappingURL=disobey.css.map */