/* Rhyne & Marit's Bank -- shared ledger/parchment styling.
   Three accent palettes selected via a class on .ledger: theme-bank (the
   bank's own house colour), theme-bronze (Faedwyre Steelworks), theme-amethyst
   (the Faedwyre & Southbend Railway). Base structure follows the sample
   accounting pages in sample_data/. */

* { margin: 0; padding: 0; box-sizing: border-box; }

:root {
  --parchment-light: #f4e9c9;
  --parchment-mid: #e8d5a3;
  --parchment-shadow: #c4a35a;
  --ink-dark: #1a0f00;
  --ink-mid: #2c1810;
  --ink-faded: #6b4423;
  --ink-very-faded: #8b6444;
  --gold-line: #a9843a;
  --red-ink: #8b1a1a;
  --ok-ink: #2f6b3a;
}

body {
  background: #1c1712;
  background-image: radial-gradient(ellipse at 50% 0%, #2a2118 0%, #1c1712 70%);
  min-height: 100vh;
  padding: 32px 16px 60px;
  font-family: 'IM Fell English', Georgia, serif;
  color: var(--ink-mid);
}

a { color: inherit; }

/* --- theme palettes ------------------------------------------------ */
.theme-bank      { --accent: #1c3f5e; --accent-light: #7c8a96; --accent-pale: rgba(28,63,94,0.08); }
.theme-bronze    { --accent: #4A2E1A; --accent-light: #6b4526; --accent-pale: rgba(74,46,26,0.08); }
.theme-amethyst  { --accent: #5B2A86; --accent-light: #7c4aa8; --accent-pale: rgba(91,42,134,0.08); }

/* --- nav ribbon ------------------------------------------------------ */
.nav-ribbon {
  max-width: 840px;
  margin: 0 auto 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: 'IM Fell English SC', serif;
  font-size: 0.82rem;
  letter-spacing: 1px;
  color: rgba(232,220,200,0.75);
  padding: 0 6px;
}
.nav-ribbon a {
  color: rgba(244,233,201,0.85);
  text-decoration: none;
  border-bottom: 1px dotted rgba(244,233,201,0.4);
  margin-left: 18px;
}
.nav-ribbon a:hover { color: #fff; border-bottom-color: #fff; }
.nav-ribbon .whoami { opacity: 0.7; }

/* --- ledger sheet ---------------------------------------------------- */
.ledger {
  max-width: 840px;
  margin: 0 auto;
  background: var(--parchment-light);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='400' height='400' filter='url(%23noise)' opacity='0.06'/%3E%3C/svg%3E"),
    repeating-linear-gradient(transparent, transparent 27px, rgba(90,60,20,0.06) 28px);
  box-shadow: 0 0 0 1px rgba(60,40,15,0.25), 4px 6px 24px rgba(0,0,0,0.6);
  border-radius: 2px;
}

.letterhead {
  background: var(--accent, #4A2E1A);
  color: var(--parchment-light);
  padding: 34px 48px 26px;
  text-align: center;
  border-bottom: 4px double var(--gold-line);
}
.letterhead .company {
  font-family: 'Cinzel', serif;
  font-weight: 700;
  font-size: 1.5rem;
  letter-spacing: 3px;
}
.letterhead .subtitle {
  font-size: 0.85rem;
  letter-spacing: 1.5px;
  color: rgba(244,233,201,0.7);
  margin-top: 6px;
  font-style: italic;
}
.letterhead .period {
  margin-top: 18px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.78rem;
  letter-spacing: 1.5px;
  border-top: 1px solid rgba(244,233,201,0.3);
  border-bottom: 1px solid rgba(244,233,201,0.3);
  padding: 8px 0;
  display: inline-block;
}

.body-pad { padding: 32px 48px 44px; }

.prepared-line {
  text-align: right;
  font-size: 0.82rem;
  color: var(--ink-very-faded);
  font-style: italic;
  margin-bottom: 24px;
}

h2.section {
  font-family: 'Cinzel', serif;
  font-weight: 600;
  font-size: 1rem;
  letter-spacing: 2px;
  color: var(--accent, #4A2E1A);
  text-transform: uppercase;
  margin: 28px 0 12px;
  padding-bottom: 6px;
  border-bottom: 1.5px solid var(--accent, #4A2E1A);
}

table.ledger-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.98rem;
  margin-bottom: 4px;
}
table.ledger-table th {
  text-align: left;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.66rem;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--ink-very-faded);
  padding: 4px 6px 8px;
  border-bottom: 1px solid var(--ink-dark);
}
table.ledger-table th.num { text-align: right; }
table.ledger-table td {
  padding: 6px 6px;
  color: var(--ink-mid);
  border-bottom: 1px dotted var(--parchment-shadow);
  vertical-align: top;
}
table.ledger-table td.num {
  text-align: right;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.9rem;
  color: var(--ink-dark);
  white-space: nowrap;
}
tr.subtotal td {
  border-top: 1.5px solid var(--ink-dark);
  border-bottom: 3px double var(--ink-dark);
  font-weight: 600;
  padding-top: 8px;
}
tr.subtotal td.num { font-weight: 700; }
tr.grand td {
  border-top: 2px solid var(--accent, #4A2E1A);
  border-bottom: 4px double var(--accent, #4A2E1A);
  font-weight: 700;
  color: var(--accent, #4A2E1A);
  padding-top: 10px;
  font-size: 1.05rem;
}
tr.grand td.num { font-size: 1.1rem; }
tr.deduction td { color: var(--red-ink); }
tr.deduction td.num { color: var(--red-ink); }
tr.credit td.num { color: var(--ok-ink); }
tr.pending td { font-style: italic; opacity: 0.7; }
tr.pending td.num::after { content: ' (pending)'; font-size: 0.72rem; font-style: italic; }
tr.rejected td { text-decoration: line-through; opacity: 0.55; }

.status-badge {
  display: inline-block;
  font-family: 'IM Fell English SC', serif;
  font-size: 0.68rem;
  letter-spacing: 1px;
  padding: 2px 8px;
  border-radius: 2px;
  text-transform: uppercase;
}
.status-pending  { background: rgba(180,140,60,0.25); color: var(--ink-faded); }
.status-posted   { background: rgba(47,107,58,0.18);  color: var(--ok-ink); }
.status-rejected { background: rgba(139,26,26,0.15);  color: var(--red-ink); }

.note {
  font-size: 0.82rem;
  color: var(--ink-very-faded);
  font-style: italic;
  line-height: 1.65;
  margin: 10px 0 6px;
  padding-left: 14px;
  border-left: 2px solid var(--parchment-shadow);
}

.flash {
  margin: 0 0 18px;
  padding: 10px 16px;
  font-size: 0.9rem;
  border-left: 3px solid var(--ink-faded);
  background: rgba(180,140,60,0.12);
}
.flash.ok    { border-left-color: var(--ok-ink); background: rgba(47,107,58,0.12); }
.flash.error { border-left-color: var(--red-ink); background: rgba(139,26,26,0.1); }

.signature-block {
  margin-top: 44px;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.signature { text-align: center; }
.signature .line { width: 220px; border-top: 1px solid var(--ink-dark); margin-bottom: 6px; }
.signature .sig-name { font-family: 'Cinzel', serif; font-size: 0.95rem; letter-spacing: 1px; color: var(--ink-dark); }
.signature .sig-title { font-size: 0.78rem; color: var(--ink-very-faded); font-style: italic; }

.seal {
  width: 70px; height: 70px;
  border: 2px solid var(--accent, #4A2E1A);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center; text-align: center;
  color: var(--accent, #4A2E1A);
  font-family: 'Cinzel', serif;
  font-size: 0.6rem; letter-spacing: 1px; line-height: 1.3;
  opacity: 0.8;
}

.footer-note {
  text-align: center;
  font-size: 0.7rem;
  color: var(--ink-very-faded);
  letter-spacing: 1px;
  margin-top: 34px;
  padding-top: 14px;
  border-top: 1px solid var(--parchment-shadow);
  font-style: italic;
}

/* --- forms: still parchment, never "web app" chrome ------------------ */
.form-block { max-width: 420px; }
.field { margin-bottom: 18px; }
.field label {
  display: block;
  font-family: 'IM Fell English SC', serif;
  font-size: 0.78rem;
  letter-spacing: 1px;
  color: var(--ink-very-faded);
  margin-bottom: 5px;
  text-transform: uppercase;
}
.field input[type="text"],
.field input[type="password"],
.field input[type="number"],
.field select,
.field textarea {
  width: 100%;
  font-family: 'IM Fell English', Georgia, serif;
  font-size: 1rem;
  color: var(--ink-dark);
  background: rgba(255,255,255,0.25);
  border: none;
  border-bottom: 1.5px solid var(--ink-faded);
  padding: 7px 4px;
}
.field input:focus, .field select:focus, .field textarea:focus {
  outline: none;
  border-bottom-color: var(--accent, #4A2E1A);
  background: rgba(255,255,255,0.4);
}
.field .hint { font-size: 0.78rem; color: var(--ink-very-faded); font-style: italic; margin-top: 4px; }
.radio-row { display: flex; gap: 18px; }
.radio-row label { display: flex; align-items: center; gap: 6px; text-transform: none; font-family: 'IM Fell English', serif; font-size: 0.95rem; color: var(--ink-mid); }

.btn {
  display: inline-block;
  font-family: 'Cinzel', serif;
  font-size: 0.82rem;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--parchment-light);
  background: var(--accent, #4A2E1A);
  border: none;
  padding: 10px 22px;
  cursor: pointer;
  text-decoration: none;
}
.btn:hover { background: var(--accent-light, #6b4526); }
.btn.small { padding: 5px 12px; font-size: 0.72rem; }
.btn.reject { background: var(--red-ink); }
.btn.reject:hover { background: #a52323; }
.btn.link { background: none; color: var(--accent, #4A2E1A); text-decoration: underline; padding: 0; }

/* --- dashboard account cards ----------------------------------------- */
.account-list { list-style: none; }
.account-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 22px;
  margin-bottom: 12px;
  border: 1px solid var(--parchment-shadow);
  background: rgba(255,255,255,0.18);
  text-decoration: none;
  color: inherit;
}
.account-card:hover { background: rgba(255,255,255,0.32); }
.account-card .name { font-family: 'Cinzel', serif; font-size: 1.05rem; color: var(--ink-dark); }
.account-card .subtitle { font-size: 0.8rem; color: var(--ink-very-faded); font-style: italic; margin-top: 2px; }
.account-card .balance { font-family: 'JetBrains Mono', monospace; font-size: 1.15rem; color: var(--ink-dark); white-space: nowrap; }
.account-card .role-tag {
  font-family: 'IM Fell English SC', serif;
  font-size: 0.68rem;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--ink-very-faded);
  display: block;
  margin-top: 2px;
}

/* --- admin tables ------------------------------------------------------ */
table.admin-table { width: 100%; border-collapse: collapse; font-size: 0.92rem; margin: 14px 0 24px; }
table.admin-table th {
  text-align: left; font-family: 'JetBrains Mono', monospace; font-size: 0.66rem;
  letter-spacing: 1px; text-transform: uppercase; color: var(--ink-very-faded);
  padding: 6px; border-bottom: 1px solid var(--ink-dark);
}
table.admin-table td { padding: 8px 6px; border-bottom: 1px dotted var(--parchment-shadow); vertical-align: middle; }
table.admin-table td.num { text-align: right; font-family: 'JetBrains Mono', monospace; white-space: nowrap; }
table.admin-table .actions { display: flex; gap: 8px; }

.login-wrap { max-width: 380px; margin: 12vh auto 0; }
.center-note { text-align: center; margin-top: 18px; font-size: 0.85rem; color: rgba(232,220,200,0.6); }

@media (max-width: 640px) {
  .letterhead, .body-pad { padding-left: 24px; padding-right: 24px; }
  .nav-ribbon { flex-direction: column; align-items: flex-start; gap: 4px; padding: 0 10px; }
  .nav-ribbon a { margin-left: 0; margin-right: 16px; }
}