/*
 * Cheatography Sheet Style 2 — "Modern"
 *
 * Full page background uses the light tint (applied via inline <style> on body / #cs-content-inner).
 * Blocks are white cards with a subtle shadow; title text is coloured, no filled header.
 * All table cells use the light tint — no zebra striping.
 * Note has a thin top border in the light tint.
 *
 * Custom properties expected on .cs-sheet:
 *   --cs-primary          primary colour
 *   --cs-accent           primary rendered as foreground (borders/links); dark-safe
 *   --cs-light            lightened version of primary
 *   --cs-title-color-s2   primary or #222, depending on contrast
 */

#cs-content-inner {
    background: var(--cs-light);
}

/* Block wrapper: no colour fill, no bottom border */
.cs-style-2 .cs-block {
    background: none;
    border-bottom: none;
    margin-bottom: 25px;
    border-radius: 0;
}

/* Title: coloured text, no fill */
.cs-style-2 .cs-block-title {
    padding: 6px 13px;
    margin: 0;
    background: transparent;
    color: var(--cs-title-color-s2);
    font-size: 0.75rem;
    font-weight: bold;
    text-align: left;
}
.cs-style-2 .cs-block[data-block-primary] .cs-block-title {
    color: var(--cs-block-title-color-s2, var(--cs-title-color-s2));
}

/* White card for block content */
.cs-style-2 .cs-block-content {
    background: #fff;
    border-radius: 3px;
    padding: 5px;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
}
.dark .cs-style-2 .cs-block-content {
    background: rgb(var(--color-surface-alt));
}

/* Table — no cell borders, zebra striping (even rows = light tint, odd = white card) */
.cs-style-2 .cs-block-table {
    width: 100%;
    border-collapse: collapse;
}
.cs-style-2 .cs-block-table td {
    border: none;
    vertical-align: top;
    font-size: 0.75rem;
}
.cs-style-2 .cs-block-table tr.cs-row-even td {
    background: var(--cs-light);
}
.cs-style-2 .cs-block[data-block-primary] .cs-block-table tr.cs-row-even td {
    background: var(--cs-block-light, var(--cs-light));
}

/* Links coloured with primary */
.cs-style-2 .cs-tag-link,
.cs-style-2 .cs-tag-link:visited,
.cs-style-2 .cs-tag-link:hover {
    color: var(--cs-accent);
    border-color: var(--cs-accent);
}
.cs-style-2 .cs-block-content a,
.cs-style-2 .cs-block-content a:visited,
.cs-style-2 .cs-block-content a:hover,
.cs-style-2 .cs-block-note a,
.cs-style-2 .cs-block-note a:visited,
.cs-style-2 .cs-block-note a:hover {
    color: var(--cs-accent);
    border-color: var(--cs-accent);
    text-decoration: underline;
}
.cs-style-2 .cs-block[data-block-primary] .cs-block-content a,
.cs-style-2 .cs-block[data-block-primary] .cs-block-content a:visited,
.cs-style-2 .cs-block[data-block-primary] .cs-block-content a:hover,
.cs-style-2 .cs-block[data-block-primary] .cs-block-note a,
.cs-style-2 .cs-block[data-block-primary] .cs-block-note a:visited,
.cs-style-2 .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 use light tint */
.cs-style-2 .cs-block-table div {
    border-color: var(--cs-light) !important;
}
.cs-style-2 .cs-block[data-block-primary] .cs-block-table div {
    border-color: var(--cs-block-light, var(--cs-light)) !important;
}

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

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