/* PocketForecast Harbor theme, from docs/design. Load after Bootstrap 5.3. */
@font-face{font-family:Inter;src:url('../fonts/Inter.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url('../fonts/Manrope.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap}
:root,[data-bs-theme="light"]{
 --pf-canvas:#f4f7fa;--pf-surface:#fff;--pf-text:#172e3f;--pf-muted:#576b7b;
 --pf-primary:#087f8c;--pf-primary-hover:#066c78;--pf-on-primary:#fff;
 --pf-line:#dce4eb;--pf-input-border:#8a9dae;--pf-tint:#e8f5f5;
 --pf-success:#23704a;--pf-warning:#946000;--pf-danger:#bd3545;
 --pf-series-1:#087f8c;--pf-series-2:#3d65cc;--pf-series-3:#8151bc;
 --pf-chart-color-weight:100%;
 --bs-body-font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
 --bs-body-bg:var(--pf-canvas);--bs-body-color:var(--pf-text);
 --bs-secondary-color:var(--pf-muted);--bs-border-color:var(--pf-line);
 --bs-link-color:var(--pf-primary);--bs-link-hover-color:var(--pf-primary-hover);
}
[data-bs-theme="dark"]{
 --pf-canvas:#0d1721;--pf-surface:#142330;--pf-text:#f1f5f9;--pf-muted:#a9bbc9;
 --pf-primary:#4ac5c8;--pf-primary-hover:#71d2d4;--pf-on-primary:#0d1721;
 --pf-line:#2e4354;--pf-input-border:#6f8b9f;--pf-tint:#183c42;
 --pf-success:#78d1a1;--pf-warning:#f4cd78;--pf-danger:#ff96a3;
 --pf-series-1:#4ac5c8;--pf-series-2:#8aa9ff;--pf-series-3:#c2a0f2;
 --pf-chart-color-weight:55%;
}
.pf-app h1,.pf-app h2,.pf-app h3{font-family:Manrope,system-ui,sans-serif;font-weight:700;letter-spacing:-.025em}
.pf-app h1{font-size:2rem;line-height:1.25}
.pf-app h2{font-size:1.25rem;line-height:1.4;font-weight:600}
.pf-app .pf-amount{font-variant-numeric:tabular-nums lining-nums;white-space:nowrap}
.pf-app .pf-balance{font-size:1.75rem;line-height:1.286;font-weight:600}
.pf-app .pf-muted{color:var(--pf-muted)}
.pf-app .pf-negative{color:var(--pf-danger)}
.pf-app .card{--bs-card-bg:var(--pf-surface);--bs-card-border-color:var(--pf-line);--bs-card-border-radius:.75rem}
.pf-app .modal-content{background:var(--pf-surface);border-color:var(--pf-line);border-radius:1rem}
.pf-app .btn-primary{
 --bs-btn-bg:var(--pf-primary);--bs-btn-border-color:var(--pf-primary);--bs-btn-color:var(--pf-on-primary);
 --bs-btn-hover-bg:var(--pf-primary-hover);--bs-btn-hover-border-color:var(--pf-primary-hover);--bs-btn-hover-color:var(--pf-on-primary);
 --bs-btn-active-bg:var(--pf-primary-hover);--bs-btn-active-border-color:var(--pf-primary-hover);--bs-btn-active-color:var(--pf-on-primary);
 --bs-btn-disabled-bg:var(--pf-primary);--bs-btn-disabled-border-color:var(--pf-primary);--bs-btn-disabled-color:var(--pf-on-primary);
}
.pf-app .btn{min-height:44px;border-radius:.375rem;font-weight:600}
.pf-app .form-control,.pf-app .form-select{min-height:44px;font-size:1rem;background-color:var(--pf-surface);color:var(--pf-text);border-color:var(--pf-input-border);border-radius:.375rem}
.pf-app .form-control:focus,.pf-app .form-select:focus{border-color:var(--pf-primary);box-shadow:none;outline:2px solid var(--pf-primary);outline-offset:2px}
.pf-app :is(a,button,[tabindex]):focus-visible{outline:2px solid var(--pf-primary);outline-offset:3px}
.pf-app .pf-shell{max-width:1440px;margin-inline:auto;padding-inline:24px}
@media(max-width:575.98px){.pf-app .pf-shell{padding-inline:16px}.pf-app h1{font-size:1.625rem;line-height:1.308}}
@media(prefers-reduced-motion:reduce){.pf-app *,.pf-app *::before,.pf-app *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Map Bootstrap components and utilities to both Harbor modes. */
:root, [data-bs-theme="light"] {
  color-scheme: light;
  --pf-ink: #132b3a;
  --bs-primary: var(--pf-primary);
  --bs-primary-rgb: 8, 127, 140;
  --bs-secondary-rgb: 87, 107, 123;
  --bs-success-rgb: 35, 112, 74;
  --bs-warning-rgb: 148, 96, 0;
  --bs-danger-rgb: 189, 53, 69;
  --bs-link-color-rgb: 8, 127, 140;
  --bs-link-hover-color-rgb: 6, 108, 120;
  --bs-emphasis-color: var(--pf-text);
  --bs-tertiary-bg: var(--pf-tint);
  --bs-border-radius: .375rem;
}

[data-bs-theme="dark"] {
  color-scheme: dark;
  --pf-ink: #f1f5f9;
  --bs-primary-rgb: 74, 197, 200;
  --bs-secondary-rgb: 169, 187, 201;
  --bs-success-rgb: 120, 209, 161;
  --bs-warning-rgb: 244, 205, 120;
  --bs-danger-rgb: 255, 150, 163;
  --bs-link-color-rgb: 74, 197, 200;
  --bs-link-hover-color-rgb: 113, 210, 212;
}

body { min-height: 100vh; display: flex; flex-direction: column; }
main { flex: 1; }
.app-header { background: var(--pf-surface); }
.navbar-brand { margin: 0; padding: 10px; }
.navbar-brand img { display: block; width: 216px; height: auto; }
.navbar-brand .brand-dark { display: none; }
[data-bs-theme="dark"] .navbar-brand .brand-light { display: none; }
[data-bs-theme="dark"] .navbar-brand .brand-dark { display: block; }
.navbar .nav-link { padding-block: 12px; color: var(--pf-text); }
.navbar .nav-link:hover { color: var(--pf-primary); text-decoration: underline; }
.eyebrow { font-size: .75rem; line-height: 1.5; letter-spacing: .1em; text-transform: uppercase; font-weight: 700; color: var(--pf-primary); }
.measure { max-width: 34rem; }
.auth-panel { max-width: 32rem; padding: 32px; background: var(--pf-surface); border: 1px solid var(--pf-line); border-radius: 12px; }
.pf-app .availability-card { --bs-card-bg: var(--pf-tint); }
.skip-link { position: absolute; z-index: 1100; padding: 12px; background: var(--pf-surface); }
.pf-app .theme-select { display: inline-block; width: auto; }
.form-label { font-size: .875rem; line-height: 1.43; font-weight: 500; }
.form-text { font-size: .75rem; line-height: 1.5; color: var(--pf-muted); }
.validation-summary-errors { margin-bottom: 16px; }
.field-validation-error { display: block; margin-top: 4px; font-size: .875rem; }
.pf-app .input-validation-error { border-color: var(--pf-danger); }
.pf-app .form-control[readonly] { background: var(--pf-canvas); }
.pf-app .form-check { min-height: 44px; display: flex; align-items: center; gap: 8px; }
.pf-app .form-check-input { flex-shrink: 0; margin-top: 0; border-color: var(--pf-input-border); }
.pf-app .form-check-label { padding-block: 10px; }
.pf-app .form-check-input:checked { background-color: var(--pf-primary); border-color: var(--pf-primary); }
.pf-app .form-check-input:focus-visible { outline: 2px solid var(--pf-primary); outline-offset: 3px; box-shadow: none; }
.pf-app .btn-outline-secondary {
  --bs-btn-color: var(--pf-text);
  --bs-btn-border-color: var(--pf-input-border);
  --bs-btn-hover-color: var(--pf-text);
  --bs-btn-hover-bg: var(--pf-tint);
  --bs-btn-hover-border-color: var(--pf-muted);
  --bs-btn-active-color: var(--pf-text);
  --bs-btn-active-bg: var(--pf-tint);
  --bs-btn-active-border-color: var(--pf-muted);
  --bs-btn-disabled-color: var(--pf-muted);
  --bs-btn-disabled-border-color: var(--pf-input-border);
}
.pf-app .alert-info { --bs-alert-color: var(--pf-text); --bs-alert-bg: var(--pf-tint); --bs-alert-border-color: var(--pf-primary); }
.pf-app .list-group { --bs-list-group-bg: var(--pf-surface); --bs-list-group-color: var(--pf-text); --bs-list-group-border-color: var(--pf-line); }

@media (max-width: 575.98px) {
  .navbar .pf-shell { gap: 8px; }
  .navbar-brand { padding-inline: 8px; }
  .navbar-brand img { width: 190px; }
  .auth-panel { padding: 24px; }
}

/* Financial overview and the shared Bootstrap editor. */
.forecast-drawing svg { display: block; width: 100%; min-height: 240px; touch-action: pan-y; }
.chart-grid { stroke: var(--pf-line); }
.chart-zero { stroke: var(--pf-muted); stroke-dasharray: 4 3; }
.chart-label { fill: var(--pf-muted); font-size: 12px; }
.chart-swatch { margin-right: 8px; vertical-align: middle; }
.transaction-name { text-align: left; white-space: normal; }
.transaction-balances { grid-column: 1 / -1; }
.chart-negative-zone { fill: var(--pf-danger); opacity: .07; }
.chart-point.negative { stroke: var(--pf-danger); stroke-width: 3; }
.chart-point.selected { stroke: var(--pf-text); stroke-width: 3; r: 7px; }
.forecast-drawing svg:focus-visible { outline: 2px solid var(--pf-primary); outline-offset: 3px; }
.balance-button { display: block; padding: 0; border: 0; background: transparent; color: var(--pf-text); text-align: left; min-height: 44px; text-decoration: underline; text-decoration-color: var(--pf-input-border); text-underline-offset: 6px; }
.transaction-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(130px, .6fr) minmax(180px, .75fr) auto; gap: 16px; align-items: center; }
.transaction-amount { text-align: right; }
.transaction-table-wrap { max-height: 42rem; border: 1px solid var(--pf-line); border-radius: .75rem; background: var(--pf-surface); }
.transaction-table { --bs-table-bg: var(--pf-surface); --bs-table-color: var(--pf-text); --bs-table-hover-bg: var(--pf-tint); font-size: .875rem; }
.transaction-table th, .transaction-table td { padding: .75rem; vertical-align: middle; }
.transaction-table thead th { position: sticky; top: 0; z-index: 1; background: var(--pf-ink); color: var(--pf-canvas); font-weight: 600; }
[data-bs-theme="dark"] .transaction-table thead th { background: var(--pf-tint); color: var(--pf-text); }
.transaction-table .transaction-description { min-width: 190px; max-width: 300px; font-weight: 500; overflow-wrap: anywhere; }
.transaction-table .transaction-name { min-height: 32px; font-size: .875rem; }
.transaction-table .transaction-date { min-width: 86px; }
.transaction-table .balance-column { min-width: 130px; border-left: 1px solid var(--pf-line); }
.transaction-table .total-column { min-width: 120px; border-left: 2px solid var(--pf-line); font-weight: 700; background: var(--pf-tint); }
.transaction-table thead .total-column { background: var(--pf-ink); }
[data-bs-theme="dark"] .transaction-table thead .total-column { background: var(--pf-tint); }
.transaction-table .balance-changed { font-weight: 700; }
.transaction-table .transaction-actions-cell { min-width: 154px; max-width: 180px; }
.transaction-table .transaction-actions-cell .btn { min-height: 32px; font-size: .75rem; }
.transaction-table .balance-summary-row > * { background: var(--pf-tint); font-weight: 600; }
.transaction-table .pf-negative { color: var(--pf-danger); }
.transaction-table [hidden] { display: none !important; }
.transaction-notes { margin-top: .25rem; }
@media (max-width: 991.98px) {
  .transaction-table-wrap { max-height: none; overflow: visible; border: 0; background: transparent; }
  .transaction-table, .transaction-table tbody, .transaction-table tfoot { display: block; }
  .transaction-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .transaction-table tr { display: block; margin-bottom: 1rem; border: 1px solid var(--pf-line); border-radius: .75rem; overflow: hidden; background: var(--pf-surface); }
  .transaction-table td, .transaction-table th { display: block; padding: .5rem 1rem; border: 0; min-width: 0; max-width: none; }
  .transaction-table .transaction-description { min-width: 0; max-width: none; }
  .transaction-table [data-label] { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .25rem 1rem; text-align: right; }
  .transaction-table [data-label]::before { content: attr(data-label); text-align: left; white-space: normal; font-weight: 500; color: var(--pf-muted); max-width: 65%; }
  .transaction-table .balance-column { min-width: 0; border-top: 1px solid var(--pf-line); border-left: 0; }
  .transaction-table .total-column { min-width: 0; border-top: 1px solid var(--pf-line); border-left: 0; }
  .transaction-table .transaction-date { font-size: .8125rem; }
  .transaction-table .transaction-actions-cell { min-width: 0; max-width: none; padding-block: .75rem; }
  .transaction-table .transaction-actions-cell .btn, .transaction-table .transaction-name { min-height: 44px; font-size: .875rem; }
  .transaction-table .summary-spacer { display: none; }
}
.transaction-actions { max-width: 230px; }
.pf-app .transaction-row .badge { background: var(--pf-tint) !important; color: var(--pf-text) !important; font-weight: 500; white-space: normal; text-align: left; }
.pf-app .btn-link { color: var(--pf-primary); }
#finance-modal-content > form { display: flex; flex-direction: column; overflow: hidden; max-height: 100%; }
#finance-modal .modal-body { overflow-y: auto; }
#finance-modal .form-check-label { cursor: pointer; }
#finance-modal legend { float: none; width: auto; }
#finance-modal .validation-summary-errors { padding: 12px; border-left: 3px solid var(--pf-danger); }
.pf-app .btn-outline-danger { --bs-btn-color: var(--pf-danger); --bs-btn-border-color: var(--pf-danger); }
@media (max-width: 767.98px) {
  .transaction-row { grid-template-columns: minmax(0, 1fr) minmax(100px, auto); }
  .transaction-row > div:first-child { grid-column: 1 / -1; }
  .transaction-amount { text-align: left; }
  .transaction-actions { grid-column: 1 / -1; max-width: none; justify-content: flex-start; }
}