.column-header-controls { display: flex; align-items: center; gap: 4px; min-height: 32px; margin: -7px -8px -5px; }
.column-name-input { display: block; flex: 1 1 auto; width: 1px; min-width: 64px; height: 32px; padding: 6px 8px; border: 1px solid transparent; border-radius: var(--radius-input); background: transparent; color: var(--ink); font: 500 12px/1.3 var(--sans); text-overflow: ellipsis; }
.column-name-input:not(:disabled):not([aria-invalid="true"]):hover { border-color: var(--accent-line); background: var(--surface); }
.column-name-input:not(:disabled):not([aria-invalid="true"]):active { border-color: var(--accent); }
.column-name-input:focus { border-color: var(--focus-ring); outline: 1px solid var(--focus-ring); outline-offset: 0; background: var(--surface); text-overflow: clip; }
.column-name-input:focus-visible { outline-width: 2px; }
.column-name-input:disabled { color: var(--muted); cursor: not-allowed; }
.column-name-input[aria-invalid="true"] { border-color: var(--red); background: var(--red-wash); }
.column-name-input[aria-invalid="true"]:focus { outline-color: var(--red); }
.column-drag-handle, .column-options-button { flex: 0 0 28px; display: inline-grid; place-items: center; width: 28px; min-height: 32px; padding: 4px; border: 0; border-radius: var(--radius-control); background: transparent; color: var(--muted); opacity: 0; font-size: 15px; }
.column-drag-handle { cursor: grab; touch-action: none; user-select: none; -webkit-user-drag: none; }
.column-drag-handle:not(:disabled):active { cursor: grabbing; }
th:hover .column-drag-handle:not(:disabled), th:hover .column-options-button:not(:disabled), th:focus-within .column-drag-handle:not(:disabled), th:focus-within .column-options-button:not(:disabled) { opacity: 1; }
.column-drag-handle:not(:disabled):hover, .column-options-button:not(:disabled):hover, .column-options-button[aria-expanded="true"]:not(:disabled) { opacity: 1; color: var(--accent-hover); background: var(--accent-wash); }
.column-drag-handle:not(:disabled):active, .column-options-button:not(:disabled):active { opacity: 1; color: var(--accent-active); background: var(--accent-wash-hover); }
.column-drag-handle:focus-visible, .column-options-button:focus-visible { opacity: 1; outline: 2px solid var(--focus-ring); outline-offset: 1px; }
.column-drag-handle:disabled, .column-options-button:disabled { color: var(--muted); cursor: not-allowed; opacity: .45; }
.order-table th.column-is-dragging { opacity: .45; }
.order-table th.column-drop-before { box-shadow: inset 3px 0 var(--accent); }
.order-table th.column-drop-after { box-shadow: inset -3px 0 var(--accent); }
.column-popover__form + form { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); }
@media (hover: none) { .column-drag-handle, .column-options-button { opacity: 1; } }
@media (max-width: 700px) { .column-name-input { font-size: 16px; } }

.order-table th[data-column-type="number"]:not([data-column-key="quantity"]) { min-width: 140px; }
.order-table th[data-column-key="quantity"] .column-name-input { min-width: 48px; }
.order-table th[data-column-type="date"] .column-name-input { min-width: 96px; }