/* ── LedgerSys custom styles ─────────────────────────────── */
:root {
  --ls-blue:    #2563eb;
  --ls-blue-2:  #1e40af;
  --ls-bg:      #f8fafc;
}

[data-bs-theme="light"] {
  --bs-body-bg:    var(--ls-bg);
  --bs-body-color: #0f172a;
}

[data-bs-theme="dark"] {
  --bs-body-bg:    #0b0f1a;
  --bs-body-color: #e2e8f0;
}

body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
.review-group { overflow: hidden; }
.review-group:hover { transform: none; }
.review-group summary { cursor: pointer; color: var(--ls-blue); }
.review-description { max-width: 420px; overflow-wrap: anywhere; }
#review-groups[aria-busy="true"] { opacity: .65; }
#nameEditor .modal-body { max-height: 65vh; overflow-y: auto; }

/* Navbar */
.app-navbar {
  background: var(--bs-body-bg);
  border-bottom: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
}
[data-bs-theme="dark"] .app-navbar { border-bottom-color: rgba(255,255,255,.08); }
.navbar-brand { font-size: 1.25rem; letter-spacing: -.3px; }
.nav-link { font-size: .92rem; padding: .5rem .9rem !important; }
.nav-link.active { color: var(--ls-blue) !important; font-weight: 600; }

/* Stat cards */
.stat-card {
  background: var(--bs-body-bg);
  border: 1px solid var(--bs-border-color);
  border-radius: .6rem;
  padding: 1.1rem 1.25rem;
  transition: all .15s;
}
.stat-card:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,.06); }
.stat-card .label { font-size: .73rem; color: var(--bs-secondary-color); text-transform: uppercase; letter-spacing: .05em; margin-bottom: .35rem; }
.stat-card .value { font-size: 1.4rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.stat-card .sub   { font-size: .8rem; color: var(--bs-secondary-color); margin-top: .15rem; }

.text-debit  { color: #dc2626; }
.text-credit { color: #059669; }

/* Tag pill */
.tag-pill {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 9px; border-radius: 20px;
  font-size: .73rem; font-weight: 500;
  border: 1px solid;
}
.tag-pill .dot { width: 6px; height: 6px; border-radius: 50%; }

/* Status badges */
.badge-tagged   { background: #d1fae5; color: #065f46; }
.badge-untagged { background: #fee2e2; color: #991b1b; }
.badge-attach   { background: #ffedd5; color: #9a3412; }

/* Source badges */
.badge-bank   { background: #dbeafe; color: #1e40af; }
.badge-manual { background: #ede9fe; color: #6d28d9; }

/* DataTables polish */
table.dataTable thead th { font-weight: 600; font-size: .82rem; }
table.dataTable tbody td { font-size: .88rem; }
.dataTables_wrapper .dt-buttons .btn { font-size: .85rem; }

/* Login page */
.login-bg {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #1e3a8a, #3b82f6);
}
.login-card { width: 100%; max-width: 420px; padding: 2rem; background: white; border-radius: 1rem; box-shadow: 0 20px 60px rgba(0,0,0,.2); }

/* Toasts */
.app-toast {
  position: fixed; bottom: 20px; right: 20px; z-index: 9999;
  min-width: 250px;
  opacity: 0; transform: translateY(10px); transition: all .25s;
}
.app-toast.show { opacity: 1; transform: translateY(0); }

/* Import preview rows */
.preview-row.new       { background: #ecfdf5; border-left: 3px solid #059669; }
.preview-row.duplicate { background: #fef2f2; border-left: 3px solid #dc2626; opacity: .7; }
[data-bs-theme="dark"] .preview-row.new       { background: #042f1a; }
[data-bs-theme="dark"] .preview-row.duplicate { background: #2a0f0f; }

/* Color swatches */
.swatch { width: 28px; height: 28px; border-radius: 50%; cursor: pointer; border: 2px solid transparent; transition: all .15s; display:inline-block; margin: 2px; }
.swatch.selected { border-color: var(--bs-body-color); transform: scale(1.15); }

/* ── PWA + mobile (added 2026-07) ───────────────────────────── */
/* Respect phone notches / safe areas */
body { padding-bottom: env(safe-area-inset-bottom); }
.app-navbar { padding-top: env(safe-area-inset-top); }

/* Install button — floating bottom-right */
.app-install-btn {
  position: fixed; right: 16px; z-index: 1080;
  bottom: calc(16px + env(safe-area-inset-bottom));
  box-shadow: 0 4px 14px rgba(37,99,235,.4); border-radius: 24px; padding: 10px 16px;
}

/* Offline banner — slides up from bottom when disconnected */
.app-offline-banner {
  position: fixed; left: 0; right: 0; z-index: 1090;
  bottom: 0; transform: translateY(100%); transition: transform .25s ease;
  background: #b91c1c; color: #fff; text-align: center;
  padding: 10px calc(12px + env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left));
  font-size: .85rem;
}
.app-offline-banner.show { transform: translateY(0); }

/* Mobile touch + layout tweaks */
@media (max-width: 768px) {
  /* Any table can scroll sideways instead of squashing the page */
  .table-responsive, .dataTables_wrapper { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  table.dataTable { min-width: 640px; }

  /* Comfortable tap targets */
  .btn, .form-control, .form-select, .nav-link { min-height: 42px; }
  .btn-sm { min-height: 36px; }

  /* Filter bars stack full-width */
  .stat-card .row > [class^="col-"] { margin-bottom: .35rem; }

  /* Bigger headline numbers read better on small screens */
  .stat-card .value { font-size: 1.35rem; }

  /* Keep the brand + toggles from cramping */
  .navbar-brand { font-size: 1.1rem; }
}

/* Standalone (installed) app: hide nothing, just tighten top spacing under status bar */
@media (display-mode: standalone) {
  .container-fluid.py-3 { padding-top: .5rem; }
}