/* Mobile readability overrides loaded globally via app.html */
html { text-size-adjust: 100%; }
@media (max-width: 640px) {
  /* Base typography */
  html { font-size: 17px; }
  body { color: #0f172a; line-height: 1.6; }
  h1, h2, h3, h4, h5, h6, label { color: #0f172a; }
  h1 { font-size: 1.6rem; }
  h2 { font-size: 1.35rem; }
  h3 { font-size: 1.15rem; }

  /* Muted text slightly darker for contrast */
  .text-gray-500, .text-slate-500, .muted { color: #475569 !important; }

  /* Comfortable tap targets and inputs */
  :root { --tap-target: 44px; }
  input, select, textarea { font-size: 16px !important; min-height: var(--tap-target); padding: 12px 14px; }
  button, .btn { min-height: var(--tap-target); padding: 12px 16px; font-weight: 600; }
  input::placeholder, textarea::placeholder { color: #64748b; opacity: .95; }

  /* Light spacing for cards/modales without cramping */
  .card, .modal, .panel { padding: 14px; }
}


@media (max-width: 640px) {
  /* Expense cards: darker outline, slightly larger title and amount */
  details.group { border-color: #94a3b8; /* slate-400 */ }
  details.group .font-medium { font-size: 1.06rem; }
  details.group .tabular-nums { font-size: 1.02rem; }

  /* Bottom total: emphasize */
  .fixed.bottom-0 .text-slate-700 { font-size: 1.05rem !important; }
  .fixed.bottom-0 .tabular-nums { font-size: 1.2rem !important; }
}

@media (max-width: 640px) {
  /* Expense list cards */
  details.group { border-color: #94a3b8; }
  details.group .font-medium { font-size: 1.2rem; }
  details.group .tabular-nums { font-size: 1.25rem; }
  details.group summary > div { padding-top: 10px; padding-bottom: 10px; }
  details.group [class*='text-xs'] { font-size: 0.95rem !important; }
  details.group .text-slate-700 { color: #0f172a; }

  /* Bottom total emphasis */
  .fixed.bottom-0 .text-slate-700 { font-size: 1.05rem !important; }
  .fixed.bottom-0 .tabular-nums { font-size: 1.2rem !important; }
}
@media (max-width: 640px) {
  /* Larger icons in expense summary + actions */
  details.group summary svg { width: 1.3rem; height: 1.3rem; }
  details.group a svg { width: 1.3rem; height: 1.3rem; }
  /* Larger arrow on submit button */
  .fixed.bottom-0 button svg { width: 1.2rem; height: 1.2rem; }
}
@media (max-width: 640px) {
  /* Larger title and amount in summary */
  details.group .font-medium { font-size: 1.3rem; }
  details.group .tabular-nums { font-size: 1.35rem; }
  /* Expanded details: match amount size */
  details.group[open] .px-4.pb-3 { font-size: 1.25rem; line-height: 1.55; }
  details.group[open] .px-4.pb-3 .text-xs,
  details.group[open] .px-4.pb-3 .text-sm,
  details.group[open] .px-4.pb-3 .text-slate-700,
  details.group[open] .px-4.pb-3 .text-slate-600 { font-size: 1.25rem !important; }
  details.group[open] .px-4.pb-3 svg { width: 1.25rem; height: 1.25rem; }
}
@media (max-width: 640px) {
  /* Mobile menu / drawer: bigger, readable */
  aside nav a, aside .menu a, nav[aria-label="Menu"] a { font-size: 1.2rem; line-height: 1.65; }
  aside h1, aside h2, aside .menu-title { font-size: 1.5rem; }
  aside .badge, aside .count, aside .chip { font-size: 0.95rem; }
  /* Close icon a bit larger */
  aside button[aria-label*="Fermer"] svg, aside .close svg { width: 1.3rem; height: 1.3rem; }
}