/*
 * Reception typography aligned with the live management portal.
 * Keep weights limited to files that are actually shipped (400 / 700) so
 * browsers never synthesize an overly heavy 800 face from the bold font.
 */
html,
body,
button,
input,
select,
textarea {
  font-family: "Kalameh", Arial, sans-serif;
  font-synthesis: none;
}

body {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6,
strong,
b {
  font-family: "Modam", "Kalameh", Arial, sans-serif;
  font-synthesis: none;
}

.topbar-title h1 {
  font-family: "Modam", "Kalameh", Arial, sans-serif;
  font-size: 22px;
  font-weight: 700;
  line-height: normal;
}

.hero-panel h2 {
  font-family: "Modam", "Kalameh", Arial, sans-serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 1.5;
}

.section-heading h2 {
  font-family: "Modam", "Kalameh", Arial, sans-serif;
  font-size: 30px;
  font-weight: 400;
  line-height: 1.5;
}

.panel-head h3,
.product-card h3,
.approval-card h3,
.policy-card h3 {
  font-family: "Modam", "Kalameh", Arial, sans-serif;
  font-size: 19px;
  font-weight: 400;
  line-height: 1.5;
}

.member-profile-head h3 {
  font-family: "Modam", "Kalameh", Arial, sans-serif;
  font-size: 27px;
  font-weight: 400;
  line-height: 1.5;
}

.subsection h4,
.dialog header h2,
.auth-copy h1 {
  font-family: "Modam", "Kalameh", Arial, sans-serif;
  font-weight: 400;
  line-height: 1.5;
}

.nav-item,
.nav-item span {
  font-family: "Kalameh", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
}

.sidebar-head strong,
.button,
.text-button,
.empty-state strong,
.error-state strong,
.branch-control select,
.dialog label,
.auth-form label {
  font-weight: 700;
}

.empty-state strong,
.error-state strong {
  font-family: "Modam", "Kalameh", Arial, sans-serif;
  font-size: 17px;
  line-height: 1.5;
}

.metric-card strong,
.wallet-metric strong {
  font-family: "Modam", "Kalameh", Arial, sans-serif;
  font-size: 27px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: normal;
}

.profile-field strong,
.reconciliation-row strong,
.document-row strong,
.product-price strong {
  font-weight: 700;
}

.hero-panel em,
.section-heading em,
.panel-head em,
.dialog header em,
.auth-copy em {
  font-family: "Kalameh", Arial, sans-serif;
  font-weight: 700;
}

@media (max-width: 620px) {
  body {
    font-size: 14px;
  }

  .nav-item,
  .nav-item span {
    font-size: 14px;
  }

  .hero-panel h2,
  .section-heading h2 {
    font-size: 24px;
  }

  .metric-card strong,
  .wallet-metric strong {
    font-size: 22px;
  }
}