/* Shared native fields. Width belongs to the form grid; browser semantics,
   autocomplete, input type, constraints and picker UI remain native. */
:root {
  --field-height:25px;
  --field-font-size:12px;
  --field-line-height:18px;
  --field-surface:#f8f8f8;
  --field-text:#000001;
  --field-muted:#636963;
  --field-focus:#e1c16e;
  --field-error:#b73535;
  --field-radius:3px;
  --field-padding-x:10px;
  --field-row-gap:25px;
}
/* Component-owned appearance overrides old per-panel field declarations.
   Layout-specific widths and textarea heights intentionally remain external. */
.system-standard-field {
  box-sizing:border-box !important;
  min-width:0;
  max-width:100%;
  border:1px solid transparent !important;
  border-radius:var(--field-radius) !important;
  background-color:var(--field-surface) !important;
  color:var(--field-text) !important;
  font:400 var(--field-font-size)/var(--field-line-height) Raleway,sans-serif !important;
  padding:2px var(--field-padding-x) !important;
  box-shadow:none !important;
}
input.system-standard-field, select.system-standard-field:not([multiple]):not([size]) {
  height:var(--field-height) !important;
  min-height:var(--field-height) !important;
}
select.system-standard-field { padding-right:var(--field-padding-x) !important; }
textarea.system-standard-field { min-height:75px; padding:10px !important; resize:vertical; }
.system-standard-field::placeholder { color:var(--field-muted); opacity:1; }
.system-standard-field:focus-visible { outline:2px solid var(--field-focus) !important; outline-offset:2px !important; }
.system-standard-field:is([aria-invalid="true"],[data-native-invalid="true"],.is-invalid) { border-color:var(--field-error) !important; }
.system-standard-field:is([aria-invalid="true"],[data-native-invalid="true"],.is-invalid):focus-visible { outline-color:var(--field-error) !important; }
.system-standard-field:disabled { opacity:var(--action-disabled-opacity,.5) !important; cursor:not-allowed; }
.system-standard-field[readonly] { color:var(--field-muted) !important; }
@media (forced-colors:active) {
  .system-standard-field { border-color:CanvasText !important; background:Canvas !important; color:CanvasText !important; }
  .system-standard-field:disabled { color:GrayText !important; opacity:1 !important; }
}

/* Formatting is the compact, fixed text-control variant, not a new icon set. */
.rich-text-toolbar.system-standard-rich-toolbar {
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  padding:0 0 10px !important;
  margin:0 !important;
  min-height:25px !important;
  height:auto !important;
  max-height:none !important;
  border:0 !important;
  background:transparent !important;
  overflow:visible !important;
}
.rich-text-toolbar.system-standard-rich-toolbar::after { content:none !important; }
.system-standard-rich-toolbar .system-standard-format-button {
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  min-width:25px;
  height:25px;
  padding:0 5px;
  border:0;
  border-radius:3px;
  background:var(--action-neutral,#383e42);
  color:#fff;
  font:400 12px/25px Raleway,sans-serif;
  box-shadow:2px 2px 10px #0003;
  cursor:pointer;
  transition:transform 120ms ease;
}
.system-standard-format-button strong { font-weight:600; }
.system-standard-format-button[aria-pressed="true"] { background:var(--action-positive,#2a922a); box-shadow:inset 2px 2px 4px #0008; }
.system-standard-format-button:active:not(:disabled) { transform:translate(2px,2px); }
.system-standard-format-button:focus-visible { outline:2px solid var(--field-focus); outline-offset:3px; }
.system-standard-format-button:disabled { opacity:var(--action-disabled-opacity,.5); cursor:not-allowed; }
@media (prefers-reduced-motion:reduce) { .system-standard-format-button { transition:none; } }
@media (forced-colors:active) {
  .system-standard-format-button { border:1px solid ButtonText; }
  .system-standard-format-button[aria-pressed="true"] { outline:2px solid Highlight; }
}
