@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
    /* Refined OKLCH-based palette (approximated in Hex for compatibility) */
    --bg-main: #0a0f1d;
    --bg-card: #161d2f;
    --bg-elevated: #1e263d;
    
    --border-subtle: rgba(255, 255, 255, 0.04);
    --border-muted: rgba(255, 255, 255, 0.08);
    --border-strong: rgba(255, 255, 255, 0.12);

    --text-main: #f1f5f9;
    --text-muted: #94a3b8;
    --text-dim: #64748b;

    /* Semantic Accents - Tinted Neutrals */
    --accent: #6366f1; /* Indigo-ish */
    --accent-glow: rgba(99, 102, 241, 0.2);
    
    --critical: #f43f5e; /* Rose */
    --high: #f59e0b;     /* Amber */
    --medium: #eab308;   /* Yellow */
    --low: #3b82f6;      /* Blue */
    --info: #06b6d4;     /* Cyan */
    --success: #10b981;  /* Emerald */

    --font-sans: 'Plus Jakarta Sans', -apple-system, sans-serif;
    --font-mono: 'JetBrains Mono', monospace;
    
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --radius-xl: 20px;
    
    --transition-base: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

body {
    font-family: var(--font-sans);
    background-color: var(--bg-main);
    color: var(--text-main);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

code, pre, .mono {
    font-family: var(--font-mono) !important;
}

/* Navbar: Subtler, more integrated */
.navbar {
    background: rgba(10, 15, 29, 0.8) !important;
    backdrop-filter: saturate(180%) blur(12px);
    border-bottom: 1px solid var(--border-muted) !important;
    padding: 0.75rem 0;
}

.navbar-brand {
    font-weight: 800;
    font-size: 1.25rem;
    color: var(--text-main) !important;
    letter-spacing: -0.03em;
}

.navbar-brand i {
    color: var(--critical) !important;
}

.nav-link {
    font-weight: 500;
    font-size: 0.9rem;
    color: var(--text-muted) !important;
    transition: var(--transition-base);
    padding: 0.5rem 0.75rem !important;
    border-radius: var(--radius-md);
}

.nav-link:hover, .nav-link.active {
    color: var(--text-main) !important;
    background: var(--bg-elevated);
}

/* Semantic Badges */
.badge {
    font-weight: 700;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.4em 0.7em;
    border-radius: var(--radius-sm);
}

.severity-critical { background-color: var(--critical); color: #fff; }
.severity-high { background-color: var(--high); color: #fff; }
.severity-medium { background-color: var(--medium); color: #000; }
.severity-low { background-color: var(--low); color: #fff; }
.severity-info { background-color: var(--info); color: #fff; }

/* Ticket Status Badges */
.status-open { background-color: var(--critical) !important; color: #fff; }
.status-blocked { background-color: var(--high) !important; color: #fff; }
.status-doing { background-color: var(--low) !important; color: #fff; }
.status-done { background-color: var(--success) !important; color: #fff; }

/* Triage Status Badges */
.triage-needs_triage { background-color: var(--high) !important; color: #fff; }
.triage-confirmed { background-color: var(--critical) !important; color: #fff; }
.triage-resolved { background-color: var(--success) !important; color: #fff; }
.triage-acceptable_risk { background-color: var(--info) !important; color: #fff; }
.triage-false_positive { background-color: #6b7280 !important; color: #fff; }

/* Ruthless Simplification */
.card {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.card-header {
    background: transparent !important;
    border-bottom: 2px solid var(--border-muted) !important;
    padding: 1rem 0 !important;
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.card-body {
    padding: 1.5rem 0 !important;
}

.bg-card {
    background-color: var(--bg-card) !important;
}

/* Minimalist Tables */
.table {
    border-collapse: separate;
    border-spacing: 0 10px;
}

.table thead th {
    border: none;
    padding: 1rem 1.25rem;
    background-color: var(--bg-card);
    font-weight: 800;
    text-transform: uppercase;
    font-size: 0.65rem;
    letter-spacing: 0.1em;
    color: var(--text-dim);
}

.table thead th:first-child {
    border-top-left-radius: var(--radius-lg);
    border-bottom-left-radius: var(--radius-lg);
}

.table thead th:last-child {
    border-top-right-radius: var(--radius-lg);
    border-bottom-right-radius: var(--radius-lg);
}

.table tbody tr {
    background-color: var(--bg-card);
    transition: var(--transition-base);
}

.table tbody tr td {
    border: none;
    padding: 1.25rem;
}

.table tbody tr td:first-child {
    border-top-left-radius: var(--radius-lg);
    border-bottom-left-radius: var(--radius-lg);
}

.table tbody tr td:last-child {
    border-top-right-radius: var(--radius-lg);
    border-bottom-right-radius: var(--radius-lg);
}

.table-hover tbody tr:hover {
    background-color: var(--bg-elevated) !important;
}

.table-responsive {
    border: none;
    background: transparent;
    overflow-x: auto;
}
.table-responsive .table {
    min-width: 0;
}

/* Distilled Form Inputs */
.form-control, .form-select {
    background-color: var(--bg-card);
    border: 1px solid var(--border-muted);
}
.text-muted {
    color: var(--text-dim) !important;
}

/* Search input group */
.search-box {
    position: relative;
}
.search-box .search-icon {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-dim);
    pointer-events: none;
    z-index: 4;
    font-size: 0.8rem;
}
.search-box .form-control {
    padding-left: 32px;
    border-radius: var(--radius-md) !important;
}

/* Table text overflow */
.table .cell-truncate {
    max-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.table .cell-wrap {
    max-width: 400px;
    word-break: break-all;
    overflow-wrap: break-word;
}

/* Risk Dot */
.risk-dot {
    box-shadow: 0 0 8px currentColor;
}


.form-control:focus {
    background-color: var(--bg-main);
    border-color: var(--accent);
    box-shadow: 0 0 0 4px var(--accent-glow);
    color: var(--text-main);
}

/* Buttons: Distinctive and weighted */
.btn {
    border-radius: var(--radius-md);
    font-weight: 600;
    font-size: 0.85rem;
    padding: 0.6rem 1.2rem;
    transition: var(--transition-base);
}

.btn-danger {
    background: var(--critical);
    border: none;
}

.btn-danger:hover {
    background: #e11d48;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(244, 63, 94, 0.3);
}

.btn-outline-light {
    border-color: var(--border-strong);
    color: var(--text-muted);
}

.btn-outline-light:hover {
    background: var(--bg-elevated);
    color: var(--text-main);
    border-color: var(--border-strong);
}

/* Drop Zone: Modern, Minimal */
.drop-zone {
    border: 2px dashed var(--border-strong);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, 0.01);
    transition: var(--transition-base);
}

.drop-zone:hover {
    border-color: var(--accent);
    background: rgba(99, 102, 241, 0.02);
}

/* Sitemap Tree: Clean and Accessible */
.sitemap-tree {
    font-size: 0.85rem;
}

.tree-item {
    padding: 8px 12px;
    border-radius: var(--radius-md);
    gap: 10px;
}

.tree-item:hover {
    background: var(--bg-elevated);
}

.tree-item-file.selected {
    background: var(--accent-glow);
    outline: 1px solid var(--accent);
}

.tree-icon-dir { color: #fbbf24; }
.tree-icon-file { color: var(--text-dim); }

.tree-children {
    border-left: 1px solid var(--border-muted);
    margin-left: 18px;
    padding-left: 16px;
}

/* Findings with tickets: left accent border */
.vuln-has-ticket td:first-child {
    border-left: 3px solid var(--info) !important;
}

/* Hidden findings: dimmed */
.vuln-hidden td {
    opacity: 0.5;
}

/* Markdown rendered content */
.markdown-body h1, .markdown-body h2, .markdown-body h3,
.markdown-body h4, .markdown-body h5, .markdown-body h6 {
    margin-top: 0.5em;
    margin-bottom: 0.25em;
    font-weight: 700;
}
.markdown-body h1 { font-size: 1.3rem; }
.markdown-body h2 { font-size: 1.15rem; }
.markdown-body h3 { font-size: 1.05rem; }
.markdown-body p { margin-bottom: 0.5em; }
.markdown-body code {
    background: var(--bg-elevated);
    padding: 0.15em 0.4em;
    border-radius: var(--radius-sm);
    font-size: 0.85em;
}
.markdown-body pre {
    background: var(--bg-main);
    border: 1px solid var(--border-muted);
    border-radius: var(--radius-md);
    padding: 0.75rem;
    overflow-x: auto;
}
.markdown-body pre code {
    background: transparent;
    padding: 0;
}
.markdown-body ul, .markdown-body ol {
    padding-left: 1.5em;
    margin-bottom: 0.5em;
}
.markdown-body blockquote {
    border-left: 3px solid var(--accent);
    padding-left: 0.75em;
    color: var(--text-muted);
    margin: 0.5em 0;
}
.markdown-body table {
    width: 100%;
    border-collapse: collapse;
    margin: 0.5em 0;
}
.markdown-body table th,
.markdown-body table td {
    border: 1px solid var(--border-muted);
    padding: 0.4em 0.6em;
}

/* Scrollbars */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--bg-main); }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: var(--text-dim); }