:root {
  /* Klai brand tokens (mapped onto Fider primary slots) */
  --primary-color: #fcaa2d;       /* amber CTA */
  --primary-color-dark: #a36404;  /* darker amber for hover + text links */
  --primary-color-light: #fde8c4; /* light amber tints */
}

/* Warm ivory page background (Klai brand) */
body[data-theme="light"],
html[data-theme="light"] body {
  background-color: #fffef2 !important;
  color: #191918 !important;
}

/* Header bar + main surface */
.l-page-header,
header.c-header,
.c-header,
.c-menu-header {
  background-color: #fffef2 !important;
  border-bottom: 1px solid #e3e2d8 !important;
}

/* Cards and surfaces use Klai cream */
.c-card,
.c-tile,
.c-post-list .c-post-item,
.c-comment {
  background-color: #f3f2e7 !important;
  border-color: #e3e2d8 !important;
}

/* Page header h1 in Klai dark, no more purple */
h1, h2, h3, h4, h5, h6,
h1.text-header,
.c-heading {
  color: #191918 !important;
  font-weight: 600;
}
h1.text-header {
  font-size: 18px;
  margin: 0;
  margin-top: 3px;
}

/* Primary buttons get amber bg with dark text (per Klai brand) */
.c-button--primary {
  background-color: #fcaa2d !important;
  border-color: #fcaa2d !important;
  color: #191918 !important;
}
.c-button--primary:hover {
  background-color: #e89a1f !important;
  border-color: #e89a1f !important;
  color: #191918 !important;
}

/* Inline text links use accent-dark for AA contrast on light bg */
a,
.c-button--tertiary {
  color: #a36404;
}
a:hover,
.c-button--tertiary:hover {
  color: #fcaa2d;
}

/* Voted state matches amber */
.c-vote-counter__button--voted,
.c-vote-counter__button--voted svg,
.c-vote-counter__button:hover svg {
  color: #fcaa2d !important;
  border-color: #fcaa2d !important;
}

/* Tag pills in cream/amber palette */
.c-tag {
  background-color: #f3f2e7 !important;
  color: #191918 !important;
  border: 1px solid #e3e2d8 !important;
}

/* Borders across UI to Klai border token */
.c-input,
.c-select,
.c-textarea,
.c-card,
.c-divider,
.l-page-footer,
.c-comment {
  border-color: #e3e2d8 !important;
}

/* Input fields on cream backgrounds */
.c-input,
.c-select,
.c-textarea {
  background-color: #ffffff !important;
  color: #191918 !important;
}
.c-input:focus,
.c-select:focus,
.c-textarea:focus {
  border-color: #fcaa2d !important;
  box-shadow: 0 0 0 3px rgba(252, 170, 45, 0.2) !important;
}

/* Page footer matches background, no harsh divider */
.l-page-footer,
footer.c-footer {
  background-color: #fffef2 !important;
  color: #191918 !important;
  border-top: 1px solid #e3e2d8 !important;
}

/* Hide Powered by Fider footer link (all known selectors) */
footer a[href*="getfider.com"],
.l-page-footer a[href*="getfider.com"],
.l-page-footer .powered-by,
footer .powered-by,
[class*="poweredby"],
[class*="powered-by"] {
  display: none !important;
}

/* Status badges use Klai semantic tokens */
.c-status--open { background-color: #f3f2e7 !important; color: #191918 !important; }
.c-status--planned { background-color: #FFFBEB !important; color: #D97706 !important; }
.c-status--started { background-color: #FFFBEB !important; color: #D97706 !important; }
.c-status--completed { background-color: #D1FAE5 !important; color: #065F46 !important; }
.c-status--declined { background-color: #FEE2E2 !important; color: #C0392B !important; }


/* Hide Powered by Fider — Fider uses .c-powered class + fider.io URL (2 instances: desktop + mobile responsive) */
.c-powered,
a[href*="fider.io"] {
  display: none !important;
}


/* Hide Fider modal-header logo (hardcoded to fider.io/images/logo-100x100.png which 301s and breaks) */
img[src*="fider.io"] {
  display: none !important;
}
