:root {
  --erp-bg: #f3f5f9;
  --erp-surface: #ffffff;
  --erp-surface-muted: #f8fafc;
  --erp-border: #dbe1ea;
  --erp-border-strong: #cbd5e1;
  --erp-text: #111827;
  --erp-text-muted: #6b7280;
  --erp-sidebar: #0f172a;
  /* Derived tokens - no new colours beyond the official palette above.
     The sidebar is dark in both themes, so it has its own names: the dark theme pins them
     (user_workspace.css) instead of letting them invert with text and surface. */
  --erp-sidebar-top: var(--erp-text);
  --erp-sidebar-text: var(--erp-border-strong);
  --erp-sidebar-text-soft: var(--erp-border);
  --erp-sidebar-text-strong: var(--erp-surface);
  --erp-sidebar-muted: var(--erp-text-muted);
  /* Text on the soft semantic fills - badges, chips, messages: the semantic colour mixed with
     the text colour, so it stays readable. --erp-on-accent is text on a solid fill. */
  --erp-primary-text: var(--erp-primary-hover);
  --erp-info-text: color-mix(in srgb, var(--erp-info) 75%, var(--erp-text));
  --erp-success-text: color-mix(in srgb, var(--erp-success) 70%, var(--erp-text));
  --erp-warning-text: color-mix(in srgb, var(--erp-warning) 55%, var(--erp-text));
  --erp-danger-text: color-mix(in srgb, var(--erp-danger) 80%, var(--erp-text));
  --erp-on-accent: var(--erp-surface);
  --erp-info-fill: color-mix(in srgb, var(--erp-info) 85%, var(--erp-sidebar));
  --erp-success-fill: color-mix(in srgb, var(--erp-success) 70%, var(--erp-sidebar));
  --erp-primary: #2563eb;
  --erp-primary-hover: #1d4ed8;
  --erp-primary-soft: #dbeafe;
  --erp-primary-soft-strong: #bfdbfe;
  --erp-info: #0284c7;
  --erp-info-soft: #f0f9ff;
  --erp-success: #16a34a;
  --erp-success-soft: #ecfdf5;
  --erp-warning: #f59e0b;
  --erp-warning-soft: #fffbeb;
  --erp-danger: #dc2626;
  --erp-danger-soft: #fef2f2;
  --color-white: var(--erp-surface);
  --color-black: var(--erp-text);
  --color-layout-bg: var(--erp-bg);
  --color-slate-50: var(--erp-surface-muted);
  --color-slate-100: var(--erp-surface-muted);
  --color-slate-200: var(--erp-border);
  --color-slate-300: var(--erp-border-strong);
  --color-slate-400: var(--erp-text-muted);
  --color-slate-500: var(--erp-text-muted);
  --color-slate-600: var(--erp-text-muted);
  --color-slate-700: var(--erp-text);
  --color-slate-800: var(--erp-sidebar);
  --color-slate-900: var(--erp-sidebar);
  --color-gray-50: var(--erp-surface-muted);
  --color-gray-100: var(--erp-bg);
  --color-gray-300: var(--erp-border-strong);
  --color-gray-400: var(--erp-text-muted);
  --color-gray-700: var(--erp-text);
  --color-gray-800: var(--erp-sidebar);
  --color-gray-900: var(--erp-text);
  --color-border: var(--erp-border);
  --color-border-soft: var(--erp-border);
  --color-blue-50: var(--erp-info-soft);
  --color-blue-100: var(--erp-primary-soft);
  --color-blue-200: var(--erp-primary-soft-strong);
  --color-blue-300: var(--erp-primary-soft-strong);
  --color-blue-400: var(--erp-primary);
  --color-blue-500: var(--erp-primary);
  --color-blue-600: var(--erp-primary);
  --color-blue-700: var(--erp-primary-text);
  --color-blue-800: var(--erp-primary-text);
  --color-blue-900: var(--erp-primary-text);
  --color-sky-50: var(--erp-info-soft);
  --color-sky-300: var(--erp-primary-soft-strong);
  --color-sky-600: var(--erp-info);
  --color-sky-700: var(--erp-info-text);
  --color-red-50: var(--erp-danger-soft);
  --color-red-100: var(--erp-danger-soft);
  --color-red-200: var(--erp-danger);
  --color-red-300: var(--erp-danger);
  --color-red-600: var(--erp-danger);
  --color-red-700: var(--erp-danger-text);
  --color-red-800: var(--erp-danger-text);
  --color-green-50: var(--erp-success-soft);
  --color-green-100: var(--erp-success-soft);
  --color-green-200: var(--erp-success);
  --color-green-300: var(--erp-success);
  --color-green-600: var(--erp-success);
  --color-green-700: var(--erp-success-text);
  --color-green-800: var(--erp-success-text);
  --color-amber-50: var(--erp-warning-soft);
  --color-amber-100: var(--erp-warning-soft);
  --color-amber-200: var(--erp-warning);
  --color-amber-300: var(--erp-warning);
  --color-amber-500: var(--erp-warning);
  --color-amber-800: var(--erp-warning-text);
  --color-orange-50: var(--erp-warning-soft);
  --color-orange-100: var(--erp-warning-soft);
  --color-orange-200: var(--erp-warning);
  --color-orange-300: var(--erp-warning);
  --color-orange-600: var(--erp-warning);
  --color-orange-700: var(--erp-warning-text);
  --color-orange-800: var(--erp-warning-text);
  --color-rose-50: var(--erp-danger-soft);
  --color-rose-700: var(--erp-danger-text);
  --bg: var(--erp-bg);
  --surface: var(--erp-surface);
  --surface-2: var(--erp-surface-muted);
  --text: var(--erp-text);
  --muted: var(--erp-text-muted);
  --line: var(--erp-border);
  --primary: var(--erp-primary);
  --primary-2: var(--erp-primary-hover);
  --action-new-bg: var(--erp-primary);
  --action-new-border: var(--erp-primary);
  --action-new-text: var(--erp-surface);
  --action-new-hover-bg: var(--erp-primary-hover);
  --action-edit-bg: var(--erp-info-fill);
  --action-edit-border: var(--erp-info-fill);
  --action-edit-text: var(--erp-surface);
  --action-edit-hover-bg: color-mix(in srgb, var(--erp-info-fill) 88%, var(--erp-sidebar));
  --action-save-bg: var(--erp-success-fill);
  --action-save-border: var(--erp-success-fill);
  --action-save-text: var(--erp-surface);
  --action-save-hover-bg: color-mix(in srgb, var(--erp-success-fill) 88%, var(--erp-sidebar));
  --action-delete-bg: var(--erp-danger);
  --action-delete-border: var(--erp-danger);
  --action-delete-text: var(--erp-surface);
  --action-delete-hover-bg: color-mix(in srgb, var(--erp-danger) 88%, var(--erp-sidebar));
  --action-cancel-bg: transparent;
  --action-cancel-border: var(--erp-border);
  --action-cancel-text: var(--erp-text);
  --action-cancel-hover-bg: var(--erp-primary-hover);
  --action-cancel-hover-border: var(--erp-primary-hover);
  --action-cancel-hover-text: var(--erp-surface);
  --action-export-bg: var(--erp-primary-soft);
  --action-export-border: var(--erp-primary-soft-strong);
  --action-export-text: var(--erp-primary-hover);
  --action-export-hover-bg: var(--erp-primary-soft-strong);
  --erp-button-radius: 10px;
  --erp-button-compact-radius: 8px;
  --erp-chip-radius: var(--erp-button-compact-radius);
  --erp-round-radius: 999px;
  --erp-section-gap: 8px;
  --radius: 14px;
  --shadow: 0 10px 24px rgba(17, 24, 39, 0.08);
  --fs-base: 13px;
  --fs-small: 12px;
}

* {
  box-sizing: border-box;
}

.hidden {
  display: none !important;
}

html,
body {
  height: 100%;
}

:where(small) {
  font-size: var(--fs-small);
}

body {
  margin: 0;
  font-family: Manrope, Segoe UI, sans-serif;
  font-size: var(--fs-base);
  color: var(--text);
  background: var(--bg);
  overflow-y: auto;
}

.shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  transition: grid-template-columns 0.22s ease;
}

/* Desktop only (DEC-CORE-034, UI_CONVENTIONS §14 and §17): the ERP is designed from 1280 px, works from 1024 px,
   and below that keeps this layout while the browser scrolls sideways; phones are not served by these screens.
   1000px, not 1024: a 1024 px window leaves the page 1024 less its own vertical scrollbar. On screen only, so a
   printed page keeps the paper's width. */
@media screen {
  .shell {
    min-width: 1000px;
  }
}

.sidebar {
  background: linear-gradient(180deg, var(--erp-sidebar-top), var(--erp-sidebar));
  color: var(--erp-sidebar-text-soft);
  padding: 14px 10px;
  min-width: 0;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: scroll;
  overflow-x: hidden;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: rgba(148, 163, 184, 0.72) transparent;
  transition: padding 0.22s ease, opacity 0.22s ease;
}

.sidebar::-webkit-scrollbar {
  width: 8px;
}

.sidebar::-webkit-scrollbar-track {
  background: transparent;
}

.sidebar::-webkit-scrollbar-thumb {
  border: 2px solid var(--erp-sidebar);
  border-radius: var(--erp-round-radius);
  background: rgba(148, 163, 184, 0.72);
}


body.sidebar-collapsed .shell {
  grid-template-columns: 76px 1fr;
}

body.sidebar-collapsed .sidebar {
  padding-left: 6px;
  padding-right: 6px;
}

body.sidebar-collapsed .brand {
  justify-content: center;
}

body.sidebar-collapsed .brand-copy {
  display: none;
}

body.sidebar-collapsed .brand-title,
body.sidebar-collapsed .brand-subtitle {
  font-size: 0;
}

body.sidebar-collapsed .menu-group-title {
  display: none;
}

body.sidebar-collapsed .menu a {
  justify-content: center;
  padding: 10px 0;
}

body.sidebar-collapsed .menu a::before {
  content: none;
}

body.sidebar-collapsed .menu-label {
  display: none;
}

body.sidebar-collapsed .menu-icon {
  width: 32px;
  height: 32px;
}

body.sidebar-collapsed .menu-group-toggle::after {
  display: none;
}

body.sidebar-collapsed .menu a.active .menu-icon {
  color: var(--color-blue-300);
}

body.sidebar-collapsed .menu-standalone-link {
  margin-top: 4px;
  padding-top: 6px;
}

/* Supervisor */
.supervisor-page-head {
  padding: 8px 16px;
}

.supervisor-page-head .panel-head {
  margin: 0;
}

.supervisor-head-status,
.supervisor-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.supervisor-tabs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 6px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.supervisor-connectors-table th:last-child { text-align: right; }
.supervisor-connectors-table .supervisor-row-actions { display: grid; grid-template-columns: 96px 116px; justify-content: end; }
.supervisor-connectors-table .supervisor-row-actions .btn { width: 100%; }
.supervisor-row-actions .inline-form { margin: 0; display: flex; }
.supervisor-row-actions .btn { white-space: nowrap; flex: 0 0 auto; }
.supervisor-attention-section .erp-table td:first-child { width: 45%; }

.supervisor-tabs a {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: var(--erp-button-compact-radius);
  color: var(--text);
  background: var(--erp-surface-muted);
  text-decoration: none;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
}

.supervisor-tabs a:hover {
  border-color: var(--erp-primary);
  color: var(--erp-primary);
}

.supervisor-tabs a.active {
  border-color: var(--erp-primary);
  background: var(--erp-primary);
  color: var(--erp-on-accent);
}

.supervisor-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: var(--erp-section-gap);
}

.supervisor-kpi {
  min-height: 76px;
  padding: 10px 12px;
  gap: 4px;
  border-left: 4px solid var(--erp-border-strong);
}

.supervisor-kpi strong {
  font-size: 18px;
  line-height: 1.2;
}

a.supervisor-kpi { color: inherit; text-decoration: none; }
a.supervisor-kpi:hover { border-color: var(--erp-primary); }
a.supervisor-kpi:focus-visible { outline: 2px solid var(--erp-primary); outline-offset: 2px; }
.investment-table-pagination { margin-top: 8px; justify-content: space-between; }
.investment-table-pagination select { width: 84px; min-width: 84px; }
.investment-table-pagination .enhanced-select { flex: 0 0 84px; width: 84px; }
.supervisor-task-chips { margin-bottom: 8px; }
.supervisor-task-pagination,
.table-pagination { margin-top: 8px; }
.table-pagination > form { flex-wrap: nowrap; }
.supervisor-task-pagination select,
.supervisor-task-pagination .enhanced-select,
.table-pagination select,
.table-pagination .enhanced-select { flex: 0 0 84px; width: 84px; }

.supervisor-kpi-primary { border-left-color: var(--erp-primary); }
.supervisor-kpi-success { border-left-color: var(--color-green-600); }
.supervisor-kpi-warning { border-left-color: var(--erp-warning); }
.supervisor-kpi-danger { border-left-color: var(--erp-danger); }

.supervisor-table {
  min-width: 980px;
}

.supervisor-table th,
.supervisor-table td {
  vertical-align: middle;
}

.supervisor-table td {
  overflow-wrap: anywhere;
}

.supervisor-filter-grid,
.supervisor-connector-form {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  align-items: end;
}

.supervisor-filter-grid-runs {
  grid-template-columns: minmax(240px, 2fr) repeat(2, minmax(180px, 1fr));
}

.supervisor-filter-grid .field,
.supervisor-connector-form .field {
  min-width: 0;
}

.supervisor-filter-grid label,
.supervisor-connector-form label {
  font-size: 12px;
  font-weight: 600;
}

