form
  section[data-css^="Application-edit-drawer-content"]
  section[data-css^="Application-edit-"] {
  margin-bottom: 16px;
}

/** * For each of the properties within form, adminjs component has a text element. This takes up space even if the text is empty.
 * Lets hide it when there is no text.
 */
.adminjs_Text:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.adminjs_Select div[aria-disabled="true"] {
  background-color: #f5f5f5;
  color: #888;
  border: 1px dashed #ccc;
  cursor: not-allowed;
}

section.adminjs_MessageBox {
  margin: 16px 0;
  padding: 0;
}

.capitalized-label {
  text-transform: capitalize;
}

.readonly-label {
  font-family: monospace;
  background-color: #f5f5f5;
  padding: 4px 8px;
  border-radius: 4px;
}

.readonly-box {
  cursor: pointer;
  pointer-events: none;

  .adminjs_Select {
    background-color: #f5f5f5;
    border: 1px dashed #ccc;
  }
}

.form-subtitle {
  margin-top: -10px;
  color: rgb(137, 138, 154);
}

.adminjs_Logo img {
  width: 100px;
}

/* Styles applicable to relations-table such that actions column appears as sticky */
table[data-css="relations-table"] {
  overflow-x: auto;
  white-space: nowrap;
  position: relative;
}

/* Prevent row wrapping */
table[data-css="relations-table"] thead tr,
table[data-css="relations-table"] tbody tr {
  width: 100%;
  table-layout: fixed;
}

/* Make the last column (aka. actions column) sticky */
table[data-css="relations-table"] td:last-child,
table[data-css="relations-table"] th:last-child {
  position: sticky;
  right: -1px;
  background: white;
  z-index: 1;
}
/* End of styles applicable to relations-table such that actions column appears as sticky */

/* HACK: Hide "Create first record" button for ApplicationToUser join table relations */
/* This targets the empty state (InfoBox) within the "users" relation on Application show page and the "applications" relation on User show page */
section[data-css*="Application-show-relations"]
  button[data-css*="User-new-button"],
section[data-css*="User-show-relations"]
  button[data-css*="Application-new-button"] {
  display: none !important;
}

/* Custom tab styles for Organization show page */
.organization-tab-container {
  display: flex;
  border-bottom: 1px solid #e0e0e0;
  margin-bottom: 24px;
}

.organization-tab {
  padding: 10px 20px;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  font-weight: normal;
  color: #666;
}

.organization-tab.active {
  border-bottom: 2px solid #4268f6;
  font-weight: bold;
  color: #4268f6;
}

/* Email templates JSON display */
.email-templates-json {
  font-family: "Monaco", "Menlo", "Ubuntu Mono", "Consolas", "source-code-pro",
    monospace !important;
  font-size: 13px !important;
  background-color: #f6f8fa;
  padding: 16px;
  border-radius: 6px;
  border: 1px solid #d1d5db;
  white-space: pre-wrap;
  line-height: 1.5;
  max-height: 500px;
  overflow-y: auto;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  margin-top: 8px;
}

.json-editor-wrapper {
  border: 1px solid #c0c0ca;
  border-radius: 4px;
  padding: 8px;
  min-height: 150px;
  max-height: 400px;
  overflow: auto;
}