/*
Theme Name: DynamicACG Ledger
Theme URI: https://dynamicacg.com
Author: Dwayne Hinnant
Author URI: https://dynamicacg.com
Description: A ledger for dynamicacg.com. Figures are the content, not the decoration: rules and columns instead of cards, tabular numerals, debits in red. One light palette, self-hosted type, no page builder, no licence.
Version: 1.1.0
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dynamicacg-ledger
Tags: blog, one-column, block-patterns, full-site-editing
*/

/* --------------------------------------------------------------------------
   Single palette, light only.

   Dark mode was built and removed on 26 Sep 2026 — it did not look right for
   this design. `color-scheme` stays `light` deliberately: declaring `light dark`
   without a dark palette makes the browser render native controls, scrollbars
   and form fields dark against a light page.
   -------------------------------------------------------------------------- */

:root {
  --dacg-underline: #B9B5A8;
  color-scheme: light;
}

body {
  background: var(--wp--preset--color--base);
  color: var(--wp--preset--color--contrast);
}

/* --------------------------------------------------------------------------
   Links: underlined by default, in a rule-weight colour, red on hover.
   -------------------------------------------------------------------------- */

.wp-site-blocks a:where(:not(.wp-element-button)) {
  text-decoration: underline;
  text-decoration-color: var(--dacg-underline);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.wp-site-blocks a:where(:not(.wp-element-button)):hover {
  text-decoration-color: var(--wp--preset--color--debit);
}

:where(a, button, input, select, textarea, summary, [tabindex="0"]):focus-visible {
  outline: 2px solid var(--wp--preset--color--debit);
  outline-offset: 3px;
}

/* --------------------------------------------------------------------------
   Figures.

   JetBrains Mono appears here and nowhere else. It is for numbers in columns,
   never for labels — a monospace label is decoration, a monospace figure is
   a column that lines up.
   -------------------------------------------------------------------------- */

.dacg-figure,
.wp-block-table.is-style-ledger td:not(:first-child),
.wp-block-table.is-style-ledger th:not(:first-child) {
  font-family: var(--wp--preset--font-family--figures);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
  letter-spacing: -0.01em;
}

.dacg-debit { color: var(--wp--preset--color--debit); }

/* --------------------------------------------------------------------------
   The ledger table.

   Rules and columns carry the structure. No cell borders, no card, no radius:
   the horizontal rule is the organising device, exactly as on ruled paper.
   -------------------------------------------------------------------------- */

.wp-block-table.is-style-ledger table {
  width: 100%;
  border-collapse: collapse;
}

.wp-block-table.is-style-ledger th,
.wp-block-table.is-style-ledger td {
  border: 0;
  padding: 0.7rem 0;
}

.wp-block-table.is-style-ledger thead tr {
  border-top: 2px solid var(--wp--preset--color--contrast);
  border-bottom: 1px solid var(--wp--preset--color--contrast);
}

.wp-block-table.is-style-ledger th {
  font-weight: 600;
  text-align: left;
}

.wp-block-table.is-style-ledger td:not(:first-child),
.wp-block-table.is-style-ledger th:not(:first-child) {
  text-align: right;
}

/* Greenbar: the alternating tint of accounting paper. The inline padding keeps
   the tint from running flush against the figures. */
.wp-block-table.is-style-ledger tbody tr:nth-child(even) {
  background: var(--wp--preset--color--band);
}

.wp-block-table.is-style-ledger tbody tr:nth-child(even) td:first-child { padding-left: 0.625rem; }
.wp-block-table.is-style-ledger tbody tr:nth-child(even) td:last-child  { padding-right: 0.625rem; }

/* A closing balance carries the double rule, as it would on paper. */
.wp-block-table.is-style-ledger tfoot tr {
  border-top: 1px solid var(--wp--preset--color--contrast);
  font-weight: 700;
}

.wp-block-table.is-style-ledger tfoot td:last-child {
  border-bottom: 3px double var(--wp--preset--color--contrast);
}

.wp-block-table.is-style-ledger figcaption,
.wp-block-table.is-style-ledger caption {
  caption-side: top;
  text-align: left;
  padding-bottom: 0.75rem;
  font-size: var(--wp--preset--font-size--small);
  color: var(--wp--preset--color--muted);
}

/* Tables are the one thing that cannot reflow: let them scroll rather than
   crush the columns. functions.php gives every table figure tabindex="0",
   role="region" and an aria-label, so the scroll area is reachable by
   keyboard (axe: scrollable-region-focusable). */
@media (max-width: 40rem) {
  .wp-block-table.is-style-ledger { overflow-x: auto; }
  .wp-block-table.is-style-ledger table { min-width: 30rem; }
}

/* --------------------------------------------------------------------------
   Entry rows — the archive and the "latest entries" list.
   -------------------------------------------------------------------------- */

.dacg-entry {
  display: flex;
  gap: 1.75rem;
  align-items: baseline;
  padding: 1.15rem 0;
  border-bottom: 1px solid var(--wp--preset--color--rule);
}

.dacg-entry__date {
  flex: 0 0 6.75rem;
  font-family: var(--wp--preset--font-family--figures);
  font-size: var(--wp--preset--font-size--small);
  color: var(--wp--preset--color--muted);
}

.dacg-entry__body { flex: 1 1 auto; }

.dacg-entry__figure {
  flex: 0 0 11rem;
  text-align: right;
  font-family: var(--wp--preset--font-family--figures);
  font-variant-numeric: tabular-nums;
}

@media (max-width: 40rem) {
  .dacg-entry { flex-wrap: wrap; gap: 0.35rem; }
  .dacg-entry__date,
  .dacg-entry__figure { flex-basis: 100%; text-align: left; }
}

.dacg-entry > * { margin-block: 0; }
.dacg-entry__body > * { margin-block: 0.25rem 0; }
.dacg-entry__body > :first-child { margin-top: 0; }
.dacg-entry__figure p { margin: 0; }

/* Figures bound to post meta. An entry with no figure shows nothing. */
.dacg-fig:empty,
.dacg-fig-label:empty { display: none; }

.dacg-fig {
  font-family: var(--wp--preset--font-family--figures);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

.dacg-fig-label {
  font-size: var(--wp--preset--font-size--small);
  color: var(--wp--preset--color--muted);
  line-height: 1.35;
}

/* --------------------------------------------------------------------------
   A single entry.

   DOM order is title -> dateline -> body -> provenance, so a screen reader or
   a phone reads the entry first. On wide screens the provenance column is
   moved into the left margin visually (order:-1); it holds only secondary
   facts, so the visual/DOM difference does not change meaning.
   -------------------------------------------------------------------------- */

@media (min-width: 782px) {
  .dacg-single > .dacg-provenance-col { order: -1; }
}

.dacg-dateline {
  font-family: var(--wp--preset--font-family--figures);
  font-size: var(--wp--preset--font-size--small);
  color: var(--wp--preset--color--muted);
}

.dacg-dateline > * { margin: 0; }

.dacg-provenance .dacg-fig {
  font-size: var(--wp--preset--font-size--x-large);
  line-height: 1.2;
}

.dacg-provenance {
  border-top: 2px solid var(--wp--preset--color--contrast);
  padding-top: 0.875rem;
  font-size: var(--wp--preset--font-size--small);
}

.dacg-provenance dt {
  color: var(--wp--preset--color--muted);
  margin-top: 1rem;
}

.dacg-provenance dt:first-child { margin-top: 0; }

.dacg-provenance dd {
  margin: 0.2rem 0 0;
  line-height: 1.45;
}

/* --------------------------------------------------------------------------
   Navigation: 44px targets, and an overlay in the site palette.
   -------------------------------------------------------------------------- */

.wp-block-navigation .wp-block-navigation-item__content {
  display: inline-block;
  min-height: 44px;
  line-height: 44px;
}

.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.wp-block-navigation__responsive-container.is-menu-open {
  padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
  background: var(--wp--preset--color--base);
  color: var(--wp--preset--color--contrast);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
  gap: var(--wp--preset--spacing--20);
  font-size: var(--wp--preset--font-size--large);
}

.wp-block-navigation .current-menu-item > a,
.wp-block-navigation a[aria-current="page"] {
  text-decoration-color: var(--wp--preset--color--contrast);
  text-decoration-thickness: 2px;
}

/* --------------------------------------------------------------------------
   Print: the ledger should photocopy.
   -------------------------------------------------------------------------- */

@media print {
  :root { --wp--preset--color--base: #FFFFFF; --wp--preset--color--contrast: #000000; }
  .wp-block-navigation, .dacg-no-print { display: none !important; }
  .wp-site-blocks a { text-decoration: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* --------------------------------------------------------------------------
   The subscribe form (the one bit of raw HTML in a pattern).
   -------------------------------------------------------------------------- */

.dacg-subscribe label {
  display: block;
  margin-bottom: 0.45rem;
  font-size: var(--wp--preset--font-size--small);
  color: var(--wp--preset--color--muted);
}

.dacg-subscribe__row {
  display: flex;
  gap: 0.625rem;
  flex-wrap: wrap;
}

.dacg-subscribe input[type="email"] {
  flex: 1 1 15rem;
  min-height: 48px;
  padding: 0 0.875rem;
  font-family: inherit;
  font-size: var(--wp--preset--font-size--medium);
  color: var(--wp--preset--color--contrast);
  background: var(--wp--preset--color--base);
  border: 1px solid var(--wp--preset--color--contrast);
  border-radius: 0;
}

.dacg-subscribe button {
  min-height: 48px;
  padding: 0 1.375rem;
  font-family: inherit;
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 600;
  color: var(--wp--preset--color--base);
  background: var(--wp--preset--color--contrast);
  border: 1px solid var(--wp--preset--color--contrast);
  border-radius: 0;
  cursor: pointer;
}

.dacg-subscribe button:hover {
  background: var(--wp--preset--color--debit);
  border-color: var(--wp--preset--color--debit);
}

.dacg-subscribe .dacg-hp {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.dacg-subscribe__status {
  margin: 0 0 0.75rem;
  padding: 0.6rem 0.875rem;
  border-left: 3px solid var(--wp--preset--color--contrast);
  background: var(--wp--preset--color--base);
}

.dacg-subscribe__status.is-error { border-left-color: var(--wp--preset--color--debit); }

.dacg-subscribe__note {
  margin: 0.6rem 0 0;
  font-size: var(--wp--preset--font-size--small);
  color: var(--wp--preset--color--muted);
}