/* Financial Report Builder — Tabulator theme overrides matching Corvenia styles */

.tabulator {
    font-family: 'Lato', sans-serif;
    font-size: 13px;
    border: 1px solid #dee2e6;
}

.tabulator .tabulator-header .tabulator-col {
    background: #e5e5e5;
    color: #495057;
    border-right: 1px solid #dee2e6;
    font-weight: 600;
    font-size: 12px;
    text-transform: none;
}

/*
 * Month column headers: Tabulator 6 simple theme does not use flex on .tabulator-col-content
 * (justify-content there had no effect). Alignment is done via headerHozAlign in TabulatorInterop.js.
 * Fallback: right-align the title element Tabulator puts header text in (.tabulator-col-title).
 */
.tabulator .tabulator-header .tabulator-col.frb-tabulator-month-col .tabulator-col-title,
.tabulator .tabulator-header .tabulator-col[tabulator-field^="values.month_"] .tabulator-col-title {
    text-align: right;
}

.tabulator-row {
    border-bottom: 1px solid #dee2e6;
}

.tabulator-row:hover {
    background: #f8f9fa !important;
}

.tabulator .frb-account-drilldown {
    color: var(--mud-palette-primary, #594ae2);
    cursor: pointer;
    text-decoration: none;
}

.tabulator .frb-account-drilldown:hover {
    text-decoration: underline;
}

.tabulator-row.tabulator-section-row {
    background: #F3F6F6 !important;
}
.tabulator-row.tabulator-section-row .tabulator-cell {
    font-weight: 700;
    color: #495057;
}

.tabulator-row.tabulator-subtotal-row {
    background: #eaefef !important;
    border-top: 2px solid #c9c9c9;
}
.tabulator-row.tabulator-subtotal-row .tabulator-cell {
    font-weight: 700;
    color: #495057;
}

.tabulator-row.tabulator-total-row {
    background: #DDE6E6 !important;
    border-top: 2px solid #aaa;
}
/* .tabulator-row.tabulator-total-row .tabulator-cell:first-child {
    border-left: 3px solid #009688;
} */
.tabulator-row.tabulator-total-row .tabulator-cell {
    font-weight: 700;
    color: #495057;
}

/*
 * Formula rows with presentation = Standard: render like a body detail row (no fill, no bold).
 * No background/font-weight rules needed — the absence of subtotal/total classes already does that.
 * Declared as an empty rule for discoverability + forward-compat.
 */
.tabulator-row.tabulator-formula-plain-row {
    /* intentionally empty — styling is "plain" body row */
}

.tabulator-row.tabulator-formula-plain-bold .tabulator-cell {
    font-weight: 700;
}

/*
 * Italic formula rows (FormulaItalic = true). Orthogonal to the presentation class so it
 * composes cleanly with Subtotal / GrandTotal / FormulaPlain rows.
 * Intentionally only sets font-style so it does not override fills or font-weight.
 */
.tabulator-row.tabulator-formula-italic .tabulator-cell {
    font-style: italic;
}

/* Spacer rows: visible vertical gap (layout-only; not a thin glitch line). */
.tabulator-row.tabulator-spacer-row {
    height: auto !important;
    min-height: 28px !important;
}
.tabulator-row.tabulator-spacer-row .tabulator-cell {
    padding: 10px 4px;
    border: none;
    vertical-align: middle;
}

/* Frozen bottom row (grand total via bottomCalc) */
.tabulator .tabulator-calcs-bottom {
    background: #DDE6E6 !important;
    border-top: 2px solid #aaa;
}
.tabulator .tabulator-calcs-bottom .tabulator-row .tabulator-cell {
    font-weight: 700;
    color: #495057;
}
.tabulator .tabulator-calcs-bottom .tabulator-row .tabulator-cell:first-child {
    border-left: 3px solid #c62828;
}
.tabulator .tabulator-calcs-bottom .tabulator-row {
    background: #DDE6E6 !important;
    border-top: 2px solid #c62828;
}

/* Ensure Tabulator fills its wrapper */
.tabulator-container {
    flex: 1 1 0;
    min-height: 0;
}

/* Number cells right-aligned */
.tabulator .tabulator-cell.tabulator-number-cell {
    text-align: right;
}

/* Frozen label column */
.tabulator .tabulator-frozen.tabulator-frozen-left {
    border-right: 2px solid #dee2e6;
}

/* Report Builder hub page header (parity with ExchangeRates.razor / Corvenia tools) */
.report-builder-page .report-builder-page-header {
    padding-bottom: 7px;
    margin-bottom: 0.75rem;
    position: relative;
}

.report-builder-page .report-builder-page-header::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    right: 0;
    height: 1px;
    background-color: #E4E4E7;
    width: 100vw;
    margin-left: -50vw;
}

