/* mod-customfields.css — MODULE N: Custom Fields. Self-scoped .cf- classes. */

.cf-tabs { display: flex; gap: 0.5rem; margin-bottom: 0.5rem; flex-wrap: wrap; }
.cf-tab {
  border: 1px solid #d8d2c4; background: #f7f4ec; color: #4a4438;
  border-radius: 999px; padding: 0.45rem 1rem; font-size: 0.9rem; cursor: pointer;
}
.cf-tab.active { background: #3f5b46; border-color: #3f5b46; color: #fff; }

.cf-actions { white-space: nowrap; }
.cf-actions .btn { margin: 0.1rem 0.15rem; }

.cf-form label { display: block; margin-bottom: 0.75rem; font-weight: 600; }
.cf-form label input[type="text"],
.cf-form label input[type="number"],
.cf-form label select,
.cf-form label textarea {
  display: block; width: 100%; margin-top: 0.25rem; font-weight: 400;
  border: 1px solid #d8d2c4; border-radius: 6px; padding: 0.5rem;
  background: #fff; color: #2c2820; box-sizing: border-box;
}
.cf-check { display: flex !important; align-items: center; gap: 0.5rem; font-weight: 400 !important; }
.cf-check input { width: auto !important; margin: 0 !important; }

/* embeddable read-only values list */
.cf-values { margin: 0; display: grid; gap: 0.6rem; }
.cf-value dt { font-weight: 600; font-size: 0.85rem; color: #6b6252; }
.cf-value dd { margin: 0.15rem 0 0; font-size: 1rem; color: #2c2820; }
.cf-value.cf-inactive dd { color: #9a917e; }

/* embeddable input block */
.cf-input { display: block; margin-bottom: 0.75rem; font-weight: 600; }
.cf-input input[type="text"],
.cf-input input[type="number"],
.cf-input input[type="date"],
.cf-input select {
  display: block; width: 100%; margin-top: 0.25rem; font-weight: 400;
  border: 1px solid #d8d2c4; border-radius: 6px; padding: 0.5rem;
  background: #fff; color: #2c2820; box-sizing: border-box;
}
.cf-req { color: #a4442c; font-size: 0.8rem; font-weight: 400; }