/* Reset and Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    color: #333;
    background: #F5F7FA;
}

.hidden {
    display: none !important;
}

/* App Container */
.app-container {
    display: flex;
    flex-direction: column;
    height: 100vh;
    overflow: visible;
}

/* Header */
.app-header {
    background: #fff;
    border-bottom: 1px solid #E1E4E8;
    padding: 12px 24px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.header-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.logo {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #1B5EBE;
}

.locale-switcher {
    display: inline-flex;
    border: 1px solid #CBD5E1;
    border-radius: 6px;
    overflow: hidden;
    background: #F8FAFC;
}

.locale-switcher .locale-btn {
    border: none;
    background: transparent;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 600;
    color: #64748B;
    cursor: pointer;
    letter-spacing: 0.04em;
    min-width: 32px;
}

.locale-switcher .locale-btn + .locale-btn {
    border-left: 1px solid #CBD5E1;
}

.locale-switcher .locale-btn:hover {
    background: #E2E8F0;
    color: #1E293B;
}

.locale-switcher .locale-btn.active {
    background: #1B5EBE;
    color: #fff;
}

.logo svg {
    width: 28px;
    height: 28px;
}

.logo h1 {
    font-size: 18px;
    font-weight: 600;
    margin: 0;
}

/* Main Layout */
.main-layout {
    display: flex;
    flex: 1;
    overflow: visible;
    min-height: 0;
}

/* Sidebar */
.sidebar {
    width: 280px;
    min-width: 280px;
    background: #fff;
    border-right: 1px solid #E1E4E8;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: width 0.25s ease, min-width 0.25s ease;
}

.sidebar.collapsed {
    width: 44px;
    min-width: 44px;
}

.sidebar.collapsed .sidebar-header {
    justify-content: center;
    padding: 16px 10px;
}

.sidebar.collapsed .sidebar-header h2 {
    display: none;
}

.sidebar.collapsed .sidebar-content {
    display: none;
}

.sidebar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid #E1E4E8;
    white-space: nowrap;
}

.sidebar-header h2 {
    font-size: 14px;
    font-weight: 600;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
    transition: opacity 0.2s ease;
}

.sidebar-toggle {
    background: none;
    border: none;
    color: #666;
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.15s ease, color 0.15s ease;
}

.sidebar-toggle:hover {
    background: #E1E4E8;
    color: #333;
}

.sidebar-toggle svg {
    transition: transform 0.25s ease;
}

.sidebar.collapsed .sidebar-toggle svg {
    transform: rotate(180deg);
}

.sidebar-content {
    flex: 1;
    overflow-y: auto;
    padding: 12px;
    transition: opacity 0.2s ease;
}

/* Project Tree */
.project-item {
    margin-bottom: 8px;
}

.project-header {
    display: flex;
    align-items: center;
    padding: 8px 12px;
    cursor: pointer;
    border-radius: 6px;
    transition: background 0.2s;
    font-weight: 500;
}

.project-header:hover {
    background: #F5F7FA;
}

.project-header.active {
    background: #E8F0FE;
    color: #1B5EBE;
}

.expand-icon {
    margin-right: 8px;
    font-size: 12px;
    transition: transform 0.2s;
    display: inline-block;
}

.expand-icon.expanded {
    transform: rotate(90deg);
}

.asset-list {
    margin-left: 24px;
    margin-top: 4px;
    display: none;
}

.asset-list.visible {
    display: block;
}

.asset-item {
    padding: 6px 12px;
    cursor: pointer;
    border-radius: 6px;
    transition: background 0.2s;
    margin-bottom: 2px;
}

.asset-item:hover {
    background: #F5F7FA;
}

.asset-item.active {
    background: #1B5EBE;
    color: #fff;
    font-weight: 500;
}

/* Content Area */
.content-area {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-width: 0;
    min-height: 0;
}

/* Tab Bar */
.tab-bar {
    display: flex;
    background: #fff;
    border-bottom: 2px solid #E1E4E8;
    padding: 0 24px;
    overflow-x: auto;
}

.tab-button {
    padding: 12px 20px;
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: #666;
    transition: all 0.2s;
    white-space: nowrap;
    margin-bottom: -2px;
}

.tab-button:hover {
    color: #1B5EBE;
    background: #F5F7FA;
}

.tab-button.active {
    color: #1B5EBE;
    border-bottom-color: #1B5EBE;
}

/* Domain Navigation */
.domain-nav {
    display: flex;
    gap: 0;
    background: #fff;
    border-bottom: 2px solid #E1E4E8;
    padding: 0 24px;
    overflow: visible;
    position: relative;
    z-index: 200;
}

.domain-nav-group {
    position: relative;
}

.domain-nav-item {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 14px 20px;
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: #666;
    transition: all 0.2s;
    white-space: nowrap;
    margin-bottom: -2px;
}

.domain-nav-item:hover {
    color: #1B5EBE;
    background: #F5F7FA;
}

.domain-nav-item.active {
    color: #1B5EBE;
    border-bottom-color: #1B5EBE;
    font-weight: 600;
}

.domain-nav-label {
    font-size: 14px;
}

.domain-nav-arrow {
    font-size: 10px;
    transition: transform 0.2s;
}

.domain-nav-group.expanded .domain-nav-arrow {
    transform: rotate(180deg);
}

.domain-nav-group.expanded .domain-nav-item {
    background: #F5F7FA;
}

.domain-nav-subtabs {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    border: 1px solid #E1E4E8;
    border-top: none;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    min-width: 200px;
    z-index: 100;
}

.domain-nav-group.expanded .domain-nav-subtabs {
    display: block;
}

.domain-subtab {
    display: block;
    width: 100%;
    padding: 10px 16px;
    background: transparent;
    border: none;
    text-align: left;
    font-size: 13px;
    color: #586069;
    cursor: pointer;
    transition: background 0.15s;
    border-left: 3px solid transparent;
}

.domain-subtab:hover {
    background: #F6F8FA;
    color: #24292E;
}

.domain-subtab.active {
    background: #E8F0FE;
    color: #1B5EBE;
    font-weight: 600;
    border-left-color: #1B5EBE;
}

/* Tab Content */
.tab-content {
    flex: 1;
    overflow-y: auto;
    padding: 24px;
}

/* Welcome Message */
.welcome-message {
    text-align: center;
    padding: 60px 20px;
    color: #666;
}

.welcome-message h2 {
    font-size: 24px;
    margin-bottom: 12px;
    color: #333;
}

/* Cards */
.card {
    background: #fff;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.2s;
}

.card:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.card-header {
    display: flex;
    justify-content: space-between;
    align-items: start;
    margin-bottom: 16px;
}

.card-title {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

.card-subtitle {
    font-size: 13px;
    color: #666;
}

.card-body {
    margin-bottom: 12px;
}

.card-section {
    margin-bottom: 16px;
}

.card-section:last-child {
    margin-bottom: 0;
}

.section-title {
    font-size: 13px;
    font-weight: 600;
    color: #666;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Stats Grid */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.stat-card {
    background: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.stat-value {
    font-size: 32px;
    font-weight: 700;
    color: #1B5EBE;
    margin-bottom: 4px;
}

.stat-label {
    font-size: 13px;
    color: #666;
    font-weight: 500;
}

/* Badges */
.badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.badge-success {
    background: #D4EDDA;
    color: #155724;
}

.badge-danger {
    background: #F8D7DA;
    color: #721C24;
}

.badge-warning {
    background: #FFF3CD;
    color: #856404;
}

.badge-info {
    background: #D1ECF1;
    color: #0C5460;
}

.badge-secondary {
    background: #E2E3E5;
    color: #383D41;
}

/* Priority Badges */
.priority-high {
    background: #F8D7DA;
    color: #721C24;
}

.priority-medium {
    background: #FFF3CD;
    color: #856404;
}

.priority-low {
    background: #D1ECF1;
    color: #0C5460;
}

/* Citation Button */
.citation-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: #E8F0FE;
    color: #1B5EBE;
    border: 1px solid #1B5EBE;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    margin-left: 8px;
}

.citation-btn:hover {
    background: #1B5EBE;
    color: #fff;
}

.citation-btn-compact {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    border: 1px solid #D0D7DE;
    border-radius: 4px;
    background: #F6F8FA;
    color: #57606A;
    font-size: 12px;
    cursor: pointer;
    vertical-align: middle;
    margin-left: 4px;
}

.citation-btn-compact:hover {
    background: #1B5EBE;
    color: #fff;
    border-color: #1B5EBE;
}

/* Document Link Button */
.doc-link-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    background: #F6F8FA;
    color: #57606A;
    border: 1px solid #D0D7DE;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    margin-left: 8px;
    vertical-align: middle;
}

.doc-link-btn:hover {
    background: #E8F0FE;
    color: #1B5EBE;
    border-color: #1B5EBE;
}

/* Table */
.data-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.data-table thead {
    background: #F5F7FA;
}

.data-table th {
    padding: 12px 16px;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.data-table td {
    padding: 12px 16px;
    border-top: 1px solid #E1E4E8;
    font-size: 13px;
}

.data-table tr:hover {
    background: #F5F7FA;
}

.data-table tr.clickable-row {
    cursor: pointer;
}

.data-table tr.clickable-row:hover {
    background: #EBF0F5;
}

.data-table tr.clickable-row td:first-child {
    color: #0366D6;
}

/* Field Row */
.field-row {
    display: flex;
    padding: 6px 0;
    border-bottom: 1px solid #F5F7FA;
}

.field-row:last-child {
    border-bottom: none;
}

.field-label {
    flex: 0 0 180px;
    font-weight: 600;
    color: #666;
    font-size: 13px;
}

.field-value {
    flex: 1;
    color: #333;
    font-size: 13px;
}

/* Document Viewer */
.document-viewer {
    width: 0;
    background: #fff;
    border-left: 1px solid #E1E4E8;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: width 0.3s ease;
}

.document-viewer.open {
    width: 500px;
    flex-shrink: 0;
}

.document-viewer.collapsed {
    width: 44px;
    min-width: 44px;
    flex-shrink: 0;
}

.document-viewer.collapsed .document-viewer-header {
    justify-content: center;
    padding: 16px 10px;
}

.document-viewer.collapsed .document-viewer-title,
.document-viewer.collapsed .document-viewer-content,
.document-viewer.collapsed #docViewerValidationBar {
    display: none;
}

.document-viewer .sidebar-toggle svg {
    transition: transform 0.25s ease;
}

.document-viewer.collapsed .sidebar-toggle svg {
    transform: rotate(180deg);
}

.document-viewer-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 16px 20px;
    border-bottom: 1px solid #E1E4E8;
    background: #F5F7FA;
}

.document-viewer-title {
    flex: 1;
    min-width: 0;
    margin-left: 12px;
}

.document-viewer-header h3 {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin: 0;
    word-break: break-word;
}

.document-viewer-subtitle {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
    font-size: 12px;
    color: #586069;
}

.document-viewer-subtitle:empty {
    display: none;
}

.document-viewer-subtitle .doc-tag {
    display: inline-flex;
    align-items: center;
    padding: 1px 8px;
    border-radius: 10px;
    background: #E1E4E8;
    font-size: 11px;
    font-weight: 500;
    white-space: nowrap;
}

.document-viewer-subtitle .doc-tag.type {
    background: #DCEEFB;
    color: #0366D6;
}

.document-viewer-subtitle .doc-tag.entity {
    background: #E6F6E6;
    color: #22863A;
}

.close-button {
    background: none;
    border: none;
    font-size: 24px;
    color: #666;
    cursor: pointer;
    padding: 0;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: all 0.2s;
}

.close-button:hover {
    background: #E1E4E8;
    color: #333;
}

.document-viewer-content {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    font-family: 'Courier New', monospace;
    font-size: 12px;
    line-height: 1.6;
    white-space: pre-wrap;
    word-wrap: break-word;
}

.document-meta {
    background: #FFF3CD;
    padding: 12px;
    border-radius: 6px;
    margin-bottom: 16px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.document-meta-item {
    font-size: 12px;
    margin-bottom: 4px;
}

.document-meta-item:last-child {
    margin-bottom: 0;
}

.document-meta-label {
    font-weight: 600;
    color: #666;
}

.document-text {
    color: #333;
}

mark {
    background: #FFEB3B;
    padding: 2px 0;
    border-radius: 2px;
}

/* Loading State */
.loading {
    text-align: center;
    padding: 20px;
    color: #666;
}

/* Empty State */
.empty-state {
    text-align: center;
    padding: 40px 20px;
    color: #666;
}

.empty-state-icon {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: 0.3;
}

/* Utility Classes */
.text-muted {
    color: #666;
}

.text-small {
    font-size: 12px;
}

.mb-2 {
    margin-bottom: 8px;
}

.mb-3 {
    margin-bottom: 12px;
}

.mb-4 {
    margin-bottom: 16px;
}

/* Scrollbar Styling */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #F5F7FA;
}

::-webkit-scrollbar-thumb {
    background: #CCC;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #999;
}

/* Quote Box */
.quote-box {
    background: #F5F7FA;
    border-left: 3px solid #1B5EBE;
    padding: 12px;
    margin: 8px 0;
    font-style: italic;
    color: #555;
    border-radius: 4px;
}

/* List Styles */
.usage-list {
    list-style: none;
    padding: 0;
}

.usage-item {
    padding: 12px;
    background: #F5F7FA;
    border-radius: 6px;
    margin-bottom: 8px;
}

.usage-item:last-child {
    margin-bottom: 0;
}

.usage-item-location {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

.usage-item-category {
    display: flex;
    align-items: center;
    gap: 8px;
}

.flag-list {
    list-style: none;
    padding: 0;
}

.flag-item {
    padding: 8px 12px;
    background: #FFF3CD;
    border-left: 3px solid #FFC107;
    border-radius: 4px;
    margin-bottom: 6px;
    font-size: 13px;
}

.flag-item:last-child {
    margin-bottom: 0;
}

/* Building Diagram Styles */
.building-diagram {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    margin-bottom: 24px;
}

.floor-bar {
    display: flex;
    align-items: stretch;
    border-bottom: 1px solid #E1E4E8;
    min-height: 80px;
    transition: background 0.2s;
}

.floor-bar:last-child {
    border-bottom: none;
}

.floor-bar:hover {
    background: #F5F7FA;
}

.floor-bar.floor-compliant {
    border-left: 4px solid #28A745;
}

.floor-bar.floor-non-compliant {
    border-left: 4px solid #DC3545;
}

.floor-bar.floor-warning {
    border-left: 4px solid #FFC107;
}

.floor-label {
    flex: 0 0 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 16px;
    color: #333;
    background: #F5F7FA;
    border-right: 2px solid #E1E4E8;
}

.floor-content {
    flex: 1;
    display: flex;
    padding: 12px;
    gap: 16px;
}

.floor-section {
    flex: 1;
}

.floor-section-title {
    font-size: 11px;
    font-weight: 600;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}

.floor-usages {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.usage-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 16px;
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s, box-shadow 0.2s;
}

.usage-chip:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

.usage-chip-label {
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.usage-chip-meta {
    font-size: 11px;
    opacity: 0.9;
}

.usage-chip .citation-btn {
    padding: 2px 6px;
    font-size: 10px;
    background: rgba(255, 255, 255, 0.3);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.5);
    margin-left: 0;
}

.usage-chip .citation-btn:hover {
    background: rgba(255, 255, 255, 0.5);
}

.floor-compliance {
    flex: 0 0 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}

.compliance-icon {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-weight: 700;
}

.compliance-icon.compliant {
    background: #D4EDDA;
    color: #155724;
}

.compliance-icon.non-compliant {
    background: #F8D7DA;
    color: #721C24;
}

.compliance-icon.warning {
    background: #FFF3CD;
    color: #856404;
}

/* Compliance Tab Filters */
.compliance-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    flex-wrap: wrap;
    gap: 16px;
}

