/* ClearTrip Air Recon — Pulse Brand CSS v4 (Polished) */
:root {
  --ct-primary: #1a1a2e; --ct-accent: #e74c3c; --ct-green: #22c55e;
  --ct-orange: #f59e0b; --ct-red: #ef4444; --ct-blue: #3b82f6;
  --ct-purple: #8b5cf6; --ct-teal: #14b8a6; --ct-pink: #ec4899;
  --ct-gray: #6b7280; --ct-light: #f9fafb; --ct-border: #e5e7eb;
  --ct-border-light: #f0f0f0;
  --ct-font: 'DM Sans', -apple-system, sans-serif;
  --ct-sidebar-w: 200px;
}
html { scroll-behavior: smooth; }
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: var(--ct-font); background: #fff; color: #1a1a2e; font-size: 14px; }

/* ── Sidebar ── */
.ct-sidebar { position: fixed; top: 64px; left: 0; bottom: 0; width: var(--ct-sidebar-w); background: #fff; border-right: 1px solid var(--ct-border); z-index: 200; display: flex; flex-direction: column; overflow-y: auto; transition: width .2s ease; }
.ct-sidebar-logo { padding: 14px 16px; display: flex; align-items: center; }
.ct-sidebar-logo .ct-logo { height: 26px; width: auto; }
.ct-sidebar-divider { height: 1px; background: var(--ct-border); margin: 0 12px; }
.ct-sidebar-section { padding: 12px 0; }
.ct-sidebar-heading { padding: 8px 16px; font-size: 12px; font-weight: 600; color: var(--ct-gray); text-transform: uppercase; letter-spacing: .5px; display: flex; align-items: center; justify-content: space-between; }
.ct-sidebar-chevron { font-size: 10px; }
.ct-sidebar-item { display: flex; align-items: center; gap: 10px; padding: 10px 16px 10px 20px; font-size: 14px; font-weight: 500; color: var(--ct-gray); text-decoration: none; cursor: pointer; border-left: 3px solid transparent; transition: all .2s ease; white-space: nowrap; overflow: hidden; }
.ct-sidebar-item:hover { background: var(--ct-light); color: var(--ct-primary); }
.ct-sidebar-item.active { color: #16a34a; font-weight: 600; border-left-color: #16a34a; background: #f0fdf4; }
.ct-sb-icon { flex-shrink: 0; width: 16px; height: 16px; }
.ct-sb-text { transition: opacity .2s ease; }

/* Sidebar collapsed state */
.ct-sidebar.collapsed { width: 56px; }
.ct-sidebar.collapsed .ct-sb-text { opacity: 0; width: 0; overflow: hidden; }
.ct-sidebar.collapsed .ct-sidebar-heading { justify-content: center; padding: 8px; }
.ct-sidebar.collapsed .ct-sidebar-chevron { display: none; }
.ct-sidebar.collapsed .ct-sidebar-item { padding: 10px 0; justify-content: center; border-left-width: 0; }
.ct-sidebar.collapsed .ct-sidebar-divider { margin: 0 8px; }
.ct-sidebar.collapsed .ct-sidebar-version { justify-content: center; padding: 10px 0; }

/* Sidebar version */
.ct-sidebar-version { margin-top: auto; padding: 12px 16px; font-size: 11px; font-weight: 500; color: #8b919a; font-family: 'DM Mono', monospace; letter-spacing: .3px; border-top: 1px solid var(--ct-border); display: flex; flex-direction: column; gap: 4px; white-space: nowrap; }
.ct-ver-tag { display: inline-block; width: 16px; text-align: center; font-size: 10px; font-weight: 700; border-radius: 3px; padding: 1px 0; letter-spacing: 0; margin-right: 4px; }
.ct-ver-app { background: #e0e7ff; color: #4338ca; }
.ct-ver-data { background: #dcfce7; color: #166534; }

/* Sidebar toggle button in header */
.ct-sidebar-toggle { background: none; border: none; font-size: 18px; color: var(--ct-gray); cursor: pointer; padding: 4px 8px; border-radius: 4px; transition: .15s; line-height: 1; }
.ct-sidebar-toggle:hover { background: var(--ct-light); color: var(--ct-primary); }

/* Offset content when sidebar is collapsed */
.ct-sidebar-collapsed .ct-subnav { left: 56px; }
.ct-sidebar-collapsed .ct-main { margin-left: 56px; }

/* ── Header (top bar, full-width) ── */
.ct-header { display: flex; align-items: center; justify-content: space-between; background: #fff; padding: 0 24px; height: 64px; border-bottom: 1px solid var(--ct-border); position: fixed; top: 0; left: 0; right: 0; z-index: 201; box-shadow: 0 1px 3px rgba(0,0,0,0.06); }
.ct-header-left { display: flex; align-items: center; gap: 12px; }
.ct-header-logo-link { display: flex; align-items: center; }
.ct-header-logo { height: 36px; width: auto; }
.ct-header-divider { width: 1px; height: 20px; background: var(--ct-border); margin: 0 8px; }
.ct-title { font-family: 'Space Grotesk', 'DM Sans', sans-serif; font-weight: 700; font-size: 18px; color: var(--ct-primary); letter-spacing: -0.04em; }
.ct-header-partner { display: flex; align-items: center; gap: 10px; padding-left: 16px; position: relative; margin-left: 16px; }
.ct-header-partner::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 20px; background: var(--ct-border); }
.ct-header-for { font-size: 13px; font-weight: 500; color: var(--ct-gray); }
.ct-partner-logo { height: 72px; width: auto; object-fit: contain; mix-blend-mode: multiply; }
.ct-header-right { display: flex; align-items: center; gap: 8px; }
.ct-header-sections { display: flex; align-items: center; background: #f3f4f6; border-radius: 8px; padding: 4px; gap: 2px; position: relative; }
.ct-tab-pill { position: absolute; top: 4px; bottom: 4px; background: #fff; border: 1.5px solid #374151; border-radius: 6px; box-shadow: 0 1px 2px rgba(0,0,0,0.06); transition: left 0.3s cubic-bezier(0.4,0,0.2,1), width 0.3s cubic-bezier(0.4,0,0.2,1); z-index: 0; pointer-events: none; }
.ct-header-tab { padding: 6px 18px; font-size: 13px; font-weight: 500; color: #9ca3af; text-decoration: none; background: transparent; border: 1.5px solid transparent; border-radius: 6px; cursor: pointer; transition: color .2s ease; white-space: nowrap; position: relative; z-index: 1; }
.ct-header-tab.active { color: #1e293b; font-weight: 600; border-color: transparent; box-shadow: none; background: transparent; }
.ct-header-tab:hover { color: #374151; }
.ct-date-label { font-size: 12px; color: var(--ct-gray); font-weight: 500; padding: 6px 14px; background: var(--ct-light); border-radius: 6px; white-space: nowrap; }

/* ── Sub-nav (primary top row) ── */
.ct-subnav { display: flex; align-items: center; justify-content: space-between; padding: 0 24px; background: #fff; border-bottom: 1px solid var(--ct-border-light); position: fixed; top: 64px; left: var(--ct-sidebar-w); right: 0; z-index: 200; }
.ct-subnav-tabs { display: flex; gap: 0; }
.ct-subnav-tabs a { text-decoration: none; padding: 14px 20px; font-size: 14px; font-weight: 500; color: var(--ct-gray); border-bottom: 3px solid transparent; transition: all .2s ease; white-space: nowrap; }
.ct-subnav-tabs a:hover { color: var(--ct-primary); background: var(--ct-light); }
.ct-subnav-tabs a.active { color: var(--ct-primary); border-bottom-color: var(--ct-primary); font-weight: 600; }
.ct-subnav-search { display: flex; align-items: center; }
.ct-subnav-search .ct-search { border-radius: 20px; padding: 7px 14px 7px 34px; font-size: 13px; border: 1px solid var(--ct-border); background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%239ca3af' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cpath d='m11 11 3 3'/%3E%3C/svg%3E") 10px center no-repeat; width: 260px; }

/* ── Main content ── */
.ct-main { margin-left: var(--ct-sidebar-w); padding: 20px 24px; padding-top: 132px; display: flex; flex-direction: column; height: 100vh; box-sizing: border-box; }

/* ── Filters ── */
.ct-filters { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.ct-filter-label { font-size: 13px; font-weight: 500; color: var(--ct-gray); }
.ct-select { padding: 6px 12px; border: 1px solid var(--ct-border); border-radius: 6px; font-size: 13px; background: #fff; cursor: pointer; }
.ct-filter-export { margin-left: auto; }
.ct-search { padding: 8px 12px; border: 1px solid var(--ct-border); border-radius: 6px; font-size: 13px; width: 240px; }
.ct-date-input { padding: 6px 10px; border: 1px solid var(--ct-border); border-radius: 6px; font-size: 12px; }
.ct-btn { padding: 8px 16px; border: 1px solid var(--ct-border); border-radius: 6px; background: #fff; cursor: pointer; font-size: 13px; font-weight: 500; transition: .15s; }
.ct-btn:hover { background: var(--ct-light); }
.ct-btn-export { display: flex; align-items: center; gap: 4px; }
.ct-export-dropdown { position: relative; display: inline-block; }
.ct-export-menu { display: none; position: absolute; top: calc(100% + 4px); right: 0; background: #fff; border: 1px solid var(--ct-border); border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,0.12), 0 2px 6px rgba(0,0,0,0.06); min-width: 210px; z-index: 500; padding: 6px 0; }
.ct-export-menu.open { display: block; }
.ct-export-menu-item { padding: 10px 16px; font-size: 13px; font-weight: 400; color: #374151; cursor: pointer; transition: background .12s; }
.ct-export-menu-item:hover { background: var(--ct-light); }
.ct-filter-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border: 1px solid var(--ct-border); border-radius: 20px; font-size: 13px; font-weight: 500; color: var(--ct-gray); background: #fff; cursor: pointer; }
.ct-filter-chip svg { width: 14px; height: 14px; }

/* ── KPI Cards ── */
.ct-kpi-row { display: flex; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; }
.ct-kpi { border: 1px solid var(--ct-border); border-radius: 8px; padding: 10px 14px; background: #fff; min-width: 120px; flex: 1; cursor: pointer; transition: all .2s ease; border-top: 3px solid var(--ct-border); border-left: none; position: relative; }
.ct-kpi:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.08); transform: translateY(-2px); }
.ct-kpi:active { transform: translateY(0); box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
.ct-kpi.active { box-shadow: 0 0 0 2px rgba(26,26,46,0.12), 0 2px 8px rgba(0,0,0,0.06); }
.ct-kpi-label { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; margin-bottom: 2px; }
.ct-kpi-value { font-size: 16px; font-weight: 700; color: var(--ct-primary); line-height: 1.2; }
.ct-kpi-sub { font-size: 12px; color: var(--ct-gray); margin-top: 1px; }
.ct-kpi-pct { font-size: 12px; color: var(--ct-gray); font-weight: 400; }
.ct-kpi-trips { font-size: 11px; color: var(--ct-gray); margin-top: 2px; }
.ct-kpi-count { font-size: 11px; color: var(--ct-gray); margin-top: 1px; }

/* KPI colored top borders + tinted backgrounds */
.ct-kpi--all { border-top-color: var(--ct-blue); background: #f0f7ff; border-color: #dbeafe; border-top-color: var(--ct-blue); }
.ct-kpi--all .ct-kpi-label { color: var(--ct-blue); }
.ct-kpi--matched { border-top-color: var(--ct-green); background: #f0fdf4; border-color: #dcfce7; border-top-color: var(--ct-green); }
.ct-kpi--matched .ct-kpi-label { color: var(--ct-green); }
.ct-kpi--mismatched { border-top-color: var(--ct-red); background: #fffbeb; border-color: #fef3c7; border-top-color: var(--ct-orange); }
.ct-kpi--mismatched .ct-kpi-label { color: var(--ct-red); }
.ct-kpi--missing { border-top-color: var(--ct-orange); background: #fef2f2; border-color: #fecaca; border-top-color: var(--ct-red); }
.ct-kpi--missing .ct-kpi-label { color: var(--ct-orange); }
.ct-kpi--missing-bos { border-top-color: var(--ct-red); background: #fef2f2; border-color: #fecaca; border-top-color: var(--ct-red); }
.ct-kpi--missing-bos .ct-kpi-label { color: var(--ct-red); }
.ct-kpi--missing-airline { border-top-color: var(--ct-orange); background: #fff7ed; border-color: #fed7aa; border-top-color: var(--ct-orange); }
.ct-kpi--missing-airline .ct-kpi-label { color: var(--ct-orange); }
.ct-kpi--missing-pg { border-top-color: #4f46e5; background: #eef2ff; border-color: #c7d2fe; }
.ct-kpi--missing-pg .ct-kpi-label { color: #4f46e5; }
.ct-kpi--income { border-top-color: var(--ct-red); background: #fef2f2; border-color: #fecaca; border-top-color: var(--ct-red); }
.ct-kpi--income .ct-kpi-label { color: var(--ct-red); }
.ct-kpi--convfee { border-top-color: var(--ct-blue); background: #f0f7ff; border-color: #dbeafe; border-top-color: var(--ct-blue); }
.ct-kpi--convfee .ct-kpi-label { color: var(--ct-blue); }
.ct-kpi--markup { border-top-color: var(--ct-purple); background: #f5f3ff; border-color: #e9d5ff; border-top-color: var(--ct-purple); }
.ct-kpi--markup .ct-kpi-label { color: var(--ct-purple); }
.ct-kpi--cashback { border-top-color: var(--ct-teal); background: #f0fdfa; border-color: #ccfbf1; border-top-color: var(--ct-teal); }
.ct-kpi--cashback .ct-kpi-label { color: var(--ct-teal); }
.ct-kpi--discount { border-top-color: var(--ct-pink); background: #fdf2f8; border-color: #fce7f3; border-top-color: var(--ct-pink); }
.ct-kpi--discount .ct-kpi-label { color: var(--ct-pink); }
.ct-kpi--gst { border-top-color: var(--ct-orange); background: #fffbeb; border-color: #fef3c7; border-top-color: var(--ct-orange); }
.ct-kpi--gst .ct-kpi-label { color: var(--ct-orange); }
.ct-kpi--basefare { border-top-color: #8b5cf6; background: #f5f3ff; border-color: #e9d5ff; border-top-color: #8b5cf6; }
.ct-kpi--basefare .ct-kpi-label { color: #8b5cf6; }
.ct-kpi--yq { border-top-color: #6366f1; background: #eef2ff; border-color: #e0e7ff; border-top-color: #6366f1; }
.ct-kpi--yq .ct-kpi-label { color: #6366f1; }
.ct-kpi--congestion { border-top-color: #0ea5e9; background: #f0f9ff; border-color: #bae6fd; border-top-color: #0ea5e9; }
.ct-kpi--congestion .ct-kpi-label { color: #0ea5e9; }
.ct-kpi--psf { border-top-color: #14b8a6; background: #f0fdfa; border-color: #ccfbf1; border-top-color: #14b8a6; }
.ct-kpi--psf .ct-kpi-label { color: #14b8a6; }
.ct-kpi--suppcanc { border-top-color: #ef4444; background: #fef2f2; border-color: #fecaca; border-top-color: #ef4444; }
.ct-kpi--suppcanc .ct-kpi-label { color: #ef4444; }
.ct-kpi--ctcanc { border-top-color: #f97316; background: #fff7ed; border-color: #fed7aa; border-top-color: #f97316; }
.ct-kpi--ctcanc .ct-kpi-label { color: #f97316; }
.ct-kpi--rcftax { border-top-color: #84cc16; background: #f7fee7; border-color: #d9f99d; border-top-color: #84cc16; }
.ct-kpi--rcftax .ct-kpi-label { color: #84cc16; }
.ct-kpi--airlinegst { border-top-color: #06b6d4; background: #ecfeff; border-color: #a5f3fc; border-top-color: #06b6d4; }
.ct-kpi--airlinegst .ct-kpi-label { color: #06b6d4; }
.ct-kpi--gstcanc { border-top-color: #a855f7; background: #faf5ff; border-color: #e9d5ff; border-top-color: #a855f7; }
.ct-kpi--gstcanc .ct-kpi-label { color: #a855f7; }
.ct-kpi--igstcanc { border-top-color: #f97316; background: #fff7ed; border-color: #fed7aa; border-top-color: #f97316; }
.ct-kpi--igstcanc .ct-kpi-label { color: #f97316; }
.ct-kpi--cgstcanc { border-top-color: #22c55e; background: #f0fdf4; border-color: #dcfce7; border-top-color: #22c55e; }
.ct-kpi--cgstcanc .ct-kpi-label { color: #22c55e; }
.ct-kpi--sgstcanc { border-top-color: #14b8a6; background: #f0fdfa; border-color: #ccfbf1; border-top-color: #14b8a6; }
.ct-kpi--sgstcanc .ct-kpi-label { color: #14b8a6; }
.ct-kpi--txnamt { border-top-color: #ec4899; background: #fdf2f8; border-color: #fce7f3; border-top-color: #ec4899; }
.ct-kpi--txnamt .ct-kpi-label { color: #ec4899; }

/* ── Table ── */
.ct-table-frame { display: flex; flex-direction: column; flex: 1; min-height: 0; background: #fff; border-radius: 8px; border: 1px solid var(--ct-border); overflow: hidden; }
.ct-table-scroll { overflow: auto; flex: 1; min-height: 0; }
.ct-table-scroll .ct-table { border-radius: 0; }
.ct-table-footer { flex-shrink: 0; border-top: 1px solid var(--ct-border); background: #fafbfc; }
.ct-table-footer .ct-pagination { border-radius: 0; border: none; }
.ct-table-wrap { background: #fff; border-radius: 8px 8px 0 0; border: 1px solid var(--ct-border); border-bottom: none; overflow: auto; max-height: calc(100vh - 340px); }
.ct-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.ct-table thead th { background: #fafbfc; padding: 10px 12px; text-align: left; font-weight: 600; color: var(--ct-gray); font-size: 12px; border-bottom: 1px solid var(--ct-border-light); white-space: nowrap; cursor: pointer; user-select: none; position: sticky; top: 0; z-index: 10; }
.ct-table thead th:hover { color: var(--ct-primary); }
.ct-table tbody td { padding: 10px 12px; border-bottom: 1px solid var(--ct-border-light); vertical-align: middle; }
.ct-table tbody tr:hover { background: #f8fafc; box-shadow: inset 3px 0 0 var(--ct-blue); }
.ct-table .num { text-align: right; font-variant-numeric: tabular-nums; font-family: 'DM Mono', monospace; }
.ct-table .pos { color: var(--ct-green); }
.ct-table .neg { color: var(--ct-red); }

/* Status badges */
.ct-badge { display: inline-block; padding: 3px 10px; border-radius: 12px; font-size: 12px; font-weight: 500; white-space: nowrap; }
.ct-badge--matched { background: #dcfce7; color: #166534; }
.ct-badge--partially-matched { background: #fef3c7; color: #92400e; }
.ct-badge--missing-bos { background: #fce4ec; color: #c62828; }
.ct-badge--missing-pg, .ct-badge--missing-airline { background: #fff3e0; color: #e65100; }

/* Type pills */
.ct-type { display: inline-block; padding: 3px 10px; border-radius: 4px; font-size: 11px; font-weight: 600; }
.ct-type--payment { background: #dcfce7; color: #166534; }
.ct-type--refund { background: #dbeafe; color: #1e40af; }
.ct-type--amendment { background: #fef3c7; color: #92400e; }

/* Eye icon */
.ct-eye { cursor: pointer; color: #9ca3af; display: inline-flex; align-items: center; transition: color .15s; }
.ct-eye:hover { color: var(--ct-primary); }
.ct-eye svg { display: block; }

/* Checkbox */
.ct-row-check { width: 16px; height: 16px; cursor: pointer; accent-color: var(--ct-primary); }

/* Action bar */
.ct-action-bar { display: flex; align-items: center; gap: 16px; padding: 10px 16px; margin-bottom: 12px; background: #fff; border: 1px solid var(--ct-border); border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.ct-action-bar span { font-size: 13px; font-weight: 600; color: var(--ct-primary); }
.ct-btn-journal { background: var(--ct-primary); color: #fff; border: none; padding: 8px 20px; border-radius: 6px; font-size: 13px; font-weight: 600; cursor: pointer; transition: background .15s ease, box-shadow .15s ease; }
.ct-btn-journal:hover { background: #2a2a44; box-shadow: 0 2px 8px rgba(26,26,46,0.25); }

/* Select-all banner */
.ct-select-all-banner { display: none; align-items: center; justify-content: center; padding: 8px 16px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 6px; font-size: 13px; color: #166534; margin-bottom: 8px; text-align: center; }

/* Inline detail row */
.ct-detail-row td { padding: 0 !important; border-bottom: 2px solid var(--ct-border) !important; }
.ct-detail-row:hover { background: transparent !important; }
.ct-detail-inner { padding: 20px 24px; background: #fafbfc; }
.ct-detail-inner-header { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; font-size: 14px; font-weight: 600; color: var(--ct-primary); }
.ct-detail-inner-close { cursor: pointer; color: var(--ct-gray); font-size: 18px; margin-left: auto; transition: .15s; }
.ct-detail-inner-close:hover { color: var(--ct-red); }
.ct-detail-section { margin-bottom: 14px; }
.ct-detail-section-title { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--ct-gray); padding: 8px 0; display: flex; align-items: center; gap: 6px; cursor: pointer; }
.ct-detail-section-title:hover { color: var(--ct-primary); }
.ct-journal-table { width: 100%; border-collapse: collapse; font-size: 13px; background: #fff; border: 1px solid var(--ct-border-light); border-radius: 6px; overflow: hidden; }
.ct-journal-table thead th { background: #fafbfc; padding: 8px 12px; text-align: left; font-weight: 600; color: var(--ct-gray); font-size: 11px; text-transform: uppercase; letter-spacing: .3px; border-bottom: 1px solid var(--ct-border-light); }
.ct-journal-table tbody td { padding: 10px 12px; border-bottom: 1px solid var(--ct-border-light); vertical-align: top; }
.ct-journal-table .num { text-align: right; font-variant-numeric: tabular-nums; font-family: 'DM Mono', monospace; }
.ct-journal-table .dash { color: #d1d5db; }
.ct-detail-loading { padding: 24px; text-align: center; color: var(--ct-gray); font-size: 13px; }

/* Pagination */
.ct-pagination { display: flex; align-items: center; justify-content: space-between; padding: 6px 16px; border: 1px solid var(--ct-border); border-top: 1px solid var(--ct-border-light); border-radius: 0 0 8px 8px; background: #fff; }
.ct-page-info { font-size: 13px; color: var(--ct-gray); }
.ct-page-btns { display: flex; gap: 4px; align-items: center; }
.ct-page-btn { padding: 6px 10px; border: 1px solid var(--ct-border); border-radius: 4px; background: #fff; cursor: pointer; font-size: 12px; }
.ct-page-btn:hover { background: var(--ct-light); }
.ct-page-btn:disabled { opacity: .4; cursor: default; }
.ct-page-current { font-size: 13px; font-weight: 500; color: var(--ct-primary); padding: 0 4px; }

/* Detail page */
.ct-detail-banner { display: flex; align-items: center; gap: 12px; padding: 14px 20px; background: #fff; border: 1px solid #d1d5db; border-radius: 10px; margin-bottom: 16px; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.ct-detail-banner-text { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.ct-back { cursor: pointer; font-size: 20px; color: var(--ct-gray); text-decoration: none; transition: color .15s; line-height: 1; }
.ct-back:hover { color: var(--ct-primary); }
.ct-detail-title { font-size: 15px; font-weight: 700; color: var(--ct-primary); }
.ct-detail-meta { font-size: 12px; color: #94a3b8; }
.ct-detail-badges { display: flex; gap: 8px; align-items: center; }
.ct-airline-badge { display: inline-block; padding: 5px 14px; border-radius: 16px; background: #f0f0f5; font-size: 12px; font-weight: 600; color: #374151; }
.ct-route-badge { display: inline-block; padding: 5px 14px; border-radius: 16px; background: #e0e7ff; color: #3730a3; font-size: 12px; font-weight: 600; }
.ct-section { margin: 20px 28px; }
.ct-collapse { background: #fff; border: 1px solid #d1d5db; border-radius: 10px; overflow: hidden; margin-bottom: 16px; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.ct-collapse-header { padding: 14px 20px; font-weight: 600; font-size: 13px; cursor: pointer; display: flex; align-items: center; gap: 8px; color: #1e293b; letter-spacing: .3px; }
.ct-collapse-header:hover { background: #f1f5f9; }
.ct-collapse-body { border-top: 1px solid #d1d5db; }
.ct-invoice-badge { display: inline-block; padding: 3px 10px; border-radius: 4px; border: 1px solid var(--ct-purple); color: var(--ct-purple); font-size: 11px; font-weight: 500; }

/* Detail page — transaction info table */
.ct-detail-txn-table { width: 100%; border-collapse: collapse; }
.ct-detail-txn-table tr { border-bottom: 1px solid #e5e7eb; }
.ct-detail-txn-table tr:last-child { border-bottom: none; }
.ct-dtxn-label { padding: 14px 20px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: #64748b; white-space: nowrap; width: 220px; vertical-align: middle; }
.ct-dtxn-value { padding: 14px 20px; font-size: 14px; font-weight: 500; color: var(--ct-primary); vertical-align: middle; }

/* Detail page — invoice type badges (colored) */
.ct-inv-badge { display: inline-block; padding: 4px 12px; border-radius: 14px; font-size: 11px; font-weight: 600; letter-spacing: .3px; }
.ct-inv-cost { background: #fff7ed; color: #c2410c; border: 1px solid #fed7aa; }
.ct-inv-revenue { background: #f0fdf4; color: #15803d; border: 1px solid #bbf7d0; }
.ct-inv-default { background: #f1f5f9; color: #475569; border: 1px solid #e2e8f0; }

/* Detail page — sticky Gini chat bar at bottom */
.ct-detail-chat-bar { position: fixed; bottom: 0; left: var(--ct-sidebar-w); right: 0; display: flex; gap: 10px; padding: 16px 28px; border-top: 1px solid #d1d5db; background: #fff; z-index: 100; align-items: center; box-shadow: 0 -1px 4px rgba(0,0,0,0.04); }
.ct-sidebar-collapsed .ct-detail-chat-bar { left: 56px; }
@media (max-width: 768px) { .ct-detail-chat-bar { left: 0; } }

/* Dashboard summary table */
.ct-summary-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.ct-summary-table th { background: var(--ct-primary); color: #fff; padding: 10px 14px; text-align: left; }
.ct-summary-table td { padding: 8px 14px; border-bottom: 1px solid var(--ct-border-light); }
.ct-summary-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.ct-summary-table tr:nth-child(even) { background: var(--ct-light); }
.ct-summary-table tr.total td { background: var(--ct-purple); color: #fff; font-weight: 700; }

/* Gradient KPI for dashboard */
.ct-kpi-grad { border-radius: 12px; padding: 18px 22px; color: #fff; flex: 1; min-width: 160px; transition: all .2s ease; }
.ct-kpi-grad:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,0.15); }
.ct-kpi-grad h3 { margin: 0 0 4px; font-size: 13px; opacity: .85; font-weight: 400; }
.ct-kpi-grad p { margin: 0; font-size: 22px; font-weight: 700; }
.ct-grad-purple { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); }
.ct-grad-green { background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%); }
.ct-grad-orange { background: linear-gradient(135deg, #f2994a 0%, #f2c94c 100%); }
.ct-grad-red { background: linear-gradient(135deg, #eb3349 0%, #f45c43 100%); }
.ct-grad-blue { background: linear-gradient(135deg, #2193b0 0%, #6dd5ed 100%); }

/* === Login Overlay === */
.ct-login-overlay {
  position: fixed; inset: 0;
  background: rgba(15, 20, 18, 0.85);
  backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  z-index: 9999;
  transition: opacity 0.3s ease;
}
.ct-login-card {
  background: #fff;
  border-radius: 12px;
  padding: 32px;
  width: 100%; max-width: 360px;
  text-align: center;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}
.ct-login-logo { height: 48px; margin-bottom: 20px; }
.ct-login-title {
  font-family: 'Space Grotesk', 'DM Sans', sans-serif;
  font-size: 20px; font-weight: 700;
  color: var(--ct-primary); margin-bottom: 4px;
}
.ct-login-subtitle { font-size: 14px; color: var(--ct-gray); margin-bottom: 20px; }
.ct-login-form { display: flex; flex-direction: column; gap: 12px; }
.ct-passcode-input {
  width: 100%; padding: 12px;
  border: 1px solid var(--ct-border); border-radius: 8px;
  font-family: 'DM Mono', monospace; font-size: 16px;
  text-align: center; letter-spacing: 0.2em;
  transition: border-color 0.2s ease;
}
.ct-passcode-input:focus { outline: none; border-color: var(--ct-primary); }
.ct-login-btn {
  width: 100%; padding: 12px;
  background: linear-gradient(135deg, var(--ct-primary) 0%, #2a2a44 100%);
  color: #fff; border: none; border-radius: 8px;
  font-family: var(--ct-font); font-size: 14px; font-weight: 600;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ct-login-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(26, 26, 46, 0.3); }

/* Responsive */
@media (max-width: 768px) {
  .ct-sidebar { display: none; }
  .ct-header, .ct-subnav, .ct-main { margin-left: 0; }
  .ct-subnav { left: 0; }
  .ct-kpi-row { flex-direction: column; }
  .ct-filters { flex-direction: column; align-items: stretch; }
  .ct-search { width: 100%; }
}

/* Case pills */
.ct-case-pill { display: inline-block; padding: 4px 12px; border-radius: 14px; font-size: 12px; font-weight: 600; }
.ct-case-pill--1 { background: #dcfce7; color: #166534; }
.ct-case-pill--2 { background: #fef3c7; color: #92400e; }
.ct-case-pill--3 { background: #fce4ec; color: #c62828; }
.ct-case-pill--4 { background: #e0e7ff; color: #3730a3; }
.ct-case-pill--0 { background: #f3f4f6; color: #374151; }

/* --- CT AI Module Styles --- */

/* Anomaly badges */
.ct-anomaly-badge { display:inline-block; padding:2px 8px; border-radius:10px; font-size:11px; font-weight:600; white-space:nowrap; }
.ct-sev-critical { background:#fce4ec; color:#c62828; }
.ct-sev-warning { background:#fff3e0; color:#e65100; }
.ct-sev-info { background:#e3f2fd; color:#1565c0; }

/* Anomaly filter toggle */
.ct-filter-toggle { display:inline-flex; align-items:center; gap:6px; font-size:13px; color:var(--ct-gray, #6b7280); cursor:pointer; margin-left:12px; }
.ct-filter-toggle input { accent-color:#6366f1; }

/* Anomaly info icon button */
.ct-anomaly-info-btn { width:20px; height:20px; border-radius:50%; background:#6366f1; color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; cursor:pointer; margin-left:4px; transition:background .15s; vertical-align:middle; font-style:normal; }
.ct-anomaly-info-btn:hover { background:#4f46e5; }

/* Anomaly info modal */
.ct-anomaly-modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.3); display:flex; align-items:center; justify-content:center; z-index:9999; }
.ct-anomaly-modal { background:#fff; border-radius:12px; box-shadow:0 20px 60px rgba(0,0,0,0.15); max-width:720px; width:90vw; max-height:80vh; display:flex; flex-direction:column; overflow:hidden; }
.ct-anomaly-modal-header { display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid #e2e8f0; flex-shrink:0; }
.ct-anomaly-modal-header h3 { margin:0; font-size:15px; font-weight:600; color:#1e293b; display:flex; align-items:center; gap:8px; }
.ct-anomaly-modal-close { width:28px; height:28px; border:none; background:#f1f5f9; border-radius:6px; font-size:16px; cursor:pointer; display:flex; align-items:center; justify-content:center; color:#64748b; transition:background .15s; }
.ct-anomaly-modal-close:hover { background:#e2e8f0; }
.ct-anomaly-modal-body { padding:16px 20px; overflow-y:auto; flex:1; min-height:0; }

/* AI Summary section */
.ct-ai-section { margin-top:24px; }
.ct-ai-exec { background:linear-gradient(135deg, #f0f4ff 0%, #e8eeff 100%); border-radius:12px; padding:20px 24px; margin-bottom:16px; }
.ct-ai-badge { display:inline-block; background:#6366f1; color:#fff; font-size:11px; font-weight:700; padding:2px 10px; border-radius:10px; margin-bottom:8px; letter-spacing:0.5px; }
.ct-ai-exec p { margin:0; font-size:14px; line-height:1.6; color:#1e293b; }

.ct-ai-risks h4, .ct-ai-anomalies h4, .ct-ai-insights h4, .ct-ai-kpi h4 { font-size:14px; font-weight:600; color:#334155; margin:16px 0 10px; }
.ct-risk-grid, .ct-insight-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:12px; }
.ct-risk-card { border-radius:10px; padding:14px 16px; border-left:4px solid #94a3b8; }
.ct-risk-critical { border-left-color:#dc2626; background:#fef2f2; }
.ct-risk-warning { border-left-color:#f59e0b; background:#fffbeb; }
.ct-risk-info { border-left-color:#3b82f6; background:#eff6ff; }
.ct-risk-flag { font-size:13px; font-weight:600; color:#1e293b; }
.ct-risk-impact { font-size:12px; color:#dc2626; font-weight:600; margin-top:4px; }
.ct-risk-rec { font-size:12px; color:#64748b; margin-top:4px; }

.ct-ai-anomalies ul { margin:0; padding-left:20px; }
.ct-ai-anomalies li { font-size:13px; line-height:1.7; color:#334155; }

.ct-insight-card { background:#f8fafc; border-radius:10px; padding:14px 16px; border:1px solid #e2e8f0; }
.ct-insight-title { font-size:13px; font-weight:600; color:#1e293b; display:flex; align-items:center; gap:6px; }
.ct-insight-desc { font-size:12px; color:#64748b; margin-top:4px; }
.ct-pri-dot { width:8px; height:8px; border-radius:50%; display:inline-block; }
.ct-pri-high { background:#dc2626; }
.ct-pri-med { background:#f59e0b; }
.ct-pri-low { background:#22c55e; }

.ct-ai-kpi .ct-kpi-notes { display:flex; flex-wrap:wrap; gap:12px; }
.ct-kpi-note { font-size:12px; color:#475569; background:#f1f5f9; padding:6px 12px; border-radius:8px; }
.ct-kpi-note b { color:#1e293b; }

/* Chat UI (Gini) */
.ct-record-main { display:flex; flex-direction:column; height:100vh; padding:0 !important; overflow:hidden; }
.ct-record-header { flex-shrink:0; padding:20px 24px 16px; border-bottom:1px solid #f1f5f9; }
.ct-record-header h2 { font-size:18px; font-weight:600; margin:0 0 4px; color:#1e293b; }
.ct-record-header p { font-size:13px; color:#64748b; margin:0; }
.ct-record-chat { flex:1; min-height:0; overflow-y:auto; padding:16px 20px; display:flex; flex-direction:column; gap:14px; scroll-behavior:smooth; }
.ct-chat-msg { display:flex; gap:10px; align-items:flex-start; }
.ct-chat-user { justify-content:flex-end; }
.ct-chat-agent { justify-content:flex-start; }
.ct-chat-avatar { width:32px; height:32px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.ct-chat-agent .ct-chat-avatar { background:#f0f0ff; border:1.5px solid #e0e0f0; }
.ct-chat-agent .ct-chat-avatar img { width:100%; height:100%; object-fit:cover; border-radius:50%; }
.ct-chat-bubble { max-width:78%; padding:14px 18px; border-radius:16px; font-size:13.5px; line-height:1.65; word-wrap:break-word; }
.ct-chat-user .ct-chat-bubble { background:#6366f1; color:#fff; border-bottom-right-radius:4px; }
.ct-chat-agent .ct-chat-bubble { background:#f8fafc; color:#1e293b; border:1px solid #e9ecf2; border-bottom-left-radius:4px; }
.ct-chat-input-row { flex-shrink:0; display:flex; gap:8px; padding:14px 20px; border-top:1px solid #e2e8f0; background:#fff; }
.ct-chat-input { flex:1; border:1px solid #d1d5db; border-radius:10px; padding:12px 16px; font-size:13.5px; outline:none; font-family:inherit; }
.ct-chat-input:focus { border-color:#6366f1; box-shadow:0 0 0 3px rgba(99,102,241,0.12); }
.ct-chat-send { background:#6366f1; color:#fff; border:none; border-radius:10px; padding:12px 22px; font-weight:600; font-size:13.5px; cursor:pointer; transition:background .15s; }
.ct-chat-send:hover { background:#4f46e5; }
.ct-chat-attach { cursor:pointer; font-size:18px; padding:8px; display:flex; align-items:center; color:#94a3b8; transition:color .15s; }
.ct-chat-attach:hover { color:#6366f1; }
/* Chat/detail frame with scroll + download */
.ct-chat-frame { border:1px solid #e2e8f0; border-radius:10px; overflow:hidden; margin:10px 0 4px; }
.ct-chat-frame-header { display:flex; align-items:center; justify-content:space-between; padding:6px 12px; background:#f8fafc; border-bottom:1px solid #e2e8f0; }
.ct-chat-frame-title { font-size:11px; font-weight:600; color:#64748b; text-transform:uppercase; letter-spacing:.3px; }
.ct-chat-frame-actions { display:flex; gap:6px; }
.ct-dl-btn { background:none; border:1px solid #cbd5e1; color:#475569; padding:4px 10px; border-radius:6px; font-size:11px; font-weight:500; cursor:pointer; display:flex; align-items:center; gap:4px; font-family:inherit; transition:all .15s; }
.ct-dl-btn:hover { background:#f1f5f9; border-color:#94a3b8; color:#1e293b; }
.ct-dl-btn svg { width:12px; height:12px; }
.ct-chat-scroll { max-height:320px; overflow:auto; }
.ct-chat-scroll::-webkit-scrollbar { width:6px; height:6px; }
.ct-chat-scroll::-webkit-scrollbar-thumb { background:#cbd5e1; border-radius:3px; }
.ct-chat-scroll::-webkit-scrollbar-thumb:hover { background:#94a3b8; }
.ct-chat-table { width:100%; border-collapse:collapse; font-size:12px; }
.ct-chat-table th { background:#eef2ff; padding:8px 10px; text-align:center; font-weight:600; color:#4338ca; font-size:11px; text-transform:uppercase; letter-spacing:.3px; position:sticky; top:0; z-index:1; border-right:1px solid #ddd6fe; }
.ct-chat-table th:last-child { border-right:none; }
.ct-chat-table td { padding:7px 10px; border-bottom:1px solid #f1f5f9; border-right:1px solid #f1f5f9; text-align:center; }
.ct-chat-table td:last-child { border-right:none; }
.ct-chat-table tr:last-child td { border-bottom:none; }
.ct-chat-table tr:hover td { background:#fafbff; }
.ct-chat-preamble { margin-bottom:8px; color:#475569; }

/* Suggestion chip buttons */
.ct-chip-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.ct-chip { background:#fff; border:1.5px solid #c7d2fe; color:#4f46e5; padding:7px 16px; border-radius:20px; font-size:12.5px; font-weight:500; cursor:pointer; transition:all .15s; font-family:inherit; white-space:nowrap; }
.ct-chip:hover { background:#eef2ff; border-color:#818cf8; transform:translateY(-1px); box-shadow:0 2px 8px rgba(99,102,241,0.12); }
.ct-chip:active { transform:translateY(0); }

/* Typing indicator */
.ct-typing { display:inline-flex; align-items:center; gap:4px; padding:4px 0; }
.ct-typing-dot { width:7px; height:7px; border-radius:50%; background:#94a3b8; animation:ctDotPulse 1.4s ease-in-out infinite; }
.ct-typing-dot:nth-child(2) { animation-delay:.2s; }
.ct-typing-dot:nth-child(3) { animation-delay:.4s; }
@keyframes ctDotPulse { 0%,80%,100%{opacity:.3;transform:scale(.8)} 40%{opacity:1;transform:scale(1)} }

/* Welcome chips (initial suggestions) */
.ct-welcome-chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.ct-welcome-chips .ct-chip { background:#f0f0ff; }

/* ── Filter Icon + Popover ── */
.ct-filter-icon { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; margin-left: 4px; vertical-align: middle; color: #c9cdd3; cursor: pointer; border-radius: 3px; transition: color .15s, background .15s; position: relative; }
.ct-filter-icon:hover { color: var(--ct-primary); background: rgba(0,0,0,0.04); }
.ct-filter-icon.ct-fi-active { color: var(--ct-blue); background: rgba(59,130,246,0.1); }
.ct-filter-icon.ct-fi-active svg { fill: var(--ct-blue); fill-opacity: 0.2; }

.ct-filter-popover { position: absolute; z-index: 400; background: #fff; border: 1px solid var(--ct-border); border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,0.12), 0 2px 6px rgba(0,0,0,0.06); padding: 14px; min-width: 190px; max-width: 270px; }
.ct-fp-header { font-size: 11px; font-weight: 600; color: var(--ct-gray); text-transform: uppercase; letter-spacing: .3px; margin-bottom: 10px; }
.ct-fp-select { width: 100%; padding: 6px 8px; border: 1px solid var(--ct-border); border-radius: 6px; font-size: 12px; background: #fff; color: #374151; cursor: pointer; }
.ct-fp-select:focus { border-color: var(--ct-blue); outline: none; box-shadow: 0 0 0 2px rgba(59,130,246,0.15); }
.ct-fp-input { width: 100%; padding: 6px 8px; border: 1px solid var(--ct-border); border-radius: 6px; font-size: 12px; background: #fff; color: #374151; }
.ct-fp-input:focus { border-color: var(--ct-blue); outline: none; box-shadow: 0 0 0 2px rgba(59,130,246,0.15); }
.ct-fp-range { display: flex; gap: 4px; align-items: center; }
.ct-fp-sep { color: #d1d5db; font-size: 12px; }
.ct-fp-num, .ct-fp-date { flex: 1; padding: 6px 6px; border: 1px solid var(--ct-border); border-radius: 6px; font-size: 11px; background: #fff; color: #374151; min-width: 0; }
.ct-fp-num:focus, .ct-fp-date:focus { border-color: var(--ct-blue); outline: none; box-shadow: 0 0 0 2px rgba(59,130,246,0.15); }
.ct-fp-actions { display: flex; gap: 6px; margin-top: 10px; justify-content: flex-end; }
.ct-fp-checks { max-height: 200px; overflow-y: auto; margin: 6px 0; padding: 0; }
.ct-fp-check-item { display: flex; align-items: center; padding: 5px 4px; font-size: 12px; cursor: pointer; border-radius: 4px; gap: 6px; }
.ct-fp-check-item:hover { background: #f1f5f9; }
.ct-fp-check-item input[type="checkbox"] { margin: 0; cursor: pointer; accent-color: var(--ct-blue); }
.ct-fp-check-all { font-weight: 600; border-bottom: 1px solid #e5e7eb; padding-bottom: 6px; margin-bottom: 2px; border-radius: 0; }
.ct-fp-search-input { width: 100%; padding: 6px 8px; border: 1px solid var(--ct-border); border-radius: 6px; font-size: 12px; margin-bottom: 4px; background: #fff; color: #374151; }
.ct-fp-search-input:focus { border-color: var(--ct-blue); outline: none; box-shadow: 0 0 0 2px rgba(59,130,246,0.15); }
.ct-fp-btn { padding: 5px 14px; border-radius: 6px; font-size: 12px; font-weight: 600; cursor: pointer; border: 1px solid var(--ct-border); background: #fff; color: var(--ct-gray); transition: .15s; }
.ct-fp-btn:hover { background: var(--ct-light); }
.ct-fp-apply { background: var(--ct-primary); color: #fff; border-color: var(--ct-primary); }
.ct-fp-apply:hover { background: #2a2a44; }
.ct-fp-clear:hover { color: var(--ct-red); border-color: var(--ct-red); }

/* ── Sort Icons ── */
.ct-sort-icon { font-size: 11px; color: #d1d5db; margin-left: 2px; }
.ct-sort-icon.ct-sort-active { color: var(--ct-primary); font-weight: 700; }

/* Alert modal */
.ct-alert-modal { position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.5); display:flex; align-items:center; justify-content:center; z-index:1000; }
.ct-alert-card { background:#fff; border-radius:16px; padding:24px; max-width:560px; width:90%; max-height:80vh; overflow-y:auto; }
.ct-alert-card h3 { margin:0 0 16px; font-size:16px; }
.ct-email-preview { background:#f8fafc; border:1px solid #e2e8f0; border-radius:8px; padding:16px; font-size:13px; line-height:1.6; white-space:pre-wrap; margin:12px 0; }
.ct-alert-actions { display:flex; gap:8px; justify-content:flex-end; margin-top:16px; }
.ct-alert-actions button { padding:8px 20px; border-radius:8px; font-size:13px; font-weight:600; cursor:pointer; border:none; }
.ct-alert-send { background:#dc2626; color:#fff; }
.ct-alert-cancel { background:#e2e8f0; color:#334155; }

/* --- Anomaly Legend Panel --- */
.ct-anomaly-legend { background:#fafaff; border:1px solid #e2e8f0; border-radius:10px; margin-bottom:16px; overflow:hidden; }

/* Anomaly category tag */
.ct-anomaly-cat { display:inline-block; padding:2px 8px; border-radius:10px; font-size:10px; font-weight:600; background:#f1f5f9; color:#475569; border:1px solid #e2e8f0; margin-left:8px; letter-spacing:.2px; }

/* Anomaly priority badge */
.ct-anomaly-pri { display:inline-block; padding:2px 8px; border-radius:10px; font-size:10px; font-weight:600; margin-left:6px; letter-spacing:.2px; }
.ct-anomaly-pri--critical { background:#fef2f2; color:#dc2626; border:1px solid #fecaca; }
.ct-anomaly-pri--high { background:#fff7ed; color:#c2410c; border:1px solid #fed7aa; }
.ct-anomaly-pri--medium { background:#fffbeb; color:#a16207; border:1px solid #fef3c7; }
.ct-legend-toggle { display:flex; align-items:center; gap:8px; padding:12px 16px; cursor:pointer; font-size:13px; font-weight:600; color:#475569; user-select:none; transition:background .15s; }
.ct-legend-toggle:hover { background:#f1f5f9; }
.ct-legend-icon { width:22px; height:22px; border-radius:50%; background:#6366f1; color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; }
.ct-legend-arrow { margin-left:auto; font-size:10px; transition:transform .2s; }
.ct-anomaly-legend.open .ct-legend-arrow { transform:rotate(90deg); }
.ct-legend-body { display:none; padding:0 16px 16px; }
.ct-anomaly-legend.open .ct-legend-body { display:block; }
.ct-legend-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:12px; }
.ct-legend-item { background:#fff; border:1px solid #e9ecf2; border-radius:8px; padding:12px 14px; }
.ct-legend-item-head { display:flex; align-items:center; gap:8px; margin-bottom:6px; }
.ct-legend-item-label { font-size:13px; font-weight:600; color:#1e293b; }
.ct-legend-item-desc { font-size:12px; color:#64748b; line-height:1.5; margin-bottom:6px; }
.ct-legend-item-action { font-size:11.5px; color:#475569; line-height:1.5; background:#f8fafc; padding:6px 10px; border-radius:6px; }

/* --- Anomaly Detail in Row Expand --- */
.ct-anomaly-detail-header { background:#fef2f2 !important; color:#b91c1c !important; }
.ct-anomaly-detail { padding:16px; }

/* --- AI Tag (global; list pages override in inline styles) --- */
.al-ai-tag { display:inline-block; padding:2px 8px; border-radius:4px; font-size:11px; font-weight:500; background:rgba(99,102,241,.08); color:#6366f1; white-space:nowrap; }
.al-ai-tag--matched { background:#dcfce7; color:#166534; border-left:3px solid #22c55e; }
.al-ai-tag--almost { background:#dbeafe; color:#1e40af; border-left:3px solid #3b82f6; }
.al-ai-tag--merged { background:#f3e8ff; color:#7c3aed; border-left:3px solid #8b5cf6; }
.al-ai-tag--warning { background:#fef3c7; color:#92400e; border-left:3px solid #f59e0b; }
.al-ai-tag--severe { background:#fef2f2; color:#991b1b; border-left:3px solid #dc2626; font-weight:600; }
.al-ai-tag--error { background:#fef2f2; color:#dc2626; border-left:3px solid #ef4444; }
.al-ai-tag--partial { background:#fff7ed; color:#c2410c; border-left:3px solid #f97316; }
.al-ai-tag--b2b { background:#ede9fe; color:#6d28d9; }

/* --- Line Status Badges (4-tier) --- */
.ct-line-status { display:inline-block; padding:2px 8px; border-radius:4px; font-size:11px; font-weight:600; white-space:nowrap; }
.ct-ls-matched { background:#dcfce7; color:#166534; border-left:3px solid #22c55e; }
.ct-ls-almost { background:#dbeafe; color:#1e40af; border-left:3px solid #3b82f6; }
.ct-ls-merged { background:#f3e8ff; color:#7c3aed; border-left:3px solid #8b5cf6; }
.ct-ls-mismatched { background:#fef3c7; color:#92400e; border-left:3px solid #f59e0b; }
.ct-ls-missing { background:#f3f4f6; color:#6b7280; border-left:3px solid #9ca3af; }
.ct-ls-excess { background:#fff7ed; color:#c2410c; border-left:3px solid #f97316; }
.ct-bos-merged-cell { vertical-align:middle; text-align:center; font-weight:700; background:rgba(99,102,241,.04); border-left:2px solid #a5b4fc; }
.ct-ad-type-row { display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.ct-ad-label { font-size:15px; font-weight:600; color:#1e293b; }
.ct-ad-section { margin-bottom:12px; }
.ct-ad-heading { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:#94a3b8; margin-bottom:4px; }
.ct-ad-text { font-size:13px; color:#334155; line-height:1.6; }
.ct-ad-actions { display:flex; gap:8px; margin-top:16px; flex-wrap:wrap; }
.ct-action-btn { padding:8px 16px; border-radius:8px; font-size:12.5px; font-weight:600; cursor:pointer; border:none; font-family:inherit; transition:all .15s; display:inline-flex; align-items:center; gap:5px; }
.ct-action-filter { background:#eef2ff; color:#4338ca; }
.ct-action-filter:hover { background:#c7d2fe; }
.ct-action-agent { background:#f0fdf4; color:#15803d; }
.ct-action-agent:hover { background:#bbf7d0; }
.ct-action-alert { background:#fef2f2; color:#dc2626; }
.ct-action-alert:hover { background:#fecaca; }

/* --- Anomaly Overview on Dashboard --- */
.ct-anomaly-overview { margin-top:24px; background:#fff; border:1px solid #e2e8f0; border-radius:12px; padding:20px 24px; }
.ct-ao-title { font-size:16px; font-weight:600; color:#1e293b; margin:0 0 12px; }
.ct-ao-summary { display:flex; align-items:center; gap:16px; margin-bottom:14px; flex-wrap:wrap; }
.ct-ao-total { font-size:14px; font-weight:600; color:#dc2626; }
.ct-ao-impact { font-size:13px; color:#64748b; }
.ct-sev-bar { display:flex; height:28px; border-radius:8px; overflow:hidden; margin-bottom:8px; }
.ct-sev-seg { display:flex; align-items:center; justify-content:center; color:#fff; font-size:11px; font-weight:700; min-width:28px; transition:width .3s; }
.ct-sev-seg-critical { background:#dc2626; }
.ct-sev-seg-warning { background:#f59e0b; }
.ct-sev-seg-info { background:#3b82f6; }
.ct-sev-labels { display:flex; gap:16px; margin-bottom:16px; flex-wrap:wrap; }
.ct-sev-lbl { font-size:12px; color:#64748b; display:flex; align-items:center; gap:5px; }
.ct-dot { width:8px; height:8px; border-radius:50%; display:inline-block; }
.ct-ao-cards { display:grid; grid-template-columns:repeat(auto-fill, minmax(160px, 1fr)); gap:10px; }
.ct-ao-card { display:block; background:#f8fafc; border:1px solid #e2e8f0; border-radius:10px; padding:14px 16px; text-decoration:none; transition:all .15s; cursor:pointer; }
.ct-ao-card:hover { background:#eef2ff; border-color:#c7d2fe; transform:translateY(-2px); box-shadow:0 4px 12px rgba(99,102,241,0.1); }
.ct-ao-card-count { font-size:24px; font-weight:700; color:#1e293b; }
.ct-ao-card-label { font-size:12px; font-weight:600; color:#475569; margin-top:2px; }
.ct-ao-card-action { font-size:11px; color:#6366f1; margin-top:8px; font-weight:500; }

/* Toast notification */
.ct-toast { position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(20px); padding:12px 24px; border-radius:10px; font-size:13px; font-weight:500; color:#fff; z-index:9999; opacity:0; transition:all .3s ease; pointer-events:none; max-width:500px; text-align:center; box-shadow:0 8px 24px rgba(0,0,0,0.15); }
.ct-toast-show { opacity:1; transform:translateX(-50%) translateY(0); }
.ct-toast-success { background:#15803d; }
.ct-toast-error { background:#dc2626; }
.ct-toast-info { background:#1d4ed8; }

/* Mark as Matched button */
.ct-btn-match { background:#15803d !important; color:#fff !important; }
.ct-btn-match:hover { background:#166534 !important; }

/* Context entry card (Gini transaction analysis) */
.ct-ctx-card { background:#fff; border:1px solid #e2e8f0; border-radius:12px; overflow:hidden; margin:10px 0; }
.ct-ctx-header { display:flex; align-items:center; justify-content:space-between; padding:14px 18px; background:#f8fafc; border-bottom:1px solid #e2e8f0; gap:10px; flex-wrap:wrap; }
.ct-ctx-title { font-size:14px; font-weight:700; color:#1e293b; }
.ct-ctx-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:1px; background:#e2e8f0; }
.ct-ctx-field { background:#fff; padding:12px 16px; }
.ct-ctx-label { display:block; font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.4px; color:#94a3b8; margin-bottom:3px; }
.ct-ctx-value { display:block; font-size:13.5px; color:#1e293b; }
.ct-ctx-anomaly { padding:14px 18px; background:#fef8f8; border-top:1px solid #fce4ec; }
.ct-ctx-anomaly-title { font-size:14px; font-weight:600; color:#b91c1c; margin-bottom:4px; }
.ct-ctx-anomaly-desc { font-size:13px; color:#334155; margin-bottom:4px; }
.ct-ctx-anomaly-why { font-size:12px; color:#64748b; font-style:italic; }
.ct-ctx-actions { display:flex; gap:8px; padding:14px 18px; border-top:1px solid #e2e8f0; flex-wrap:wrap; }
@media (max-width: 600px) { .ct-ctx-grid { grid-template-columns:repeat(2, 1fr); } }

/* Export choice modal buttons */
.ct-export-sel-btn { background:#1a1a2e; color:#fff; padding:8px 20px; border-radius:8px; font-size:13px; font-weight:600; cursor:pointer; border:none; transition:background .15s, box-shadow .15s; }
.ct-export-sel-btn:hover { background:#2a2a44; box-shadow:0 2px 8px rgba(26,26,46,0.25); }
.ct-export-all-btn { background:#fff; color:#1a1a2e; padding:8px 20px; border-radius:8px; font-size:13px; font-weight:600; cursor:pointer; border:1px solid #d1d5db; transition:background .15s; }
.ct-export-all-btn:hover { background:#f9fafb; }

/* AI tags for airline recon detail views */
.al-ai-tag { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 500; background: rgba(99,102,241,.08); color: #6366f1; white-space: nowrap; }
.al-amend-tag { display: inline-block; padding: 1px 6px; border-radius: 3px; font-size: 10px; font-weight: 600; background: #fce4ec; color: #c62828; vertical-align: middle; margin-right: 4px; }

/* ── Daily Chart: Segmented Control ── */
.ct-seg {
  display: inline-flex;
  position: relative;
  background: #f1f5f9;
  border-radius: 10px;
  padding: 3px;
  gap: 2px;
}
.ct-seg__pill {
  position: absolute;
  top: 3px;
  bottom: 3px;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0,0,0,.12);
  transition: left .3s cubic-bezier(.4,0,.2,1), width .3s cubic-bezier(.4,0,.2,1);
  pointer-events: none;
  z-index: 0;
}
.ct-seg__btn {
  position: relative;
  z-index: 1;
  padding: 6px 18px;
  font-size: 13px;
  font-weight: 600;
  border: none;
  background: transparent;
  color: #94a3b8;
  cursor: pointer;
  border-radius: 8px;
  transition: color .25s;
  white-space: nowrap;
}
.ct-seg__btn.active {
  color: #334155;
}

/* ── Daily Chart: Calendar Button ── */
.ct-cal-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  cursor: pointer;
  color: #475569;
  font-size: 13px;
  font-weight: 500;
  transition: all .2s;
  user-select: none;
  white-space: nowrap;
}
.ct-cal-btn:hover {
  border-color: #cbd5e1;
  background: #f8fafc;
}
.ct-cal-btn--active {
  border-color: #6366f1;
  color: #6366f1;
  background: #eef2ff;
}
.ct-cal-btn svg {
  flex-shrink: 0;
}

/* ── Daily Chart: Toggle Switch ── */
.ct-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  user-select: none;
}
.ct-toggle__label {
  font-size: 13px;
  font-weight: 600;
  transition: color .2s;
}
.ct-toggle__label--left {
  color: #334155;
}
.ct-toggle__label--right {
  color: #94a3b8;
}
.ct-toggle__track {
  position: relative;
  width: 40px;
  height: 22px;
  background: #6366f1;
  border-radius: 11px;
  transition: background .3s;
  flex-shrink: 0;
}
.ct-toggle__thumb {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0,0,0,.2);
  transition: transform .3s cubic-bezier(.4,0,.2,1);
}
.ct-toggle--on .ct-toggle__track {
  background: #f97316;
}
.ct-toggle--on .ct-toggle__thumb {
  transform: translateX(18px);
}
.ct-toggle--on .ct-toggle__label--left {
  color: #94a3b8;
}
.ct-toggle--on .ct-toggle__label--right {
  color: #334155;
}

/* ---------------------------------------------------------------- */
/* Pay In / Pay Out Summary Dashboard                               */
/* ---------------------------------------------------------------- */
.ct-ds { margin: 0; }
.ct-ds-kpi-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 24px; }
.ct-ds-kpi { border: 1px solid var(--ct-border); border-radius: 10px; padding: 18px 20px; background: #fff; }
.ct-ds-kpi-label { font-size: 11px; font-weight: 600; letter-spacing: .6px; text-transform: uppercase; color: var(--ct-gray); margin-bottom: 6px; display: flex; align-items: center; gap: 6px; }
.ct-ds-kpi-value { font-size: 28px; font-weight: 700; font-family: 'Space Grotesk', sans-serif; line-height: 1.15; }
.ct-ds-kpi-sub { font-size: 12px; color: var(--ct-gray); margin-top: 4px; }
.ct-ds-kpi--match .ct-ds-kpi-value { color: #16a34a; }
.ct-ds-kpi--diff .ct-ds-kpi-value { color: #dc2626; }
.ct-ds-kpi--miss-ct .ct-ds-kpi-value { color: #7c3aed; }
.ct-ds-kpi--miss-cp .ct-ds-kpi-value { color: #d97706; }
.ct-ds-kpi-icon { width: 16px; height: 16px; border-radius: 50%; display: inline-block; }
.ct-ds-kpi-icon--match { background: #16a34a; }
.ct-ds-kpi-icon--diff { background: #dc2626; }
.ct-ds-kpi-icon--miss-ct { background: #7c3aed; }
.ct-ds-kpi-icon--miss-cp { background: #d97706; }

.ct-ds-section { background: #fff; border: 1px solid var(--ct-border); border-radius: 10px; margin-bottom: 20px; overflow: hidden; }
.ct-ds-section-hdr { display: flex; align-items: center; gap: 8px; padding: 14px 20px; font-size: 14px; font-weight: 700; color: var(--ct-fg); border-bottom: 1px solid var(--ct-border-light); }
.ct-ds-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.ct-ds-dot--matched { background: #16a34a; }
.ct-ds-dot--missing-ct { background: #dc2626; }
.ct-ds-dot--missing-cp { background: #7c3aed; }
.ct-ds-dot--mismatched { background: #d97706; }

.ct-ds-table { width: 100%; border-collapse: collapse; }
.ct-ds-table th { padding: 10px 16px; text-align: left; font-size: 11px; font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: var(--ct-gray); border-bottom: 1px solid var(--ct-border-light); }
.ct-ds-table th.num { text-align: right; }
.ct-ds-table td { padding: 14px 16px; border-bottom: 1px solid var(--ct-border-light); vertical-align: top; font-size: 13px; }
.ct-ds-table td.num { text-align: right; font-family: 'DM Mono', monospace; }
.ct-ds-table tr:last-child td { border-bottom: none; }
.ct-ds-table .ct-ds-total td { font-weight: 700; border-top: 2px solid var(--ct-border); background: #fafbfc; }
.ct-ds-amt { display: block; font-size: 14px; font-weight: 600; font-family: 'DM Mono', monospace; }
.ct-ds-txns { display: block; font-size: 11px; color: var(--ct-gray); margin-top: 2px; font-family: 'DM Mono', monospace; }
.ct-ds-diff { color: #d97706; font-weight: 600; font-family: 'DM Mono', monospace; }
.ct-ds-dash { color: #ccc; }
.ct-ds-reasons { list-style: none; padding: 0; margin: 0; }
.ct-ds-reasons li { display: flex; justify-content: space-between; gap: 16px; font-size: 12px; padding: 2px 0; }
.ct-ds-reasons li span:last-child { font-family: 'DM Mono', monospace; color: var(--ct-fg); white-space: nowrap; }
.ct-ds-filter-row { display: flex; justify-content: flex-end; align-items: center; gap: 10px; margin-bottom: 16px; }
.ct-ds-filter-label { font-size: 11px; font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: var(--ct-gray); }
.ct-ds-paytabs { border: 1px solid var(--ct-border); border-radius: 12px; background: #fff; overflow: hidden; }
.ct-ds-paytab { padding: 10px 28px; font-size: 14px; font-weight: 600; border: none; background: transparent; color: var(--ct-gray); cursor: pointer; border-bottom: 3px solid transparent; transition: all .15s; }
.ct-ds-paytab:hover { color: var(--ct-fg); background: #fafbfc; }
.ct-ds-paytab.active { color: var(--ct-accent, #6366f1); border-bottom-color: var(--ct-accent, #6366f1); background: #fafbfc; }
#ctPayTabContent { padding: 20px; }
.ct-ds-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }
.ct-ds-grid .ct-ds-section { margin-bottom: 0; }
@media (max-width: 900px) { .ct-ds-grid { grid-template-columns: 1fr; } }
.ct-ds-reasons-section { background: #fff; border: 1px solid var(--ct-border); border-radius: 10px; margin-bottom: 20px; overflow: hidden; }
.ct-ds-reasons-section .ct-ds-section-hdr { border-bottom: 1px solid var(--ct-border-light); }
.ct-ds-reasons-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0; }
.ct-ds-reasons-grid > div { border-right: 1px solid var(--ct-border-light); padding: 0; }
.ct-ds-reasons-grid > div:last-child { border-right: none; }
.ct-ds-reasons-sub-hdr { padding: 10px 16px; font-size: 12px; font-weight: 700; color: var(--ct-fg); background: #fafbfc; border-bottom: 1px solid var(--ct-border-light); }
.ct-ds-reasons-scroll { max-height: 260px; overflow-y: auto; }
.ct-ds-reasons-scroll .ct-ds-table thead th { position: sticky; top: 0; background: #fff; z-index: 1; }
@media (max-width: 900px) { .ct-ds-reasons-grid { grid-template-columns: 1fr; } .ct-ds-reasons-grid > div { border-right: none; border-bottom: 1px solid var(--ct-border-light); } .ct-ds-reasons-grid > div:last-child { border-bottom: none; } }