.supervisor-connector-form {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.supervisor-field-name,
.supervisor-field-endpoint {
  grid-column: span 2;
}

.supervisor-connector-form > .checkbox-row {
  min-height: 40px;
  align-self: end;
}

.supervisor-capability {
  display: inline-flex;
  margin: 2px 4px 2px 0;
  padding: 2px 6px;
  border: 1px solid var(--erp-border);
  border-radius: var(--erp-chip-radius);
  background: var(--erp-surface-muted);
  color: var(--muted);
  font-size: 10px;
  font-weight: 600;
}

.note-badge-status.supervisor-status-success,
.note-badge-status.supervisor-run-succeeded,
.note-badge-status.supervisor-connector-healthy {
  border-color: var(--color-green-300);
  background: var(--color-green-50);
  color: var(--color-green-800);
}

.note-badge-status.supervisor-status-failure,
.note-badge-status.supervisor-run-failed,
.note-badge-status.supervisor-connector-degraded,
.note-badge-status.supervisor-connector-offline {
  border-color: var(--erp-danger-soft);
  background: var(--erp-danger-soft);
  color: var(--erp-danger-text);
}

.note-badge-status.supervisor-status-cancelled,
.note-badge-status.supervisor-run-cancelled,
.note-badge-status.supervisor-connector-disabled {
  border-color: var(--erp-border);
  background: var(--erp-surface-muted);
  color: var(--muted);
}

.note-badge-status.supervisor-run-running {
  border-color: var(--color-blue-300);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
}

.note-badge-status.supervisor-status-warning,
.note-badge-status.supervisor-run-pending,
.note-badge-status.supervisor-connector-unconfigured {
  border-color: var(--color-orange-300);
  background: var(--color-orange-50);
  color: var(--color-orange-800);
}

.supervisor-danger-text {
  color: var(--erp-danger-text);
  font-weight: 700;
}

.sidebar {
  width: 220px;
  min-width: 220px;
  max-width: 220px;
}

body.sidebar-collapsed .sidebar {
  width: 76px;
  min-width: 76px;
  max-width: 76px;
  padding: 6px;
}

body.sidebar-collapsed .brand {
  gap: 0;
  margin-bottom: 4px;
}

body.sidebar-collapsed .brand-logo {
  width: 44px;
  height: 44px;
}

body.sidebar-collapsed .menu {
  gap: 0;
}

body.sidebar-collapsed .menu a {
  min-height: 34px;
  padding: 2px 0;
  border-radius: 8px;
}

body.sidebar-collapsed .menu-icon {
  width: 28px;
  height: 28px;
}

body.sidebar-collapsed .menu-standalone-link {
  margin-top: 2px;
  padding-top: 2px;
}

.brand {
  display: grid;
  gap: 2px;
  margin-bottom: 14px;
  justify-items: center;
}

.brand-logo {
  width: 78px;
  height: 78px;
  object-fit: contain;
}

.brand-copy {
  text-align: center;
  display: grid;
  gap: 2px;
}

.brand-copy small {
  color: var(--erp-sidebar-text);
}

.menu {
  display: grid;
  gap: 2px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.menu-icon-sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.menu-group {
  display: grid;
  gap: 0;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.menu-group > summary {
  list-style: none;
}

.menu-group > summary::-webkit-details-marker {
  display: none;
}

.menu-group + .menu-group {
  margin-top: 0;
}

.menu-group-title {
  display: block;
  color: var(--erp-sidebar-muted);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: none;
  padding: 0 8px;
  margin: 0 0 2px;
  line-height: 1.2;
}

.menu-group-toggle {
  width: 100%;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: rgba(30, 41, 59, 0.28);
  text-align: left;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--erp-sidebar-text);
  padding: 5px 8px;
  border-radius: 8px;
  font: inherit;
  font-size: 11px;
}

.menu-group-toggle::after {
  content: "▾";
  font-size: 11px;
  color: var(--erp-sidebar-text);
  transition: transform 0.16s ease;
}

.menu-group-toggle:hover {
  background: rgba(51, 65, 85, 0.45);
  border-color: rgba(148, 163, 184, 0.42);
}

.menu-group-items {
  display: grid;
  gap: 0;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.menu-group:not([open]) .menu-group-items {
  display: none;
}

.menu-group:not([open]) .menu-group-toggle::after {
  transform: rotate(-90deg);
}

.menu a {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  color: var(--erp-sidebar-text);
  text-decoration: none;
  padding: 6px 9px;
  border-radius: 10px;
  line-height: 1.2;
  font-size: 12px;
}

.menu-icon {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  display: inline-grid;
  place-items: center;
  color: var(--erp-sidebar-text);
  line-height: 1;
}

.menu-svg {
  width: 18px;
  height: 18px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.menu-label {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.menu-standalone-link {
  margin-top: 4px;
  border-top: 1px solid rgba(148, 163, 184, 0.26);
  padding-top: 6px;
}

.menu-dashboard-link {
  margin-top: 0;
  border-top: 0;
  padding-top: 0;
}

.menu a:hover,
.menu a.active {
  background: var(--erp-sidebar);
  color: var(--erp-sidebar-text-strong);
}

.menu a:hover .menu-icon,
.menu a.active .menu-icon {
  color: var(--erp-sidebar-text-strong);
}

.sidebar-menu-tooltip {
  position: fixed;
  z-index: 260;
  max-width: 220px;
  padding: 6px 9px;
  border: 1px solid rgba(148, 163, 184, 0.32);
  border-radius: var(--erp-chip-radius);
  background: var(--erp-sidebar);
  color: var(--erp-sidebar-text-strong);
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.18);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  pointer-events: none;
}

.content-wrap {
  padding: 20px;
  min-width: 0;
  min-height: 100vh;
  height: auto;
  overflow: visible;
}

.topbar {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: var(--erp-section-gap);
}

.topbar h1 {
  margin: 0;
  font-size: 1.1rem;
}

.topbar-title-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.icon-btn {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--color-white);
  color: var(--color-slate-700);
  cursor: pointer;
  font: inherit;
  font-size: 16px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* This row carries full-size buttons, so the icon button takes their 38px (§2). */
.investment-header-actions > .icon-btn {
  width: 38px;
  height: 38px;
  min-height: 38px;
}

.icon-btn:hover {
  background: var(--surface-2);
}

.topbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.global-search-form {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.global-search-form input[type="search"] {
  width: min(380px, 38vw);
  min-width: 180px;
  height: 34px;
  border: 1px solid var(--color-slate-300);
  border-radius: 999px;
  padding: 0 12px;
  font: inherit;
  background: var(--color-white);
}

.global-search-form input[type="search"]:focus {
  outline: none;
  border-color: var(--color-blue-500);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
}

@media (max-width: 1200px) {
  .topbar {
    flex-wrap: wrap;
  }

  .topbar-title-wrap {
    flex: 1 0 140px;
  }

  .topbar-actions {
    flex: 0 0 auto;
    max-width: 100%;
    margin-left: auto;
  }
}

.user-chip {
  font-weight: 600;
  font-size: var(--fs-base);
  padding: 4px 10px 4px 6px;
  border: 1px solid var(--line);
  border-radius: var(--erp-chip-radius);
  background: var(--surface);
  color: inherit;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.user-chip:hover {
  background: var(--surface-2);
}

.user-menu {
  position: relative;
}

.user-menu summary {
  list-style: none;
}

.user-menu summary::-webkit-details-marker {
  display: none;
}

.user-menu[open] .user-chip {
  border-color: var(--color-blue-300);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
}

.user-menu-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  min-width: 180px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--color-white);
  box-shadow: 0 10px 24px rgba(17, 24, 39, 0.12);
  display: grid;
  gap: 2px;
  padding: 6px;
  z-index: 120;
}

.user-menu-item {
  border-radius: 8px;
  padding: 7px 8px;
  text-decoration: none;
  color: var(--erp-text);
  font-weight: 600;
}

.user-menu-item:hover {
  background: var(--color-slate-50);
}

.user-menu-form {
  margin: 0;
}

.user-menu-item-btn {
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  font: inherit;
  cursor: pointer;
}

.user-menu-note {
  display: block;
  padding: 6px 8px 2px;
}

.user-avatar {
  width: 26px;
  height: 26px;
  border-radius: 999px;
  overflow: hidden;
  background: var(--color-blue-100);
  color: var(--color-blue-900);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  border: 1px solid var(--color-blue-200);
  flex: 0 0 auto;
}

.user-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.user-chip-text {
  line-height: 1;
}

.notif-chip {
  border: 1px solid var(--line);
  border-radius: var(--erp-chip-radius);
  padding: 5px 8px;
  background: var(--surface);
  color: inherit;
  text-decoration: none;
  display: inline-flex;
  gap: 6px;
  align-items: center;
}

.notif-icon {
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--color-slate-900);
}

.notif-icon svg {
  width: 18px;
  height: 18px;
  display: block;
}

.notif-chip strong {
  display: inline-flex;
  min-width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
  border-radius: var(--erp-chip-radius);
  background: var(--color-red-600);
  color: var(--erp-on-accent);
  font-size: 11px;
}

.notif-chip.has-unread {
  border-color: var(--color-red-300);
}

.acting-role-chip {
  border: 1px solid var(--color-amber-500);
  background: var(--color-amber-50);
  color: var(--color-amber-800);
  text-decoration: none;
  border-radius: var(--erp-chip-radius);
  padding: 5px 10px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
}

.acting-role-chip:hover {
  background: var(--color-amber-100);
}

.content {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--erp-section-gap);
}

.content > * {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.panel,
.kpi-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.panel {
  padding: 16px;
  /* As a grid item a card takes its track's width; wide content scrolls inside it. */
  min-width: 0;
}

/* One card per level (UI_CONVENTIONS §1): a panel nested in a panel keeps its outline but not a
   second shadow, so existing nested markup reads as one card with sub-sections. */
.panel .panel {
  box-shadow: none;
}

.hero-panel {
  background: linear-gradient(135deg, var(--erp-surface-muted) 0%, var(--color-white) 52%, var(--erp-surface-muted) 100%);
}

.panel-head {
  margin-bottom: 10px;
}

.panel h2,
.kpi-card strong {
  margin: 0;
}

.muted {
  color: var(--muted);
}

/* Error text that is not a whole message block: a failed batch, a blocked action. */
.form-error,
.text-danger {
  color: var(--erp-danger-text);
}

.form-error {
  font-weight: 600;
}

/* A long file path or address shown as code: wraps anywhere instead of widening the page. */
.mono-break {
  display: block;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 12px;
  overflow-wrap: anywhere;
  word-break: break-all;
  white-space: pre-wrap;
}

/* One status chip everywhere (UI_CONVENTIONS §7). Zero specificity, so the scoped chips that
   predate it keep their own look. */
:where(.status-chip) {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  border: 1px solid var(--color-slate-200);
  border-radius: var(--erp-chip-radius);
  padding: 2px 8px;
  background: var(--erp-surface-muted);
  color: var(--erp-text);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

:where(.status-chip.status-open) {
  border-color: var(--color-green-200);
  background: var(--color-green-50);
  color: var(--color-green-700);
}

:where(.status-chip.status-done) {
  border-color: var(--color-blue-200);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
}

:where(.status-chip.status-warning, .status-chip.status-pending) {
  border-color: var(--color-amber-200);
  background: var(--color-amber-50);
  color: var(--color-amber-800);
}

:where(.status-chip.status-danger) {
  border-color: var(--color-red-200);
  background: var(--color-red-50);
  color: var(--color-red-700);
}

/* An overdue row in a table: the same left marker the notification centre uses for urgent rows. */
.erp-table tr.status-row-overdue > td:first-child {
  box-shadow: inset 3px 0 0 var(--erp-danger);
}

.kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.kpi-card {
  padding: 16px;
  display: grid;
  gap: 8px;
}

.kpi-card-inline {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 9px 10px;
}

.kpi-card span {
  color: var(--muted);
}

.btn {
  border: 1px solid var(--action-new-border);
  background: var(--action-new-bg);
  color: var(--action-new-text);
  border-radius: var(--erp-button-radius);
  padding: 9px 14px;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn:hover {
  background: var(--action-new-hover-bg);
  border-color: var(--action-new-hover-bg);
}

.btn-compact {
  padding: 6px 10px;
  min-height: 32px;
  font-size: 12px;
  border-radius: var(--erp-button-compact-radius);
}

.btn-ghost {
  background: var(--action-cancel-bg);
  color: var(--action-cancel-text);
  border-color: var(--action-cancel-border);
}

.btn-ghost:hover {
  background: var(--action-cancel-hover-bg);
  color: var(--action-cancel-hover-text);
  border-color: var(--action-cancel-hover-border);
}

.btn-action-new,
.btn-action-create {
  background: var(--action-new-bg);
  border-color: var(--action-new-border);
  color: var(--action-new-text);
}

.btn-action-new:hover,
.btn-action-create:hover {
  background: var(--action-new-hover-bg);
  border-color: var(--action-new-hover-bg);
}

.btn-action-save {
  background: var(--action-save-bg);
  border-color: var(--action-save-border);
  color: var(--action-save-text);
}

.btn-action-save:hover {
  background: var(--action-save-hover-bg);
  border-color: var(--action-save-hover-bg);
}

.btn-danger,
.btn-action-delete {
  background: var(--action-delete-bg);
  border-color: var(--action-delete-border);
  color: var(--action-delete-text);
}

.btn-danger:hover,
.btn-action-delete:hover {
  background: var(--action-delete-hover-bg);
  border-color: var(--action-delete-hover-bg);
}

.btn-edit,
.btn-action-edit {
  background: var(--action-edit-bg);
  border-color: var(--action-edit-border);
  color: var(--action-edit-text);
}

.btn-edit:hover,
.btn-action-edit:hover {
  background: var(--action-edit-hover-bg);
  border-color: var(--action-edit-hover-bg);
}

.btn-action-cancel,
.btn-action-secondary {
  background: var(--action-cancel-bg);
  color: var(--action-cancel-text);
  border-color: var(--action-cancel-border);
}

.btn-action-cancel:hover,
.btn-action-secondary:hover {
  background: var(--action-cancel-hover-bg);
  color: var(--action-cancel-hover-text);
  border-color: var(--action-cancel-hover-border);
}

.btn-action-export,
.btn-action-print {
  background: var(--action-export-bg);
  border-color: var(--action-export-border);
  color: var(--action-export-text);
}

.btn-action-export:hover,
.btn-action-print:hover {
  background: var(--action-export-hover-bg);
  border-color: var(--action-export-hover-bg);
  color: var(--action-export-text);
}

.messages {
  display: grid;
  gap: 8px;
  margin-bottom: var(--erp-section-gap);
  position: sticky;
  top: 8px;
  z-index: 25;
}

.message {
  border: 1px solid var(--line);
  background: var(--surface);
  border-radius: 12px;
  padding: 10px 12px;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 8px;
}

.message::before {
  content: "●";
  font-size: 10px;
  line-height: 1;
  opacity: 0.8;
}

.message.error {
  border-color: var(--erp-danger-soft);
  color: var(--erp-danger-text);
  background: var(--erp-danger-soft);
}

.message.success {
  border-color: var(--color-green-300);
  color: var(--color-green-800);
  background: var(--color-green-50);
}

.message.warning {
  border-color: var(--color-orange-300);
  color: var(--color-orange-800);
  background: var(--color-orange-50);
}

.message.info {
  border-color: var(--color-blue-300);
  color: var(--color-blue-700);
  background: var(--color-blue-50);
}

.message.is-dismissed {
  opacity: 0;
  transform: translateY(-4px);
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.login-body {
  min-height: 100vh;
  background: var(--color-gray-100);
  display: grid;
  place-items: center;
}

.login-wrap {
  width: min(440px, 92vw);
  display: grid;
  gap: 18px;
}

.login-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 24px;
}

.login-card h1 {
  margin: 0 0 4px;
}

.login-card h2 {
  margin-top: 0;
  margin-bottom: 8px;
}

.login-card p {
  margin-top: 0;
  color: var(--muted);
}

.login-subtitle {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: var(--fs-base);
}

.auth-brand-inline {
  text-align: center;
  display: grid;
  gap: 2px;
  margin-bottom: 8px;
}

.auth-logo-badge {
  width: 112px;
  height: 112px;
  object-fit: contain;
  display: block;
  margin: 0 auto 6px;
}

.auth-brand-inline h1 {
  margin: 0;
  font-size: 2rem;
  line-height: 1.1;
  color: var(--color-slate-900);
}

.stack {
  display: grid;
  gap: 10px;
}

/* A stack never widens the page: a wide table or a long path scrolls or wraps inside its
   own block instead (UI_CONVENTIONS §6). */
.stack > * {
  min-width: 0;
}
/* A container inside the page can always shrink. Without this a one-column grid keeps its
   `auto` track at the min-content of whatever is inside, and the page scrolls sideways -
   measured on the investment workspace at 1366 (UI_CONVENTIONS §1). Controls are left out on
   purpose: a button that shrinks below its label is a different defect. */
:where(.content) :where(div, section, article, form, fieldset, ul, ol, li, dl, dd) {
  min-width: 0;
}

/* A stack of sections spaces them like every other page does (UI_CONVENTIONS §1). */
.stack:has(> .panel) {
  gap: var(--erp-section-gap);
}

.field {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  min-width: 0;
}

.field-inline {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}

.auth-form-row label {
  font-weight: 400;
}

.auth-form-row {
  margin-bottom: 0;
}

.auth-inline-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: -2px 0;
}

.login-view-modern {
  align-items: flex-start;
  padding-top: 5vh;
}

.login-view-modern .login-wrap {
  width: min(460px, 94vw);
}

.login-card-modern {
  display: grid;
  gap: 10px;
  border-radius: 22px;
  padding: 26px;
}

.checkbox-row {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.checkbox-row input[type="checkbox"] {
  width: 16px;
  min-width: 16px;
  height: 16px;
  min-height: 16px;
  margin: 0;
  padding: 0;
  flex: 0 0 16px;
}

.remember-row input {
  width: 14px;
  height: 14px;
  min-width: 14px;
  min-height: 14px;
  padding: 0;
  margin: 0;
  vertical-align: middle;
}

.login-btn {
  width: 100%;
  margin-top: 4px;
}

/* Text-like fields only. Checkboxes and radios are left out via :where(), which keeps
   this rule's specificity exactly as before, so every existing override still wins.
   Before this, a checkbox caught here became a full-width 40px box, and twenty-odd
   features patched it back locally at four different sizes. See UI_CONVENTIONS.md. */
input:where(:not([type="checkbox"]):not([type="radio"])),
select,
textarea {
  width: 100%;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, var(--color-white), var(--color-slate-50));
  color: var(--text);
  border-radius: 10px;
  padding: 9px 11px;
  font: inherit;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}

input:where(:not([type="checkbox"]):not([type="radio"])),
select {
  height: 40px;
}

textarea {
  min-height: 84px;
}

/* Choice controls: one size for every checkbox and radio, at zero specificity, so a
   feature that sizes its own is unaffected and a new one needs no patch. Size only, on
   purpose: a default margin or vertical-align was measured to shift the line boxes
   around existing controls - a users-table cell went from 45px to 30px. */
:where(input[type="checkbox"], input[type="radio"]) {
  width: 16px;
  height: 16px;
}

/* A choice inside a form grid sits on the line of the inputs beside it, not at the
   height of their labels. .field-check is the canonical form; the older pattern of a
   checkbox wrapped in a .field label is mapped to the same result, so existing forms
   are corrected without being rewritten. */
.form-grid > .field-check,
.form-grid > .field:has(> label > input[type="checkbox"]:only-child),
.form-grid > .field:has(> label > input[type="radio"]:only-child) {
  align-self: end;
  min-height: 40px;
}

.form-grid > .field-check,
.form-grid > .field > label:has(> input[type="checkbox"]:only-child),
.form-grid > .field > label:has(> input[type="radio"]:only-child) {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  cursor: pointer;
}

/* Compact grids use 36px fields; the choice slot follows them so the box stays centred
   on the same line (measured 2px off before this). */
.company-form-grid > .field-check,
.company-form-grid > .field:has(> label > input[type="checkbox"]:only-child),
.company-form-grid > .field:has(> label > input[type="radio"]:only-child),
.company-form-grid > .field > label:has(> input[type="checkbox"]:only-child),
.company-form-grid > .field > label:has(> input[type="radio"]:only-child) {
  min-height: 36px;
}

/* The box itself: fixed at 16px so a long label beside it cannot squeeze it. */
.form-grid > .field-check > input[type="checkbox"],
.form-grid > .field-check > input[type="radio"],
.form-grid > .field > label > input[type="checkbox"]:only-child,
.form-grid > .field > label > input[type="radio"]:only-child {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  margin: 0;
}

select {
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
  border-color: var(--erp-border);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 2px rgba(15, 23, 42, 0.04);
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.95)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23475569' d='M6 8 0 2 1.4.6 6 5.2 10.6.6 12 2z'/%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat;
  background-position: center, calc(100% - 12px) 50%;
  background-size: 100% 100%, 12px 8px;
  padding-right: 34px;
}

select:hover {
  border-color: var(--erp-border-strong);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 6px rgba(37, 99, 235, 0.08);
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--color-blue-500);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
  background: var(--color-white);
}

select option {
  background: var(--color-white);
  color: var(--color-slate-900);
}

.enhanced-select-native {
  position: absolute;
  width: 1px !important;
  min-width: 1px !important;
  max-width: 1px !important;
  height: 1px !important;
  min-height: 1px !important;
  opacity: 0;
  pointer-events: none;
}

.enhanced-select {
  position: relative;
  min-width: 0;
  width: 100%;
}

.enhanced-select-trigger {
  width: 100%;
  height: 40px;
  border: 1px solid var(--erp-border);
  border-radius: 10px;
  background: linear-gradient(180deg, var(--color-white), var(--color-slate-50));
  color: var(--color-slate-900);
  font: inherit;
  text-align: left;
  padding: 0 34px 0 11px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.enhanced-select-trigger::after {
  content: "▾";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-slate-500);
  font-size: 12px;
}

.enhanced-select.is-open .enhanced-select-trigger {
  border-color: var(--color-blue-500);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
  background: var(--color-white);
}

.enhanced-select.is-disabled .enhanced-select-trigger {
  cursor: not-allowed;
  opacity: 0.7;
}

.btn.is-disabled,
.btn[aria-disabled="true"] {
  opacity: 0.5;
  pointer-events: none;
}

.enhanced-select-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: var(--color-white);
  box-shadow: 0 10px 24px rgba(17, 24, 39, 0.12);
  padding: 6px;
  display: none;
  z-index: 40;
  max-height: 280px;
  overflow: auto;
}

.enhanced-select.is-open .enhanced-select-menu {
  display: grid;
  gap: 4px;
}

.enhanced-select.opens-up .enhanced-select-menu {
  top: auto;
  bottom: calc(100% + 6px);
}

.enhanced-select-menu.is-floating {
  position: fixed;
  display: grid;
  gap: 4px;
  right: auto;
  bottom: auto;
  z-index: 240;
}

.enhanced-select-option {
  border: 1px solid transparent;
  background: var(--color-white);
  color: var(--color-slate-900);
  border-radius: 8px;
  padding: 7px 8px;
  text-align: left;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}

.enhanced-select-option:hover {
  background: var(--color-slate-50);
  border-color: var(--color-slate-200);
}

.enhanced-select-option.is-active {
  background: var(--color-blue-50);
  border-color: var(--color-blue-200);
  color: var(--color-blue-700);
  font-weight: 600;
}

.enhanced-select-option:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.panel.compact {
  max-width: 900px;
}

.basic-marketing-campaign-form,
.basic-marketing-recipients-panel,
.basic-marketing-recipients-panel > .stack,
.basic-marketing-recipients-panel > .stack > section {
  min-width: 0;
}

.basic-marketing-recipients-panel {
  width: 100%;
  max-width: none;
}

.basic-marketing-recipients-panel .table-wrap {
  max-width: 100%;
}

.basic-marketing-campaign-details-grid .field > label {
  color: var(--color-slate-700);
  font-weight: 600;
}

.panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.panel.is-section-collapsed .panel-head {
  margin-bottom: 0;
}

.panel-head-compact {
  margin-bottom: 6px;
  padding-bottom: 4px;
}

.run-section-title {
  font-size: inherit;
}

.module-placeholder-copy {
  margin: 0;
  font-size: 12px;
  line-height: 1.35;
}

.form-grid {
  margin-top: 14px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.field-full {
  grid-column: 1 / -1;
}

.actions-row {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.appointment-detail-panel {
  width: 100%;
}

.appointment-detail-panel.panel.compact {
  max-width: none;
}

.appointment-detail-panel .actions-row {
  flex-wrap: wrap;
}

.profile-avatar-preview {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 0 12px;
}

.profile-avatar-circle {
  width: 64px;
  height: 64px;
  border-radius: 999px;
  overflow: hidden;
  background: var(--color-blue-100);
  color: var(--color-blue-900);
  border: 1px solid var(--color-blue-200);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 20px;
}

.profile-avatar-circle img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.profile-avatar-meta {
  display: grid;
  gap: 2px;
}

.company-form-layout .field-row {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
}

.company-form-layout .field-row > label {
  padding-top: 10px;
  font-weight: 600;
}

.company-form-layout .field-row-control {
  display: grid;
  gap: 6px;
}

.field-with-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.drop-file {
  position: relative;
  border: 1px dashed var(--color-slate-400);
  border-radius: 10px;
  background: linear-gradient(180deg, var(--color-white), var(--color-slate-50));
  min-height: 78px;
  display: grid;
  align-items: center;
}

.drop-file input[type="file"] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.drop-file-ui {
  display: grid;
  gap: 2px;
  justify-items: center;
  text-align: center;
  padding: 10px;
}

.drop-file-inline-text {
  font-weight: 700;
  color: var(--color-gray-800);
  max-width: 100%;
  overflow-wrap: anywhere;
}

.drop-file-name {
  margin-top: 2px;
}

.drop-file [data-drop-file-size],
.drop-file [data-drop-file-status] {
  line-height: 1.25;
}

.drop-file.has-file {
  border-color: var(--color-blue-400);
  background: var(--erp-surface-muted);
}

.drop-file.has-file [data-drop-file-status] {
  color: var(--color-blue-600);
  font-weight: 700;
}

.drop-file.is-dragover {
  border-color: var(--color-blue-500);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
  background: var(--color-blue-50);
}

.status-tiles {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.status-tiles input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.status-tile {
  border: 1px solid var(--color-slate-300);
  border-radius: var(--erp-chip-radius);
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  user-select: none;
  background: var(--color-slate-50);
  color: var(--color-slate-700);
}

.status-tile-prospect {
  background: var(--color-blue-50);
  color: var(--color-blue-700);
  border-color: var(--color-blue-200);
}

.status-tile-active {
  background: var(--color-green-100);
  color: var(--color-green-800);
  border-color: var(--color-green-300);
}

.status-tile-dormant {
  background: var(--color-orange-50);
  color: var(--color-orange-800);
  border-color: var(--color-orange-200);
}

.status-tile-archived {
  background: var(--color-slate-100);
  color: var(--color-slate-600);
  border-color: var(--color-slate-300);
}

.status-tile-low {
  background: var(--color-slate-50);
  color: var(--color-slate-600);
  border-color: var(--color-slate-300);
}

.status-tile-medium {
  background: var(--color-sky-50);
  color: var(--color-sky-700);
  border-color: var(--color-sky-300);
}

.status-tile-high {
  background: var(--color-orange-50);
  color: var(--color-orange-700);
  border-color: var(--color-orange-300);
}

.status-tile-critical {
  background: var(--color-red-50);
  color: var(--color-red-700);
  border-color: var(--color-red-300);
}

.status-tiles input[type="radio"]:checked + .status-tile {
  outline: 2px solid rgba(37, 99, 235, 0.35);
  outline-offset: 1px;
}

.status-tiles input[type="radio"]:checked + .status-tile-prospect {
  background: var(--erp-primary-hover);
  color: var(--erp-on-accent);
  border-color: var(--color-blue-800);
  outline-color: rgba(29, 78, 216, 0.35);
}

.status-tiles input[type="radio"]:checked + .status-tile-active {
  background: var(--erp-success-fill);
  color: var(--erp-on-accent);
  border-color: var(--color-green-700);
  outline-color: rgba(22, 163, 74, 0.35);
}

.status-tiles input[type="radio"]:checked + .status-tile-dormant {
  background: var(--color-orange-600);
  color: var(--erp-sidebar);
  border-color: var(--color-orange-700);
  outline-color: rgba(234, 88, 12, 0.3);
}

.status-tiles input[type="radio"]:checked + .status-tile-archived {
  background: var(--color-slate-600);
  color: var(--color-white);
  border-color: var(--color-slate-700);
  outline-color: rgba(71, 85, 105, 0.3);
}

.status-tiles input[type="radio"]:checked + .status-tile-low {
  background: var(--color-slate-500);
  color: var(--color-white);
  border-color: var(--color-slate-600);
  outline-color: rgba(100, 116, 139, 0.35);
}

.status-tiles input[type="radio"]:checked + .status-tile-medium {
  background: var(--erp-info-fill);
  color: var(--erp-on-accent);
  border-color: var(--color-sky-700);
  outline-color: rgba(2, 132, 199, 0.35);
}

.status-tiles input[type="radio"]:checked + .status-tile-high {
  background: var(--color-orange-600);
  color: var(--erp-sidebar);
  border-color: var(--color-orange-700);
  outline-color: rgba(234, 88, 12, 0.35);
}

.status-tiles input[type="radio"]:checked + .status-tile-critical {
  background: var(--color-red-600);
  color: var(--erp-on-accent);
  border-color: var(--color-red-700);
  outline-color: rgba(220, 38, 38, 0.35);
}

.company-title-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
}

.company-logo-circle {
  width: 84px;
  height: 84px;
  border-radius: 14px;
  overflow: hidden;
  background: var(--color-white);
  color: var(--color-blue-900);
  border: 1px solid var(--color-blue-200);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 28px;
}

.company-logo-circle img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.company-form-layout .field-full {
  grid-column: 1 / -1;
}

/* Space between the last field (Σημειώσεις) and «Αποθήκευση» (owner, To-do 1.122). */
.contact-form-actions {
  margin-top: 18px;
}

/* Επωνυμία and the logo share the first row, half each (owner, To-do 1.122). */
.company-form-grid > .company-field-half {
  grid-column: span 2;
  align-content: start;
}

/* Settings > Οργανισμός: each address takes three columns and its country the fourth; five phones in a row. */
.company-form-grid > .organization-address-field {
  grid-column: span 3;
}

.organization-phones-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.company-form-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

/* To-do 1.139: only the customer/supplier creation rows use this fixed desktop arrangement. */
.company-create-row.company-form-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: start;
}

.company-create-row.company-create-row-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.company-create-row.company-create-row-three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.company-create-row.company-create-row-extra {
  grid-template-columns: minmax(0, 1fr);
}

/* The saved card keeps each label beside its value (To-do 1.145). */
.kv-grid.company-create-row > .field {
  grid-column: auto;
  flex-direction: row;
  align-items: baseline;
}

.kv-grid.company-create-row > .field strong {
  width: auto;
  overflow-wrap: anywhere;
  white-space: normal;
}

.kv-grid.company-create-row > .field strong > .btn {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}

.kv-grid.company-detail-row > [data-company-field="activity_subject"],
.company-edit-row > [data-company-field="activity_subject"] {
  grid-column: span 2;
}

.kv-grid.company-detail-row > .company-workspace-links {
  grid-column: span 2;
}

.company-edit-row.company-card-workspace-row {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.company-create-row .field:has(> label[for$="logo"]) .drop-file {
  min-height: 38px;
  max-height: 38px;
  height: 38px;
  border-radius: 8px;
}

.company-create-row .field:has(> label[for$="logo"]) .drop-file-ui {
  display: block;
  padding: 0 10px;
  line-height: 36px;
}

.company-create-row .field:has(> label[for$="logo"]) [data-drop-file-name] {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.company-create-row .field:has(> label[for$="logo"]) :is([data-drop-file-size], [data-drop-file-status]) {
  display: none;
}

.company-form-grid .field {
  gap: 4px;
}

.company-form-layout .company-status-field {
  margin-bottom: 6px;
}

.company-form-layout .company-status-field .status-tiles {
  gap: 8px 10px;
  margin-top: 2px;
  margin-bottom: 8px;
}

.company-form-grid label {
  font-size: 12px;
  color: var(--color-slate-600);
}

.company-form-grid input:where(:not([type="checkbox"]):not([type="radio"])),
.company-form-grid select,
.company-form-grid textarea {
  height: 36px;
}

.company-form-grid .enhanced-select-trigger {
  height: 36px;
}

.company-form-grid textarea {
  min-height: 90px;
}

.split-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.entity-list {
  display: grid;
  gap: 10px;
}

.entity-item {
  border: 1px solid var(--color-slate-200);
  border-radius: 10px;
  background: var(--color-slate-50);
  padding: 10px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}

.entity-item h3 {
  margin: 0;
  font-size: var(--fs-base);
}

.investment-company-created-message {
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}

.investment-company-created-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
}

.investment-tree-block {
  border: 0;
  background: transparent;
  padding: 0;
}

.core-announcement-card {
  width: min(620px, calc(100vw - 32px));
  max-height: min(720px, calc(100vh - 32px));
  overflow: auto;
  border-radius: 8px;
}

.core-announcement-heading,
.core-announcement-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.core-announcement-heading h2 {
  margin: 2px 0 0;
  font-size: 1.15rem;
}

.core-announcement-message {
  margin: 16px 0;
  line-height: 1.55;
  white-space: normal;
}

.core-announcement-period {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.core-announcement-actions {
  justify-content: flex-end;
  margin-top: 16px;
}

.announcement-management .panel-head .muted {
  margin: 2px 0 0;
}

.announcement-editor {
  margin: 8px 0 16px;
  padding: 12px 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.announcement-form-grid,
.announcement-target-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.announcement-audience-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.announcement-audience-toggle input {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
}

.announcement-target-grid {
  margin-top: 8px;
}

.announcement-team-list {
  max-height: 220px;
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 6px;
}

.announcement-editor-actions {
  justify-content: flex-end;
  margin-top: 8px;
}

.announcement-table-wrap {
  margin-top: 8px;
}

.announcement-table-wrap .actions-row {
  justify-content: flex-end;
}

.announcement-table-message {
  display: block;
  margin-top: 2px;
}

.investment-list-page,
#investmentCategoryArrangeRoot {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--erp-section-gap);
}

.investment-bucket-panel,
.investment-all-cases-panel,
.investment-program-navigation-panel,
.investment-financial-section {
  padding-top: 8px;
  padding-bottom: 8px;
}

.investment-financial-section,
.investment-financial-section > div[id],
.investment-financial-section form,
.investment-financial-section .investment-financial-overview,
.investment-financial-section .investment-financial-kpi-grid,
.investment-financial-section .table-wrap {
  min-width: 0;
  max-width: 100%;
}

.investment-bucket-panel > .panel-head,
.investment-all-cases-panel > .panel-head,
.investment-program-navigation-panel > .panel-head,
.investment-financial-section > .panel-head {
  border-bottom: 0;
  padding-bottom: 0;
  margin-bottom: 0;
  min-height: 0;
}

.investment-bucket-panel > .panel-head .actions-row,
.investment-all-cases-panel > .panel-head .actions-row,
.investment-program-navigation-panel > .panel-head .actions-row,
.investment-financial-section > .panel-head .actions-row {
  margin-top: 0;
  margin-bottom: 0;
  gap: 6px;
}

.investment-bucket-panel > .panel-head .run-section-title,
.investment-all-cases-panel > .panel-head .run-section-title,
.investment-program-navigation-panel > .panel-head .run-section-title,
.investment-financial-section > .panel-head .run-section-title {
  margin: 0;
  line-height: 1.15;
}

.investment-financial-section > div[id]:not(.is-collapsed) {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.investment-financial-overview {
  margin: 0;
  padding: 0;
  border: 0;
}

.investment-financial-overview > .run-section-title {
  margin: 0 0 8px;
}

.investment-financial-kpi-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(145px, 1fr));
  gap: 8px;
}

.investment-financial-kpi.is-negative,
.financial-negative {
  color: var(--erp-danger-text);
  background: var(--erp-danger-soft);
}

.investment-financial-unallocated {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--erp-border);
  color: var(--erp-text-muted);
}

.investment-financial-unallocated strong {
  color: var(--erp-text);
}

.investment-financial-filters-head,
.investment-financial-columns-head {
  margin: 0;
}

.investment-financial-columns-head {
  padding-top: 8px;
  border-top: 1px solid var(--erp-border);
}

.investment-financial-filters-head .run-section-title,
.investment-financial-columns-head .run-section-title {
  margin: 0;
}

.investment-financial-table-toolbar {
  margin: 0;
  padding: 0 0 8px;
}

.investment-financial-table-toolbar .section-filters {
  margin: 0;
}

.investment-financial-pagination {
  margin-top: 0;
}

.investment-financial-records-section {
  padding-top: 8px;
  padding-bottom: 8px;
}

@media (max-width: 1200px) {
  .investment-financial-kpi-grid {
    grid-template-columns: repeat(3, minmax(145px, 1fr));
  }
}

.investment-bucket-draggable {
  cursor: grab;
}

.investment-bucket-draggable.is-dragging {
  opacity: 0.6;
}

.investment-bucket-draggable.drop-before {
  position: relative;
  box-shadow: inset 0 3px 0 var(--color-blue-500);
  background: var(--erp-surface-muted);
}

.investment-bucket-draggable.drop-after {
  position: relative;
  box-shadow: inset 0 -3px 0 var(--color-blue-500);
  background: var(--erp-surface-muted);
}

.investment-bucket-draggable.drop-before::before,
.investment-bucket-draggable.drop-after::after {
  position: absolute;
  right: 8px;
  font-size: 11px;
  background: var(--erp-primary-hover);
  color: var(--erp-on-accent);
  border-radius: var(--erp-chip-radius);
  padding: 2px 8px;
}

.investment-bucket-draggable.drop-before::before {
  content: "Θα μπει πάνω";
  top: -10px;
}

.investment-bucket-draggable.drop-after::after {
  content: "Θα μπει κάτω";
  bottom: -10px;
}

.investment-tree-head {
  padding: 1px 0 2px;
}

.investment-tree-head .run-section-title {
  margin: 0;
}

.investment-tree-head-program,
.investment-tree-head-section {
  border-left: 0;
  padding-left: 0;
}

.investment-tree-block-program {
  margin-top: 2px;
}

.investment-tree-block-program + .investment-tree-block-program {
  margin-top: 14px;
  padding-top: 10px;
  border-top: 1px solid var(--color-slate-200);
}

.investment-tree-block-section {
  margin-top: 1px;
}

.investment-table-block {
  margin-top: 2px;
}

.investment-table-actions {
  margin: 0 0 2px;
  align-items: center;
}

.table-select-all-label {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  font-size: var(--fs-small);
  color: var(--color-slate-600);
}

.investment-tiles-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.investment-program-tile {
  display: grid;
  gap: 4px;
  padding: 12px;
  color: inherit;
  text-decoration: none;
  transition: transform 0.14s ease, box-shadow 0.14s ease;
}

.investment-program-tile:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 20px rgba(15, 23, 42, 0.12);
}

.investment-program-tile:focus-visible {
  outline: 2px solid rgba(37, 99, 235, 0.36);
  outline-offset: 2px;
}

.investment-program-tile-head {
  margin-bottom: 4px;
}

.investment-program-tile p {
  margin: 0;
  color: var(--color-slate-500);
  font-size: 12px;
  line-height: 1.2;
}

.investment-program-tile .btn {
  justify-self: start;
  margin-top: 2px;
}

.investment-program-milestone {
  margin: 0;
  color: var(--color-slate-600);
  font-size: 11px;
  line-height: 1.25;
}

/* ── Chat workspace ─────────────────────────────────────────────────────────
   Three columns: conversations, thread, details. Every colour comes from the
   shared ERP tokens so the light/dark themes keep working without overrides. */

.panel.compact.chat-workspace {
  position: relative;
  width: 100%;
  max-width: none;
}

.chat-layout {
  display: grid;
  grid-template-columns: 268px minmax(0, 1fr);
  gap: 10px;
  align-items: stretch;
  height: min(72vh, 720px);
}

.chat-layout.has-thread {
  grid-template-columns: 268px minmax(0, 1fr) 248px;
}

.chat-new-conversation-panel {
  border: 1px solid var(--color-border-soft);
  border-radius: 12px;
  background: var(--erp-surface-muted);
  padding: 10px;
  margin: 4px 0 12px;
  display: grid;
  gap: 10px;
}

.chat-new-conversation-panel .form-grid {
  margin-top: 0;
  gap: 10px;
}

.chat-new-conversation-panel .actions-row {
  margin-top: 0;
}

.chat-new-conversation-selected {
  margin-top: 6px;
  flex-wrap: wrap;
  gap: 6px;
}

/* ── Column 1: conversations ─────────────────────────────────────────────── */

.chat-sidebar {
  border: 1px solid var(--color-border-soft);
  border-radius: 14px;
  background: var(--erp-surface);
  padding: 10px;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 8px;
  min-height: 0;
}

.chat-sidebar-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.chat-sidebar-head h3 {
  margin: 0;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.chat-sidebar-count {
  font-size: 11px;
  font-weight: 700;
  color: var(--erp-text-muted);
}

.chat-search {
  position: relative;
  display: flex;
  align-items: center;
}

.chat-search-icon {
  position: absolute;
  inset-inline-start: 9px;
  font-size: 11px;
  opacity: 0.6;
  pointer-events: none;
}

.chat-search input[type="search"] {
  width: 100%;
  padding-inline-start: 26px;
  border-radius: 999px;
  background: var(--erp-surface-muted);
}

.chat-conversation-list {
  overflow: auto;
  display: grid;
  gap: 2px;
  align-content: start;
  min-height: 0;
  margin-inline: -4px;
  padding-inline: 4px;
}

.chat-thread-link {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  border: 1px solid transparent;
  border-radius: 10px;
  padding: 7px 8px;
  color: inherit;
  text-decoration: none;
}

.chat-thread-link:hover {
  background: var(--erp-surface-muted);
}

.chat-thread-link.is-active {
  background: var(--color-blue-100);
  border-color: var(--color-blue-200);
}

.chat-thread-avatar {
  width: 34px;
  height: 34px;
  font-size: 13px;
}

.chat-thread-body {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.chat-thread-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.chat-thread-head time {
  font-size: 10px;
  color: var(--erp-text-muted);
  white-space: nowrap;
  flex: 0 0 auto;
}

.chat-thread-recipient {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.25;
}

.chat-thread-preview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.chat-thread-snippet {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11.5px;
  color: var(--erp-text-muted);
}

.chat-sidebar-empty {
  margin: 8px 4px;
}

.chat-unread-chip {
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  border-radius: var(--erp-chip-radius);
  background: var(--color-blue-600);
  color: var(--erp-on-accent);
  font-size: 11px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

/* Presence marker, shared by every avatar size in Chat. */
.chat-thread-avatar,
.chat-member-avatar,
.chat-details-avatar,
.chat-details-member-avatar {
  position: relative;
  overflow: visible;
}

.chat-thread-avatar img,
.chat-member-avatar img,
.chat-details-avatar img,
.chat-details-member-avatar img {
  border-radius: 999px;
}

.chat-thread-avatar.is-online::after,
.chat-member-avatar.is-online::after,
.chat-details-avatar.is-online::after,
.chat-details-member-avatar.is-online::after {
  content: "";
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: var(--erp-success);
  border: 2px solid var(--erp-surface);
}

/* ── Column 2: thread ────────────────────────────────────────────────────── */

.chat-main {
  border: 1px solid var(--color-border-soft);
  border-radius: 14px;
  background: var(--erp-surface);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.chat-main-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 12px;
  border-bottom: 1px solid var(--color-border-soft);
  background: var(--erp-surface);
}

.chat-main-identity {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.chat-main-avatar {
  width: 34px;
  height: 34px;
  font-size: 13px;
}

.chat-main-identity-text {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.chat-title-input {
  border: 1px solid transparent;
  background: transparent;
  padding: 1px 4px;
  margin: 0;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
  border-radius: 6px;
  width: 100%;
  color: inherit;
}

.chat-title-input:hover:not([readonly]) {
  border-color: var(--color-border-soft);
}

.chat-title-input:focus {
  border-color: var(--color-blue-300);
  background: var(--erp-surface);
}

.chat-main-subline {
  margin: 0;
  padding-inline-start: 4px;
  font-size: 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-main-members {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
}

.chat-member-avatar {
  width: 26px;
  height: 26px;
  font-size: 11px;
  margin-inline-start: -6px;
  border: 2px solid var(--erp-surface);
}

.chat-member-avatar:first-child {
  margin-inline-start: 0;
}

.chat-details-toggle {
  margin-inline-start: 6px;
  border: 1px solid var(--color-border-soft);
  border-radius: 8px;
  background: var(--erp-surface-muted);
  color: var(--erp-text-muted);
  width: 26px;
  height: 26px;
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
  display: none;
}

.chat-messages {
  background: var(--erp-surface-muted);
  padding: 12px 14px;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-height: 0;
}

.chat-empty-thread {
  margin: auto;
}

.chat-day {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 10px 0 6px;
  color: var(--erp-text-muted);
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.chat-day::before,
.chat-day::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--color-border-soft);
}

.chat-msg {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 8px;
  align-items: flex-end;
  max-width: min(78%, 620px);
  margin-right: auto;
}

.chat-msg.is-own {
  grid-template-columns: minmax(0, 1fr) 28px;
  margin-left: auto;
  margin-right: 0;
}

.chat-msg.is-own .chat-msg-avatar {
  order: 2;
}

.chat-msg.is-own .chat-msg-col {
  order: 1;
  justify-items: end;
}

.chat-msg + .chat-msg {
  margin-top: 6px;
}

.chat-msg.is-grouped {
  margin-top: 0;
}

.chat-msg.is-grouped .chat-msg-avatar {
  visibility: hidden;
}

.chat-msg-avatar {
  width: 28px;
  height: 28px;
  font-size: 11px;
  align-self: flex-end;
}

.chat-msg-col {
  display: grid;
  gap: 2px;
  min-width: 0;
  position: relative;
}

.chat-msg-head strong {
  font-size: 11px;
  font-weight: 700;
  color: var(--erp-text-muted);
}

.chat-bubble {
  position: relative;
  border: 1px solid var(--color-border-soft);
  border-radius: 14px 14px 14px 4px;
  background: var(--erp-surface);
  padding: 8px 11px 5px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  min-width: 0;
}

.chat-msg.is-own .chat-bubble {
  border-radius: 14px 14px 4px 14px;
  border-color: var(--color-blue-600);
  background: var(--color-blue-600);
  color: var(--erp-on-accent);
}

.chat-msg.is-own .chat-bubble-foot,
.chat-msg.is-own .chat-bubble-foot time,
.chat-msg.is-own .chat-seen {
  color: rgba(255, 255, 255, 0.82);
}

.chat-msg.is-pinned .chat-bubble {
  box-shadow: 0 0 0 2px var(--erp-warning-soft), 0 1px 2px rgba(15, 23, 42, 0.05);
}

.chat-msg.is-highlighted .chat-bubble {
  box-shadow: 0 0 0 2px var(--color-blue-300);
}

.chat-bubble-pin {
  position: absolute;
  top: -7px;
  inset-inline-end: -5px;
  font-size: 11px;
  line-height: 1;
}

.chat-bubble-text {
  margin: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-size: 12.5px;
  line-height: 1.45;
}

.chat-bubble-foot {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  margin-top: 3px;
  font-size: 10px;
  color: var(--erp-text-muted);
}

.chat-seen {
  font-weight: 600;
}

.chat-expiry-chip {
  cursor: help;
}

.chat-msg-actions {
  position: absolute;
  top: 0;
  inset-inline-end: calc(100% + 4px);
  margin: 0;
  opacity: 0;
  transition: opacity 0.12s ease-in-out;
}

.chat-msg.is-own .chat-msg-actions {
  inset-inline-end: auto;
  inset-inline-start: calc(100% + 4px);
}

.chat-msg:hover .chat-msg-actions,
.chat-msg-actions:focus-within {
  opacity: 1;
}

.chat-msg-action {
  border: 1px solid var(--color-border-soft);
  border-radius: 999px;
  background: var(--erp-surface);
  width: 22px;
  height: 22px;
  padding: 0;
  font-size: 10px;
  line-height: 1;
  cursor: pointer;
}

/* ── Attachments inside a bubble ─────────────────────────────────────────── */

.chat-attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.chat-attachment-image {
  display: block;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--color-border-soft);
  line-height: 0;
}

.chat-attachment-image img {
  width: 116px;
  height: 88px;
  object-fit: cover;
  display: block;
}

.chat-attachment-file {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  max-width: 100%;
  padding: 6px 9px;
  border: 1px solid var(--color-border-soft);
  border-radius: 9px;
  background: var(--erp-surface-muted);
  color: inherit;
  text-decoration: none;
}

.chat-msg.is-own .chat-attachment-file {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.34);
  color: var(--erp-on-accent);
}

.chat-attachment-meta {
  display: grid;
  min-width: 0;
}

.chat-attachment-name {
  font-size: 11.5px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-attachment-size {
  font-size: 10px;
  opacity: 0.75;
}

/* ── Composer ────────────────────────────────────────────────────────────── */

/* Standing reassurance under the thread: the conversation is participant-only
   and stored encrypted. Plain text on purpose - no lock glyph. */
.chat-encryption-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  margin: 0;
  padding: 6px 12px 9px;
  color: var(--erp-text-muted);
  font-size: 10.5px;
  line-height: 1.35;
  text-align: center;
  cursor: help;
}

.chat-encryption-note strong {
  font-weight: 700;
  color: var(--erp-text);
}

.chat-encryption-icon {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  color: var(--erp-success-text);
}

.chat-compose {
  padding: 8px 10px 10px;
  border-top: 1px solid var(--color-border-soft);
  background: var(--erp-surface);
  display: grid;
  gap: 6px;
}

.chat-compose-attachments {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
}

.chat-attachment-chip {
  border: 1px solid var(--color-border-soft);
  border-radius: var(--erp-chip-radius);
  background: var(--erp-surface-muted);
  padding: 2px 8px;
  font-size: 10.5px;
}

.chat-attachment-clear {
  border: none;
  background: none;
  color: var(--erp-danger-text);
  font-size: 10.5px;
  font-weight: 700;
  cursor: pointer;
  padding: 2px 4px;
}

.chat-compose-bar {
  display: flex;
  align-items: flex-end;
  gap: 5px;
  border: 1px solid var(--color-border-soft);
  border-radius: 999px;
  background: var(--erp-surface-muted);
  padding: 5px 6px;
}

/* One shared control height keeps the composer row optically aligned: with
   mixed heights, flex-end lines up the bottoms while the glyphs sit at
   different levels. */
.chat-compose-bar > *,
.chat-compose-bar .chat-compose-icon {
  min-height: 30px;
}

.chat-compose-bar:focus-within {
  border-color: var(--color-blue-300);
  background: var(--erp-surface);
}

.chat-compose-bar textarea {
  flex: 1;
  align-self: stretch;
  min-width: 0;
  height: 30px;
  min-height: 30px;
  max-height: 140px;
  border: none;
  background: transparent;
  resize: none;
  padding: 6px 4px;
  margin: 0;
  font: inherit;
  font-size: 12.5px;
  line-height: 18px;
  color: inherit;
  box-shadow: none;
}

.chat-compose-bar textarea:focus {
  outline: none;
  box-shadow: none;
}

.chat-compose-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  color: var(--erp-text-muted);
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  list-style: none;
  flex: 0 0 auto;
  user-select: none;
}

.chat-compose-icon::-webkit-details-marker {
  display: none;
}

/* Drawn icons instead of emoji: one stroke weight, one colour, identical
   rendering on every platform. */
.chat-icon-svg {
  width: 16px;
  height: 16px;
  display: block;
  flex: 0 0 auto;
}

.chat-send-btn .chat-icon-svg {
  width: 15px;
  height: 15px;
  margin-inline-start: -1px;
}

.chat-expiry-field .chat-icon-svg {
  width: 15px;
  height: 15px;
}

.chat-compose-icon:hover {
  background: var(--color-blue-100);
  color: var(--erp-primary);
}

.chat-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.chat-emoji-menu {
  position: relative;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  height: 30px;
}

.chat-emoji-toolbar {
  position: absolute;
  bottom: calc(100% + 6px);
  inset-inline-end: 0;
  z-index: 20;
  width: 232px;
  max-height: 168px;
  overflow: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  padding: 6px;
  border: 1px solid var(--color-border-soft);
  border-radius: 10px;
  background: var(--erp-surface);
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.16);
}

.chat-emoji-btn {
  border: none;
  background: none;
  cursor: pointer;
  font-size: 15px;
  line-height: 1;
  padding: 3px;
  border-radius: 6px;
}

.chat-emoji-btn:hover {
  background: var(--color-blue-100);
}

.chat-expiry-field {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: 0 0 auto;
  height: 30px;
}

.chat-expiry-field label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  margin: 0;
  font-size: 13px;
  line-height: 1;
  cursor: help;
}

.chat-expiry-field select {
  height: 26px;
  min-height: 26px;
  border: 1px solid transparent;
  border-radius: 8px;
  background-color: transparent;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 12 8'%3E%3Cpath fill='%236b7280' d='M6 8 0 2 1.4.6 6 5.2 10.6.6 12 2z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: calc(100% - 3px) 50%;
  background-size: 10px 7px;
  font-size: 10.5px;
  padding: 0 16px 0 3px;
  margin: 0;
  max-width: 96px;
  width: auto;
  line-height: 26px;
  color: var(--erp-text-muted);
  box-shadow: none;
}

.chat-expiry-field .enhanced-select {
  width: auto;
  max-width: 104px;
}

.chat-expiry-field .enhanced-select-trigger {
  height: 26px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--erp-text-muted);
  font-size: 10.5px;
  padding: 0 17px 0 4px;
  box-shadow: none;
}

