/* ===== "Liquid glass" theme =====================================================
   Purely visual. Delete the <link> to css/glass.css in index.html to go back to the plain theme.
   - Solid, high-opacity panels by default (works everywhere, incl. old Android WebViews).
   - Real frosted blur only where backdrop-filter is supported, lighter blur on phones.
   - Turned off for "reduce transparency" users and for print / PDF (print stays plain). */
:root {
  --glass-bg: rgba(255, 255, 255, 0.93);
  --glass-bg-strong: rgba(255, 255, 255, 0.96);
  --glass-border: rgba(255, 255, 255, 0.75);
  --glass-edge: rgba(148, 163, 184, 0.28);
  --glass-shadow: 0 8px 32px rgba(30, 64, 175, 0.10), 0 1px 2px rgba(15, 23, 42, 0.06);
  --glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  --glass-blur: 18px;
  --bg-sidebar: #172554;
}

@media screen {
  body {
    background: #eef2ff;
    background-image:
      radial-gradient(1100px 700px at -10% -10%, rgba(96, 165, 250, 0.35), transparent 60%),
      radial-gradient(900px 650px at 110% 0%, rgba(167, 139, 250, 0.30), transparent 60%),
      radial-gradient(900px 700px at 50% 120%, rgba(45, 212, 191, 0.22), transparent 60%);
    background-attachment: scroll;
    min-height: 100vh;
  }
  .main-content { background: transparent; }
  .content-area { background: transparent; }

  /* panels */
  .stat-card, .chart-card, .table-card, .form-container, .installment-card,
  .report-container, .reports-filters, .modal-content, .login-box, .view-switch-btn {
    background: var(--glass-bg);
    border: 1px solid var(--glass-edge);
    box-shadow: var(--glass-shadow), var(--glass-highlight);
  }
  .stat-card, .chart-card, .table-card, .form-container, .installment-card, .report-container, .reports-filters { border-radius: 16px; }
  .modal-content, .login-box { background: var(--glass-bg-strong); border-radius: 18px; }
  .table-responsive { background: transparent; }
  table th { background: rgba(241, 245, 249, 0.85); }

  /* top bar */
  .topbar {
    background: rgba(255, 255, 255, 0.9);
    border-bottom: 1px solid var(--glass-edge);
    box-shadow: 0 4px 24px rgba(30, 64, 175, 0.08);
  }

  /* sidebar: deep blue glass */
  .sidebar {
    background: linear-gradient(180deg, rgba(30, 58, 138, 0.97), rgba(23, 37, 84, 0.98));
    border-right: 1px solid rgba(255, 255, 255, 0.12);
  }
  .nav-item { border-radius: 0 12px 12px 0; margin-right: 10px; }
  .nav-item:hover { background: rgba(255, 255, 255, 0.08); }
  .nav-item.active { background: rgba(255, 255, 255, 0.16); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15); color: #fff; }

  /* inputs & buttons */
  input, select, textarea { background-color: rgba(255, 255, 255, 0.95); }
  .btn-primary { background-image: linear-gradient(135deg, #3b82f6, #2563eb); box-shadow: 0 4px 14px rgba(37, 99, 235, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.25); }

  /* login screen */
  .login-container { background: linear-gradient(135deg, #60a5fa 0%, #6366f1 55%, #a78bfa 100%); }
}

/* frosted blur where supported */
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  @media screen {
    :root { --glass-bg: rgba(255, 255, 255, 0.72); --glass-bg-strong: rgba(255, 255, 255, 0.86); }
    .stat-card, .chart-card, .table-card, .form-container, .installment-card,
    .report-container, .reports-filters, .login-box {
      -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(160%);
      backdrop-filter: blur(var(--glass-blur)) saturate(160%);
    }
    .topbar { background: rgba(255, 255, 255, 0.7); -webkit-backdrop-filter: blur(16px) saturate(170%); backdrop-filter: blur(16px) saturate(170%); }
    .sidebar { background: linear-gradient(180deg, rgba(30, 58, 138, 0.86), rgba(23, 37, 84, 0.92)); -webkit-backdrop-filter: blur(20px) saturate(150%); backdrop-filter: blur(20px) saturate(150%); }
    .sidebar-backdrop { -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
  }
}
/* phones / low-end: lighter blur, fewer blurred layers (the many small stat cards stay solid) */
@media screen and (max-width: 768px) {
  :root { --glass-blur: 10px; }
  .stat-card, .installment-card { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background: rgba(255, 255, 255, 0.9); }
}
@media (prefers-reduced-transparency: reduce) {
  * { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
  :root { --glass-bg: #fff; --glass-bg-strong: #fff; }
}

/* print / PDF: plain */
@media print {
  body { background: #fff !important; background-image: none !important; }
  * { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; text-shadow: none !important; }
  .stat-card, .chart-card, .table-card, .form-container, .installment-card, .report-container, .reports-filters, .modal-content, .topbar, table th {
    background: #fff !important; border-color: #ccc !important;
  }
}