.compliance-filters {
    display: flex;
    gap: 16px;
    align-items: center;
    flex-wrap: wrap;
}

.filter-group {
    display: flex;
    align-items: center;
    gap: 8px;
}

.filter-group label {
    font-size: 13px;
    font-weight: 600;
    color: #666;
}

.filter-select {
    padding: 6px 12px;
    border: 1px solid #E1E4E8;
    border-radius: 4px;
    font-size: 13px;
    background: #fff;
    cursor: pointer;
    transition: border-color 0.2s;
}

.filter-select:hover {
    border-color: #1B5EBE;
}

.filter-select:focus {
    outline: none;
    border-color: #1B5EBE;
    box-shadow: 0 0 0 3px rgba(27, 94, 190, 0.1);
}

.filter-results {
    font-size: 13px;
    color: #666;
    margin-left: 8px;
    font-weight: 500;
}

/* Clickable compliance table rows */
.clickable-row {
    cursor: pointer;
    transition: background-color 0.2s;
}

.clickable-row:hover {
    background-color: #F5F7FA !important;
}

/* Highlight animation for navigated-to card */
.highlight-card {
    animation: highlight-pulse 2s ease-in-out;
}

@keyframes highlight-pulse {
    0%, 100% {
        background: #fff;
    }
    50% {
        background: #E8F0FE;
    }
}

/* ===========================================================================
   Entity Resolution — Merge Proposals Tab
   =========================================================================== */