.chat-expiry-field .enhanced-select-trigger::after {
  right: 5px;
  font-size: 10px;
}

.chat-expiry-field .enhanced-select-trigger:hover,
.chat-expiry-field .enhanced-select.is-open .enhanced-select-trigger {
  border-color: var(--color-border-soft);
  background: var(--erp-surface);
  box-shadow: none;
}

.chat-expiry-field .enhanced-select-menu,
.chat-expiry-field .enhanced-select.opens-up .enhanced-select-menu {
  left: auto;
  right: 0;
  /* Always upward. app.js picks the direction from free viewport space, but
     .chat-main clips its overflow, so a downward menu is cut off even when the
     window has room. The composer is the last row, so above is always free. */
  top: auto;
  bottom: calc(100% + 6px);
  width: max-content;
  min-width: 100%;
  max-width: 220px;
}

.chat-expiry-field .enhanced-select-option {
  white-space: nowrap;
  font-size: 11.5px;
  padding: 6px 10px;
}

.chat-expiry-field select:hover {
  border-color: var(--color-border-soft);
  background-color: var(--erp-surface);
  box-shadow: none;
}

.chat-expiry-field select:focus {
  border-color: var(--color-blue-300);
  background-color: var(--erp-surface);
  box-shadow: none;
}

.chat-send-btn {
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  border: none;
  border-radius: 999px;
  background: var(--color-blue-600);
  color: var(--erp-on-accent);
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.chat-send-btn:hover {
  background: var(--erp-primary-hover);
}

.chat-empty-state {
  grid-row: 1 / -1;
  display: grid;
  gap: 4px;
  place-content: center;
  justify-items: center;
  text-align: center;
  padding: 24px;
}

.chat-empty-icon {
  font-size: 30px;
  opacity: 0.4;
}

.chat-empty-state h3 {
  margin: 0;
  font-size: 15px;
}

/* ── Column 3: details ───────────────────────────────────────────────────── */

.chat-details {
  border: 1px solid var(--color-border-soft);
  border-radius: 14px;
  background: var(--erp-surface);
  padding: 10px;
  overflow: auto;
  display: grid;
  gap: 8px;
  align-content: start;
  min-height: 0;
}

.chat-details-card {
  display: grid;
  justify-items: center;
  gap: 3px;
  padding: 10px 6px 12px;
  border: 1px solid var(--color-border-soft);
  border-radius: 12px;
  background: var(--erp-surface-muted);
  text-align: center;
}

.chat-details-avatar {
  width: 54px;
  height: 54px;
  font-size: 19px;
  margin-bottom: 3px;
}

.chat-details-name {
  font-size: 12.5px;
  overflow-wrap: anywhere;
}

.chat-details-role {
  font-size: 10.5px;
}

.chat-details-group {
  border: 1px solid var(--color-border-soft);
  border-radius: 10px;
  background: var(--erp-surface);
  padding: 7px 9px;
}

.chat-details-group > summary {
  cursor: pointer;
  font-size: 11.5px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  list-style: none;
}

.chat-details-group > summary::-webkit-details-marker {
  display: none;
}

.chat-details-count {
  font-size: 10px;
  font-weight: 700;
  color: var(--erp-text-muted);
  background: var(--erp-surface-muted);
  border-radius: var(--erp-chip-radius);
  padding: 1px 6px;
}

.chat-details-list,
.chat-details-files,
.chat-details-pinned {
  list-style: none;
  margin: 7px 0 0;
  padding: 0;
  display: grid;
  gap: 5px;
}

.chat-details-list li {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
}

.chat-details-member-avatar {
  width: 24px;
  height: 24px;
  font-size: 10px;
}

.chat-details-member-text {
  display: grid;
  min-width: 0;
}

.chat-details-member-text strong {
  font-size: 11.5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-details-member-text small,
.chat-details-presence {
  font-size: 9.5px;
  color: var(--erp-text-muted);
}

.chat-details-presence {
  color: var(--erp-success-text);
  font-weight: 700;
}

.chat-details-hint {
  margin: 7px 0 0;
  font-size: 9.5px;
  line-height: 1.35;
}

.chat-details-images {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  margin-top: 7px;
}

.chat-details-images img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid var(--color-border-soft);
  display: block;
}

.chat-details-files a,
.chat-details-pinned a {
  display: flex;
  align-items: center;
  gap: 6px;
  color: inherit;
  text-decoration: none;
  border-radius: 7px;
  padding: 4px 5px;
  font-size: 11px;
}

.chat-details-files a:hover,
.chat-details-pinned a:hover {
  background: var(--erp-surface-muted);
}

.chat-details-file-name {
  min-width: 0;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-details-pinned a {
  display: grid;
  gap: 1px;
}

.chat-details-pinned strong {
  font-size: 10.5px;
}

.chat-details-pinned span {
  font-size: 10.5px;
  color: var(--erp-text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-details-pinned small {
  font-size: 9.5px;
  color: var(--erp-text-muted);
}

.chat-details-empty {
  margin: 7px 0 0;
  font-size: 10.5px;
}

@media (max-width: 1280px) {
  .chat-layout.has-thread {
    grid-template-columns: 240px minmax(0, 1fr);
  }

  .chat-details {
    display: none;
  }

  .chat-details.is-open {
    display: grid;
    position: absolute;
    inset-inline-end: 12px;
    top: 96px;
    width: 264px;
    max-height: 64vh;
    z-index: 40;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.2);
  }

  .chat-details-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

.chat-floating-btn {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: 46px;
  height: 46px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--color-blue-600);
  color: var(--erp-on-accent);
  font-size: 22px;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(37, 99, 235, 0.32);
  z-index: 45;
}

.chat-floating-badge {
  position: absolute;
  top: -5px;
  right: -5px;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border: 2px solid var(--color-white);
  border-radius: var(--erp-chip-radius);
  background: var(--color-red-600);
  color: var(--erp-on-accent);
  font-size: 11px;
  font-weight: 800;
  line-height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.chat-floating-btn:hover {
  background: var(--erp-primary-hover);
  color: var(--erp-on-accent);
}

@media (max-width: 1200px) {
  .investment-tiles-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.task-row-checkbox {
  width: 14px;
  height: 14px;
  min-width: 14px;
  min-height: 14px;
  margin: 3px 0 0;
  padding: 0;
}

.task-entity-item {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr);
  justify-content: flex-start;
  align-items: flex-start;
  gap: 8px 10px;
}

.task-list-content {
  flex: 1;
  min-width: 0;
  width: 100%;
}

.task-entry-item-pinned {
  border-color: var(--color-amber-300);
  background: var(--color-amber-50);
  box-shadow: inset 3px 0 0 var(--color-amber-500);
}

.task-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.task-title-row h3 {
  margin: 0;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.task-title-row .actions-row {
  flex: 0 0 auto;
}

.task-row-meta {
  display: grid;
  gap: 6px 14px;
  margin-top: 6px;
  color: var(--color-slate-600);
  font-size: var(--fs-small);
  line-height: 1.35;
}

.task-row-meta-primary {
  grid-template-columns:
    minmax(105px, 0.75fr)
    minmax(145px, 0.9fr)
    minmax(220px, 1.6fr)
    minmax(145px, 0.95fr)
    minmax(145px, 0.95fr);
}

.task-row-meta-secondary {
  grid-template-columns: repeat(2, minmax(220px, 1fr));
}

.task-meta-item {
  min-width: 0;
  overflow-wrap: anywhere;
}

.task-meta-item strong {
  color: var(--color-slate-700);
}

.task-meta-priority {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.task-meta-priority .status-tile {
  padding: 3px 8px;
  line-height: 1;
  cursor: default;
}

.task-meta-context {
  color: var(--color-slate-700);
}

.task-detail-summary {
  margin-top: 6px;
}

.task-detail-meta-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.task-detail-description-row {
  grid-column: 1 / -1;
}

.task-detail-description {
  text-align: left;
}

.task-detail-description .note-body-text,
.task-detail-description p {
  margin-top: 0;
}

@media (max-width: 1180px) {
  .task-row-meta-primary {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }
}

.task-edit-panel .panel-head-compact {
  margin-bottom: 0;
  padding-bottom: 0;
}

.task-edit-panel #taskEditForm:not(.is-collapsed) {
  margin-top: 8px;
}

.panel.is-section-collapsed .collapse-hide-with-panel {
  display: none;
}

.bulk-role-wrap {
  display: inline-block;
  min-width: 300px;
}

.bulk-action-select {
  min-width: 300px;
}

.bulk-role-select {
  width: 100%;
  min-width: 300px;
}

.user-temp-password {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-weight: 600;
}

.user-detail-panel .panel-head {
  align-items: center;
}

.user-detail-kv > div {
  min-height: 36px;
}

.user-detail-kv strong {
  font-weight: 600;
}

.role-editor-actions-sticky {
  position: sticky;
  bottom: 0;
  z-index: 5;
  background: var(--color-white);
  padding-top: 6px;
  padding-bottom: 2px;
  border-top: 1px solid var(--color-slate-200);
}

.roles-permissions-page {
  display: grid;
  gap: var(--erp-section-gap);
}

.roles-permissions-page .panel {
  padding: 14px;
}

.roles-permissions-page .panel-head {
  margin-bottom: 6px;
}

.roles-permissions-page .subsection-head {
  margin-bottom: 4px;
}

.roles-perm-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.role-groups-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  align-items: start;
}

.role-group-column {
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 6px;
}

.role-group-title {
  margin: 0 0 4px;
  font-size: var(--fs-base);
}

.role-group-perms {
  display: grid;
  gap: 4px;
}

.role-perm-item {
  padding: 5px 6px !important;
  gap: 5px !important;
}

.roles-permissions-page .permission-toggle {
  padding: 6px 7px;
  gap: 6px;
}

.roles-permissions-page .permissions-grid + .subsection-head {
  margin-top: 2px !important;
}

@media (max-width: 1100px) {
  .role-groups-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

#myAssignedSelectAll,
#tasksToMeSelectAll {
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: var(--color-blue-700);
}

#usersSelectAll,
.user-row-checkbox {
  width: 14px;
  height: 14px;
  min-width: 14px;
  min-height: 14px;
  margin: 0;
  padding: 0;
  accent-color: var(--color-blue-700);
}

.entity-item p {
  margin: 4px 0 0;
}

.entity-item-emphasis {
  border-color: var(--color-blue-200);
  background: var(--color-blue-50);
}

.entity-meta {
  display: inline-flex;
  gap: 6px;
  align-items: center;
}

.pill {
  border: 1px solid var(--color-border);
  background: var(--color-white);
  border-radius: var(--erp-chip-radius);
  padding: 3px 8px;
  font-size: var(--fs-small);
  color: var(--color-slate-700);
}

.pill-alert {
  border-color: var(--color-amber-500);
  color: var(--color-amber-800);
  background: var(--color-amber-50);
}

.company-header-panel {
  background: linear-gradient(135deg, var(--erp-surface-muted) 0%, var(--color-white) 52%, var(--erp-surface-muted) 100%);
}

.investment-detail-header {
  padding: 12px 14px;
}

.investment-detail-stack {
  display: grid;
  gap: var(--erp-section-gap);
  min-width: 0;
}

.investment-detail-stack > * {
  min-width: 0;
}

.investment-workspace-group,
.investment-workspace-group-body:not(.is-collapsed) {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--erp-section-gap);
  min-width: 0;
}

.investment-workspace-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
  padding: 8px 0;
  border-bottom: 1px solid var(--color-slate-300);
}

.investment-workspace-group-head h2 {
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.investment-workspace-group-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-left: auto;
  min-width: 0;
  max-width: 100%;
}

.investment-stage-view-field {
  flex: 1 1 220px;
  width: 240px;
  max-width: 100%;
  min-width: 0;
}

.investment-stage-view-field select,
.investment-stage-view-field .enhanced-select-trigger {
  min-height: 32px;
  height: 32px;
}

[data-investment-stage][hidden] {
  display: none !important;
}

.investment-header-top {
  align-items: flex-start;
  margin-bottom: 8px;
}

.investment-title-wrap {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.investment-logo-mark {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  border-radius: 8px;
  border: 1px solid var(--color-blue-200);
  background: var(--color-white);
  color: var(--color-blue-800);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  font-size: 17px;
  font-weight: 800;
}

.investment-logo-mark img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.investment-title-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.investment-title-copy h2 {
  font-size: 20px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.investment-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.25;
}

.investment-breadcrumb a {
  color: var(--color-blue-700);
  text-decoration: none;
}

.investment-breadcrumb a:hover {
  text-decoration: underline;
}

.investment-breadcrumb strong {
  color: var(--color-slate-800);
  font-weight: 700;
}

.investment-breadcrumb-meta {
  color: var(--color-slate-700);
  font-weight: 600;
}

.investment-header-actions {
  gap: 6px;
}

.investment-header-facts {
  margin-top: 8px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (min-width: 1281px) {
  .company-header-grid.investment-header-facts { grid-template-columns: repeat(4, minmax(0, 1fr)) repeat(2, minmax(72px, max-content)); }
}

.workspace-header-link > .btn { width: 100%; height: 100%; min-height: 34px; }
.workspace-folder-input { display: flex; gap: 8px; min-width: 0; }
.workspace-folder-input > input { flex: 1 1 auto; min-width: 0; }
.workspace-folder-input > .btn { flex: 0 0 auto; }
.workspace-folder-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.investment-workspace-links-section { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--color-slate-200); }
.investment-workspace-links-section > h3 { margin: 0 0 8px; }
.kv-grid > .company-workspace-links { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; padding: 0; border: 0; background: transparent; }
.company-workspace-links > div { flex: 0 0 auto; }

.investment-header-facts .kpi-inline {
  min-height: 34px;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: 6px;
  border-radius: 8px;
  padding-block: 6px;
}

.investment-header-facts .kpi-inline span {
  flex: 0 0 auto;
  white-space: nowrap;
}

.investment-header-facts .kpi-inline strong {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.investment-status-quick-menu {
  position: relative;
  min-width: 0;
}

.investment-status-quick-menu > summary {
  width: 100%;
  box-sizing: border-box;
  list-style: none;
  cursor: pointer;
}

.investment-status-quick-menu > summary::-webkit-details-marker {
  display: none;
}

.investment-status-quick-menu[open] > summary {
  border-color: var(--color-blue-500);
  box-shadow: 0 0 0 2px var(--color-blue-100);
}

.investment-status-quick-popover {
  position: absolute;
  z-index: 80;
  top: calc(100% + 6px);
  left: 0;
  width: min(360px, calc(100vw - 40px));
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
  box-shadow: var(--shadow);
  padding: 10px;
}

.investment-status-quick-form {
  display: grid;
  gap: 8px;
}

.investment-status-quick-form .field {
  gap: 4px;
}

.investment-status-quick-form [data-investment-status-field][hidden] {
  display: none !important;
}

.investment-status-quick-form select,
.investment-status-quick-form input:where(:not([type="checkbox"]):not([type="radio"])),
.investment-status-quick-form textarea {
  width: 100%;
}

.investment-status-quick-form textarea {
  min-height: 54px;
  resize: vertical;
}

.investment-status-percent-input {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px;
  align-items: stretch;
}

.investment-status-percent-input input {
  border-radius: 7px 0 0 7px;
}

.investment-status-percent-input span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-slate-300);
  border-left: 0;
  border-radius: 0 7px 7px 0;
  background: var(--color-slate-50);
  color: var(--color-slate-700);
  font-weight: 700;
}

.investment-status-quick-actions {
  justify-content: flex-end;
}

.investment-header-deadlines {
  position: relative;
  overflow: visible;
}

.investment-header-deadlines-menu {
  min-width: 0;
}

.investment-header-deadlines-menu summary {
  cursor: pointer;
  font-weight: 700;
  color: var(--color-blue-700);
  white-space: nowrap;
}

.investment-header-deadline-list {
  position: absolute;
  z-index: 40;
  top: calc(100% + 6px);
  right: 0;
  display: grid;
  gap: 4px;
  width: min(380px, 80vw);
  max-height: 320px;
  overflow-y: auto;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
  box-shadow: var(--shadow);
  padding: 6px;
}

.investment-header-deadline-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 2px 8px;
  border: 1px solid var(--color-slate-100);
  border-radius: 6px;
  padding: 6px 8px;
  color: var(--color-slate-800);
  text-decoration: none;
}

.investment-header-deadline-row:hover {
  border-color: var(--color-blue-200);
  background: var(--color-blue-50);
}

.investment-header-deadline-row span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.investment-header-deadline-row small {
  grid-column: 2;
  color: var(--muted);
}

.investment-header-stage-form {
  --investment-header-stage-control-height: 38px;
  display: flex;
  justify-content: end;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 6px;
}

.investment-header-stage-select {
  flex: 0 0 220px;
  width: 220px;
  height: var(--investment-header-stage-control-height);
  min-height: var(--investment-header-stage-control-height);
  max-height: var(--investment-header-stage-control-height);
  padding: 0 34px 0 11px;
  border-radius: 8px;
  font-size: var(--fs-base);
  line-height: normal;
}

.investment-header-stage-form .btn {
  height: var(--investment-header-stage-control-height);
  min-height: var(--investment-header-stage-control-height);
  padding-top: 0;
  padding-bottom: 0;
  border-radius: 8px;
}

.investment-project-team-section {
  padding: 8px 14px;
}

.investment-project-details-section {
  padding: 8px 14px;
}

.investment-project-details-head {
  margin-bottom: 0;
  padding-bottom: 0;
}

.investment-project-details-body:not(.is-collapsed) {
  margin-top: 8px;
}

.investment-project-detail-groups {
  display: grid;
  gap: 8px;
}

.investment-project-detail-group {
  min-width: 0;
}

.investment-project-detail-group + .investment-project-detail-group,
.investment-project-requests-preview {
  padding-top: 8px;
  border-top: 1px solid var(--color-border-soft);
}

.investment-project-detail-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 32px;
  padding: 4px 8px;
  border-bottom: 1px solid var(--color-border-soft);
  background: var(--surface-2);
}

.investment-project-detail-group-head .investment-project-detail-group-title {
  flex: 1 1 auto;
  padding: 0;
  border: 0;
  background: transparent;
}

.investment-project-detail-group-body:not(.is-collapsed) {
  margin-top: 8px;
}

.investment-project-details-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.investment-project-detail-group-title {
  grid-column: 1 / -1;
  margin: 0;
  padding: 5px 8px;
  border-bottom: 1px solid var(--color-border-soft);
  background: var(--surface-2);
  color: var(--color-slate-900);
  font-size: var(--fs-base);
  line-height: 1.2;
}

.investment-project-detail-item {
  min-width: 0;
  min-height: 34px;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: 6px;
  padding-block: 6px;
}

.investment-project-detail-item span {
  flex: 0 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
}

.investment-project-detail-item strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.investment-project-detail-wide {
  grid-column: 1 / -1;
  align-items: flex-start;
}

.investment-project-requests-preview {
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
  max-width: 100%;
}

.investment-project-requests-preview-head,
.investment-project-requests-preview-body,
.investment-project-requests-preview-table-wrap {
  min-width: 0;
  max-width: 100%;
}

.investment-project-requests-preview-head,
.investment-project-requests-preview-title {
  display: flex;
  align-items: center;
}

.investment-project-requests-preview-head {
  justify-content: space-between;
  gap: 8px;
  min-height: 32px;
}

.investment-project-requests-preview-title {
  gap: 8px;
}

.investment-project-requests-preview-body {
  margin-top: 8px;
}

.investment-project-requests-preview-table-wrap {
  margin: 0;
}

.investment-project-requests-preview-table {
  min-width: 980px;
  table-layout: auto;
}

.investment-project-requests-preview-table td {
  vertical-align: middle;
}

.investment-project-detail-financing {
  display: grid;
  grid-template-columns: minmax(190px, 240px) minmax(0, 1fr);
  gap: 8px;
}

.investment-project-financing-items {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 18px;
  min-width: 0;
}

.investment-project-financing-item {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  min-width: 0;
  padding: 3px 0 3px 8px;
  border-left: 2px solid var(--color-slate-200);
}

.investment-project-financing-preapproval {
  color: var(--erp-text-muted);
  font-size: 11px;
}

.investment-project-financing-amount {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.investment-project-aid-ledger {
  display: grid;
  gap: 5px;
  min-width: 0;
  width: 100%;
}

.investment-project-aid-ledger .table-wrap {
  width: 100%;
  margin: 0;
}

.investment-project-aid-ledger-table {
  min-width: 920px;
  table-layout: fixed;
}

.investment-project-aid-ledger-table th,
.investment-project-aid-ledger-table td {
  vertical-align: middle;
  font-variant-numeric: tabular-nums;
}

.investment-table-financing-items {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
  min-width: 360px;
}

.investment-table-financing-item {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  min-width: 0;
  padding: 2px 0 2px 8px;
  border-left: 2px solid var(--color-slate-200);
}

.investment-table-financing-item > span:last-child {
  white-space: nowrap;
}

.investment-project-team-head {
  margin-bottom: 0;
  padding-bottom: 0;
}

.investment-project-team-body:not(.is-collapsed) {
  margin-top: 8px;
}

.investment-stages-section,
.investment-stage-instance-section {
  padding: 8px 14px;
}

.investment-history-section {
  padding: 8px 14px;
}

.investment-document-checklist-section {
  padding: 8px 14px;
}

.investment-stage-section-head {
  margin-bottom: 0;
  padding-bottom: 0;
}

.investment-history-head {
  margin-bottom: 0;
  padding-bottom: 0;
}

.investment-document-checklist-head {
  margin-bottom: 0;
  padding-bottom: 0;
}

.investment-stage-section-head > div:first-child {
  display: grid;
  gap: 2px;
}

.investment-document-checklist-head > div:first-child {
  display: grid;
  gap: 2px;
}

.investment-stage-section-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  margin-left: auto;
}

.investment-stages-body:not(.is-collapsed) {
  margin-top: 8px;
}

.investment-stage-instance-body:not(.is-collapsed) {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.investment-history-body:not(.is-collapsed) {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.investment-history-groups {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.investment-history-stage-group {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.investment-history-stage-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.investment-history-stage-head h3 {
  margin: 0;
  font-size: 13px;
  line-height: 1.2;
}

.investment-history-count {
  min-width: 24px;
  padding: 2px 7px;
  border: 1px solid var(--color-slate-200);
  border-radius: var(--erp-chip-radius);
  background: var(--color-white);
  text-align: center;
  font-size: 11px;
  font-weight: 700;
  color: var(--color-slate-700);
}

.investment-history-filter-chips {
  margin-left: auto;
  flex-wrap: wrap;
}

.investment-history-table-wrap {
  min-width: 0;
  max-width: 100%;
  margin-top: 0;
  overflow-x: auto;
}

table.investment-history-table {
  min-width: 1120px;
  table-layout: fixed;
}

table.investment-history-table td {
  white-space: normal;
  overflow-wrap: anywhere;
}

.investment-history-table .investment-history-date-col { width: 140px; }
.investment-history-table .investment-history-kind-col { width: 104px; }
.investment-history-table .investment-history-meta-col { width: 180px; }
.investment-history-table .investment-history-user-col { width: 150px; }
.investment-history-table .investment-history-action-col { width: 92px; text-align: right; }

.investment-history-kind {
  flex: 0 0 auto;
  padding: 2px 7px;
  border: 1px solid var(--color-slate-200);
  border-radius: var(--erp-chip-radius);
  background: var(--color-slate-50);
  font-size: 11px;
  font-weight: 700;
  color: var(--color-slate-700);
}

.investment-history-kind-tasks {
  border-color: var(--color-blue-200);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
}

.investment-history-kind-notes {
  border-color: var(--color-amber-200);
  background: var(--color-amber-50);
  color: var(--color-amber-800);
}

.investment-history-kind-movements {
  border-color: var(--color-green-200);
  background: var(--color-green-50);
  color: var(--color-green-700);
}

.investment-history-empty {
  margin: 0;
  border: 1px dashed var(--color-slate-200);
  border-radius: 8px;
  padding: 8px;
  text-align: center;
}

.investment-stage-tabs-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  min-width: 0;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
  padding: 6px;
}

.investment-stage-tabs-shell.is-single-tab {
  gap: 0;
  border: 0;
  background: transparent;
  padding: 0;
}

.investment-stage-tabs-shell.is-single-tab .investment-stage-tab-panel {
  min-height: 0;
  border: 0;
  background: transparent;
  padding: 0;
}

.investment-stage-tabs-list {
  display: grid;
  grid-template-columns: repeat(var(--investment-stage-tab-count, 1), minmax(0, 1fr));
  align-items: stretch;
  gap: 6px;
  width: 100%;
  overflow-x: auto;
  scrollbar-width: thin;
}

.investment-stage-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  width: 100%;
  min-height: 30px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  color: var(--color-slate-700);
  padding: 5px 9px;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
  text-align: center;
  white-space: normal;
}

.investment-stage-tab:hover {
  border-color: var(--color-blue-200);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
}

.investment-stage-tab.is-active {
  border-color: var(--color-blue-600);
  background: var(--color-blue-600);
  color: var(--erp-on-accent);
  box-shadow: 0 6px 14px rgba(37, 99, 235, 0.16);
}

.investment-stage-tab-panel {
  display: block;
  min-height: 30px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
  padding: 8px;
}

.investment-stage-revision-control {
  position: relative;
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 40px;
  margin: 8px 8px 8px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 5px 7px;
}

.investment-stage-revision-control.is-locked {
  border-color: var(--color-amber-200);
  background: var(--color-amber-50);
}

.investment-stage-revision-summary,
.investment-stage-revision-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  min-width: 0;
}

.investment-stage-revision-summary .status-chip {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  border: 1px solid var(--color-slate-200);
  border-radius: var(--erp-chip-radius);
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.investment-stage-revision-summary .status-open {
  border-color: var(--color-green-200);
  background: var(--color-green-50);
  color: var(--color-green-700);
}

.investment-stage-revision-summary .status-warning {
  border-color: var(--color-amber-200);
  background: var(--color-amber-100);
  color: var(--color-amber-800);
}

.compact-menu {
  position: relative;
}

.compact-menu > summary {
  list-style: none;
}

.compact-menu > summary::-webkit-details-marker {
  display: none;
}

.compact-menu-popover {
  position: absolute;
  z-index: 30;
  top: calc(100% + 5px);
  right: 0;
  width: min(390px, calc(100vw - 40px));
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.18);
  padding: 8px;
}

.investment-stage-revision-form {
  display: grid;
  gap: 8px;
}

.investment-stage-revision-form p,
.investment-stage-revision-request p {
  margin: 0;
  line-height: 1.4;
}

.investment-stage-revision-history-popover {
  width: min(330px, calc(100vw - 40px));
  padding: 4px;
}

.investment-stage-revision-history-row {
  display: grid;
  gap: 2px;
  border-radius: 6px;
  color: var(--color-slate-900);
  padding: 7px;
  text-decoration: none;
}

.investment-stage-revision-history-row:hover {
  background: var(--color-slate-50);
}

.investment-stage-revision-request {
  flex: 1 0 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 0.8fr);
  align-items: end;
  gap: 10px;
  border-top: 1px solid var(--color-amber-200);
  padding-top: 7px;
}

.investment-stage-revision-request > div {
  display: grid;
  gap: 3px;
}

.investment-stage-revision-review-form {
  display: grid;
  gap: 6px;
}

.investment-stage-revision-review-form .field-inline {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  margin: 0;
}

.investment-date-management-section {
  padding: 8px 14px;
  min-width: 0;
}

.investment-date-management-head {
  margin-bottom: 0;
  padding-bottom: 0;
}

.investment-date-management-body:not(.is-collapsed) {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  margin-top: 8px;
}

.investment-effective-date-wrap,
.investment-date-history-wrap {
  overflow: auto;
}

.investment-effective-date-table th:first-child {
  width: 26%;
}

.investment-effective-date-table th:nth-child(2),
.investment-effective-date-table th:nth-child(3) {
  width: 130px;
}

.investment-effective-date-table th:last-child {
  width: 110px;
}

.investment-effective-date-table .status-chip,
.investment-date-rules-list .status-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  width: max-content;
  border: 1px solid var(--color-slate-200);
  border-radius: var(--erp-chip-radius);
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.investment-effective-date-table .status-open,
.investment-date-rules-list .status-open {
  border-color: var(--color-green-200);
  background: var(--color-green-50);
  color: var(--color-green-700);
}

.investment-date-rules-list .status-warning {
  border-color: var(--color-amber-200);
  background: var(--color-amber-50);
  color: var(--color-amber-800);
}

.investment-date-adjustment-form,
.investment-date-rule-form {
  display: grid;
  gap: 8px;
  border-top: 1px solid var(--color-slate-200);
  padding-top: 8px;
}

.investment-date-adjustment-grid {
  grid-template-columns: minmax(170px, 0.8fr) minmax(160px, 0.7fr) minmax(160px, 0.7fr) minmax(260px, 1.4fr);
}

.investment-date-history-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 32px;
  border-top: 1px solid var(--color-slate-200);
  padding-top: 8px;
}

.investment-date-reason-field {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}

.investment-date-lock-hint {
  margin: 0;
}

.investment-date-history-wrap {
  margin-top: 0;
}

.investment-date-rules-head,
.investment-date-rules-list,
.investment-date-rule-preview {
  padding: 8px 14px;
}

.investment-date-rules-head .panel-head,
.investment-date-rules-list .panel-head,
.investment-date-rule-preview .panel-head {
  margin-bottom: 0;
  padding-bottom: 0;
}

.investment-date-rules-head .panel-head > div:first-child,
.investment-date-rule-preview .panel-head > div:first-child {
  display: grid;
  gap: 2px;
}

.investment-date-rules-head .panel-head p,
.investment-date-rule-preview .panel-head p {
  margin: 0;
}

.investment-date-rule-form {
  margin-top: 8px;
}

.investment-date-rule-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.investment-date-rules-list .table-wrap,
.investment-date-rule-preview .table-wrap {
  margin-top: 8px;
}

.investment-date-rules-list tr.is-selected-row td {
  background: var(--color-blue-50);
}

.investment-snapshot-page {
  display: grid;
  width: 100%;
  min-width: 0;
  gap: var(--erp-section-gap);
}

.investment-snapshot-page-head,
.investment-snapshot-section {
  min-width: 0;
  padding: 10px;
}

.investment-snapshot-page-head h2,
.investment-snapshot-section h3 {
  margin: 0;
}

.investment-snapshot-page-head h2 {
  font-size: 19px;
}

.investment-snapshot-section h3 {
  font-size: 14px;
}

.investment-snapshot-eyebrow {
  margin: 0 0 3px;
  color: var(--color-slate-600);
  font-size: 12px;
}

.investment-snapshot-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
  margin-top: 8px;
}

.investment-snapshot-facts > div {
  display: grid;
  gap: 2px;
  min-width: 0;
  border: 1px solid var(--color-slate-200);
  border-radius: 6px;
  background: var(--color-slate-50);
  padding: 6px 8px;
}

.investment-snapshot-facts span,
.investment-snapshot-hash > span {
  color: var(--color-slate-500);
  font-size: 11px;
}

.investment-snapshot-facts strong {
  overflow-wrap: anywhere;
  font-size: 12px;
}

.investment-snapshot-integrity-ok {
  color: var(--color-green-700);
}

.investment-snapshot-integrity-error {
  color: var(--color-red-700);
}

.investment-snapshot-hash {
  display: grid;
  grid-template-columns: 145px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  margin-top: 7px;
}

.investment-snapshot-hash code {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-all;
  white-space: normal;
  color: var(--color-slate-700);
  font-size: 11px;
}

.investment-snapshot-reason,
.investment-snapshot-comparison-note {
  margin: 7px 0 0;
  font-size: 12px;
}

.investment-snapshot-comparison-note {
  border-left: 3px solid var(--color-blue-500);
  background: var(--color-blue-50);
  padding: 6px 8px;
}

.investment-snapshot-stage-head {
  align-items: center;
}

.investment-snapshot-tabs {
  display: grid;
  min-width: 0;
  gap: 7px;
  margin-top: 8px;
}

.investment-snapshot-tab {
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
  overflow: hidden;
}