.report-builder-page .report-builder-page-header h5 {
    color: #1f2937;
    font-weight: 600;
}

.report-builder-page .report-builder-page-header .text-muted {
    color: var(--mud-palette-text-secondary);
    font-size: 0.875rem;
}

/* Keep notification + AI chat (HeaderActions) visible next to page controls */
.report-builder-page .report-builder-header-toolbar {
    flex-shrink: 0;
}

.report-builder-page .report-builder-header-actions {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.report-builder-page .report-builder-header-actions .header-actions {
    margin-left: 0;
}

/* Standard report horizontal cards */
.report-builder-page .standard-reports-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    width: 100%;
}

.report-builder-page .standard-report-card {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    background: #fff;
    border: 1px solid #e4e4e7;
    border-radius: 8px;
    transition: box-shadow 0.15s ease;
    min-width: 0;
}

@media (max-width: 900px) {
    .report-builder-page .standard-reports-list {
        grid-template-columns: 1fr;
    }
}

.report-builder-page .standard-report-card:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.report-builder-page .standard-report-card__icon {
    flex-shrink: 0;
}

.report-builder-page .standard-report-card__title {
    flex: 1;
    min-width: 0;
    font-weight: 600;
    margin: 0;
}

.report-builder-page .standard-report-card__action {
    flex-shrink: 0;
}

/* Report builder page layout */
.report-builder-page .report-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
    margin-top: 0;
}

.report-builder-page .report-card-grid-fixed {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-top: 0;
}

@media (max-width: 900px) {
    .report-builder-page .report-card-grid-fixed {
        grid-template-columns: 1fr;
    }
}

.report-builder-page .report-card {
    border-radius: 8px;
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.report-builder-page .report-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    transform: translateY(-1px);
}

.report-builder-page .report-card .mud-card-header {
    padding: 12px 16px 4px;
}

.report-builder-page .report-card .mud-card-content {
    padding: 10px;
}

.report-builder-page .report-card .mud-card-actions {
    padding: 0px 4px 8px 8px;
    justify-content: end;
}

.report-builder-page .custom-reports-grid .mud-table-body .mud-table-row > td:not(.custom-report-actions-cell):not(.custom-report-status-cell) {
    position: relative;
}

.report-builder-page .custom-reports-grid .mud-table-body .mud-table-row > td:not(.custom-report-actions-cell):not(.custom-report-status-cell):hover::after {
    content: "View report";
    position: absolute;
    left: 12px;
    bottom: -28px;
    z-index: 10;
    padding: 4px 8px;
    border-radius: 4px;
    background: rgba(33, 33, 33, 0.92);
    color: #fff;
    font-size: 0.75rem;
    line-height: 1.2;
    white-space: nowrap;
    pointer-events: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
}

.report-viewer-container {
    height: 100%;
    max-height: calc(100vh - 2rem);
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.report-viewer-container .report-viewer-page-header {
    padding-bottom: 7px;
    margin-bottom: 0.75rem;
    position: relative;
}

.report-viewer-container .report-viewer-page-header::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    right: 0;
    height: 1px;
    background-color: #E4E4E7;
    width: 100vw;
    margin-left: -50vw;
}

.report-viewer-container .report-viewer-page-header h5 {
    margin: 0;
    color: #1f2937;
    font-weight: 600;
}

.report-viewer-container .report-viewer-page-title {
    min-width: 0;
}

.report-viewer-container .report-viewer-page-subtitle {
    font-size: 0.75rem;
    color: #6b7280;
    font-style: italic;
    margin-bottom: 4px;
}

.report-viewer-container .tabulator-wrapper {
    flex: 1 1 0;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    /* padding: 0 16px 16px 16px; */
}

/* Adjusted column highlight: match financial Mud reports and only highlight changed values. */
.report-viewer-container .tabulator .tabulator-cell.adjusted-diff {
    background-color: #DDE6E6 !important;
    border-left: 3px solid var(--primary) !important;
    border-bottom: 1px solid #d4d2d2 !important;
}

