@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
  --primary: #2563EB;
  --primary-dark: #1D4ED8;
  --primary-light: #DBEAFE;
  --primary-bg: #EFF6FF;
  --bg: #F8FAFC;
  --surface: #FFFFFF;
  --border: #E2E8F0;
  --border-light: #F1F5F9;
  --text: #0F172A;
  --text-secondary: #64748B;
  --text-muted: #94A3B8;
  --danger: #EF4444;
  --danger-dark: #DC2626;
  --danger-bg: #FEF2F2;
  --radius-sm: 6px;
  --radius: 8px;
  --radius-lg: 12px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.06);
  --shadow: 0 1px 3px rgba(0,0,0,0.1), 0 1px 2px rgba(0,0,0,0.06);
  --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
  --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
}

* { box-sizing: border-box; }

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: var(--text);
  margin: 0;
}

button {
  font-family: inherit;
  color: inherit;
  -webkit-tap-highlight-color: transparent;
}

a { color: inherit; }

/* Inputs date y time — mostrar placeholder en móvil */
input[type="date"]:before { content: attr(placeholder); color: var(--text-muted); }
input[type="date"]:focus:before, input[type="date"]:valid:before { content: ""; }
input[type="time"]:before { content: attr(placeholder); color: var(--text-muted); }
input[type="time"]:focus:before, input[type="time"]:valid:before { content: ""; }

/* ── userBadge global (overrides page-specific #222) ─────────── */
#userBadge {
  background: var(--primary);
  color: white;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease;
}

#userBadge:hover { background: var(--primary-dark); }