@import url('../fonts/inter.css');

/* Shared visual language for the admin, guest flows and mobile application. */
:root {
  color-scheme: light;
  --af-canvas: #f5f7f8;
  --af-surface: #ffffff;
  --af-ink: #18252f;
  --af-muted: #647580;
  --af-line: #e1e8eb;
  --af-primary: #078eaf;
  --af-primary-hover: #06748e;
  --af-tint: #eaf6fb;
  --af-sidebar: #152d3a;
  --af-danger: #b83a42;
  --af-radius: 12px;
  --af-shadow: 0 8px 28px rgb(24 37 47 / 5%);
  --bs-primary: #078eaf;
  --bs-primary-rgb: 7, 142, 175;
  --bs-link-color: #078eaf;
  --bs-link-hover-color: #06748e;
  --bs-body-font-family: 'Inter', system-ui, sans-serif;
  --bs-body-color: #18252f;
  --bs-body-bg: #f5f7f8;
}
html { scroll-padding-top: 84px; }
html body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  color: var(--af-ink);
  background: var(--af-canvas);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
*, *::before, *::after { box-sizing: border-box; }
button, input, select, textarea { font: inherit; }
html body :is(h1, .af-heading, .reg-card-title) {
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 600;
  letter-spacing: -.035em;
  line-height: 1.2;
  color: var(--af-ink);
}
html body h1 { font-size: clamp(1.8rem, 2.5vw, 2.65rem); }
html body a { text-underline-offset: 3px; }
html body :is(a, button, input, textarea, select, [tabindex]):focus-visible {
  outline: 3px solid #299fa3;
  outline-offset: 3px;
}
html body :is(input:not([type]), input[type=text], input[type=email], input[type=password], input[type=number], input[type=search], input[type=url], input[type=tel], input[type=date], input[type=time], select, textarea, .form-control, .form-select) {
  border-radius: 8px;
  border-color: #cdd9de;
  background-color: var(--af-surface);
  color: var(--af-ink);
  min-height: 42px;
  padding: 9px 12px;
  max-width: 100%;
  box-shadow: none;
}
html body :is(input, select, textarea):disabled { background-color: #f0f3f4; color: #687982; }
html body input[type=checkbox], html body input[type=radio] { accent-color: var(--af-primary); }
html body :is(.btn, .button, button[type=submit], input[type=submit]) {
  border-radius: 8px;
  font-weight: 600;
  line-height: 1.4;
  transition: background-color .15s, border-color .15s;
}
html body :is(.btn-primary, .btn-info, .btn-register, .btn-next) {
  --bs-btn-bg: var(--af-primary);
  --bs-btn-border-color: var(--af-primary);
  --bs-btn-hover-bg: var(--af-primary-hover);
  --bs-btn-hover-border-color: var(--af-primary-hover);
  background: var(--af-primary);
  border-color: var(--af-primary);
  color: #fff;
}
html body :is(.btn-primary, .btn-info, .btn-register, .btn-next):hover { background: var(--af-primary-hover); color: #fff; }
html body :is(.card, .reg-card, .login-box .card, .m-card) {
  border: 1px solid var(--af-line);
  border-radius: var(--af-radius);
  background: var(--af-surface);
  box-shadow: none;
}
html body :is(.card-header, .reg-card-header) { border-bottom-color: var(--af-line); }
html body :is(.help, .help-block, .text-muted, .muted) { color: var(--af-muted); }
html body :is(.dropdown-menu, .select2-dropdown) { border-color: var(--af-line); border-radius: 10px; box-shadow: var(--af-shadow); }
html body .badge { border-radius: 6px; font-weight: 600; padding: .4em .65em; }
html body .modal-content { border: 1px solid var(--af-line); border-radius: 16px; box-shadow: 0 24px 80px #18252f26; }
html body .modal-header { border-bottom-color: var(--af-line); }
html body .modal-footer { border-top-color: var(--af-line); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
@media print {
  html body { background: #fff; }
  .af-sidebar, .af-menu-toggle, .af-sidebar-backdrop, .af-skip-link { display: none !important; }
}