@layer t2.module {
/* Path: T2Editor/js/utils/form-controls.css */
/*
 * Shared low-specificity form-control floor for editor and plugin UI.
 * It removes browser chrome without overriding class-based component skins.
 */

:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview) {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview)
  :where(button, input, select, textarea) {
  min-width: 0;
  max-width: 100%;
  font: inherit;
  color: inherit;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview)
  :where(button, input[type="button"], input[type="submit"], input[type="reset"]) {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  outline: 0;
  margin: 0;
  padding: 0;
  touch-action: manipulation;
}

:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview)
  :where(button, input[type="button"], input[type="submit"], input[type="reset"]):focus,
:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview)
  :where(button, input[type="button"], input[type="submit"], input[type="reset"]):focus-visible {
  outline: 0;
}

:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview) button::-moz-focus-inner,
:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview) input[type="button"]::-moz-focus-inner,
:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview) input[type="submit"]::-moz-focus-inner,
:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview) input[type="reset"]::-moz-focus-inner {
  border: 0;
  padding: 0;
}

:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview)
  :where(input:not([type]), input[type="text"], input[type="search"], input[type="email"],
    input[type="url"], input[type="tel"], input[type="number"], input[type="password"], select, textarea) {
  -webkit-appearance: none;
  appearance: none;
  font: inherit;
  color: inherit;
  background-color: #fff;
  border: 1px solid var(--t2-border, var(--t2-product-tone));
  border-radius: var(--t2-radius-control);
  padding: var(--t2-s1) var(--t2-s2);
  box-sizing: border-box;
  outline: 0;
  box-shadow: none;
}

:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview) select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  padding-right: var(--t2-s8);
}

:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview)
  :where(input:not([type]), input[type="text"], input[type="search"], input[type="email"],
    input[type="url"], input[type="tel"], input[type="number"], input[type="password"], select, textarea):focus,
:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview)
  :where(input:not([type]), input[type="text"], input[type="search"], input[type="email"],
    input[type="url"], input[type="tel"], input[type="number"], input[type="password"], select, textarea):focus-visible {
  outline: 0;
}

:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview) input[type="number"]::-webkit-inner-spin-button,
:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview) input[type="number"]::-webkit-outer-spin-button {
  margin: 0;
}

:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview) input[type="search"]::-webkit-search-cancel-button,
:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview) input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

@media (max-width: 767px), (pointer: coarse) {
  :where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
    .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview)
    :where(input:not([type]), input[type="text"], input[type="search"], input[type="email"],
      input[type="url"], input[type="tel"], input[type="number"], input[type="password"], select, textarea) {
    font-size: max(16px, 1em);
  }
}

html[data-t2editor-theme="dark"] :where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface], [data-t2-plugin-block], .t2-plugin-surface-modal, .t2c-react-picker,
  .t2c-ctx-menu, .t2-link-preview)
  :where(input:not([type]), input[type="text"], input[type="search"], input[type="email"],
    input[type="url"], input[type="tel"], input[type="number"], input[type="password"], select, textarea) {
  background-color: var(--t2-ink);
  border-color: var(--t2-ink-muted);
  color: var(--t2-line);
}

/* T2Editor Coding-Agent Rule: Write only concise, high-value comments. Preserve "Path: T2Editor/..." comments; update them when files move—never delete them. */

/* ========================================================================
   T2Editor Law-Aligned Design System — 2026-08 / shared form controls
   ======================================================================== */
:where(.t2-editor-container, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer)
  :where(input:not([type]), input[type="text"], input[type="search"], input[type="email"], input[type="url"],
  input[type="tel"], input[type="number"], input[type="password"], select, textarea) {
  min-height: 42px;
  padding: var(--t2-s2) var(--t2-s3);
  color: var(--t2-ink, var(--t2-ink));
  background: var(--t2-paper, #fff);
  border-color: var(--t2-line, var(--t2-line));
  border-radius: var(--t2-radius-control);
}
:where(.t2-editor-container, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer)
  :where(input:not([type]), input[type="text"], input[type="search"], input[type="email"], input[type="url"],
  input[type="tel"], input[type="number"], input[type="password"], select, textarea):focus-visible {
  border-color: var(--t2-product, var(--t2-product));

}
:where(.t2-editor-container, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer)
  :where(input[type="checkbox"], input[type="radio"], input[type="range"]) { accent-color: var(--t2-editor, var(--t2-product)); }
html[data-t2editor-theme="dark"] :where(.t2-editor-container, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer)
  :where(input:not([type]), input[type="text"], input[type="search"], input[type="email"], input[type="url"],
  input[type="tel"], input[type="number"], input[type="password"], select, textarea) {
  color: var(--t2-ink, var(--t2-warning-soft));
  background: var(--t2-paper-soft, var(--t2-ink));
  border-color: var(--t2-line, var(--t2-ink));
}
@media (max-width:767px), (pointer:coarse) {
  :where(.t2-editor-container, .t2-modal-overlay, [data-t2-modal-companion],
    .t2-color-picker-container, .t2-dropdown-layer)
    :where(input:not([type]), input[type="text"], input[type="search"], input[type="email"], input[type="url"],
    input[type="tel"], input[type="number"], input[type="password"], select, textarea) {
    min-height:44px;
    font-size:16px;
  }
}

/* T2Editor /law 706 — shared native-control hardening */
:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface],
  [data-t2-plugin-block], .t2-plugin-surface-modal)
  :where(button, input, textarea, select) {
  font: inherit;
  -webkit-tap-highlight-color: transparent;
}
:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface],
  [data-t2-plugin-block], .t2-plugin-surface-modal) button {
  -webkit-appearance: none;
  appearance: none;
}
:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface],
  [data-t2-plugin-block], .t2-plugin-surface-modal)
  :where(input:not([type]), input[type="text"], input[type="search"], input[type="email"],
    input[type="url"], input[type="tel"], input[type="number"], input[type="password"],
    input[type="date"], input[type="time"], input[type="datetime-local"], textarea, select) {
  -webkit-appearance: none;
  appearance: none;
  box-shadow: none;
}
:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface],
  [data-t2-plugin-block], .t2-plugin-surface-modal)
  :where(button, input, textarea, select):focus-visible {
  outline: 1px solid var(--t2-product, var(--t2-product));
  outline-offset: 2px;

}
html[data-t2editor-theme="dark"]
:where(.t2-editor-container, .t2-plugin-modal-overlay, .t2-modal-overlay, [data-t2-modal-companion],
  .t2-color-picker-container, .t2-dropdown-layer, [data-t2-plugin-surface],
  [data-t2-plugin-block], .t2-plugin-surface-modal)
  :where(button, input, textarea, select):focus-visible {
  outline-color: var(--t2-product, var(--t2-product));

}

}