.investment-snapshot-tab > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 38px;
  background: var(--color-slate-50);
  padding: 7px 9px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
}

.investment-snapshot-table-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  border-top: 1px solid var(--color-slate-200);
}

.investment-snapshot-section > .investment-snapshot-table-wrap {
  margin-top: 8px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
}

.investment-snapshot-table {
  min-width: 680px;
}

.investment-snapshot-table th,
.investment-snapshot-table td {
  vertical-align: top;
  padding: 7px 9px;
}

.investment-snapshot-table tbody th {
  width: 32%;
  color: var(--color-slate-700);
  font-size: 12px;
  font-weight: 600;
}

.investment-snapshot-table td {
  overflow-wrap: anywhere;
}

.investment-snapshot-table th small,
.investment-snapshot-table td small {
  display: block;
  margin-top: 2px;
  color: var(--color-slate-500);
  font-weight: 400;
}

.investment-snapshot-table tr.is-added td,
.investment-snapshot-table tr.is-added th {
  background: var(--color-green-50);
}

.investment-snapshot-table tr.is-changed td,
.investment-snapshot-table tr.is-changed th {
  background: var(--color-amber-50);
}

.investment-snapshot-change-cell {
  width: 128px;
  white-space: nowrap;
}

.investment-snapshot-change-cell .status-chip {
  display: inline-flex;
  border: 1px solid var(--color-slate-200);
  border-radius: var(--erp-chip-radius);
  padding: 3px 7px;
  font-size: 11px;
  font-weight: 700;
}

.investment-snapshot-change-cell .status-open {
  border-color: var(--color-green-200);
  background: var(--color-green-50);
  color: var(--color-green-700);
}

.investment-snapshot-change-cell .status-warning {
  border-color: var(--color-amber-200);
  background: var(--color-amber-50);
  color: var(--color-amber-800);
}

.investment-snapshot-file-table code {
  font-size: 11px;
}

.investment-snapshot-empty {
  margin: 8px 0 0;
}

.investment-snapshot-removed {
  border-color: var(--color-red-200);
}

.investment-stage-tab-form {
  display: grid;
  gap: 8px;
}

.investment-process-summary {
  display: grid;
  grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.1fr);
  align-items: center;
  gap: 10px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 8px;
}

.investment-process-summary.is-ready {
  border-color: var(--color-green-300);
  background: var(--color-green-50);
}

.investment-process-summary-main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 6px 8px;
  min-width: 0;
}

.investment-process-summary-main strong {
  color: var(--color-slate-800);
  font-size: 12px;
}

.investment-process-progress {
  grid-column: 1 / -1;
  height: 6px;
  overflow: hidden;
  border-radius: var(--erp-chip-radius);
  background: var(--color-slate-200);
}

.investment-process-progress > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--color-green-600);
}

.investment-process-summary-chips {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
}

.investment-process-chip {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border: 1px solid var(--color-slate-300);
  border-radius: var(--erp-chip-radius);
  background: var(--color-white);
  color: var(--color-slate-700);
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.investment-process-chip.is-complete {
  border-color: var(--color-green-300);
  background: var(--color-green-50);
  color: var(--color-green-800);
}

.investment-process-chip.is-progress {
  border-color: var(--color-blue-300);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
}

.investment-process-chip.is-waiting {
  border-color: var(--color-amber-500);
  background: var(--color-amber-50);
  color: var(--color-amber-800);
}

.investment-process-chip.is-correction,
.investment-process-chip.is-critical {
  border-color: var(--color-red-200);
  background: var(--color-red-50);
  color: var(--color-red-700);
}

.investment-stage-repeatable-table.investment-process-workspace-table {
  min-width: 1320px;
}


.investment-stage-repeatable-scroll {
  position: relative;
  max-width: 100%;
  overflow-x: auto;
}

.investment-stage-repeatable-process_rows .investment-stage-repeatable-scroll {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}

.investment-process-workspace-table .readonly-value {
  min-height: 36px;
  display: flex;
  align-items: center;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 6px 9px;
  color: var(--color-slate-800);
  font-size: 12px;
  font-weight: 600;
}

.investment-stage-source-warning {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--color-amber-200);
  border-radius: 8px;
  background: var(--color-amber-50);
  color: var(--color-amber-800);
  padding: 8px 10px;
}

.investment-stage-source-warning strong {
  flex: 0 0 auto;
  font-size: 13px;
}

.investment-stage-source-warning span {
  min-width: 0;
  font-size: 12px;
}

.investment-aid-ledger-warnings {
  display: grid;
  gap: 4px;
  border: 1px solid var(--color-amber-200);
  border-radius: 8px;
  background: var(--color-amber-50);
  color: var(--color-amber-800);
  padding: 8px 10px;
  font-size: 12px;
}

.investment-aid-finalization-card {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(420px, 1.35fr);
  align-items: end;
  gap: 12px;
  margin-top: 8px;
  border: 1px solid var(--color-amber-200);
  border-radius: 8px;
  background: var(--color-amber-50);
  padding: 8px;
}

.investment-aid-finalization-card.is-finalized {
  grid-template-columns: minmax(0, 1fr);
  border-color: var(--color-green-200);
  background: var(--color-green-50);
}

.investment-aid-finalization-copy,
.investment-aid-finalization-form {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.investment-aid-finalization-copy > span,
.investment-aid-finalization-form label {
  color: var(--color-slate-600);
  font-size: 12px;
}

.investment-aid-finalization-title {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.investment-aid-finalization-form {
  grid-template-columns: max-content minmax(180px, 1fr) max-content;
  align-items: center;
}

.investment-aid-finalization-form input:where(:not([type="checkbox"]):not([type="radio"])) {
  min-width: 0;
  width: 100%;
}

.investment-aid-finalization-cancel-form {
  grid-column: 2;
  justify-self: end;
}

.investment-stage-tab-section {
  display: grid;
  gap: 8px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
  padding: 8px;
}

.investment-stage-tab-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 22px;
}

.investment-stage-tab-section-head strong {
  color: var(--color-slate-900);
  font-size: 13px;
}

.investment-stage-tab-section-title-spaced .investment-stage-tab-section-head {
  margin-bottom: 4px;
}

.investment-stage-section-type {
  margin-right: auto;
  color: var(--color-slate-600);
  font-size: 12px;
  font-weight: 600;
}

.investment-stage-engine-bridge {
  display: grid;
  gap: 6px;
  border: 1px dashed var(--color-blue-200);
  border-radius: 8px;
  background: var(--color-blue-50);
  padding: 8px;
}

.investment-stage-engine-bridge-copy {
  display: grid;
  gap: 3px;
}

.investment-stage-engine-bridge-copy strong {
  color: var(--color-blue-800);
  font-size: 13px;
}

.investment-stage-engine-bridge-copy span {
  color: var(--color-slate-700);
  font-size: 12px;
  line-height: 1.4;
}

.investment-stage-engine-bridge-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.investment-stage-engine-bridge-meta span {
  border: 1px solid var(--color-slate-200);
  border-radius: var(--erp-chip-radius);
  background: var(--color-white);
  color: var(--color-slate-700);
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 600;
}

.investment-stage-tab-fields {
  --investment-stage-field-label-width: 182px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.investment-stage-tab-fields [data-stage-conditional-field][hidden] {
  display: none;
}

.investment-stage-tab-fields-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.investment-stage-tab-form-inline .investment-stage-tab-section {
  border: 0;
  border-top: 1px solid var(--color-slate-200);
  border-radius: 0;
  padding: 8px 0;
}

.investment-stage-tab-form-inline > .investment-stage-tab-section:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.investment-stage-tab-fields-inline {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.investment-stage-tab-fields-inline .field {
  display: grid;
  grid-template-columns: var(--investment-stage-field-label-width) minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.investment-stage-tab-fields .field-inline {
  display: grid;
  grid-template-columns: var(--investment-stage-field-label-width) minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.investment-stage-tab-fields .field > label {
  margin: 0;
  color: var(--color-slate-700);
  font-size: 12px;
  font-weight: 600;
}

.investment-stage-tab-fields .field-inline > input:where(:not([type="checkbox"]):not([type="radio"])),
.investment-stage-tab-fields .field-inline > select,
.investment-stage-tab-fields .field-inline > .enhanced-select,
.investment-stage-tab-fields .field-inline > .readonly-value {
  min-width: 0;
  width: 100%;
}

.investment-stage-platform-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: stretch;
  min-width: 0;
  width: 100%;
  height: 40px;
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.investment-stage-platform-link.is-disabled {
  opacity: 0.65;
  pointer-events: none;
  cursor: default;
}

.investment-document-preset-selector {
  display: grid;
  grid-template-columns: minmax(280px, 440px) auto;
  align-items: center;
  justify-content: start;
  gap: 8px;
}

.investment-document-preset-selector .field-inline {
  margin: 0;
}

.enhanced-select-search {
  position: sticky;
  top: 0;
  z-index: 1;
  height: 36px;
  margin: 4px;
  width: calc(100% - 8px);
  background: var(--color-white);
}

/* Searching choosers (crm.choosers, 24/09/2026): the rows found, then «more rows» / «nothing found». */
.enhanced-select-results {
  display: grid;
  gap: 4px;
}

.enhanced-select-results:empty {
  display: none;
}

.enhanced-select-hint {
  margin: 4px 10px 8px;
  color: var(--color-slate-600);
  font-size: 12px;
}

.investment-document-checklist-status {
  display: grid;
  grid-template-columns: 182px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}

.investment-document-checklist-status-label {
  color: var(--color-slate-700);
  font-size: 12px;
  font-weight: 600;
}

.investment-document-checklist-status-value {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.investment-document-checklist-status-value .document-checklist-progress {
  width: min(420px, 100%);
  min-width: 180px;
  text-align: left;
}

.investment-document-checklist-empty-state {
  min-height: 40px;
  display: flex;
  align-items: center;
  border: 1px solid var(--color-slate-200);
  border-radius: 10px;
  background: var(--color-slate-50);
  color: var(--color-slate-500);
  padding: 9px 11px;
  font-size: 12px;
}

.investment-document-checklist-management {
  display: grid;
  gap: 8px;
  border-top: 1px solid var(--color-slate-200);
  padding-top: 8px;
}

.investment-document-checklist-management > strong {
  color: var(--color-slate-900);
  font-size: 13px;
}

.investment-document-checklist-management-table {
  min-width: 980px;
}

.investment-document-checklist-management-table th,
.investment-document-checklist-management-table td {
  vertical-align: middle;
}

.investment-document-checklist-management-table tr.is-highlighted td {
  background: var(--color-blue-50);
}

.investment-document-list-progress {
  width: min(260px, 100%);
  display: grid;
  gap: 4px;
  font-size: 12px;
  color: var(--color-slate-700);
}

.investment-document-checklist-management .status-chip {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border: 1px solid var(--color-slate-200);
  border-radius: var(--erp-chip-radius);
  padding: 4px 8px;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.investment-document-checklist-management .status-open {
  border-color: var(--color-green-200);
  background: var(--color-green-50);
  color: var(--color-green-700);
}

.investment-document-checklist-management .status-done {
  border-color: var(--color-blue-200);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
}

.investment-document-checklist-management .status-warning {
  border-color: var(--color-amber-200);
  background: var(--color-amber-50);
  color: var(--color-amber-800);
}

.btn.is-disabled {
  opacity: 0.55;
  pointer-events: none;
}

.investment-document-checklist-page {
  display: grid;
  gap: var(--erp-section-gap);
}

.investment-document-checklist-page-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
}

.investment-document-checklist-page-head h2 {
  margin: 0 0 3px;
  font-size: 18px;
}

.investment-stage-document-checklists {
  margin-top: 8px;
}

.investment-stage-review-tabs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 4px;
  margin-bottom: 8px;
  border-bottom: 1px solid var(--color-slate-200);
}

.investment-stage-review-tab {
  min-height: 36px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--color-slate-600);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.investment-stage-review-tab.is-active {
  border-bottom-color: var(--color-blue-600);
  color: var(--color-blue-700);
}

.investment-stage-review-panel.is-collapsed {
  display: none;
}

.review-wizard-heading, .review-wizard-navigation, .review-preset-notice {
  display: flex; align-items: center; justify-content: space-between;
  gap: 8px; padding: 8px 0; flex-wrap: wrap;
}
.review-wizard-columns, .investment-stage-check-row.review-wizard-row {
  display: grid; grid-template-columns: minmax(0, 1.4fr) 170px minmax(0, 1fr);
  align-items: center; gap: 12px; padding: 8px 0;
  border-bottom: 1px solid var(--color-slate-200);
}
.review-wizard-columns { color: var(--color-slate-600); font-weight: 600; }
.review-wizard-row > * { min-width: 0; width: 100%; overflow-wrap: anywhere; }
.review-wizard-row textarea { min-height: 38px; height: 38px; resize: none; }
.review-wizard-row .readonly-value { background: transparent; }
.review-wizard-row.review-answer-conflict { background: var(--erp-warning-soft); border-left: 3px solid var(--erp-warning); padding-left: 8px; }
.investment-request-workspace-part + .investment-request-workspace-part { margin-top: 8px; }
.review-conflict-summary ul { margin: 8px 0 0; padding-left: 20px; }
.review-wizard-navigation button { min-width: 105px; }
.investment-review-settings .panel-head { gap: 8px; }
.investment-review-settings { min-width: 0; grid-template-columns: minmax(0, 1fr); }
.settings-master-data #investmentReviewPresets { margin-top: 8px; }

.crm-presets-page { display: grid; gap: 8px; min-width: 0; }
.crm-presets-page-head { width: 100%; box-sizing: border-box; }
.crm-presets-page .panel { padding: 8px 16px; min-width: 0; }
.crm-presets-page .panel-head {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; min-height: 32px;
}
.crm-presets-page .actions-row { margin: 0; gap: 8px; }
.crm-presets-page .panel-head > .actions-row { margin-left: auto; }
.crm-presets-breadcrumbs { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.crm-presets-page .table-field-preset-groups { display: grid; gap: 8px; margin-top: 0 !important; min-width: 0; }
.crm-presets-page .settings-collapsible-body { margin-top: 8px; }
.crm-presets-page .crm-preset-fields { border-top: 1px solid var(--line); padding-top: 8px; min-width: 0; }
.crm-preset-name { margin: 0; line-height: 1.3; font-size: 1em; font-weight: 600; }
.crm-preset-section-title { margin: 0; font-size: 0.84rem; font-weight: 700; }
.crm-preset-active-badge { margin-left: 8px; padding: 1px 7px; font-size: 0.68rem; font-weight: 700; vertical-align: middle; }
.crm-presets-page .crm-preset-toggle-compact {
  align-self: end; min-height: 36px; padding: 0 10px; line-height: 1;
}
.crm-presets-page .erp-table th.col-active,
.crm-presets-page .erp-table td.col-active { width: 92px; text-align: center; white-space: nowrap; }
.crm-presets-page .erp-table th.col-actions,
.crm-presets-page .erp-table td.col-actions { width: 1%; text-align: right; white-space: nowrap; }
.crm-presets-page .table-wrap { max-width: 100%; overflow-x: auto; }
.investment-review-settings > .panel { min-width: 0; max-width: 100%; }
.investment-review-settings .enhanced-select { min-width: 0; max-width: 100%; }
.investment-review-settings .panel-head > span { flex: 1; min-width: 0; }
.investment-review-settings .actions-row { margin-left: auto; flex-shrink: 0; }
.review-preset-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; }
.review-preset-fields label { display: grid; grid-template-columns: 160px minmax(0, 1fr); align-items: center; gap: 8px; }
.review-preset-fields > label:first-child, .review-preset-fields > label:has(textarea) { grid-column: 1 / -1; }
.review-preset-fields .review-preset-checkbox { display: flex; }
.review-preset-checkbox input[type="checkbox"] { width: 16px; height: 16px; min-height: 16px; flex: 0 0 16px; }
.review-preset-select { display: flex; align-items: center; gap: 16px; padding: 8px 0; }
.review-preset-select select { max-width: 700px; }
.review-preset-select > .enhanced-select { flex: 1; width: 0; }
.review-preset-question { border-bottom: 1px solid var(--color-slate-200); padding: 8px 0; }
.review-preset-section { min-width: 0; padding-block: 8px; }
.review-preset-title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.review-preset-section + .review-preset-section { border-top: 1px solid var(--erp-border); }
.investment-review-settings .col-actions { width: 1%; white-space: nowrap; text-align: right; }
.investment-review-override-form { padding-bottom: 8px; border-bottom: 1px solid var(--erp-border); margin-bottom: 8px; }
.investment-review-override-form textarea { min-height: 38px; }
#investmentReviewPresets .panel-head { flex-wrap: wrap; }
#investmentReviewPresets .panel-head > * { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
#investmentReviewPresets .actions-row { flex-wrap: wrap; }
#investmentReviewPresets .review-preset-select select { min-width: 0; width: 100%; }
#investmentReviewPresets .review-preset-section { max-width: 100%; }
#investmentReviewPresets .stack { min-width: 0; grid-template-columns: minmax(0, 1fr); }
.review-history { margin: 8px 0; }
.review-history summary { cursor: pointer; padding: 8px 0; }
.review-history table { min-width: 750px; }

.investment-stage-review-meta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  border: 1px solid var(--color-slate-200);
  border-radius: 6px;
  background: var(--color-slate-50);
  padding: 7px 9px;
}

.investment-stage-review-meta .field-inline {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 12px;
  margin: 0;
}

.investment-stage-review-meta .field-inline > label {
  color: var(--color-slate-700);
  font-weight: 700;
  white-space: nowrap;
}

.investment-stage-review-meta .field-inline > .readonly-value {
  width: auto;
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  line-height: 1.25;
  font-weight: 600;
}

.investment-stage-review-meta .field-inline > select {
  width: min(280px, 100%);
}
.investment-stage-review-state {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.investment-stage-tab-section-body.investment-stage-fields-after-rows {
  display: grid;
  gap: 8px;
}

.investment-stage-fields-after-rows > .investment-stage-repeatable {
  order: 10;
}

.investment-stage-fields-after-rows > .investment-stage-repeatable-own_funds_rows {
  order: 10;
}

.investment-stage-fields-after-rows > .investment-stage-tab-fields {
  order: 50;
}

.investment-stage-fields-after-rows > .investment-stage-repeatable-external_funding_rows {
  order: 30;
}

.investment-stage-liquidity-row {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.investment-stage-fields-after-rows > .investment-stage-funding-grand-total {
  order: 40;
}

.investment-stage-funding-group + .investment-stage-funding-group {
  padding-top: 8px;
  border-top: 1px solid var(--color-slate-200);
}

.investment-stage-funding-subtotal,
.investment-stage-funding-grand-total {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
  min-height: 34px;
  color: var(--color-slate-700);
}

.investment-stage-funding-subtotal strong,
.investment-stage-funding-grand-total strong {
  min-width: 140px;
  text-align: right;
  color: var(--color-slate-900);
}

.investment-stage-funding-grand-total {
  border-top: 1px solid var(--color-slate-300);
  background: var(--color-slate-50);
  padding: 8px;
  font-weight: 700;
}

.investment-stage-repeatable-action-column,
.investment-stage-repeatable-action-cell {
  width: 96px;
  text-align: right;
}

.investment-stage-tab-fields-inline .field > input:where(:not([type="checkbox"]):not([type="radio"])),
.investment-stage-tab-fields-inline .field > select,
.investment-stage-tab-fields-inline .field > .enhanced-select,
.investment-stage-tab-fields-inline .field > .readonly-value {
  min-width: 0;
  width: 100%;
}

.investment-stage-tab-fields textarea {
  min-height: 38px;
  overflow-y: hidden;
  resize: vertical;
}

.investment-stage-multi-select {
  display: grid;
  gap: 6px;
  min-width: 0;
  width: 100%;
  border: 1px solid var(--color-slate-300);
  border-radius: 8px;
  background: var(--color-white);
  padding: 6px;
}

.investment-stage-multi-select-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.investment-stage-multi-select-selected {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  min-width: 0;
}

.investment-stage-multi-select-pill {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  max-width: 100%;
  border: 1px solid var(--color-blue-200);
  border-radius: 8px;
  background: var(--color-blue-50);
  color: var(--color-blue-800);
  padding: 4px 7px;
  font-size: 11px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.investment-stage-multi-select-actions {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
}

.investment-stage-multi-select-actions [hidden] {
  display: none !important;
}
.investment-stage-multi-select-body {
  display: grid;
  gap: 6px;
  border-top: 1px solid var(--color-slate-200);
  padding-top: 6px;
}

.investment-stage-multi-select-body[hidden] {
  display: none;
}

.investment-stage-multi-select-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  align-items: center;
  gap: 6px;
}

.investment-stage-multi-select-toolbar input:where(:not([type="checkbox"]):not([type="radio"])) {
  min-height: 34px;
}

.investment-stage-multi-select-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap: 4px;
  max-height: 260px;
  overflow: auto;
}

.investment-stage-multi-select-option {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  min-width: 0;
  margin: 0;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 6px 8px;
  color: var(--color-slate-800);
  font-size: 12px;
  cursor: pointer;
}

.investment-stage-multi-select-option:hover {
  border-color: var(--color-blue-200);
  background: var(--color-blue-50);
}

.investment-stage-multi-select-option input[type="checkbox"] {
  width: 16px;
  height: 16px;
  min-height: 0;
  margin: 0;
  padding: 0;
}

.investment-stage-tab-fields .investment-stage-file-manager-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
  width: 100%;
}

.investment-stage-file-manager-field > .investment-stage-file-manager {
  grid-column: 1 / -1;
}
.investment-stage-file-manager {
  display: grid;
  gap: 8px;
  min-width: 0;
  width: 100%;
  border-top: 1px solid var(--color-slate-200);
  padding-top: 8px;
}

.investment-stage-file-manager-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 34px;
}

.investment-stage-file-manager-head strong {
  color: var(--color-slate-900);
  font-size: 13px;
}

.investment-stage-file-manager-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
}

.investment-stage-file-location {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.investment-stage-file-location > label {
  margin: 0;
  color: var(--color-slate-800);
  font-size: 12px;
  font-weight: 600;
}
.investment-stage-file-location > input:where(:not([type="checkbox"]):not([type="radio"])),
.investment-stage-file-upload-row > * {
  min-width: 0;
  width: 100%;
}
.investment-stage-file-manager-body,
.investment-stage-saved-files,
.investment-stage-file-upload-rows {
  display: grid;
  gap: 8px;
}

.investment-stage-saved-file {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 8px;
}

.investment-stage-saved-file-main {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.investment-stage-saved-file-main a {
  overflow-wrap: anywhere;
  font-weight: 700;
}

.investment-stage-saved-file-main span,
.investment-stage-file-list span {
  color: var(--muted);
  font-size: 12px;
}

.investment-stage-saved-file-actions {
  grid-column: auto;
  justify-content: flex-end;
}

.investment-stage-file-edit {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  border-top: 1px solid var(--color-slate-200);
  padding-top: 8px;
}

.investment-stage-file-upload-row {
  display: grid;
  grid-template-columns: minmax(240px, 0.8fr) minmax(0, 1.2fr);
  align-items: end;
  gap: 8px;
}

.investment-stage-drop-file {
  height: 38px;
  min-height: 38px;
  max-height: 38px;
  border-radius: 8px;
}

.investment-stage-drop-file .drop-file-ui {
  display: block;
  min-width: 0;
  padding: 0 10px;
  line-height: 36px;
}

.investment-stage-drop-file .drop-file-inline-text {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.investment-stage-drop-file [data-drop-file-size],
.investment-stage-drop-file [data-drop-file-status] {
  display: none;
}

.investment-stage-pending-file {
  min-width: 0;
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 3px 4px 3px 10px;
}

.investment-stage-pending-file > a {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 700;
}

.investment-stage-pending-file-actions {
  grid-column: auto;
  flex: 0 0 auto;
  gap: 4px;
}

.investment-stage-file-comment {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}

.investment-stage-file-comment > label {
  margin: 0;
  white-space: nowrap;
}

.investment-stage-tab-fields-inline .investment-stage-file-manager-field .investment-stage-file-comment {
  grid-template-columns: auto minmax(0, 1fr);
}
.investment-stage-tab-checklist {
  display: grid;
  gap: 0;
}

.investment-stage-tab-checklist-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.investment-stage-tab-checklist-head strong,
.investment-stage-package-card strong {
  color: var(--color-slate-900);
  font-size: 13px;
}

.investment-stage-tab-checklist-head span,
.investment-stage-package-card span {
  color: var(--muted);
  font-size: 12px;
}

.investment-stage-tab-checklist-head > span:only-child {
  margin-left: auto;
}

.investment-stage-tab-checklist-head-actions-only {
  justify-content: flex-end;
}

.investment-stage-check-row {
  display: grid;
  grid-template-columns: 182px minmax(180px, 0.35fr) minmax(0, 1fr);
  gap: 6px;
  align-items: center;
  min-height: 42px;
  padding: 6px 4px;
  border-bottom: 1px solid var(--color-slate-200);
}

.investment-stage-check-row:last-child {
  border-bottom: 0;
}

.investment-stage-check-row.has-conditional-comment {
  grid-template-columns: minmax(320px, 1fr) 170px minmax(220px, 0.8fr);
}

.investment-stage-check-row [hidden] {
  display: none !important;
}

.investment-stage-check-row > label {
  color: var(--color-slate-800);
  font-weight: 600;
  line-height: 1.25;
}

.investment-stage-yes-no-comment-field {
  display: grid;
  grid-template-columns: 182px minmax(180px, 0.35fr) minmax(0, 1fr);
  align-items: center;
  gap: 6px;
}

.investment-stage-yes-no-comment-field > label {
  margin: 0;
}

.investment-stage-tab-fields input[data-stage-liquidity-result] {
  background: var(--color-slate-100);
  color: var(--color-slate-800);
}

.investment-stage-tab-fields input[data-stage-liquidity-result].is-negative {
  border-color: var(--color-red-700);
  background: var(--color-red-50);
  color: var(--color-red-700);
}

.investment-stage-repeatable {
  display: grid;
  gap: 6px;
}

.investment-stage-repeatable-table {
  width: 100%;
  min-width: 760px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0 6px;
}

.investment-stage-documents-table {
  min-width: 1240px;
}

.investment-stage-repeatable-table th {
  color: var(--color-slate-700);
  font-size: 12px;
  font-weight: 600;
  text-align: left;
  padding: 0 4px;
}

.investment-stage-repeatable-table td {
  padding: 0 4px;
}

.investment-stage-repeatable-table input:where(:not([type="checkbox"]):not([type="radio"])),
.investment-stage-repeatable-table textarea,
.investment-stage-repeatable-table select,
.investment-stage-repeatable-table .enhanced-select {
  min-width: 0;
  width: 100%;
}

.investment-stage-message-repeatable {
  gap: 8px;
}

.investment-stage-message-list {
  display: grid;
  gap: 8px;
}

.investment-stage-message-card {
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--erp-surface);
}

.investment-stage-repeatable-row-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.investment-stage-repeatable-row-summary strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.investment-stage-repeatable-row-body {
  display: grid;
  gap: 6px;
}

.investment-stage-message-card.is-collapsed {
  gap: 0;
}

.investment-stage-message-card.is-collapsed .investment-stage-repeatable-row-body {
  display: none;
}

.investment-stage-message-row {
  display: grid;
  gap: 8px;
  align-items: center;
}

.investment-stage-message-row-message,
.investment-stage-message-row-requested {
  grid-template-columns: minmax(0, 1fr);
}

.investment-stage-message-row-meta {
  grid-template-columns: repeat(3, minmax(220px, 1fr));
}

.investment-stage-message-row-status-comments {
  grid-template-columns: 260px 270px minmax(0, 1fr);
  column-gap: 12px;
}

.investment-stage-repeatable-critical_decision_rows .investment-stage-message-row-meta {
  grid-template-columns: minmax(0, 1fr);
}

.investment-stage-repeatable-critical_decision_rows .investment-stage-message-row-requested {
  grid-template-columns: minmax(280px, 0.9fr) 270px minmax(360px, 1.4fr);
}

.investment-stage-repeatable-critical_decision_rows .investment-stage-message-row-message .field-inline,
.investment-stage-repeatable-critical_decision_rows .investment-stage-message-row-meta .field-inline {
  grid-template-columns: 150px minmax(0, 1fr);
}

.investment-stage-repeatable-critical_decision_rows .investment-stage-message-row-requested .field-inline {
  grid-template-columns: max-content minmax(0, 1fr);
}

.investment-stage-repeatable-change_rows .investment-stage-message-row-message {
  grid-template-columns: minmax(320px, 0.65fr) repeat(2, minmax(360px, 1.35fr));
}

.investment-stage-repeatable-change_rows .investment-stage-message-row-meta {
  grid-template-columns: minmax(0, 1fr);
}

.investment-stage-repeatable-change_rows .investment-stage-message-row-message .field-inline,
.investment-stage-repeatable-change_rows .investment-stage-message-row-meta .field-inline {
  grid-template-columns: max-content minmax(0, 1fr);
}

.investment-stage-repeatable-modification_type_results textarea {
  height: 38px;
  min-height: 38px;
  overflow-y: hidden;
  resize: vertical;
}
@media (max-width: 1300px) {
  .investment-stage-repeatable-change_rows .investment-stage-message-row-message {
    grid-template-columns: minmax(0, 1fr);
  }
}
.investment-stage-message-card .field {
  min-width: 0;
}

.investment-stage-message-card .field-inline {
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 6px;
}

.investment-stage-message-field-status {
  grid-template-columns: 72px 176px;
}

.investment-stage-message-field-status .enhanced-select {
  min-width: 170px;
  width: 170px;
}

.investment-stage-message-field-status .enhanced-select-menu {
  min-width: 170px;
}

.investment-stage-message-field-status .enhanced-select-option {
  white-space: nowrap;
}

.investment-stage-message-field-sent-at {
  grid-template-columns: 96px 162px;
}

.investment-stage-message-field-comments {
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 4px;
}

.investment-stage-message-card .field > label {
  margin: 0;
  color: var(--color-slate-700);
  font-size: 12px;
  font-weight: 600;
}

.investment-stage-message-card input:where(:not([type="checkbox"]):not([type="radio"])),
.investment-stage-message-card select,
.investment-stage-message-card textarea,
.investment-stage-message-card .enhanced-select,
.investment-stage-message-card .readonly-value {
  min-width: 0;
  width: 100%;
  min-height: 36px;
}

.investment-stage-message-card textarea {
  height: 36px;
  min-height: 36px;
  overflow-y: hidden;
  resize: vertical;
}

.investment-stage-message-actions {
  justify-content: flex-end;
  padding-top: 2px;
}

.investment-stage-message-delete {
  align-self: center;
  white-space: nowrap;
}

.investment-implementation-requests {
  display: grid;
  gap: 8px;
}

.investment-implementation-request-navigation {
  display: flex;
  align-items: stretch;
  gap: 6px;
  width: 100%;
  overflow-x: auto;
  padding-bottom: 2px;
  scrollbar-width: thin;
}

.investment-stage-records > .investment-implementation-request-navigation {
  justify-content: flex-end;
}

.investment-implementation-request-new {
  flex: 0 0 auto;
  min-height: 32px;
}

.investment-implementation-request-list-section,
.investment-implementation-overview {
  display: grid;
  gap: 8px;
  min-width: 0;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
  padding: 8px;
}

.investment-implementation-overview-head {
  display: flex;
  align-items: center;
  min-height: 32px;
}

.investment-implementation-overview-body {
  min-height: 32px;
}

.investment-implementation-overview-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

.investment-implementation-overview-metric {
  min-width: 0;
}

.investment-implementation-overview-metric > span {
  min-width: 0;
  overflow-wrap: anywhere;
}

@media (max-width: 1100px) {
  .investment-implementation-overview-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.investment-implementation-requests-head,
.investment-stage-tab-checklist-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 32px;
}

.investment-stage-tab-checklist-head.investment-stage-tab-checklist-head-actions-only {
  justify-content: flex-end;
}

.investment-implementation-requests-head > div:first-child,
.investment-stage-tab-checklist-head > div:first-child {
  display: grid;
  gap: 2px;
}

.investment-implementation-request-create {
  border-top: 1px solid var(--color-slate-200);
  padding-top: 8px;
}

.investment-implementation-request-create-grid {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) minmax(250px, 0.7fr) auto auto;
  align-items: center;
  gap: 8px;
}

.investment-implementation-request-create-grid .field,
.investment-implementation-request-meta-grid .field {
  margin: 0;
}


.investment-implementation-request-create-actions {
  flex-wrap: nowrap;
  justify-content: flex-end;
  margin: 0;
}

.investment-implementation-request-table-wrap {
  margin: 0;
}

.investment-implementation-request-table {
  min-width: 1180px;
  table-layout: auto;
}

.investment-implementation-request-table td {
  vertical-align: middle;
}

.investment-implementation-requests .status-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  width: max-content;
  border: 1px solid var(--color-slate-200);
  border-radius: var(--erp-chip-radius);
  background: var(--color-slate-50);
  color: var(--color-slate-700);
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.investment-implementation-requests .status-open {
  border-color: var(--color-green-200);
  background: var(--color-green-50);
  color: var(--color-green-700);
}

.investment-implementation-requests .status-warning {
  border-color: var(--color-amber-200);
  background: var(--color-amber-50);
  color: var(--color-amber-800);
}

.investment-implementation-request-empty {
  min-height: 40px;
  border: 1px dashed var(--color-slate-300);
  border-radius: 8px;
  background: var(--color-slate-50);
  color: var(--color-slate-600);
  padding: 10px;
  text-align: center;
}

.investment-implementation-request-page {
  gap: var(--erp-section-gap);
}

.investment-implementation-request-header,
.investment-implementation-request-tabs-section {
  padding: 8px 14px;
}

.investment-implementation-request-header-top {
  align-items: flex-start;
  margin: 0;
  padding: 0;
}

.investment-implementation-request-header-top h2 {
  margin: 3px 0 0;
  font-size: 18px;
}

.investment-implementation-request-header-top p {
  margin: 2px 0 0;
}

.investment-implementation-request-header-actions {
  flex-wrap: nowrap;
  margin: 0;
}

.investment-implementation-request-actions-menu > summary,
.investment-case-actions-menu > summary {
  white-space: nowrap;
}

.investment-implementation-request-meta-form {
  display: grid;
  gap: 8px;
  margin-top: 8px;
  border-top: 1px solid var(--color-slate-200);
  padding-top: 8px;
}

.investment-implementation-request-meta-grid,
.investment-implementation-request-meta-readonly {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  align-items: center;
  gap: 8px;
}

.investment-implementation-request-meta-actions {
  justify-content: flex-end;
  margin: 0;
}

.investment-implementation-request-delete-form,
.investment-case-delete-form {
  display: grid;
  gap: 8px;
}

.investment-implementation-request-delete-form p,
.investment-case-delete-form p,
.investment-implementation-request-deletion-state p {
  margin: 0;
  line-height: 1.4;
}

.investment-implementation-request-deletion-state {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 0.8fr);
  align-items: center;
  gap: 12px;
  margin-top: 8px;
  border: 1px solid var(--color-red-200);
  border-radius: 8px;
  padding: 8px;
  background: var(--color-red-50);
}

.investment-implementation-request-deletion-state > div:first-child {
  display: grid;
  gap: 3px;
}

.investment-implementation-request-deletion-review-form {
  display: grid;
  gap: 8px;
}

.investment-implementation-request-meta-readonly {
  margin-top: 8px;
  border-top: 1px solid var(--color-slate-200);
  padding-top: 8px;
}

.investment-implementation-request-meta-readonly > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 36px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  padding: 6px 8px;
}

.investment-implementation-request-meta-readonly span {
  color: var(--color-slate-600);
  font-size: 12px;
}

.investment-implementation-request-tabs-section .investment-stage-tabs-shell {
  border: 0;
  padding: 0;
}

.investment-request-service-items,
.investment-request-service-item-list {
  display: grid;
  gap: 8px;
}

.investment-request-service-item {
  display: grid;
  gap: 6px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
  padding: 8px;
}

.investment-request-service-item .field {
  min-width: 0;
  margin: 0;
}

.investment-request-service-item .field-inline {
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 6px;
}

.investment-request-service-item .investment-stage-message-row-status-comments {
  grid-template-columns: 320px 270px minmax(0, 1fr);
}

.investment-request-service-item .investment-stage-message-field-status {
  grid-template-columns: 132px 176px;
}

.investment-request-service-item .investment-stage-message-field-sent-at {
  grid-template-columns: 96px 162px;
}

.investment-request-service-item .investment-stage-message-field-comments {
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 4px;
}

.investment-request-service-item input:where(:not([type="checkbox"]):not([type="radio"])),
.investment-request-service-item select,
.investment-request-service-item textarea,
.investment-request-service-item .enhanced-select,
.investment-request-service-item .readonly-value {
  min-width: 0;
  width: 100%;
  min-height: 36px;
}

.investment-request-service-item textarea {
  height: 36px;
  min-height: 36px;
  overflow-y: hidden;
  resize: vertical;
}

.investment-request-version-bar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--color-slate-200);
}

