@font-face {
  font-family: "Anouma Admin";
  src: url("/fonts/baar-antropos.ttf") format("truetype");
  font-display: swap;
  font-style: normal;
  font-weight: 100 900;
}

:root {
  --anouma-ink: #342c31;
  --anouma-plum: #66505f;
  --anouma-mauve: #8b616d;
  --anouma-rose: #d19ca1;
  --anouma-cream: #f7f2ed;
  --anouma-paper: #fffdfb;
  --anouma-line: #e4d9d2;
  --font-body: "Anouma Admin", Inter, ui-sans-serif, system-ui, sans-serif;
  --font-mono: "SFMono-Regular", Consolas, monospace;
}

html,
body {
  background: var(--anouma-cream);
  color: var(--anouma-ink);
  font-family: var(--font-body);
}

body,
button,
input,
textarea,
select {
  font-family: var(--font-body);
}

/* The left navigation is intentionally dark and quiet. Content stays light. */
.nav {
  background: var(--anouma-ink);
  border-right: 1px solid #4b3f46;
  color: #f8f2ed;
}

.nav__header {
  border-bottom: 1px solid #4b3f46;
  padding: 24px 20px 20px;
}

.nav__header a,
.nav__header button {
  color: #fffaf6;
}

.nav__links {
  padding: 18px 12px;
}

.nav-group {
  margin: 0 0 18px;
}

.nav-group__label,
.nav-group__toggle {
  color: #bdaeb4;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.nav-group__label {
  padding: 0 10px 8px;
}

.nav__link {
  border-radius: 4px;
  color: #f8f2ed;
  font-size: 14px;
  margin: 2px 0;
  min-height: 38px;
  padding: 9px 10px;
}

.nav__link:hover,
.nav__link:focus-visible,
.nav__link.active {
  background: #4c3d47;
  color: #fff;
}

.nav__link.active {
  box-shadow: inset 3px 0 0 var(--anouma-rose);
}

.nav__controls {
  border-top: 1px solid #4b3f46;
  padding: 14px 12px;
}

.app-header,
.step-nav {
  background: var(--anouma-paper);
  border-bottom: 1px solid var(--anouma-line);
}

.template-default__wrap,
.dashboard__wrap,
.collection-list__wrap,
.edit-view__wrap {
  background: var(--anouma-cream);
}

.template-default__wrap {
  min-height: 100vh;
}

.dashboard__header,
.collection-list__header,
.edit-view__header {
  border-bottom: 1px solid var(--anouma-line);
  margin-bottom: 26px;
  padding-bottom: 18px;
}

.dashboard__header h1,
.collection-list__header h1,
.edit-view__header h1 {
  color: var(--anouma-ink);
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 600;
  letter-spacing: -0.025em;
}

.card,
.dashboard__card,
.table-wrap,
.collection-list__table-wrap,
.field-type,
.document-fields__main {
  border-color: var(--anouma-line);
}

.card,
.dashboard__card,
.table-wrap {
  border-radius: 6px;
  box-shadow: 0 8px 24px rgb(52 44 49 / 4%);
}

.btn {
  border-radius: 4px;
  font-weight: 600;
}

.btn--style-primary {
  --bg-color: var(--anouma-mauve);
  --hover-bg: var(--anouma-plum);
}

input,
textarea,
select,
.rs__control {
  border-color: #d7c9c1;
  border-radius: 4px;
}

input:focus,
textarea:focus,
select:focus,
.rs__control--is-focused {
  border-color: var(--anouma-mauve);
  box-shadow: 0 0 0 2px rgb(139 97 109 / 12%);
}

.field-label,
.field-label label {
  color: var(--anouma-plum);
  font-weight: 650;
}

.description,
.field-description {
  color: #7b6b72;
}