/*
 * Compare Period block — trailing Compare/Δ/Δ% column group emitted by CustomReportEngine when the
 * compare-period filter is on. Compare cells get a subtle background tint so the eye can group them
 * away from the primary Current column block; delta cells additionally pick up sign-based coloring.
 */
.tabulator .tabulator-header .tabulator-col.frb-tabulator-compare-group .tabulator-col-title,
.tabulator .tabulator-header .tabulator-col.frb-tabulator-compare-col .tabulator-col-title,
.tabulator .tabulator-header .tabulator-col.frb-tabulator-actual-col .tabulator-col-title,
.tabulator .tabulator-header .tabulator-col.frb-tabulator-budget-col .tabulator-col-title,
.tabulator .tabulator-header .tabulator-col.frb-tabulator-delta-col .tabulator-col-title,
.tabulator .tabulator-header .tabulator-col.frb-tabulator-delta-pct-col .tabulator-col-title {
    text-align: right;
}

.tabulator .tabulator-cell.frb-tabulator-actual-col {
    background-color: #F4FAFF;
}

.tabulator .tabulator-cell.frb-tabulator-compare-col {
    background-color: #FAF8F4;
    color: #5a5a5a;
}

.tabulator .tabulator-cell.frb-tabulator-budget-col {
    background-color: #FFF8EF;
    color: #5a5a5a;
}

.tabulator .tabulator-cell.frb-tabulator-delta-col,
.tabulator .tabulator-cell.frb-tabulator-delta-pct-col {
    background-color: #FDFCF8;
    font-variant-numeric: tabular-nums;
}

/* Sign-based coloring (mirrors Monitor card chips: positive green, negative red, zero muted). */
.tabulator .tabulator-cell.frb-delta-positive {
    color: #1e7e34;
}

.tabulator .tabulator-cell.frb-delta-negative {
    color: #b22222;
}

.tabulator .tabulator-cell.frb-delta-zero {
    color: #909090;
}

/* Budget compare cells: keep the amount black; only the variance % badge is colored. */
.tabulator .tabulator-cell .budget-cell-amount {
    color: #212121;
}

/* Compare layout toggle (sits below the ReportsFilter when compare is on). */
.compare-layout-toggle {
    border-radius: 4px;
}

.report-viewer-footer {
    padding: 12px 24px;
    font-size: 11px;
    color: #9e9e9e;
    border-top: 1px solid #e0e0e0;
    background: #fff;
}

/* AccountPalette (row editor): don’t stretch MudTabs — avoids empty gap above tab bar */
.account-palette-root .mud-tabs {
    flex: 0 1 auto;
    min-height: 0;
}

.account-palette-root .mud-tabs-panels {
    flex: 0 1 auto !important;
    min-height: 0 !important;
}

.account-palette-tab-panel {
    overflow-y: visible;
}

/*
 * Report Builder viewers: relax outer flex/vh clipping for print only.
 * Do NOT override .tabulator internals with !important — that breaks Tabulator's printAsHtml swap (blank pages).
 */
@media print {
    .report-viewer-container {
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
        height: auto !important;
        max-height: none !important;
        min-height: 0 !important;
        overflow: visible !important;
        display: block !important;
    }

    .report-viewer-container .tabulator-wrapper {
        flex: none !important;
        min-height: 0 !important;
        overflow: visible !important;
        height: auto !important;
        max-height: none !important;
        display: block !important;
    }

    .report-viewer-container .tabulator-container {
        flex: none !important;
        min-height: 0 !important;
        overflow: visible !important;
        height: auto !important;
    }

    /* Toolbar: Expand / Export / Print (class already on markup; was only wired in reports-print.css for Mud report pages). */
    .report-viewer-container .report-print-hide {
        display: none !important;
    }

    /* ReportsFilter title row: Generate / Clear (when shown). */
    .report-viewer-container .action-buttons-wrapper {
        display: none !important;
    }

    /* Plain HTML table Tabulator injects when printAsHtml runs (do not fight Tabulator’s own print CSS). */
    .report-viewer-container table.tabulator-print-table {
        width: 100% !important;
        border-collapse: collapse;
    }
}

/* --- Report Editor: resizable layout + settings drawer (splitters: MasterCoAEditorLayout.js) --- */

