:root{
  /* Hulpdiensten Portal theme - Updated dropdown styling */
  --pm-accent: #2d93ff;
  --pm-accent-2: #55b6ff;
  --pm-bg: #1f2326;
  --pm-bg-2: #23282d;
  --pm-panel: #31383e;
  --pm-panel-2: #363e45;
  --pm-border: rgba(255,255,255,.10);
  --pm-border-2: rgba(255,255,255,.06);
  --pm-text: #e7edf3;
  --pm-muted: rgba(231,237,243,.72);
  --pm-muted-2: rgba(231,237,243,.55);
  --pm-radius: 10px;
  --pm-radius-lg: 12px;
  --pm-shadow: 0 10px 22px rgba(0,0,0,.28);
  --pm-shadow-soft: 0 6px 16px rgba(0,0,0,.22);
  --pm-surface: rgba(0,0,0,.12);
  --pm-surface-2: rgba(0,0,0,.18);
  --pm-surface-3: rgba(0,0,0,.08);
  --pm-surface-4: rgba(0,0,0,.20);
  --pm-card-bg: rgba(49,56,62,.85);
  --pm-card-head-bg: rgba(0,0,0,.10);
  --pm-card-border: rgba(255,255,255,.10);
  --pm-card-head-border: rgba(255,255,255,.08);
  --pm-table-head-bg: rgba(0,0,0,.12);
  --pm-table-head-color: rgba(231,237,243,.70);
  --pm-table-row-hover: rgba(255,255,255,.05);
  --pm-table-border: rgba(255,255,255,.06);
  --pm-avatar-bg: rgba(255,255,255,.08);
  --pm-avatar-border: rgba(255,255,255,.12);
  --pm-avatar-text: #fff;
  --pm-stat-bg: rgba(49,56,62,.72);
  --pm-photo-bg: rgba(0,0,0,.10);
  --pm-photo-border: rgba(255,255,255,.10);
}

:root{ --pm-radius-md: 8px; }
html, body{ height: 100%; }
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: var(--pm-bg);
  color: var(--pm-text);
}
h1, h2, h3, h4, h5, h6, .tj-brand-text, .pm-title{ font-family: Sora, Inter, system-ui, sans-serif; }

/* Bootstrap theme overrides */
[data-bs-theme="dark"]{
  color-scheme: dark;
  --bs-body-bg: var(--pm-bg);
  --bs-body-color: var(--pm-text);
  --bs-border-color: var(--pm-border);
  --bs-secondary-color: var(--pm-muted);
  --bs-tertiary-color: var(--pm-muted-2);
  --bs-link-color: var(--pm-accent-2);
  --bs-link-hover-color: #9dd6ff;
  --bs-primary: var(--pm-accent);
  --bs-primary-rgb: 45, 147, 255;
  /* Dropdown overrides */
  --bs-dropdown-bg: var(--pm-panel);
  --bs-dropdown-border-color: var(--pm-border);
  --bs-dropdown-link-color: var(--pm-text);
  --bs-dropdown-link-hover-bg: rgba(255,255,255,.08);
  --bs-dropdown-link-hover-color: #fff;
  --bs-dropdown-link-active-bg: var(--pm-accent);
  --bs-dropdown-link-active-color: #fff;
  --bs-dropdown-border-radius: var(--pm-radius);
  --bs-dropdown-padding-y: 0.5rem;
  --bs-dropdown-item-border-radius: 6px;
}

[data-bs-theme="light"]{
  color-scheme: light;
  --pm-accent: #0a67c6;
  --pm-accent-2: #2d7dd2;
  --pm-bg: #f3f5f7;
  --pm-bg-2: #e8edf2;
  --pm-panel: #ffffff;
  --pm-panel-2: #f6f8fa;
  --pm-border: rgba(15,20,26,.14);
  --pm-border-2: rgba(15,20,26,.08);
  --pm-text: #0f141a;
  --pm-muted: rgba(15,20,26,.72);
  --pm-muted-2: rgba(15,20,26,.56);
  --pm-surface: rgba(15,20,26,.04);
  --pm-surface-2: rgba(15,20,26,.08);
  --pm-surface-3: rgba(15,20,26,.06);
  --pm-surface-4: rgba(15,20,26,.10);
  --pm-card-bg: var(--pm-panel);
  --pm-card-head-bg: var(--pm-panel-2);
  --pm-card-border: rgba(15,20,26,.12);
  --pm-card-head-border: rgba(15,20,26,.08);
  --pm-table-head-bg: rgba(15,20,26,.06);
  --pm-table-head-color: rgba(15,20,26,.70);
  --pm-table-row-hover: rgba(15,20,26,.04);
  --pm-table-border: rgba(15,20,26,.08);
  --pm-avatar-bg: rgba(15,20,26,.08);
  --pm-avatar-border: rgba(15,20,26,.18);
  --pm-avatar-text: #0f141a;
  --pm-stat-bg: var(--pm-panel-2);
  --pm-photo-bg: rgba(15,20,26,.04);
  --pm-photo-border: rgba(15,20,26,.10);
  --bs-body-bg: #f3f5f7;
  --bs-body-color: #0f141a;
  --bs-border-color: rgba(15,20,26,.14);
  --bs-secondary-color: rgba(15,20,26,.72);
  --bs-tertiary-color: rgba(15,20,26,.56);
  --bs-link-color: #0a67c6;
  --bs-link-hover-color: #074c94;
  --bs-primary: #0a67c6;
  --bs-primary-rgb: 10, 103, 198;
  /* Dropdown overrides */
  --bs-dropdown-bg: #fff;
  --bs-dropdown-border-color: rgba(0,0,0,.12);
  --bs-dropdown-link-color: #212529;
  --bs-dropdown-link-hover-bg: #f8f9fa;
  --bs-dropdown-link-hover-color: #000;
  --bs-dropdown-link-active-bg: #0a67c6;
  --bs-dropdown-link-active-color: #fff;
  --bs-dropdown-border-radius: 10px;
  --bs-dropdown-padding-y: 0.5rem;
  --bs-dropdown-item-border-radius: 6px;
}

[data-bs-theme="dark"]{
  --pm-accent: #2fb7ff;
  --pm-accent-2: #89e1ff;
  --pm-bg: #09131c;
  --pm-bg-2: #102030;
  --pm-panel: #142434;
  --pm-panel-2: #1a2d40;
  --pm-border: rgba(129,191,236,.15);
  --pm-border-2: rgba(129,191,236,.08);
  --pm-text: #e7f2fb;
  --pm-muted: rgba(231,242,251,.72);
  --pm-muted-2: rgba(231,242,251,.52);
  --pm-radius-md: 8px;
  --pm-shadow: 0 16px 40px rgba(2,8,16,.42);
  --pm-shadow-soft: 0 10px 24px rgba(2,8,16,.30);
  --pm-surface: rgba(13,27,39,.72);
  --pm-surface-2: rgba(9,19,28,.88);
  --pm-surface-3: rgba(18,36,52,.58);
  --pm-surface-4: rgba(10,19,29,.94);
  --pm-card-bg: rgba(20,36,52,.88);
  --pm-card-head-bg: rgba(7,16,25,.58);
  --pm-card-border: rgba(129,191,236,.14);
  --pm-card-head-border: rgba(129,191,236,.10);
  --pm-table-head-bg: rgba(8,17,26,.64);
  --pm-table-head-color: rgba(231,242,251,.70);
  --pm-table-row-hover: rgba(47,183,255,.06);
  --pm-table-border: rgba(129,191,236,.08);
  --pm-avatar-bg: rgba(47,183,255,.14);
  --pm-avatar-border: rgba(129,225,255,.18);
  --pm-stat-bg: rgba(20,36,52,.82);
  --pm-photo-bg: rgba(6,14,22,.64);
  --pm-photo-border: rgba(129,191,236,.12);
  --bs-primary-rgb: 47, 183, 255;
  background-color: var(--pm-bg);
}

