/* FahamPesa premium typography and readability foundation */
:root {
  --fp-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --fp-text-primary: #17243a;
  --fp-text-secondary: #526276;
  --fp-text-muted: #6b7789;
  --fp-text-disabled: #929eae;
  --fp-font-body: 14px;
  --fp-font-label: 13px;
  --fp-font-control: 14px;
  --fp-font-table: 13.5px;
  --fp-line-body: 1.5;
  --fp-navy: var(--fp-text-primary);
  --text: var(--fp-text-primary);
  --navy: var(--fp-text-primary);
  --muted: var(--fp-text-secondary);
}

html { font-size: 16px; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  color: var(--fp-text-primary);
  font-family: var(--fp-font-family);
  font-size: var(--fp-font-body);
  font-weight: 400;
  line-height: var(--fp-line-body);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
button, input, select, textarea {
  color: var(--fp-text-primary);
  font-family: var(--fp-font-family);
  font-size: var(--fp-font-control);
  line-height: 1.4;
}
input::placeholder, textarea::placeholder { color: #778396; opacity: 1; }
button:disabled, input:disabled, select:disabled, textarea:disabled, [aria-disabled="true"] { color: var(--fp-text-disabled); }
.main p, .main li, .main dd, .main dt { line-height: 1.5; }
.main small { line-height: 1.45; }

body:not(.pos-mode) .main h1 {
  color: var(--fp-text-primary);
  font-size: clamp(1.375rem, 1.05rem + 1.15vw, 1.875rem);
  font-weight: 730;
  line-height: 1.18;
  letter-spacing: -.025em;
}
body:not(.pos-mode) .main h2 { color: var(--fp-text-primary); font-size: clamp(1rem, .94rem + .25vw, 1.125rem); font-weight: 680; line-height: 1.3; }
body:not(.pos-mode) .main h3 { color: var(--fp-text-primary); font-size: clamp(.9rem, .86rem + .18vw, 1rem); font-weight: 650; line-height: 1.35; }
.page-heading p, .dashboard-intro p, [class*="-page-subtitle"], [class*="-header-copy"] p, [class*="-section-heading"] p {
  color: var(--fp-text-secondary); font-size: 14px; font-weight: 450; line-height: 1.5;
}

/* Navigation and persistent workspace header */
.sidebar .brand-product, .sidebar .nav-label { color: var(--fp-text-secondary); }
.sidebar .nav a, .sidebar-settings { color: #405169; font-size: 14px; font-weight: 560; line-height: 1.35; }
.sidebar .nav a.active, .sidebar-settings.active { color: var(--fp-primary-strong); font-weight: 670; }
.local-status, .workspace-title span, .branch-selector, .topbar [class*="staff-"] { color: var(--fp-text-secondary); font-size: 13px; font-weight: 520; }
.workspace-title strong, .branch-selector select, .topbar button { color: var(--fp-text-primary); font-weight: 620; }
.workspace-title strong { font-size: 15px; }
.workspace-title span { font-size: 12.5px; }
.branch-selector { font-size: 12px; }
.branch-selector select { font-size: 13.5px; }

/* Forms and controls */
.main form label, .main .premium-field, .main [class*="-field"] > label, .main [class*="-field"] > span:first-child,
.reference-access-page form label, .reference-field {
  color: #34465e; font-size: var(--fp-font-label); font-weight: 620; line-height: 1.4;
}
.main input, .main select, .main textarea, .reference-access-page input, .reference-access-page select, .reference-access-page textarea {
  color: var(--fp-text-primary); font-size: var(--fp-font-control); font-weight: 500; line-height: 1.45;
}
.premium-help, .premium-error, .main form label small, .main [class*="-field"] small, .reference-field small {
  color: var(--fp-text-muted); font-size: 12px; font-weight: 450; line-height: 1.45;
}
.main button, .main a[class*="button"], .main [class*="-button"] { font-size: 13.5px; font-weight: 620; line-height: 1.35; }
.main .primary, .main .cash-button, .main [class*="primary-button"], .main [class*="-primary"] { font-size: 14px; font-weight: 680; }

/* Tables and dense business lists */
.main table, .main [class*="-table"] { color: var(--fp-text-primary); font-size: var(--fp-font-table); line-height: 1.45; }
.main table th, .main [class*="-table"] th, .main [class*="-table-head"] { color: #405169; font-size: 12.5px; font-weight: 670; letter-spacing: .01em; }
.main table td, .main [class*="-table"] td { color: #27374d; font-size: 13.5px; font-weight: 480; }
.main table td strong, .main [class*="-table"] td strong, .main [class*="-row-title"] { color: var(--fp-text-primary); font-weight: 620; }
.main table td small, .main [class*="-table"] td small, .main [class*="-row-subtitle"] { color: var(--fp-text-secondary); font-size: 12px; font-weight: 450; }
.status-chip, [class*="status-chip"], [class*="status-pill"], [class*="sync-chip"] { font-size: 11.5px; font-weight: 670; line-height: 1.25; }

/* Shared business summary hierarchy */
.dashboard-metric span, .inventory-metric-card > span, .sales-summary-card span, .debt-summary-card span,
.expense-summary-card span, .invoice-summary-card span, .procurement-summary-card span, .accounting-metric-card span,
.reports-kpi-card > span, .staff-summary-card span, .settings-summary-card > div > span, .branch-dashboard-metric > div > span {
  color: var(--fp-text-secondary); font-size: 13px; font-weight: 600; line-height: 1.35;
}
.dashboard-metric strong, .inventory-metric-card > strong, .sales-summary-card strong, .debt-summary-card strong,
.expense-summary-card strong, .invoice-summary-card strong, .procurement-summary-card strong, .accounting-metric-card strong,
.reports-kpi-card > strong, .staff-summary-card strong, .settings-summary-card strong, .branch-dashboard-metric > div > strong {
  color: var(--fp-text-primary); font-size: clamp(1.25rem, 1.05rem + .7vw, 1.7rem); font-weight: 720;
  line-height: 1.18; letter-spacing: -.02em; font-variant-numeric: tabular-nums;
}
.inventory-metric-card > small, .sales-summary-card small, .debt-summary-card small, .expense-summary-card small,
.invoice-summary-card small, .procurement-summary-card small, .accounting-metric-card small, .reports-kpi-card > small,
.staff-summary-card small, .settings-summary-card small, .branch-dashboard-metric > div > small {
  color: var(--fp-text-muted); font-size: 12px; font-weight: 450; line-height: 1.4;
}
.invoice-total-row span, .invoice-totals-card span, .sale-totals-card span, .total-row, [class*="summary-total"] span {
  color: var(--fp-text-secondary); font-size: 13px; font-weight: 520;
}
.invoice-total-row strong, .invoice-totals-card strong, .sale-totals-card strong, .total-row strong, [class*="summary-total"] strong {
  color: var(--fp-text-primary); font-size: 16px; font-weight: 680; font-variant-numeric: tabular-nums;
}
.invoice-totals-card .grand strong, .invoice-balance-cell, [class*="balance-due"] strong { font-size: 20px; font-weight: 740; }

/* POS remains dense while product names and prices stay clear */
.pos-shell, .restaurant-shell, .salon-pos-shell, .services-pos-shell { color: var(--fp-text-primary); font-size: 14px; }
.product-card strong, .restaurant-menu-card strong, [class*="product-card"] strong, [class*="menu-card"] strong {
  color: var(--fp-text-primary); font-size: 14.5px; font-weight: 650; line-height: 1.35;
}
.product-card > span:not(.product-category), [class*="product-card"] [class*="price"], [class*="menu-card"] [class*="price"] {
  font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums;
}
.pos-search, .barcode-input, .payment-panel label { color: #405169; font-size: 13px; font-weight: 620; }

/* Accounting keeps compact spacing with readable financial text */
.accounting-v2 { --acc-navy: var(--fp-text-primary); --acc-muted: var(--fp-text-secondary); color: var(--fp-text-primary); font-size: 14px; line-height: 1.5; }
.accounting-v2-heading h1 { font-size: clamp(1.375rem, 1.08rem + 1vw, 1.75rem); font-weight: 730; }
.accounting-v2-heading p { color: var(--fp-text-secondary); font-size: 14px; }
.accounting-v2-period-controls label > span { color: #405169; font-size: 12px; font-weight: 670; }
.accounting-v2-period-controls select, .accounting-v2-period-controls input, .accounting-v2-period-controls button, .accounting-v2-export {
  height: auto; min-height: 42px; font-size: 13.5px; font-weight: 620;
}
.accounting-v2-context { color: var(--fp-text-secondary); font-size: 13px; }
.accounting-v2-tabs button { color: #405169; font-size: 13px; font-weight: 560; }
.accounting-v2-tabs button.active { font-weight: 680; }
.accounting-v2-kpi p { color: #34465e; font-size: 13px; font-weight: 580; }
.accounting-v2-kpi strong { font-size: clamp(1.25rem, 1.08rem + .55vw, 1.5rem); font-weight: 720; font-variant-numeric: tabular-nums; }
.accounting-v2-kpi small { color: var(--fp-text-muted); font-size: 12px; }
.accounting-v2-integrity span { font-size: 13px; }
.accounting-v2-section-title h2 { font-size: 16px; font-weight: 680; }
.accounting-v2-section-title p { color: var(--fp-text-secondary); font-size: 12.5px; }
.accounting-v2-section-title > a, .accounting-v2-section-title > button, .accounting-v2-view-all { font-size: 12.5px; font-weight: 650; }
.chart-legend { color: var(--fp-text-secondary); font-size: 12px; }
.accounting-bar-column { color: var(--fp-text-secondary); font-size: 11.5px; }
.accounting-policy-state strong { font-size: 15px; }
.accounting-policy-state p { color: var(--fp-text-secondary); font-size: 13px; }
.accounting-v2-action-grid > a, .accounting-v2-action-grid > button { min-height: 52px; font-size: 13px; font-weight: 650; line-height: 1.3; }
.accounting-v2-action-grid small { color: var(--fp-text-muted); font-size: 11.5px; }
.accounting-v2-table { font-size: 13.5px; line-height: 1.4; }
.accounting-v2-table th { color: #405169; font-size: 12.5px; font-weight: 670; }
.accounting-v2-table td { color: #27374d; font-size: 13.5px; font-weight: 480; }
.accounting-v2-table td strong { font-weight: 620; }
.accounting-v2-table td small { color: var(--fp-text-secondary); font-size: 12px; }
.accounting-v2-status { font-size: 11.5px; font-weight: 670; }
.accounting-report-list strong, .accounting-health-list strong { font-size: 13px; font-weight: 620; }
.accounting-report-list small, .accounting-health-list small { color: var(--fp-text-secondary); font-size: 12px; }
.accounting-report-list em, .accounting-health-list em { color: var(--fp-text-secondary); font-size: 11.5px; }
.accounting-v2-footnote, .accounting-v2-invoice-policy { font-size: 12.5px; line-height: 1.45; }
.accounting-v2-invoice-policy strong { font-size: 13px; }
.accounting-v2-empty h3 { font-size: 15px; }
.accounting-v2-empty p, .accounting-v2-journal-detail, .append-only-note { color: var(--fp-text-secondary); font-size: 12.5px; }

/* Owner access and setup remain offline safe */
.reference-access-page { color: var(--fp-text-primary); font-family: var(--fp-font-family); }
.reference-access-page .reference-login-copy p, .reference-account-action,
.reference-access-page .reference-auth-form > small, .reference-access-page .reference-submit-note { color: var(--fp-text-secondary); }
.reference-form-section strong, .reference-field, .reference-mode-preview strong { font-size: 13px; line-height: 1.35; }
.reference-form-section small, .reference-field small, .reference-mode-preview small { color: var(--fp-text-muted); font-size: 12px; line-height: 1.45; }
.reference-field input, .reference-field select { font-size: 14px; font-weight: 500; }

@media (max-width: 760px) {
  :root { --fp-font-body: 14px; }
  body:not(.pos-mode) .main h1 { font-size: clamp(1.25rem, 1.05rem + 1.3vw, 1.5rem); }
  .accounting-v2-table { font-size: 13px; }
  .accounting-v2-table th { font-size: 12px; }
  .accounting-v2-table td { font-size: 13px; }
}
@media (min-resolution: 1.25dppx) { body { -webkit-font-smoothing: auto; } }
@media print { body { color: #000; font-size: 11pt; } }