/************************************************************
 * 1. HIDE ONLY THE DATAVIEWJS CODE FENCE — NOT THE CONTENT
 ************************************************************/

/* Hide the code block wrapper, but ONLY if it contains dataviewjs */
pre:has(code.language-dataviewjs) {
    display: none !important;
}

/* Make sure DataviewJS-rendered content stays visible */
.dataviewjs-rendered {
    display: block !important;
    margin-top: 0.5rem;
}


/************************************************************
 * 2. CLEAN, THEME-FRIENDLY TABLE STYLING
 ************************************************************/

/* Use theme colors instead of forcing black/white */
table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.2em 0;
    font-size: 0.95rem;
}

/* Header row — subtle, theme-aware */
table th {
    background: var(--background-secondary);
    font-weight: 600;
    padding: 8px 10px;
    border-bottom: 1px solid var(--background-modifier-border);
}

/* Table cells */
table td {
    padding: 8px 10px;
    border-bottom: 1px solid var(--background-modifier-border);
}

/* Remove zebra striping entirely (theme-safe) */
table tr:nth-child(even) td {
    background: transparent;
}

/* Remove hover highlight */
table tr:hover td {
    background: transparent;
}


/************************************************************
 * 3. LINK STYLING INSIDE TABLES
 ************************************************************/

table a {
    color: var(--text-accent);
    font-weight: 600;
    text-decoration: none;
}

table a:hover {
    text-decoration: underline;
}


/************************************************************
 * 4. MOBILE-FRIENDLY TABLES
 ************************************************************/

@media (max-width: 700px) {
    table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
}

/************************************************************
 * 5. GRAPH VIEW — TIGHT CLUSTERS + FOLDER GROUP COLORS
 ************************************************************/

/* Base node color (fallback) */
.graph-view.color-fill {
    color: #88c0d0 !important;
}

/* Node border */
.graph-view.color-circle {
    color: #5e81ac !important;
}

/* Link color */
.graph-view.color-line {
    color: #4c566a !important;
    opacity: 0.8 !important;
}

/* Text labels */
.graph-view.color-text {
    color: #eceff4 !important;
}

/* Highlighted node */
.graph-view.color-fill-highlight {
    color: #bf616a !important;
}

/* Highlighted edges */
.graph-view.color-line-highlight {
    color: #bf616a !important;
}

/* Unresolved links (dimmed) */
.graph-view.color-fill-unresolved {
    color: #d08770 !important;
    opacity: 0.25 !important;
}