/* RAH146 canonical brand tokens shared by Web, Messages, CRM and support surfaces. */
:root {
  --rah146-lapis: #2341A0;
  --rah146-gold: #E8C26A;
  --rah146-gold-dark: #C9A24A;
  --rah146-cream: #F6F2E8;
  --rah146-night: #12172B;

  /* Compatibility aliases for pre-rebrand component systems. */
  --brand-primary: var(--rah146-lapis);
  --brand-accent: var(--rah146-gold);
  --brand-accent-dark: var(--rah146-gold-dark);
  --brand-background: var(--rah146-cream);
  --brand-text: var(--rah146-night);
  --primary: var(--rah146-lapis);
  --primary-dark: var(--rah146-night);
  --crm-brand: var(--rah146-lapis);
  --crm-brand-dark: var(--rah146-night);
  --primary-color: var(--rah146-lapis);
  --color-primary: var(--rah146-lapis);
  --accent: var(--rah146-gold);
  --accent-color: var(--rah146-gold);
  --focus-ring: var(--rah146-gold);
}

html,
body {
  font-family: "Sora", "Vazirmatn", system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
}

html[dir="rtl"] body,
html[lang="fa"] body,
html[lang="fa-AF"] body,
html[lang="ar"] body {
  font-family: "Vazirmatn", "Sora", system-ui, sans-serif;
}

:where(a, button, input, textarea, select, [tabindex]):focus-visible {
  outline-color: var(--rah146-gold);
  outline-offset: 2px;
}

:where(.brand-accent, [data-brand-accent="true"]) {
  color: var(--rah146-gold-dark);
}

::selection {
  background: var(--rah146-gold);
  color: var(--rah146-night);
}


/* RAH146 / AVO sound selection in personal Settings */
.settings-sonic-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 1rem;
}
.settings-sonic-row {
  display: flex;
  flex-direction: column;
  gap: .65rem;
  padding: 1rem;
  border: 1px solid var(--rah146-lapis);
  border-radius: 14px;
  background: color-mix(in srgb, var(--rah146-cream) 62%, white);
}
.settings-sonic-choice { display: flex; gap: .65rem; flex-wrap: wrap; }
.settings-sonic-choice select {
  flex: 1 1 160px;
  min-width: 0;
  padding: .65rem;
  border-radius: 8px;
  border: 1px solid var(--rah146-lapis);
  background: white;
  color: var(--rah146-night);
}
.settings-sonic-row input[type="range"] { width: 100%; accent-color: var(--rah146-lapis); }
.settings-sonic-row output { font-variant-numeric: tabular-nums; }
.settings-sonic-card .form-actions { align-items: center; gap: .8rem; }