.report-editor-root,
.template-editor-root {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 64px);
    overflow: hidden;
}

.report-editor-root .coa-body,
.template-editor-root .coa-body {
    display: flex;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.report-editor-body-with-drawer {
    display: flex;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.report-editor-body-with-drawer > .coa-body {
    flex: 1;
    min-width: 0;
}

.report-editor-root .coa-panel,
.template-editor-root .coa-panel {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.report-editor-root .coa-panel-left,
.template-editor-root .coa-panel-left {
    flex-shrink: 0;
    min-width: 200px;
    border-right: none;
    background: #fafafa;
}

.report-editor-root .coa-panel-center,
.template-editor-root .coa-panel-center {
    flex: 1;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: #fff;
}

.report-editor-root .coa-panel-right,
.template-editor-root .coa-panel-right {
    flex-shrink: 0;
    min-width: 200px;
    min-height: 0;
    border-left: none;
    background: #fafafa;
    overflow: hidden;
}

.report-editor-splitter-right-stub {
    flex-shrink: 0;
    min-width: 0 !important;
    width: 36px !important;
    flex-basis: 36px !important;
    overflow: hidden;
    visibility: hidden;
    padding: 0;
    border: none;
}

.report-editor-splitter-right-grip--hidden {
    display: none;
}

.report-editor-root .coa-resizer,
.template-editor-root .coa-resizer {
    flex-shrink: 0;
    width: 6px;
    cursor: col-resize;
    touch-action: none;
    user-select: none;
    background: #e2e8f0;
    align-self: stretch;
}

.report-editor-root .coa-resizer:hover,
.template-editor-root .coa-resizer:hover {
    background: #cbd5e1;
}

.report-editor-root .coa-body-dragging,
.template-editor-root .coa-body-dragging {
    cursor: col-resize;
    user-select: none;
}

.report-editor-root .coa-body-dragging .coa-resizer,
.template-editor-root .coa-body-dragging .coa-resizer {
    background: #94a3b8;
}

.report-editor-root .coa-panel-scroll,
.template-editor-root .coa-panel-scroll {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 16px;
}

.report-editor-center-column {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.report-editor-rows-pane {
    flex: 1;
    min-height: 0;
    overflow: auto;
    padding: 16px;
}

.report-editor-preview-pane {
    display: flex;
    flex-direction: column;
    flex: 0 0 42%;
    min-height: 180px;
    border-top: 2px solid var(--mud-palette-primary, #1976d2);
    overflow: hidden;
}

.report-editor-preview-toolbar {
    background: #e3f2fd;
    flex-shrink: 0;
}

.report-editor-preview-content {
    flex: 1;
    min-height: 0;
    overflow: auto;
}

/* Settings drawer (PBI-style collapsed rail) */
.report-editor-settings-drawer {
    flex-shrink: 0;
    display: flex;
    height: 100%;
    border-left: 1px solid #d0d0d0;
    background: #f5f5f5;
    transition: width 0.2s ease;
}

.report-editor-settings-rail {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    width: 36px;
    min-width: 36px;
    height: 100%;
    padding: 8px 4px;
    border: none;
    background: #f5f5f5;
    cursor: pointer;
    color: #5c5c5c;
}

.report-editor-settings-rail:hover {
    background: #ebebeb;
}

.report-editor-settings-rail-chevron {
    opacity: 0.6;
}

.report-editor-settings-rail-label {
    writing-mode: vertical-lr;
    /* transform: rotate(180deg); */
    font-size: 0.8rem;
    /* font-weight: 600; */
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.report-editor-settings-panel {
    display: flex;
    flex-direction: column;
    width: 320px;
    min-width: 280px;
    max-width: 360px;
    height: 100%;
    background: #fafafa;
    animation: report-editor-settings-slide-in 0.2s ease;
}

@keyframes report-editor-settings-slide-in {
    from {
        opacity: 0;
        transform: translateX(12px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.report-editor-settings-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 12px 8px 16px;
    border-bottom: 1px solid #e0e0e0;
    flex-shrink: 0;
}

.report-editor-settings-panel-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 16px;
}

@media (max-width: 960px) {
    .report-editor-root .coa-body,
    .template-editor-root .coa-body {
        flex-direction: column;
    }

    .report-editor-root .coa-resizer,
    .template-editor-root .coa-resizer {
        display: none;
    }

    .report-editor-root .coa-panel-left,
    .report-editor-root .coa-panel-center,
    .report-editor-root .coa-panel-right,
    .template-editor-root .coa-panel-left,
    .template-editor-root .coa-panel-center,
    .template-editor-root .coa-panel-right {
        width: 100% !important;
        min-width: 0 !important;
        border-right: none;
        border-left: none;
    }

    .report-editor-root .coa-panel-left,
    .template-editor-root .coa-panel-left {
        max-height: 40vh;
        border-bottom: 1px solid #e2e8f0;
    }

    .report-editor-root .coa-panel-right,
    .template-editor-root .coa-panel-right {
        max-height: 35vh;
        border-top: 1px solid #e2e8f0;
    }

    .report-editor-root,
    .template-editor-root {
        height: auto;
        min-height: calc(100vh - 64px);
    }

    .report-editor-body-with-drawer {
        flex-direction: column;
    }

    .report-editor-settings-drawer {
        border-left: none;
        border-top: 1px solid #d0d0d0;
        height: auto;
    }

    .report-editor-settings-panel {
        width: 100%;
        max-width: none;
    }
}

/* Legacy alias block removed — rules merged above */

/* My Templates DataGrid - Match UserAdmin table header styling */
.report-builder-page .mud-table-head {
    background-color: #f8f9fa;
}

.report-builder-page .mud-table-head .mud-table-cell {
    font-weight: 600;
    font-size: 0.875rem;
    color: #495057;
    padding: 12px 16px;
    border-bottom: 2px solid #dee2e6;
}

.report-builder-page .mud-table-row {
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.report-builder-page .mud-table-row:hover {
    background-color: #f8f9fa;
}

/*
 * Editor-only hint that an AccountRange row is nested under another range. The left border provides a subtle
 * tree-branch cue alongside the left-margin indent set inline by the canvas. Applied only in the editor's
 * row canvas, never in the rendered report grid.
 */
.row-canvas-row-wrap.row-canvas-nested-range .row-canvas-item {
    border-left: 3px solid #bbdefb;
}

.row-canvas-row-wrap.row-canvas-nested-range .row-canvas-item.expanded {
    border-left-color: #64b5f6;
}

/* Reorder Financial Reports menu dialog */
.reorder-financial-reports-dialog .reorder-menu-table {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-width: 100%;
}

.reorder-financial-reports-dialog .reorder-menu-table__header,
.reorder-financial-reports-dialog .reorder-menu-row {
    display: grid;
    grid-template-columns: 36px minmax(160px, 1.2fr) minmax(200px, 2fr) 160px;
    align-items: center;
    gap: 12px;
    padding: 10px 8px;
}

.reorder-financial-reports-dialog .reorder-menu-table__header {
    font-size: 0.8rem;
    font-weight: 600;
    /* text-transform: uppercase; */
    letter-spacing: 0.04em;
    color: #6b7280;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 8px;
    margin-bottom: 4px;
}

.reorder-financial-reports-dialog .reorder-menu-row {
    border-bottom: 1px solid #f3f4f6;
    transition: background-color 0.15s ease;
}

.reorder-financial-reports-dialog .reorder-menu-row:hover {
    background-color: #f9fafb;
}

.reorder-financial-reports-dialog .reorder-menu-row--drag-over {
    background-color: #ecfdf5;
}

.reorder-financial-reports-dialog .reorder-menu-drag-handle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: grab;
    color: #9ca3af;
    padding: 4px;
}

.reorder-financial-reports-dialog .reorder-menu-drag-handle:active {
    cursor: grabbing;
}

.reorder-financial-reports-dialog .reorder-menu-row-icon {
    font-size: 1.1rem;
    color: var(--mud-palette-primary);
    flex-shrink: 0;
}

.reorder-financial-reports-dialog .reorder-menu-desc {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.35;
}

@media (max-width: 768px) {
    .reorder-financial-reports-dialog .reorder-menu-table__header {
        display: none;
    }

    .reorder-financial-reports-dialog .reorder-menu-row {
        grid-template-columns: 36px 1fr;
        grid-template-rows: auto auto auto;
    }

    .reorder-financial-reports-dialog .reorder-menu-table__desc-col,
    .reorder-financial-reports-dialog .reorder-menu-table__toggle-col {
        grid-column: 2;
    }
}