.investment-request-version-bar > div:first-child {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-right: auto;
}

.investment-request-version-history {
  min-width: 360px;
}

.investment-request-version-history > div {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 2px 8px;
  padding: 6px 0;
  border-bottom: 1px solid var(--color-slate-200);
}

.investment-request-version-history small {
  grid-column: 2;
}

.investment-request-revision-state {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 0.8fr);
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  padding: 8px;
  border: 1px solid var(--color-blue-200);
  border-radius: 8px;
  background: var(--color-blue-50);
}

.investment-request-revision-state > div:first-child {
  display: grid;
  gap: 3px;
}

.investment-request-revision-state p {
  margin: 0;
}

.service-message-fields,
.service-message-reply-body {
  display: grid;
  gap: 8px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.service-message .field-inline {
  grid-template-columns: 148px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}

.service-message-heading,
.service-task-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px 0;
}

.service-message .service-message-status {
  grid-template-columns: max-content 192px;
}

.service-message-status .enhanced-select-option {
  white-space: normal;
}

.service-message-meta,
.service-message-reply-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.service-message-reply-meta {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.service-message-reply {
  min-width: 0;
  border-top: 1px solid var(--color-slate-200);
}

.service-message-tasks:empty {
  display: none;
}

.service-message .investment-stage-file-upload-row {
  grid-template-columns: minmax(240px, 2fr) minmax(0, 3fr);
}

.service-task-modal {
  width: min(1180px, calc(100% - 32px));
  height: min(850px, calc(100% - 32px));
  max-height: calc(100% - 32px);
  padding: 0 12px 12px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
  color: var(--text);
}

.service-task-modal[open] {
  display: flex;
  flex-direction: column;
}

.service-task-modal::backdrop {
  background: rgb(0 0 0 / 35%);
}

.service-task-modal iframe {
  flex: 1;
  width: 100%;
  min-height: 0;
  border: 0;
}

@media (max-width: 1100px) {
  .investment-stage-message-row-meta,
  .investment-stage-message-row-status-comments,
  .investment-stage-repeatable-critical_decision_rows .investment-stage-message-row-requested,
  .investment-implementation-request-create-grid,
  .investment-implementation-request-meta-grid,
  .investment-implementation-request-meta-readonly {
    grid-template-columns: minmax(0, 1fr);
  }

  .investment-request-service-item .investment-stage-message-row-meta,
  .investment-request-service-item .investment-stage-message-row-status-comments {
    grid-template-columns: minmax(0, 1fr);
  }

  .investment-implementation-request-deletion-state {
    grid-template-columns: minmax(0, 1fr);
  }

  .investment-request-version-bar {
    align-items: stretch;
    flex-wrap: wrap;
  }

  .investment-request-revision-state {
    grid-template-columns: minmax(0, 1fr);
  }
}

.investment-stage-tab-totals {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.investment-stage-tab-totals > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
  padding: 6px 8px;
}

.investment-stage-tab-totals span {
  color: var(--muted);
  font-size: 12px;
}

.investment-stage-tab-totals strong {
  color: var(--color-slate-900);
  font-size: 13px;
}

.investment-stage-tab-actions {
  justify-content: flex-end;
}

.investment-stage-package-card {
  display: grid;
  gap: 3px;
  min-height: 48px;
  border: 1px dashed var(--color-slate-300);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 8px 10px;
}

.investment-stage-package-card-live {
  align-content: start;
  gap: 8px;
  border-style: solid;
  background: var(--color-white);
}

.investment-stage-package-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.investment-stage-package-head > div:first-child {
  display: grid;
  gap: 2px;
}

.investment-stage-inline-form {
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 8px;
}

.investment-stage-inline-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.investment-stage-note-grid,
.investment-stage-task-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.investment-stage-field-inline {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
}

.investment-stage-field-inline > label {
  margin: 0;
  white-space: nowrap;
}

.investment-stage-task-form .note-importance-inline-row {
  align-items: center;
}

.investment-stage-task-form .status-tiles {
  margin: 0;
}

.investment-stage-locked-field input[readonly] {
  background: var(--color-slate-100);
  color: var(--color-slate-700);
  cursor: default;
}

.investment-stage-locked-field input[readonly]:focus {
  border-color: var(--color-slate-300);
  box-shadow: none;
}

.investment-stage-start-inline input,
.investment-stage-deadline-inline input {
  min-width: 0;
}

.investment-stage-package-list {
  gap: 6px;
}

.investment-stage-package-row {
  padding: 7px 8px;
}

.investment-stage-package-empty {
  margin: 0;
  border: 1px dashed var(--color-slate-200);
  border-radius: 8px;
  padding: 8px;
  text-align: center;
}

.investment-related-package-section {
  display: grid;
  gap: 0;
  padding-top: 8px;
  padding-bottom: 8px;
}

.investment-related-package-head {
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
}

.investment-related-package-title {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.investment-related-package-body:not(.is-collapsed) {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.investment-related-package-section.is-section-collapsed .investment-related-package-create {
  display: none;
}

.investment-related-note-list {
  gap: 6px;
}

.investment-document-checklist-package {
  display: grid;
  gap: 8px;
  width: 100%;
}

.investment-document-checklist-body:not(.is-collapsed) {
  margin-top: 8px;
}

.investment-document-preset-form {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 8px;
  align-items: end;
  margin-bottom: 8px;
}

.investment-document-checklists {
  display: grid;
  gap: 8px;
}

.investment-document-checklist-block {
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
  overflow: hidden;
}

.investment-document-checklist-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--color-slate-200);
  background: var(--color-slate-50);
}

.investment-document-checklist-summary > div:first-child {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.investment-document-checklist-summary strong {
  color: var(--color-slate-900);
  overflow-wrap: anywhere;
}

.document-checklist-progress {
  min-width: 150px;
  display: grid;
  gap: 4px;
  color: var(--color-slate-700);
  font-size: 12px;
  text-align: right;
}

.document-checklist-progress-track {
  height: 6px;
  border-radius: 999px;
  background: var(--color-slate-200);
  overflow: hidden;
}

.document-checklist-progress-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--erp-success);
}

.document-checklist-category + .document-checklist-category {
  border-top: 1px solid var(--color-slate-200);
}

.investment-document-checklist-category {
  display: grid;
  gap: 6px;
  padding: 8px 10px;
}

.document-checklist-category-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 10px;
  background: var(--color-slate-50);
  color: var(--color-slate-800);
  font-size: 13px;
}

.document-checklist-category-head span {
  color: var(--muted);
  font-size: 12px;
}

.document-checklist-items {
  display: grid;
}

.document-checklist-row {
  display: grid;
  gap: 6px;
  padding: 8px 10px;
  border-top: 1px solid var(--color-slate-100);
  background: var(--color-white);
}

.document-checklist-item-row {
  display: grid;
  gap: 6px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
  padding: 8px;
}

.document-checklist-row.is-done {
  background: var(--color-green-50);
}

.document-checklist-item-row.is-done {
  border-color: var(--color-green-200);
  background: var(--color-green-50);
}

.document-checklist-level-3 {
  padding-left: 26px;
}

.document-checklist-level-4 {
  padding-left: 42px;
}

.document-checklist-check {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--color-slate-900);
  font-weight: 700;
}

.document-checklist-check input {
  flex: 0 0 auto;
}

.document-checklist-check span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.document-checklist-check em {
  margin-left: 6px;
  border: 1px solid var(--color-blue-200);
  border-radius: var(--erp-chip-radius);
  padding: 1px 6px;
  background: var(--color-blue-50);
  color: var(--color-blue-700);
  font-style: normal;
  font-size: 11px;
  font-weight: 700;
}

.document-checklist-item-main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  min-width: 0;
  color: var(--color-slate-900);
}

.document-checklist-item-main input {
  margin-top: 2px;
}

.document-checklist-item-main span {
  display: grid;
  gap: 2px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.document-checklist-item-main em {
  width: fit-content;
  border: 1px solid var(--color-blue-200);
  border-radius: var(--erp-chip-radius);
  padding: 1px 6px;
  background: var(--color-blue-50);
  color: var(--color-blue-700);
  font-style: normal;
  font-size: 11px;
  font-weight: 700;
}

.document-checklist-notes {
  margin: 0;
  font-size: 12px;
}

.document-checklist-body-html {
  border-left: 3px solid var(--color-slate-200);
  padding-left: 8px;
}

.document-checklist-comment-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
}

.document-checklist-comment-row textarea {
  min-height: 36px;
  resize: vertical;
}

.investment-stage-empty {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 34px;
  border: 1px dashed var(--color-slate-300);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 8px 10px;
}

.investment-stage-empty strong {
  color: var(--color-slate-800);
  font-size: 13px;
}

.investment-stage-empty span {
  color: var(--muted);
  font-size: 12px;
  text-align: right;
}

.investment-project-team-grid {
  display: grid;
  grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.investment-project-team-picker .team-member-list {
  max-height: 180px;
}

.investment-project-team-readonly {
  display: grid;
  grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.status-kpi-investment-draft {
  border-color: var(--color-slate-300);
  background: var(--color-slate-100);
}

.status-kpi-investment-draft strong {
  color: var(--color-slate-700);
}

.status-kpi-investment-in_preparation,
.status-kpi-investment-in_review,
.status-kpi-investment-ready_for_submission,
.status-kpi-investment-implementation_not_started,
.status-kpi-investment-in_implementation,
.status-kpi-investment-in_progress,
.status-kpi-investment-under_review {
  border-color: var(--color-blue-200);
  background: var(--color-blue-50);
}

.status-kpi-investment-in_preparation strong,
.status-kpi-investment-in_review strong,
.status-kpi-investment-ready_for_submission strong,
.status-kpi-investment-implementation_not_started strong,
.status-kpi-investment-in_implementation strong,
.status-kpi-investment-in_progress strong,
.status-kpi-investment-under_review strong {
  color: var(--color-blue-800);
}

.status-kpi-investment-submitted,
.status-kpi-investment-approved {
  border-color: var(--color-green-300);
  background: var(--color-green-100);
}

.status-kpi-investment-submitted strong,
.status-kpi-investment-approved strong {
  color: var(--color-green-800);
}

.status-kpi-investment-rejected,
.status-kpi-investment-not_submitted,
.status-kpi-investment-withdrawal_requested,
.status-kpi-investment-withdrawn,
.status-kpi-investment-will_not_implement,
.status-kpi-investment-blocked {
  border-color: var(--color-red-300);
  background: var(--color-red-50);
}

.status-kpi-investment-rejected strong,
.status-kpi-investment-not_submitted strong,
.status-kpi-investment-withdrawal_requested strong,
.status-kpi-investment-withdrawn strong,
.status-kpi-investment-will_not_implement strong,
.status-kpi-investment-blocked strong {
  color: var(--color-red-700);
}

.status-kpi-investment-completed,
.status-kpi-investment-long_term_obligations {
  border-color: var(--color-slate-400);
  background: var(--color-slate-100);
}

.status-kpi-investment-completed strong,
.status-kpi-investment-long_term_obligations strong {
  color: var(--color-slate-800);
}

.status-kpi-investment-pending,
.status-kpi-investment-remedy_request,
.status-kpi-investment-inspection_request_preparation,
.status-kpi-investment-inspection_request_submitted,
.status-kpi-investment-certification_pending,
.status-kpi-investment-needs_action {
  border-color: var(--color-amber-300);
  background: var(--color-amber-50);
}

.status-kpi-investment-pending strong,
.status-kpi-investment-remedy_request strong,
.status-kpi-investment-inspection_request_preparation strong,
.status-kpi-investment-inspection_request_submitted strong,
.status-kpi-investment-certification_pending strong,
.status-kpi-investment-needs_action strong {
  color: var(--color-amber-800);
}

.company-header-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.kpi-inline {
  border: 1px solid var(--color-slate-200);
  background: var(--color-white);
  border-radius: 10px;
  padding: 8px 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.kpi-inline span {
  color: var(--muted);
  font-size: var(--fs-small);
}

.kpi-inline strong {
  line-height: 1.1;
}

.kpi-inline.status-kpi {
  border-width: 2px;
}

.kpi-inline.status-kpi-prospect {
  border-color: var(--color-blue-200);
  background: var(--color-blue-50);
}

.kpi-inline.status-kpi-prospect strong {
  color: var(--color-blue-700);
}

.kpi-inline.status-kpi-active {
  border-color: var(--color-green-300);
  background: var(--color-green-100);
}

.kpi-inline.status-kpi-active strong {
  color: var(--color-green-800);
}

.kpi-inline.status-kpi-dormant {
  border-color: var(--color-orange-300);
  background: var(--color-orange-50);
}

.kpi-inline.status-kpi-dormant strong {
  color: var(--color-orange-700);
}

.kpi-inline.status-kpi-archived {
  border-color: var(--color-slate-300);
  background: var(--color-slate-100);
}

.kpi-inline.status-kpi-archived strong {
  color: var(--color-slate-600);
}

.compact-list {
  max-height: 320px;
  overflow: auto;
}

.table-wrap {
  width: 100%;
  /* As a grid or flex item it must not grow to the table's width - the table scrolls here -
     and it is the positioning box for what is inside, so a popover in a cell scrolls too. */
  position: relative;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
}

.filters-compact {
  margin-top: 2px;
}

.filters-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.table-columns-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.filters-panel .panel-head {
  margin-bottom: 4px;
}

.table-columns-panel .panel-head {
  margin-bottom: 4px;
}

.filters-panel .panel-head-compact {
  padding-bottom: 0;
}

.table-columns-panel .panel-head-compact {
  padding-bottom: 0;
}

.filters-quick-chips {
  display: none;
  margin-top: 4px;
  gap: 6px;
  flex-wrap: wrap;
}

.filters-panel.is-section-collapsed .panel-head {
  margin-bottom: 0;
}

.table-columns-panel.is-section-collapsed .panel-head {
  margin-bottom: 0;
}

.filters-panel.is-section-collapsed .filters-quick-chips {
  display: flex;
}

.filters-quick-chip {
  text-decoration: none;
}

.filters-panel .form-grid {
  margin-top: 4px;
  margin-bottom: 0;
}

.table-columns-panel .form-grid {
  margin-top: 4px;
  margin-bottom: 0;
}

.filters-panel .run-section-title {
  line-height: 1.2;
}

.table-columns-panel .run-section-title {
  line-height: 1.2;
}

.filters-compact .field {
  gap: 4px;
}

.filters-compact .field-inline {
  grid-template-columns: 140px minmax(0, 1fr);
}

.filters-compact label {
  font-size: 12px;
  color: var(--color-slate-600);
}

.filters-compact input:not([type='checkbox']):not([type='radio']),
.filters-compact select {
  height: 34px;
  padding-top: 6px;
  padding-bottom: 6px;
}

.filters-compact .actions-row {
  align-items: flex-end;
}

.investment-columns-picker {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 6px;
  margin-top: 2px;
}

.table-columns-actions {
  margin-top: 8px;
}

.contact-table-filters {
  margin: 0 0 10px;
}

.investment-column-chip {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  min-height: 36px;
  box-sizing: border-box;
  padding: 6px 10px;
  border: 1px solid var(--color-border-soft);
  border-radius: var(--erp-chip-radius);
  background: var(--color-white);
  font-size: 12px;
  color: var(--color-slate-700);
  line-height: 1.1;
}

.investment-column-chip input[type='checkbox'] {
  width: 14px;
  height: 14px;
  margin: 0;
  flex: 0 0 auto;
}

.investment-column-chip span {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}

.investment-column-chip.is-locked {
  background: var(--color-slate-50);
  border-color: var(--color-slate-300);
  color: var(--color-slate-600);
}

.table-actions-wrap {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.selection-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.pending-requests-panel {
  margin-bottom: 10px;
}

.subsection-head {
  margin: 12px 0 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.contact-form-compact .subsection-head {
  margin: 2px 0 2px;
}

.contact-form-compact .form-grid {
  margin-top: 2px;
}

.contact-form-compact .company-form-grid {
  gap: 6px;
}

.contact-form-compact {
  gap: 6px;
}

.contact-form-compact .field {
  gap: 4px;
}

.status-dropdown {
  position: relative;
}

.status-dropdown-trigger {
  width: 100%;
  height: 34px;
  border: 1px solid var(--erp-border);
  border-radius: 10px;
  background: linear-gradient(180deg, var(--color-white), var(--color-slate-50));
  color: var(--color-slate-900);
  font: inherit;
  font-size: 12px;
  text-align: left;
  padding: 0 32px 0 11px;
  cursor: pointer;
  position: relative;
}

.status-dropdown-trigger::after {
  content: "▾";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-slate-500);
  font-size: 12px;
}

.status-dropdown.is-open .status-dropdown-trigger {
  border-color: var(--color-blue-500);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
  background: var(--color-white);
}

.status-dropdown-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: var(--color-white);
  box-shadow: 0 10px 24px rgba(17, 24, 39, 0.12);
  padding: 6px;
  display: none;
  z-index: 30;
}

.status-dropdown.is-open .status-dropdown-menu {
  display: grid;
  gap: 4px;
}

.status-dropdown-option {
  border: 1px solid transparent;
  background: var(--color-white);
  color: var(--color-slate-900);
  border-radius: 8px;
  padding: 7px 8px;
  text-align: left;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}

.status-dropdown-option:hover {
  background: var(--color-slate-50);
  border-color: var(--color-slate-200);
}

.status-dropdown-option.is-active {
  background: var(--color-blue-50);
  border-color: var(--color-blue-200);
  color: var(--color-blue-700);
  font-weight: 600;
}

.permissions-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.settings-tabs {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 8px;
}

.settings-tabs .btn {
  width: 100%;
  justify-content: center;
}

.settings-tabs .btn.active {
  background: var(--color-gray-800);
  color: var(--color-white);
  border-color: var(--color-gray-800);
}

.settings-tab-panel {
  margin-top: var(--erp-section-gap);
}

.settings-tab-panel > .panel {
  margin-top: var(--erp-section-gap) !important;
  margin-bottom: 0 !important;
}

.settings-compact-checks ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.settings-compact-checks li {
  margin: 0;
}

.settings-compact-checks label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 5px 7px;
  font-size: 12px;
}

.settings-compact-checks input[type="checkbox"] {
  width: 13px;
  height: 13px;
  min-width: 13px;
  min-height: 13px;
  margin: 0;
}

.settings-chat-toggle-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.settings-chat-toggle-row label {
  margin: 0;
  line-height: 1.2;
}

.settings-chat-toggle-row .settings-compact-checks {
  display: inline-flex;
  align-items: center;
  margin: 0;
}

.settings-chat-panel {
  max-width: none;
  width: 100%;
  margin-top: 10px;
}

.settings-api-panel {
  max-width: none;
  width: 100%;
  margin-top: 10px;
}

.settings-email-panel {
  max-width: none;
  width: 100%;
  margin-top: 10px;
}

.settings-email-form {
  margin-top: 8px;
  gap: 8px;
}

.settings-email-grid {
  align-items: end;
  gap: 8px;
}

.settings-email-password-field {
  min-width: 0;
}

.settings-email-password-help {
  margin: -2px 0 0;
  font-size: 0.72rem;
  line-height: 1.2;
}

.settings-email-actions {
  margin-top: 0;
}

.settings-global-colors-panel {
  max-width: none;
  width: 100%;
  margin-top: 10px;
}

.global-color-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.global-color-load-state {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 10px;
  margin-top: 10px;
}

.global-color-load-state .muted {
  margin: 0;
}

.global-color-stat {
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 8px 10px;
  display: grid;
  gap: 2px;
}

.global-color-stat span {
  color: var(--color-slate-500);
  font-size: 0.78rem;
}

.global-color-stat strong {
  color: var(--color-slate-900);
  font-size: 1.05rem;
  line-height: 1.2;
}

.global-color-sections {
  display: grid;
  gap: 12px;
  margin-top: 12px;
}

.global-color-section {
  min-width: 0;
}

.global-color-table td {
  vertical-align: top;
}

.global-color-swatch {
  display: inline-block;
  width: 26px;
  height: 18px;
  border: 1px solid var(--color-slate-300);
  border-radius: 4px;
  background-color: var(--color-white);
  background-image:
    linear-gradient(45deg, var(--color-slate-200) 25%, transparent 25%),
    linear-gradient(-45deg, var(--color-slate-200) 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, var(--color-slate-200) 75%),
    linear-gradient(-45deg, transparent 75%, var(--color-slate-200) 75%);
  background-position: 0 0, 0 9px, 9px -9px, -9px 0;
  background-size: 18px 18px;
}

.global-color-locations {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  max-width: 620px;
}

.global-color-locations span {
  border: 1px solid var(--color-border-soft);
  border-radius: 6px;
  background: var(--erp-surface-muted);
  color: var(--color-slate-600);
  padding: 2px 6px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.74rem;
  line-height: 1.25;
}

.global-color-uses {
  display: grid;
  gap: 5px;
  min-width: 280px;
  max-width: 720px;
}

.global-color-use {
  display: grid;
  gap: 1px;
  border: 1px solid var(--color-border-soft);
  border-radius: 6px;
  background: var(--erp-surface-muted);
  padding: 5px 7px;
}

.global-color-use strong {
  color: var(--color-slate-900);
  font-size: 0.78rem;
  line-height: 1.2;
}

.global-color-use span {
  color: var(--color-slate-700);
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.global-color-use small {
  color: var(--color-slate-500);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.72rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.fileserver-settings-stack {
  display: grid;
  gap: 10px;
  margin-top: 10px;
}

.settings-fileserver-panel {
  max-width: none;
  width: 100%;
}

.fileserver-root-rows {
  display: grid;
  gap: 0;
}

.fileserver-root-row {
  display: grid;
  grid-template-columns: minmax(160px, 0.8fr) minmax(260px, 1.4fr) auto;
  gap: 8px;
  align-items: end;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 8px 0;
}

.fileserver-root-row + .fileserver-root-row {
  border-top: 1px solid var(--color-border-soft);
}

.fileserver-root-actions {
  display: flex;
  align-items: end;
  justify-content: flex-end;
  min-height: 34px;
}

.permission-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 7px 8px;
  font-size: 12px;
}

.permission-toggle input[type="checkbox"] {
  width: 14px;
  height: 14px;
  min-width: 14px;
  min-height: 14px;
  margin: 0;
}

.kv-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

.company-kv-grid {
  grid-template-columns: repeat(8, minmax(0, 1fr));
}

.company-branches-section .run-section-title {
  margin: 0;
}

.company-extra-section .run-section-title { margin: 0; }
.company-extra-section .subsection-head { margin: 8px 0; padding: 0; }
.form-grid.company-linked-fields {
  grid-template-columns: minmax(0, 2fr) minmax(130px, 0.7fr) minmax(0, 3fr);
  align-items: start;
  gap: 8px;
  margin-top: 0;
}
.company-linked-fields > .field { min-width: 0; }
.company-linked-fields textarea { min-height: 40px; }
.company-extra-section .actions-row > .company-relation-add {
  width: 146px;
  flex: 0 0 146px;
  min-height: 32px;
}
.company-extra-section .investment-stage-saved-file { width: 100%; }
.company-extra-section .investment-stage-saved-file-main strong { overflow-wrap: anywhere; }
.company-extra-section .investment-stage-file-edit > .edit-lease-status { grid-column: 1 / -1; }

.company-branches-section .subsection-head {
  margin: 8px 0;
  padding: 0;
}

.kv-grid > div {
  grid-column: span 2;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

/* Owner, 14/10/2026: η καρτέλα ενός εργαλείου δείχνει τα στοιχεία όπως ο Πελάτης. Ένα μακρύ πεδίο
   (πεδίο εφαρμογής, παρατηρήσεις) πιάνει όλη τη γραμμή και κρατά τις αλλαγές γραμμής του. */
.kv-grid .kv-span-full {
  grid-column: 1 / -1;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}

.kv-grid .kv-span-full strong {
  white-space: normal;
  overflow: visible;
}

.kv-grid .kv-span-3 {
  grid-column: span 3;
}

.kv-grid .kv-span-4 {
  grid-column: span 4;
}

.kv-grid strong {
  display: block;
  font-weight: 600;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1 1 auto;
}

.kv-grid strong a {
  color: inherit;
  text-decoration: none;
}

.kv-grid strong a:hover {
  text-decoration: underline;
}

.kv-grid .locator-inline {
  color: var(--color-blue-700);
  text-decoration: none;
  white-space: nowrap;
  flex: 0 0 auto;
}

.kv-grid .locator-inline-btn {
  margin-left: auto;
}

.kv-grid > div.kv-locator-field {
  grid-column: span 1;
  width: fit-content;
  max-width: none;
  padding: 4px 6px;
  justify-content: center;
  justify-self: start;
}

.kv-grid .kv-locator-field .btn,
.kv-grid .kv-locator-field .btn:hover,
.kv-grid .kv-locator-field .btn:focus {
  text-decoration: none;
}

.kv-grid .locator-inline:hover {
  text-decoration: underline;
}

.kv-grid > div > .muted {
  margin: 0;
  white-space: nowrap;
}

.kv-grid > div > .muted::after {
  content: ":";
  margin-left: 2px;
}

.extra-company-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 6px;
}

.extra-company-stack {
  display: grid;
  gap: 10px;
  margin-top: 6px;
}

.extra-company-card {
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 8px;
  display: grid;
  gap: 6px;
  min-width: 0;
}

.extra-company-card h4 {
  margin: 0;
  font-size: 13px;
  color: var(--color-slate-900);
}

.extra-company-card p {
  margin: 0;
}

.submini-title {
  margin: 0;
  font-size: 12px;
  color: var(--color-slate-700);
  font-weight: 700;
}

.size-metrics-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.size-year-stack {
  display: grid;
  gap: 8px;
}

.extra-divider {
  height: 1px;
  background: var(--color-slate-200);
  margin: 6px 0;
}

.relation-choice-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.relation-choice-grid .relation-toggle {
  padding: 4px 6px;
  gap: 5px;
  border-radius: 6px;
  font-size: 11px;
  background: var(--color-white);
}

.relation-choice-grid .relation-toggle span {
  white-space: nowrap;
}

.relation-choice-grid .relation-toggle input[type="radio"] {
  width: 12px;
  height: 12px;
  min-width: 12px;
  min-height: 12px;
  margin: 0;
}

.extra-linked-list {
  display: grid;
  gap: 6px;
}

.extra-linked-item {
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-white);
  padding: 6px 8px;
  display: grid;
  gap: 2px;
}

.extra-company-card strong {
  font-weight: 600;
}

.company-contacts-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.company-contacts-panel .panel-head-compact {
  margin-bottom: 0;
  padding-bottom: 0;
}

.company-contacts-panel #companyContactsSection:not(.is-collapsed) {
  margin-top: 10px;
}

.company-detail-compact-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.company-detail-compact-panel .panel-head-compact {
  margin-bottom: 0;
  padding-bottom: 0;
}

.company-detail-compact-panel > div[id]:not(.is-collapsed) {
  margin-top: 10px;
}

.financial-package-form-grid {
  align-items: end;
}

.financial-record-form-grid {
  align-items: end;
}

.financial-record-form-grid .financial-record-field-wide {
  grid-column: span 2;
}

.financial-package-fields {
  display: grid;
  gap: 8px;
}

.financial-inline-field {
  display: grid;
  grid-template-columns: minmax(105px, max-content) minmax(0, 1fr);
  align-items: center;
  column-gap: 8px;
}

.financial-inline-field label {
  margin: 0;
  white-space: nowrap;
}

.financial-inline-field .message {
  grid-column: 2;
}

.financial-investment-disabled {
  opacity: 0.68;
}

.financial-package-block {
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 8px;
  display: grid;
  gap: 8px;
}

.financial-package-block .subsection-head {
  margin: 0;
}

.financial-package-subtitle {
  margin: 0;
}

.financial-fee-lines {
  display: grid;
  gap: 8px;
}

.financial-fee-row {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  align-items: center;
}

.financial-fee-row > .field {
  min-width: 0;
}

.financial-fee-row .financial-inline-field {
  grid-template-columns: max-content minmax(0, 1fr);
}

.financial-fee-category-field {
  flex: 0 1 310px;
  grid-template-columns: max-content minmax(140px, 190px) !important;
}

.financial-fee-percent-field {
  flex: 0 1 190px;
}

.financial-fee-amount-field {
  flex: 1 1 260px;
}

.financial-fee-remove {
  flex: 0 0 auto;
  margin-left: auto;
}

.financial-fee-row input[readonly] {
  background: var(--color-slate-100);
}

.financial-section-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: 8px;
}

.financial-package-total-row {
  justify-content: flex-end;
}

.financial-package-group-label {
  display: block;
  margin-top: 2px;
  font-size: 12px;
}

.financial-record-package-link {
  display: grid;
  gap: 2px;
  min-width: 150px;
}

.financial-record-package-kind {
  color: var(--muted);
  font-size: 11px;
}

.financial-package-edit-form {
  padding: 8px 0;
}

.financial-aid-projection-toggle {
  display: block;
  margin-top: 6px;
}

.financial-aid-projection-row > td {
  background: var(--color-slate-100);
  padding: 8px;
}

.financial-aid-projection {
  display: grid;
  gap: 8px;
}

.financial-aid-projection-head,
.financial-aid-projection-totals {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.financial-aid-projection-head small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
}

.financial-aid-projection-totals span {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  white-space: nowrap;
}

.financial-aid-projection-table th,
.financial-aid-projection-table td {
  vertical-align: middle;
}

.financial-aid-projection-warning {
  margin: 0;
  color: var(--color-amber-800);
  font-size: 12px;
}

