/* Scoped controls: avoid the receipt designer's global input-as-toggle rules. */
html[data-theme] body :is(#salary-tax-editor,#salary-tax-settings) {
  display: grid; gap: 14px; min-width: 0; padding: 18px;
  border: 1px solid var(--admin-line); border-radius: 12px;
  color: var(--admin-text); background: var(--admin-surface);
}
html[data-theme] body :is(#salary-tax-editor,#salary-tax-settings) :is(h4,p) { margin: 0; }
html[data-theme] body :is(#salary-tax-editor,#salary-tax-settings) :is(p,small,summary) { color: var(--admin-muted); line-height: 1.65; }
html[data-theme] body :is(#salary-tax-editor,#salary-tax-settings) label { display: block; min-width: 0; font-size: 14px; font-weight: 700; color: var(--admin-text); }
html[data-theme] body .salary-tax-value { display: flex; align-items: center; gap: 8px; margin-top: 8px; min-width: 0; }
html[data-theme] body :is(#salary-tax-editor,#salary-tax-settings) input {
  position: static !important; display: block !important; appearance: none !important;
  width: 100% !important; min-width: 0 !important; height: 48px !important;
  padding: 10px 12px !important; margin: 0 !important; border-radius: 8px !important;
  border: 1px solid var(--admin-line) !important; background: var(--admin-control) !important;
  color: var(--admin-text) !important; -webkit-text-fill-color: var(--admin-text) !important;
  font: inherit !important; font-size: 18px !important; font-weight: 700 !important; line-height: 1.4 !important;
  text-align: right !important; box-shadow: none !important; transform: none !important;
  background-image: none !important; transition: none !important; opacity: 1 !important; filter: none !important;
}
html[data-theme] body :is(#salary-tax-editor,#salary-tax-settings) input::after { content: none !important; }
html[data-theme] body :is(#salary-tax-editor,#salary-tax-settings) input:focus-visible { outline: 3px solid var(--admin-focus) !important; outline-offset: 2px; }
html[data-theme] body :is(#salary-tax-editor,#salary-tax-settings) input:read-only { background: var(--admin-raised) !important; }
html[data-theme] body :is(#salary-tax-editor,#salary-tax-settings) input::placeholder { color: var(--admin-muted) !important; -webkit-text-fill-color: var(--admin-muted) !important; }
.salary-tax-settings-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.salary-tax-settings-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
html[data-theme] body .salary-tax-modes { display: grid; grid-template-columns: 1fr; gap: 8px; }
html[data-theme] body :is(#salary-tax-editor,#salary-tax-settings) button { min-height: 48px; min-width: 0; white-space: normal; line-height: 1.4; padding: 10px 14px; border-radius: 8px; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
html[data-theme] body #salary-tax-editor .salary-tax-modes button { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; text-align: left; border: 2px solid var(--admin-line); }
html[data-theme] body #salary-tax-editor .salary-tax-modes strong { font-size: 14px; }
html[data-theme] body #salary-tax-editor .salary-tax-modes small { font-size: 12px; color: inherit; }
html[data-theme] body #salary-tax-editor .salary-tax-modes button[aria-pressed="true"]::before { content: '✓'; flex-shrink: 0; font-weight: 900; }
html[data-theme] body #salary-tax-editor .salary-tax-calculation { padding: 12px; border: 1px solid var(--admin-line); border-radius: 8px; font-size: 16px; font-weight: 700; color: var(--admin-text); }
html[data-theme] body :is(#salary-tax-editor,#salary-tax-settings) [data-error="true"] { padding: 8px; border-left: 3px solid var(--admin-focus); font-weight: 700; color: var(--admin-text); }
html[data-theme] body :is(#salary-tax-editor,#salary-tax-settings) button:disabled { cursor: not-allowed; opacity: .65; }
html[data-theme] body :is(#salary-tax-save,#save-salary-tax-settings):not(:disabled) { color: var(--admin-on-accent); background: var(--admin-accent); border: 1px solid var(--admin-focus); }
/* Existing payroll-setting grids must not widen the entire panel on tablets. */
#settings [data-settings-panel="payroll"] { min-width: 0; }
@media(max-width:1100px) {
  #settings [data-settings-panel="payroll"] :is(.payroll-basic-form,.salary-adjustment-create,.salary-adjustment-row) { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #settings [data-settings-panel="payroll"] :is(.salary-adjustment-row-summary,.salary-adjustment-row-actions) { grid-column: 1 / -1; }
}
@media(max-width:700px) {
  #settings [data-settings-panel="payroll"] :is(.payroll-basic-form,.salary-adjustment-create,.salary-adjustment-row) { grid-template-columns: 1fr; }
}
@media(max-width:600px) { .salary-tax-settings-grid { grid-template-columns: 1fr; } html[data-theme] body :is(#salary-tax-editor,#salary-tax-settings) { padding: 12px; } }
