/*
 * Cheatography Sheet Style 1 — "Classic"
 *
 * Block headers are filled with the primary colour.
 * Cell rows are white; alternate (even) rows use the light tint.
 * No borders between cells — row colour creates the visual separation.
 * Note has a thick top border in the primary colour.
 * Links and inner cell dividers use the primary colour.
 *
 * Custom properties expected on .cs-sheet:
 *   --cs-primary        primary background colour (title bar fill only)
 *   --cs-accent         primary rendered as foreground (borders/links/text); dark-safe
 *   --cs-light          lightened version of primary (loop blend to threshold 729)
 *   --cs-title-color    title text colour (light shade or dark, depending on contrast)
 */

.cs-style-1 {
    background: #fff;
}
.dark .cs-style-1 {
    background: none;
}

/* Block wrapper */
.cs-style-1 .cs-block {
    margin-bottom: 12px;
    border-radius: 3px;
    border-bottom: 3px solid var(--cs-accent);
}
.cs-style-1 .cs-block[data-block-primary] {
    border-bottom-color: var(--cs-block-accent, var(--cs-accent));
}

/* Block title bar */
.cs-style-1 .cs-block-title {
    padding: 6px 8px;
    margin: 0;
    background: var(--cs-primary);
    color: var(--cs-title-color);
    border-radius: 3px 3px 0 0;
    font-size: 0.75rem;
    font-weight: bold;
    text-align: left;
}
.cs-style-1 .cs-block[data-block-primary] .cs-block-title {
    background: var(--cs-block-primary, var(--cs-primary));
    color: var(--cs-block-title-color, var(--cs-title-color));
}

/* Block content */
.cs-style-1 .cs-block-content {
    background: #fff;
}
.dark .cs-style-1 .cs-block-content {
    background: rgb(var(--color-surface-alt));
}

/* Table — no cell borders */
.cs-style-1 .cs-block-table {
    width: 100%;
    border-collapse: collapse;
}
.cs-style-1 .cs-block-table td {
    border: none;
    vertical-align: top;
    font-size: 0.75rem;
}

/* Zebra striping: even rows get the light tint */
.cs-style-1 .cs-block-table tr.cs-row-even td {
    background: var(--cs-light);
}
.cs-style-1 .cs-block[data-block-primary] .cs-block-table tr.cs-row-even td {
    background: var(--cs-block-light, var(--cs-light));
}

/* Links inside block content (text, tables, Q&A, notes) */
.cs-style-1 .cs-block-content a,
.cs-style-1 .cs-block-content a:visited,
.cs-style-1 .cs-block-content a:hover,
.cs-style-1 .cs-block-note a,
.cs-style-1 .cs-block-note a:visited,
.cs-style-1 .cs-block-note a:hover {
    color: var(--cs-accent);
    border-color: var(--cs-accent);
    text-decoration: underline;
}
.cs-style-1 .cs-block[data-block-primary] .cs-block-content a,
.cs-style-1 .cs-block[data-block-primary] .cs-block-content a:visited,
.cs-style-1 .cs-block[data-block-primary] .cs-block-content a:hover,
.cs-style-1 .cs-block[data-block-primary] .cs-block-note a,
.cs-style-1 .cs-block[data-block-primary] .cs-block-note a:visited,
.cs-style-1 .cs-block[data-block-primary] .cs-block-note a:hover {
    color: var(--cs-block-accent, var(--cs-accent));
    border-color: var(--cs-block-accent, var(--cs-accent));
    text-decoration: underline;
}

/* Inner div borders (e.g. {{br}}, {{bl}}) */
.cs-style-1 .cs-block-table div {
    border-color: var(--cs-accent) !important;
}
.cs-style-1 .cs-block[data-block-primary] .cs-block-table div {
    border-color: var(--cs-block-accent, var(--cs-accent)) !important;
}

/* Note: thick top border, light background */
.cs-style-1 .cs-block-note {
    border-top: 3px solid var(--cs-accent);
    background: var(--cs-light);
    font-size: 0.75rem;
    padding: 3px 8px;
    font-style: italic;
}
.cs-style-1 .cs-block[data-block-primary] .cs-block-note {
    border-top-color: var(--cs-block-accent, var(--cs-accent));
    background: var(--cs-block-light, var(--cs-light));
}

/* Section headings */
.cs-style-1 h2 {
    border-bottom: 3px solid var(--cs-accent);
}
