/* src/styles.css */
:root {
  --bg: #f5f7f8;
  --surface: #ffffff;
  --surface-2: #f1f4f5;
  --border: #e4e8ea;
  --text: #18211f;
  --text-muted: #6c7a78;
  --primary: #17a589;
  --primary-strong: #0f8c73;
  --primary-soft: #d7f3ec;
  --success: #16a34a;
  --success-soft: #dcfce7;
  --warning: #d97706;
  --warning-soft: #fef3c7;
  --danger: #e23d3d;
  --danger-soft: #fde7e7;
  --radius: 18px;
  --radius-sm: 12px;
  --shadow: 0 1px 2px rgba(16, 32, 28, 0.04), 0 10px 30px rgba(16, 32, 28, 0.07);
  --shadow-sm: 0 1px 2px rgba(16, 32, 28, 0.06);
  --font:
    "Inter",
    system-ui,
    -apple-system,
    "Segoe UI",
    Roboto,
    sans-serif;
  --tap: 44px;
  --bottom-nav-h: 64px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}
* {
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  height: 100%;
}
body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
}
h1,
h2,
h3 {
  margin: 0;
  font-weight: 680;
  letter-spacing: -0.015em;
}
button {
  font-family: inherit;
  cursor: pointer;
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: var(--tap);
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  padding: 10px 16px;
  border-radius: var(--radius-sm);
  font-size: 15px;
  font-weight: 600;
  transition:
    background 0.15s,
    border-color 0.15s,
    transform 0.05s;
}
.btn:hover {
  background: var(--surface-2);
}
.btn:active {
  transform: scale(0.98);
}
.btn-primary {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
.btn-primary:hover {
  background: var(--primary-strong);
}
.btn-ghost {
  border-color: transparent;
  background: transparent;
  color: var(--text-muted);
  min-height: 36px;
  padding: 6px 8px;
}
.btn-ghost:hover {
  background: var(--surface-2);
  color: var(--text);
}
.btn-sm {
  min-height: 38px;
  padding: 7px 12px;
  font-size: 14px;
}
.input,
.select {
  width: 100%;
  min-height: var(--tap);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 11px 14px;
  font-size: 16px;
  font-family: inherit;
  background: var(--surface);
  color: var(--text);
}
.input:focus,
.select:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--primary-soft);
}
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.muted {
  color: var(--text-muted);
}
.error-banner {
  background: var(--danger-soft);
  color: var(--danger);
  border: 1px solid #f6cccc;
  border-radius: var(--radius-sm);
  padding: 12px 16px;
  margin-bottom: 16px;
  font-weight: 600;
  font-size: 14px;
}

/* angular:styles/global:styles */
/*# sourceMappingURL=styles.css.map */