.extra-company-items {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.extra-company-items span {
  border: 1px solid var(--color-border);
  background: var(--color-white);
  border-radius: var(--erp-chip-radius);
  padding: 3px 8px;
  font-size: 12px;
  color: var(--color-slate-700);
}

.extra-company-items a {
  border: 1px solid var(--color-border);
  background: var(--color-white);
  border-radius: var(--erp-chip-radius);
  padding: 3px 8px;
  font-size: 12px;
  color: var(--color-slate-700);
  text-decoration: none;
}

.extra-company-items a:hover {
  background: var(--color-blue-50);
  border-color: var(--color-blue-200);
}

.checklist-item-done {
  text-decoration: line-through;
  color: var(--color-slate-500);
}

.extra-company-grid .extra-company-span-2 {
  grid-column: span 2;
}

.mme-calculator-panel .stack {
  gap: 6px;
}

.mme-calculator-panel .panel-head {
  margin-bottom: 6px;
}

.mme-calculator-panel .run-section-title {
  margin: 0;
}

.mme-calculator-panel .actions-row {
  gap: 6px;
}

.mme-calculator-panel .mme-section-head {
  display: grid;
  grid-template-columns: max-content minmax(560px, 1fr);
  align-items: center;
  column-gap: 10px;
}

.mme-calculator-panel .mme-entity-meta-grid {
  display: grid;
  grid-template-columns: minmax(360px, 2fr) minmax(180px, 1fr);
  gap: 6px;
  width: 100%;
}

.mme-calculator-panel .mme-entity-head {
  display: grid;
  grid-template-columns: max-content minmax(420px, 1fr) max-content;
  align-items: center;
  column-gap: 10px;
}

.mme-calculator-panel .mme-entity-meta-grid .field-inline {
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 4px;
}

.mme-calculator-panel .mme-entity-meta-grid .field-inline label {
  white-space: nowrap;
  justify-self: end;
}

.mme-calculator-panel .size-metrics-grid {
  gap: 6px;
}

.mme-calculator-panel .extra-company-card {
  padding: 6px;
  gap: 4px;
}

.mme-calculator-panel .field {
  gap: 4px;
}

.mme-calculator-panel .field-inline {
  grid-template-columns: 118px minmax(0, 1fr);
  gap: 6px;
}

.mme-calculator-panel input:where(:not([type="checkbox"]):not([type="radio"])),
.mme-calculator-panel select,
.mme-calculator-panel textarea {
  padding: 6px 8px;
  border-radius: 8px;
}

.mme-calculator-panel .erp-table th,
.mme-calculator-panel .erp-table td {
  padding: 5px 8px;
  line-height: 1.15;
}

.mme-calculator-panel .mme-print-header {
  display: none;
}

@media print {
  @page {
    size: A4 portrait;
    margin: 12mm;
  }

  .sidebar,
  .topbar,
  .flash-stack,
  .no-print,
  .mme-calculator-panel .mme-input-form {
    display: none !important;
  }

  body,
  .shell,
  .content-wrap,
  .content {
    background: var(--color-white) !important;
    color: var(--color-gray-900) !important;
  }

  body {
    font-size: 11px;
    line-height: 1.35;
  }

  .shell {
    display: block;
  }

  .content-wrap {
    padding: 0;
  }

  .content {
    display: block;
  }

  .panel,
  .mme-calculator-panel {
    box-shadow: none;
    border: 0;
    padding: 0;
    margin: 0;
  }

  .mme-calculator-panel .mme-print-header {
    display: block;
    margin: 0 0 8px;
  }

  .mme-calculator-panel .mme-print-header h2 {
    margin: 0;
    font-size: 16px;
  }

  .mme-calculator-panel .mme-print-header p {
    margin: 2px 0 0;
    color: var(--color-slate-600);
  }

  .mme-calculator-panel h3 {
    font-size: 13px;
    margin: 8px 0 4px;
  }

  .mme-calculator-panel .tools-placeholder-box {
    border: 1px solid var(--color-gray-300);
    background: var(--color-white);
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .mme-calculator-panel .table-wrap {
    margin-top: 6px;
  }

  .mme-calculator-panel .erp-table {
    border: 1px solid var(--color-gray-300);
    border-radius: 0;
    font-size: 10.5px;
  }

  .mme-calculator-panel .erp-table th,
  .mme-calculator-panel .erp-table td {
    padding: 4px 6px;
    border-color: var(--erp-border);
  }

  .mme-calculator-panel .erp-table thead th {
    background: var(--color-gray-50) !important;
    color: var(--color-gray-900);
  }

  .mme-calculator-panel .erp-table tr,
  .mme-calculator-panel .erp-table td,
  .mme-calculator-panel .erp-table th {
    break-inside: avoid;
    page-break-inside: avoid;
  }
}

.useful-docs-grid {
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 6px;
}

.useful-doc-card {
  padding: 5px 6px;
  gap: 1px;
}

.useful-doc-card .muted {
  font-size: 11px;
  line-height: 1.2;
}

.useful-doc-card strong {
  font-size: 12px;
  line-height: 1.2;
}

.useful-doc-card strong a {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
}

.companies-table-wrap {
  margin-top: 14px;
}

.erp-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  overflow: hidden;
  background: var(--color-white);
}

.erp-table th,
.erp-table td {
  padding: 7px 10px;
  border-bottom: 1px solid var(--erp-border);
  text-align: left;
  vertical-align: middle;
  line-height: 1.25;
}

.erp-table thead th {
  background: var(--color-slate-50);
  color: var(--color-slate-600);
  font-size: 12px;
  font-weight: 700;
}

.erp-table tbody td {
  font-size: 12px;
}

.erp-table tbody tr:hover {
  background: var(--erp-surface-muted);
}

.erp-table .status-row-prospect {
  background: var(--color-blue-50);
}

.erp-table .status-row-active {
  background: var(--erp-success-soft);
}

.erp-table .status-row-dormant {
  background: var(--color-orange-50);
}

.erp-table .status-row-archived {
  background: var(--color-slate-100);
}

.erp-table .status-row-pinned td {
  background: var(--color-amber-50);
}

.erp-table .status-row-pinned td:first-child {
  box-shadow: inset 3px 0 0 var(--color-amber-500);
}

.erp-table .status-row-deleted td {
  text-decoration: line-through;
  color: var(--color-slate-500);
}

.erp-table .status-row-deleted td:last-child,
.erp-table .status-row-deleted td:last-child * {
  text-decoration: none;
}

.erp-table tbody tr:last-child td {
  border-bottom: 0;
}

.table-checkbox-col {
  width: 38px;
  text-align: center;
}

.table-checkbox-col input[type="checkbox"] {
  width: 14px;
  height: 14px;
  min-width: 14px;
  min-height: 14px;
  margin: 0;
  padding: 0;
}

.settings-users-checkbox-col {
  width: 32px;
}

.settings-users-checkbox-col input[type="checkbox"] {
  width: 12px;
  height: 12px;
  min-width: 12px;
  min-height: 12px;
}

.modal {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
  display: grid;
  place-items: center;
  z-index: 200;
  padding: 16px;
}

.modal-card {
  width: min(460px, 100%);
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: 14px;
  box-shadow: 0 18px 36px rgba(2, 6, 23, 0.22);
  padding: 18px;
}

.confirm-modal-card h3 {
  margin: 0 0 6px;
  font-size: 15px;
}

.confirm-modal-card p {
  margin: 0;
  color: var(--color-slate-600);
}

.confirm-modal-actions {
  margin-top: 14px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.path-picker-card {
  width: min(760px, 100%);
  display: grid;
  gap: 10px;
}

.path-picker-list {
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: var(--color-white);
  max-height: 360px;
  overflow: auto;
  display: grid;
  gap: 4px;
  padding: 6px;
}

.path-picker-item {
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  padding: 6px 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  cursor: pointer;
}

.path-picker-item:hover,
.path-picker-item:focus-visible {
  border-color: var(--color-blue-300);
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.15);
  background: var(--color-blue-50);
}

.useful-doc-item {
  border: 1px solid var(--color-border);
  border-radius: 8px;
  padding: 8px;
  background: var(--color-white);
  position: relative;
}

.useful-doc-item.drag-over {
  outline: 2px dashed var(--color-blue-400);
}

.useful-doc-drag {
  position: absolute;
  top: 6px;
  right: 8px;
  color: var(--color-slate-500);
  cursor: move;
  user-select: none;
  font-weight: 700;
}

.table-subline {
  display: block;
  margin-top: 2px;
}

.timeline-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: baseline;
}

.timeline-details-inline {
  color: var(--color-slate-900);
  font-size: 12px;
  font-weight: 500;
}

.is-collapsed {
  display: none !important;
}

.th-sort {
  color: inherit;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font: inherit;
  text-align: inherit;
}

button.th-sort {
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  color: inherit;
  min-height: 0;
}

th[aria-sort] > .th-sort::after {
  content: "\2195";
  flex: 0 0 12px;
  text-align: center;
  font-size: 12px;
}

th[aria-sort="ascending"] > .th-sort::after { content: "\2191"; }
th[aria-sort="descending"] > .th-sort::after { content: "\2193"; }

.th-sort:focus-visible { outline: 2px solid var(--erp-primary); outline-offset: 3px; }

@media print {
  th[aria-sort] > .th-sort::after { display: none; }
}

.th-sort:hover {
  color: var(--color-blue-700);
}


.timeline-jump-link {
  color: var(--color-blue-700);
  text-decoration: none;
  font-weight: 600;
}

.timeline-jump-link:hover {
  text-decoration: underline;
}

.btn.is-active {
  border-color: var(--erp-primary);
  background: var(--erp-primary-soft);
  color: var(--erp-primary-text);
}

.btn.is-active:hover {
  border-color: var(--erp-primary-hover);
  background: var(--erp-primary-hover);
  color: var(--erp-surface);
}

.section-filter-chip {
  border-radius: var(--erp-chip-radius);
  padding-left: 10px;
  padding-right: 10px;
}

.note-filter-link {
  text-decoration: none;
  border: 1px solid var(--color-slate-300);
  border-radius: var(--erp-chip-radius);
  padding: 6px 11px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.note-filter-link.is-active {
  outline: 2px solid rgba(37, 99, 235, 0.24);
  outline-offset: 1px;
}

.note-filter-link-neutral {
  background: var(--color-slate-50);
  color: var(--color-slate-700);
  border-color: var(--color-slate-300);
}

.note-filter-link-pinned {
  background: var(--color-amber-50);
  color: var(--color-amber-800);
  border-color: var(--color-amber-500);
}

.note-filter-link-pinned.is-active {
  outline: 2px solid rgba(245, 158, 11, 0.35);
}

.task-filter-chip {
  min-height: 30px;
}

.task-filter-chip-open {
  background: var(--color-blue-50);
  color: var(--color-blue-700);
  border-color: var(--color-blue-300);
}

.task-filter-chip-open.is-active {
  background: var(--color-blue-600);
  color: var(--erp-on-accent);
  border-color: var(--color-blue-700);
  outline: 2px solid rgba(37, 99, 235, 0.32);
  outline-offset: 1px;
}

.task-filter-chip-done {
  background: var(--color-green-100);
  color: var(--color-green-800);
  border-color: var(--color-green-300);
}

.task-filter-chip-done.is-active {
  background: var(--erp-success-fill);
  color: var(--erp-on-accent);
  border-color: var(--color-green-700);
  outline: 2px solid rgba(22, 163, 74, 0.35);
  outline-offset: 1px;
}

.note-filter-link-low {
  background: var(--color-slate-50);
  color: var(--color-slate-600);
  border-color: var(--color-slate-300);
}

.note-filter-link-medium {
  background: var(--color-sky-50);
  color: var(--color-sky-700);
  border-color: var(--color-sky-300);
}

.note-filter-link-high {
  background: var(--color-orange-50);
  color: var(--color-orange-700);
  border-color: var(--color-orange-300);
}

.useful-law-layout {
  display: grid;
  gap: 10px;
  width: 100%;
}

.useful-law-layout-full {
  width: 100%;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
}

.law-subsection-frame {
  border: 1px solid var(--color-border);
  border-radius: 10px;
  padding: 8px;
  background: var(--color-white);
}

.law-subsection-divider {
  border-top: 1px solid var(--color-border);
  margin-top: 10px;
  padding-top: 10px;
}

.useful-law-section-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.useful-docs-shell-compact {
  display: grid;
  gap: var(--erp-section-gap);
}

/* To-do 1.73: the collection panels sit in their own wrapper, so neither the shell
   grid gap nor the section-block sibling rule reached them - they were spaced by a
   margin instead, and touched once it was removed. Spaced by the layout now. */
.useful-docs-collections {
  display: grid;
  gap: var(--erp-section-gap);
}

/* To-do 1.73: the compact padding stays (To-do 6.46 asked for it). What was wrong is
   the spacing *between* sections: a margin on top of the container gap produced 12px
   between some panels and 4px between others. The layout spaces them now. */
.useful-docs-shell .useful-docs-panel,
.useful-docs-shell .useful-docs-panel.compact {
  padding: 8px 12px;
}

.useful-docs-shell .useful-docs-collection-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.useful-docs-shell .useful-docs-collection-panel.is-section-collapsed .panel-head {
  margin-bottom: 0;
}

.useful-docs-shell .useful-docs-filters-panel {
  margin-top: 0;
}

.useful-docs-shell .panel-head,
.useful-docs-shell .panel-head.panel-head-compact {
  margin-bottom: 6px;
  min-height: 0;
}

.useful-docs-shell .actions-row {
  margin-top: 2px;
  margin-bottom: 2px;
  gap: 6px;
}

.useful-docs-filters {
  margin-top: 4px;
}

.useful-law-chip-row {
  margin-top: 8px;
}

.useful-filter-actions-field {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}

.useful-copy-compact {
  margin: 0;
}

.useful-docs-guide-panel .panel-head {
  margin-bottom: 2px;
}

.useful-guide-copy {
  margin: 0 0 6px;
}

.useful-guide-more {
  margin-top: 4px;
}

.useful-guide-more .muted {
  margin: 0 0 4px;
}

.useful-guide-more .useful-guide-example {
  margin: 4px 0 0;
}

.useful-docs-heading {
  margin: 0;
  line-height: 1.2;
}

.useful-title-filters {
  font-size: inherit;
  font-weight: 700;
  letter-spacing: normal;
  color: inherit;
}

.useful-title-collection {
  font-size: inherit;
  font-weight: 700;
  letter-spacing: normal;
  color: inherit;
}

.useful-title-section {
  font-size: inherit;
  font-weight: 700;
  color: inherit;
}

.useful-law-block {
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  display: grid;
  gap: 4px;
}

.useful-law-block-law {
  gap: 4px;
}

.useful-law-block-regimes {
  gap: 0;
}

.useful-docs-section-block {
  margin-top: 4px;
}

.useful-law-block .panel-head {
  margin-bottom: 4px;
}

.useful-law-block-regimes .panel-head {
  margin-bottom: 6px;
}

.useful-regimes-title {
  font-size: inherit;
  font-weight: inherit;
}

.useful-law-note {
  margin: -2px 0 8px;
}

.useful-doc-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}

.useful-doc-row {
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  padding: 8px 10px;
  background: var(--color-slate-50);
}

.useful-doc-link {
  color: var(--color-blue-700);
  text-decoration: none;
  font-weight: 700;
}

.useful-doc-link:hover {
  text-decoration: underline;
}

.useful-law-chip-row {
  gap: 6px;
  flex-wrap: wrap;
}

.useful-law-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.useful-law-tile {
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: var(--color-slate-50);
  padding: 8px;
  display: grid;
  gap: 6px;
  flex: 0 1 calc(33.333% - 10px);
  max-width: calc(33.333% - 10px);
  min-width: 260px;
}

.useful-law-tile-compact {
  min-width: 0;
  width: 100%;
  max-width: none;
  flex: 1 1 auto;
  padding: 6px 8px;
  gap: 4px;
  align-content: start;
}

.useful-law-tile-compact .btn {
  padding: 3px 7px;
}

.useful-law-tile.is-favorite {
  background: var(--color-orange-50);
  border-color: var(--color-orange-300);
}

.useful-law-tile-actions {
  gap: 4px;
  justify-content: flex-end;
  flex-wrap: nowrap;
}

.useful-inline-action-btn {
  min-width: 112px;
  text-align: center;
  justify-content: center;
}

.useful-header-actions {
  gap: 6px;
  margin-right: 2px;
}

.useful-header-actions .btn {
  min-height: 34px;
  padding-inline: 12px;
}

.useful-add-root-panel {
  width: 100%;
}

.useful-add-root-actions {
  width: 100%;
  justify-content: flex-start;
}

.useful-add-root-btn {
  width: auto;
  min-width: 220px;
  max-width: 100%;
  justify-content: center;
  text-align: center;
}

.tools-tiles-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.tools-tile-card {
  border: 1px solid var(--color-border-soft);
  border-radius: 12px;
  background: var(--color-white);
  padding: 12px;
}

.tools-tile-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}

.tools-tile-head h3 {
  margin: 0;
  font-size: 15px;
}

.tools-tile-badge {
  border: 1px solid var(--color-slate-300);
  border-radius: var(--erp-chip-radius);
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 700;
}

.tools-tile-badge.is-ready {
  color: var(--erp-success-text);
  background: var(--erp-success-soft);
  border-color: var(--erp-success-soft);
}

.tools-tile-badge.is-progress {
  color: var(--color-amber-800);
  background: var(--color-amber-50);
  border-color: var(--color-amber-300);
}

.tools-tile-badge.is-danger {
  color: var(--color-red-800);
  background: var(--color-red-50);
  border-color: var(--color-red-300);
}

.tools-placeholder-box {
  margin-top: 10px;
  border: 1px dashed var(--color-blue-200);
  border-radius: 10px;
  background: var(--erp-surface-muted);
  padding: 12px;
}

.calc-windows-layer {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 40;
}

.calc-window {
  position: fixed;
  width: 380px;
  min-height: 420px;
  border: 1px solid var(--color-slate-300);
  border-radius: 12px;
  background: var(--color-white);
  box-shadow: 0 18px 46px rgba(15, 23, 42, 0.24);
  overflow: hidden;
  pointer-events: auto;
}

.calc-window.is-fullscreen {
  left: 10px !important;
  top: 10px !important;
  width: calc(100vw - 20px) !important;
  height: calc(100vh - 20px) !important;
}

.calc-window-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  background: var(--color-slate-50);
  border-bottom: 1px solid var(--color-border-soft);
  cursor: move;
  user-select: none;
}

.calc-window-head-actions {
  gap: 6px;
}

.calc-window-body {
  padding: 10px;
  display: grid;
  gap: 8px;
}

.calc-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

.calc-segmented {
  display: inline-flex;
  border: 1px solid var(--color-slate-300);
  border-radius: var(--erp-chip-radius);
  overflow: hidden;
}

.calc-segmented button {
  border: 0;
  background: var(--color-white);
  color: var(--color-slate-700);
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 600;
}

.calc-segmented button.is-active {
  background: var(--color-blue-600);
  color: var(--erp-on-accent);
}

.calc-display-wrap {
  border: 1px solid var(--color-border-soft);
  border-radius: 10px;
  padding: 8px;
  background: var(--color-slate-50);
}

.calc-display-history {
  min-height: 16px;
  font-size: 11px;
  color: var(--color-slate-500);
  text-align: right;
}

.calc-display-input {
  width: 100%;
  border: 0;
  background: transparent;
  text-align: right;
  font-size: 24px;
  font-weight: 700;
  color: var(--color-slate-900);
  padding: 2px 0;
}

.calc-display-input:focus {
  outline: none;
}

.calc-pad {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.calc-pad button,
.calc-pad-scientific button {
  border: 1px solid var(--color-slate-300);
  border-radius: 8px;
  background: var(--color-white);
  min-height: 36px;
  font-size: 14px;
  font-weight: 600;
  color: var(--color-slate-900);
}

.calc-equals {
  grid-column: 1 / -1;
  background: var(--color-blue-600) !important;
  color: var(--erp-on-accent) !important;
  border-color: var(--color-blue-700) !important;
}

.calc-pad-scientific {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.is-dragging-calc {
  user-select: none;
}

.favorite-heart-btn {
  min-width: 34px;
  padding: 2px 8px;
  font-size: 14px;
  line-height: 1;
}

.useful-doc-headline {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.useful-doc-headline .useful-doc-link {
  flex: 1 1 auto;
  min-width: 0;
}

.useful-doc-meta {
  font-size: 12px;
  line-height: 1.35;
}

.useful-regime-columns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 8px;
  align-items: start;
}

.useful-regime-columns > .useful-regime-column:only-child {
  grid-column: 1 / -1;
}

.useful-regime-column {
  border: none;
  border-radius: 0;
  padding: 0;
  background: transparent;
  display: grid;
  gap: 10px;
  align-content: start;
}

.useful-category-card {
  border: 1px solid var(--color-slate-200);
  border-radius: 10px;
  padding: 8px;
  background: var(--color-white);
}

.useful-category-card h6 {
  margin: 0 0 11px;
  font-size: 13px;
  font-weight: 700;
  color: var(--color-slate-900);
}

.useful-category-card .useful-regime-items {
  margin-top: 5px;
}

.useful-group-actions {
  margin-bottom: 2px;
}

.useful-empty-copy {
  margin-top: 4px;
}

.useful-empty-actions {
  margin-top: 6px;
}

.useful-arrange-collection {
  cursor: grab;
  position: relative;
}

.useful-arrange-collection.is-dragging {
  opacity: 0.75;
}

.useful-arrange-collection.is-saving {
  opacity: 0.6;
  pointer-events: none;
}

.useful-arrange-collection.drag-over {
  outline: 2px dashed var(--color-blue-500);
  outline-offset: 2px;
}

.useful-arrange-section {
  cursor: grab;
  position: relative;
}

.useful-arrange-section.is-dragging {
  opacity: 0.78;
}

.useful-arrange-section.is-saving {
  opacity: 0.6;
  pointer-events: none;
}

.useful-arrange-section.drag-over {
  outline: 2px dashed var(--color-blue-600);
  outline-offset: 2px;
}

.useful-arrange-group-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.useful-arrange-group-columns {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  align-items: start;
}

.useful-arrange-group-column {
  border: 1px dashed var(--color-slate-300);
  border-radius: 10px;
  min-height: 140px;
  padding: 8px;
  background: var(--color-slate-50);
  display: grid;
  align-content: start;
  gap: 8px;
}

.useful-arrange-column-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--color-slate-600);
}

.useful-arrange-group-column.drag-over {
  border-color: var(--color-blue-500);
  background: var(--color-blue-50);
}

.useful-arrange-group-slot {
  min-height: 44px;
  border: 1px dashed var(--color-blue-200);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: var(--color-slate-500);
  background: var(--color-white);
}

.useful-arrange-group-slot.drag-over {
  border-color: var(--color-blue-600);
  color: var(--color-blue-700);
  background: var(--color-blue-100);
}

.useful-arrange-group-card {
  border: 1px solid var(--color-border-soft);
  border-radius: 10px;
  padding: 10px;
  background: var(--color-white);
  cursor: grab;
  position: relative;
}

.useful-arrange-group-card h6 {
  margin: 0 0 4px;
  font-size: 13px;
  font-weight: 700;
}

.useful-arrange-group-card p {
  margin: 0;
}

.useful-arrange-item-list {
  margin-top: 8px;
  display: grid;
  gap: 6px;
}

.useful-arrange-item-row {
  border: 1px solid var(--color-border-soft);
  border-radius: 8px;
  padding: 6px 8px;
  background: var(--color-slate-50);
  font-size: 13px;
  cursor: grab;
  position: relative;
}

.useful-arrange-item-row.is-dragging {
  opacity: 0.78;
}

.useful-arrange-item-row.is-saving {
  opacity: 0.6;
  pointer-events: none;
}

.useful-arrange-item-row.drag-over {
  outline: 2px dashed var(--color-blue-800);
  outline-offset: 1px;
}

.useful-arrange-group-card.is-dragging {
  opacity: 0.78;
}

.useful-arrange-group-card.is-saving {
  opacity: 0.6;
  pointer-events: none;
}

.useful-arrange-collection.is-saving::after,
.useful-arrange-section.is-saving::after,
.useful-arrange-group-card.is-saving::after,
.useful-arrange-item-row.is-saving::after {
  content: "Αποθήκευση...";
  position: absolute;
  top: 8px;
  right: 8px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  color: var(--color-blue-700);
  background: var(--color-blue-100);
  border: 1px solid var(--color-blue-300);
  border-radius: var(--erp-chip-radius);
  padding: 4px 8px;
}

.useful-arrange-group-card.drag-over {
  outline: 2px dashed var(--color-blue-700);
  outline-offset: 2px;
}

.useful-regime-column.is-empty {
  min-height: 170px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.useful-empty-column-cta {
  width: 100%;
  display: grid;
  justify-items: center;
  gap: 10px;
}

.useful-empty-plus-btn {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 999px;
  font-size: 22px;
  line-height: 1;
  padding: 0;
}

.useful-empty-column-links {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: center;
}

.useful-empty-hint {
  font-size: 12px;
  text-align: center;
}

.useful-regime-column h6 {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  color: var(--color-slate-900);
}

.useful-regime-column h6 + .useful-regime-items {
  margin: 8px 0 8px;
}

.useful-regime-items {
  display: grid;
  gap: 6px;
}

@media (max-width: 1100px) {
  .useful-law-grid {
    gap: 8px;
  }

  .useful-law-tile {
    flex-basis: calc(50% - 8px);
    max-width: calc(50% - 8px);
  }

  .useful-regime-columns {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .useful-arrange-group-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .useful-arrange-group-columns {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .tools-tiles-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.note-filter-link-critical {
  background: var(--color-red-50);
  color: var(--color-red-700);
  border-color: var(--color-red-300);
}

.note-filter-link-neutral.is-active {
  background: var(--color-slate-700);
  color: var(--color-white);
  border-color: var(--color-gray-800);
}

.note-filter-link.status-tile-low.is-active {
  background: var(--color-slate-500);
  color: var(--color-white);
  border-color: var(--color-slate-600);
  outline: 2px solid rgba(100, 116, 139, 0.35);
  outline-offset: 1px;
}

.note-filter-link.status-tile-medium.is-active {
  background: var(--erp-info-fill);
  color: var(--erp-on-accent);
  border-color: var(--color-sky-700);
  outline: 2px solid rgba(2, 132, 199, 0.35);
  outline-offset: 1px;
}

.note-filter-link.status-tile-high.is-active {
  background: var(--color-orange-600);
  color: var(--erp-sidebar);
  border-color: var(--color-orange-700);
  outline: 2px solid rgba(234, 88, 12, 0.35);
  outline-offset: 1px;
}

.note-filter-link.status-tile-critical.is-active {
  background: var(--color-red-600);
  color: var(--erp-on-accent);
  border-color: var(--color-red-700);
  outline: 2px solid rgba(220, 38, 38, 0.35);
  outline-offset: 1px;
}

.panel.is-section-collapsed .section-filters > a,
.panel.is-section-collapsed .section-filters > .note-filter-link,
.panel.is-section-collapsed .section-filters > .btn:not([data-collapse-toggle]) {
  display: none !important;
}

.notes-panel-body {
  display: block;
}

.notes-panel-body > form {
  margin: 0 0 6px;
}

.notes-panel-body > .entity-list,
.notes-panel-body > .notes-empty-state {
  margin-top: 6px;
}

.note-editor-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.note-editor-toolbar .btn {
  min-width: 36px;
}

.note-editor-insert-panel {
  margin-top: 8px;
  padding: 8px 10px;
  border: 1px solid var(--color-border-soft);
  border-radius: 10px;
  background: var(--color-slate-50);
}

.note-insert-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-items: end;
}

.note-insert-grid-compact {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.note-insert-grid .actions-row {
  width: auto;
}

.note-rich-editor {
  min-height: 84px;
  border: 1px solid var(--color-slate-300);
  border-radius: 10px;
  padding: 8px 10px;
  background: var(--color-white);
  line-height: 1.45;
}

.note-rich-editor:focus {
  outline: none;
  border-color: var(--color-blue-500);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
}

.note-rich-editor[aria-invalid="true"] {
  border-color: var(--erp-danger);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--erp-danger) 14%, transparent);
}

.rich-editor-validation-error:not([hidden]) {
  display: block;
  margin-top: 4px;
}

.note-rich-editor img,
.note-rich-body img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

.note-rich-editor table,
.note-rich-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 8px 0;
}

.note-rich-editor th,
.note-rich-editor td,
.note-rich-body th,
.note-rich-body td {
  border: 1px solid var(--color-slate-300);
  padding: 4px 6px;
  text-align: left;
}

.note-rich-editor pre,
.note-rich-body pre {
  background: var(--color-slate-50);
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  padding: 8px;
  overflow: auto;
}

.note-rich-body p,
.note-rich-body ul,
.note-rich-body ol,
.note-rich-body blockquote,
.note-rich-body h2,
.note-rich-body h3 {
  margin: 0 0 8px;
}

.note-rich-body p:last-child,
.note-rich-body ul:last-child,
.note-rich-body ol:last-child,
.note-rich-body blockquote:last-child,
.note-rich-body h2:last-child,
.note-rich-body h3:last-child {
  margin-bottom: 0;
}

.note-rich-body blockquote {
  border-left: 3px solid var(--color-slate-300);
  padding-left: 8px;
  color: var(--color-slate-600);
}

.note-rich-body h2,
.note-rich-body h3,
.note-rich-body h4 {
  line-height: 1.25;
}

.note-entry-item {
  align-items: flex-start;
  padding: 8px 10px;
  gap: 8px;
}

.note-entry-item-pinned {
  border-color: var(--color-amber-300);
  background: var(--color-amber-50);
  box-shadow: inset 3px 0 0 var(--color-amber-500);
}

.erp-table tr.doc-preset-row-pinned td {
  background: var(--color-amber-50);
}

.doc-item-row .doc-item-main {
  flex: 1 1 auto;
  min-width: 0;
}

.doc-item-row .doc-item-main h3,
.doc-item-row .doc-item-main p {
  word-break: break-word;
}

.doc-item-actions {
  flex: 0 0 auto;
  flex-wrap: nowrap;
  align-items: flex-start;
}

.doc-item-actions .btn {
  white-space: nowrap;
}

[data-doc-arrange-category="1"].is-dragging,
[data-doc-arrange-item="1"].is-dragging {
  opacity: 0.55;
}

[data-doc-arrange-category="1"].drop-category {
  outline: 2px dashed var(--color-blue-300);
  outline-offset: 2px;
}

[data-doc-arrange-item-container="1"].drop-root {
  position: relative;
  background: var(--color-blue-50);
  border-radius: 10px;
}

[data-doc-arrange-item-container="1"].drop-root::before {
  content: "Θα μπει ως 2ο επίπεδο στο τέλος";
  position: absolute;
  right: 8px;
  top: 6px;
  font-size: 11px;
  background: var(--erp-primary-hover);
  color: var(--erp-on-accent);
  border-radius: var(--erp-chip-radius);
  padding: 2px 8px;
}

[data-doc-arrange-item="1"].drop-before {
  position: relative;
  box-shadow: inset 0 3px 0 var(--color-blue-500);
  background: var(--erp-surface-muted);
}

[data-doc-arrange-item="1"].drop-after {
  position: relative;
  box-shadow: inset 0 -3px 0 var(--color-blue-500);
  background: var(--erp-surface-muted);
}

[data-doc-arrange-item="1"].drop-child {
  position: relative;
  box-shadow: inset 4px 0 0 var(--color-blue-500);
  background: var(--color-blue-50);
}

[data-doc-arrange-item="1"].drop-before::before,
[data-doc-arrange-item="1"].drop-after::after,
[data-doc-arrange-item="1"].drop-child::after {
  position: absolute;
  right: 8px;
  font-size: 11px;
  background: var(--erp-primary-hover);
  color: var(--erp-on-accent);
  border-radius: var(--erp-chip-radius);
  padding: 2px 8px;
}

[data-doc-arrange-item="1"].drop-before::before {
  content: "Θα μπει πάνω";
  top: -10px;
}

[data-doc-arrange-item="1"].drop-after::after {
  content: "Θα μπει κάτω";
  bottom: -10px;
}

[data-doc-arrange-item="1"].drop-child::after {
  content: "Θα γίνει υπο-επίπεδο";
  top: -10px;
}

.doc-arrange-child-zone {
  margin-left: auto;
  font-size: 12px;
  color: var(--color-slate-500);
  border: 1px dashed var(--color-slate-300);
  border-radius: 8px;
  padding: 2px 8px;
  white-space: nowrap;
}

[data-doc-arrange-item="1"].drop-child .doc-arrange-child-zone {
  color: var(--color-blue-700);
  border-color: var(--color-blue-400);
  background: var(--color-blue-100);
}

.doc-arrange-handle {
  display: none;
}

.note-entry-item-deleted {
  border-color: var(--color-gray-300);
  background: var(--color-gray-100);
}

.overline-text {
  text-decoration: line-through;
  color: var(--erp-text-muted);
}

.note-badge {
  display: inline-flex;
  align-items: center;
  margin-left: 8px;
  border-radius: var(--erp-chip-radius);
  padding: 2px 9px;
  font-size: 11px;
  font-weight: 800;
  border: 1px solid var(--color-slate-300);
  background: var(--color-slate-50);
  color: var(--color-slate-700);
  vertical-align: middle;
}

.note-badge-dot {
  width: 9px;
  height: 9px;
  min-width: 9px;
  min-height: 9px;
  padding: 0;
  border-radius: 999px;
  margin-left: 7px;
  border-width: 2px;
}

.note-badge-status {
  border-radius: var(--erp-chip-radius);
  padding: 3px 8px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  border: 1px solid var(--color-slate-300);
  background: var(--color-slate-50);
  color: var(--color-slate-600);
}

.note-select-all-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.note-title-row {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 2px;
}

.note-title-row h3 {
  margin: 0;
  line-height: 1.2;
}

.pm-note-select,
#pmNotesSelectAll {
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: var(--color-blue-700);
}