.proposal-stats-bar {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.proposal-stat {
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid #E0E0E0;
    background: #F5F7FA;
    color: #555;
    transition: background 0.15s, border-color 0.15s;
    user-select: none;
}

.proposal-stat:hover {
    background: #E8F0FE;
    border-color: #1B5EBE;
}

.proposal-stat.active-filter {
    background: #1B5EBE;
    color: #fff;
    border-color: #1B5EBE;
}

.proposal-stat-pending { border-left: 3px solid #FFC107; }
.proposal-stat-auto    { border-left: 3px solid #17A2B8; }
.proposal-stat-merged  { border-left: 3px solid #28A745; }
.proposal-stat-rejected { border-left: 3px solid #6C757D; }

.proposal-card {
    background: #fff;
    border: 1px solid #E0E6ED;
    border-radius: 8px;
    margin-bottom: 12px;
    overflow: hidden;
    transition: box-shadow 0.15s;
}

.proposal-card:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.proposal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: #F8F9FA;
    border-bottom: 1px solid #E0E6ED;
    gap: 12px;
    flex-wrap: wrap;
}

.proposal-id-group {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.proposal-id {
    font-family: monospace;
    font-size: 13px;
    font-weight: 600;
    color: #333;
}

.confidence-bar-group {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 140px;
}

.confidence-bar-track {
    flex: 1;
    height: 8px;
    background: #E0E6ED;
    border-radius: 4px;
    overflow: hidden;
}

.confidence-bar-fill {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s;
}

.confidence-bar-fill.confidence-high { background: #28A745; }
.confidence-bar-fill.confidence-mid  { background: #FFC107; }
.confidence-bar-fill.confidence-low  { background: #DC3545; }

.confidence-pct {
    font-size: 12px;
    font-weight: 600;
    color: #555;
    min-width: 32px;
    text-align: right;
}

.proposal-body {
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.merge-ids {
    font-size: 13px;
    color: #333;
}

.merge-source-id {
    font-family: monospace;
    background: #FFF3CD;
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 600;
}

.merge-canonical-id {
    font-family: monospace;
    background: #D4EDDA;
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 600;
}

.merge-arrow {
    color: #888;
    margin: 0 4px;
    font-weight: bold;
}

.proposal-preview {
    font-size: 13px;
    color: #555;
    background: #F8F9FA;
    padding: 6px 10px;
    border-radius: 4px;
    border-left: 3px solid #1B5EBE;
}

.match-reason {
    font-size: 12px;
    color: #666;
    font-style: italic;
}

.proposal-actions {
    display: flex;
    gap: 8px;
    margin-top: 4px;
}

.btn-approve {
    padding: 6px 16px;
    background: #28A745;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    transition: background 0.15s;
}

.btn-approve:hover { background: #218838; }
.btn-approve:disabled { background: #94D3A2; cursor: not-allowed; }

.btn-reject {
    padding: 6px 16px;
    background: #fff;
    color: #DC3545;
    border: 1px solid #DC3545;
    border-radius: 5px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    transition: background 0.15s, color 0.15s;
}

.btn-reject:hover { background: #DC3545; color: #fff; }
.btn-reject:disabled { opacity: 0.5; cursor: not-allowed; }

/* ===========================================================================
   Overview — Resolution Call-to-Action
   =========================================================================== */

.resolution-cta-btn {
    display: inline-block;
    padding: 8px 18px;
    background: #FFC107;
    color: #333;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
}

.resolution-cta-btn:hover {
    background: #E0A800;
}

/* ===========================================================================
   Lease Contracts — Hierarchical Contract Families
   =========================================================================== */

.contract-family {
    margin-bottom: 24px;
}

.contract-family-header h3 {
    font-size: 18px;
    font-weight: 600;
    color: #24292F;
    margin-bottom: 8px;
}

.contract-docs-section {
    margin-top: 12px;
}

.lease-parent-card {
    margin-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.badge-group {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-wrap: wrap;
}

.flag-callout {
    background: #FFF3CD;
    border-left: 3px solid #FFC107;
    padding: 6px 10px;
    border-radius: 0 4px 4px 0;
    font-size: 13px;
    color: #856404;
    margin-bottom: 8px;
}

.flag-callout-small {
    font-size: 12px;
    padding: 4px 8px;
}

.field-changed .field-value {
    color: #856404;
}

.change-marker {
    display: inline-block;
    margin-left: 6px;
    font-size: 11px;
    background: #FFC107;
    color: #333;
    padding: 1px 5px;
    border-radius: 3px;
    font-weight: 600;
    vertical-align: middle;
}

/* Current state section */
.current-state-section {
    margin: 0 16px 0 16px;
    padding: 10px 12px;
    background: #F0F7FF;
    border: 1px solid #BDD7F5;
    border-top: none;
    border-radius: 0 0 6px 6px;
}

.current-state-section .section-title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #1B5EBE;
    margin-bottom: 8px;
}

/* Amendment chain */
.amendment-chain {
    margin-left: 32px;
    border-left: 3px solid #1B5EBE;
    padding-left: 0;
    margin-top: 4px;
}

.amendment-card {
    background: #F8F9FA;
    border: 1px solid #D0DCF0;
    border-left: none;
    border-radius: 0 6px 6px 0;
    margin-bottom: 4px;
    overflow: hidden;
}

.amendment-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    background: #EEF3FB;
    border-bottom: 1px solid #D0DCF0;
    flex-wrap: wrap;
}

.amendment-number {
    font-size: 12px;
    font-weight: 700;
    color: #1B5EBE;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.amendment-meta {
    font-family: monospace;
    font-size: 12px;
    color: #666;
}

.amendment-body {
    padding: 10px 14px;
}

.amendment-body .quote-box-small {
    font-size: 12px;
    padding: 8px 10px;
    margin-top: 8px;
    max-height: 80px;
    overflow-y: auto;
}

.amendment-source {
    margin-top: 8px;
    text-align: right;
}

/* Field history timeline */
.field-history-section {
    margin: 4px 16px 0 16px;
    padding-bottom: 4px;
}

.history-toggle-btn {
    background: none;
    border: none;
    color: #1B5EBE;
    font-size: 12px;
    cursor: pointer;
    padding: 4px 0;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.history-toggle-btn:hover {
    color: #0D3E8A;
}

.history-toggle-small {
    font-size: 11px;
    display: block;
    margin-top: 4px;
}

.field-history-timeline {
    margin-top: 6px;
    padding: 8px 10px;
    background: #F8F9FA;
    border: 1px solid #E0E6ED;
    border-radius: 4px;
    font-size: 12px;
}

.field-history-timeline.hidden {
    display: none;
}

.timeline-row {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
    flex-wrap: wrap;
}

.timeline-field {
    font-weight: 600;
    color: #333;
    min-width: 70px;
}

.timeline-step {
    padding: 2px 6px;
    border-radius: 3px;
    background: #E8F0FE;
    color: #333;
}

.timeline-superseded {
    text-decoration: line-through;
    background: #F5F5F5;
    color: #999;
}

.timeline-current {
    background: #D4EDDA;
    color: #155724;
    font-weight: 600;
}

.timeline-arrow {
    color: #888;
    font-size: 11px;
}

.timeline-date {
    font-size: 10px;
    color: #888;
}

/* ===========================================================================
   Physical Structure — Permit History Timeline
   =========================================================================== */

.permit-history-timeline {
    margin-top: 6px;
    padding: 8px 10px;
    background: #F8F9FA;
    border: 1px solid #E0E6ED;
    border-radius: 4px;
    font-size: 11px;
}

.permit-history-timeline.hidden {
    display: none;
}

.permit-history-entry {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 3px 0;
    border-bottom: 1px solid #F0F0F0;
    flex-wrap: wrap;
}

.permit-history-entry:last-child {
    border-bottom: none;
}

.permit-superseded {
    opacity: 0.6;
    text-decoration: line-through;
}

.permit-current {
    font-weight: 600;
}

.permit-history-id {
    font-family: monospace;
    background: #E8F0FE;
    padding: 1px 5px;
    border-radius: 3px;
    font-size: 11px;
    min-width: 50px;
}

.permit-history-date {
    color: #888;
    font-size: 10px;
    min-width: 70px;
}

.permit-history-usage {
    flex: 1;
    color: #444;
}

.permit-history-arrow {
    color: #888;
    font-size: 10px;
}

.floor-flag-icon {
    display: inline-block;
    margin-left: 4px;
    font-size: 11px;
    color: #856404;
    cursor: help;
}

.floor-flag-error {
    color: #DC3545;
}

/* ===========================================================================
   Chat Panel (Phase 5)
   =========================================================================== */

/* Floating toggle button */
.chat-toggle-btn {
    position: fixed;
    bottom: 24px;
    right: 24px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: #1B5EBE;
    color: #fff;
    border: none;
    border-radius: 24px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(27, 94, 190, 0.4);
    transition: background 0.2s, box-shadow 0.2s, transform 0.15s;
    z-index: 200;
}

.chat-toggle-btn:hover {
    background: #1549A0;
    box-shadow: 0 6px 16px rgba(27, 94, 190, 0.5);
    transform: translateY(-1px);
}

.chat-toggle-btn.active {
    background: #0D3B8C;
}

/* Chat panel — slide in from the right, same pattern as .document-viewer */
.chat-panel {
    width: 0;
    background: #fff;
    border-left: 1px solid #E1E4E8;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: width 0.3s ease;
    flex-shrink: 0;
}

.chat-panel.open {
    width: 400px;
}

.chat-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    border-bottom: 1px solid #E1E4E8;
    background: #F5F7FA;
    flex-shrink: 0;
}

.chat-panel-title {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #1B5EBE;
}

.chat-panel-title h3 {
    font-size: 14px;
    font-weight: 600;
    margin: 0;
    color: #333;
}

/* Message list */
.chat-messages {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.chat-welcome {
    color: #586069;
    font-size: 13px;
    line-height: 1.6;
}

.chat-examples {
    margin-top: 10px;
    padding: 10px 12px;
    background: #F5F7FA;
    border-radius: 6px;
    font-size: 12px;
    color: #666;
    line-height: 1.8;
}

/* Individual messages */
.chat-msg {
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-width: 100%;
}

.chat-msg-user {
    align-items: flex-end;
}

.chat-msg-assistant {
    align-items: flex-start;
}

.chat-msg-system {
    align-items: center;
}

.chat-bubble {
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 13px;
    line-height: 1.5;
    max-width: 90%;
    word-break: break-word;
}

.chat-msg-user .chat-bubble {
    background: #1B5EBE;
    color: #fff;
    border-bottom-right-radius: 4px;
}

.chat-msg-assistant .chat-bubble {
    background: #F0F4FF;
    color: #333;
    border-bottom-left-radius: 4px;
    border: 1px solid #D8E4FF;
}

.chat-msg-system .chat-bubble {
    background: #F0FFF4;
    color: #22863A;
    border: 1px solid #C3E6CB;
    font-size: 12px;
    border-radius: 8px;
    text-align: center;
}

.chat-msg-error .chat-bubble {
    background: #FFF5F5;
    color: #C0392B;
    border: 1px solid #F5C6CB;
    border-radius: 8px;
    font-size: 12px;
}

.chat-msg-timestamp {
    font-size: 10px;
    color: #999;
    padding: 0 4px;
}

/* Clarification question */
.chat-clarification {
    margin-top: 8px;
    padding: 8px 10px;
    background: #FFF8E1;
    border: 1px solid #FFE082;
    border-radius: 6px;
    font-size: 12px;
    color: #856404;
}

/* Command preview cards */
.chat-commands {
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.chat-command-card {
    background: #fff;
    border: 1px solid #D0D7DE;
    border-radius: 8px;
    overflow: hidden;
}

.chat-command-card-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: #F6F8FA;
    border-bottom: 1px solid #D0D7DE;
}

.chat-command-type-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
    background: #DCEEFB;
    color: #0366D6;
    white-space: nowrap;
}

.chat-command-type-badge.type-map_entity      { background: #E6F6E6; color: #22863A; }
.chat-command-type-badge.type-update_field    { background: #FFF3CD; color: #856404; }
.chat-command-type-badge.type-link_contract_chain { background: #E8F0FE; color: #1B5EBE; }
.chat-command-type-badge.type-resolve_flag    { background: #F0FFF4; color: #22863A; }
.chat-command-type-badge.type-create_canonical { background: #EDE7F6; color: #6A1B9A; }
.chat-command-type-badge.type-approve_mapping { background: #E6F6E6; color: #22863A; }
.chat-command-type-badge.type-reject_mapping  { background: #FFEEF0; color: #C0392B; }
.chat-command-type-badge.type-override_mapping { background: #FFF3CD; color: #856404; }

.chat-command-preview {
    padding: 8px 12px;
    font-size: 12px;
    color: #444;
    font-family: 'Courier New', monospace;
}

.chat-command-reasoning {
    padding: 0 12px 8px;
    font-size: 11px;
    color: #666;
    font-style: italic;
}

.chat-command-actions {
    display: flex;
    gap: 8px;
    padding: 8px 12px;
    border-top: 1px solid #F0F0F0;
}

.chat-cmd-execute-btn {
    flex: 1;
    padding: 6px 12px;
    background: #1B5EBE;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
}

.chat-cmd-execute-btn:hover {
    background: #1549A0;
}

.chat-cmd-execute-btn:disabled {
    background: #A0AEC0;
    cursor: not-allowed;
}

.chat-cmd-cancel-btn {
    padding: 6px 12px;
    background: #fff;
    color: #666;
    border: 1px solid #D0D7DE;
    border-radius: 6px;
    font-size: 12px;
    cursor: pointer;
    transition: background 0.2s;
}

.chat-cmd-cancel-btn:hover {
    background: #F5F7FA;
}

.chat-cmd-executed-label {
    font-size: 11px;
    color: #22863A;
    font-weight: 600;
    padding: 6px 0;
}

.chat-cmd-failed-label {
    font-size: 11px;
    color: #C0392B;
    font-weight: 600;
    padding: 6px 0;
}

/* Typing indicator */
.chat-typing {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 10px 14px;
    background: #F0F4FF;
    border: 1px solid #D8E4FF;
    border-radius: 12px;
    border-bottom-left-radius: 4px;
    width: fit-content;
}

.chat-typing-dot {
    width: 6px;
    height: 6px;
    background: #1B5EBE;
    border-radius: 50%;
    animation: chatTypingBounce 1.2s infinite;
}

.chat-typing-dot:nth-child(2) { animation-delay: 0.2s; }
.chat-typing-dot:nth-child(3) { animation-delay: 0.4s; }

@keyframes chatTypingBounce {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.4; }
    30% { transform: translateY(-5px); opacity: 1; }
}

/* Input area */
.chat-input-area {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    padding: 12px 16px;
    border-top: 1px solid #E1E4E8;
    background: #F5F7FA;
    flex-shrink: 0;
}

.chat-input {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid #D0D7DE;
    border-radius: 8px;
    font-size: 13px;
    font-family: inherit;
    resize: none;
    line-height: 1.5;
    background: #fff;
    transition: border-color 0.2s;
    max-height: 120px;
    overflow-y: auto;
}

.chat-input:focus {
    outline: none;
    border-color: #1B5EBE;
    box-shadow: 0 0 0 3px rgba(27, 94, 190, 0.1);
}

.chat-send-btn {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #1B5EBE;
    color: #fff;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.2s;
}

.chat-send-btn:hover {
    background: #1549A0;
}

.chat-send-btn:disabled {
    background: #A0AEC0;
    cursor: not-allowed;
}

/* =============================================================================
   Two-Sided Ledger — Physical Structure Matrix UI
   ============================================================================= */

.ledger-container {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    margin-bottom: 28px;
    overflow: hidden;
}

.ledger-title-bar {
    display: flex;
    align-items: baseline;
    gap: 12px;
    padding: 12px 16px;
    background: #F0F4FF;
    border-bottom: 2px solid #1B5EBE;
}

.ledger-title-name {
    font-size: 15px;
    font-weight: 700;
    color: #1B3A6B;
}

.ledger-title-address {
    font-size: 12px;
    color: #5A6880;
}

.ledger-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.ledger-header-row th {
    padding: 8px 12px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: #555;
    background: #F5F7FA;
    border-bottom: 1px solid #DDE1E9;
    text-align: left;
}

.ledger-th-location { width: 22%; }
.ledger-th-permits  { width: 44%; border-left: 1px solid #DDE1E9; }
.ledger-th-units    { width: 34%; border-left: 1px solid #DDE1E9; }

/* --- Row types --- */

.ledger-row {
    border-bottom: 1px solid #E8ECF0;
}

.ledger-row:last-child {
    border-bottom: none;
}

.ledger-property-row {
    background: #FAFBFF;
}

.ledger-section-row {
    background: #fff;
}

.ledger-floor-row {
    background: #fff;
    transition: background 0.15s;
}

.ledger-floor-row:hover {
    background: #F5F7FA;
}

/* Left-border compliance indicators on floor rows */
.ledger-floor-compliant    { border-left: 4px solid #28A745; }
.ledger-floor-noncompliant { border-left: 4px solid #DC3545; }
.ledger-floor-warning      { border-left: 4px solid #FFC107; }

/* --- Cells --- */

.ledger-location-cell {
    vertical-align: middle;
    padding: 10px 12px;
    font-size: 13px;
    color: #333;
    white-space: nowrap;
}

.ledger-permits-cell {
    vertical-align: top;
    padding: 8px 12px;
    border-left: 1px solid #E8ECF0;
}

.ledger-units-cell {
    vertical-align: top;
    padding: 8px 12px;
    border-left: 1px solid #E8ECF0;
}

/* --- Location column content --- */

.ledger-property-location .ledger-loc-title {
    font-weight: 700;
    font-size: 14px;
    color: #1B3A6B;
}

.ledger-loc-subtitle {
    font-size: 11px;
    color: #777;
    margin-top: 2px;
}

.ledger-tree-arrow {
    color: #999;
    margin-right: 4px;
    font-size: 11px;
}

.ledger-section-name {
    font-weight: 600;
    color: #2C4A7C;
    font-size: 13px;
}

.ledger-floor-arrow {
    color: #BBB;
}

.ledger-floor-label {
    font-weight: 700;
    font-size: 14px;
    color: #444;
    font-variant-numeric: tabular-nums;
}

/* --- Permit entries (middle column) --- */

.ledger-permit-entry {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    padding: 4px 0;
    border-left: 3px solid transparent;
    padding-left: 6px;
    margin-bottom: 2px;
    border-radius: 2px;
}

.ledger-permit-entry:last-child {
    margin-bottom: 0;
}

/* Rollup span indicators — left-bracket visual */
.ledger-permit-entry.permit-span-start {
    border-left-color: #1B5EBE;
    border-top: 1px solid #1B5EBE;
    border-top-left-radius: 3px;
}

.ledger-permit-entry.permit-span-middle {
    border-left-color: #1B5EBE;
}

.ledger-permit-entry.permit-span-end {
    border-left-color: #1B5EBE;
    border-bottom: 1px solid #1B5EBE;
    border-bottom-left-radius: 3px;
}

.ledger-permit-date {
    font-size: 11px;
    font-weight: 600;
    color: #6B7A99;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.ledger-permit-usage {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
    white-space: nowrap;
}

.usage-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
    letter-spacing: 0.02em;
    vertical-align: middle;
    white-space: nowrap;
}

.usage-badge-text {
    margin-left: 6px;
    font-size: 12px;
    color: #666;
    vertical-align: middle;
}

.ledger-permit-id {
    font-size: 10px;
    color: #999;
    font-family: monospace;
    flex-shrink: 0;
}

/* --- Unit entries (right column) --- */

.ledger-unit {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 5px 8px;
    border-radius: 5px;
    border: 1px solid #E8ECF0;
    margin-bottom: 6px;
    font-size: 12px;
    background: #FAFBFF;
}

.ledger-unit:last-child {
    margin-bottom: 0;
}

.ledger-unit.unit-compliant {
    border-left: 3px solid #28A745;
    background: #F0FBF3;
}

.ledger-unit.unit-noncompliant {
    border-left: 3px solid #DC3545;
    background: #FEF2F2;
}

.ledger-unit.unit-warning {
    border-left: 3px solid #FFC107;
    background: #FFFBF0;
}

.ledger-unit-header {
    display: flex;
    align-items: center;
    gap: 6px;
}

.ledger-unit-designation {
    font-weight: 600;
    color: #333;
    font-size: 12px;
}

.ledger-unit-area {
    font-size: 11px;
    color: #777;
    background: #EEF0F5;
    padding: 1px 5px;
    border-radius: 8px;
}

.ledger-unit-tenant {
    font-size: 11px;
    color: #555;
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.ledger-unit-usage {
    font-size: 11px;
    color: #777;
    font-style: italic;
}

/* Compliance icons inside unit header */
.ledger-unit .compliance-icon {
    font-size: 13px;
    flex-shrink: 0;
}

/* Empty cell placeholder */
.ledger-empty {
    font-size: 12px;
    color: #CCC;
}

/* Tab header with export button */
.tab-header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

.export-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: #1B5EBE;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s;
}

.export-btn:hover {
    background: #154A96;
}

/* ========================================================================= */
/* Validation Status System */
/* ========================================================================= */

.validation-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 6px;
    margin-left: 0;
    cursor: pointer;
    transition: transform 0.15s, opacity 0.15s;
    vertical-align: middle;
}

.validation-dot:hover {
    transform: scale(1.35);
    opacity: 1 !important;
}

.validation-dot.active {
    transform: scale(1.45);
    opacity: 1 !important;
    box-shadow: 0 0 0 3px rgba(27, 94, 190, 0.5);
}

/* Human-validated: trustworthy filled check circle — always full opacity */
.validation-dot-human {
    background: #0D7A3D;
    box-shadow: 0 0 0 2px rgba(13, 122, 61, 0.25);
    opacity: 1;
    width: 12px;
    height: 12px;
    position: relative;
}

.validation-dot-human::before {
    content: "✓";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 9px;
    font-weight: 900;
    line-height: 1;
    pointer-events: none;
}

/* Flagged: filled orange circle with flag glyph */
.validation-dot-flagged {
    background: #E67E22;
    box-shadow: 0 0 0 2px rgba(230, 126, 34, 0.25);
    opacity: 1;
    width: 12px;
    height: 12px;
    position: relative;
}

.validation-dot-flagged::before {
    content: "⚑";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 10px;
    line-height: 1;
    pointer-events: none;
}

.field-flag-badge {
    display: inline-block;
    margin-left: 4px;
    color: #E67E22;
    font-size: 14px;
    cursor: help;
    vertical-align: middle;
}

.validation-dot-ai {
    background: #28A745;
    box-shadow: 0 0 0 2px rgba(40, 167, 69, 0.15);
    opacity: 0.35;
}

/* Review needed / critical: always full opacity to draw attention */
.validation-dot-needs-review {
    background: #FFA726;
    box-shadow: 0 0 0 2px rgba(255, 167, 38, 0.2);
    opacity: 1;
}

.validation-dot-critical {
    background: #DC3545;
    box-shadow: 0 0 0 2px rgba(220, 53, 69, 0.2);
    opacity: 1;
}

.validation-popover {
    position: absolute;
    background: #fff;
    border: 1px solid #E1E4E8;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    padding: 16px;
    z-index: 1000;
    min-width: 300px;
    max-width: 400px;
}

.validation-popover-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #E8ECF0;
}

.validation-popover-title {
    font-weight: 600;
    font-size: 13px;
    color: #333;
}

.validation-popover-close {
    background: none;
    border: none;
    font-size: 18px;
    color: #999;
    cursor: pointer;
    padding: 0;
    width: 20px;
    height: 20px;
    line-height: 1;
}

.validation-popover-close:hover {
    color: #333;
}

.validation-confidence-bar {
    margin-bottom: 12px;
}

.validation-confidence-label {
    font-size: 11px;
    color: #666;
    margin-bottom: 4px;
    display: flex;
    justify-content: space-between;
}

.validation-confidence-track {
    height: 6px;
    background: #E8ECF0;
    border-radius: 3px;
    overflow: hidden;
}

.validation-confidence-fill {
    height: 100%;
    border-radius: 3px;
    transition: width 0.3s;
}

.validation-confidence-fill.confidence-high {
    background: linear-gradient(90deg, #28A745, #0D7A3D);
}

.validation-confidence-fill.confidence-mid {
    background: linear-gradient(90deg, #FFA726, #F57C00);
}

.validation-confidence-fill.confidence-low {
    background: linear-gradient(90deg, #DC3545, #A71D2A);
}

.validation-meta {
    font-size: 11px;
    color: #666;
    margin-bottom: 12px;
    padding: 8px;
    background: #F8F9FA;
    border-radius: 4px;
}

.validation-meta-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 4px;
}

.validation-meta-row:last-child {
    margin-bottom: 0;
}

.validation-meta-label {
    font-weight: 500;
}

.validation-actions {
    display: flex;
    gap: 8px;
    margin-top: 12px;
}

.validation-action-btn {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid #E1E4E8;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s;
    background: #fff;
}

.validation-action-btn.btn-accept {
    border-color: #28A745;
    color: #28A745;
}

.validation-action-btn.btn-accept:hover {
    background: #28A745;
    color: #fff;
}

.validation-action-btn.btn-flag {
    border-color: #FFA726;
    color: #FFA726;
}

.validation-action-btn.btn-flag:hover {
    background: #FFA726;
    color: #fff;
}

.validation-action-btn.btn-edit {
    border-color: #1B5EBE;
    color: #1B5EBE;
}

.validation-action-btn.btn-edit:hover {
    background: #1B5EBE;
    color: #fff;
}

.validation-action-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.validation-context-panel {
    background: #F8F9FA;
    border: 1px solid #E1E4E8;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 16px;
}

.validation-context-header {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #E1E4E8;
}

/* Validation bar in document viewer header area */
.vbar {
    padding: 10px 20px 12px;
    background: #F0F4FA;
    border-bottom: 1px solid #D0D7DE;
}

.vbar-top {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.vbar-field {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #656D76;
}

.vbar-value {
    font-size: 14px;
    font-weight: 600;
    color: #1F2328;
}

.vbar-confidence {
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
    margin-left: auto;
}

.vbar-confidence.confidence-high {
    background: #DCFFE4;
    color: #0D7A3D;
}

.vbar-confidence.confidence-mid {
    background: #FFF3CD;
    color: #B86E00;
}

.vbar-confidence.confidence-low {
    background: #FFDCE0;
    color: #CF222E;
}

.vbar-actions {
    display: flex;
    gap: 6px;
}

.vbar-actions .validation-action-btn {
    font-size: 12px;
    padding: 4px 12px;
}

.vbar-status-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
    margin-left: 6px;
}

.vbar-status-validated {
    background: rgba(13, 122, 61, 0.12);
    color: #0D7A3D;
}

.vbar-status-flagged {
    background: rgba(230, 126, 34, 0.15);
    color: #B85B0C;
}

.vbar-notice {
    margin-top: 6px;
    font-size: 11px;
    color: #8C959F;
    font-style: italic;
}

.vbar-editing {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.vbar-edit-input {
    flex: 1;
    min-width: 180px;
    padding: 4px 8px;
    font-size: 13px;
    font-weight: 600;
    color: #1B2B4B;
    background: #fff;
    border: 1px solid #1B5EBE;
    border-radius: 4px;
    outline: none;
}

.vbar-edit-input:focus {
    box-shadow: 0 0 0 3px rgba(27, 94, 190, 0.25);
}

.vbar-flag-reason {
    width: 100%;
    padding: 6px 8px;
    font-size: 12px;
    font-family: inherit;
    color: #1B2B4B;
    background: #fff;
    border: 1px solid #E67E22;
    border-radius: 4px;
    outline: none;
    resize: vertical;
    min-height: 40px;
}

.vbar-flag-reason:focus {
    box-shadow: 0 0 0 3px rgba(230, 126, 34, 0.25);
}

.validation-toast {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    padding: 10px 18px;
    background: #0D7A3D;
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    border-radius: 24px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s, transform 0.2s;
    z-index: 10000;
}

.validation-toast.show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.no-source-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 64px 24px;
    color: #8C959F;
}

.no-source-icon {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: 0.5;
}

.no-source-text {
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.3px;
}

/* Domain Cards Grid (Dashboard) */
.domain-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.domain-card {
    background: #fff;
    border: 1px solid #E1E4E8;
    border-radius: 8px;
    padding: 20px;
    cursor: pointer;
    transition: all 0.2s;
}

.domain-card:hover {
    border-color: #1B5EBE;
    box-shadow: 0 4px 12px rgba(27, 94, 190, 0.1);
    transform: translateY(-2px);
}

.domain-card-header {
    margin-bottom: 16px;
}

.domain-card-title {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

.domain-card-subtitle {
    font-size: 13px;
    color: #666;
}

.domain-card-body {
    font-size: 13px;
}

.validation-stats-mini {
    display: flex;
    gap: 16px;
    align-items: center;
}

.validation-stat-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 500;
    color: #333;
}

/* ═══════════════════════════════════════════════════════════════════════════
   NEBENKOSTEN (Betriebskosten) SECTION
   ═══════════════════════════════════════════════════════════════════════════ */

.bk-wrapper {
    padding: 4px 0 32px;
}

.bk-header-row {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 12px;
}

.bk-header-row h2 {
    font-size: 20px;
    font-weight: 700;
    color: #1B2B4B;
    margin: 0;
}

.bk-opt-badge {
    background: #E6F4EA;
    color: #0D7A3D;
    border: 1px solid #C3E6CB;
    border-radius: 20px;
    padding: 4px 14px;
    font-size: 13px;
    font-weight: 500;
}

/* Executive summary */
.bk-exec-summary {
    background: #F8FAFF;
    border-left: 4px solid #1B5EBE;
    border-radius: 0 6px 6px 0;
    padding: 12px 16px;
    margin-bottom: 20px;
    font-size: 13.5px;
    line-height: 1.6;
    color: #444;
}

/* KPI cards row */
.bk-kpi-row-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 12px;
    margin-bottom: 24px;
}

.bk-kpi-card {
    background: #fff;
    border: 1px solid #E1E4E8;
    border-radius: 8px;
    padding: 14px 16px;
}

.bk-kpi-year {
    font-size: 15px;
    font-weight: 700;
    color: #1B5EBE;
    margin-bottom: 10px;
    border-bottom: 1px solid #EEF1F5;
    padding-bottom: 6px;
}

.bk-kpi-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 5px;
}

.bk-kpi-label {
    font-size: 11px;
    color: #777;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.bk-kpi-value {
    font-size: 13px;
    font-weight: 600;
    color: #333;
}

.bk-kpi-damage { color: #CF222E; }
.bk-kpi-warn   { color: #B86E00; }
.bk-kpi-ok     { color: #0D7A3D; }

/* Section containers */
.bk-section {
    background: #fff;
    border: 1px solid #E1E4E8;
    border-radius: 8px;
    padding: 16px 20px;
    margin-bottom: 16px;
}

.bk-section-title {
    font-size: 15px;
    font-weight: 600;
    color: #1B2B4B;
    margin: 0 0 14px;
    padding-bottom: 8px;
    border-bottom: 1px solid #EEF1F5;
}

/* Year tabs */
.bk-year-tabs {
    display: flex;
    gap: 4px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}

.bk-year-tab {
    background: #F5F7FA;
    border: 1px solid #D0D7DE;
    border-radius: 6px;
    padding: 5px 14px;
    font-size: 13px;
    font-weight: 500;
    color: #555;
    cursor: pointer;
    transition: all 0.15s;
}

.bk-year-tab:hover {
    background: #E8EDF5;
    border-color: #1B5EBE;
    color: #1B5EBE;
}

.bk-year-tab.active {
    background: #1B5EBE;
    border-color: #1B5EBE;
    color: #fff;
}

/* Cost breakdown table */
.bk-cost-table {
    width: 100%;
    font-size: 13px;
}

.bk-col-category { width: 38%; min-width: 200px; }
.bk-col-rec      { text-align: right; color: #0D7A3D; font-weight: 500; width: 16%; }
.bk-col-nonrec   { text-align: right; color: #B86E00; width: 16%; }
.bk-col-void     { text-align: right; color: #CF222E; width: 16%; }
.bk-col-total    { text-align: right; font-weight: 600; color: #333; width: 14%; }
.bk-num          { text-align: right; }

/* Category (header) rows */
.bk-cat-row {
    background: #F8FAFF;
    cursor: pointer;
    font-weight: 600;
    border-top: 2px solid #E1E4E8;
}

.bk-cat-row:hover { background: #EDF2FF; }

.bk-cat-name {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-left: 4px !important;
}

.bk-cat-toggle {
    font-size: 10px;
    color: #888;
    display: inline-block;
    width: 12px;
    transition: transform 0.15s;
}

.bk-cat-open .bk-cat-toggle {
    transform: rotate(90deg);
}

.bk-cat-en {
    font-size: 11px;
    font-weight: 400;
    color: #888;
    font-style: italic;
}

/* Item (sub) rows */
.bk-item-row td { padding-left: 28px !important; font-size: 12.5px; }
.bk-item-name { color: #444; }

.bk-cat-total { font-weight: 700 !important; }

/* BetrKV tag */
.bk-betrKV {
    font-size: 10px;
    background: #EEF3FF;
    color: #3B63A8;
    border-radius: 3px;
    padding: 1px 5px;
    margin-left: 6px;
    font-weight: 400;
    white-space: nowrap;
}

/* Total row */
.bk-total-row {
    background: #1B2B4B;
    color: #fff;
    font-weight: 700;
    font-size: 13px;
}

.bk-total-row td { color: #fff !important; }
.bk-total-cell   { font-weight: 700; }

/* Benchmark table */
.bk-bench-table { font-size: 13px; width: 100%; }

.bk-bench-critical  { color: #CF222E; font-weight: 700; }
.bk-bench-above     { color: #B86E00; font-weight: 600; }
.bk-bench-ok        { color: #0D7A3D; }

.bk-bench-badge {
    display: inline-block;
    border-radius: 12px;
    padding: 2px 10px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.bk-bench-badge.bk-bench-critical  { background: #FFDCE0; color: #CF222E; }
.bk-bench-badge.bk-bench-above     { background: #FFF3CD; color: #B86E00; }
.bk-bench-badge.bk-bench-ok        { background: #E6F4EA; color: #0D7A3D; }

.bk-source-small { font-size: 11px; color: #888; }

/* YoY deviations */
.bk-yoy-list { display: flex; flex-direction: column; gap: 10px; }

.bk-yoy-item {
    border: 1px solid #E1E4E8;
    border-radius: 6px;
    padding: 10px 14px;
    background: #FAFBFD;
}

.bk-yoy-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
    flex-wrap: wrap;
}

.bk-yoy-pos   { font-weight: 600; font-size: 13px; color: #1B2B4B; }
.bk-yoy-years { font-size: 12px; color: #888; }
.bk-yoy-abs   { font-size: 12px; color: #666; }

.bk-yoy-delta {
    font-weight: 700;
    font-size: 14px;
    padding: 2px 8px;
    border-radius: 4px;
}

.bk-sev-critical   { background: #FFDCE0; color: #CF222E; }
.bk-sev-noteworthy { background: #FFF3CD; color: #B86E00; }
.bk-sev-normal     { background: #E6F4EA; color: #0D7A3D; }

.bk-yoy-explanation {
    font-size: 12.5px;
    color: #555;
    line-height: 1.5;
    padding-left: 4px;
}

/* Recommendations */
.bk-rec-list-container { display: flex; flex-direction: column; gap: 12px; }

.bk-rec-card {
    border: 1px solid #E1E4E8;
    border-radius: 8px;
    padding: 14px 16px;
    background: #FAFBFD;
}

.bk-rec-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}

.bk-rec-prio {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 3px 10px;
    border-radius: 12px;
    white-space: nowrap;
}

.bk-prio-high   { background: #FFDCE0; color: #CF222E; }
.bk-prio-medium { background: #FFF3CD; color: #B86E00; }
.bk-prio-low    { background: #E6F4EA; color: #0D7A3D; }

.bk-rec-title {
    font-size: 14px;
    font-weight: 600;
    color: #1B2B4B;
    flex: 1;
}

.bk-rec-savings {
    font-size: 13px;
    font-weight: 600;
    color: #0D7A3D;
    background: #E6F4EA;
    border-radius: 12px;
    padding: 2px 10px;
    white-space: nowrap;
}

.bk-rec-desc {
    font-size: 13px;
    color: #555;
    margin-bottom: 8px;
    line-height: 1.5;
}

.bk-rec-details { margin-top: 10px; }

.bk-rec-section-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: #888;
    margin: 8px 0 4px;
}

ul.bk-rec-list {
    font-size: 12.5px;
    color: #444;
    padding-left: 18px;
    margin: 0;
    line-height: 1.7;
}

.bk-rec-toggle {
    margin-top: 8px;
    background: none;
    border: 1px solid #D0D7DE;
    border-radius: 4px;
    padding: 4px 12px;
    font-size: 12px;
    color: #555;
    cursor: pointer;
    transition: all 0.15s;
}

.bk-rec-toggle:hover {
    background: #EEF3FF;
    border-color: #1B5EBE;
    color: #1B5EBE;
}

/* Non-recoverable drill-down */
.bk-nr-year-panel { margin-bottom: 8px; }

.bk-nr-year-toggle {
    width: 100%;
    text-align: left;
    background: #F5F7FA;
    border: 1px solid #D0D7DE;
    border-radius: 6px;
    padding: 9px 14px;
    font-size: 13px;
    font-weight: 500;
    color: #444;
    cursor: pointer;
    transition: all 0.15s;
}

.bk-nr-year-toggle:hover {
    background: #EDF2FF;
    border-color: #1B5EBE;
    color: #1B5EBE;
}

.bk-nr-year-body {
    border: 1px solid #E1E4E8;
    border-top: none;
    border-radius: 0 0 6px 6px;
    overflow: auto;
}

.bk-nr-table { font-size: 12px; width: 100%; }
.bk-nr-account { font-family: 'Menlo', 'Consolas', monospace; font-size: 11px; color: #555; white-space: nowrap; }
.bk-nr-vendor  { font-size: 11px; color: #888; white-space: nowrap; }
.bk-nr-period  { font-size: 11px; color: #888; white-space: nowrap; }

/* Trend indicators */
.bk-trend-up   { color: #CF222E; font-size: 14px; }
.bk-trend-down { color: #0D7A3D; font-size: 14px; }
.bk-trend-flat { color: #888; font-size: 14px; }

/* Sparkline SVG */
.bk-sparkline {
    width: 40px;
    height: 24px;
    vertical-align: middle;
}

.bk-sparkline rect { fill: #1B5EBE; opacity: 0.6; }

/* ============================================================
   Third-Party Contracts Viewer
   ============================================================ */

/* ---- KPI strip ---- */
.tpc-kpi-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}

.tpc-kpi-card {
    background: #fff;
    border: 1px solid #E1E4E8;
    border-radius: 8px;
    padding: 14px 16px;
    position: relative;
}

.tpc-kpi-card.kpi-savings {
    border-color: #A7F3D0;
    background: #F0FDF4;
}

.tpc-kpi-card.kpi-warn {
    border-color: #FDE68A;
    background: #FFFBEB;
}

.tpc-kpi-card.kpi-danger {
    border-color: #FCA5A5;
    background: #FFF5F5;
}

.tpc-kpi-value {
    font-size: 26px;
    font-weight: 700;
    color: #1B2B4B;
    line-height: 1.1;
    margin-bottom: 4px;
}

.tpc-kpi-card.kpi-savings .tpc-kpi-value { color: #065F46; }
.tpc-kpi-card.kpi-warn    .tpc-kpi-value { color: #92400E; }
.tpc-kpi-card.kpi-danger  .tpc-kpi-value { color: #991B1B; }

.tpc-kpi-label {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: #6B7280;
}

.tpc-kpi-sub {
    font-size: 11px;
    color: #9CA3AF;
    margin-top: 2px;
}

/* ---- Filter bar ---- */
.tpc-filter-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 10px 14px;
    background: #F8FAFC;
    border: 1px solid #E1E4E8;
    border-radius: 8px;
    margin-bottom: 10px;
}

.tpc-filter-search {
    flex: 1;
    min-width: 160px;
    padding: 5px 10px;
    border: 1px solid #D0D7DE;
    border-radius: 6px;
    font-size: 13px;
    background: #fff;
}

.tpc-filter-search:focus {
    outline: none;
    border-color: #1B5EBE;
    box-shadow: 0 0 0 2px rgba(27, 94, 190, 0.1);
}

.tpc-filter-select {
    padding: 5px 10px;
    border: 1px solid #D0D7DE;
    border-radius: 6px;
    font-size: 12px;
    background: #fff;
    cursor: pointer;
}

.tpc-filter-select:focus {
    outline: none;
    border-color: #1B5EBE;
}

.tpc-filter-toggle {
    padding: 4px 10px;
    border: 1px solid #D0D7DE;
    border-radius: 14px;
    font-size: 11px;
    font-weight: 600;
    background: #fff;
    color: #555;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
}

.tpc-filter-toggle:hover {
    border-color: #1B5EBE;
    color: #1B5EBE;
    background: #EEF3FF;
}

.tpc-filter-toggle.active {
    background: #1B5EBE;
    color: #fff;
    border-color: #1B5EBE;
}

.tpc-filter-count {
    font-size: 12px;
    color: #6B7280;
    margin-left: auto;
    white-space: nowrap;
}

.tpc-filter-reset {
    padding: 4px 10px;
    border: 1px solid #D0D7DE;
    border-radius: 6px;
    font-size: 11px;
    background: #fff;
    color: #888;
    cursor: pointer;
    transition: all 0.15s;
}

.tpc-filter-reset:hover {
    background: #FEE2E2;
    border-color: #DC3545;
    color: #DC3545;
}

/* ---- Contractor group toggle ---- */
.tpc-group-toggle-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.tpc-group-btn {
    padding: 5px 14px;
    border: 1px solid #D0D7DE;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    background: #fff;
    color: #555;
    cursor: pointer;
    transition: all 0.15s;
}

.tpc-group-btn.active {
    background: #1B5EBE;
    color: #fff;
    border-color: #1B5EBE;
}

.tpc-group-btn:hover:not(.active) {
    background: #EEF3FF;
    border-color: #1B5EBE;
    color: #1B5EBE;
}

/* ---- Contractor group rows ---- */
.tpc-contractor-group-row {
    cursor: pointer;
    background: #F0F4FF;
}

.tpc-contractor-group-row:hover td {
    background: #E8F0FE;
}

.tpc-contractor-group-row td {
    font-weight: 600;
    font-size: 13px;
    border-top: 2px solid #D0D7DE;
}

.tpc-contractor-count-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: #1B5EBE;
    color: #fff;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 700;
    margin-left: 6px;
    vertical-align: middle;
}

/* ---- Benchmark bar chart ---- */
.tpc-bm-bar-row {
    margin-bottom: 18px;
    padding: 6px 8px;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s;
}

.tpc-bm-bar-row:hover {
    background: #F3F4F6;
}

.tpc-bm-bar-row.active-filter {
    background: #E0EAFC;
    box-shadow: inset 0 0 0 1px #1B5EBE;
}

.tpc-bm-bar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
    gap: 8px;
}

.tpc-bm-bar-cat {
    flex: 1 1 auto;
    min-width: 0;
}

.tpc-bm-bar-cat-label {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 12px;
    font-weight: 600;
    color: #1F2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tpc-bm-bar-cost {
    font-size: 11px;
    font-weight: 600;
    color: #444;
    white-space: nowrap;
}

.tpc-bm-bar-delta-badge {
    font-size: 10px;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 8px;
    white-space: nowrap;
}

.tpc-bm-bar-delta-ok     { background: #D1FAE5; color: #065F46; }
.tpc-bm-bar-delta-warn   { background: #FEF3C7; color: #92400E; }
.tpc-bm-bar-delta-danger { background: #FEE2E2; color: #991B1B; }
.tpc-bm-bar-delta-na     { background: #F3F4F6; color: #9CA3AF; }

/* Plain-text delta for dual-track rows — no colored pill, status readable from bar color */
.tpc-bm-bar-delta-text {
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0;
}
.tpc-bm-bar-delta-text.tpc-bm-bar-delta-ok     { color: #059669; background: none; padding: 0; border-radius: 0; }
.tpc-bm-bar-delta-text.tpc-bm-bar-delta-warn   { color: #D97706; background: none; padding: 0; border-radius: 0; }
.tpc-bm-bar-delta-text.tpc-bm-bar-delta-danger { color: #DC2626; background: none; padding: 0; border-radius: 0; }
.tpc-bm-bar-delta-text.tpc-bm-bar-delta-na     { color: #9CA3AF; background: none; padding: 0; border-radius: 0; }

.tpc-bm-bar-track {
    position: relative;
    height: 10px;
    background: #F0F2F4;
    border-radius: 5px;
    overflow: visible;
}

.tpc-bm-bar-fill {
    height: 100%;
    border-radius: 5px;
    transition: width 0.4s ease;
}

.tpc-bm-bar-fill-ok     { background: #34D399; }
.tpc-bm-bar-fill-warn   { background: #FBBF24; }
.tpc-bm-bar-fill-danger { background: #F87171; }
.tpc-bm-bar-fill-na     { background: #9CA3AF; }

.tpc-bm-bar-benchmark-zone {
    position: absolute;
    top: 0;
    height: 100%;
    background: rgba(27, 94, 190, 0.12);
    border-left: 2px dashed rgba(27, 94, 190, 0.4);
    border-right: 2px dashed rgba(27, 94, 190, 0.4);
    border-radius: 2px;
    pointer-events: none;
}

/* ── Dual-track bar chart ─────────────────────────────────────────────────── */

.tpc-bm-sqm-val {
    font-size: 11px;
    font-weight: 600;
    color: #374151;
    white-space: nowrap;
    flex-shrink: 0;
}

.tpc-bm-track-row {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 3px;
}

.tpc-bm-track-label {
    flex: 0 0 62px;
    font-size: 9px;
    color: #9CA3AF;
    text-align: right;
    white-space: nowrap;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.tpc-bm-track-actual {
    position: relative;
    height: 10px;
    flex: 1;
    background: #F0F2F4;
    border-radius: 5px;
    overflow: hidden;
}

.tpc-bm-track-benchmark {
    position: relative;
    height: 10px;
    flex: 1;
    background: #F0F2F4;
    border-radius: 5px;
    overflow: visible;
}

.tpc-bm-range-fill {
    position: absolute;
    top: 0;
    height: 100%;
    background: #94A3B8;
    border-radius: 3px;
    opacity: 0.55;
}

.tpc-bm-range-label {
    position: absolute;
    top: 13px;
    font-size: 9px;
    color: #6B7280;
    white-space: nowrap;
    line-height: 1;
    /* left-aligned at bmLowPct — single combined label, never overlaps */
}

.tpc-bm-savings-total {
    margin-top: 12px;
    padding: 8px 12px;
    background: #F0FDF4;
    border: 1px solid #A7F3D0;
    border-radius: 6px;
    font-size: 12px;
    color: #065F46;
    font-weight: 600;
}

/* ---- Umlagefähig donut ---- */
.tpc-umlag-donut-wrap {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 12px;
}

.tpc-umlag-donut {
    flex-shrink: 0;
    width: 72px;
    height: 72px;
}

.tpc-umlag-legend {
    flex: 1;
    font-size: 12px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.tpc-umlag-legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.tpc-umlag-legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.tpc-umlag-legend-dot-yes  { background: #34D399; }
.tpc-umlag-legend-dot-no   { background: #F87171; }
.tpc-umlag-legend-dot-unk  { background: #D1D5DB; }

.tpc-umlag-legend-label { color: #444; }
.tpc-umlag-legend-val   { font-weight: 600; color: #1B2B4B; margin-left: auto; }

.tpc-umlag-action-callout {
    background: #FFFBEB;
    border: 1px solid #FDE68A;
    border-radius: 6px;
    padding: 8px 10px;
    font-size: 11.5px;
    color: #92400E;
    margin-bottom: 10px;
    line-height: 1.5;
}

.tpc-umlag-unknown-list {
    font-size: 12px;
}

.tpc-umlag-unknown-item {
    display: flex;
    justify-content: space-between;
    padding: 4px 0;
    border-bottom: 1px solid #F6F8FA;
    color: #444;
}

.tpc-umlag-unknown-item:last-child { border-bottom: none; }

/* ---- Risk flags panel ---- */
.tpc-flags-section {
    margin-bottom: 10px;
}

.tpc-flags-section-title {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #9CA3AF;
    margin-bottom: 6px;
}

.tpc-flag-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 6px;
    border-radius: 5px;
    margin-bottom: 3px;
    cursor: pointer;
    transition: background 0.12s;
    font-size: 12px;
}

.tpc-flag-row:hover {
    background: #F0F4FF;
}

.tpc-flag-row.active-filter {
    background: #EEF3FF;
    outline: 1px solid #1B5EBE;
}

.tpc-flag-row-label {
    color: #374151;
    flex: 1;
}

.tpc-flag-row-count {
    font-weight: 700;
    font-size: 13px;
    min-width: 24px;
    text-align: right;
}

.tpc-flag-row-count-critical { color: #CF222E; }
.tpc-flag-row-count-warn     { color: #B45309; }
.tpc-flag-row-count-info     { color: #1B5EBE; }

/* ---- Sortable column headers ---- */
.tpc-th-sortable {
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

.tpc-th-sortable:hover {
    color: #1B5EBE;
}

.tpc-sort-arrow {
    font-size: 10px;
    margin-left: 3px;
    opacity: 0.5;
}

.tpc-th-sortable.sort-asc  .tpc-sort-arrow,
.tpc-th-sortable.sort-desc .tpc-sort-arrow { opacity: 1; color: #1B5EBE; }

/* ---- Row cost coloring — benchmark classes kept on <tr> but no background fill ---- */
/* Row color coding removed: unexplained green/amber/red confused users.
   Status is communicated in the Kosten nach Kategorie panel instead. */

/* Category chips — full set matching actual data slugs */
.category-chip {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
    white-space: nowrap;
    letter-spacing: 0.2px;
}
.category-chip-security               { background: #DBEAFE; color: #1E40AF; }
.category-chip-cleaning               { background: #CCFBF1; color: #0F766E; }
.category-chip-heating                { background: #FEF3C7; color: #92400E; }
.category-chip-heating_cooling_supply { background: #FEF3C7; color: #92400E; }
.category-chip-electricity            { background: #EDE9FE; color: #5B21B6; }
.category-chip-electricity_supply     { background: #EDE9FE; color: #5B21B6; }
.category-chip-water                  { background: #CFFAFE; color: #0E7490; }
.category-chip-elevator               { background: #FCE7F3; color: #9D174D; }
.category-chip-elevator_maintenance   { background: #FCE7F3; color: #9D174D; }
.category-chip-insurance              { background: #D1FAE5; color: #065F46; }
.category-chip-management             { background: #F3F4F6; color: #374151; }
.category-chip-facility_management    { background: #E0E7FF; color: #3730A3; }
.category-chip-waste_disposal         { background: #FEF9C3; color: #713F12; }
.category-chip-fire_protection        { background: #FEE2E2; color: #991B1B; }
.category-chip-sanitation_maintenance { background: #CFFAFE; color: #0E7490; }
.category-chip-telecom                { background: #F3E8FF; color: #6B21A8; }
.category-chip-metering               { background: #FFF7ED; color: #9A3412; }
.category-chip-electrical_maintenance { background: #FFFBEB; color: #78350F; }
.category-chip-other                  { background: #F3F4F6; color: #6B7280; }

/* Flag badges — full set */
.flag-badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 8px;
    white-space: nowrap;
    margin-right: 3px;
}
/* critical severity */
.flag-badge-auto-renewal       { background: #FED7AA; color: #92400E; }
.flag-badge-missing-notice     { background: #FEE2E2; color: #991B1B; }
.flag-badge-no-fixed-cost      { background: #FEF9C3; color: #713F12; }
.flag-badge-missing-start      { background: #FEE2E2; color: #991B1B; }
.flag-badge-long-notice        { background: #FEE2E2; color: #991B1B; }
/* informational severity */
.flag-badge-indexed-pricing    { background: #E0E7FF; color: #3730A3; }
.flag-badge-wage-index         { background: #E0E7FF; color: #3730A3; }
.flag-badge-missing-info       { background: #FEF3C7; color: #92400E; }
.flag-badge-not-a-contract     { background: #F3F4F6; color: #6B7280; }
.flag-badge-fixed-term         { background: #D1FAE5; color: #065F46; }
.flag-badge-no-auto-renewal    { background: #D1FAE5; color: #065F46; }
.flag-badge-specialized        { background: #F3E8FF; color: #6B21A8; }
.flag-badge-material-extra     { background: #FEF9C3; color: #713F12; }
.flag-badge-other-flag         { background: #F3F4F6; color: #6B7280; }

/* Contract family wrapper */
.tpc-contract-family {
    margin-bottom: 2px;
}

.tpc-family-detail {
    display: none;
    background: #FAFBFC;
    border-top: 1px solid #E1E4E8;
    border-left: 3px solid #D0D7DE;
    border-radius: 0;
    padding: 12px 16px 12px 32px;
    margin-left: 16px;
}

.tpc-family-detail.open {
    display: block;
}

/* Parent row: semibold, primary color — canonical "current legal status" */
tr.tpc-contract-family > td { font-weight: 600; color: #1B2B4B; }

/* Document cards inside the TPC family detail: transparent, non-card, muted */
.tpc-family-detail .tpc-doc-card {
    background: transparent;
    border: none;
    border-top: 1px solid #EBEEF2;
    border-radius: 0;
    padding: 10px 0;
    margin-bottom: 0;
    cursor: default;
    color: #6B7280;
}
.tpc-family-detail .tpc-doc-card:first-child { border-top: none; }
.tpc-family-detail .tpc-doc-card:hover { background: transparent; }
.tpc-family-detail .tpc-doc-card-header { color: #4B5563; font-weight: 500; }
.tpc-family-detail .tpc-doc-field { color: #6B7280; }
.tpc-family-detail .tpc-doc-field-label { color: #9CA3AF; }

/* Quote excerpts: belong to the document above, not a new hierarchy level */
.tpc-family-detail .quote-box,
.tpc-family-detail .quote-box-small {
    background: transparent;
    border: none;
    border-left: 2px solid #E1E4E8;
    border-radius: 0;
    margin: 4px 0 4px 12px;
    padding: 2px 0 2px 10px;
    color: #8A94A3;
    font-size: 12px;
    font-style: italic;
}

/* Document cards inside expanded chain */
.tpc-doc-card {
    background: #fff;
    border: 1px solid #D0D7DE;
    border-radius: 6px;
    padding: 10px 14px;
    margin-bottom: 8px;
    font-size: 12.5px;
}

.tpc-doc-card-header {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: #24292F;
    margin-bottom: 6px;
}

.tpc-doc-card-fields {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 4px 16px;
}

.tpc-doc-field {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: #555;
}

.tpc-doc-field-label {
    color: #888;
    font-size: 11px;
    min-width: 80px;
}

/* Amendment connector line */
.tpc-amendment-connector {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 6px;
}

.tpc-connector-line {
    width: 2px;
    min-height: 20px;
    background: #D0D7DE;
    margin-left: 10px;
    flex-shrink: 0;
}

/* Analysis panel */
.tpc-analysis-panel {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 14px;
    margin-bottom: 20px;
}

.tpc-panel-card {
    background: #fff;
    border: 1px solid #E1E4E8;
    border-radius: 8px;
    padding: 14px 16px;
    max-height: 40vh;
    overflow-y: auto;
    overflow-x: hidden;
}

.tpc-panel-card h4 {
    font-size: 12px;
    font-weight: 700;
    color: #24292F;
    margin: 0 0 10px 0;
    padding-bottom: 7px;
    border-bottom: 1px solid #F0F2F4;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 1;
}

.tpc-panel-card::-webkit-scrollbar {
    width: 4px;
}
.tpc-panel-card::-webkit-scrollbar-track {
    background: transparent;
}
.tpc-panel-card::-webkit-scrollbar-thumb {
    background: #D1D5DB;
    border-radius: 2px;
}
.tpc-panel-card::-webkit-scrollbar-thumb:hover {
    background: #9CA3AF;
}

.tpc-deadline-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 0;
    border-bottom: 1px solid #F6F8FA;
    font-size: 12px;
}

.tpc-deadline-item:last-child { border-bottom: none; }

.tpc-deadline-label { color: #444; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tpc-deadline-days  { font-weight: 600; font-size: 11px; white-space: nowrap; margin-left: 8px; }
.tpc-deadline-red   { color: #CF222E; }
.tpc-deadline-amber { color: #B45309; }
.tpc-deadline-green { color: #0D7A3D; }

.tpc-cost-bar-row {
    margin-bottom: 8px;
    font-size: 12px;
}

.tpc-cost-bar-label {
    display: flex;
    justify-content: space-between;
    margin-bottom: 3px;
    color: #444;
}

.tpc-cost-bar-track {
    height: 6px;
    background: #F0F2F4;
    border-radius: 3px;
    overflow: hidden;
}

.tpc-cost-bar-fill {
    height: 100%;
    background: #1B5EBE;
    border-radius: 3px;
    transition: width 0.3s;
}

.tpc-risk-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.tpc-risk-item {
    background: #F6F8FA;
    border-radius: 6px;
    padding: 8px 10px;
    text-align: center;
}

.tpc-risk-count {
    font-size: 22px;
    font-weight: 700;
    color: #24292F;
    line-height: 1.1;
}

.tpc-risk-label {
    font-size: 10px;
    color: #6B7280;
    margin-top: 2px;
    line-height: 1.3;
}

.tpc-risk-count-warn { color: #B45309; }
.tpc-risk-count-danger { color: #CF222E; }

/* Invoice-only rows */
.invoice-only-row {
    background: #FFFBEB !important;
    opacity: 0.85;
}

.invoice-only-row td {
    color: #6B7280;
    font-style: italic;
}

/* Clickable main row */
.tpc-contract-family {
    cursor: pointer;
}

.tpc-contract-family:hover td {
    background: #F6F8FA;
}

/* Benchmark table */
.tpc-benchmark-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}

.tpc-benchmark-table th {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: #888;
    padding: 4px 6px;
    border-bottom: 1px solid #E1E4E8;
    text-align: left;
    white-space: nowrap;
}

.tpc-benchmark-table td {
    padding: 5px 6px;
    border-bottom: 1px solid #F0F2F4;
    vertical-align: middle;
}

.tpc-benchmark-table tr:last-child td {
    border-bottom: none;
}

.tpc-bm-num {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    color: #444;
}

.tpc-bm-delta {
    text-align: center;
    font-weight: 700;
    font-size: 13px;
}

.tpc-bm-umlag {
    text-align: center;
}

.tpc-delta-ok     { color: #0D7A3D; }
.tpc-delta-warn   { color: #B45309; }
.tpc-delta-danger { color: #CF222E; }

/* Docs toggle button */
.tpc-docs-toggle {
    background: none;
    border: 1px solid #D0D7DE;
    border-radius: 4px;
    padding: 3px 8px;
    font-size: 11px;
    color: #555;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.15s;
}

.tpc-docs-toggle:hover {
    background: #EEF3FF;
    border-color: #1B5EBE;
    color: #1B5EBE;
}

/* Umlagefähig indicator */
.tpc-umlag-yes { color: #0D7A3D; font-weight: 600; }
.tpc-umlag-no  { color: #CF222E; font-weight: 600; }
.tpc-umlag-unk { color: #888; }

/* Status badge overrides for TPC */
.tpc-status-active     { background: #D1FAE5; color: #065F46; border-radius: 10px; padding: 2px 8px; font-size: 11px; font-weight: 600; }
.tpc-status-terminated { background: #FEE2E2; color: #991B1B; border-radius: 10px; padding: 2px 8px; font-size: 11px; font-weight: 600; }

/* === Technical Facilities === */
/* ---- TF KPI strip (light theme, matching TPC) ---- */
.tf-kpi-strip {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px; margin-bottom: 16px;
}
.tf-kpi-card {
    background: #fff; border: 1px solid #E1E4E8; border-radius: 8px;
    padding: 14px 16px; text-align: center;
}
.tf-kpi-value { font-size: 26px; font-weight: 700; color: #1B2B4B; line-height: 1.1; margin-bottom: 4px; }
.tf-kpi-label { font-size: 11px; font-weight: 600; color: #6B7280; text-transform: uppercase; letter-spacing: 0.4px; }
.tf-kpi-danger { border-color: #FCA5A5; background: #FFF5F5; }
.tf-kpi-danger .tf-kpi-value { color: #991B1B; }
.tf-kpi-warn { border-color: #FDE68A; background: #FFFBEB; }
.tf-kpi-warn .tf-kpi-value { color: #92400E; }

.tf-category-breakdown {
    display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px;
}
.tf-cat-chip {
    display: inline-block; padding: 3px 10px; border-radius: 12px;
    font-size: 11px; font-weight: 600; background: #E5E7EB; color: #374151;
}
.tf-cat-elevator { background: #DBEAFE; color: #1E40AF; }
.tf-cat-fire_protection { background: #FEE2E2; color: #991B1B; }
.tf-cat-electrical { background: #FEF3C7; color: #92400E; }
.tf-cat-hvac { background: #D1FAE5; color: #065F46; }
.tf-cat-plumbing { background: #CFFAFE; color: #155E75; }
.tf-cat-water_quality { background: #E0F2FE; color: #075985; }
.tf-cat-doors_gates { background: #EDE9FE; color: #5B21B6; }

.tf-panel-card {
    background: #fff; border: 1px solid #E1E4E8; border-radius: 8px;
    padding: 14px 16px; margin-bottom: 16px;
}
.tf-panel-card h4 { margin: 0 0 10px 0; color: #24292F; font-size: 12px; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.4px; }

.tf-timeline-item {
    display: flex; align-items: center; gap: 8px; padding: 6px 0;
    border-bottom: 1px solid #F0F2F4; font-size: 13px;
}
.tf-timeline-label { flex: 1; color: #24292F; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tf-timeline-date { color: #6B7280; font-size: 12px; min-width: 90px; }
.tf-timeline-interval { color: #6B7280; font-size: 12px; min-width: 60px; text-align: center; }
.tf-timeline-days { font-weight: 600; font-size: 12px; min-width: 100px; text-align: right; }
.tf-timeline-red { color: #DC2626; }
.tf-timeline-orange { color: #D97706; }
.tf-timeline-green { color: #059669; }

.tf-main-table { margin-top: 0; }
.tf-facility-row { cursor: pointer; }
.tf-facility-row > td { font-weight: 600; color: #1B2B4B; }
.tf-facility-row:hover td { background: #F8FAFC; }

/* Detail row: indented child container with a left "thread" linking children to parent.
   Container is the lightest grey — subtle, non-card. Child rows inside are transparent. */
.tf-facility-detail {
    padding: 12px 16px 12px 32px;
    background: #FAFBFC;
    border-top: 1px solid #E1E4E8;
    border-left: 3px solid #D0D7DE;
    margin-left: 16px;
}
.tf-detail-equip {
    font-size: 12px; color: #6B7280; padding: 0 0 10px 0;
    margin-bottom: 12px; border-bottom: 1px solid #E1E4E8;
}
.tf-detail-section h5 { margin: 0 0 8px 0; color: #24292F; font-size: 13px; }

/* Child history table: smaller, muted, lower visual weight than parent row.
   Non-interactive: no hover state (rows aren't clickable). */
.tf-history-table { font-size: 11px; color: #6B7280; background: transparent; }
.tf-history-table thead th {
    color: #9CA3AF; font-weight: 500;
    background: transparent; border-top: none;
}
.tf-history-table tbody tr { background: transparent; cursor: default; }
.tf-history-table tbody tr:hover { background: transparent; }
.tf-history-table tbody td {
    color: #6B7280; font-weight: 400;
    border-top: 1px solid #EBEEF2;
    background: transparent;
}
/* Low-saturation / outlined badges inside child rows */
.tf-history-table .badge {
    background: transparent !important;
    border: 1px solid currentColor;
    font-weight: 500;
    opacity: 0.85;
}
.tf-history-table .badge-success { color: #047857; }
.tf-history-table .badge-warning { color: #B45309; }
.tf-history-table .badge-danger  { color: #B91C1C; }
.tf-record-link { color: #1B5EBE; cursor: pointer; font-size: 11px; }
.tf-record-link:hover { text-decoration: underline; }

/* ---- TF Filter bar (light theme) ---- */
.tf-filter-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 10px 14px;
    background: #F8FAFC;
    border: 1px solid #E1E4E8;
    border-radius: 8px;
    margin-bottom: 10px;
}

.tf-filter-search {
    flex: 1;
    min-width: 180px;
    padding: 5px 10px;
    border: 1px solid #D0D7DE;
    border-radius: 6px;
    font-size: 13px;
    background: #fff;
    color: #24292F;
}

.tf-filter-search:focus {
    outline: none;
    border-color: #1B5EBE;
    box-shadow: 0 0 0 2px rgba(27, 94, 190, 0.1);
}

.tf-filter-search::placeholder { color: #9CA3AF; }

.tf-filter-select {
    padding: 5px 10px;
    border: 1px solid #D0D7DE;
    border-radius: 6px;
    font-size: 12px;
    background: #fff;
    color: #374151;
    cursor: pointer;
}

.tf-filter-select:focus {
    outline: none;
    border-color: #1B5EBE;
}

.tf-filter-count {
    font-size: 12px;
    color: #6B7280;
    margin-left: auto;
    white-space: nowrap;
}

.tf-filter-reset {
    padding: 4px 10px;
    border: 1px solid #D0D7DE;
    border-radius: 6px;
    font-size: 11px;
    background: #fff;
    color: #888;
    cursor: pointer;
    transition: all 0.15s;
}

.tf-filter-reset:hover {
    background: #FEE2E2;
    border-color: #DC3545;
    color: #DC3545;
}

/* ---- TF Analysis panels ---- */
.tf-analysis-panels {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 20px;
}

@media (max-width: 900px) {
    .tf-analysis-panels { grid-template-columns: 1fr; }
}

.tf-panel-card {
    max-height: 25vh;
    overflow-y: auto;
    overflow-x: hidden;
}

.tf-panel-card h4 {
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 1;
    padding-bottom: 7px;
    border-bottom: 1px solid #F0F2F4;
}

.tf-panel-card::-webkit-scrollbar { width: 4px; }
.tf-panel-card::-webkit-scrollbar-track { background: transparent; }
.tf-panel-card::-webkit-scrollbar-thumb { background: #D1D5DB; border-radius: 2px; }
.tf-panel-card::-webkit-scrollbar-thumb:hover { background: #9CA3AF; }

.tf-panel-clickable { cursor: pointer; }
.tf-panel-clickable:hover { background: #F0F4FF; border-radius: 4px; }

.tf-timeline-grey { color: #9CA3AF; }

/* ---- TF Defect summary (light theme) ---- */
.tf-defect-summary {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.tf-severity-chip {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
}

.tf-severity-chip.tf-severity-gefaehrlich { background: #FEE2E2; color: #991B1B; }
.tf-severity-chip.tf-severity-erheblich { background: #FEF3C7; color: #92400E; }
.tf-severity-chip.tf-severity-geringfuegig { background: #FEF9C3; color: #854D0E; }
.tf-severity-chip.tf-severity-keine { background: #D1FAE5; color: #065F46; }

.tf-defect-item {
    padding: 8px 0;
    border-bottom: 1px solid #F0F2F4;
}

.tf-defect-item:last-child { border-bottom: none; }

.tf-defect-item-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2px;
}

.tf-defect-item-type {
    font-size: 13px;
    font-weight: 500;
    color: #24292F;
}

.tf-severity-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.tf-severity-badge.tf-severity-gefaehrliche { background: #FEE2E2; color: #991B1B; }
.tf-severity-badge.tf-severity-erhebliche { background: #FEF3C7; color: #92400E; }
.tf-severity-badge.tf-severity-geringfuegige { background: #FEF9C3; color: #854D0E; }
.tf-severity-badge.tf-severity-keine { background: #D1FAE5; color: #065F46; }

.tf-defect-item-meta {
    font-size: 11px;
    color: #6B7280;
}

/* ---- TF Row highlight on scroll-to ---- */
@keyframes tf-highlight-pulse {
    0% { box-shadow: inset 0 0 0 2px #1B5EBE; }
    100% { box-shadow: inset 0 0 0 0px transparent; }
}

.tf-row-highlight {
    animation: tf-highlight-pulse 2s ease-out;
}

/* ---- TF Panel-filter banner ---- */
.tf-panel-filter-banner {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    background: #EEF3FF;
    border: 1px solid #93B4F4;
    border-radius: 8px;
    margin-bottom: 8px;
    font-size: 13px;
    color: #1B2B4B;
    font-weight: 500;
}

.tf-panel-filter-remove {
    margin-left: auto;
    padding: 4px 12px;
    border: 1px solid #DC3545;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    background: #fff;
    color: #DC3545;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
}

.tf-panel-filter-remove:hover {
    background: #DC3545;
    color: #fff;
}

/* ---- Building Permits (bp-*) — mirrors tf-* layout ---- */
.bp-kpi-strip {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px; margin-bottom: 16px;
}
.bp-kpi-card {
    background: #fff; border: 1px solid #E1E4E8; border-radius: 8px;
    padding: 14px 16px; text-align: center;
}
.bp-kpi-value { font-size: 26px; font-weight: 700; color: #1B2B4B; line-height: 1.1; margin-bottom: 4px; }
.bp-kpi-label { font-size: 11px; font-weight: 600; color: #6B7280; text-transform: uppercase; letter-spacing: 0.4px; }
.bp-kpi-danger { border-color: #FCA5A5; background: #FFF5F5; }
.bp-kpi-danger .bp-kpi-value { color: #991B1B; }
.bp-kpi-warn { border-color: #FDE68A; background: #FFFBEB; }
.bp-kpi-warn .bp-kpi-value { color: #92400E; }

.bp-cat-breakdown { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }
.bp-cat-chip {
    display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px;
    border-radius: 12px; font-size: 11px; font-weight: 600;
    background: #E5E7EB; color: #374151; cursor: pointer;
}
.bp-cat-chip:hover { background: #D1D5DB; }

.bp-main-table { margin-top: 0; }
.bp-permit-row { cursor: pointer; }
.bp-permit-row > td { font-weight: 600; color: #1B2B4B; }
.bp-permit-row:hover td { background: #F8FAFC; }

.bp-permit-detail {
    padding: 12px 16px 12px 32px;
    background: #FAFBFC;
    border-top: 1px solid #E1E4E8;
    border-left: 3px solid #D0D7DE;
    margin-left: 16px;
}
.bp-permit-detail .card { box-shadow: none; border: 1px solid #E1E4E8; }
.bp-permit-detail .contract-family { background: transparent; padding: 0; box-shadow: none; }

.bp-flag-chip {
    display: inline-block; padding: 2px 8px; border-radius: 10px;
    background: #FEE2E2; color: #991B1B; font-size: 11px; font-weight: 700;
}
.bp-change-badge {
    display: inline-block; padding: 2px 8px; border-radius: 10px;
    background: #EDE9FE; color: #5B21B6; font-size: 10px; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.3px;
}

.bp-timeline-item {
    display: flex; align-items: center; gap: 8px; padding: 6px 0;
    border-bottom: 1px solid #F0F2F4; font-size: 13px;
}
.bp-timeline-label { flex: 1; color: #24292F; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bp-timeline-year { color: #6B7280; font-size: 12px; min-width: 60px; font-weight: 600; }
.bp-timeline-count { color: #6B7280; font-size: 12px; min-width: 70px; text-align: right; }

.bp-usage-bar { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid #F0F2F4; font-size: 13px; }
.bp-usage-bar:last-child { border-bottom: none; }
.bp-usage-bar-label { min-width: 140px; }
.bp-usage-bar-track { flex: 1; background: #F0F2F4; height: 8px; border-radius: 4px; overflow: hidden; }
.bp-usage-bar-fill { background: #1B5EBE; height: 100%; }
.bp-usage-bar-count { min-width: 50px; text-align: right; color: #6B7280; font-size: 12px; }

.bp-flag-item { padding: 8px 0; border-bottom: 1px solid #F0F2F4; cursor: pointer; }
.bp-flag-item:last-child { border-bottom: none; }
.bp-flag-item:hover { background: #F0F4FF; border-radius: 4px; }
.bp-flag-item-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 2px; }
.bp-flag-item-type { font-size: 13px; font-weight: 500; color: #24292F; }
.bp-flag-item-meta { font-size: 11px; color: #6B7280; }

/* ---- Lease Contracts table view (lc-*) ---- */
.lc-kpi-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.lc-kpi-card {
    background: #fff; border: 1px solid #E1E4E8; border-radius: 8px;
    padding: 14px 16px; text-align: center;
}
.lc-kpi-value { font-size: 26px; font-weight: 700; color: #1B2B4B; line-height: 1.1; margin-bottom: 4px; }
.lc-kpi-label { font-size: 11px; font-weight: 600; color: #6B7280; text-transform: uppercase; letter-spacing: 0.4px; }
.lc-kpi-danger { border-color: #FCA5A5; background: #FFF5F5; }
.lc-kpi-danger .lc-kpi-value { color: #991B1B; }
.lc-kpi-warn { border-color: #FDE68A; background: #FFFBEB; }
.lc-kpi-warn .lc-kpi-value { color: #92400E; }

.lc-main-table { margin-top: 0; }
.lc-lease-row { cursor: pointer; }
.lc-lease-row > td { font-weight: 600; color: #1B2B4B; }
.lc-lease-row:hover td { background: #F8FAFC; }

/* Detail row: indented child container with a left "thread" linking children to parent.
   Lightest grey background — subtle, non-card. Mirrors the technical-facilities pattern. */
.lc-lease-detail {
    padding: 12px 16px 12px 32px;
    background: #FAFBFC;
    border-top: 1px solid #E1E4E8;
    border-left: 3px solid #D0D7DE;
    margin-left: 16px;
}

/* Document cards inside the lease detail: transparent, non-clickable, muted */
.lc-lease-detail .tpc-doc-card {
    background: transparent;
    border: none;
    border-top: 1px solid #EBEEF2;
    border-radius: 0;
    padding: 10px 0;
    margin-bottom: 0;
    cursor: default;
    color: #6B7280;
}
.lc-lease-detail .tpc-doc-card:first-child { border-top: none; }
.lc-lease-detail .tpc-doc-card:hover { background: transparent; }
.lc-lease-detail .tpc-doc-card-header {
    color: #4B5563;
    font-weight: 500;
}
.lc-lease-detail .tpc-doc-field { color: #6B7280; }
.lc-lease-detail .tpc-doc-field-label { color: #9CA3AF; }

/* Quote excerpts inside the lease detail: belong to the document above, not a new hierarchy level.
   No coloured left border (would compete with the parent thread), no card background —
   just italic, muted, tightly coupled to the preceding document fields. */
.lc-lease-detail .quote-box,
.lc-lease-detail .quote-box-small {
    background: transparent;
    border: none;
    border-left: 2px solid #E1E4E8;
    border-radius: 0;
    margin: 4px 0 4px 12px;
    padding: 2px 0 2px 10px;
    color: #8A94A3;
    font-size: 12px;
    font-style: italic;
}


/* ─── VAT Risk Tab ─────────────────────────────────────── */
.vat-bar-wrap { margin-bottom: 1.25rem; }
.vat-bar-label { font-size: 12px; color: #6B7280; margin-bottom: 6px; display: flex; justify-content: space-between; }
.vat-bar { height: 8px; border-radius: 4px; background: #F3F4F6; overflow: hidden; display: flex; }
.vat-bar-seg { height: 100%; }

.vat-detail-panel { padding: 16px 20px; background: #F8FAFC; border-top: 1px solid #E1E4E8; }
.vat-detail-fields { display: flex; gap: 32px; margin-bottom: 14px; flex-wrap: wrap; }
.vat-detail-field { min-width: 200px; }
.vat-detail-label { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: #9CA3AF; margin-bottom: 4px; }

.vat-findings-section { border-top: 1px solid #E1E4E8; padding-top: 12px; }
.vat-findings-label { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: #9CA3AF; margin-bottom: 8px; }

.vat-finding { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 8px; }
.vat-finding-icon { font-size: 13px; flex-shrink: 0; margin-top: 1px; width: 16px; text-align: center; }
.vat-finding-text { font-size: 12px; color: #374151; line-height: 1.5; }

.source-tag { display: inline-block; font-size: 10px; background: #F3F4F6; border: 0.5px solid #D1D5DB; border-radius: 3px; padding: 1px 5px; color: #6B7280; margin-left: 4px; font-family: monospace; }

/* VAT risk dashboard mini-summary in Legal DD card */
.vat-mini-summary { display:flex; align-items:center; gap:6px; margin-top:8px; padding-top:8px; border-top:1px solid #F3F4F6; }
.vat-mini-label  { font-size:11px; color:#9CA3AF; }

/* VAT sector chips */
.vat-cat-breakdown { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px; }
.vat-cat-chip { font-size:11px; padding:3px 10px; border-radius:12px; background:#F3F4F6; border:1px solid #E5E7EB; color:#374151; cursor:pointer; white-space:nowrap; }
.vat-cat-chip:hover, .vat-cat-chip.active { background:#E0E7FF; border-color:#6366F1; color:#3730A3; }

/* ─── CDD Commercial Lease Analysis (cl-*) ─────────────────────────────────── */
.cl-kpi-strip { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:12px; margin-bottom:16px; }
.cl-kpi-card { background:#fff; border:1px solid #E1E4E8; border-radius:8px; padding:14px 16px; text-align:center; }
.cl-kpi-card .cl-kpi-value { font-size:24px; font-weight:700; color:#1B2B4B; line-height:1.1; margin-bottom:4px; }
.cl-kpi-card .cl-kpi-label { font-size:11px; font-weight:600; color:#6B7280; text-transform:uppercase; letter-spacing:0.4px; }
.cl-kpi-danger { border-color:#FCA5A5 !important; background:#FFF5F5 !important; }
.cl-kpi-danger .cl-kpi-value { color:#991B1B !important; }
.cl-kpi-warn { border-color:#FDE68A !important; background:#FFFBEB !important; }
.cl-kpi-warn .cl-kpi-value { color:#92400E !important; }
.cl-kpi-green { border-color:#A7F3D0 !important; background:#F0FDF4 !important; }
.cl-kpi-green .cl-kpi-value { color:#065F46 !important; }

.cl-panels { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:16px; }
@media (max-width:900px) { .cl-panels { grid-template-columns:1fr; } }
.cl-panel { background:#fff; border:1px solid #E1E4E8; border-radius:8px; padding:14px 16px; }
.cl-panel-title { font-size:12px; font-weight:700; color:#374151; text-transform:uppercase; letter-spacing:0.5px; margin-bottom:10px; }
.cl-vpi-note { font-size:10px; color:#9CA3AF; font-weight:400; text-transform:none; letter-spacing:0; margin-left:6px; }

/* Expiry calendar */
.cl-cal { display:flex; align-items:flex-end; gap:6px; height:80px; }
.cl-cal-col { display:flex; flex-direction:column; align-items:center; flex:1; height:100%; }
.cl-cal-col-clickable { cursor:pointer; }
.cl-cal-col-clickable:hover .cl-cal-bar { opacity:0.75; }
.cl-cal-col-clickable:hover .cl-cal-year { color:#4B5563; }
.cl-cal-col--active .cl-cal-bar { outline:2px solid #1B2B4B; outline-offset:1px; opacity:1; }
.cl-cal-col--active .cl-cal-year { color:#1B2B4B; font-weight:700; }
.cl-cal-bar-wrap { flex:1; display:flex; align-items:flex-end; width:100%; }
.cl-cal-bar { width:100%; border-radius:3px 3px 0 0; min-height:2px; transition:opacity 0.15s; }
.cl-cal-bar:hover { opacity:0.8; }
.cl-bar-red { background:#EF4444; }
.cl-bar-orange { background:#F97316; }
.cl-bar-yellow { background:#EAB308; }
.cl-bar-green { background:#22C55E; }
.cl-cal-year { font-size:9px; color:#9CA3AF; margin-top:3px; }

/* Indexation bars */
.cl-idx-list { display:flex; flex-direction:column; gap:6px; max-height:200px; overflow-y:auto; }
.cl-idx-row { display:flex; align-items:center; gap:8px; min-height:22px; }
.cl-idx-name { font-size:11px; color:#374151; width:120px; min-width:120px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cl-idx-name-clickable { cursor:pointer; }
.cl-idx-name-clickable:hover { color:#1B2B4B; text-decoration:underline; }
.cl-idx-name--active { color:#1B2B4B; font-weight:700; text-decoration:underline; }
.cl-idx-bar-area { flex:1; display:flex; align-items:center; gap:8px; }
.cl-idx-bar { flex:1; height:10px; border-radius:5px; overflow:hidden; display:flex; background:#F3F4F6; }
.cl-idx-bar-actual { background:#6366F1; height:100%; }
.cl-idx-bar-pot { background:#A5F3FC; height:100%; }
.cl-idx-amounts { font-size:10px; color:#374151; white-space:nowrap; }
.cl-idx-up { color:#059669; font-weight:600; }
.cl-idx-none { font-size:10px; color:#9CA3AF; font-style:italic; }

/* Main table */
.cl-main-table { margin-top:0; }
.cl-lease-row { cursor:pointer; }
.cl-lease-row:hover td { background:#F8FAFC; }

/* Expiry cell color coding */
.cl-expiry-cell { display:inline-block; padding:1px 6px; border-radius:4px; font-size:11px; font-weight:600; }
.cl-expiry-red { background:#FEE2E2; color:#991B1B; }
.cl-expiry-orange { background:#FFEDD5; color:#9A3412; }
.cl-expiry-yellow { background:#FEF9C3; color:#78350F; }
.cl-expiry-green { background:#DCFCE7; color:#14532D; }

/* Rental Securities — coverage and expiry cells */
.rs-coverage-ok    { display:inline-block; padding:1px 6px; border-radius:4px; font-size:11px; font-weight:600; background:#DCFCE7; color:#14532D; }
.rs-coverage-warn  { display:inline-block; padding:1px 6px; border-radius:4px; font-size:11px; font-weight:600; background:#FEF9C3; color:#78350F; }
.rs-coverage-danger{ display:inline-block; padding:1px 6px; border-radius:4px; font-size:11px; font-weight:600; background:#FEE2E2; color:#991B1B; }
.rs-expiry-ok      { display:inline-block; padding:1px 6px; border-radius:4px; font-size:11px; font-weight:600; background:#DCFCE7; color:#14532D; }
.rs-expiry-warn    { display:inline-block; padding:1px 6px; border-radius:4px; font-size:11px; font-weight:600; background:#FFEDD5; color:#9A3412; }
.rs-expiry-danger  { display:inline-block; padding:1px 6px; border-radius:4px; font-size:11px; font-weight:600; background:#FEE2E2; color:#991B1B; }
.rs-expiry-unlimited { display:inline-block; padding:1px 6px; border-radius:4px; font-size:11px; color:#6B7280; background:#F3F4F6; }
.rs-row-risk td { background:#FFFBEB; }
.rs-row-risk:hover td { background:#FEF3C7; }

/* Rental Securities KPI classes (reuse cl-kpi-card with rs-kpi-* modifiers) */
.rs-kpi-danger { background:#FEF2F2; border-color:#FECACA; }
.rs-kpi-warn   { background:#FFFBEB; border-color:#FDE68A; }

/* Index type badges */
.cl-idx-badge { display:inline-block; font-size:10px; font-weight:600; padding:1px 6px; border-radius:3px; border:1px solid #E5E7EB; background:#F3F4F6; color:#374151; }
.cl-idx-vpi { background:#EDE9FE; border-color:#A78BFA; color:#4C1D95; }
.cl-idx-none-badge { background:#F9FAFB; border-color:#D1D5DB; color:#9CA3AF; }

/* Option chips in table */
.cl-opt-chip { display:inline-block; font-size:9px; font-weight:700; background:#E0E7FF; color:#3730A3; border-radius:3px; padding:1px 4px; margin-left:2px; }

/* Detail panel */
.cl-detail-panel { background:#F8FAFC; border-top:1px solid #E1E4E8; padding:16px; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; }
.cl-detail-section { background:#fff; border:1px solid #E1E4E8; border-radius:6px; padding:12px 14px; }
.cl-detail-section-title { font-size:10px; font-weight:700; color:#6B7280; text-transform:uppercase; letter-spacing:0.5px; margin-bottom:8px; border-bottom:1px solid #F3F4F6; padding-bottom:6px; }
.cl-detail-fields { display:flex; flex-wrap:wrap; gap:8px 20px; }
.cl-detail-field { min-width:130px; }
.cl-detail-field-wide { min-width:100%; }
.cl-detail-label { font-size:10px; font-weight:600; color:#9CA3AF; text-transform:uppercase; letter-spacing:0.4px; display:block; margin-bottom:2px; }
.cl-detail-sub { font-size:10px; font-weight:700; color:#374151; margin:10px 0 6px 0; text-transform:uppercase; letter-spacing:0.3px; }

/* Option cards in detail */
.cl-opt-card { display:flex; align-items:center; gap:8px; padding:5px 8px; background:#F5F3FF; border:1px solid #DDD6FE; border-radius:5px; margin-bottom:4px; flex-wrap:wrap; }
.cl-opt-years { font-size:12px; font-weight:700; color:#4C1D95; }
.cl-opt-deadline { font-size:11px; color:#374151; }
.cl-deadline-warn { color:#92400E; font-weight:600; }
.cl-deadline-urgent { color:#991B1B; font-weight:700; }
.cl-opt-status { font-size:10px; color:#6B7280; background:#F3F4F6; border-radius:3px; padding:1px 5px; }

/* VPI calculation box */
.cl-idx-calc { background:#F0FDF4; border:1px solid #BBF7D0; border-radius:5px; padding:10px 12px; margin-top:8px; }
.cl-idx-calc-row { display:flex; justify-content:space-between; font-size:11px; color:#374151; padding:2px 0; }
.cl-idx-calc-result { font-weight:700; color:#065F46; border-top:1px solid #BBF7D0; margin-top:4px; padding-top:4px; }

/* =============================================================================
   Validation Queue — split-pane with permanent doc viewer on the right
   ============================================================================= */

/* When the validation-queue tab is active, keep documentViewer always open
   and remove its default width animation. */
body.vq-mode .document-viewer          { width: 540px; transition: none; }
body.vq-mode .document-viewer .close-button { visibility: hidden; }

.vq-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    padding: 10px 12px;
    margin-bottom: 12px;
    background: #F8FAFC;
    border: 1px solid #E1E4E8;
    border-radius: 6px;
    font-size: 12px;
}
.vq-toolbar-counts { display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
.vq-count { display:inline-flex; align-items:center; gap:4px; font-weight:600; }
.vq-count-flagged   { color:#E67E22; }
.vq-count-critical  { color:#DC3545; }
.vq-count-needs     { color:#FFA726; }
.vq-count-ai        { color:#28A745; }
.vq-count-human     { color:#0D7A3D; }
.vq-count-dot { width:10px; height:10px; border-radius:50%; display:inline-block; }
.vq-count-dot-flagged  { background:#E67E22; }
.vq-count-dot-critical { background:#DC3545; }
.vq-count-dot-needs    { background:#FFA726; }
.vq-count-dot-ai       { background:#28A745; }
.vq-count-dot-human    { background:#0D7A3D; }
.vq-filter-toggles { display:flex; gap:12px; margin-left:auto; align-items:center; }
.vq-filter-toggles label { display:inline-flex; align-items:center; gap:4px; cursor:pointer; color:#374151; }
.vq-filter-toggles input[type=checkbox] { cursor:pointer; }

.vq-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.vq-table thead th {
    position: sticky; top: 0; z-index: 1;
    background: #F5F7FA;
    text-align: left;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #586069;
    padding: 8px 10px;
    border-bottom: 1px solid #E1E4E8;
}
.vq-table tbody tr.vq-row {
    border-bottom: 1px solid #F1F3F5;
    cursor: pointer;
    transition: background 0.1s;
}
.vq-table tbody tr.vq-row:hover { background: #F8FAFC; }
.vq-table tbody tr.vq-row.active { background: #EFF6FF; box-shadow: inset 3px 0 0 #1B5EBE; }
.vq-table td { padding: 8px 10px; vertical-align: top; }
.vq-td-dot   { width: 22px; padding-right: 0; }
.vq-td-entity { color: #1F2937; font-weight: 600; white-space: nowrap; }
.vq-td-entity-sub { display:block; font-size: 10px; font-weight: 400; color: #9CA3AF; text-transform: none; }
.vq-td-field { color: #4B5563; font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 11px; }
.vq-td-value { color: #111827; word-break: break-word; max-width: 280px; }
.vq-td-conf  { text-align: right; white-space: nowrap; }
.vq-conf-badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 10px;
    letter-spacing: 0.3px;
}
.vq-conf-high { background:#DCFCE7; color:#166534; }
.vq-conf-mid  { background:#FEF3C7; color:#92400E; }
.vq-conf-low  { background:#FEE2E2; color:#991B1B; }
.vq-conf-none { background:#F3F4F6; color:#6B7280; }

.vq-src-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    padding: 3px 8px;
    border: 1px solid #D1D5DB;
    border-radius: 12px;
    background: #fff;
    color: #374151;
    cursor: pointer;
    transition: background 0.1s;
}
.vq-src-chip:hover { background: #F3F4F6; border-color: #9CA3AF; }
.vq-src-chip-multi { background: #F3F4F6; font-weight: 600; }

.vq-src-expanded {
    margin-top: 6px;
    padding: 6px 8px;
    background: #F8FAFC;
    border-left: 2px solid #94A3B8;
    border-radius: 3px;
}
.vq-doc-entry {
    display: block;
    padding: 4px 6px;
    font-size: 11px;
    color: #374151;
    cursor: pointer;
    border-radius: 3px;
}
.vq-doc-entry:hover { background: #E5E7EB; }
.vq-doc-entry-name { font-weight: 600; color: #1F2937; }
.vq-doc-entry-quote { display:block; color: #6B7280; font-style: italic; margin-top: 2px; }

.vq-tier-badge {
    display:inline-block;
    font-size:10px;
    font-weight:700;
    padding:2px 6px;
    border-radius:3px;
    text-transform:uppercase;
    letter-spacing:0.3px;
}
.vq-tier-flagged   { background:#FFEDD5; color:#C2410C; }
.vq-tier-critical  { background:#FEE2E2; color:#991B1B; }
.vq-tier-needs     { background:#FEF3C7; color:#92400E; }
.vq-tier-ai        { background:#DCFCE7; color:#166534; }
.vq-tier-human     { background:#E0F2FE; color:#075985; }

.vq-td-actions { white-space: nowrap; text-align: right; }
.vq-flag-reason {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    color: #C2410C;
    font-style: italic;
}

/* Placeholder state of the always-open doc viewer in vq mode */
body.vq-mode .document-viewer:not(.has-document) .document-viewer-content {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #9CA3AF;
    font-family: inherit;
}

/* =============================================================================
   Dashboard v2
   ========================================================================== */

.dashboard-header {
    margin-bottom: 20px;
}
.dashboard-header h2 {
    margin: 0 0 4px 0;
    font-size: 22px;
    font-weight: 600;
    color: #1F2937;
}
.dashboard-subtitle {
    font-size: 13px;
    color: #6B7280;
    letter-spacing: 0.3px;
}

/* Executive KPI strip */
.exec-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}
.exec-kpi-tile {
    background: #fff;
    border: 1px solid #E5E7EB;
    border-left: 4px solid #1B5EBE;
    border-radius: 8px;
    padding: 14px 16px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.exec-kpi-tile.exec-kpi-good  { border-left-color: #10B981; }
.exec-kpi-tile.exec-kpi-warn  { border-left-color: #F59E0B; }
.exec-kpi-tile.exec-kpi-crit  { border-left-color: #DC2626; }
.exec-kpi-value {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.1;
    color: #111827;
}
.exec-kpi-label {
    font-size: 12px;
    font-weight: 600;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.exec-kpi-sub {
    font-size: 12px;
    color: #6B7280;
    display: flex;
    gap: 6px;
    align-items: center;
    flex-wrap: wrap;
}
.exec-kpi-sub .badge { font-size: 10px; padding: 2px 6px; }

/* Activity panel */
.activity-panel {
    background: #FAFBFC;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    padding: 16px 18px;
    margin-bottom: 24px;
}
.activity-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 12px;
}
.activity-panel-title {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: #1F2937;
}
.activity-panel-meta {
    font-size: 11px;
    color: #9CA3AF;
    letter-spacing: 0.3px;
}
.activity-columns {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
}
.activity-column {
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 6px;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.activity-col-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.activity-col-title {
    font-size: 12px;
    font-weight: 600;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.activity-col-count {
    font-size: 12px;
    font-weight: 600;
    color: #6B7280;
    background: #F3F4F6;
    padding: 1px 8px;
    border-radius: 10px;
}
.activity-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.activity-chip {
    background: #EEF2FF;
    color: #3730A3;
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 4px;
    white-space: nowrap;
}
.activity-chip-accepted   { background: #D1FAE5; color: #065F46; }
.activity-chip-edited     { background: #FEF3C7; color: #92400E; }
.activity-chip-rejected   { background: #FEE2E2; color: #991B1B; }
.activity-chip-flagged    { background: #FEF3C7; color: #92400E; }
.activity-chip-fail       { background: #FEE2E2; color: #991B1B; }
.activity-feed {
    display: flex;
    flex-direction: column;
    gap: 2px;
    max-height: 260px;
    overflow-y: auto;
}
.activity-feed-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 8px;
    border-radius: 4px;
    font-size: 12px;
    gap: 8px;
    border-left: 2px solid transparent;
}
.activity-feed-item:hover { background: #F9FAFB; }
.activity-clickable { cursor: pointer; }
.activity-clickable:hover { background: #EFF6FF; border-left-color: #3B82F6; }
.activity-failed { border-left-color: #DC2626; }
.activity-item-main {
    display: flex;
    gap: 6px;
    align-items: center;
    min-width: 0;
}
.activity-item-action {
    font-weight: 600;
    color: #1F2937;
    font-family: ui-monospace, 'SF Mono', Menlo, monospace;
    font-size: 11px;
}
.activity-item-id {
    color: #6B7280;
    font-size: 11px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.activity-item-time {
    color: #9CA3AF;
    font-size: 11px;
    white-space: nowrap;
    flex-shrink: 0;
}
.activity-empty {
    color: #9CA3AF;
    font-size: 12px;
    text-align: center;
    padding: 14px 0;
    font-style: italic;
}

/* Domain sections */
.domain-section {
    margin-bottom: 28px;
}
.domain-section-title {
    font-size: 13px;
    font-weight: 700;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin: 0 0 10px 0;
    padding-bottom: 6px;
    border-bottom: 1px solid #E5E7EB;
}
.topic-subcards-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 12px;
}

/* Topic sub-card */
.topic-subcard {
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    transition: box-shadow 0.15s, transform 0.15s, border-color 0.15s;
}
.topic-subcard:hover {
    border-color: #1B5EBE;
    box-shadow: 0 2px 8px rgba(27, 94, 190, 0.08);
}
.topic-header {
    font-size: 14px;
    font-weight: 600;
    color: #1F2937;
}
.topic-primary-metric {
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap;
}
.topic-metric-value {
    font-size: 26px;
    font-weight: 700;
    color: #1B5EBE;
    line-height: 1;
}
.topic-metric-label {
    font-size: 12px;
    color: #6B7280;
}
.topic-metric-secondary {
    margin-left: auto;
    font-size: 12px;
    color: #374151;
    font-weight: 500;
}

/* Validation bar */
.topic-validation-bar {
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.topic-val-track {
    display: flex;
    height: 6px;
    border-radius: 3px;
    overflow: hidden;
    background: #F3F4F6;
}
.topic-val-seg { display: block; height: 100%; }
.topic-val-human    { background: #10B981; }
.topic-val-ai       { background: #3B82F6; }
.topic-val-needs    { background: #F59E0B; }
.topic-val-critical { background: #DC2626; }
.topic-val-text {
    font-size: 11px;
    color: #6B7280;
}

/* Criticals pills */
.topic-criticals {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.topic-criticals-empty {
    display: flex;
    gap: 6px;
    align-items: center;
    color: #6B7280;
    font-size: 12px;
    font-style: italic;
}
.critical-pill {
    display: flex;
    gap: 6px;
    align-items: center;
    padding: 5px 8px;
    border-radius: 4px;
    background: #F9FAFB;
    font-size: 12px;
    cursor: pointer;
    transition: background 0.12s;
}
.critical-pill:hover { background: #EFF6FF; }
.severity-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
    display: inline-block;
}
.severity-dot-red    { background: #DC2626; }
.severity-dot-yellow { background: #F59E0B; }
.severity-dot-green  { background: #10B981; }
.critical-text {
    flex: 1;
    color: #1F2937;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.critical-arrow {
    color: #9CA3AF;
    font-size: 12px;
    flex-shrink: 0;
}
.critical-pill:hover .critical-arrow { color: #1B5EBE; }

/* Topic CTA button */
.topic-cta {
    align-self: flex-start;
    background: transparent;
    color: #1B5EBE;
    border: 1px solid #E5E7EB;
    border-radius: 4px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    margin-top: auto;
    transition: background 0.12s, border-color 0.12s;
}
.topic-cta:hover {
    background: #EFF6FF;
    border-color: #1B5EBE;
}

/* Deep-link flash highlight on scroll target */
.dashboard-flash-highlight {
    animation: dashboardFlash 2s ease-out;
}
@keyframes dashboardFlash {
    0%, 20% { background-color: #FEF3C7; box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.5); }
    100%    { background-color: transparent; box-shadow: 0 0 0 0 rgba(251, 191, 36, 0); }
}

/* ============================================================================
   Simple Index Dashboard (Overview tab)
   ============================================================================ */
.asset-hero {
    padding: 24px 28px;
    margin-bottom: 20px;
    background: linear-gradient(135deg, #F8FAFC 0%, #EEF2F7 100%);
    border: 1px solid #E5E7EB;
    border-radius: 10px;
}
.asset-hero-project {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #6B7280;
    margin-bottom: 6px;
}
.asset-hero-title {
    margin: 0 0 4px 0;
    font-size: 26px;
    font-weight: 700;
    color: #111827;
    line-height: 1.25;
}
.asset-hero-address {
    font-size: 15px;
    color: #374151;
    margin-bottom: 16px;
}
.asset-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 24px 32px;
    padding-top: 14px;
    border-top: 1px solid #E5E7EB;
}
.asset-hero-meta-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.asset-hero-meta-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #6B7280;
}
.asset-hero-meta-value {
    font-size: 14px;
    font-weight: 500;
    color: #111827;
}

.index-intro {
    margin-bottom: 24px;
    padding: 14px 18px;
    background: #FFFFFF;
    border-left: 3px solid #3B82F6;
    border-radius: 4px;
}
.index-intro p {
    margin: 0;
    font-size: 14px;
    line-height: 1.55;
    color: #374151;
}

.index-section {
    margin-bottom: 28px;
}
.index-section-panel {
    margin-bottom: 20px;
    padding: 20px 22px 22px;
    background: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-radius: 10px;
}
.index-section-header {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding-bottom: 14px;
    margin-bottom: 16px;
    border-bottom: 1px solid #F1F3F5;
}
.index-section-icon {
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #1B5EBE;
    background: #EFF4FB;
    border-radius: 8px;
}
.index-section-heading {
    flex: 1 1 auto;
    min-width: 0;
}
.index-section-title {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    color: #111827;
    letter-spacing: 0;
    text-transform: none;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.index-section-tag {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: #1B5EBE;
    background: #EFF4FB;
    padding: 2px 8px;
    border-radius: 999px;
}
.index-section-sub {
    margin: 4px 0 0;
    font-size: 13px;
    color: #6B7280;
    line-height: 1.4;
}
.index-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 12px;
}
.index-section-panel .index-card {
    background: #FAFBFC;
    border-color: #EEF0F3;
}
.index-section-panel .index-card:hover {
    background: #FFFFFF;
    border-color: #3B82F6;
}
.index-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px;
    background: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    text-align: left;
    cursor: pointer;
    font: inherit;
    color: inherit;
    transition: border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}
.index-card:hover {
    border-color: #3B82F6;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.12);
    transform: translateY(-1px);
}
.index-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.index-card-title {
    font-size: 15px;
    font-weight: 600;
    color: #111827;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.index-card-icon {
    font-size: 15px;
    color: #6B7280;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #F3F4F6;
    border-radius: 6px;
    transition: color 120ms ease, background 120ms ease;
}
.index-card:hover .index-card-icon {
    color: #3B82F6;
    background: #EFF6FF;
}
.index-card-arrow {
    font-size: 16px;
    color: #9CA3AF;
    transition: transform 120ms ease, color 120ms ease;
}
.index-card:hover .index-card-arrow {
    color: #3B82F6;
    transform: translateX(2px);
}
.index-card-desc {
    font-size: 13px;
    line-height: 1.45;
    color: #4B5563;
    flex: 1;
}
.index-card-count {
    margin-top: 4px;
    padding-top: 10px;
    border-top: 1px dashed #E5E7EB;
    display: flex;
    align-items: baseline;
    gap: 6px;
}
.index-card-count-value {
    font-size: 18px;
    font-weight: 700;
    color: #111827;
    font-variant-numeric: tabular-nums;
}
.index-card-count-unit {
    font-size: 12px;
    color: #6B7280;
}

/* ============================================================
   Pipeline Panel (sidebar)
   ============================================================ */

.pipeline-panel {
    border-top: 1px solid #E5E7EB;
    padding: 12px;
    background: #F9FAFB;
    flex-shrink: 0;
}

.pipeline-panel-header {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #9CA3AF;
    margin-bottom: 8px;
}

.pipeline-run-btn {
    width: 100%;
    padding: 7px 10px;
    background: #2563EB;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    text-align: center;
    transition: background 0.15s;
}
.pipeline-run-btn:hover { background: #1D4ED8; }
.pipeline-run-btn:disabled { background: #93C5FD; cursor: default; }

.pipeline-status-badge {
    font-size: 11px;
    margin-bottom: 6px;
    min-height: 16px;
    border-radius: 4px;
    padding: 2px 6px;
    display: none;
}
.pipeline-status-badge.running {
    display: block;
    background: #FEF3C7;
    color: #92400E;
}
.pipeline-status-badge.done {
    display: block;
    background: #D1FAE5;
    color: #065F46;
}
.pipeline-status-badge.error {
    display: block;
    background: #FEE2E2;
    color: #991B1B;
}

/* ============================================================
   Pipeline Modal
   ============================================================ */

.pipeline-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 9000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pipeline-modal-box {
    background: #fff;
    border-radius: 10px;
    padding: 24px;
    width: 380px;
    max-width: 95vw;
    box-shadow: 0 20px 40px rgba(0,0,0,0.18);
}

.pipeline-modal-title {
    font-size: 16px;
    font-weight: 600;
    color: #111827;
    margin: 0 0 16px;
}

.pipeline-modal-field {
    margin-bottom: 14px;
}
.pipeline-modal-field label {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: #374151;
    margin-bottom: 4px;
}
.pipeline-modal-select {
    width: 100%;
    padding: 7px 10px;
    border: 1px solid #D1D5DB;
    border-radius: 6px;
    font-size: 13px;
    color: #111827;
    background: #fff;
}
.pipeline-modal-checkbox label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: #374151;
    cursor: pointer;
}

.pipeline-modal-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 20px;
}
.pipeline-modal-cancel {
    padding: 7px 16px;
    border: 1px solid #D1D5DB;
    border-radius: 6px;
    background: #fff;
    font-size: 13px;
    cursor: pointer;
    color: #374151;
}
.pipeline-modal-cancel:hover { background: #F9FAFB; }
.pipeline-modal-confirm {
    padding: 7px 16px;
    background: #2563EB;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
}
.pipeline-modal-confirm:hover { background: #1D4ED8; }
.pipeline-modal-confirm:disabled { background: #93C5FD; cursor: default; }

/* ============================================================
   Header right — user info + locale switcher
   ============================================================ */

.header-right {
    display: flex;
    align-items: center;
    gap: 12px;
}

.user-info {
    display: flex;
    align-items: center;
    gap: 8px;
}

.user-email {
    font-size: 13px;
    color: #4B5563;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-role-badge {
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    flex-shrink: 0;
}
.user-role-admin  { background: #EEF2FF; color: #4338CA; }
.user-role-viewer { background: #F0FDF4; color: #166534; }

.logout-btn {
    padding: 4px 10px;
    border: 1px solid #CBD5E1;
    border-radius: 6px;
    background: transparent;
    font-size: 12px;
    cursor: pointer;
    color: #64748B;
    white-space: nowrap;
    flex-shrink: 0;
}
.logout-btn:hover { background: #FEE2E2; border-color: #FCA5A5; color: #B91C1C; }

.header-admin-btn {
    padding: 5px 12px;
    border: 1px solid #C7D2FE;
    border-radius: 6px;
    background: #EEF2FF;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    color: #4338CA;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.15s, border-color 0.15s;
}
.header-admin-btn:hover { background: #E0E7FF; border-color: #A5B4FC; }

/* ============================================================
   Admin Panel
   ============================================================ */

.admin-panel {
    padding: 24px;
    max-width: 960px;
}

.admin-panel-title {
    font-size: 20px;
    font-weight: 700;
    color: #111827;
    margin-bottom: 24px;
}

.admin-section {
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    padding: 20px 24px;
    margin-bottom: 20px;
}

.admin-section h3 {
    font-size: 15px;
    font-weight: 600;
    color: #111827;
    margin-bottom: 16px;
}

.admin-form {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.admin-input {
    padding: 8px 10px;
    border: 1px solid #D1D5DB;
    border-radius: 6px;
    font-size: 13px;
    color: #111827;
    background: #fff;
}
.admin-input:focus {
    outline: none;
    border-color: #2563EB;
    box-shadow: 0 0 0 2px rgba(37,99,235,0.1);
}

.admin-tenants-group {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 4px;
}

.admin-label {
    font-size: 12px;
    font-weight: 500;
    color: #6B7280;
    width: 100%;
    margin-bottom: 2px;
}

.admin-checkbox-label {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    color: #374151;
    cursor: pointer;
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.admin-table th {
    background: #F9FAFB;
    padding: 9px 12px;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    color: #6B7280;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 2px solid #E5E7EB;
}

.admin-table td {
    padding: 12px;
    border-bottom: 1px solid #F3F4F6;
    vertical-align: top;
    color: #374151;
}

.admin-table tr:last-child td { border-bottom: none; }
.admin-table tr:hover td { background: #FAFAFA; }

.admin-msg {
    font-size: 12px;
    padding: 2px 4px;
}
.admin-msg-ok    { color: #166534; }
.admin-msg-error { color: #B91C1C; }

.btn {
    padding: 7px 14px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    white-space: nowrap;
}
.btn-primary   { background: #2563EB; color: #fff; border-color: #2563EB; }
.btn-primary:hover { background: #1D4ED8; }
.btn-secondary { background: #fff; color: #374151; border-color: #D1D5DB; }
.btn-secondary:hover { background: #F9FAFB; }
.btn-danger    { background: #FEF2F2; color: #B91C1C; border-color: #FECACA; }
.btn-danger:hover { background: #FEE2E2; }
.btn-sm { padding: 4px 10px; font-size: 12px; }