/* Background */
.tj-bg{
  position: fixed;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(circle at top left, rgba(47,183,255,.16), transparent 34%),
    radial-gradient(circle at 85% 12%, rgba(137,225,255,.10), transparent 28%),
    linear-gradient(180deg, var(--pm-bg) 0%, var(--pm-bg-2) 100%);
}
.tj-bg::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 20% 0%, rgba(47,183,255,.12), transparent 22%),
    radial-gradient(circle at 100% 30%, rgba(22,111,173,.12), transparent 26%);
  pointer-events:none;
}
.tj-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background: repeating-linear-gradient(135deg, rgba(255,255,255,.030) 0, rgba(255,255,255,.030) 1px, transparent 1px, transparent 14px);
  opacity:.18;
  mask-image: radial-gradient(circle at 30% 10%, black 0%, transparent 58%);
  pointer-events:none;
}
[data-bs-theme="light"] .tj-bg::after{
  background: repeating-linear-gradient(135deg, rgba(15,20,26,.06) 0, rgba(15,20,26,.06) 1px, transparent 1px, transparent 14px);
  opacity:.12;
}
[data-bs-theme="light"] .tj-bg{
  background: linear-gradient(180deg, #f3f5f8 0%, #eef1f5 100%);
}
[data-bs-theme="light"] .tj-bg::before,
[data-bs-theme="light"] .tj-bg::after{
  content: none;
}

/* MEOS pages: remove blue glow */
.meos-flat .tj-bg{
  background: linear-gradient(180deg, var(--pm-bg) 0%, var(--pm-bg-2) 100%);
}

/* Layout */
.tj-shell{
  min-height: 100vh;
  display: grid;
  /* minmax(0,1fr) voorkomt dat brede content (bv. tabellen) de layout uitrekt */
  grid-template-columns: 300px minmax(0, 1fr);
  align-items: start;
}
@media (max-width: 991.98px){
  .tj-shell{ grid-template-columns: 1fr; }
}

.tj-sidebar{
  background: rgba(45,52,58,.95);
  border-right: 1px solid var(--pm-border);
  width: 300px;
  max-width: 300px;
  min-width: 300px;
  flex: 0 0 300px;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
  align-self: start;
}
[data-bs-theme="light"] .tj-sidebar{
  background: rgba(244,247,250,.98);
  border-right: 1px solid var(--pm-border);
}

/* Voorkom dat content de grid uitrekt (o.a. op Management) */
.tj-main{ min-width: 0; }
.tj-content{ min-width: 0; }

.tj-sidebar-top{
  border-bottom: 1px solid var(--pm-border-2);
  padding: .7rem .85rem .75rem !important;
  display: flex;
  flex-direction: column;
  gap: .55rem;
}
.tj-sidebar-brand{ align-self: flex-start; }
.tj-sidebar-brand .tj-brand-mark{ width: 24px; height: 24px; font-size: .72rem; }
.tj-sidebar-brand .tj-brand-text{ font-size: .92rem; letter-spacing: .02em; font-weight: 700; }

.tj-brand{ display:inline-flex; align-items:center; gap:.65rem; text-decoration:none; color:inherit; }
.tj-brand:hover{ opacity: .95; }
.tj-brand-mark{
  width: 20px; height: 20px;
  display: inline-grid; place-items: center;
  border-radius: 999px;
  background: rgba(45,147,255,.18);
  border: 1px solid rgba(45,147,255,.35);
  color: #cfe9ff;
  font-weight: 800;
  font-size: .68rem;
}
.tj-brand-text{ font-weight: 800; letter-spacing: .2px; font-size: .88rem; color: var(--pm-brand-color); }
.tj-brand-logo{
  width: 38px;
  height: 38px;
  display: block;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid rgba(137,225,255,.18);
  background: rgba(7,16,25,.55);
  box-shadow: 0 10px 18px rgba(3,10,18,.24);
}
.tj-brand-logo--sidebar{
  width: 42px;
  height: 42px;
}

.tj-user{
  padding: .65rem .7rem;
  border-radius: var(--pm-radius-lg);
  background: var(--pm-surface);
  border: 1px solid var(--pm-border-2);
}
.tj-user-row{ display:flex; align-items:center; gap:.75rem; }
.tj-avatar{
  width: 26px; height: 26px;
  border-radius: 999px;
  display:inline-grid; place-items:center;
  background: var(--pm-avatar-bg);
  border: 1px solid var(--pm-avatar-border);
  font-weight: 800;
  color: var(--pm-avatar-text);
  flex: 0 0 auto;
}
.tj-avatar img{
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 999px;
  object-fit: cover;
}
.tj-user-name{ font-weight: 800; line-height: 1.1; font-size: .82rem; }
.tj-user-sub{ font-size: .68rem; color: var(--pm-muted); margin-top: .05rem; }

.tj-user.tj-sidebar-user{
  padding: .05rem 0 .35rem;
  background: transparent;
  border: 0;
  border-radius: 0;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.tj-sidebar-avatar{
  width: 54px;
  height: 54px;
  font-size: 1rem;
  margin: .05rem auto .35rem;
  box-shadow: 0 10px 16px rgba(0,0,0,.26);
}
.tj-sidebar-user .tj-user-name{
  text-transform: none;
  letter-spacing: 0;
  font-size: .85rem;
  font-weight: 700;
}
.tj-sidebar-user .tj-user-sub{
  font-size: .7rem;
  color: var(--pm-muted-2);
}

/* Navigation */
.tj-nav{ display:grid; gap:.14rem; }
.tj-nav-heading{
  padding: .4rem .55rem .1rem;
  font-size: .58rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--pm-muted-2);
}

.tj-nav-link,
.tj-nav-sublink{
  display:flex;
  align-items:center;
  gap:.55rem;
  padding: .30rem .5rem;
  border-radius: 8px;
  text-decoration:none;
  color: var(--pm-muted);
  border: 1px solid transparent;
  transition: background .12s ease, border-color .12s ease, color .12s ease;
  font-size: .82rem;
}
.tj-nav-link i,
.tj-nav-sublink i{ width: 1.05rem; text-align:center; opacity:.95; font-size: .9rem; }
.tj-nav-link:hover,
.tj-nav-sublink:hover{ background: rgba(255,255,255,.06); color:#fff; }
.tj-nav-link.active,
.tj-nav-sublink.active{
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.14);
  color:#fff;
}

.tj-nav-group{
  border-radius: 10px;
  border: 1px solid var(--pm-border-2);
  background: var(--pm-surface);
  overflow:hidden;
}
.tj-nav-group-title{
  display:flex; align-items:center; gap:.7rem;
  padding: .60rem .75rem;
  font-weight: 800;
  color: var(--pm-text);
}
.tj-nav-group-title.active{ color:#fff; }
.tj-nav-group-links{ padding: .15rem .25rem .35rem; display:grid; gap:.2rem; }
.tj-nav-sublink{ padding: .32rem .5rem; border-radius: 8px; }

.tj-sidebar-bottom{
  border-top: 1px solid var(--pm-border-2);
  padding: .25rem .5rem !important;
}
.tj-sidebar-bottom .btn{
  padding: .3rem .5rem;
  font-size: .78rem;
}
.tj-sidebar-bottom .btn i{ font-size: .86rem; }

/* Sidebar nav (flat list like reference) */
.tj-sidebar .tj-nav-group{
  border: 0;
  background: transparent;
  border-radius: 0;
}
.tj-sidebar .tj-nav-group-title{ display:none; }
.tj-sidebar .tj-nav-group-links{ padding: 0; gap: .1rem; }
.tj-sidebar .tj-nav-link,
.tj-sidebar .tj-nav-sublink{
  border: 0;
  background: transparent;
  border-radius: 6px;
  color: rgba(231,237,243,.70);
}
.tj-sidebar .tj-nav-link,
.tj-sidebar .tj-nav-sublink{ padding: .30rem .5rem; }
.tj-sidebar .tj-nav-link:hover,
.tj-sidebar .tj-nav-sublink:hover{
  background: transparent;
  color:#fff;
}
.tj-sidebar .tj-nav-link.active,
.tj-sidebar .tj-nav-sublink.active{
  background: transparent;
  border: 0;
  color:#fff;
  font-weight: 700;
}
[data-bs-theme="light"] .tj-sidebar .tj-nav-link,
[data-bs-theme="light"] .tj-sidebar .tj-nav-sublink{
  color: rgba(15,20,26,.70);
}
[data-bs-theme="light"] .tj-sidebar .tj-nav-link:hover,
[data-bs-theme="light"] .tj-sidebar .tj-nav-sublink:hover{
  color: rgba(15,20,26,.92);
}
[data-bs-theme="light"] .tj-sidebar .tj-nav-link.active,
[data-bs-theme="light"] .tj-sidebar .tj-nav-sublink.active{
  color: rgba(15,20,26,.95);
}

/* Main */
.tj-main{ min-width: 0; }
.tj-topbar{
  position: sticky;
  top: 0;
  z-index: 1030;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: .35rem .6rem;
  background: rgba(31,35,38,.92);
  border-bottom: 1px solid var(--pm-border);
  min-height: 44px;
}
[data-bs-theme="light"] .tj-topbar{
  background: rgba(255,255,255,.92);
}

/* Topbar user pill (right side) */
.tj-user-pill{
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  text-align: left;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
  color: rgba(231,237,243,.92);
  padding: .42rem .70rem;
  font-weight: 700;
}
.tj-user-pill:hover{ background: rgba(255,255,255,.08); color:#fff; }
.tj-user-pill-text{ display:flex; flex-direction: column; min-width: 0; }
.tj-user-pill-line{ display:flex; align-items: center; gap:.35rem; min-width: 0; }
.tj-user-pill-sub{
  font-size: .68rem;
  color: var(--pm-muted);
  line-height: 1.1;
  max-width: 32ch;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tj-user-pill-name{
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tj-user-pill-chevron{
  opacity: .65;
  transition: transform .15s ease, opacity .15s ease;
}
.pm-dropdown-toggle[aria-expanded="true"] .tj-user-pill-chevron{
  transform: rotate(180deg);
  opacity: .85;
}
.tj-user-pill-tag{ color: rgba(231,237,243,.68); margin-right:.25rem; }
[data-bs-theme="dark"] .tj-user-pill-name{ color: rgba(231,237,243,.95); }
[data-bs-theme="light"] .tj-user-pill{
  border: 1px solid rgba(15,20,26,.12);
  background: rgba(15,20,26,.04);
  color: rgba(15,20,26,.92);
}
[data-bs-theme="light"] .tj-user-pill:hover{
  background: rgba(15,20,26,.08);
  color: rgba(15,20,26,.92);
}
[data-bs-theme="light"] .tj-user-pill-tag{
  color: rgba(15,20,26,.60);
}
[data-bs-theme="light"] .tj-user-pill-name{
  color: rgba(15,20,26,.92);
}
[data-bs-theme="light"] .tj-user-pill-sub{ color: rgba(15,20,26,.65); }

/* Topbar profile dropdown (pm-dropdown) */
.pm-dropdown-user{
  display:flex;
  align-items:center;
  gap: .65rem;
  padding: .25rem .25rem .5rem;
}
.pm-dropdown-user-name{ font-weight: 800; line-height: 1.1; }
.pm-dropdown-user-sub{ font-size: .75rem; color: var(--pm-muted); line-height: 1.15; }
[data-bs-theme="light"] .pm-dropdown-user-sub{ color: rgba(15,20,26,.65); }

/* Profile menu items should look like dropdown rows, not browser-styled buttons.
   Note: menu is portaled to <body> while open, so target by a stable class. */
.pm-dropdown-menu--user .pm-dropdown-item{
  appearance: none;
  -webkit-appearance: none;
  border: 0 !important;
  background: transparent !important;
  font: inherit;
  line-height: 1.2;
  width: 100%;
  text-align: left;
  display: flex !important;
  align-items: center;
  gap: .55rem;
}
.pm-dropdown-menu--user .pm-dropdown-item .bi{
  width: 1.05rem;
  opacity: .9;
  flex: 0 0 auto;
}
.pm-dropdown-menu--user .pm-dropdown-item:focus-visible{
  outline: none;
  box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), .22);
}

.tj-dd{
  border-radius: var(--pm-radius-lg);
  overflow:hidden;
}
[data-bs-theme="dark"] .tj-dd{
  background: var(--pm-panel);
  border: 1px solid var(--pm-border);
}
[data-bs-theme="dark"] .tj-dd .dropdown-item{ 
  color: var(--pm-text);
}
[data-bs-theme="dark"] .tj-dd .dropdown-item:hover{ 
  background: rgba(255,255,255,.08);
  color: #fff;
}
[data-bs-theme="light"] .tj-dd{
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
}
[data-bs-theme="light"] .tj-dd .dropdown-item{ 
  color: #212529;
}
[data-bs-theme="light"] .tj-dd .dropdown-item:hover{ 
  background: #f8f9fa;
  color: #000;
}

/* Override Bootstrap default dropdown-menu for dark theme - ALL dropdowns */
[data-bs-theme="dark"] .dropdown-menu,
[data-bs-theme="dark"] .dropdown-menu.show {
  background: var(--pm-panel) !important;
  background-color: var(--pm-panel) !important;
  border: 1px solid var(--pm-border) !important;
  border-color: var(--pm-border) !important;
  box-shadow: var(--pm-shadow) !important;
  padding: 0.5rem !important;
  border-radius: var(--pm-radius) !important;
}

[data-bs-theme="dark"] .dropdown-item,
[data-bs-theme="dark"] .dropdown-item.show {
  color: var(--pm-text) !important;
  border-radius: 6px;
  padding: 0.5rem 0.75rem;
  transition: all 0.15s ease;
}

[data-bs-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:focus,
[data-bs-theme="dark"] .dropdown-item.show:hover,
[data-bs-theme="dark"] .dropdown-item.show:focus {
  background: rgba(255,255,255,.08) !important;
  background-color: rgba(255,255,255,.08) !important;
  color: #fff !important;
}

[data-bs-theme="dark"] .dropdown-item.active,
[data-bs-theme="dark"] .dropdown-item:active,
[data-bs-theme="dark"] .dropdown-item.show.active,
[data-bs-theme="dark"] .dropdown-item.show:active {
  background: var(--pm-accent) !important;
  background-color: var(--pm-accent) !important;
  color: #fff !important;
}

[data-bs-theme="dark"] .dropdown-item.active:hover,
[data-bs-theme="dark"] .dropdown-item:active:hover,
[data-bs-theme="dark"] .dropdown-item.show.active:hover,
[data-bs-theme="dark"] .dropdown-item.show:active:hover {
  background: var(--pm-accent-2) !important;
  background-color: var(--pm-accent-2) !important;
  color: #fff !important;
}

[data-bs-theme="dark"] .dropdown-item:disabled,
[data-bs-theme="dark"] .dropdown-item.show:disabled {
  opacity: .4 !important;
  cursor: not-allowed;
  color: var(--pm-muted-2) !important;
}

[data-bs-theme="dark"] .dropdown-header,
[data-bs-theme="dark"] .pm-dropdown-header {
  color: var(--pm-muted) !important;
  padding: 0.35rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

[data-bs-theme="dark"] .dropdown-divider,
[data-bs-theme="dark"] .pm-dropdown-divider {
  border-top: 1px solid var(--pm-border) !important;
  border-top-color: var(--pm-border) !important;
  margin: 0.5rem 0;
  opacity: 1 !important;
}
[data-bs-theme="dark"] .tj-dd .dropdown-divider{ border-top-color: var(--pm-border-2); }

/* Light theme for ALL dropdowns */
[data-bs-theme="light"] .dropdown-menu,
[data-bs-theme="light"] .dropdown-menu.show {
  background: #fff !important;
  background-color: #fff !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  border-color: rgba(0,0,0,.12) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.08) !important;
  padding: 0.5rem !important;
  border-radius: 10px !important;
}

[data-bs-theme="light"] .dropdown-item,
[data-bs-theme="light"] .dropdown-item.show {
  color: #212529 !important;
  border-radius: 6px;
  padding: 0.5rem 0.75rem;
  transition: all 0.15s ease;
}

[data-bs-theme="light"] .dropdown-item:hover,
[data-bs-theme="light"] .dropdown-item:focus,
[data-bs-theme="light"] .dropdown-item.show:hover,
[data-bs-theme="light"] .dropdown-item.show:focus {
  background: #f8f9fa !important;
  background-color: #f8f9fa !important;
  color: #000 !important;
}

[data-bs-theme="light"] .dropdown-item.active,
[data-bs-theme="light"] .dropdown-item:active,
[data-bs-theme="light"] .dropdown-item.show.active,
[data-bs-theme="light"] .dropdown-item.show:active {
  background: #0a67c6 !important;
  background-color: #0a67c6 !important;
  color: #fff !important;
}

[data-bs-theme="light"] .dropdown-item.active:hover,
[data-bs-theme="light"] .dropdown-item:active:hover,
[data-bs-theme="light"] .dropdown-item.show.active:hover,
[data-bs-theme="light"] .dropdown-item.show:active:hover {
  background: #074c94 !important;
  background-color: #074c94 !important;
  color: #fff !important;
}

[data-bs-theme="light"] .dropdown-item:disabled,
[data-bs-theme="light"] .dropdown-item.show:disabled {
  opacity: .5 !important;
  cursor: not-allowed;
  color: #6c757d !important;
}

[data-bs-theme="light"] .dropdown-header,
[data-bs-theme="light"] .pm-dropdown-header {
  color: #6c757d !important;
  padding: 0.35rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

[data-bs-theme="light"] .dropdown-divider,
[data-bs-theme="light"] .pm-dropdown-divider {
  border-top: 1px solid rgba(0,0,0,.1) !important;
  border-top-color: rgba(0,0,0,.1) !important;
  margin: 0.5rem 0;
  opacity: 1 !important;
}



.tj-top-title{ display:flex; align-items:center; gap:.75rem; }

/* Custom dropdown (select -> custom dropdown) theme rules */
.custom-dropdown-wrapper{ 
  width:100%;
  position: relative;
}
.custom-dropdown-wrapper.custom-dropdown-wide .custom-dropdown-menu{
  max-height: 520px;
}
.custom-dropdown-wrapper.custom-dropdown-wide .custom-dropdown-item{
  white-space: normal;
  line-height: 1.3;
}
.pm-dropdown{
  position: relative;
}
.custom-dropdown-wrapper .custom-dropdown-btn{
  width:100%;
  text-align:left;
  display:inline-flex;
  align-items:center;
  gap:.5rem;
}
.custom-dropdown-wrapper .custom-dropdown-btn .dropdown-text{ 
  flex:1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.custom-dropdown-menu,
.pm-dropdown-menu{ 
  padding: 0.5rem;
  border-radius: var(--pm-radius);
}
.custom-dropdown-menu a,
.custom-dropdown-menu .custom-dropdown-item,
.pm-dropdown-menu a,
.pm-dropdown-menu .pm-dropdown-item{ 
  display:block;
  text-decoration:none;
  color:inherit;
}
.custom-dropdown-item,
.pm-dropdown-item{ 
  border-radius: 6px;
  padding: 0.5rem 0.75rem;
  cursor: pointer;
  transition: all 0.15s ease;
}

/* Dark theme for custom dropdowns */
[data-bs-theme="dark"] .custom-dropdown-menu,
[data-bs-theme="dark"] .custom-dropdown-menu.show,
[data-bs-theme="dark"] .pm-dropdown-menu,
[data-bs-theme="dark"] .pm-dropdown-menu.show {
  background: var(--pm-panel) !important;
  background-color: var(--pm-panel) !important;
  border: 1px solid var(--pm-border) !important;
  border-color: var(--pm-border) !important;
  box-shadow: var(--pm-shadow) !important;
  padding: 0.5rem !important;
  color: var(--pm-text) !important;
}

[data-bs-theme="dark"] .custom-dropdown-item,
[data-bs-theme="dark"] .custom-dropdown-menu a,
[data-bs-theme="dark"] .pm-dropdown-item,
[data-bs-theme="dark"] .pm-dropdown-menu a{
  color: var(--pm-text) !important;
  background-color: transparent !important;
}

[data-bs-theme="dark"] .custom-dropdown-item:hover,
[data-bs-theme="dark"] .custom-dropdown-item:focus,
[data-bs-theme="dark"] .pm-dropdown-item:hover,
[data-bs-theme="dark"] .pm-dropdown-item:focus {
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
}

[data-bs-theme="dark"] .custom-dropdown-item.active,
[data-bs-theme="dark"] .custom-dropdown-item:active,
[data-bs-theme="dark"] .pm-dropdown-item.active,
[data-bs-theme="dark"] .pm-dropdown-item:active {
  background: var(--pm-accent) !important;
  color: #fff !important;
}

[data-bs-theme="dark"] .custom-dropdown-item.active:hover,
[data-bs-theme="dark"] .pm-dropdown-item.active:hover {
  background: var(--pm-accent-2) !important;
  color: #fff !important;
}

/* Light theme for custom dropdowns */
[data-bs-theme="light"] .custom-dropdown-menu,
[data-bs-theme="light"] .custom-dropdown-menu.show,
[data-bs-theme="light"] .pm-dropdown-menu,
[data-bs-theme="light"] .pm-dropdown-menu.show {
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.08) !important;
  padding: 0.5rem !important;
  color: #212529 !important;
}

[data-bs-theme="light"] .custom-dropdown-item,
[data-bs-theme="light"] .custom-dropdown-menu a,
[data-bs-theme="light"] .pm-dropdown-item,
[data-bs-theme="light"] .pm-dropdown-menu a{
  color: #212529 !important;
  background-color: transparent !important;
}

[data-bs-theme="light"] .custom-dropdown-item:hover,
[data-bs-theme="light"] .custom-dropdown-item:focus,
[data-bs-theme="light"] .pm-dropdown-item:hover,
[data-bs-theme="light"] .pm-dropdown-item:focus {
  background: #f8f9fa !important;
  color: #000 !important;
}

[data-bs-theme="light"] .custom-dropdown-item.active,
[data-bs-theme="light"] .custom-dropdown-item:active,
[data-bs-theme="light"] .pm-dropdown-item.active,
[data-bs-theme="light"] .pm-dropdown-item:active {
  background: #0a67c6 !important;
  color: #fff !important;
}

[data-bs-theme="light"] .custom-dropdown-item.active:hover,
[data-bs-theme="light"] .pm-dropdown-item.active:hover {
  background: #074c94 !important;
  color: #fff !important;
}
.tj-top-page{
  font-weight: 800;
  font-size: .92rem;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 60vw;
}
@media (max-width: 575.98px){
  .tj-top-page{ max-width: 55vw; }
}

.tj-content{ min-width: 0; }
.tj-content{ max-width: 1420px; margin-inline: auto; }

/* Offcanvas */
.tj-offcanvas{
  background: rgba(45,52,58,.98);
  color: var(--pm-text);
  border-right: 1px solid var(--pm-border);
}
[data-bs-theme="light"] .tj-offcanvas{
  background: rgba(255,255,255,.98);
  color: var(--pm-text);
  border-right: 1px solid var(--pm-border);
}

/* Auth layout */
.tj-authbar{
  border-bottom: 1px solid var(--pm-border);
  background: rgba(31,35,38,.92);
}
[data-bs-theme="light"] .tj-authbar{
  background: rgba(255,255,255,.92);
}
[data-bs-theme="dark"] .tj-sidebar,
[data-bs-theme="dark"] .tj-offcanvas{
  background: rgba(10,19,29,.96);
  backdrop-filter: blur(18px);
}
[data-bs-theme="dark"] .tj-topbar,
[data-bs-theme="dark"] .tj-authbar{
  background: rgba(7,16,25,.82);
  backdrop-filter: blur(18px);
}
[data-bs-theme="dark"] .tj-brand-mark{
  background: rgba(47,183,255,.16);
  border-color: rgba(47,183,255,.34);
  color: #d4f7ff;
}
[data-bs-theme="dark"] .tj-user-pill{
  border-color: var(--pm-border);
  background: rgba(10,19,29,.56);
  color: var(--pm-text);
}
[data-bs-theme="dark"] .tj-user-pill:hover{
  background: rgba(18,36,52,.78);
  color: #fff;
}
.tj-auth-main{ max-width: 980px; }
.tj-auth-main.tj-auth-main-wide{ max-width: 1220px; }
 
.tj-auth-wrap{ display:grid; grid-template-columns: 1fr; gap: 1.25rem; align-items:start; }
@media (min-width: 992px){
  .tj-auth-wrap{ grid-template-columns: 460px minmax(0, 1fr); gap: 1.75rem; }
}
.tj-auth-wrap.tj-auth-wrap--single{
  display:block;
}
.tj-auth-wrap.tj-auth-wrap--single .pm-auth-center{
  min-height: calc(100vh - 88px);
  align-items:center;
  justify-content:center;
  padding: 1.25rem 0;
}
.tj-auth-wrap.tj-auth-wrap--single .pm-login{
  max-width: 520px;
}

.tj-login-card{ overflow:hidden; }
.tj-login-head{ display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.tj-login-kicker{ font-size:.72rem; letter-spacing:.14em; color: var(--pm-muted-2); font-weight:800; text-transform:uppercase; }
.tj-login-stripe{ height: 10px; flex: 1 0 160px; border-radius: 999px; background: linear-gradient(90deg, transparent 0%, rgba(45,147,255,.80) 45%, transparent 100%); opacity:.85; }
.tj-login-hint{ color: var(--pm-muted); }

.tj-auth-side{ border-radius: var(--pm-radius-lg); border: 1px solid var(--pm-border); background: var(--pm-surface-3); box-shadow: var(--pm-shadow-soft); overflow:hidden; }
.tj-auth-side-inner{ padding: 2.25rem; height:100%; }
.tj-hero-title{ font-size: 2rem; font-weight: 900; }
.tj-hero-sub{ color: var(--pm-muted); max-width: 46ch; margin-top: .35rem; }
.tj-hero-points{ display:grid; gap:.7rem; }
.tj-point{ display:flex; align-items:center; gap:.7rem; padding:.75rem .9rem; border-radius: 10px; border:1px solid var(--pm-border-2); background: var(--pm-surface-3); }
.tj-point i{ color: var(--pm-text); }

/* Buttons */
.btn{ border-radius: 8px; }
.btn,
.card,
.section-card,
.tj-nav-link,
.tj-nav-sublink,
.tj-user-pill,
.tj-btn-ghost,
.tj-btn-danger,
.form-control,
.form-select,
.table tbody tr,
.pm-login,
.tj-auth-side{
  transition:
    transform .18s ease,
    border-color .18s ease,
    background-color .18s ease,
    box-shadow .18s ease,
    color .18s ease,
    opacity .18s ease;
}

.tj-btn-ghost{
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
  color: rgba(231,237,243,.90);
}
.tj-btn-ghost:hover{ background: rgba(255,255,255,.08); color:#fff; }
[data-bs-theme="light"] .tj-btn-ghost{
  border: 1px solid rgba(15,20,26,.12);
  background: rgba(15,20,26,.04);
  color: rgba(15,20,26,.88);
}
[data-bs-theme="light"] .tj-btn-ghost:hover{
  background: rgba(15,20,26,.08);
  color: rgba(15,20,26,.95);
}

.tj-btn-danger{
  border-radius: 8px;
  border: 1px solid rgba(220,53,69,.40);
  background: rgba(220,53,69,.16);
  color: rgba(255,255,255,.92);
}
.tj-btn-danger:hover{ background: rgba(220,53,69,.22); color:#fff; }

.btn.is-loading{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  cursor: progress;
}
.tj-btn-spinner{
  width: .95rem;
  height: .95rem;
  display: inline-block;
  border-radius: 999px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  animation: tj-spin .7s linear infinite;
}
.tj-btn-loading-text{
  display: inline-flex;
  align-items: center;
}
@keyframes tj-spin{
  to{ transform: rotate(360deg); }
}

.btn-icon{ width: 34px; height: 34px; padding:0; display:inline-grid; place-items:center; }
.btn-sm.btn-icon{ width: 30px; height: 30px; }

.btn-primary{
  --bs-btn-bg: var(--pm-accent);
  --bs-btn-border-color: rgba(45,147,255,.65);
  --bs-btn-hover-bg: #3aa0ff;
  --bs-btn-hover-border-color: #3aa0ff;
  --bs-btn-active-bg: #1f84f6;
  --bs-btn-active-border-color: #1f84f6;
  --bs-btn-color: #fff;
  --bs-btn-hover-color: #fff;
  --bs-btn-active-color: #fff;
  font-weight: 800;
}
[data-bs-theme="light"] .btn-primary{
  --bs-btn-border-color: rgba(10,103,198,.75);
  --bs-btn-hover-bg: #0b73d9;
  --bs-btn-hover-border-color: #0b73d9;
  --bs-btn-active-bg: #095fb3;
  --bs-btn-active-border-color: #095fb3;
  --bs-btn-color: #fff;
  --bs-btn-hover-color: #fff;
  --bs-btn-active-color: #fff;
}

.btn-outline-primary{
  --bs-btn-color: rgba(231,237,243,.92);
  --bs-btn-border-color: rgba(45,147,255,.45);
  --bs-btn-hover-bg: rgba(45,147,255,.18);
  --bs-btn-hover-border-color: rgba(45,147,255,.55);
  --bs-btn-hover-color: #fff;
}
[data-bs-theme="light"] .btn-outline-primary{
  --bs-btn-color: #0a67c6;
  --bs-btn-border-color: rgba(10,103,198,.5);
  --bs-btn-hover-bg: rgba(10,103,198,.12);
  --bs-btn-hover-border-color: rgba(10,103,198,.65);
  --bs-btn-hover-color: #0a67c6;
  --bs-btn-active-bg: rgba(10,103,198,.2);
  --bs-btn-active-border-color: rgba(10,103,198,.7);
  --bs-btn-active-color: #0a67c6;
}

.btn-outline-secondary{
  --bs-btn-color: rgba(231,237,243,.88);
  --bs-btn-border-color: rgba(255,255,255,.22);
  --bs-btn-hover-bg: rgba(255,255,255,.08);
  --bs-btn-hover-border-color: rgba(255,255,255,.32);
  --bs-btn-hover-color: #fff;
}
[data-bs-theme="light"] .btn-outline-secondary{
  --bs-btn-color: rgba(15,20,26,.82);
  --bs-btn-border-color: rgba(15,20,26,.2);
  --bs-btn-hover-bg: rgba(15,20,26,.06);
  --bs-btn-hover-border-color: rgba(15,20,26,.28);
  --bs-btn-hover-color: rgba(15,20,26,.92);
}

/* Cards */
.card{
  border-radius: var(--pm-radius-lg);
  border: 1px solid var(--pm-border);
  background: var(--pm-card-bg);
  box-shadow: var(--pm-shadow-soft);
}
.tj-lift:hover{
  transform: translateY(-2px);
  border-color: rgba(137,225,255,.22);
  box-shadow: 0 18px 38px rgba(2,8,16,.28);
}
.card-header{ background: transparent; border-bottom: 1px solid var(--pm-border-2); }

/* Alerts */
.tj-alert{ border-radius: var(--pm-radius-lg); border: 1px solid var(--pm-border); background: var(--pm-surface); }
.tj-alert{
  position: relative;
  padding-right: 2.9rem;
}
.tj-alert.is-dismissed{
  opacity: 0;
  transform: translateY(-6px);
}
.tj-alert-close{
  position: absolute;
  top: .55rem;
  right: .65rem;
  width: 28px;
  height: 28px;
  display: inline-grid;
  place-items: center;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--pm-muted);
  font-size: 1.2rem;
  line-height: 1;
}
.tj-alert-close:hover{
  background: rgba(255,255,255,.08);
  color: var(--pm-text);
}

/* Forms */
.form-control,
.form-select{
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.14);
  color: var(--pm-text);
}
.form-control::placeholder{ color: var(--pm-muted-2); }
.form-control:focus,
.form-select:focus{
  border-color: rgba(45,147,255,.55);
  box-shadow: 0 0 0 .20rem rgba(45,147,255,.20);
  background: rgba(0,0,0,.18);
}
[data-bs-theme="light"] .form-control,
[data-bs-theme="light"] .form-select{
  border: 1px solid rgba(15,20,26,.18);
  background: #fff;
  color: var(--pm-text);
}
[data-bs-theme="light"] .form-control::placeholder{
  color: rgba(15,20,26,.45);
}
[data-bs-theme="light"] .form-control:focus,
[data-bs-theme="light"] .form-select:focus{
  border-color: rgba(10,103,198,.55);
  box-shadow: 0 0 0 .20rem rgba(10,103,198,.20);
  background: #fff;
}
.input-group-text{
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: rgba(231,237,243,.88);
}
[data-bs-theme="light"] .input-group-text{
  border: 1px solid rgba(15,20,26,.14);
  background: rgba(15,20,26,.04);
  color: rgba(15,20,26,.78);
}

/* App flow */
body{
  scroll-behavior: smooth;
}
body.tj-scrolled .tj-topbar,
body.tj-scrolled .tj-authbar{
  box-shadow: 0 12px 28px rgba(2,8,16,.22);
}
.ux-reveal{
  opacity: 0;
  transform: translateY(18px) scale(.99);
  filter: blur(10px);
  transition:
    opacity .55s ease var(--ux-reveal-delay, 0ms),
    transform .55s ease var(--ux-reveal-delay, 0ms),
    filter .55s ease var(--ux-reveal-delay, 0ms);
}
.ux-reveal.is-visible{
  opacity: 1;
  transform: none;
  filter: none;
}
@media (prefers-reduced-motion: reduce){
  body{ scroll-behavior: auto; }
  .ux-reveal{
    opacity: 1;
    transform: none;
    filter: none;
    transition: none;
  }
}

/* Tables */
.table{ color: inherit; }
.table thead th{
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: .70rem;
  color: var(--pm-table-head-color);
  background: var(--pm-table-head-bg);
  border-bottom: 1px solid var(--pm-card-head-border);
}
.table-hover tbody tr:hover{ background: var(--pm-table-row-hover); }
.table > :not(caption) > * > *{ border-bottom-color: var(--pm-table-border); }

/* MEOS layout */
.meos-page-title{
  text-align: center;
  font-weight: 800;
  font-size: 1.35rem;
  margin: .35rem 0 1rem;
  color: var(--pm-text);
}
.meos-title-icon{
  margin-right: .5rem;
  font-size: 1.15rem;
  color: var(--pm-muted-2);
  vertical-align: -0.1rem;
}
.meos-card{ padding: 0; border-radius: var(--pm-radius-lg); overflow: hidden; }
.meos-card-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .75rem 1rem;
  background: var(--pm-surface-2);
  border-bottom: 1px solid var(--pm-card-head-border);
}
.meos-card-title{ font-weight: 700; }
.meos-head-icon{ color: var(--pm-muted-2); }
.meos-card-body{ padding: 1rem; }
.meos-controls{
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  flex-wrap: wrap;
}
.meos-controls-left{ min-width: 126px; }
.meos-controls-left .meos-per,
.meos-controls-left .custom-dropdown-wrapper,
.meos-controls-left .custom-dropdown-btn{
  width: 126px !important;
}
.meos-controls-right{
  margin-left: auto;
  display: grid;
  gap: .5rem;
}
.meos-controls-right .form-control{ width: 240px; }
.meos-controls-right .input-group{ width: 240px; }
.meos-controls-right .input-group .form-control{ width: 100%; }
.meos-controls .form-control:focus,
.meos-controls .form-select:focus{
  box-shadow: none;
  border-color: var(--pm-border);
}
@media (max-width: 575.98px){
  .meos-controls-right{ width: 100%; }
  .meos-controls-right .form-control{ width: 100%; }
  .meos-controls-right .input-group{ width: 100%; }
}
.meos-table-wrap{ margin-top: .75rem; }
.meos-table{
  border: 1px solid var(--pm-border-2);
  background: var(--pm-card-bg);
}
.meos-table thead th{ background: var(--pm-surface-4); }
.meos-icon-cell{
  width: 34px;
  text-align: center;
  color: rgba(231,237,243,.75);
}
.meos-person-icon{
  font-size: 1rem;
}
.meos-warrant td{
  background: rgba(220,53,69,.16);
}
.meos-warrant .meos-link{
  color: #ff6b6b;
}
.meos-warrant-icon{
  color: #ff4d4f;
}
[data-bs-theme="light"] .meos-icon-cell{
  color: rgba(15,20,26,.55);
}
[data-bs-theme="light"] .meos-warrant td{
  background: rgba(220,53,69,.12);
}
[data-bs-theme="light"] .meos-warrant .meos-link{
  color: #b02a37;
}
.meos-link{
  color: var(--pm-accent-2);
  text-decoration: none;
  font-weight: 600;
}
.meos-link:hover{
  color: var(--bs-link-hover-color);
  text-decoration: none;
}
[data-bs-theme="dark"] .meos-picker-input{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .35rem;
  min-height: 40px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 8px;
  background: rgba(0,0,0,.14);
  padding: .35rem .5rem;
}
[data-bs-theme="dark"] .meos-picker-input:focus-within{
  border-color: rgba(45,147,255,.55);
  box-shadow: 0 0 0 .20rem rgba(45,147,255,.20);
  background: rgba(0,0,0,.18);
}
[data-bs-theme="light"] .meos-picker-input{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .35rem;
  min-height: 40px;
  border: 1px solid rgba(15,20,26,.18);
  border-radius: 8px;
  background: #fff;
  padding: .35rem .5rem;
}
[data-bs-theme="light"] .meos-picker-input:focus-within{
  border-color: rgba(10,103,198,.55);
  box-shadow: 0 0 0 .20rem rgba(10,103,198,.20);
}
.meos-picker-selected{
  display: inline-flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.meos-picker-field{
  flex: 1 1 220px;
  min-width: 160px;
  border: 0;
  outline: 0;
  background: transparent;
  color: inherit;
  padding: .1rem .15rem;
}
.meos-picker-field:focus{
  outline: 0;
}
[data-bs-theme="dark"] .meos-picker-field{
  color: var(--pm-text);
}
[data-bs-theme="light"] .meos-picker-field{
  color: #111;
}
.meos-picker-chip{
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  border-radius: 999px;
  padding: .20rem .55rem;
  background: #2d93ff;
  border: 1px solid rgba(255,255,255,.22);
  color: #fff;
  font-size: .82rem;
  line-height: 1.2;
  font-weight: 600;
}
.meos-picker-chip-remove{
  border: 0;
  background: transparent;
  color: #fff;
  line-height: 1;
  font-size: .95rem;
  cursor: pointer;
  padding: 0;
}
.meos-picker-chip-remove:hover{
  opacity: .85;
}
[data-bs-theme="dark"] .meos-report-create-btn{
  color: #ffffff !important;
}
[data-bs-theme="dark"] .meos-report-create-btn:hover,
[data-bs-theme="dark"] .meos-report-create-btn:focus,
[data-bs-theme="dark"] .meos-report-create-btn:active{
  color: #ffffff !important;
}
.meos-footer{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: .75rem;
  flex-wrap: wrap;
}
.meos-page-info{ color: var(--pm-muted); font-size: .85rem; }
.meos-color{
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}
.meos-color-swatch{
  width: 18px;
  height: 18px;
  border-radius: 4px;
  border: 1px solid var(--pm-border);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
  flex: 0 0 auto;
}
[data-bs-theme="light"] .meos-color-swatch{
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.2);
}

/* Helper styles */
.training-canceled{ text-decoration: line-through; opacity:.7; }
.training-check-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: .35rem .75rem;
}
.training-check-grid .form-check{ margin: 0; }
@media (max-width: 991.98px){
  .training-check-grid{ grid-template-columns: 1fr; }
}
.training-shell{
  border-color: var(--pm-card-border);
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  min-height: calc(100vh - 130px);
  display: flex;
  flex-direction: column;
}
.training-kpi-row{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .65rem;
}
.training-kpi{
  border: 1px solid var(--pm-card-border);
  border-radius: 10px;
  padding: .65rem .75rem;
  background: rgba(0,0,0,.10);
}
.training-kpi-label{
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--pm-muted-2);
}
.training-kpi-value{
  margin-top: .2rem;
  font-size: 1.25rem;
  font-weight: 900;
  line-height: 1.05;
}
.training-service-badge .badge{
  font-weight: 700;
  letter-spacing: .02em;
}
.training-panel{
  border-color: var(--pm-card-border);
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.training-panel .section-head .title{
  font-size: .95rem;
  letter-spacing: .02em;
}
.training-panel-body{
  padding-top: .85rem;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.training-session-form{
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.training-table-wrap{
  flex: 1 1 auto;
  min-height: 280px;
  overflow-y: auto;
}
.training-session-footer{
  margin-top: auto !important;
  padding-top: .75rem;
}
.training-search-grid{
  display: grid;
  grid-template-columns: 220px 1fr 320px 280px;
  gap: .75rem;
  align-items: end;
}
.training-field .form-label{
  margin-bottom: .25rem;
  font-size: .8rem;
  letter-spacing: .02em;
  color: var(--pm-muted-2);
}
.training-search-help{
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: .55rem .7rem;
  border: 1px dashed var(--pm-border-2);
  border-radius: 10px;
  background: rgba(255,255,255,.02);
}
.training-inline-actions{
  gap: .45rem;
}
.training-inline-actions form{
  margin: 0;
}
.training-empty{
  border: 1px dashed var(--pm-border-2);
  border-radius: 10px;
  padding: .8rem .9rem;
  background: rgba(255,255,255,.015);
}
.training-table thead th{
  font-size: .74rem;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.training-session-toolbar{
  display: grid;
  grid-template-columns: 1fr;
  gap: .75rem;
}
.training-session-card{
  border: 1px solid var(--pm-border-2);
  border-radius: 12px;
  padding: .75rem;
  background: rgba(0,0,0,.12);
}
.training-session-main{
  display: flex;
  flex-direction: column;
}
.training-session-trainers{
  display: flex;
  flex-direction: column;
}
.training-trainer-list{
  display: grid;
  gap: .5rem;
  max-height: 250px;
  overflow: auto;
  padding-right: .1rem;
}
.training-trainer-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
  padding: .55rem .65rem;
  border: 1px solid var(--pm-border-2);
  border-radius: 10px;
  background: rgba(255,255,255,.02);
}
.training-trainer-item.is-self{
  border-color: rgba(45,147,255,.35);
  background: rgba(45,147,255,.09);
}
.training-trainer-meta{
  min-width: 0;
}
.training-trainer-meta .fw-semibold{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.training-session-actions{
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.training-result-toggle{
  display: inline-flex;
  gap: .35rem;
  align-items: center;
}
.training-result-btn{
  min-width: 88px;
  border-width: 1px;
  font-weight: 700;
}
.training-result-btn.is-pass{
  color: #7be6a9;
  border-color: rgba(40,167,69,.45);
  background: rgba(40,167,69,.12);
}
.training-result-btn.is-pass.active{
  color: #04170d;
  border-color: rgba(40,167,69,.95);
  background: rgba(84,214,120,.95);
}
.training-result-btn.is-fail{
  color: #ffb8b8;
  border-color: rgba(220,53,69,.45);
  background: rgba(220,53,69,.12);
}
.training-result-btn.is-fail.active{
  color: #220808;
  border-color: rgba(220,53,69,.95);
  background: rgba(255,107,107,.96);
}
.training-row-trainer td{
  background: rgba(45,147,255,.07);
}
.training-row-separator td{
  background: rgba(255,255,255,.03);
  color: var(--pm-muted-2);
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 700;
}
.training-bulk-actions{
  margin-top: .75rem;
  display: flex;
  justify-content: flex-end;
  gap: .5rem;
}
[data-bs-theme="light"] .training-shell{
  background: #fff;
}
[data-bs-theme="light"] .training-kpi{
  background: rgba(15,20,26,.03);
}
[data-bs-theme="light"] .training-search-help,
[data-bs-theme="light"] .training-empty{
  background: rgba(15,20,26,.02);
}
[data-bs-theme="light"] .training-session-card{
  background: rgba(15,20,26,.03);
}
[data-bs-theme="light"] .training-trainer-item{
  background: #fff;
}
[data-bs-theme="light"] .training-trainer-item.is-self{
  background: rgba(45,147,255,.08);
}
[data-bs-theme="light"] .training-result-btn.is-pass{
  color: #1f6d3d;
}
[data-bs-theme="light"] .training-result-btn.is-fail{
  color: #9f2632;
}
[data-bs-theme="light"] .training-row-trainer td{
  background: rgba(45,147,255,.08);
}
[data-bs-theme="light"] .training-row-separator td{
  background: rgba(15,20,26,.03);
}
@media (max-width: 1399.98px){
  .training-kpi-row{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .training-search-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 991.98px){
  .training-shell{
    min-height: 0;
  }
  .training-panel{
    min-height: 0;
  }
  .training-table-wrap{
    min-height: 0;
  }
  .training-session-toolbar{
    grid-template-columns: 1fr;
  }
}
@media (max-width: 575.98px){
  .training-kpi-row{
    grid-template-columns: 1fr;
  }
  .training-search-grid{
    grid-template-columns: 1fr;
  }
  .training-result-toggle{
    flex-wrap: wrap;
  }
  .training-result-btn{
    min-width: 76px;
  }
}
.badge-soft{ background: var(--pm-surface-3); border:1px solid var(--pm-border-2); }
.badge-chip{ padding:.18rem .50rem; border-radius:999px; background:rgba(45,147,255,.14); border:1px solid rgba(45,147,255,.28); font-size:.75rem; color:#d8efff; }
.badge-remaining{ background: rgba(45,147,255,.14); border:1px solid rgba(45,147,255,.28); }
.badge-expired{ background: rgba(220,53,69,.15); border:1px solid rgba(220,53,69,.35); }

.kv-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:.5rem 1rem; }
@media (max-width: 575.98px){ .kv-grid{ grid-template-columns: 1fr; } }
.kv{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding:.42rem .8rem; border-bottom:1px solid var(--pm-border-2); }
.kv:last-child{ border-bottom:0; }
.kv .k{ color: var(--pm-muted); flex: 0 0 auto; }
.kv .v{
  flex: 1 1 auto;
  min-width: 0;
  text-align:right;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.kv .v code{
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-all;
}
.vehicle-info-grid .kv{
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: .35rem;
}
.vehicle-info-grid .kv .v{
  text-align: left;
  white-space: normal;
}
.vehicle-info-grid .meos-color{
  flex-wrap: wrap;
  row-gap: .25rem;
}

/* KPI cards (used on vehicle page) */
.kpi-row{ display:flex; flex-wrap:wrap; gap:.75rem; align-items:stretch; }
.kpi{ flex: 1 1 260px; display:flex; align-items:center; gap:.75rem; padding:.75rem .95rem; border:1px solid var(--pm-card-border); border-radius:var(--pm-radius-lg); background: var(--pm-surface); }
.kpi .ic{ font-size:1.25rem; opacity:.92; }
.kpi .label{ font-size:.72rem; color: var(--pm-muted-2); text-transform:uppercase; letter-spacing:.12em; }
.kpi .num{ font-size:1.55rem; font-weight:900; }
@media (max-width: 575.98px){ .kpi{ flex-basis:100%; } .kpi .num{ font-size: 1.25rem; } }

/* Stat cards (like screenshot: icon left, number right-aligned) */
.pm-stat-row{ display:flex; flex-wrap:wrap; gap:.75rem; }
.pm-stat{
  flex: 1 1 240px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  padding: .70rem .90rem;
  border: 1px solid var(--pm-card-border);
  border-radius: var(--pm-radius-lg);
  background: var(--pm-stat-bg);
  box-shadow: var(--pm-shadow-soft);
}
.pm-stat .ic{ font-size: 1.15rem; opacity:.9; }
.pm-stat .label{ font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color: var(--pm-muted-2); text-align:right; }
.pm-stat .num{ font-size: 1.15rem; font-weight: 900; text-align:right; }
@media (max-width: 575.98px){ .pm-stat{ flex-basis:100%; } }

/* Section cards */
.section-card{
  border: 1px solid var(--pm-card-border);
  background: var(--pm-card-bg);
  overflow: visible;
}
.section-card:hover{
  border-color: rgba(137,225,255,.18);
}
.section-card.section-card-warrant{
  border-color: #dc3545;
  background: #7a0f18;
  box-shadow: none;
}
.section-card.section-card-warrant > .section-head{
  border-bottom-color: #dc3545;
  background: #7a0f18;
}
[data-bs-theme="light"] .section-card.section-card-warrant{
  border-color: #dc3545;
  background: #c62828;
  box-shadow: none;
}
[data-bs-theme="light"] .section-card.section-card-warrant > .section-head{
  border-bottom-color: #dc3545;
  background: #c62828;
}
.section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: .75rem;
  padding: .75rem .95rem;
  border-bottom: 1px solid var(--pm-card-head-border);
  background: var(--pm-card-head-bg);
}
.section-head .title{ font-weight: 900; }
.section-head .actions{ display:flex; align-items:center; gap:.5rem; }

.section-body{ padding: .90rem .95rem 1rem; }

/* When pages forget a section-body wrapper, still keep spacing consistent */
.section-card > .kv-grid{ padding: .85rem .95rem 1rem; }
.section-card > .table-responsive{ padding: .30rem .95rem 1rem; }
.section-card > .records-wrap{ padding: .75rem .95rem 1rem; }
.section-card > .photo-grid{ padding: .85rem .95rem 1rem; }
.section-card > .text-center,
.section-card > .text-muted,
.section-card > .small-muted{ padding: .85rem .95rem 1rem; }
.section-card .table{ margin-bottom: 0; }

/* Page hero / summary */
.tj-page-hero{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  padding: 1.2rem 1.25rem;
  border: 1px solid rgba(137,225,255,.16);
  border-radius: var(--pm-radius-lg);
  background:
    linear-gradient(135deg, rgba(13,27,39,.96) 0%, rgba(18,36,52,.90) 60%, rgba(10,51,80,.74) 100%);
  box-shadow: var(--pm-shadow);
}
.tj-page-hero--single{
  grid-template-columns: minmax(0, 1fr);
}
.tj-page-hero h1{
  margin: 0;
  font-size: clamp(1.45rem, 2.3vw, 2.2rem);
}
.tj-page-kicker{
  margin-bottom: .45rem;
  color: var(--pm-accent-2);
  font-size: .74rem;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.tj-page-summary{
  margin: .65rem 0 0;
  color: var(--pm-muted);
  max-width: 62ch;
}
.tj-page-actions{
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  align-items: flex-start;
  justify-content: flex-end;
}
.tj-meta-row{
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: .9rem;
}
.tj-chip{
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 34px;
  padding: .38rem .7rem;
  border-radius: 999px;
  border: 1px solid var(--pm-border);
  background: rgba(7,16,25,.44);
  color: var(--pm-text);
  font-size: .8rem;
  font-weight: 700;
}
.tj-chip--success{
  border-color: rgba(67,193,131,.34);
  background: rgba(67,193,131,.14);
  color: #bbf3cf;
}
.tj-chip--warn{
  border-color: rgba(255,193,7,.26);
  background: rgba(255,193,7,.10);
  color: #ffe08b;
}
.tj-stat-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem;
  margin-top: 1rem;
}
.tj-stat-card{
  padding: 1rem;
  border: 1px solid var(--pm-card-border);
  border-radius: var(--pm-radius-lg);
  background: linear-gradient(180deg, rgba(19,38,55,.92), rgba(11,23,34,.92));
  box-shadow: var(--pm-shadow-soft);
}
.tj-stat-label{
  color: var(--pm-muted-2);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.tj-stat-value{
  margin-top: .5rem;
  font-size: 1.5rem;
  font-weight: 900;
}
.tj-stat-sub{
  margin-top: .28rem;
  color: var(--pm-muted);
  font-size: .84rem;
}
.tj-list-stack{
  display: grid;
  gap: .8rem;
}
.tj-list-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .9rem;
  padding: .85rem .95rem;
  border: 1px solid var(--pm-border-2);
  border-radius: 12px;
  background: rgba(7,16,25,.30);
}
.tj-list-item strong{
  display: block;
  font-size: .95rem;
}
.tj-list-item small{
  color: var(--pm-muted);
}
.tj-progress{
  width: 100%;
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}
.tj-progress > span{
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--pm-accent), var(--pm-accent-2));
}
.tj-empty-state{
  padding: 1.2rem 1rem;
  text-align: center;
  color: var(--pm-muted);
}
.tj-quick-note{
  padding: .95rem 1rem;
  border: 1px dashed var(--pm-border);
  border-radius: 12px;
  background: rgba(7,16,25,.22);
}
.tj-quick-note strong{
  display: block;
  margin-bottom: .3rem;
}
[data-bs-theme="light"] .tj-page-hero{
  color: var(--pm-text);
  border-color: rgba(15,20,26,.12);
  background: #fff;
  box-shadow: 0 12px 28px rgba(15,20,26,.08);
}
[data-bs-theme="light"] .tj-page-hero h1{
  color: var(--pm-text);
}
[data-bs-theme="light"] .tj-page-kicker{
  color: var(--pm-accent);
}
[data-bs-theme="light"] .tj-page-summary{
  color: var(--pm-muted);
}
[data-bs-theme="light"] .tj-stat-card{
  color: var(--pm-text);
  border-color: rgba(15,20,26,.12);
  background: #fff;
  box-shadow: 0 10px 22px rgba(15,20,26,.08);
}
[data-bs-theme="light"] .tj-stat-label{
  color: rgba(15,20,26,.54);
}
[data-bs-theme="light"] .tj-stat-value{
  color: var(--pm-text);
}
[data-bs-theme="light"] .tj-stat-sub,
[data-bs-theme="light"] .tj-list-item small{
  color: var(--pm-muted);
}
[data-bs-theme="light"] .tj-list-item{
  border-color: rgba(15,20,26,.08);
  background: rgba(15,20,26,.045);
}
[data-bs-theme="light"] .tj-quick-note{
  border-color: rgba(15,20,26,.10);
  background: rgba(15,20,26,.045);
}
[data-bs-theme="light"] .tj-progress{
  background: rgba(15,20,26,.10);
}
@media (max-width: 991.98px){
  .tj-page-hero{
    grid-template-columns: 1fr;
  }
  .tj-page-actions{
    justify-content: flex-start;
  }
}

/* Complaints readability */
.complaint-card{
  border-color: rgba(255,255,255,.18);
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
}
.complaint-body{
  padding: 1rem;
}
.complaint-item{
  border: 1px solid var(--pm-border-2);
  border-radius: 10px;
  padding: .75rem .85rem;
  background: rgba(0,0,0,.10);
}
.complaint-meta{
  display: grid;
  gap: .25rem;
  font-size: .92rem;
}
.complaint-meta strong{
  color: rgba(236,242,248,.95);
}
.complaint-text{
  border: 1px solid var(--pm-border-2);
  border-radius: 8px;
  padding: .55rem .65rem;
  background: rgba(0,0,0,.12);
  font-size: .9rem;
  line-height: 1.45;
}
.complaint-manage-item .section-head{
  align-items: center;
}
.complaint-manage-form .form-label{
  font-size: .8rem;
  letter-spacing: .02em;
  color: var(--pm-muted-2);
  margin-bottom: .2rem;
}
.complaint-overview-table tbody tr.complaint-row-link{
  cursor: pointer;
}
.complaint-overview-table tbody tr.complaint-row-link:hover{
  background: rgba(255,255,255,.04);
}
.complaint-person-link{
  color: inherit;
  text-decoration: underline;
  text-decoration-color: rgba(45,147,255,.45);
  text-underline-offset: 2px;
}
.complaint-person-link:hover{
  text-decoration-color: rgba(45,147,255,.85);
}
[data-bs-theme="light"] .complaint-meta strong{
  color: rgba(15,20,26,.84);
}
[data-bs-theme="light"] .complaint-card{
  border-color: rgba(15,20,26,.16);
  background: #fff;
}
[data-bs-theme="light"] .complaint-item,
[data-bs-theme="light"] .complaint-text{
  background: rgba(15,20,26,.03);
}
[data-bs-theme="light"] .complaint-overview-table tbody tr.complaint-row-link:hover{
  background: rgba(15,20,26,.04);
}

/* List group */
.list-group{
  --bs-list-group-bg: transparent;
  --bs-list-group-color: inherit;
  --bs-list-group-border-color: var(--pm-border-2);
}
.list-group-item{ background: transparent; color: inherit; }

/* Pagination */
.pagination{ gap: .35rem; }
.page-link{ border-radius: 8px; }
[data-bs-theme="dark"] .page-link{
  border-color: rgba(255,255,255,.14);
  background: rgba(0,0,0,.10);
  color: rgba(231,237,243,.86);
}
[data-bs-theme="dark"] .page-link:hover{ background: rgba(255,255,255,.07); color:#fff; }

[data-bs-theme="light"] .page-link{
  border-color: rgba(15,20,26,.14);
  background: rgba(15,20,26,.04);
  color: rgba(15,20,26,.76);
}
[data-bs-theme="light"] .page-link:hover{ background: rgba(15,20,26,.07); color: rgba(15,20,26,.92); }

.page-item.active .page-link{
  background: rgba(45,147,255,.18);
  border-color: rgba(45,147,255,.42);
  color: #fff;
}
.page-item.disabled .page-link{ opacity: .45; }

/* Modal */
.modal-content{ border-radius: var(--pm-radius-lg); }
[data-bs-theme="dark"] .modal-content{
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(35,40,45,.96);
}
[data-bs-theme="dark"] .modal-header{ border-bottom: 1px solid rgba(255,255,255,.10); }
[data-bs-theme="dark"] .modal-footer{ border-top: 1px solid rgba(255,255,255,.10); }

[data-bs-theme="light"] .modal-content{
  border: 1px solid rgba(15,20,26,.12);
  background: rgba(255,255,255,.96);
}
[data-bs-theme="light"] .modal-header{ border-bottom: 1px solid rgba(15,20,26,.10); }
[data-bs-theme="light"] .modal-footer{ border-top: 1px solid rgba(15,20,26,.10); }

.personnel-action-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:.9rem;
}
.personnel-action-btn{
  min-height:92px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:.55rem;
  text-align:left;
  border-radius:14px;
}
.personnel-action-btn i{
  font-size:1.15rem;
}
.personnel-status-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:.9rem;
}
.personnel-status-card{
  border:1px solid var(--pm-border-2);
  border-radius:14px;
  padding:.95rem 1rem;
  background:rgba(255,255,255,.02);
}
.personnel-status-card__label{
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--pm-muted-2);
}
.personnel-status-card__value{
  margin-top:.45rem;
  font-size:1.05rem;
  font-weight:800;
}
.personnel-status-card__sub{
  margin-top:.3rem;
  font-size:.82rem;
  color:var(--pm-muted);
}
.personnel-toggle-list{
  display:flex;
  flex-direction:column;
  gap:.8rem;
}
.personnel-toggle-row{
  border:1px solid var(--pm-border-2);
  border-radius:14px;
  padding:.9rem 1rem;
  background:rgba(255,255,255,.02);
  transition:border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.personnel-toggle-row__label{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  cursor:pointer;
}
.personnel-toggle-row__body{
  display:flex;
  flex-direction:column;
  gap:.15rem;
  min-width:0;
}
.personnel-toggle-row__title{
  font-weight:700;
}
.personnel-toggle-row__sub{
  font-size:.82rem;
  color:var(--pm-muted);
}
.personnel-toggle-row__controls{
  display:flex;
  align-items:center;
  gap:.7rem;
  flex-shrink:0;
}
.personnel-toggle-row__state{
  min-width:28px;
  font-weight:800;
  text-align:right;
}
.personnel-toggle-row__extra{
  margin-top:.8rem;
}
.personnel-toggle-row.is-active{
  border-color:rgba(25,135,84,.40);
  background:rgba(25,135,84,.12);
  box-shadow:0 0 0 1px rgba(25,135,84,.08) inset;
}
.personnel-toggle-row.is-inactive{
  border-color:rgba(220,53,69,.34);
  background:rgba(220,53,69,.10);
  box-shadow:0 0 0 1px rgba(220,53,69,.06) inset;
}
.personnel-discord-current{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
  border:1px solid var(--pm-border-2);
  border-radius:14px;
  padding:.95rem 1rem;
  background:rgba(255,255,255,.02);
}
.personnel-discord-current__identity{
  display:flex;
  align-items:center;
  gap:.85rem;
  min-width:0;
}
.personnel-discord-current__avatar,
.personnel-discord-result__avatar{
  width:52px;
  height:52px;
  border-radius:50%;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
}
.personnel-discord-current__avatar--fallback,
.personnel-discord-result__avatar--fallback{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  color:var(--pm-text);
}
.personnel-discord-results{
  display:flex;
  flex-direction:column;
  gap:.7rem;
  max-height:340px;
  overflow:auto;
}
.personnel-discord-result{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  border:1px solid var(--pm-border-2);
  border-radius:14px;
  background:rgba(255,255,255,.02);
  padding:.8rem .9rem;
  color:inherit;
  text-align:left;
}
.personnel-discord-result:hover{
  background:rgba(255,255,255,.04);
}
.personnel-discord-result:disabled{
  opacity:.7;
  cursor:not-allowed;
}
.personnel-discord-result.is-selected{
  border-color:rgba(61,161,255,.42);
  box-shadow:0 0 0 1px rgba(61,161,255,.14) inset;
}
.personnel-discord-result__main{
  display:flex;
  align-items:center;
  gap:.85rem;
  min-width:0;
}
.personnel-discord-result__title{
  word-break:break-word;
}
.personnel-discord-result__status{
  max-width:180px;
  text-align:right;
}
@media (max-width: 767.98px){
  .personnel-action-grid,
  .personnel-status-grid{
    grid-template-columns:1fr;
  }
  .personnel-toggle-row__label,
  .personnel-discord-result{
    align-items:flex-start;
  }
  .personnel-discord-result{
    flex-direction:column;
  }
  .personnel-discord-result__status{
    max-width:none;
    text-align:left;
  }
}

.table-min{ font-size:.90rem; }
.no-scroll-x{ overflow-x:hidden; }

/* Photo grid */
.photo-grid{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:.75rem; }
@media (max-width: 575.98px){ .photo-grid{ grid-template-columns: 1fr; } }
.photo{ border-radius: 10px; overflow:hidden; border:1px solid var(--pm-photo-border); background: var(--pm-photo-bg); position:relative; }
.photo img{ width:100%; height:auto; display:block; }
.photo form{ padding: 0 .25rem .5rem; }

/* Two column helper */
.person-two-col{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:1rem; align-items:start; }
@media (max-width: 991.98px){ .person-two-col{ grid-template-columns: 1fr; } }
.person-two-col > #left-col,
.person-two-col > #right-col{ display:block; }

.small-muted{ color: var(--pm-muted); font-size:.85rem; }

/* Strafbladen (records) compact & without horizontal scroll */
.records-wrap, .table-responsive.no-scroll-x{ overflow-x:hidden !important; }
.records-wrap .table, .table-responsive.no-scroll-x .table{ table-layout: fixed; width:100%; }
.records-wrap .table thead th, .table-responsive.no-scroll-x .table thead th{ position: static; }
.records-wrap th, .records-wrap td, .table-responsive.no-scroll-x th, .table-responsive.no-scroll-x td{
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.records-wrap .table{ font-size: .875rem; }
.records-wrap .table th,
.records-wrap .table td{ padding: .25rem .5rem; line-height: 1.2; }
.records-wrap .badge{ padding: .1rem .35rem; font-size: .75rem; border-radius: .4rem; }
.records-wrap .btn.btn-sm{ padding: .15rem .35rem; font-size: .75rem; }
@media (max-width: 576px){
  .records-wrap .table{ font-size: .82rem; }
  .records-wrap .table th,
  .records-wrap .table td{ padding: .2rem .4rem; }
}

/* Notes */
.note-title{ font-weight:800; margin-bottom:.25rem; }
.note-body{ color: var(--pm-text); }

/* ------------------------------------------------------------
   Login (strak zoals screenshot, geen mega-wide card)
   ------------------------------------------------------------ */
.pm-auth-center{
  min-height: calc(100vh - 88px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 1.25rem 0;
}
.tj-auth-wrap .pm-auth-center{
  min-height: auto;
  align-items: stretch;
  justify-content: stretch;
  padding: 0;
}

.pm-login{
  width: 100%;
  max-width: 520px;
  padding: 1.75rem;
}
.tj-auth-wrap .pm-login{
  max-width: none;
}
@media (max-width: 575.98px){
  .pm-login{ padding: 1.25rem; }
}

.pm-login-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 1rem;
}

.pm-kicker{
  font-size:.70rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color: var(--pm-muted-2);
  font-weight: 900;
}

.pm-title{
  margin: .2rem 0 0;
  font-size: 1.65rem;
  line-height: 1.1;
  font-weight: 900;
}

.pm-login-stripe{
  height: 10px;
  width: 160px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent 0%, rgba(45,147,255,.80) 45%, transparent 100%);
  opacity:.85;
}

.pm-input{ height: 44px; }
.pm-login-btn{ height: 44px; font-weight: 900; }
.pm-hint{ font-size: .86rem; color: var(--pm-muted); }

/* Brand in authbar: nooit blauw/underlined */
.tj-authbar .tj-brand{ color: rgba(231,237,243,.92); text-decoration:none !important; }
.tj-authbar .tj-brand:hover{ color:#fff; }
[data-bs-theme="light"] .tj-authbar .tj-brand{ color: rgba(15,20,26,.92); }
[data-bs-theme="light"] .tj-authbar .tj-brand:hover{ color: rgba(15,20,26,.95); }


/* --------------------
   Porto systeem UI
-------------------- */
#portoCtx.pm-dropdown-menu,
#trainingSearchCtx.pm-dropdown-menu,
#trainingListCtx.pm-dropdown-menu{
  min-width: 240px;
  margin-top: 0;
  padding: .45rem;
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(54,62,69,.98) 0%, rgba(40,46,52,.98) 100%) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: 0 18px 38px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
#trainingSearchCtx.pm-dropdown-menu,
#trainingListCtx.pm-dropdown-menu{
  min-width: 280px;
}
#portoCtx .pm-dropdown-item,
#trainingSearchCtx .pm-dropdown-item,
#trainingListCtx .pm-dropdown-item{
  position: relative;
  width: 100%;
  text-align: left;
  border: 1px solid transparent;
  background: transparent;
  padding: .55rem .75rem;
  border-radius: 8px;
  font-weight: 700;
  color: var(--pm-text);
}
#portoCtx .pm-dropdown-item:disabled,
#trainingSearchCtx .pm-dropdown-item:disabled,
#trainingListCtx .pm-dropdown-item:disabled{
  opacity: .45;
  cursor: not-allowed;
}
#portoCtx .pm-dropdown-item:hover,
#portoCtx .pm-dropdown-item:focus,
#trainingSearchCtx .pm-dropdown-item:hover,
#trainingSearchCtx .pm-dropdown-item:focus,
#trainingListCtx .pm-dropdown-item:hover,
#trainingListCtx .pm-dropdown-item:focus{
  background: rgba(45,147,255,.12) !important;
  border-color: rgba(45,147,255,.35);
  color: #fff;
  box-shadow: 0 6px 16px rgba(45,147,255,.18);
}
#portoCtx .pm-dropdown-item:focus-visible,
#trainingSearchCtx .pm-dropdown-item:focus-visible,
#trainingListCtx .pm-dropdown-item:focus-visible{
  outline: none;
}
#portoCtx .pm-dropdown-item.text-danger,
#trainingSearchCtx .pm-dropdown-item.text-danger,
#trainingListCtx .pm-dropdown-item.text-danger{
  color: #ff6b6b;
}
#portoCtx .pm-dropdown-item.text-danger:hover,
#portoCtx .pm-dropdown-item.text-danger:focus,
#trainingSearchCtx .pm-dropdown-item.text-danger:hover,
#trainingSearchCtx .pm-dropdown-item.text-danger:focus,
#trainingListCtx .pm-dropdown-item.text-danger:hover,
#trainingListCtx .pm-dropdown-item.text-danger:focus{
  background: rgba(255,107,107,.12) !important;
  border-color: rgba(255,107,107,.45);
}
#portoCtx .pm-dropdown-header,
#trainingSearchCtx .pm-dropdown-header,
#trainingListCtx .pm-dropdown-header{
  padding: .35rem .7rem .4rem;
  font-size: .7rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(231,237,243,.65);
  border-bottom: 1px solid rgba(255,255,255,.08);
  margin-bottom: .25rem;
}
#portoCtx .pm-dropdown-divider,
#trainingSearchCtx .pm-dropdown-divider,
#trainingListCtx .pm-dropdown-divider{
  border: 0;
  height: 1px;
  background: rgba(255,255,255,.08);
  margin: .35rem .2rem;
}
[data-bs-theme="light"] #portoCtx.pm-dropdown-menu,
[data-bs-theme="light"] #trainingSearchCtx.pm-dropdown-menu,
[data-bs-theme="light"] #trainingListCtx.pm-dropdown-menu{
  background: #fff !important;
  border-color: rgba(0,0,0,.12) !important;
  box-shadow: 0 16px 30px rgba(0,0,0,.12) !important;
}
[data-bs-theme="light"] #portoCtx .pm-dropdown-item,
[data-bs-theme="light"] #trainingSearchCtx .pm-dropdown-item,
[data-bs-theme="light"] #trainingListCtx .pm-dropdown-item{
  color: #212529;
}
[data-bs-theme="light"] #portoCtx .pm-dropdown-item:hover,
[data-bs-theme="light"] #portoCtx .pm-dropdown-item:focus,
[data-bs-theme="light"] #trainingSearchCtx .pm-dropdown-item:hover,
[data-bs-theme="light"] #trainingSearchCtx .pm-dropdown-item:focus,
[data-bs-theme="light"] #trainingListCtx .pm-dropdown-item:hover,
[data-bs-theme="light"] #trainingListCtx .pm-dropdown-item:focus{
  color: #111;
}
[data-bs-theme="light"] #portoCtx .pm-dropdown-header,
[data-bs-theme="light"] #trainingSearchCtx .pm-dropdown-header,
[data-bs-theme="light"] #trainingListCtx .pm-dropdown-header{
  color: rgba(15,20,26,.65);
  border-bottom-color: rgba(0,0,0,.08);
}
[data-bs-theme="light"] #portoCtx .pm-dropdown-divider,
[data-bs-theme="light"] #trainingSearchCtx .pm-dropdown-divider,
[data-bs-theme="light"] #trainingListCtx .pm-dropdown-divider{
  background: rgba(0,0,0,.08);
}
#trainingSearchCtx .pm-dropdown-item,
#trainingListCtx .pm-dropdown-item{
  display: flex;
  align-items: center;
  gap: .5rem;
}
#trainingSearchCtx .pm-dropdown-item .bi,
#trainingListCtx .pm-dropdown-item .bi{
  width: 1rem;
  opacity: .9;
}
#trainingSearchCtx .pm-dropdown-item.is-active{
  border-color: rgba(40,167,69,.45);
  background: rgba(40,167,69,.13) !important;
  color: #d8ffe5;
}
#trainingSearchCtx .pm-dropdown-header .training-ctx-name,
#trainingListCtx .pm-dropdown-header .training-ctx-name{
  display: block;
  margin-top: .15rem;
  letter-spacing: .01em;
  text-transform: none;
  font-size: .9rem;
  color: #fff;
  font-weight: 800;
}
#trainingSearchCtx .training-ctx-note{
  margin: .35rem .25rem 0;
  font-size: .72rem;
  color: rgba(231,237,243,.7);
}
[data-bs-theme="light"] #trainingSearchCtx .pm-dropdown-item.is-active{
  color: #135f32;
}
[data-bs-theme="light"] #trainingSearchCtx .pm-dropdown-header .training-ctx-name,
[data-bs-theme="light"] #trainingListCtx .pm-dropdown-header .training-ctx-name{
  color: #111;
}
[data-bs-theme="light"] #trainingSearchCtx .training-ctx-note{
  color: rgba(15,20,26,.66);
}