.notes-list {
  max-height: none;
  overflow: visible;
}

.note-table-wrap {
  margin-top: 0;
  overflow-x: auto;
}

.note-table {
  min-width: 1180px;
  table-layout: fixed;
}

.note-table th,
.note-table td {
  vertical-align: middle;
}

.note-table-title-col {
  width: 24%;
}

.note-table-context-col {
  width: 18%;
}

.note-table-actions-col {
  width: 96px;
  text-align: right;
}

.note-table-title,
.note-table-context,
.note-table-expanded-cell {
  white-space: normal;
  overflow-wrap: anywhere;
}

.note-table-title > strong {
  display: block;
  color: var(--color-slate-900);
}

.note-table-preview {
  display: -webkit-box;
  overflow: hidden;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.note-table-date,
.note-table-user {
  white-space: normal;
}

.note-table-open-cell {
  text-align: right;
}

.note-table-expanded-content {
  display: grid;
  gap: 10px;
}

.note-table-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  flex-wrap: wrap;
}

.note-table-actions form {
  display: inline-flex;
  margin: 0;
}

.note-table-actions .btn {
  min-width: 0;
  white-space: nowrap;
}

.note-table-row-pinned td {
  background: var(--color-amber-50);
}

.note-table-row-pinned td:first-child {
  box-shadow: inset 3px 0 0 var(--color-amber-500);
}

.note-table-row-deleted td:not(:last-child) {
  color: var(--color-slate-500);
  text-decoration: line-through;
}

.note-table-detail-row td {
  border-top: 0;
}

.note-table-expanded-cell {
  padding: 10px 12px !important;
  background: var(--color-slate-50);
}

.note-table-expanded-cell > .contact-form-compact,
.note-table-expanded-cell > .note-rich-body {
  width: 100%;
}

.note-table-empty {
  text-align: center !important;
}

.note-status-open {
  border-color: var(--color-green-300);
  background: var(--erp-success-soft);
  color: var(--color-green-800);
}

.note-status-in_progress {
  border-color: var(--color-amber-300);
  background: var(--color-amber-50);
  color: var(--color-amber-800);
}

.note-status-done {
  border-color: var(--color-blue-300);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
}

.note-status-archived {
  border-color: var(--color-slate-300);
  background: var(--color-slate-100);
  color: var(--color-slate-700);
}

.notes-empty-state {
  margin: 0;
  padding: 0;
  min-height: 0;
}

.note-importance-inline-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.note-importance-inline-row > label {
  margin: 0;
  white-space: nowrap;
}

.note-importance-inline-field .status-tiles {
  margin: 0;
}

.note-create-actions {
  margin-bottom: 10px;
}

.note-bulk-actions {
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  margin: -2px 0 4px;
  position: relative;
}

.note-bulk-selected-count {
  margin-right: auto;
  font-weight: 700;
  white-space: nowrap;
}

.note-selection-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  position: relative;
}

.note-selection-group-details {
  position: relative;
}

.note-selection-group-details > summary {
  list-style: none;
  cursor: pointer;
}

.note-selection-group-details > summary::-webkit-details-marker {
  display: none;
}

.note-selection-group-details[open] > summary {
  border-color: var(--color-blue-600);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
}

.note-selection-group-panel {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 30;
  width: 520px;
  max-width: min(520px, calc(100vw - 48px));
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--color-border-soft);
  border-radius: 8px;
  background: var(--color-white);
  box-shadow: 0 16px 35px rgba(15, 23, 42, 0.14);
}

.note-selection-group-title {
  font-size: 12px;
  line-height: 1.2;
}

.note-selection-group-panel .note-archive-controls {
  display: grid;
  grid-template-columns: minmax(150px, 190px) minmax(220px, 1fr);
  gap: 8px;
}

.note-selection-group-panel .note-archive-controls .field {
  min-width: 0;
}

.note-selection-group-panel .note-archive-controls label {
  font-size: 11px;
  margin-bottom: 3px;
}

.note-selection-group-panel .note-archive-controls select,
.note-selection-group-panel .note-archive-controls input:where(:not([type="checkbox"]):not([type="radio"])) {
  min-height: 32px;
}

.note-selection-group-submit-row {
  justify-content: flex-end;
  margin: 0;
}

.note-archive-controls {
  display: flex;
  align-items: end;
  gap: 8px;
  flex-wrap: wrap;
}

.note-archive-controls .field {
  margin: 0;
  min-width: 160px;
}

.note-archive-new-field {
  flex: 1 1 180px;
}

.note-bulk-actions .note-archive-controls {
  justify-content: flex-start;
}

.note-bulk-archive-details {
  position: relative;
}

.note-bulk-archive-details > summary {
  list-style: none;
  cursor: pointer;
}

.note-bulk-archive-details > summary::-webkit-details-marker {
  display: none;
}

.note-bulk-archive-details[open] > summary {
  border-color: var(--color-blue-600);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
}

.note-bulk-archive-panel {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 30;
  width: 520px;
  max-width: min(520px, calc(100vw - 48px));
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--color-border-soft);
  border-radius: 8px;
  background: var(--color-white);
  box-shadow: 0 16px 35px rgba(15, 23, 42, 0.14);
}

.note-bulk-archive-title {
  font-size: 12px;
  line-height: 1.2;
}

.note-bulk-archive-panel .note-archive-controls {
  display: grid;
  grid-template-columns: minmax(150px, 190px) minmax(220px, 1fr);
  gap: 8px;
}

.note-bulk-archive-panel .note-archive-controls .field {
  min-width: 0;
}

.note-bulk-archive-panel .note-archive-controls label {
  font-size: 11px;
  margin-bottom: 3px;
}

.note-bulk-archive-panel .note-archive-controls select,
.note-bulk-archive-panel .note-archive-controls input:where(:not([type="checkbox"]):not([type="radio"])) {
  min-height: 32px;
}

.note-bulk-archive-submit-row {
  justify-content: flex-end;
  margin: 0;
}

.note-inline-archive-form {
  flex: 1 1 100%;
  margin-top: 8px;
  padding: 10px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
}

.note-archive-group-filter {
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
}

.note-archive-group-title {
  font-weight: 800;
}

.note-archive-group-chip {
  gap: 8px;
  justify-content: space-between;
  max-width: 100%;
  min-width: 0;
}

.note-archive-group-chip-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.note-archive-group-chip-count {
  flex: 0 0 auto;
  min-width: 24px;
  text-align: center;
}

.note-badge-low {
  border-color: var(--color-slate-300);
  background: var(--color-slate-50);
  color: var(--color-slate-600);
}

.note-badge-medium {
  border-color: var(--color-sky-300);
  background: var(--color-sky-50);
  color: var(--color-sky-700);
}

.note-badge-high {
  border-color: var(--color-orange-300);
  background: var(--color-orange-50);
  color: var(--color-orange-700);
}

.note-badge-critical {
  border-color: var(--color-red-300);
  background: var(--color-red-50);
  color: var(--color-red-700);
}

.note-tiles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 6px 0 8px;
}

.note-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 4px 0 4px;
}

.note-kpi {
  padding: 6px 9px;
  border-width: 2px;
}

.note-kpi-slim {
  padding: 3px 7px;
  border-width: 1px;
  border-radius: var(--erp-chip-radius);
  width: auto;
  justify-content: flex-start;
}

.note-kpi-slim span {
  font-size: 11px;
}

.note-kpi-slim strong {
  font-size: 11px;
  line-height: 1.1;
}

.note-body-collapsed {
  margin-top: 4px;
}

.note-entry-actions {
  width: 100%;
  justify-content: flex-end;
  gap: 6px;
  margin: 6px 0 4px;
}

.note-entry-actions form {
  margin: 0;
}

.note-entry-actions .btn,
.note-entry-actions form .btn {
  min-width: 92px;
  justify-content: center;
}

.note-body-collapsed p {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.35;
}

.note-entry-item > .actions-row {
  gap: 6px;
  align-self: flex-start;
  justify-content: flex-end;
  min-width: 210px;
}

.note-entry-item > div:first-child {
  flex: 1 1 auto;
  min-width: 0;
}

.note-entry-item > .actions-row form {
  margin: 0;
}

.note-entry-item > .actions-row .btn,
.note-entry-item > .actions-row form .btn {
  min-width: 92px;
  justify-content: center;
}

.note-kpi span {
  font-weight: 600;
}

.note-kpi strong {
  font-weight: 800;
}

.note-kpi-importance-low {
  border-color: var(--color-slate-300);
  background: var(--color-slate-50);
}

.note-kpi-importance-low strong {
  color: var(--color-slate-600);
}

.note-kpi-importance-medium {
  border-color: var(--color-sky-300);
  background: var(--color-sky-50);
}

.note-kpi-importance-medium strong {
  color: var(--color-sky-700);
}

.note-kpi-importance-high {
  border-color: var(--color-orange-300);
  background: var(--color-orange-50);
}

.note-kpi-importance-high strong {
  color: var(--color-orange-700);
}

.note-kpi-importance-critical {
  border-color: var(--color-red-300);
  background: var(--color-red-50);
}

.note-kpi-importance-critical strong {
  color: var(--color-red-700);
}

.note-kpi-archive-group {
  border-color: var(--color-blue-300);
  background: var(--color-blue-50);
}

.note-kpi-archive-group strong {
  color: var(--color-blue-700);
}

.note-kpi-status-open {
  border-color: var(--color-blue-300);
  background: var(--color-blue-50);
}

.note-kpi-status-open strong {
  color: var(--color-blue-700);
}

.note-kpi-status-in_progress {
  border-color: var(--color-amber-300);
  background: var(--color-amber-50);
}

.note-kpi-status-in_progress strong {
  color: var(--color-amber-800);
}

.note-kpi-status-done {
  border-color: var(--color-green-300);
  background: var(--erp-success-soft);
}

.note-kpi-status-done strong {
  color: var(--color-green-800);
}

.erp-table a:not(.btn) {
  text-decoration: none;
  color: var(--color-blue-700);
  font-weight: 600;
}

.erp-table a:not(.btn):hover {
  color: var(--color-blue-800);
}

.erp-table a.btn-action-edit {
  color: var(--action-edit-text);
}

.erp-table a.btn-action-edit:hover {
  color: var(--action-edit-text);
}

.calendar-head-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.calendar-events-list {
  display: grid;
  gap: 8px;
}

.calendar-event-row {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--erp-surface-muted);
  padding: 8px 10px;
  display: grid;
  grid-template-columns: 130px minmax(0, 1.45fr) minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  text-decoration: none;
  color: inherit;
}

.calendar-event-row:hover {
  border-color: var(--color-blue-200);
  background: var(--erp-surface-muted);
}

.calendar-event-row,
.calendar-event-row strong,
.calendar-event-row span {
  font-size: 12px;
  line-height: 1.2;
}

.calendar-event-row span {
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.calendar-row-when {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
}

.calendar-row-title {
  font-weight: 600;
}

.calendar-row-affects {
  text-align: left;
}

.collaborate-topics-table-wrap {
  margin-top: 10px;
}

.collaborate-topics-table {
  min-width: 1180px;
  table-layout: fixed;
}

.collaborate-topics-table th,
.collaborate-topics-table td {
  vertical-align: middle;
}

.collaborate-topic-updated-col { width: 118px; }
.collaborate-topic-title-col { width: 22%; }
.collaborate-topic-context-col { width: 22%; }
.collaborate-topic-kind-col { width: 145px; }
.collaborate-topic-status-col { width: 125px; }
.collaborate-topic-importance-col { width: 125px; }
.collaborate-topic-count-col { width: 92px; text-align: center; }
.collaborate-topic-action-col { width: 96px; text-align: right; }

.collaborate-topic-title,
.collaborate-topic-context {
  min-width: 0;
  overflow-wrap: anywhere;
}

.collaborate-topic-updated,
.collaborate-topic-count {
  font-variant-numeric: tabular-nums;
}

.collaborate-topic-count {
  text-align: center;
}

.collaborate-topic-action {
  text-align: right;
}

.collaborate-topic-row-pinned td {
  background: var(--color-amber-50);
}

.collaborate-topic-row-pinned td:first-child {
  box-shadow: inset 3px 0 0 var(--color-amber-500);
}

.collaborate-topic-table-empty {
  text-align: center;
}

.calendar-type-badge {
  border: 1px solid var(--color-border);
  background: var(--color-slate-50);
  color: var(--color-slate-700);
  border-radius: var(--erp-chip-radius);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  padding: 3px 8px;
  min-width: 78px;
  text-align: center;
}

.calendar-row-badges {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: wrap;
}

.calendar-row-badges .note-badge-status {
  text-transform: none;
  letter-spacing: 0;
  min-width: 78px;
  text-align: center;
}

.calendar-shared-badge {
  border-color: var(--color-blue-200);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
}

.calendar-reminder-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.calendar-reminder-option {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: var(--erp-chip-radius);
  padding: 4px 10px;
  background: var(--erp-surface-muted);
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

.calendar-collaborators-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.collaborate-topic-summary {
  display: grid;
  gap: 8px;
  margin-top: 6px;
}

.collaborate-topic-title-line {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.collaborate-topic-title-text {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 15px;
  font-weight: 500;
  color: var(--text);
}

.collaborate-topic-meta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.collaborate-topic-meta-item {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--erp-surface-muted);
  padding: 7px 9px;
  font-size: 12px;
  line-height: 1.25;
}

.collaborate-topic-meta-item > span:not(.note-badge-status):not(.collaborate-status-badge) {
  min-width: 0;
  overflow-wrap: anywhere;
}

.collaborate-topic-label {
  flex: 0 0 auto;
  font-weight: 800;
  color: var(--text);
}

.collaborate-topic-empty {
  color: var(--muted);
}

.collaborate-topic-description-row {
  grid-column: 1 / -1;
  align-items: start;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
}

.collaborate-topic-description {
  margin: 0;
  min-width: 0;
  text-align: left;
}

.collaborate-topic-detail-page {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--erp-section-gap);
}

.collaborate-detail-compact-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.collaborate-detail-compact-panel .panel-head-compact {
  align-items: center;
  margin-bottom: 0;
  min-height: 32px;
  padding-bottom: 0;
}

.collaborate-detail-compact-panel.is-section-collapsed,
.collaborate-topic-edit-panel:has(#collaborateTopicEditForm.is-collapsed) {
  min-height: 50px;
}

.collaborate-detail-compact-panel .panel-head-compact + .calendar-collaborators-list {
  margin-top: 10px;
}

.collaborate-topic-edit-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.collaborate-topic-edit-panel .panel-head-compact {
  margin-bottom: 0;
  padding-bottom: 0;
}

.collaborate-topic-edit-panel #collaborateTopicEditForm:not(.is-collapsed) {
  margin-top: 10px;
}

/* New note: importance and its tiles to the right of «Ορατότητα», on the same row (owner, To-do 1.122). */
.company-form-grid > .note-importance-beside {
  grid-column: span 3;
  align-self: end;
}

/* On the 2- and 1-column form grids these fields take the whole row instead of adding implicit columns. */
@media (max-width: 1100px) {
  .company-form-grid > .note-importance-beside {
    grid-column: 1 / -1;
  }

  .company-form-grid > .organization-address-field {
    grid-column: span 1;
  }

  .organization-phones-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Profile > Προσωπικές Ρυθμίσεις > Ωράριο εργασίας (owner, To-do 1.122). */
.profile-work-hours,
.profile-work-days {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 12px;
}

/* Collaborate «Share»: the teams box looks like the people picker above it (owner, To-do 1.122). */
.collaborate-share-teams {
  border: 1px solid var(--erp-border);
  border-radius: 8px;
  background: var(--color-white);
  padding: 8px;
  margin: 0;
  min-width: 0;
}

.collaborate-share-teams legend {
  padding: 0 4px;
  font-size: 12px;
  color: var(--color-slate-600);
}

.collaborate-share-team-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
}

.collaborate-member-picker.team-member-picker,
.calendar-user-picker.team-member-picker,
.task-user-picker.team-member-picker {
  border: 1px solid var(--erp-border);
  border-radius: 8px;
  background: var(--color-white);
  padding: 8px;
  display: grid;
  gap: 8px;
  min-width: 0;
  max-width: 100%;
}

.team-member-picker-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  flex-wrap: wrap;
}

.team-member-picker-head-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 1 auto;
  flex-wrap: wrap;
  min-width: 0;
}

[data-user-picker] [hidden] {
  display: none !important;
}

.team-member-picker-body {
  display: grid;
  gap: 8px;
}

.team-member-picker.is-picker-collapsed .team-member-picker-body {
  display: none;
}

.collaborate-member-picker .team-member-picker-toolbar,
.task-user-picker .team-member-picker-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  gap: 6px;
  align-items: center;
}

.collaborate-member-picker .team-member-picker-toolbar input:where(:not([type="checkbox"]):not([type="radio"])),
.task-user-picker .team-member-picker-toolbar input:where(:not([type="checkbox"]):not([type="radio"])) {
  min-height: 34px;
}

.collaborate-member-picker .team-member-list,
.task-user-picker .team-member-list {
  display: grid;
  gap: 3px;
  max-height: 280px;
  overflow: auto;
  padding-right: 2px;
}

.collaborate-member-picker .team-member-row,
.task-user-picker .team-member-row {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 6px;
  align-items: center;
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-slate-50);
  min-height: 28px;
  padding: 3px 7px;
  cursor: pointer;
  overflow: hidden;
}

.collaborate-member-picker .team-member-row:hover,
.task-user-picker .team-member-row:hover {
  border-color: var(--color-blue-200);
  background: var(--color-blue-50);
}

.collaborate-member-picker .team-member-check,
.task-user-picker .team-member-check {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
}

.collaborate-member-picker .team-member-checkbox,
.task-user-picker .team-member-checkbox {
  width: 13px;
  height: 13px;
  margin: 0;
  accent-color: var(--color-blue-700);
}

.collaborate-member-picker .team-member-line,
.task-user-picker .team-member-line {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
}

.collaborate-member-picker .team-member-name,
.task-user-picker .team-member-name {
  font-size: 12px;
  font-weight: 800;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
}

.collaborate-member-picker .team-member-username,
.collaborate-member-picker .team-member-meta-inline,
.collaborate-member-picker .team-member-separator,
.task-user-picker .team-member-username,
.task-user-picker .team-member-meta-inline,
.task-user-picker .team-member-separator {
  font-size: 11px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
}

.collaborate-member-picker .team-member-selected,
.task-user-picker .team-member-selected {
  min-height: 18px;
  font-size: 11px;
  color: var(--muted);
  overflow-wrap: anywhere;
}

.task-user-picker .team-member-selected-panel {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
}

.task-user-picker .team-member-selected-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  min-height: 24px;
  padding: 3px 7px;
  border: 1px solid var(--color-blue-100);
  border-radius: var(--erp-chip-radius);
  background: var(--color-blue-50);
  color: var(--color-blue-900);
  white-space: nowrap;
}

.task-user-picker .team-member-selected-pill strong,
.task-user-picker .team-member-selected-pill small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.task-user-picker .team-member-selected-pill strong {
  font-size: 11px;
  font-weight: 800;
}

.task-user-picker .team-member-selected-pill small {
  font-size: 10px;
  color: var(--color-slate-600);
}

.calendar-collaborator-option {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: var(--erp-chip-radius);
  padding: 4px 10px;
  background: var(--erp-surface-muted);
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

.collaborate-comments-list {
  margin-top: 12px;
  display: grid;
  gap: 8px;
}

.collaborate-status-badge {
  display: inline-flex;
  align-items: center;
  margin-left: 4px;
  border: 1px solid var(--color-border);
  border-radius: var(--erp-chip-radius);
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
}

.collaborate-status-open {
  border-color: var(--color-green-300);
  background: var(--erp-success-soft);
  color: var(--color-green-800);
}

.collaborate-status-in_progress {
  border-color: var(--color-amber-300);
  background: var(--color-amber-50);
  color: var(--color-amber-800);
}

.collaborate-status-resolved {
  border-color: var(--color-blue-300);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
}

.collaborate-status-closed {
  border-color: var(--color-slate-300);
  background: var(--color-slate-50);
  color: var(--color-slate-600);
}

.collaborate-comment-item {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--erp-surface-muted);
  padding: 10px;
  display: grid;
  gap: 6px;
}

.collaborate-comment-item.is-highlighted {
  border-color: var(--color-blue-400);
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

.collaborate-comment-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.collaborate-replies-list {
  margin-top: 6px;
  margin-left: 18px;
  border-left: 2px solid var(--color-blue-100);
  padding-left: 10px;
  display: grid;
  gap: 6px;
}

.collaborate-comment-reply {
  background: var(--erp-surface-muted);
}

.collaborate-mention {
  display: inline-block;
  border: 1px solid var(--color-blue-200);
  border-radius: var(--erp-chip-radius);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
  padding: 0 6px;
  font-weight: 600;
}

.collaborate-mention-suggest {
  margin-top: 6px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--color-blue-100);
  border-radius: 10px;
  background: var(--erp-surface-muted);
}

.collaborate-mention-suggest .btn.is-active {
  border-color: var(--color-blue-300);
  background: var(--color-blue-100);
  color: var(--color-blue-700);
}

.inline-form {
  display: inline;
}

.calendar-reminder-custom {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px dashed var(--color-slate-300);
  border-radius: var(--erp-chip-radius);
  padding: 4px 10px;
  background: var(--color-slate-50);
}

.calendar-reminder-custom-inputs {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.calendar-reminder-custom-inputs input:where(:not([type="checkbox"]):not([type="radio"])),
.calendar-reminder-custom-inputs select {
  width: auto;
  min-width: 74px;
  height: 32px;
  padding: 5px 8px;
}

.calendar-reminder-option input[type="checkbox"],
.calendar-recurring-toggle input[type="checkbox"],
.calendar-collaborator-option input[type="checkbox"] {
  width: 14px;
  height: 14px;
  min-width: 14px;
  min-height: 14px;
  margin: 0;
  padding: 0;
}

.calendar-recurring-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
}

.calendar-recurring-wrap {
  margin-top: 20px;
}

.calendar-recurring-controls {
  display: grid;
  grid-template-columns: repeat(3, minmax(110px, 160px));
  gap: 8px;
  align-items: end;
  margin-top: 8px;
  min-width: 0;
}

.calendar-recurring-control {
  min-width: 0;
}

.calendar-recurring-control label {
  margin-bottom: 4px;
}

.calendar-recurring-control input:where(:not([type="checkbox"]):not([type="radio"])),
.calendar-recurring-control select {
  height: 34px;
  padding: 6px 8px;
}

.calendar-create-actions {
  margin-top: 20px;
}

.hr-leaves-hero .panel-head {
  margin-bottom: 8px;
}

.hr-leave-stats {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.hr-leave-list {
  margin-top: 8px;
}

.hr-leave-row {
  grid-template-columns: 110px minmax(150px, 1fr) minmax(220px, 2fr) auto minmax(180px, auto);
}

.hr-leave-row-actions {
  justify-content: flex-end;
}

.hr-leave-row-actions input[type='text'] {
  height: 30px;
  min-width: 160px;
}

.calendar-filters-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.calendar-main-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.calendar-filters-panel .panel-head-compact {
  margin-bottom: 0;
  padding-bottom: 0;
}

.calendar-main-panel .panel-head-compact {
  margin-bottom: 0;
  padding-bottom: 0;
}

.calendar-create-panel .panel-head-compact {
  margin-bottom: 0;
  padding-bottom: 0;
}

.calendar-period-events-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.calendar-period-events-panel .panel-head-compact {
  margin-bottom: 0;
  padding-bottom: 0;
}

.calendar-filters-panel #calendarFiltersBody:not(.is-collapsed) {
  margin-top: 10px;
}

.deadlines-filters-panel #deadlinesFiltersBody:not(.is-collapsed) {
  margin-top: 10px;
}

.calendar-create-panel #calendarEventCreateForm:not(.is-collapsed) {
  margin-top: 10px;
}

.calendar-main-panel #calendarEventCreateForm:not(.is-collapsed) {
  margin-top: 10px;
}

.calendar-period-events-panel #calendarPeriodEventsBody:not(.is-collapsed) {
  margin-top: 10px;
}

.calendar-filters-panel .form-grid {
  margin-top: 0;
}

.deadlines-filters-panel .form-grid {
  margin-top: 0;
}

.deadlines-results-panel .panel-head-compact {
  margin-bottom: 8px;
}

.deadline-priority-chips {
  justify-content: flex-end;
}

.deadlines-table-wrap {
  margin-top: 0;
}

.deadlines-table .note-badge-status {
  white-space: nowrap;
}

.deadlines-table td:last-child {
  text-align: right;
}

.deadline-row-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
  min-width: 150px;
}

.task-table-wrap {
  margin-top: 0;
  overflow-x: auto;
  min-width: 0;
  max-width: 100%;
}

.task-table th,
.task-table td {
  vertical-align: middle;
}

.task-table .task-table-title {
  min-width: 180px;
}

.task-table .task-table-context {
  min-width: 180px;
}

.task-table .task-table-users {
  min-width: 140px;
}

.task-table .task-table-date,
.task-table .note-badge-status {
  white-space: nowrap;
}

.task-status-open {
  background: var(--color-green-100);
  color: var(--color-green-800);
  border-color: var(--color-green-300);
}

.task-table td:last-child {
  text-align: right;
}

.task-table-empty {
  text-align: center;
}

.collaborate-filters-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.collaborate-filters-panel .panel-head-compact {
  margin-bottom: 0;
  padding-bottom: 0;
}

.collaborate-filters-panel #collaborateFiltersBody:not(.is-collapsed) {
  margin-top: 10px;
}

.collaborate-filters-panel .form-grid {
  margin-top: 0;
}

.collaborate-topics-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.collaborate-topics-panel .panel-head-compact {
  margin-bottom: 0;
  padding-bottom: 0;
}

.collaborate-create-form:not(.is-collapsed) {
  margin-top: 10px;
  padding: 10px 0;
  border-top: 1px solid var(--color-border-soft);
  border-bottom: 1px solid var(--color-border-soft);
}

.collaborate-create-form .form-grid {
  margin-top: 0;
}

.collaborate-create-form .calendar-create-actions {
  margin-top: 10px;
}

.pm-notes-filters-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.pm-notes-filters-panel .panel-head-compact {
  margin-bottom: 0;
  padding-bottom: 0;
}

.pm-notes-filters-panel #pmNotesFiltersBody:not(.is-collapsed) {
  margin-top: 10px;
}

.pm-notes-filters-panel .form-grid {
  margin-top: 0;
}

.crm-tasks-filters-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.crm-tasks-filters-panel .panel-head-compact {
  margin-bottom: 0;
  padding-bottom: 0;
}

.crm-tasks-filters-panel #crmTasksFiltersBody:not(.is-collapsed) {
  margin-top: 10px;
}

.crm-tasks-filters-panel .form-grid {
  margin-top: 0;
}

.collaborate-linked-tasks-panel {
  padding-top: 8px;
  padding-bottom: 8px;
}

.collaborate-linked-tasks-panel .panel-head-compact {
  margin-bottom: 0;
  padding-bottom: 0;
}

.collaborate-linked-tasks-panel #collaborateLinkedTasksBody:not(.is-collapsed) {
  margin-top: 10px;
}

.calendar-create-panel .form-grid {
  margin-top: 0;
}

.calendar-create-panel .calendar-create-actions {
  margin-top: 12px;
}

.calendar-span-link.is-active {
  border-color: var(--color-blue-300);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
}

.calendar-legend {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin: 8px 0;
}

.calendar-legend-chip {
  border: 1px solid var(--line);
  border-radius: var(--erp-chip-radius);
  padding: 3px 8px;
  font-size: 11px;
  background: var(--surface-2);
  color: var(--color-slate-700);
}

.calendar-grid-wrap {
  margin-top: 6px;
  display: grid;
  gap: 2px;
}

.calendar-months-grid {
  display: grid;
  gap: 12px;
}

.calendar-months-grid.is-two-months {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}

.calendar-month-panel {
  min-width: 0;
}

.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 2px;
}

.calendar-weekday {
  font-size: 12px;
  color: var(--color-slate-500);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 4px 8px;
}

.calendar-day {
  border: 1px solid var(--color-slate-200);
  border-radius: 10px;
  min-height: 122px;
  background: var(--color-white);
  padding: 6px;
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 4px;
}

.calendar-day.is-outside {
  /* A little darker than the month's own days (owner, To-do 1.122). */
  background: var(--color-slate-100);
}

.calendar-day.is-outside .calendar-day-head {
  color: var(--color-slate-500);
}

.calendar-day.is-today {
  border-color: var(--color-blue-600);
  box-shadow: inset 0 0 0 1px var(--color-blue-600);
}

.calendar-day-head {
  font-weight: 700;
  font-size: 12px;
  color: var(--color-slate-700);
}

.calendar-day-events {
  display: grid;
  gap: 4px;
  align-content: start;
}

.calendar-event-chip {
  border: 1px solid var(--erp-primary-soft);
  background: var(--color-blue-50);
  border-radius: 8px;
  padding: 4px 6px;
  color: var(--color-blue-900);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-decoration: none;
}

.calendar-event-chip .time {
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}

.calendar-event-chip .text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.calendar-chip-importance {
  padding: 1px 5px;
  border-radius: var(--erp-chip-radius);
  font-size: 9px;
  line-height: 1.1;
}

.calendar-more {
  font-size: 11px;
  color: var(--color-slate-500);
}

.calendar-event-chip.status-deadline,
.calendar-event-row.status-deadline,
.calendar-legend-chip.status-deadline {
  border-color: var(--color-red-200);
  background: var(--color-red-50);
  color: var(--color-red-800);
}

.calendar-event-chip.status-critical,
.calendar-event-row.status-critical,
.calendar-legend-chip.status-critical {
  border-color: var(--color-red-300);
  background: var(--color-rose-50);
  color: var(--color-rose-700);
}

.calendar-event-chip.status-high,
.calendar-event-row.status-high,
.calendar-legend-chip.status-high {
  border-color: var(--color-orange-300);
  background: var(--color-orange-50);
  color: var(--color-orange-700);
}

.calendar-event-chip.status-medium,
.calendar-event-row.status-medium,
.calendar-legend-chip.status-medium {
  border-color: var(--color-sky-300);
  background: var(--color-sky-50);
  color: var(--color-sky-700);
}

.calendar-event-chip.status-low,
.calendar-event-row.status-low,
.calendar-legend-chip.status-low {
  border-color: var(--color-slate-300);
  background: var(--color-slate-50);
  color: var(--color-slate-600);
}

.calendar-event-chip.status-task,
.calendar-event-row.status-task {
  border-color: var(--color-blue-200);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
}

.calendar-event-chip.status-event,
.calendar-event-row.status-event,
.calendar-legend-chip.status-event {
  border-color: var(--color-blue-300);
  background: var(--color-blue-50);
  color: var(--color-blue-700);
}

.calendar-event-chip.status-reminder,
.calendar-event-row.status-reminder,
.calendar-legend-chip.status-reminder {
  border-color: var(--color-amber-200);
  background: var(--color-amber-50);
  color: var(--color-amber-800);
}

.calendar-event-row.status-deadline .muted,
.calendar-event-row.status-event .muted,
.calendar-event-row.status-reminder .muted,
.calendar-event-row.status-critical .muted,
.calendar-event-row.status-high .muted,
.calendar-event-row.status-medium .muted,
.calendar-event-row.status-low .muted,
.calendar-event-row.status-task .muted {
  color: inherit;
  opacity: 0.85;
}

@media (max-width: 1100px) {
  .kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .company-kv-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .company-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .investment-header-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .investment-project-details-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .extra-company-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }


  .relation-choice-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .size-metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mme-calculator-panel .mme-entity-meta-grid {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .mme-calculator-panel .mme-section-head,
  .mme-calculator-panel .mme-entity-head {
    grid-template-columns: 1fr;
    row-gap: 6px;
  }

  .note-tiles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .calendar-event-row {
    grid-template-columns: 1fr;
    align-items: start;
  }
}

@media print {
  .sidebar,
  .topbar,
  .messages,
  .actions-row,
  [data-collapse-toggle],
  [data-toggle-target] {
    display: none !important;
  }

  .shell,
  .content-wrap,
  .content,
  .panel {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    border: none !important;
    background: var(--color-white) !important;
  }

  .panel {
    page-break-inside: avoid;
    break-inside: avoid;
    margin-bottom: 12px !important;
  }

  .content .is-collapsed,
  .content .hidden {
    display: block !important;
  }

a {
    color: var(--color-black) !important;
    text-decoration: none !important;
  }
}