.table thead th,
.table th {
  background: #f1e9e4;
  color: var(--anouma-plum);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.table tbody tr:hover {
  background: #fbf7f4;
}

.anouma-admin-welcome {
  background: var(--anouma-paper);
  border: 1px solid var(--anouma-line);
  border-left: 4px solid var(--anouma-mauve);
  border-radius: 6px;
  box-shadow: 0 12px 32px rgb(52 44 49 / 5%);
  margin: 0 0 28px;
  padding: 28px;
}

.anouma-admin-welcome__intro {
  max-width: 680px;
}

.anouma-admin-eyebrow {
  color: var(--anouma-mauve);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.16em;
  margin: 0 0 8px;
  text-transform: uppercase;
}

.anouma-admin-welcome h1 {
  color: var(--anouma-ink);
  font-size: clamp(25px, 3vw, 36px);
  font-weight: 600;
  letter-spacing: -0.03em;
  margin: 0;
}

.anouma-admin-welcome__intro > p:last-child {
  color: #776870;
  font-size: 15px;
  line-height: 1.6;
  margin: 10px 0 0;
}

.anouma-admin-quicklinks {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 26px;
}

.anouma-admin-quicklink {
  background: #faf5f1;
  border: 1px solid var(--anouma-line);
  border-radius: 4px;
  color: var(--anouma-ink);
  display: flex;
  flex-direction: column;
  min-height: 154px;
  padding: 16px;
  text-decoration: none;
  transition: border-color 120ms ease, background 120ms ease, transform 120ms ease;
}

.anouma-admin-quicklink:hover,
.anouma-admin-quicklink:focus-visible {
  background: #fffaf7;
  border-color: var(--anouma-mauve);
  color: var(--anouma-ink);
  transform: translateY(-2px);
}

.anouma-admin-quicklink__number {
  color: var(--anouma-rose);
  font-family: var(--font-mono);
  font-size: 12px;
  margin-bottom: 24px;
}

.anouma-admin-quicklink__kicker {
  color: var(--anouma-mauve);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.anouma-admin-quicklink strong {
  font-size: 17px;
  font-weight: 650;
  margin-top: 5px;
}

.anouma-admin-quicklink > span:last-child {
  color: #7b6b72;
  font-size: 12px;
  line-height: 1.45;
  margin-top: 6px;
}

.anouma-custom-nav-item,
.anouma-custom-nav-action {
  margin: 0 0 6px;
  padding: 0;
}

.anouma-custom-nav-link,
.anouma-custom-nav-button {
  align-items: center;
  border: 1px solid #5a4a55;
  border-radius: 4px;
  display: flex;
  font-size: 13px;
  font-weight: 650;
  gap: 10px;
  min-height: 38px;
  padding: 8px 10px;
  text-decoration: none;
  width: 100%;
}

.anouma-custom-nav-link {
  color: #fffaf6;
}

.anouma-custom-nav-link:hover,
.anouma-custom-nav-link:focus-visible {
  background: #4c3d47;
  border-color: #7d6371;
  color: #fff;
}

.anouma-custom-nav-link__icon {
  color: var(--anouma-rose);
  font-family: var(--font-mono);
  font-size: 10px;
}

.anouma-custom-nav-button {
  background: var(--anouma-mauve);
  border-color: var(--anouma-mauve);
  color: #fff;
  cursor: pointer;
  justify-content: flex-start;
}

.anouma-custom-nav-button:hover,
.anouma-custom-nav-button:focus-visible {
  background: var(--anouma-plum);
  border-color: var(--anouma-plum);
}

.anouma-custom-nav-button:disabled {
  cursor: wait;
  opacity: 0.7;
}

.anouma-custom-nav-input {
  background: #fffaf6;
  border: 1px solid #d7c9c1;
  border-radius: 3px;
  color: var(--anouma-ink);
  font-family: var(--font-mono);
  font-size: 10px;
  margin-top: 6px;
  padding: 6px 7px;
  width: 100%;
}

.anouma-custom-nav-error {
  color: #f1b5b5;
  font-size: 11px;
  line-height: 1.4;
  margin: 6px 0 0;
}

@media (max-width: 1100px) {
  .anouma-admin-quicklinks {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .anouma-admin-welcome {
    padding: 20px;
  }

  .anouma-admin-quicklinks {
    grid-template-columns: 1fr;
  }
}