.training-search-profile,
.training-search-profile:visited,
.training-search-profile:hover,
.training-search-profile:focus{
  color: inherit !important;
  text-decoration: none !important;
}

/* Porto units table (OVD/OPCO) */
.porto-ovd-top .section-card,
.porto-ovd-mid .section-card{
  height: 100%;
  display: flex;
  flex-direction: column;
}
.porto-ovd-top .section-body,
.porto-ovd-mid .section-body{
  flex: 1 1 auto;
}
.porto-units-table{ border-collapse: collapse; }
.porto-units-table thead th{
  font-size: .75rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgba(231,237,243,.65);
  background: transparent;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.porto-units-table tbody td{
  padding: .65rem .6rem;
  border-bottom: 1px solid rgba(255,255,255,.06);
  vertical-align: middle;
}
.porto-units-table tbody tr:hover{ background: rgba(255,255,255,.03); }
[data-bs-theme="light"] .porto-units-table thead th{
  color: rgba(15,20,26,.7);
  border-bottom: 1px solid rgba(15,20,26,.12);
}
[data-bs-theme="light"] .porto-units-table tbody td{
  border-bottom: 1px solid rgba(15,20,26,.08);
}
[data-bs-theme="light"] .porto-units-table tbody tr:hover{
  background: rgba(15,20,26,.04);
}
.porto-unit-number{ white-space: nowrap; }
.porto-call-sign{ cursor: context-menu; }
.porto-unit-members .porto-member{ display:inline; }
.porto-unit-members .porto-member[draggable="true"]{ cursor: grab; }
.porto-unit-members .porto-member:not(:last-child)::after{ content: " & "; }
.porto-unit-members .porto-member.is-highlight{
  background: rgba(31, 132, 246, 0.2);
  box-shadow: 0 0 0 1px rgba(31, 132, 246, 0.7);
  border-radius: 4px;
  padding: 1px 4px;
}
.porto-unit-vehicle,
.porto-unit-vehicle-type{ color: var(--pm-text); }

.porto-radio-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 12px;
}
.porto-radio-channel{
  min-height: 132px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 8px;
  background: rgba(8,12,18,.22);
  padding: 12px;
  transition: border-color .15s ease, background .15s ease;
}
.porto-radio-channel.is-drop-target{
  border-color: rgba(45,147,255,.85);
  background: rgba(45,147,255,.10);
}
.porto-radio-channel.is-locked{
  opacity: .78;
}
.porto-radio-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.porto-radio-members{
  min-height: 42px;
  display:flex;
  flex-wrap:wrap;
  gap: 6px;
}
.porto-radio-member{
  display:inline-flex;
  align-items:center;
  max-width: 100%;
  border: 1px solid rgba(45,147,255,.35);
  border-radius: 6px;
  background: rgba(45,147,255,.12);
  color: var(--pm-text);
  padding: 4px 7px;
  font-size: .82rem;
  font-weight: 700;
  cursor: grab;
}
.porto-radio-member:active,
.porto-unit-members .porto-member[draggable="true"]:active{
  cursor: grabbing;
}
.porto-radio-empty{
  color: var(--pm-muted);
  font-size: .85rem;
  padding: 4px 0;
}
.porto-radio-actions{
  border-top: 1px solid rgba(255,255,255,.08);
  margin-top: 10px;
  padding-top: 10px;
  display:flex;
  flex-wrap:wrap;
  gap: 6px;
}
[data-bs-theme="light"] .porto-radio-channel{
  border-color: rgba(15,20,26,.14);
  background: rgba(15,20,26,.035);
}
[data-bs-theme="light"] .porto-radio-actions{
  border-top-color: rgba(15,20,26,.08);
}