.crm-field-arrange-columns {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  align-items: start;
  margin-top: 6px;
}

.crm-field-arrange-column {
  display: grid;
  align-content: start;
  gap: 6px;
  min-height: 84px;
  padding: 8px;
  border: 1px dashed var(--color-slate-300);
  border-radius: 8px;
  background: var(--color-slate-50);
}

.crm-field-arrange-column.drag-over,
.crm-field-arrange-slot.drag-over,
.crm-field-arrange-card.drag-over {
  border-color: var(--color-blue-600);
  background: var(--color-blue-50);
}

.crm-field-arrange-column-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--color-slate-600);
}

.crm-field-arrange-card {
  display: grid;
  place-items: center;
  min-height: 50px;
  padding: 8px 10px;
  border: 1px solid var(--color-border-soft);
  border-radius: 8px;
  background: var(--color-white);
  cursor: grab;
  text-align: center;
}

.crm-field-arrange-card strong {
  min-width: 0;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  line-height: 1.25;
}

.crm-field-arrange-card.is-dragging {
  opacity: 0.72;
}

.crm-field-arrange-slot {
  min-height: 26px;
  border: 1px dashed var(--color-blue-200);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-white);
}

.document-rich-source {
  display: none;
}

.settings-document-checklist-texts-panel .document-rich-field {
  gap: 6px;
}

.document-text-preview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.document-text-preview-card {
  border: 1px solid var(--color-slate-200);
  border-radius: 8px;
  background: var(--color-white);
  padding: 8px 10px;
  min-width: 0;
}

.document-text-preview-card h5 {
  margin: 0 0 6px;
  font-size: 0.9rem;
  line-height: 1.2;
  color: var(--color-slate-900);
}

.document-text-preview {
  color: var(--color-slate-700);
  font-size: 0.9rem;
  line-height: 1.45;
}

.document-rich-editor {
  min-height: 126px;
}

.doc-page-number-hint {
  text-align: right;
}

.doc-export-options {
  align-items: center;
  flex-wrap: nowrap;
  overflow-x: auto;
}

.doc-export-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  flex: 0 0 auto;
}

.doc-export-toggle input[type="checkbox"] {
  width: 16px;
  height: 16px;
  min-width: 16px;
  margin: 0;
  flex: 0 0 16px;
}

/* Global dates and deadlines engine */
.deadline-mode-switch {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin: 0 0 10px;
}

.deadline-mode-switch .btn {
  justify-content: center;
  width: 100%;
}

.deadline-mode-switch .btn.is-active {
  color: var(--color-white);
  background: var(--color-slate-900);
  border-color: var(--color-slate-900);
}

.deadline-control-header,
.deadline-control-filters,
.deadline-control-results,
.deadline-batch-summary,
.deadline-batch-items,
.deadline-batch-create,
.deadline-rules-head,
.deadline-approvals-panel,
.deadline-template-settings,
.deadline-type-settings {
  margin-bottom: 10px;
}

.deadline-control-tabs {
  display: grid;
  grid-template-columns: repeat(var(--deadline-control-tab-count, 1), minmax(0, 1fr));
  gap: 6px;
  margin: 0 0 10px;
}

.deadline-control-tabs .btn {
  justify-content: center;
  width: 100%;
}

.deadline-control-tabs .btn.is-active {
  color: var(--erp-on-accent);
  background: var(--color-blue-600);
  border-color: var(--color-blue-600);
}

.deadline-tab-count {
  display: inline-grid;
  place-items: center;
  min-width: 20px;
  height: 20px;
  margin-left: 6px;
  padding: 0 5px;
  border-radius: 999px;
  color: var(--color-blue-700);
  background: var(--color-blue-100);
  font-size: 11px;
  line-height: 1;
  font-weight: 700;
}

.deadline-control-tabs .btn.is-active .deadline-tab-count {
  color: var(--color-blue-700);
  background: var(--color-white);
}

.deadline-control-actions-popover {
  display: grid;
  gap: 6px;
  width: min(260px, calc(100vw - 40px));
}

.deadline-control-actions-popover .btn,
.deadline-control-actions-popover form {
  width: 100%;
}

.deadline-control-actions-popover .btn {
  justify-content: flex-start;
}

.deadline-audience-chip {
  white-space: nowrap;
  letter-spacing: 0;
  text-transform: none;
}

.deadline-audience-user {
  color: var(--color-blue-800);
  border-color: var(--color-blue-300);
  background: var(--color-blue-100);
}

.deadline-audience-global {
  color: var(--color-green-800);
  border-color: var(--color-green-300);
  background: var(--color-green-100);
}

.deadline-batch-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 16px;
  padding: 8px 0;
}

.deadline-batch-form-grid {
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

.deadline-rule-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.deadline-batch-field-half {
  grid-column: span 6;
}

.deadline-batch-field-full {
  grid-column: 1 / -1;
}

.deadline-batch-form-grid .field-inline {
  grid-template-columns: 190px minmax(0, 1fr);
}

.deadline-batch-form-grid .field-inline > label {
  white-space: nowrap;
}

.deadline-selected-titles {
  display: block;
  max-width: min(1100px, 78vw);
  overflow-wrap: anywhere;
}

.deadline-approval-form {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.deadline-emergency-override {
  width: fit-content;
  justify-self: start;
  font-size: var(--fs-small);
  line-height: 1.3;
}

.deadline-type-editor-row > td {
  padding: 8px 14px;
  background: var(--color-slate-50);
}

.deadline-template-editor {
  padding-top: 10px;
  border-top: 1px solid var(--color-slate-200);
}

.deadline-template-form-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.deadline-template-details {
  grid-column: span 2;
}

.deadline-template-preview {
  margin: 10px 0;
  padding: 10px 0;
  border-top: 1px solid var(--color-slate-200);
  border-bottom: 1px solid var(--color-slate-200);
}

.deadline-template-activate-form {
  margin-top: 8px;
}

.deadline-template-editor-row > td {
  background: var(--color-slate-50);
}

.deadline-resolution-summary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 10px;
}

.deadline-resolution-summary .field-inline {
  grid-template-columns: minmax(90px, auto) minmax(0, 1fr);
}

.deadline-resolution-blockers {
  display: grid;
  gap: 4px;
  margin: 8px 0 10px;
  padding: 8px 10px;
  border: 1px solid var(--erp-danger);
  border-radius: 8px;
  background: var(--erp-danger-soft);
}

.deadline-resolution-current {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin: 8px 0 10px;
}

.deadline-resolution-current p {
  flex-basis: 100%;
  margin: 0;
}

.relation-choice-grid.company-relation-choices {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 720px;
  gap: 8px;
}
.company-relation-choices .relation-toggle {
  min-height: 40px;
  padding: 8px 12px;
  gap: 8px;
  font-size: 12px;
  line-height: 1.4;
  cursor: pointer;
}
.company-relation-choices .relation-toggle span { white-space: normal; }
.company-relation-choices .relation-toggle:hover { border-color: var(--erp-primary); }
.company-relation-choices .relation-toggle:has(input:checked) {
  border-color: var(--erp-primary);
  background: var(--erp-primary-soft);
  color: var(--erp-primary-text);
}
.company-relation-choices .relation-toggle:has(input:focus-visible) {
  outline: 2px solid var(--erp-primary);
  outline-offset: 2px;
}
.company-relation-choices .relation-toggle input[type="radio"] {
  width: 16px;
  height: 16px;
  min-width: 16px;
  min-height: 16px;
  flex: 0 0 16px;
  accent-color: var(--erp-primary);
}
.company-relation-choices .relation-toggle input[type="radio"]:focus { box-shadow: none; }

.settings-user-login-toggle {
  width: 100%;
  height: 36px;
  min-height: 36px;
  margin: 0;
  box-sizing: border-box;
}

.investment-long-term-periods { margin-top: 8px; }
.investment-long-term-periods .investment-stage-tab-section-head { padding-block: 8px; }
.investment-long-term-periods form { margin: 0; }
.investment-long-term-periods-table { min-width: 880px; }
.investment-long-term-periods-table td { vertical-align: middle; padding-block: 8px; }
.investment-long-term-periods-table input[type="date"] { width: 156px; min-width: 156px; }
.investment-long-term-period-actions { display: flex; justify-content: flex-end; align-items: center; flex-wrap: wrap; gap: 6px; }
.investment-long-term-period-actions .actions-row { margin: 0; }
.investment-stage-records .investment-implementation-request-navigation > form { display: flex; align-items: center; gap: 8px; }
.investment-stage-records .investment-implementation-request-navigation select { min-width: 170px; }
/* Reusable concurrent-editing presence and lease state. */
.edit-lease-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 32px;
  margin: 0 0 8px;
  padding: 5px 8px;
  border: 1px solid var(--erp-border);
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
}

.edit-lease-status.is-owned {
  color: var(--color-green-700);
  background: var(--color-green-50);
  border-color: var(--color-green-300);
}

.edit-lease-status.is-pending {
  color: var(--color-blue-700);
  background: var(--color-blue-50);
  border-color: var(--color-blue-300);
}

.edit-lease-status.is-blocked {
  color: var(--color-amber-800);
  background: var(--color-amber-50);
  border-color: var(--color-amber-300);
}

.edit-lease-status.is-error {
  color: var(--color-red-700);
  background: var(--color-red-50);
  border-color: var(--color-red-300);
}

.edit-lease-status-actions,
.edit-lease-force-form {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}

.edit-lease-force-form {
  flex: 1 1 100%;
}

.edit-lease-force-form input:where(:not([type="checkbox"]):not([type="radio"])) {
  flex: 1 1 260px;
  min-width: 180px;
  height: 32px;
}

.edit-lease-history-link {
  white-space: nowrap;
}

.concurrent-edit-history-filters {
  grid-template-columns: repeat(4, minmax(150px, 1fr)) auto;
  align-items: end;
}

.concurrent-edit-history-filters .actions-row {
  margin: 0;
}

.concurrent-edit-history-table {
  min-width: 1180px;
}

.concurrent-edit-history-table code {
  font-size: 11px;
  white-space: normal;
  overflow-wrap: anywhere;
}

.concurrent-edit-history-table .history-value {
  max-width: 280px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* To-do 1.81: availability. A label for colleagues, never a record of work. Every colour
   is a shared semantic token, so both themes and any later palette change follow it. */
.availability-badge {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 12px;
  line-height: 1.3;
  color: var(--erp-text);
}

.availability-dot {
  flex: 0 0 8px;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--erp-success);
}

.availability-dot.is-success { background: var(--erp-success); }
.availability-dot.is-warning { background: var(--erp-warning); }
.availability-dot.is-danger { background: var(--erp-danger); }
.availability-dot.is-info { background: var(--erp-info); }
.availability-dot.is-muted { background: var(--erp-text-muted); }

.availability-label {
  font-weight: 600;
}

.availability-message,
.availability-until {
  color: var(--erp-text-muted);
}
/* In a list of people the message is a hint, not a paragraph. */
.availability-message-brief {
  max-width: 24ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* In a picker row the name comes first; the status takes the space that is left and is cut
   short there, instead of squeezing the name on a phone. Rows without a status are unchanged. */
.task-user-picker .team-member-line:has(.availability-badge) .team-member-name,
.collaborate-member-picker .team-member-line:has(.availability-badge) .team-member-name {
  flex-shrink: 0;
  max-width: 55%;
}

.task-user-picker .team-member-line .availability-badge,
.collaborate-member-picker .team-member-line .availability-badge {
  flex: 0 1 auto;
  flex-wrap: nowrap;
  min-width: 0;
  margin-left: auto;
  overflow: hidden;
}

.team-member-line .availability-label {
  flex-shrink: 0;
}

.team-member-line .availability-message-brief {
  min-width: 0;
  flex: 0 1 auto;
}

/* The avatar clips its content to a circle, so the status sits beside it, not inside. */
.user-avatar-wrap {
  position: relative;
  display: inline-flex;
}

.user-avatar-status {
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 9px;
  height: 9px;
  box-shadow: 0 0 0 2px var(--surface);
}

.user-menu-availability {
  display: grid;
  gap: 2px;
  padding-bottom: 6px;
  margin-bottom: 4px;
  border-bottom: 1px solid var(--line);
}

.user-menu-availability-now {
  display: grid;
  gap: 2px;
  padding: 6px 8px;
}

.availability-quick {
  display: grid;
}

.availability-option {
  display: flex;
  align-items: center;
  gap: 8px;
}

.availability-option.is-current {
  background: var(--erp-primary-soft);
}

.availability-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
}

.availability-choice {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: var(--erp-chip-radius);
  cursor: pointer;
}

/* The shared input styles give fields a height; a radio caught by them grows into a large
   circle as soon as its label wraps. Same fix the profile checkboxes already use. */
.availability-choice input[type="radio"] {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  min-height: 0;
  margin: 0;
}

.availability-choice {
  white-space: nowrap;
}

.availability-choice:has(input:checked) {
  border-color: var(--erp-primary);
  background: var(--erp-primary-soft);
}

.availability-now {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.chat-details-availability {
  display: flex;
  justify-content: center;
}

/* The details card is centred; a long message wraps, so its lines centre with it. */
.chat-details-availability .availability-badge {
  justify-content: center;
  text-align: center;
}

/* Several organizations, one account (ORGANIZATIONS.md): the choice after the password and the top bar's change. */
.organization-choices {
  gap: 8px;
}

.organization-choice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  color: var(--erp-text);
  font: inherit;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}

.organization-choice::after {
  content: "\203A";
  color: var(--muted);
  font-size: 1.3em;
  line-height: 1;
}

.organization-choice:hover,
.organization-choice:focus-visible {
  border-color: var(--color-blue-300);
  background: var(--color-slate-50);
}

.organization-choice-cancel {
  display: flex;
  justify-content: center;
  margin: 4px 0 0;
}

/* To-do 1.130 (owner, 16/10/2026): the organization this session is in, quietly at the foot of the sidebar. It
   is changed by signing out and choosing another at sign-in; the top bar has no change of organization. */
.sidebar {
  display: flex;
  flex-direction: column;
}

.sidebar > * {
  flex-shrink: 0;
}

.sidebar-organization {
  margin-top: auto;
  padding: 16px 8px 2px;
  display: grid;
  gap: 1px;
  font-size: 11px;
  line-height: 1.35;
  color: var(--erp-sidebar-text-soft);
  opacity: 0.72;
}

.sidebar-organization small {
  font-size: 10px;
}

.sidebar-organization span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.sidebar-collapsed .sidebar-organization {
  display: none;
}

/* A form of the ERP shown inside a module's own window (MODULE_SOCKETS.md «Task context»): the page without the
   shell around it. The window is the module's; its width is not the ERP's to demand. */
body[data-embedded="1"] .sidebar,
body[data-embedded="1"] .topbar {
  display: none;
}
body[data-embedded="1"] .shell {
  display: block;
  min-width: 0;
}
body[data-embedded="1"] .content {
  padding: 12px;
}

/* The ERP's explanatory note (Προφίλ, Calendar, συσκευές, Ρυθμίσεις): a blue bar, a round «i» and the text.
   Owner, 13/10/2026: «το επεξηγηματικό θα πρέπει να είναι έτσι, όπως έχουμε παντού». `.profile-note` is the name
   the first screens gave it and keeps working; `.info-note` is the same note anywhere. */
.info-note,
.profile-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--erp-border);
  border-left: 3px solid var(--erp-info);
  border-radius: var(--erp-button-radius);
  background: var(--erp-info-soft);
  color: var(--erp-text);
}

.info-note p,
.profile-note p {
  margin: 0;
  line-height: 1.5;
}

.info-note-icon,
.profile-note-icon {
  flex: 0 0 20px;
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: var(--erp-round-radius);
  background: var(--erp-info);
  color: var(--erp-on-accent);
  font-size: 12px;
  font-weight: 700;
}

/* Settings screens (owner, 13/10/2026, To-do 1.131-1.138): the explanation of a screen is the blue note under
   its head, the buttons of a form stand at its end to the right, and the «Αποθήκευση» row shows only once
   something changed (static/core/dirty_form.js). Until that script has run the row stays visible, so a browser
   without JavaScript keeps its save button. */
.panel-note {
  margin: 0 0 12px;
}

.actions-row-end {
  justify-content: flex-end;
}

/* `hidden` has to beat the row’s own display: flex, or the DOM hides nothing. */
.actions-row[hidden] {
  display: none;
}

form[data-dirty-form]:not(.dirty-form-ready) .actions-row[data-dirty-actions][hidden] {
  display: flex;
}

/* The draggable quick buttons (owner, 13/10/2026: «δεν θέλω να έχουν Fixxed σημείο να μπορούμε να τα παμε όπου
   θέλουμε»): a dock a person drags by its grip, and the ERP's own modal around a register's form. The buttons
   themselves keep the round look the frozen ERP gave the Chat one. */
.floating-dock {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 45;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.floating-dock-grip {
  width: 30px;
  height: 20px;
  padding: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--erp-chip-radius);
  background: var(--color-white);
  font-size: 12px;
  line-height: 1;
  cursor: grab;
  touch-action: none;
}

.floating-dock.is-dragging .floating-dock-grip {
  cursor: grabbing;
}

.floating-dock .chat-floating-btn {
  position: relative;
  right: auto;
  bottom: auto;
  border: 0;
  cursor: pointer;
}

.quick-entry-card {
  width: min(880px, 96vw);
  padding: 12px;
}

.quick-entry-frame {
  display: block;
  width: 100%;
  height: min(70vh, 620px);
  border: 0;
}

/* The tools page (owner, To-do 1.125 and his words of the same evening, 12/10/2026: «δεν έχουμε καθόλου χρώμα,
   χάνεται το μάτι σου ... ίσως εικονίδια»): each kind of tool in a panel of its own with a colour of its own, five
   tiles a row (four up to 1200 px; nothing narrower is laid out: the Core is desktop only), a picture for each
   tool in the colour of its kind, and the whole tile opens the tool. The first two colours are the brand's. */
.tools-group {
  --tool: #147bff;
  border-top: 3px solid var(--tool);
}

.tools-kind-communication { --tool: #009c96; }
.tools-kind-organizing { --tool: #6d4fd6; }
.tools-kind-money { --tool: #c27a0a; }
.tools-kind-finance { --tool: #b8457f; }
.tools-kind-assets { --tool: #2f8f4e; }
.tools-kind-module { --tool: #50627e; }

.tools-group > .panel-head .run-section-title {
  display: flex;
  align-items: center;
  gap: 9px;
}

.tools-group > .panel-head .run-section-title::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 3px;
  background: var(--tool);
}

.tools-group .tools-tiles-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.tools-tile-link {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  column-gap: 11px;
  row-gap: 8px;
  align-items: center;
  align-content: start;
  width: 100%;
  min-height: 92px;
  padding: 12px;
  font: inherit;
  color: inherit;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  transition: border-color 0.12s ease, background-color 0.12s ease, box-shadow 0.12s ease, transform 0.12s ease;
}

.tools-tile-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  color: var(--tool);
  background: color-mix(in srgb, var(--tool) 13%, var(--color-white));
}

.tools-tile-icon svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.tools-tile-link h3 {
  margin: 0;
  font-size: 14px;
  line-height: 1.25;
}

.tools-tile-link p {
  grid-column: 1 / -1;
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}

.tools-tile-link:hover,
.tools-tile-link:focus-visible {
  border-color: var(--tool);
  background: color-mix(in srgb, var(--tool) 7%, var(--color-white));
  box-shadow: 0 4px 14px rgba(6, 34, 63, 0.1);
  transform: translateY(-1px);
  outline: none;
}

.tools-group[hidden],
.tools-tile-link[hidden] {
  display: none;
}

.tools-find {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}

.tools-find input {
  flex: 0 1 420px;
}

@media (max-width: 1200px) {
  .tools-group .tools-tiles-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* Figures an office tool computes and shows as tables (office_tools `Register.tables`: the statements of a year,
   a forecast of cash), and the headings inside a long form of an entry. */
.register-figures {
  width: auto;
  min-width: min(100%, 720px);
}

.register-figures th:not(:first-child),
.register-figures td:not(:first-child) {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.register-figures .register-total-row td {
  font-weight: 700;
  background: var(--erp-surface-muted);
}

.register-figures .register-alert-row td {
  color: var(--erp-danger-text);
}

.register-form-heading {
  grid-column: 1 / -1;
  margin: 10px 0 0;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--erp-border);
  font-size: 13px;
  font-weight: 700;
}

/* Owner, 14/10/2026 (To-do 1.126): the file manager of the investment stages as a section of a register's page
   (office_tools/_register_files.html), and the page of a row with its tabs (office_tools/register_row.html). */
.register-file-manager.is-panel {
  border-top: 0;
  padding-top: 0;
}

.register-file-manager .investment-stage-file-manager-head .run-section-title {
  margin: 0;
}

.register-file-upload {
  display: grid;
  gap: 8px;
}

.register-row-title {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.investment-stage-tab-panel > .panel-head:first-child {
  margin-top: 0;
}

.investment-stage-tab-panel > .kv-grid + form {
  margin-top: 8px;
}

/* Owner, 14/10/2026: the files section closes like every other section (8px above and below), and the menu
   «Ενέργειες» of a register's page holds every action, one under the other. */
.register-file-manager.is-panel .investment-stage-file-manager-head {
  min-height: 0;
}

.register-actions-popover {
  display: grid;
  gap: 6px;
}

.register-actions-popover > form,
.register-actions-popover > a {
  margin: 0;
}

.register-actions-popover > form > .btn,
.register-actions-popover > a.btn {
  width: 100%;
  justify-content: flex-start;
}

.register-actions-form {
  display: grid;
  gap: 6px;
  border-top: 1px solid var(--color-slate-200);
  border-bottom: 1px solid var(--color-slate-200);
  padding-block: 6px;
}

.register-actions-popover > .register-actions-form:first-child {
  border-top: 0;
  padding-top: 0;
}

/* Owner, 14/10/2026 (To-do 1.131): «τα πεδία δεν είναι ευθυγραμισμένα». A field of a form grid is itself a grid:
   when a neighbour in its row is taller (its help text takes two lines), the row grows and the field's own rows
   were stretched to fill it - the label too - so its box sat a few pixels lower than its neighbour's. The parts
   of every field stay packed at the top: the boxes of a row start on one line. */
.form-grid > .field {
  align-content: start;
}

/* To-do 1.134 (owner, 14/10/2026): «Μεταξύ τους τα Sections να έχουν 8 px απόσταση» - the sections of a Settings
   screen made of several parts (Fileserver) stand 8px apart. */
.settings-sections {
  display: grid;
  gap: 8px;
}

.settings-sections > .panel {
  margin: 0;
}

/* To-do 1.136 (owner, 14/10/2026: «δες δομή από live»): the sender profile form of Settings → Basic Marketing, as
   the frozen ERP lays it out (its rules sat in its templates/core/settings.html and never came over): name /
   from name / from email in one row, reply-to with «Default» and «Ενεργό» in the next, each label beside its box. */
.basic-marketing-sender-profile-form {
  display: grid;
  gap: 8px;
  margin-top: 4px;
}

.basic-marketing-sender-profile-row {
  display: grid;
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.basic-marketing-sender-profile-row-primary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.basic-marketing-sender-profile-row-secondary {
  grid-template-columns: minmax(0, 1fr) auto auto;
}

.basic-marketing-sender-profile-form .field-inline {
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 6px;
  min-width: 0;
}

.basic-marketing-sender-profile-form .field-inline > label {
  margin: 0;
  white-space: nowrap;
}

.basic-marketing-sender-profile-form .field-inline > .message {
  grid-column: 2;
}

.basic-marketing-sender-profile-form .permission-toggle {
  min-height: 36px;
  margin: 0;
  white-space: nowrap;
}

.basic-marketing-sender-profile-actions {
  margin: 0;
}

@media (max-width: 1100px) {
  .basic-marketing-sender-profile-row-primary {
    grid-template-columns: 1fr;
  }

  .basic-marketing-sender-profile-row-secondary {
    grid-template-columns: minmax(0, 1fr) auto auto;
  }
}

/* Owner review 1.143: separate agreements from invoices within the same collapsible finance section. */
.company-finance-subsections > #companyInvoicesSection {
  border-top: 1px solid var(--erp-border-strong);
  padding-top: 8px;
}

/* To-do 1.149: four-column preset layouts shared by editor, previews, forms and saved cards. */
.crm-layout-board { display: grid; gap: 8px; }
.crm-layout-row,
.company-create-row.crm-layout-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  align-items: start;
}
.crm-layout-row > *,
.crm-layout-row > .company-workspace-links > div { grid-row: 1; min-width: 0; }
.crm-layout-row > .company-workspace-links { display: contents; }
.crm-layout-row > .crm-layout-col-1,
.crm-layout-row > .company-workspace-links > .crm-layout-col-1 { grid-column-start: 1; }
.crm-layout-row > .crm-layout-col-2,
.crm-layout-row > .company-workspace-links > .crm-layout-col-2 { grid-column-start: 2; }
.crm-layout-row > .crm-layout-col-3,
.crm-layout-row > .company-workspace-links > .crm-layout-col-3 { grid-column-start: 3; }
.crm-layout-row > .crm-layout-col-4,
.crm-layout-row > .company-workspace-links > .crm-layout-col-4 { grid-column-start: 4; }
.crm-layout-row > .crm-layout-span-1,
.crm-layout-row > .company-workspace-links > .crm-layout-span-1 { grid-column-end: span 1; }
.crm-layout-row > .crm-layout-span-2,
.crm-layout-row > .company-workspace-links > .crm-layout-span-2 { grid-column-end: span 2; }
.crm-layout-row > .crm-layout-span-3,
.crm-layout-row > .company-workspace-links > .crm-layout-span-3 { grid-column-end: span 3; }
.crm-layout-row > .crm-layout-span-4,
.crm-layout-row > .company-workspace-links > .crm-layout-span-4 { grid-column-end: span 4; }
.crm-layout-board .crm-field-arrange-card {
  align-self: stretch;
  place-items: stretch;
  gap: 8px;
  margin: 0;
  background: var(--erp-surface-muted);
  text-align: start;
}
.crm-layout-controls { display: grid; gap: 6px; }
.crm-layout-controls > label { margin: 0; }
.crm-layout-controls > .actions-row { justify-content: flex-end; }
.crm-layout-slot {
  display: grid;
  place-items: center;
  min-height: 56px;
  padding: 8px;
  border: 1px dashed var(--erp-border);
  border-radius: 8px;
  color: var(--muted);
}
.crm-layout-slot.drag-over { border-color: var(--erp-primary); background: var(--erp-surface-muted); }

/* To-do 1.160: clear user administration sections without changing account/permission policy. */
.settings-content-wrap .access-admin-page { gap: 8px; }
.settings-content-wrap .access-admin-page > .panel { margin: 0; }
.access-permission-group { border-top: 1px solid var(--erp-border); padding-top: 8px; }
.access-permission-group > summary { cursor: pointer; padding-block: 4px; }
.access-permission-group > .table-wrap { margin-top: 8px; }

/* Saved Company cards already have a three-class grid-column reset; explicit preset placement wins it. */
.company-form-grid.crm-layout-row > .crm-layout-col-1 { grid-column-start: 1; }
.company-form-grid.crm-layout-row > .crm-layout-col-2 { grid-column-start: 2; }
.company-form-grid.crm-layout-row > .crm-layout-col-3 { grid-column-start: 3; }
.company-form-grid.crm-layout-row > .crm-layout-col-4 { grid-column-start: 4; }
.company-form-grid.crm-layout-row > .crm-layout-span-1 { grid-column-end: span 1; }
.company-form-grid.crm-layout-row > .crm-layout-span-2 { grid-column-end: span 2; }
.company-form-grid.crm-layout-row > .crm-layout-span-3 { grid-column-end: span 3; }
.company-form-grid.crm-layout-row > .crm-layout-span-4 { grid-column-end: span 4; }

/* Keep width/move controls compact; wrap naturally within a narrow desktop column. */
.crm-layout-controls { display: flex; flex-wrap: wrap; align-items: center; }
.crm-layout-controls > .enhanced-select { flex: 1 1 80px; min-width: 0; }
.crm-layout-controls > .actions-row { flex: 0 0 auto; margin-left: auto; }

/* The container owns the 8px gap; explanatory notes add no extra bottom margin on these screens. */
.access-admin-page .panel-note,
.crm-preset-preview > .panel-note,
.crm-preset-fields > .panel-note { margin: 0; }
.crm-preset-fields { display: grid; gap: 8px; }
.crm-preset-fields > .panel-head { margin: 0; }

/* To-do 1.126 phase 2 (owner, 15/10/2026: «preset ανά πρότυπο»): Settings → Presets προτύπων - the sections of a
   scheme in boxes named as the tabs of the standard's page. */
.standard-preset-groups {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 8px;
}

.standard-preset-group {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 8px;
  margin: 0;
  padding: 8px 12px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  min-width: 0;
}

.standard-preset-group > legend {
  padding: 0 4px;
  font-weight: 600;
}

/* To-do 1.149-1.151 (owner, 16/10/2026): the preset fields in the Dashboard's grid - one row high, width 1-4. */
.crm-preset-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: minmax(56px, auto);
  gap: 8px;
  min-width: 0;
}
.crm-preset-tile {
  position: relative;
  display: grid;
  align-content: center;
  gap: 2px;
  min-width: 0;
  min-height: 56px;
  margin: 0;
  padding: 8px 24px 8px 12px;
  border: 1px solid var(--erp-border);
  border-radius: 8px;
  background: var(--erp-surface-muted);
  cursor: grab;
}
.crm-preset-tile strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crm-preset-tile small { line-height: 1.2; }
.crm-preset-tile.is-outside-form { border-style: dashed; background: var(--erp-surface); }
.crm-preset-tile.is-dragging { opacity: 0.72; outline: 2px dashed var(--erp-primary-soft-strong); outline-offset: -4px; }
.crm-preset-tile-resize {
  position: absolute;
  top: 50%;
  right: 2px;
  width: 14px;
  height: 34px;
  padding: 0;
  border: 0;
  background: transparent;
  transform: translateY(-50%);
  cursor: ew-resize;
}
.crm-preset-tile-resize::after {
  content: "";
  display: block;
  width: 4px;
  height: 100%;
  margin-left: auto;
  margin-right: 2px;
  border-radius: 999px;
  background: var(--erp-border-strong);
  opacity: 0.72;
}
.crm-preset-tile-resize:hover::after,
.crm-preset-tile-resize:focus-visible::after { background: var(--erp-primary); opacity: 1; }
.crm-preset-grid-slot {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  border: 1px dashed var(--erp-primary-soft-strong);
  border-radius: 8px;
  background: var(--erp-surface-muted);
  color: var(--muted);
  font-size: 20px;
}
.crm-preset-grid-slot.drag-over { border-color: var(--erp-primary); background: var(--erp-primary-soft); color: var(--erp-primary-text); }
.crm-preset-preview { display: grid; gap: 8px; min-width: 0; }
.crm-preset-preview > summary { cursor: pointer; font-weight: 600; }
.crm-preset-preview-rows { display: grid; gap: 8px; min-width: 0; }
.crm-preset-preview-control { height: 34px; border: 1px solid var(--erp-border); border-radius: 8px; background: var(--erp-surface); }
.crm-presets-page [id^="crmPreset_"],
.crm-presets-page [id^="crmField_"],
.crm-presets-page [id^="crmPresetLayout_"],
.crm-presets-page [id^="crmPresetFields_"] { scroll-margin-top: 96px; }
/* To-do 1.165 / 1.168 (16/10/2026): the tables of the sections of one page share their column widths, so that the
   checkboxes, the statuses and the «Επεξεργασία» buttons stand one under the other from section to section. */
.notification-policy-table,
.master-data-lists-table { table-layout: fixed; width: 100%; }
.notification-policy-table th.col-active,
.notification-policy-table td.col-active { width: 120px; text-align: center; white-space: nowrap; }
.master-data-lists-table th:nth-child(1) { width: 24%; }
.master-data-lists-table th:nth-child(3) { width: 26%; }
.master-data-lists-table th.col-active,
.master-data-lists-table td.col-active { width: 120px; white-space: nowrap; }
.master-data-lists-table th.col-actions,
.master-data-lists-table td.col-actions { width: 140px; text-align: right; white-space: nowrap; }
.master-data-lists-table td { overflow-wrap: anywhere; }
/* To-do 1.167 review (16/10/2026): air between «Δημιουργία Ρόλου» / «Ακύρωση» and the table of roles. */
.custom-role-form { margin-bottom: 16px; }
/* To-do 1.174: Settings > Backup. */
.backup-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.backup-facts > div { display: grid; gap: 2px; padding: 8px 10px; border: 1px solid var(--erp-border, #e2e8f0); border-radius: 10px; min-width: 0; }
.backup-facts > div > strong { overflow-wrap: anywhere; }
.backup-facts > .backup-facts-wide { grid-column: 1 / -1; }
.backup-settings [data-backup-when][hidden] { display: none; }
.backup-settings .backup-folder-field { grid-column: span 2; }
.backup-settings .backup-field-note { display: block; }
/* Owner, 17/10/2026: a field that sends a notification carries a small red bell by its name (core.notifying). */
.notify-bell { display: inline-flex; align-items: center; margin-left: 4px; color: #dc2626; vertical-align: -2px; cursor: help; }
.notify-bell svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linejoin: round; stroke-linecap: round; }