.porto-status-btn{
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
}
.porto-status-btn:focus-visible{
  outline: 2px solid rgba(45,147,255,.45);
  outline-offset: 2px;
  border-radius: 6px;
}

.porto-status-pill{
  display: inline-flex;
  align-items: center;
  padding: .32rem .6rem;
  border-radius: 6px;
  font-size: .78rem;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}
.porto-status-pill.status-1{ background: #2ea44f; color:#fff; }
.porto-status-pill.status-2{ background: #1d64f2; color:#fff; }
.porto-status-pill.status-3{ background: #1d64f2; color:#fff; }
.porto-status-pill.status-4{ background: #6c757d; color:#fff; }
.porto-status-pill.status-5{ background: #495057; color:#fff; }
.porto-status-pill.status-6{ background: #0dcaf0; color:#111; }
.porto-status-pill.status-7{ background: #dc3545; color:#fff; }
.porto-status-pill.status-8{ background: #f1c40f; color:#111; }
.porto-status-pill.status-9{ background: #6f42c1; color:#fff; }
.porto-status-pill.status-10{ background: #0d6efd; color:#fff; }
.porto-status-pill.status-unknown{ background: #6c757d; color:#fff; }
.porto-status-pill.status-panic{
  background: #dc3545;
  color: #fff;
  animation: portoPanicLabelPulse 1s ease-in-out infinite;
}

@keyframes portoPanicLabelPulse{
  0%{ box-shadow: 0 0 0 0 rgba(220,53,69,.45); filter: brightness(1); }
  50%{ box-shadow: 0 0 0 6px rgba(220,53,69,.08); filter: brightness(1.08); }
  100%{ box-shadow: 0 0 0 0 rgba(220,53,69,.45); filter: brightness(1); }
}

/* Status blokken (vierkant + gevuld) */

/* Porto status tiles (UI zoals screenshot) */
.porto-status-grid{
  max-width: 720px;
  margin: 0 auto;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, minmax(110px, 1fr));
  gap: 12px;
  align-items: stretch;
  justify-items: stretch;
}
@media (max-width: 720px){
  .porto-status-grid{ grid-template-columns: repeat(2, minmax(140px, 1fr)); }
}
@media (max-width: 420px){
  .porto-status-grid{ grid-template-columns: 1fr; }
}

.porto-status-card{
  border: 2px solid transparent;
  border-radius: 8px;
  width: 100%;
  min-height: 104px;
  height: 100%;
  padding: 12px 10px;
  color: rgba(255,255,255,.95);
  text-transform: uppercase;
  letter-spacing: .02em;
  box-shadow: 0 10px 22px rgba(0,0,0,.28);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6px;
  user-select: none;
  cursor: pointer;
  transition: all 0.2s;
}
.porto-status-card .top{
  font-weight: 700;
  font-size: .95rem;
}
.porto-status-card .mid{
  font-weight: 700;
  opacity: .9;
  line-height: 1;
}
.porto-status-card .bottom{
  font-weight: 700;
  font-size: .85rem;
  opacity: .95;
  text-align: center;
}
.porto-status-card:hover{ filter: brightness(1.05); }
.porto-status-card.is-active{
  background: #31383e !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.28);
}
/* Light mode: selected status should be lighter with dark text */
[data-bs-theme="light"] .porto-status-card.is-active{
  background: #e5e7eb !important;
  color: #111 !important;
  box-shadow: 0 10px 22px rgba(15,20,26,.18);
}
[data-bs-theme="light"] .porto-status-card{
  color: #111;
}

/* Kleuren per status */
.porto-s1{ background: #22b14c; }
.porto-s1.is-active{ border: 2px solid #22b14c; }

.porto-s2{ background: #17a2b8; }
.porto-s2.is-active{ border: 2px solid #17a2b8; }

.porto-s3{ background: #c89c1d; }
.porto-s3.is-active{ border: 2px solid #c89c1d; }

.porto-s4{ background: #6c757d; }
.porto-s4.is-active{ border: 2px solid #6c757d; }

.porto-s5{ background: #6c757d; }
.porto-s5.is-active{ border: 2px solid #6c757d; }

.porto-s6{ background: #0d6efd; }
.porto-s6.is-active{ border: 2px solid #0d6efd; }

.porto-s7{ background: #dc3545; }
.porto-s7.is-active{ border: 2px solid #dc3545; }

/* Optioneel (als je later extra statussen wilt) */
.porto-s8{ background: #20c997; }
.porto-s8.is-active{ border: 2px solid #20c997; }

.porto-s9{ background: #6f42c1; }
.porto-s9.is-active{ border: 2px solid #6f42c1; }

.porto-s10{ background: #6f42c1; }
.porto-s10.is-active{ border: 2px solid #6f42c1; }

/* Porto vehicle grid */
.porto-vehicle-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(100px, 1fr));
  gap: 14px;
}
@media (max-width: 720px){
  .porto-vehicle-grid{ grid-template-columns: repeat(2, minmax(100px, 1fr)); }
}
@media (max-width: 420px){
  .porto-vehicle-grid{ grid-template-columns: 1fr; }
}

.porto-vehicle-card{
  border: 2px solid #7c6ef2;
  border-radius: 8px;
  height: 80px;
  padding: 12px 10px;
  background: #7c6ef2;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: .02em;
  box-shadow: 0 10px 22px rgba(0,0,0,.28), 0 0 0 2px rgba(124, 110, 242, 0.45);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  user-select: none;
  cursor: pointer;
  font-weight: 700;
  font-size: .85rem;
  transition: all .2s;
}
.porto-vehicle-card:hover{
  filter: brightness(1.1);
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(0,0,0,.28), 0 0 0 2px rgba(124, 110, 242, 0.6);
}
.porto-vehicle-card.is-active{
  border: 2px solid rgba(123, 107, 242, 0.7);
  background: rgba(32, 36, 41, 0.6);
  color: #8071ff;
  box-shadow: 0 10px 22px rgba(0,0,0,.28), 0 0 0 1px rgba(123, 107, 242, 0.35);
}

.porto-chat-list{
  display: flex;
  flex-direction: column;
  gap: .45rem;
  max-height: 360px;
  overflow-y: auto;
  padding-right: .2rem;
}
.porto-chat-card.is-collapsed .porto-chat-body{
  display: none;
}
.porto-chat-toggle{
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}
.porto-chat-badge{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .05rem .35rem;
  border-radius: 999px;
  font-size: .7rem;
  font-weight: 700;
  color: #fff;
  background: #dc3545;
  box-shadow: 0 0 0 2px rgba(220,53,69,.35);
}
.porto-chat-card .section-head{
  background: var(--pm-card-head-bg);
  color: var(--pm-text);
  border-bottom: 1px solid var(--pm-card-head-border);
}
.porto-chat-card .section-head .title{
  color: var(--pm-text);
}
.porto-chat-card .section-body{
  background: var(--pm-card-bg);
  color: var(--pm-text);
  display: flex;
  flex-direction: column;
  gap: .5rem;
  min-height: 0;
}
.porto-chat-card .porto-chat-list{
  background: var(--pm-surface-3);
  border: 1px solid var(--pm-border-2);
  border-radius: 12px;
  padding: .4rem;
  flex: 1 1 auto;
  min-height: 300px;
  max-height: 420px;
  overflow-y: auto;
}
.porto-chat-form{
  margin-top: auto !important;
}
.porto-chat-card .porto-chat-item{
  background: var(--pm-surface-2);
  border-color: var(--pm-border-2);
}
.porto-chat-card .porto-chat-item.is-own{
  background: rgba(var(--bs-primary-rgb), .12);
  border-color: rgba(var(--bs-primary-rgb), .45);
}
.porto-chat-card .porto-chat-meta{
  color: var(--pm-muted);
}
.porto-chat-card .porto-chat-message{
  color: var(--pm-text);
}
.porto-chat-item{
  border: 1px solid var(--pm-border-2);
  border-radius: 10px;
  padding: .45rem .6rem;
  background: var(--pm-surface-2);
}
.porto-chat-item.is-own{
  border-color: rgba(var(--bs-primary-rgb), .35);
  background: rgba(var(--bs-primary-rgb), .10);
}
.porto-chat-meta{
  font-size: .78rem;
  color: var(--pm-muted);
}
.porto-chat-message{
  white-space: pre-wrap;
  word-break: break-word;
}
[data-bs-theme="light"] .porto-chat-item{
  background: var(--pm-surface-2);
}

.porto-assign-tags{
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  min-height: 1.75rem;
}

.porto-pending-dock{
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  width: min(400px, calc(100vw - 1.25rem));
  z-index: 1100;
  pointer-events: none;
}
.porto-pending-card{
  pointer-events: auto;
  border: 1px solid var(--pm-card-border);
  border-radius: 14px;
  background: var(--pm-card-bg);
  box-shadow: 0 16px 40px rgba(0,0,0,.34);
  padding: .65rem;
  backdrop-filter: blur(8px);
}
.porto-pending-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  margin-bottom: .45rem;
}
.porto-pending-list{
  display: grid;
  gap: .5rem;
  max-height: 42vh;
  overflow: auto;
  padding-right: .1rem;
}
.porto-pending-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
  border: 1px solid var(--pm-border-2);
  background: var(--pm-surface-2);
  border-radius: 11px;
  padding: .5rem .55rem;
}
.porto-pending-main{
  min-width: 0;
}
.porto-pending-name{
  font-weight: 700;
  line-height: 1.1;
}
.porto-pending-meta{
  margin-top: .2rem;
  font-size: .78rem;
  color: var(--pm-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 220px;
}
.porto-pending-actions{
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  flex-shrink: 0;
}
.porto-panic-dock{
  top: 5rem;
  bottom: auto;
}
.porto-panic-dock .porto-pending-card{
  border-color: rgba(220,53,69,.45);
}
.porto-panic-dock .porto-pending-list{
  max-height: 34vh;
}
@media (max-width: 768px){
  .porto-pending-dock{
    left: .75rem;
    right: .75rem;
    width: auto;
    bottom: .75rem;
  }
  .porto-panic-dock{
    top: 4.25rem;
    bottom: auto;
  }
  .porto-pending-meta{
    max-width: 100%;
    white-space: normal;
  }
}

/* Porto livemap */
.porto-livemap{
  height: 420px;
  border-radius: var(--pm-radius-lg);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  background: #1e2429;
}
@media (max-width: 768px){
  .porto-livemap{ height: 320px; }
}
.porto-livemap.leaflet-container{
  background: #1e2429;
}
.porto-livemap .leaflet-control-zoom a,
.porto-livemap .leaflet-bar a{
  background: rgba(35,40,45,.95);
  color: var(--pm-text);
  border-color: rgba(255,255,255,.18);
}
.porto-livemap .leaflet-control-zoom a:hover,
.porto-livemap .leaflet-bar a:hover{
  background: rgba(60,66,74,.95);
}
.porto-map-label{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #2b6fb6;
  color: #fff;
  font-weight: 700;
  font-size: .72rem;
  padding: 4px 8px;
  border-radius: 4px;
  box-shadow: 0 6px 14px rgba(0,0,0,.35);
  border: 1px solid rgba(255,255,255,.12);
  white-space: nowrap;
}
.porto-map-marker{
  background: transparent;
  border: 0;
  overflow: visible;
}
.porto-map-unit-label{
  transform: translate(-50%, -50%);
}
.porto-map-marker.is-offline .porto-map-label{
  background: #dc3545;
  border-color: rgba(255,255,255,.18);
  box-shadow: 0 6px 14px rgba(0,0,0,.35), 0 0 0 2px rgba(220,53,69,.25);
}
.porto-map-marker.is-panic .porto-map-unit-label{
  background: #2b6fb6;
  border-color: rgba(255,255,255,.24);
  box-shadow: 0 8px 18px rgba(30,110,182,.38), 0 0 0 3px rgba(255,59,59,.26);
  animation: portoPanicLabelPulse 1s ease-in-out infinite;
}
.porto-map-marker.porto-map-sign .porto-map-label{
  background: #c27a1f;
  border-color: rgba(255,255,255,.18);
  cursor: pointer;
}
.porto-map-marker.porto-map-smartsign .porto-map-label{
  background: #1f8a5c;
  border-color: rgba(255,255,255,.18);
  cursor: pointer;
}
.porto-map-panic-ring{
  animation: portoPanicRingPulse 1s ease-in-out infinite;
}

@keyframes portoPanicRingPulse{
  0%{ stroke-opacity: .95; fill-opacity: .16; }
  50%{ stroke-opacity: .18; fill-opacity: .03; }
  100%{ stroke-opacity: .95; fill-opacity: .16; }
}

.smartsign-icon-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: .5rem;
  padding: .35rem;
  max-height: 260px;
  overflow: auto;
  border-radius: 12px;
  border: 1px solid var(--pm-border-2);
  background: var(--pm-surface-3);
}
.smartsign-icon-btn{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  padding: .55rem;
  border-radius: 10px;
  border: 1px solid var(--pm-border-2);
  background: var(--pm-surface-2);
  color: var(--pm-text);
  text-align: center;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.smartsign-icon-btn:hover{
  border-color: var(--pm-border);
  background: var(--pm-surface-3);
}
.smartsign-icon-btn.is-active{
  border-color: rgba(31,138,92,.85);
  box-shadow: 0 0 0 1px rgba(31,138,92,.45);
}
.smartsign-icon-btn img{
  width: 64px;
  height: 64px;
  object-fit: contain;
  image-rendering: pixelated;
}
.smartsign-icon-label{
  font-size: .68rem;
  line-height: 1.1;
  text-align: center;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--pm-muted-2);
  word-break: break-all;
}
.smartsign-icon-empty{
  color: var(--pm-muted);
  font-size: .8rem;
  padding: .5rem 0;
}

.motorway-targets{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: .5rem;
}
.motorway-target{
  display: flex;
  flex-direction: column;
  gap: .4rem;
  padding: .55rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--pm-border-2);
  background: var(--pm-surface-2);
  color: var(--pm-text);
  text-align: left;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.motorway-target:hover{
  border-color: var(--pm-border);
  background: var(--pm-surface-3);
}
.motorway-target.is-active{
  border-color: rgba(194,122,31,.85);
  box-shadow: 0 0 0 1px rgba(194,122,31,.45);
}
.motorway-target-label{
  font-size: .7rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--pm-muted);
}
.motorway-target-preview{
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  border-radius: 8px;
  background: var(--pm-surface-3);
}
.motorway-target-preview img{
  width: 64px;
  height: 64px;
  object-fit: contain;
  image-rendering: pixelated;
}
.motorway-target-text{
  font-size: .68rem;
  color: var(--pm-muted);
  text-align: center;
  word-break: break-all;
}
.motorway-target-empty{
  font-size: .72rem;
  color: var(--pm-muted-2);
}
.motorway-icon-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: .5rem;
  padding: .35rem;
  max-height: 260px;
  overflow: auto;
  border-radius: 12px;
  border: 1px solid var(--pm-border-2);
  background: var(--pm-surface-3);
}
.motorway-icon-grid .text-muted{
  grid-column: 1 / -1;
}
.motorway-icon-btn{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  padding: .55rem;
  border-radius: 10px;
  border: 1px solid var(--pm-border-2);
  background: var(--pm-surface-2);
  color: var(--pm-text);
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.motorway-icon-btn:hover{
  border-color: var(--pm-border);
  background: var(--pm-surface-3);
}
.motorway-icon-btn img{
  width: 72px;
  height: 72px;
  object-fit: contain;
  image-rendering: pixelated;
}
.motorway-icon-label{
  font-size: .68rem;
  line-height: 1.1;
  text-align: center;
  color: var(--pm-muted-2);
  word-break: break-all;
}



/* Safeguard: voorkom dat brede content de sidebar/kolommen oprekt (o.a. Logs) */
.tj-main{ min-width: 0; }
.tj-content{ min-width: 0; overflow-x: hidden; }
.table-responsive{ overflow-x: auto; }

/* Wetboek pages need sticky left legend; avoid clipping/scroll context on ancestors */
.meos-lawbook-page .tj-main,
.meos-lawbook-page .tj-content{
  overflow: visible !important;
}

/* Custom Dropdown Button Styling */
.custom-dropdown-btn {
  text-align: left;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  position: relative;
  width: 100%;
  border-radius: 8px;
  padding: 0.5rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  transition: all 0.15s ease;
}

[data-bs-theme="dark"] .custom-dropdown-btn {
  border: 1px solid var(--pm-border);
  background: rgba(0,0,0,.14);
  color: var(--pm-text);
}

[data-bs-theme="dark"] .custom-dropdown-btn:hover:not(:disabled) {
  border-color: rgba(255,255,255,.20);
  background: rgba(0,0,0,.20);
}

[data-bs-theme="dark"] .custom-dropdown-btn:focus,
[data-bs-theme="dark"] .custom-dropdown-btn.show {
  border-color: var(--pm-accent);
  box-shadow: 0 0 0 .25rem rgba(45,147,255,.15);
  background: rgba(0,0,0,.18);
  outline: 0;
}

[data-bs-theme="light"] .custom-dropdown-btn {
  border: 1px solid #ced4da;
  background: #fff;
  color: #212529;
}

[data-bs-theme="light"] .custom-dropdown-btn:hover:not(:disabled) {
  border-color: #adb5bd;
  background: #f8f9fa;
}

[data-bs-theme="light"] .custom-dropdown-btn:focus,
[data-bs-theme="light"] .custom-dropdown-btn.show {
  border-color: #86b7fe;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
  background: #fff;
  outline: 0;
}

.custom-dropdown-btn:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.custom-dropdown-btn .dropdown-text {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: inherit;
}

.custom-dropdown-btn i {
  color: inherit;
  opacity: 0.7;
  margin-left: 0.5rem;
  flex-shrink: 0;
  transition: transform 0.2s ease;
}

.custom-dropdown-btn.show i {
  transform: rotate(180deg);
}

/* Custom Dropdown Menu Container */
.custom-dropdown-menu,
.pm-dropdown-menu {
  min-width: 200px;
  max-width: 100%;
  padding: 0.5rem;
  margin-top: 0.25rem;
  border-radius: var(--pm-radius);
  max-height: 400px;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1050;
  display: none;
}

.custom-dropdown-wrapper .custom-dropdown-menu {
  width: 100%;
  min-width: 100%;
}

.pm-dropdown-menu {
  width: auto;
  max-width: 320px;
}

.pm-dropdown-menu-end {
  right: 0;
  left: auto;
}

.custom-dropdown-menu.show,
.pm-dropdown-menu.show {
  display: block !important;
}

/* Dark theme dropdown menu */
[data-bs-theme="dark"] .custom-dropdown-menu,
[data-bs-theme="dark"] .custom-dropdown-menu.show,
[data-bs-theme="dark"] .pm-dropdown-menu,
[data-bs-theme="dark"] .pm-dropdown-menu.show {
  background: var(--pm-panel) !important;
  border: 1px solid var(--pm-border) !important;
  box-shadow: var(--pm-shadow) !important;
}

/* Light theme dropdown menu */
[data-bs-theme="light"] .custom-dropdown-menu,
[data-bs-theme="light"] .custom-dropdown-menu.show,
[data-bs-theme="light"] .pm-dropdown-menu,
[data-bs-theme="light"] .pm-dropdown-menu.show {
  background: #fff !important;
  border: 1px solid rgba(0, 0, 0, 0.15) !important;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

/* Dropdown items styling */
.custom-dropdown-item,
.pm-dropdown-item {
  display: block !important;
  width: 100% !important;
  padding: 0.5rem 0.75rem !important;
  margin: 0 !important;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.15s ease;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Dark theme dropdown items */
[data-bs-theme="dark"] .custom-dropdown-item,
[data-bs-theme="dark"] .pm-dropdown-item {
  color: var(--pm-text) !important;
  background: transparent !important;
}

[data-bs-theme="dark"] .custom-dropdown-item:hover,
[data-bs-theme="dark"] .custom-dropdown-item:focus,
[data-bs-theme="dark"] .pm-dropdown-item:hover,
[data-bs-theme="dark"] .pm-dropdown-item:focus {
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
}

[data-bs-theme="dark"] .custom-dropdown-item.active,
[data-bs-theme="dark"] .pm-dropdown-item.active {
  background: var(--pm-accent) !important;
  color: #fff !important;
}

[data-bs-theme="dark"] .custom-dropdown-item.active:hover,
[data-bs-theme="dark"] .pm-dropdown-item.active:hover {
  background: var(--pm-accent-2) !important;
  color: #fff !important;
}

[data-bs-theme="dark"] .custom-dropdown-item:disabled,
[data-bs-theme="dark"] .pm-dropdown-item:disabled {
  opacity: .4 !important;
  cursor: not-allowed;
  color: var(--pm-muted-2) !important;
}

/* Light theme dropdown items */
[data-bs-theme="light"] .custom-dropdown-item,
[data-bs-theme="light"] .pm-dropdown-item {
  color: #212529 !important;
  background: transparent !important;
}

[data-bs-theme="light"] .custom-dropdown-item:hover,
[data-bs-theme="light"] .custom-dropdown-item:focus,
[data-bs-theme="light"] .pm-dropdown-item:hover,
[data-bs-theme="light"] .pm-dropdown-item:focus {
  background: #f8f9fa !important;
  color: #000 !important;
}

[data-bs-theme="light"] .custom-dropdown-item.active,
[data-bs-theme="light"] .pm-dropdown-item.active {
  background: #0a67c6 !important;
  color: #fff !important;
}

[data-bs-theme="light"] .custom-dropdown-item.active:hover,
[data-bs-theme="light"] .pm-dropdown-item.active:hover {
  background: #074c94 !important;
  color: #fff !important;
}

[data-bs-theme="light"] .custom-dropdown-item:disabled,
[data-bs-theme="light"] .pm-dropdown-item:disabled {
  opacity: .5 !important;
  cursor: not-allowed;
  color: #6c757d !important;
}

/* Dropdown search input */
[data-bs-theme="dark"] .custom-dropdown-menu input[type="text"] {
  border: 1px solid var(--pm-border);
  border-radius: 6px;
  margin: 0 0 0.5rem 0;
  width: 100%;
  background: rgba(0,0,0,.14);
  color: var(--pm-text);
  padding: 0.5rem 0.75rem;
}

[data-bs-theme="dark"] .custom-dropdown-menu input[type="text"]:focus {
  border-color: var(--pm-accent);
  outline: 0;
  box-shadow: 0 0 0 .25rem rgba(45,147,255,.15);
  background: rgba(0,0,0,.18);
  color: var(--pm-text);
}

[data-bs-theme="dark"] .custom-dropdown-menu input[type="text"]::placeholder {
  color: var(--pm-muted-2);
}

[data-bs-theme="light"] .custom-dropdown-menu input[type="text"] {
  border: 1px solid #dee2e6;
  border-radius: 6px;
  margin: 0 0 0.5rem 0;
  width: 100%;
  background: #fff;
  color: #212529;
  padding: 0.5rem 0.75rem;
}

[data-bs-theme="light"] .custom-dropdown-menu input[type="text"]:focus {
  border-color: #86b7fe;
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
  background: #fff;
  color: #212529;
}

/* Dropdown divider */
[data-bs-theme="dark"] .custom-dropdown-menu .dropdown-divider {
  border-top: 1px solid var(--pm-border);
  margin: 0.5rem 0;
}

[data-bs-theme="light"] .custom-dropdown-menu .dropdown-divider {
  border-top: 1px solid rgba(0,0,0,.1);
  margin: 0.5rem 0;
}

/* Dropdown header */
[data-bs-theme="dark"] .custom-dropdown-menu .dropdown-header {
  color: var(--pm-muted);
  padding: 0.35rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

[data-bs-theme="light"] .custom-dropdown-menu .dropdown-header {
  color: #6c757d;
  padding: 0.35rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Scrollbar styling for dropdown */
[data-bs-theme="dark"] .custom-dropdown-menu::-webkit-scrollbar,
[data-bs-theme="dark"] .pm-dropdown-menu::-webkit-scrollbar {
  width: 8px;
}

[data-bs-theme="dark"] .custom-dropdown-menu::-webkit-scrollbar-track,
[data-bs-theme="dark"] .pm-dropdown-menu::-webkit-scrollbar-track {
  background: rgba(0,0,0,.2);
  border-radius: 4px;
}

[data-bs-theme="dark"] .custom-dropdown-menu::-webkit-scrollbar-thumb,
[data-bs-theme="dark"] .pm-dropdown-menu::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.2);
  border-radius: 4px;
}

[data-bs-theme="dark"] .custom-dropdown-menu::-webkit-scrollbar-thumb:hover,
[data-bs-theme="dark"] .pm-dropdown-menu::-webkit-scrollbar-thumb:hover {
  background: rgba(255,255,255,.3);
}

[data-bs-theme="light"] .custom-dropdown-menu::-webkit-scrollbar,
[data-bs-theme="light"] .pm-dropdown-menu::-webkit-scrollbar {
  width: 8px;
}

[data-bs-theme="light"] .custom-dropdown-menu::-webkit-scrollbar-track,
[data-bs-theme="light"] .pm-dropdown-menu::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 4px;
}

[data-bs-theme="light"] .custom-dropdown-menu::-webkit-scrollbar-thumb,
[data-bs-theme="light"] .pm-dropdown-menu::-webkit-scrollbar-thumb {
  background: #c1c1c1;
  border-radius: 4px;
}

[data-bs-theme="light"] .custom-dropdown-menu::-webkit-scrollbar-thumb:hover,
[data-bs-theme="light"] .pm-dropdown-menu::-webkit-scrollbar-thumb:hover {
  background: #a8a8a8;
}
.tj-sidebar .tj-nav{
  min-height: 0;
  overflow-y: auto;
  padding-right: .25rem;
}

.js-vehicle-order-row.is-dragging{
  opacity: .65;
}

/* MEOS Wetboek (docs layout) */
.wetboek-layout{
  display: grid;
  gap: 1rem;
  align-items: start;
}

@media (min-width: 992px){
  .wetboek-layout{
    grid-template-columns: 320px 1fr;
  }
  .wetboek-sidebar{
    position: sticky;
    top: 5.25rem;
    max-height: calc(100vh - 6.25rem);
    overflow: auto;
  }
}

.wetboek-sidebar{
  padding: 1rem;
  border: 1px solid var(--pm-border);
  border-radius: var(--pm-radius-lg);
  background: var(--pm-panel);
}

.wetboek-sidebar__head{
  display: flex;
  flex-direction: column;
  gap: .6rem;
  margin-bottom: .75rem;
}

.wetboek-sidebar__title{
  font-weight: 800;
  letter-spacing: .2px;
  font-size: 1.05rem;
}

.wetboek-filter{
  width: 100%;
  padding: .55rem .7rem;
  border: 1px solid var(--pm-border);
  border-radius: .8rem;
  background: var(--pm-surface-2);
  color: var(--pm-text);
  outline: none;
}

.wetboek-filter:focus{
  border-color: var(--pm-accent);
  box-shadow: 0 0 0 2px rgba(45,147,255,.2);
}

[data-bs-theme="light"] .wetboek-filter{
  background: #fff;
}

.wetboek-nav{
  display: flex;
  flex-direction: column;
  gap: .15rem;
}

.wetboek-nav__chapter{
  padding: .35rem 0;
  border-top: 1px solid var(--pm-border);
}

.wetboek-nav__chapter:first-child{
  border-top: 0;
}

.wetboek-nav__row{
  display: flex;
  align-items: center;
  gap: .25rem;
}

.wetboek-nav__toggle{
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  border: 1px solid var(--pm-border);
  background: transparent;
  border-radius: .65rem;
  color: var(--pm-muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.wetboek-nav__toggle::before{
  content: "\25BE";
  line-height: 1;
  transform: translateY(-1px);
}

.wetboek-nav__chapter.is-collapsed .wetboek-nav__toggle::before{
  content: "\25B8";
}

.wetboek-nav__toggle:hover{
  border-color: rgba(45,147,255,.45);
  color: var(--pm-text);
}

.wetboek-nav__chapterLink{
  flex: 1;
  text-decoration: none;
  font-weight: 700;
  color: var(--pm-text);
  padding: .35rem .45rem;
  border-radius: .75rem;
}

.wetboek-nav__chapterLink:hover{
  background: rgba(45,147,255,.08);
}

.wetboek-nav__items{
  display: flex;
  flex-direction: column;
  gap: .1rem;
  margin-left: 34px;
  margin-top: .25rem;
}

.wetboek-nav__chapter.is-collapsed .wetboek-nav__items{
  display: none;
}

.wetboek-nav__link{
  text-decoration: none;
  color: var(--pm-muted);
  padding: .28rem .45rem;
  border-radius: .7rem;
  font-size: .92rem;
}

.wetboek-nav__link:hover{
  background: rgba(45,147,255,.08);
  color: var(--pm-text);
}

.wetboek-nav a[aria-current="true"]{
  background: rgba(45,147,255,.12);
  color: var(--pm-text);
  font-weight: 700;
}

.wetboek-content{
  min-width: 0;
}

.wetboek-doc{
  padding: 1.25rem;
  border: 1px solid var(--pm-border);
  border-radius: var(--pm-radius-lg);
  background: var(--pm-panel);
}

.wetboek-doc__intro{
  margin-bottom: 1rem;
}

.wetboek-pageToc{
  margin: 1rem 0 1.25rem;
  padding: 1rem;
  border: 1px solid var(--pm-border);
  border-radius: 1rem;
  background: var(--pm-surface);
}

.wetboek-pageToc__title{
  margin: 0 0 .6rem;
  font-size: 1.05rem;
}

.wetboek-pageToc__list{
  margin: 0;
  padding-left: 1.25rem;
}

.wetboek-pageToc__items{
  margin: .25rem 0 .5rem;
  padding-left: 1.15rem;
}

.wetboek-pageToc a{
  color: var(--pm-accent-2);
  text-decoration: none;
}

.wetboek-pageToc a:hover{
  text-decoration: underline;
}

.wetboek-chapter{
  padding-top: 1rem;
  margin-top: 1rem;
  border-top: 1px solid var(--pm-border);
}

.wetboek-chapter:first-of-type{
  padding-top: 0;
  margin-top: 0;
  border-top: 0;
}

.wetboek-anchor{
  scroll-margin-top: 6.5rem;
}

.wetboek-chapter__title{
  margin: .1rem 0 .5rem;
  font-size: 1.35rem;
  display: flex;
  align-items: center;
  gap: .4rem;
}

.wetboek-article__title{
  margin: .1rem 0 .5rem;
  font-size: 1.15rem;
  display: flex;
  align-items: center;
  gap: .4rem;
}

.wetboek-permalink{
  opacity: 0;
  text-decoration: none;
  color: var(--pm-muted);
  font-weight: 800;
}

.wetboek-chapter__title:hover .wetboek-permalink,
.wetboek-article__title:hover .wetboek-permalink{
  opacity: 1;
}

.wetboek-permalink:focus{
  opacity: 1;
  outline: none;
}

.wetboek-chapter__intro{
  color: var(--pm-muted);
  margin-bottom: .25rem;
}

.wetboek-article{
  padding: 1rem 0;
  border-top: 1px dashed var(--pm-border);
}

.wetboek-article:first-of-type{
  border-top: 0;
  padding-top: .25rem;
}

.wetboek-article__body{
  color: var(--pm-text);
}

.wetboek-article__body h4{
  margin: .9rem 0 .35rem;
}

.wetboek-article__body ul{
  margin: .35rem 0 .75rem;
  padding-left: 1.15rem;
}

.wetboek-article__body li{
  margin: .18rem 0;
}

.wetboek-article__penTitle{
  margin: .85rem 0 .45rem;
  font-size: 1rem;
}

.penalty-grid{
  display: grid;
  gap: .6rem;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin-top: .35rem;
}

.penalty-card{
  border: 1px solid var(--pm-border);
  border-radius: 1rem;
  padding: .75rem .85rem;
  background: rgba(45,147,255,.08);
}

[data-bs-theme="light"] .penalty-card{
  background: rgba(10,103,198,.06);
}

.penalty-label{
  font-weight: 800;
  color: var(--pm-accent-2);
  margin-bottom: .15rem;
}

.penalty-text{
  font-weight: 700;
  color: var(--pm-text);
}

.meos-lawbook-manage-grid{
  display: grid;
  gap: 1rem;
  align-items: start;
}

@media (min-width: 1200px){
  .meos-lawbook-manage-grid{
    grid-template-columns: minmax(0, 1fr) 320px;
  }
}

.meos-lawbook-editor{
  border: 1px solid var(--pm-border);
  border-radius: var(--pm-radius-lg);
  background: var(--pm-panel);
  padding: 1rem;
}

.meos-lawbook-penalty-grid{
  display: grid;
  gap: .75rem;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.meos-lawbook-penalty-card{
  margin: 0;
  border: 1px solid var(--pm-border);
  border-radius: .9rem;
  background: var(--pm-surface);
  padding: .75rem;
}

.meos-lawbook-penalty-title{
  margin: 0 0 .55rem;
  padding: 0 .2rem;
  font-size: .92rem;
  font-weight: 800;
}

.meos-lawbook-editor .form-label-sm,
#meosLawbookEditForm .form-label-sm{
  font-size: .78rem;
  margin-bottom: .2rem;
  color: var(--pm-muted);
}

.meos-lawbook-legend{
  border: 1px solid var(--pm-border);
  border-radius: var(--pm-radius-lg);
  background: var(--pm-panel);
  padding: 1rem;
}

@media (min-width: 992px){
  .meos-lawbook-legend{
    position: sticky;
    top: 5.25rem;
  }
}

.lawbook-toolbar{
  max-width: 420px;
}

.lawbook-main-layout{
  display: grid;
  gap: 1rem;
  align-items: start;
}

@media (min-width: 992px){
  .lawbook-main-layout{
    grid-template-columns: minmax(250px, 300px) minmax(0, 1fr);
    min-height: calc(100dvh - 6.5rem);
    align-items: stretch;
  }
}

.lawbook-left-legend{
  border: 1px solid var(--pm-border);
  border-radius: var(--pm-radius-lg);
  background: var(--pm-panel);
  overflow: visible;
  align-self: start;
  height: fit-content;
}

@media (min-width: 992px){
  .lawbook-left-legend{
    position: sticky;
    top: 5.25rem;
    display: flex;
    flex-direction: column;
    height: calc(100dvh - 6.5rem);
    min-height: 30rem;
    overflow: hidden;
  }
}

.meos-lawbook-page .lawbook-left-legend{
  position: sticky;
  top: 5.25rem;
}

.lawbook-left-legend__head{
  padding: .9rem .95rem .8rem;
  border-bottom: 1px solid var(--pm-border);
}

.lawbook-left-legend__title{
  font-weight: 800;
  margin-bottom: .45rem;
}

.lawbook-left-nav{
  display: grid;
  gap: .45rem;
  padding: .75rem;
  max-height: none;
  overflow: visible;
  overflow-x: hidden;
}

@media (min-width: 992px){
  .lawbook-left-nav{
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    overflow-x: hidden;
  }
}

.lawbook-left-group{
  display: grid;
  gap: .35rem;
}

.lawbook-left-nav.has-open-group .lawbook-left-group:not(.is-open) .lawbook-left-nav__btn{
  padding: .28rem .45rem;
  border-radius: .55rem;
  font-size: .74rem;
}

.lawbook-left-nav.has-open-group .lawbook-left-group:not(.is-open) .lawbook-left-nav__btn > span:first-child{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lawbook-left-nav.has-open-group .lawbook-left-group:not(.is-open) .lawbook-left-nav__meta .bi{
  display: none;
}

.lawbook-left-nav__btn{
  width: 100%;
  border: 1px solid var(--pm-border);
  border-radius: .75rem;
  background: var(--pm-surface);
  color: var(--pm-text);
  padding: .55rem .65rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .55rem;
  text-align: left;
  font-weight: 700;
}

.lawbook-left-nav__meta{
  display: inline-flex;
  align-items: center;
  gap: .45rem;
}

.lawbook-left-nav__meta .bi{
  transition: transform .16s ease;
}

.lawbook-left-group.is-open .lawbook-left-nav__meta .bi{
  transform: rotate(180deg);
}

.lawbook-left-nav__btn:hover{
  border-color: rgba(45,147,255,.5);
  box-shadow: 0 0 0 1px rgba(45,147,255,.2) inset;
}

.lawbook-left-subnav{
  display: grid;
  gap: .28rem;
  padding: 0 .3rem .25rem;
}

.lawbook-left-nav.has-open-group .lawbook-left-group.is-open .lawbook-left-subnav{
  grid-template-columns: minmax(0, 1fr);
}

.lawbook-left-subnav__btn{
  width: 100%;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: .6rem;
  background: rgba(255,255,255,.02);
  color: var(--pm-text);
  padding: .4rem .5rem;
  text-align: left;
  font-size: .79rem;
  line-height: 1.25;
  white-space: normal;
  overflow-wrap: anywhere;
}

[data-bs-theme="light"] .lawbook-left-subnav__btn{
  border-color: rgba(0,0,0,.08);
  background: rgba(0,0,0,.02);
}

.lawbook-left-subnav__btn:hover{
  border-color: rgba(45,147,255,.45);
  color: var(--pm-accent-2);
}

.lawbook-chapter-list{
  display: grid;
  gap: .8rem;
}

.lawbook-chapter{
  border: 1px solid var(--pm-border);
  border-radius: var(--pm-radius-lg);
  overflow: hidden;
}

.lawbook-chapter-head{
  width: 100%;
  background: var(--pm-panel);
  color: var(--pm-text);
  padding: .85rem 1rem;
  text-align: left;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
}

.lawbook-chapter-head__label{
  font-weight: 800;
}

.lawbook-chapter-head__meta{
  display: inline-flex;
  align-items: center;
  gap: .55rem;
}

.lawbook-chapter-body{
  padding: .2rem 1rem .95rem;
}

.lawbook-article{
  border-top: 1px dashed var(--pm-border);
  padding: .95rem 0;
}

.lawbook-article:first-child{
  border-top: 0;
}

.lawbook-article__title{
  margin: 0 0 .35rem;
  font-size: 1.05rem;
}

.lawbook-article__body{
  color: var(--pm-text);
  margin-bottom: .55rem;
}

.penalty-card--select{
  width: 100%;
  text-align: left;
  cursor: pointer;
  border: 1px solid var(--pm-border);
}

.penalty-card--select:hover{
  border-color: rgba(45,147,255,.55);
  box-shadow: 0 0 0 1px rgba(45,147,255,.22) inset;
}

.penalty-card--select.is-selected{
  background: rgba(25, 135, 84, .24);
  border-color: rgba(25, 135, 84, .88);
  box-shadow: 0 0 0 1px rgba(25, 135, 84, .45) inset;
}

[data-bs-theme="light"] .penalty-card--select.is-selected{
  background: rgba(25, 135, 84, .16);
  border-color: rgba(25, 135, 84, .65);
}

.penalty-line{
  margin-top: .2rem;
  font-size: .88rem;
  color: var(--pm-text);
}

.lawbook-calc-stat{
  border: 1px solid var(--pm-border);
  border-radius: var(--pm-radius-md);
  background: var(--pm-panel);
  padding: .85rem .95rem;
}

/* Sollicitaties */
.app-row--inbound{
  background: rgba(25, 135, 84, .12) !important;
}
.app-row--inbound td{
  border-color: rgba(25, 135, 84, .18);
}

/* Setup wizard */
.setup-language-gate[hidden]{
  display: none !important;
}
.setup-language-gate{
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: center;
  padding: 1.25rem;
}
.setup-language-gate__backdrop{
  position: absolute;
  inset: 0;
  background: rgba(2, 8, 16, .78);
  backdrop-filter: blur(10px) saturate(125%);
  -webkit-backdrop-filter: blur(10px) saturate(125%);
}
.setup-language-gate__dialog{
  position: relative;
  z-index: 1;
  width: min(100%, 46rem);
  padding: 1.45rem;
  border-radius: calc(var(--pm-radius-xl) + 4px);
  border: 1px solid rgba(137,225,255,.14);
  background:
    radial-gradient(circle at top left, rgba(47,183,255,.18), transparent 38%),
    linear-gradient(180deg, rgba(15,30,43,.98), rgba(10,22,33,.98));
  box-shadow: 0 32px 82px rgba(0,0,0,.42);
}
.setup-language-gate__kicker{
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  margin-bottom: .85rem;
  padding: .34rem .72rem;
  border-radius: 999px;
  border: 1px solid rgba(137,225,255,.12);
  background: rgba(255,255,255,.05);
  color: var(--pm-accent-2);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.setup-language-gate__dialog h2{
  margin: 0 0 .55rem;
  font-size: clamp(1.8rem, 4vw, 2.5rem);
}
.setup-language-gate__dialog p{
  margin: 0;
  color: var(--pm-muted);
  line-height: 1.6;
}
.setup-language-gate__grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .9rem;
  margin-top: 1.3rem;
}
.setup-language-gate__btn{
  appearance: none;
  width: 100%;
  padding: 1rem 1.05rem;
  border-radius: var(--pm-radius-lg);
  border: 1px solid rgba(137,225,255,.12);
  background: rgba(7,16,25,.58);
  color: var(--pm-text);
  text-align: left;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.setup-language-gate__btn:hover,
.setup-language-gate__btn:focus-visible{
  transform: translateY(-2px);
  border-color: rgba(47,183,255,.34);
  background: rgba(10,23,35,.96);
  box-shadow: 0 18px 38px rgba(0,0,0,.22);
  outline: none;
}
.setup-language-gate__btn strong{
  display: block;
  margin-bottom: .28rem;
  font-size: 1rem;
}
.setup-language-gate__btn span{
  display: block;
  color: var(--pm-muted-2);
  font-size: .92rem;
  line-height: 1.45;
}
.setup-language-gate__hint{
  margin-top: 1rem;
  color: var(--pm-muted-2);
  font-size: .88rem;
}
.setup-shell{
  display: grid;
  gap: 1rem;
}

.setup-hero{
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 1.25rem;
  padding: 1.35rem 1.4rem;
  border: 1px solid rgba(137,225,255,.16);
  background:
    linear-gradient(140deg, rgba(12,28,40,.96) 0%, rgba(18,36,52,.88) 58%, rgba(14,55,86,.78) 100%);
  box-shadow: var(--pm-shadow);
  overflow: hidden;
}
.setup-hero.setup-hero--compact{
  grid-template-columns: minmax(0, 1fr);
}
.setup-hero::after{
  content: "";
  position: absolute;
  inset: auto -80px -80px auto;
  width: 220px;
  height: 220px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(137,225,255,.18) 0%, transparent 68%);
  pointer-events: none;
}
.setup-kicker{
  margin-bottom: .5rem;
  color: var(--pm-accent-2);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .22em;
  text-transform: uppercase;
}
.setup-hero h1{
  margin: 0;
  font-size: clamp(1.6rem, 2.7vw, 2.5rem);
}
.setup-hero p{
  max-width: 680px;
  margin: .65rem 0 0;
  color: var(--pm-muted);
}
.setup-hero-side{
  display: grid;
  gap: .9rem;
  align-content: start;
  justify-items: end;
}
.setup-hero-logo{
  width: 120px;
  max-width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 24px;
  border: 1px solid rgba(137,225,255,.20);
  background: rgba(7,16,25,.62);
  box-shadow: 0 22px 44px rgba(2,8,16,.28);
}
.setup-url{
  width: 100%;
  padding: .85rem .95rem;
  border-radius: 14px;
  border: 1px solid var(--pm-border);
  background: rgba(7,16,25,.44);
}
.setup-url span{
  display: block;
  margin-bottom: .3rem;
  color: var(--pm-muted-2);
  font-size: .74rem;
  text-transform: uppercase;
  letter-spacing: .14em;
}
.setup-url code{
  display: block;
  color: var(--pm-text);
  font-size: .84rem;
  word-break: break-all;
}

.setup-steps{
  display: grid;
  grid-template-columns: repeat(7, minmax(150px, 1fr));
  gap: .7rem;
  overflow-x: auto;
  padding-bottom: .15rem;
  scrollbar-width: thin;
}
.setup-step{
  display: flex;
  align-items: center;
  gap: .7rem;
  min-height: 62px;
  padding: .82rem .9rem;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.06);
  background: linear-gradient(180deg, rgba(18,21,27,.98), rgba(15,18,24,.98));
  color: var(--pm-text);
  text-decoration: none;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.setup-step:hover{
  transform: translateY(-1px);
  border-color: rgba(255,255,255,.10);
  box-shadow: 0 10px 22px rgba(0,0,0,.18);
  color: var(--pm-text);
}
.setup-step span{
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  flex: 0 0 auto;
  font-weight: 800;
  background: rgba(255,255,255,.05);
}
.setup-step--active{
  border-color: rgba(91,134,171,.30);
  background: linear-gradient(180deg, rgba(28,37,48,.98), rgba(22,29,38,.98));
  box-shadow: 0 14px 28px rgba(0,0,0,.22);
}
.setup-step--active span{
  background: rgba(91,134,171,.22);
  color: #e8eef5;
}
.setup-step--done{
  border-color: rgba(66,126,94,.26);
  background: linear-gradient(180deg, rgba(18,31,24,.96), rgba(16,25,20,.96));
}
.setup-step--done span{
  background: rgba(66,126,94,.22);
  color: #d3eadc;
}
.setup-step--pending{
  color: var(--pm-muted);
}

.setup-panel{
  border: 1px solid var(--pm-card-border);
  background: linear-gradient(180deg, rgba(18,36,52,.90), rgba(13,27,39,.90));
  box-shadow: var(--pm-shadow-soft);
}
.setup-panel-head{
  padding: 1rem 1.15rem;
  border-bottom: 1px solid var(--pm-card-head-border);
  background: rgba(7,16,25,.42);
}
.setup-panel-head h2{
  margin: 0;
  font-size: 1rem;
}
.setup-panel-body{
  padding: 1.15rem;
}
.setup-panel .form-control,
.setup-panel .form-select{
  border-color: var(--pm-border);
  background: rgba(7,16,25,.54);
}

.setup-grid{
  display: grid;
  gap: 1rem;
}
.setup-grid--double{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.setup-grid--triple{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.setup-grid--service-cards{
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.setup-mini-card,
.setup-service-card{
  padding: 1rem;
  border: 1px solid var(--pm-card-border);
  border-radius: var(--pm-radius-lg);
  background: linear-gradient(180deg, rgba(19,38,55,.92), rgba(11,23,34,.92));
}
.setup-mini-head{
  margin-bottom: .8rem;
  color: var(--pm-accent-2);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.setup-service-title{
  font-size: 1.05rem;
  font-weight: 800;
}
.setup-service-stats{
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin-top: .85rem;
}
.setup-service-stats span{
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: .35rem .7rem;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  color: var(--pm-text);
  font-size: .78rem;
}

.setup-status{
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: .45rem .8rem;
  border-radius: 999px;
  border: 1px solid var(--pm-border);
  font-weight: 700;
}
.setup-status--ok{
  background: rgba(67,193,131,.14);
  border-color: rgba(67,193,131,.36);
  color: #bbf3cf;
}
.setup-status--warn{
  background: rgba(255,193,7,.10);
  border-color: rgba(255,193,7,.28);
  color: #ffe18c;
}

.setup-footer-nav{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .9rem;
  margin-top: 1.2rem;
  padding-top: 1rem;
  border-top: 1px solid var(--pm-card-head-border);
}
.setup-alert{
  margin-bottom: 0;
  border-color: var(--pm-border);
  background: rgba(18,36,52,.82);
}
.setup-divider{
  margin: .2rem 0;
  border-color: var(--pm-card-head-border);
  opacity: 1;
}
.setup-inline-note{
  font-size: .9rem;
  line-height: 1.55;
}
.setup-discord-choice-head,
.setup-discord-current{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.setup-discord-choice-title{
  font-size: 1.1rem;
  font-weight: 800;
  margin-bottom: .25rem;
}
.setup-discord-choice-actions{
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
}
.setup-discord-current-main,
.setup-discord-member-main{
  display: flex;
  align-items: flex-start;
  gap: .85rem;
  min-width: 0;
}
.setup-discord-members-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.setup-discord-search{
  max-width: 320px;
}
.setup-discord-members{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: .85rem;
  margin-top: 1rem;
}
.setup-discord-member{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .95rem 1rem;
  border: 1px solid var(--pm-card-border);
  border-radius: var(--pm-radius-lg);
  background: rgba(255,255,255,.03);
}
.setup-discord-member.is-current{
  border-color: rgba(67,193,131,.28);
  background: rgba(67,193,131,.08);
}
.setup-discord-member.is-disabled{
  opacity: .8;
}
.setup-discord-avatar{
  width: 56px;
  height: 56px;
  flex: 0 0 56px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid var(--pm-avatar-border);
  background: var(--pm-avatar-bg);
}
.setup-discord-avatar--fallback{
  display: grid;
  place-items: center;
  font-weight: 800;
}
.setup-discord-member-copy{
  min-width: 0;
}
.setup-discord-member-title-row{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .5rem;
}
.setup-discord-member-title{
  font-size: 1rem;
  font-weight: 800;
}
.setup-discord-member-handle{
  color: var(--pm-muted);
  font-size: .88rem;
}
.setup-discord-roles{
  margin-top: .3rem;
  color: var(--pm-muted);
  font-size: .82rem;
  line-height: 1.5;
}
.setup-discord-member-badge{
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: .2rem .6rem;
  border-radius: 999px;
  background: rgba(67,193,131,.16);
  color: #bbf3cf;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.setup-discord-member-badge--muted{
  background: rgba(255,255,255,.08);
  color: var(--pm-muted);
}
.setup-discord-member-action{
  display: flex;
  align-items: center;
}
.setup-discord-member-action .btn{
  min-width: 122px;
}
.setup-discord-empty{
  padding: 1rem;
  border: 1px dashed var(--pm-border);
  border-radius: var(--pm-radius-lg);
  color: var(--pm-muted);
  text-align: center;
}

[data-bs-theme="light"] .setup-hero{
  border-color: rgba(15,20,26,.10);
  background: linear-gradient(140deg, rgba(248,249,251,.99) 0%, rgba(242,244,247,.98) 58%, rgba(236,239,243,.97) 100%);
  box-shadow: 0 18px 34px rgba(15,20,26,.08);
}
[data-bs-theme="light"] .setup-hero::after{
  content: none;
}
[data-bs-theme="light"] .setup-hero-logo{
  border-color: rgba(15,20,26,.10);
  background: rgba(255,255,255,.92);
  box-shadow: 0 18px 30px rgba(15,20,26,.10);
}
[data-bs-theme="light"] .setup-url{
  border-color: rgba(15,20,26,.10);
  background: rgba(255,255,255,.78);
}
[data-bs-theme="light"] .setup-step{
  border-color: rgba(15,20,26,.10);
  background: rgba(255,255,255,.94);
  color: var(--pm-text);
}
[data-bs-theme="light"] .setup-step span{
  background: rgba(15,20,26,.06);
}
[data-bs-theme="light"] .setup-step--active{
  border-color: rgba(15,20,26,.16);
  background: linear-gradient(135deg, rgba(240,243,247,.98), rgba(250,251,252,.99));
  box-shadow: 0 12px 22px rgba(15,20,26,.06);
}
[data-bs-theme="light"] .setup-step--active span{
  background: rgba(15,20,26,.10);
  color: #1f2933;
}
[data-bs-theme="light"] .setup-step--done{
  border-color: rgba(67,193,131,.24);
  background: linear-gradient(135deg, rgba(67,193,131,.10), rgba(255,255,255,.96));
}
[data-bs-theme="light"] .setup-step--done span{
  background: rgba(67,193,131,.16);
  color: #1f7a4b;
}
[data-bs-theme="light"] .setup-step--pending{
  color: var(--pm-muted);
}
[data-bs-theme="light"] .setup-panel{
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(245,248,251,.98));
  box-shadow: 0 12px 28px rgba(15,20,26,.08);
}
[data-bs-theme="light"] .setup-panel-head{
  background: rgba(245,248,251,.92);
}
[data-bs-theme="light"] .setup-panel .form-control,
[data-bs-theme="light"] .setup-panel .form-select{
  background: #fff;
  color: var(--pm-text);
}
[data-bs-theme="light"] .setup-mini-card,
[data-bs-theme="light"] .setup-service-card{
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(246,249,252,.98));
}
[data-bs-theme="light"] .setup-mini-head{
  color: #0a67c6;
}
[data-bs-theme="light"] .setup-service-stats span{
  background: rgba(15,20,26,.05);
  color: var(--pm-text);
}
[data-bs-theme="light"] .setup-status--ok{
  background: rgba(67,193,131,.12);
  border-color: rgba(67,193,131,.30);
  color: #1f7a4b;
}
[data-bs-theme="light"] .setup-status--warn{
  background: rgba(255,193,7,.16);
  border-color: rgba(255,193,7,.34);
  color: #8a5a00;
}
[data-bs-theme="light"] .setup-alert{
  background: rgba(255,255,255,.94);
}
[data-bs-theme="light"] .setup-shell .btn-outline-light{
  --bs-btn-color: #0a67c6;
  --bs-btn-border-color: rgba(10,103,198,.22);
  --bs-btn-hover-color: #074c94;
  --bs-btn-hover-bg: rgba(10,103,198,.08);
  --bs-btn-hover-border-color: rgba(10,103,198,.32);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #0a67c6;
  --bs-btn-active-border-color: #0a67c6;
}

@media (max-width: 991.98px){
  .setup-language-gate__grid{
    grid-template-columns: 1fr;
  }
  .setup-hero{
    grid-template-columns: 1fr;
  }
  .setup-hero-side{
    justify-items: start;
  }
  .setup-grid--double,
  .setup-grid--triple{
    grid-template-columns: 1fr;
  }
  .setup-discord-choice-head,
  .setup-discord-current,
  .setup-discord-members-head,
  .setup-discord-member{
    flex-direction: column;
    align-items: stretch;
  }
  .setup-discord-search{
    max-width: none;
  }
}

@media (max-width: 767.98px){
  .setup-language-gate{
    padding: .85rem;
  }
  .setup-language-gate__dialog{
    padding: 1.15rem;
  }
  .setup-panel-body,
  .setup-panel-head,
  .setup-hero{
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .setup-footer-nav{
    flex-direction: column;
    align-items: stretch;
  }
  .setup-footer-nav .btn{
    width: 100%;
  }
  .setup-discord-member-main{
    align-items: center;
  }
  .setup-discord-member-action .btn{
    width: 100%;
    min-width: 0;
  }
}

/* Footer */
.tj-footer{
  margin-top: 1.75rem;
  padding: .9rem .75rem;
  text-align: center;
  font-size: .85rem;
  color: var(--pm-muted-2);
  border-top: 1px solid var(--pm-border-2);
}
[data-bs-theme="light"] .tj-footer{
  color: rgba(15,20,26,.65);
  border-top: 1px solid rgba(15,20,26,.12);
}

/* Dark mode cleanup: flatter, more neutral surfaces without background glow */
[data-bs-theme="dark"]{
  --pm-bg: #1d1f24;
  --pm-bg-2: #25282d;
  --pm-panel: #2a2d33;
  --pm-panel-2: #30343b;
  --pm-border: rgba(255,255,255,.08);
  --pm-border-2: rgba(255,255,255,.05);
  --pm-text: #f2f4f7;
  --pm-muted: rgba(242,244,247,.68);
  --pm-muted-2: rgba(242,244,247,.44);
  --pm-shadow: 0 18px 36px rgba(0,0,0,.28);
  --pm-shadow-soft: 0 10px 24px rgba(0,0,0,.20);
  --pm-surface: rgba(255,255,255,.04);
  --pm-surface-2: rgba(28,30,35,.94);
  --pm-surface-3: rgba(39,42,48,.96);
  --pm-surface-4: rgba(30,32,37,.98);
  --pm-card-bg: #2a2d33;
  --pm-card-head-bg: #24272d;
  --pm-card-border: rgba(255,255,255,.08);
  --pm-card-head-border: rgba(255,255,255,.06);
  --pm-table-head-bg: #24272d;
  --pm-table-head-color: rgba(242,244,247,.66);
  --pm-table-row-hover: rgba(255,255,255,.03);
  --pm-table-border: rgba(255,255,255,.06);
  --pm-avatar-bg: rgba(255,255,255,.06);
  --pm-avatar-border: rgba(255,255,255,.08);
  --pm-stat-bg: #2b2e35;
  --pm-photo-bg: rgba(20,22,26,.90);
  --pm-photo-border: rgba(255,255,255,.08);
  background-color: var(--pm-bg);
}

[data-bs-theme="dark"] .tj-bg{
  background: linear-gradient(180deg, var(--pm-bg) 0%, var(--pm-bg-2) 100%);
}
[data-bs-theme="dark"] .tj-bg::before,
[data-bs-theme="dark"] .tj-bg::after{
  content: none;
}

[data-bs-theme="dark"] .tj-sidebar,
[data-bs-theme="dark"] .tj-offcanvas{
  background: #202227;
  backdrop-filter: none;
}
[data-bs-theme="dark"] .tj-topbar,
[data-bs-theme="dark"] .tj-authbar{
  background: rgba(29,31,36,.96);
  backdrop-filter: none;
}
[data-bs-theme="dark"] .tj-brand-mark{
  background: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.10);
  color: rgba(242,244,247,.92);
}
[data-bs-theme="dark"] .tj-brand-logo,
[data-bs-theme="dark"] .setup-hero-logo{
  background: #1f2126;
  border-color: rgba(255,255,255,.08);
  box-shadow: none;
}
[data-bs-theme="dark"] .tj-sidebar-avatar{
  box-shadow: none;
}
[data-bs-theme="dark"] .tj-login-stripe{
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.14) 50%, transparent 100%);
  opacity: .72;
}

[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .section-card,
[data-bs-theme="dark"] .tj-stat-card,
[data-bs-theme="dark"] .pm-stat,
[data-bs-theme="dark"] .kpi,
[data-bs-theme="dark"] .tj-auth-side,
[data-bs-theme="dark"] .setup-panel,
[data-bs-theme="dark"] .setup-mini-card,
[data-bs-theme="dark"] .setup-service-card,
[data-bs-theme="dark"] .setup-alert{
  background: var(--pm-card-bg);
  border-color: rgba(255,255,255,.08);
  box-shadow: var(--pm-shadow-soft);
}
[data-bs-theme="dark"] .section-head,
[data-bs-theme="dark"] .setup-panel-head{
  background: var(--pm-card-head-bg);
  border-bottom-color: rgba(255,255,255,.06);
}
[data-bs-theme="dark"] .section-card.section-card-warrant{
  background: #7a0f18;
  border-color: #dc3545;
  box-shadow: none;
}
[data-bs-theme="dark"] .tj-lift:hover,
[data-bs-theme="dark"] .section-card:hover{
  border-color: rgba(255,255,255,.12);
  box-shadow: 0 14px 26px rgba(0,0,0,.22);
}
[data-bs-theme="dark"] .tj-page-hero{
  border-color: rgba(255,255,255,.08);
  background: #2a2d33;
  box-shadow: var(--pm-shadow-soft);
}
[data-bs-theme="dark"] .tj-page-kicker,
[data-bs-theme="dark"] .setup-kicker,
[data-bs-theme="dark"] .setup-mini-head{
  color: rgba(242,244,247,.58);
}
[data-bs-theme="dark"] .tj-chip{
  background: #23262b;
  border-color: rgba(255,255,255,.08);
}
[data-bs-theme="dark"] .tj-chip--success{
  background: rgba(67,193,131,.12);
  border-color: rgba(67,193,131,.28);
}
[data-bs-theme="dark"] .tj-chip--warn{
  background: rgba(255,193,7,.10);
  border-color: rgba(255,193,7,.22);
}
[data-bs-theme="dark"] .tj-stat-card{
  background: var(--pm-stat-bg);
}
[data-bs-theme="dark"] .tj-progress{
  background: rgba(255,255,255,.06);
}
[data-bs-theme="dark"] .tj-progress > span{
  background: var(--pm-accent);
}
[data-bs-theme="dark"] .tj-quick-note{
  background: rgba(255,255,255,.02);
  border-style: solid;
}

[data-bs-theme="dark"] .tj-user-pill{
  background: rgba(255,255,255,.04);
  border-color: rgba(255,255,255,.08);
}
[data-bs-theme="dark"] .tj-user-pill:hover{
  background: rgba(255,255,255,.06);
}
[data-bs-theme="dark"] .dropdown-menu,
[data-bs-theme="dark"] .dropdown-menu.show,
[data-bs-theme="dark"] .custom-dropdown-menu,
[data-bs-theme="dark"] .custom-dropdown-menu.show,
[data-bs-theme="dark"] .pm-dropdown-menu,
[data-bs-theme="dark"] .pm-dropdown-menu.show,
[data-bs-theme="dark"] .tj-dd{
  background: var(--pm-panel) !important;
  border-color: rgba(255,255,255,.08) !important;
  box-shadow: 0 14px 28px rgba(0,0,0,.24) !important;
}
[data-bs-theme="dark"] #portoCtx.pm-dropdown-menu,
[data-bs-theme="dark"] #trainingSearchCtx.pm-dropdown-menu,
[data-bs-theme="dark"] #trainingListCtx.pm-dropdown-menu{
  background: var(--pm-panel) !important;
  border-color: rgba(255,255,255,.08) !important;
  box-shadow: 0 14px 28px rgba(0,0,0,.24) !important;
}
[data-bs-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:focus,
[data-bs-theme="dark"] .custom-dropdown-item:hover,
[data-bs-theme="dark"] .custom-dropdown-item:focus,
[data-bs-theme="dark"] .pm-dropdown-item:hover,
[data-bs-theme="dark"] .pm-dropdown-item:focus{
  background: rgba(255,255,255,.06) !important;
}
[data-bs-theme="dark"] #portoCtx .pm-dropdown-item:hover,
[data-bs-theme="dark"] #portoCtx .pm-dropdown-item:focus,
[data-bs-theme="dark"] #trainingSearchCtx .pm-dropdown-item:hover,
[data-bs-theme="dark"] #trainingSearchCtx .pm-dropdown-item:focus,
[data-bs-theme="dark"] #trainingListCtx .pm-dropdown-item:hover,
[data-bs-theme="dark"] #trainingListCtx .pm-dropdown-item:focus{
  background: rgba(255,255,255,.06) !important;
  border-color: rgba(255,255,255,.10);
  box-shadow: none;
}

[data-bs-theme="dark"] .setup-language-gate__backdrop{
  background: rgba(12,14,18,.84);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
[data-bs-theme="dark"] .setup-language-gate__dialog{
  background: var(--pm-card-bg);
  border-color: rgba(255,255,255,.08);
  box-shadow: 0 20px 42px rgba(0,0,0,.30);
}
[data-bs-theme="dark"] .setup-language-gate__kicker{
  background: rgba(255,255,255,.03);
  border-color: rgba(255,255,255,.08);
  color: rgba(242,244,247,.66);
}
[data-bs-theme="dark"] .setup-language-gate__btn,
[data-bs-theme="dark"] .setup-url,
[data-bs-theme="dark"] .setup-panel .form-control,
[data-bs-theme="dark"] .setup-panel .form-select{
  background: #202227;
  border-color: rgba(255,255,255,.08);
  box-shadow: none;
}
[data-bs-theme="dark"] .setup-language-gate__btn:hover,
[data-bs-theme="dark"] .setup-language-gate__btn:focus-visible{
  transform: translateY(-1px);
  background: #25282d;
  border-color: rgba(255,255,255,.12);
  box-shadow: 0 12px 24px rgba(0,0,0,.24);
}
[data-bs-theme="dark"] .setup-hero{
  border-color: rgba(255,255,255,.08);
  background: var(--pm-card-bg);
  box-shadow: var(--pm-shadow-soft);
}
[data-bs-theme="dark"] .setup-hero::after{
  content: none;
}
[data-bs-theme="dark"] .setup-service-stats span{
  background: rgba(255,255,255,.04);
}

[data-bs-theme="dark"] body.tj-scrolled .tj-topbar,
[data-bs-theme="dark"] body.tj-scrolled .tj-authbar{
  box-shadow: 0 8px 18px rgba(0,0,0,.18);
}

/* Setup page: keep chrome minimal */
body[data-page="setup"] .tj-sidebar-user .tj-user-name,
body[data-page="setup"] .tj-sidebar-user .tj-user-sub,
body[data-page="setup"] .tj-user-pill-text,
body[data-page="setup"] .offcanvas .tj-user-name,
body[data-page="setup"] .offcanvas .tj-user-sub{
  display: none;
}
body[data-page="setup"] .tj-user-pill{
  padding: .42rem;
  min-width: 42px;
}
body[data-page="setup"] .tj-user-pill-chevron{
  display: none;
}

.setup-create-service-summary{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
}
.setup-create-service-summary__title{
  font-weight:700;
  font-size:1.05rem;
}
.setup-create-service-search{
  max-width:380px;
}
.setup-create-service-loading,
.setup-create-service-empty{
  padding:.95rem 1rem;
  border:1px dashed rgba(255,255,255,.12);
  border-radius:16px;
  color:var(--bs-secondary-color);
}
.setup-create-service-ranks{
  display:grid;
  gap:.75rem;
}
.setup-create-service-rank{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.9rem 1rem;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:rgba(255,255,255,.03);
  cursor:pointer;
}
.setup-create-service-rank__main{
  display:flex;
  align-items:flex-start;
  gap:.8rem;
}
.setup-create-service-rank__label{
  display:block;
  font-weight:600;
}
.setup-create-service-rank__meta{
  display:block;
  font-size:.84rem;
  color:var(--bs-secondary-color);
}
[data-bs-theme="light"] .setup-create-service-rank{
  background:#f7f8fa;
  border-color:rgba(15,23,42,.08);
}
[data-bs-theme="light"] .setup-create-service-loading,
[data-bs-theme="light"] .setup-create-service-empty{
  border-color:rgba(15,23,42,.12);
}
[data-bs-theme="dark"] .setup-create-service-rank{
  background:#202227;
  border-color:rgba(255,255,255,.08);
}
[data-bs-theme="dark"] .setup-create-service-loading,
[data-bs-theme="dark"] .setup-create-service-empty{
  background:#202227;
  border-color:rgba(255,255,255,.08);
}