/* Shared admin controls. Features own layout, never a second copy of a control. */
:root{--control-font-size:16px;--control-radius:7px;--control-border:#cbdbe8;--control-focus:#088eae}
button,input,textarea,select{font:inherit;font-size:var(--control-font-size);color:inherit}
button{cursor:pointer}
.btn.btn--icon{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;padding:10px;flex-shrink:0}
summary.btn--icon::marker{content:""}
summary.btn--icon::-webkit-details-marker{display:none}
input,textarea,select{min-width:0;max-width:100%;background:#fff;border:1px solid var(--control-border);border-radius:var(--control-radius);padding:10px 12px}
input:not([type=checkbox]):not([type=radio]),select{min-height:46px}
/* Optional password reveal keeps the native field and password-manager support. */
.password-control{position:relative}
.field>.password-control{margin-top:8px}
.password-control>input{display:block;width:100%;font-weight:400}
.password-control:has([data-password-toggle]:not([hidden]))>input{padding-inline-end:56px}
.password-control .btn.password-toggle{position:absolute;inset-inline-end:1px;top:50%;transform:translateY(-50%);width:44px;height:44px;min-height:44px;border:0;background:transparent;color:var(--muted)}
.password-control .password-toggle:hover{color:var(--accent);background:var(--tint)}
.password-toggle:focus-visible{outline-offset:-4px}
.password-toggle>span{display:flex}
.password-control .password-toggle[hidden],.password-toggle>span[hidden]{display:none}
.password-actions{display:flex;flex-wrap:wrap;gap:.5rem}
.password-assistant [role=status]:not(:empty){display:block;margin-top:.5rem}
.password-control:has([data-password-toggle]:not([hidden]))>input::-ms-reveal{display:none}
/* Keep the native picker and filename; share the button appearance across uploads. */
input[type=file]{padding:0;padding-inline-end:12px;overflow:hidden;text-overflow:ellipsis}
input[type=file]::file-selector-button{min-height:44px;margin:0;margin-inline-end:12px;padding:10px 16px;border:0;border-inline-end:1px solid var(--control-border);border-radius:calc(var(--control-radius) - 1px);background:var(--surface-soft);color:var(--ink);font:inherit;font-weight:500;cursor:pointer}
input[type=file]:not(:disabled)::file-selector-button:hover{background:var(--tint);color:var(--accent)}
input[type=file]:disabled::file-selector-button{cursor:not-allowed}
.file-drop[data-drop-ready]{padding:20px;border:2px dashed var(--control-border);border-radius:var(--control-radius);background:var(--surface-soft);transition:border-color .15s,background-color .15s}
.file-drop[data-drop-ready]:focus-within,.file-drop[data-drop-active]{border-color:var(--control-focus)}
.file-drop[data-drop-active]{background:var(--tint)}
.file-drop-hint{margin:0 0 16px;font-weight:600}
.file-drop .field{margin:0}
input:focus,textarea:focus,select:focus{outline:2px solid var(--control-focus);outline-offset:2px}
/* Keep native suggestions discoverable before hover or focus. */
input[list]::-webkit-calendar-picker-indicator{opacity:1!important}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--control-focus);outline-offset:4px}
input:disabled,textarea:disabled,select:disabled,button:disabled{opacity:.6;cursor:not-allowed}
input[aria-invalid=true],textarea[aria-invalid=true],select[aria-invalid=true]{border-color:var(--danger)}
input[type=checkbox],input[type=radio]{accent-color:var(--accent)}
/* Native checkbox behavior and form values, shared switch appearance. */
input[type=checkbox]{appearance:none;display:inline-block;vertical-align:middle;box-sizing:border-box;flex:0 0 auto;width:48px;height:28px;margin:0;padding:3px;border:2px solid transparent;border-radius:999px;background:#74879b;cursor:pointer;transition:background-color .15s,border-color .15s}
input[type=checkbox]::before{content:"";display:block;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #14304b33;transform:translateX(0);transition:transform .15s}
input[type=checkbox]:checked,input[type=checkbox]:indeterminate{background:var(--accent)}
input[type=checkbox]:checked::before{transform:translateX(20px)}
input[type=checkbox]:indeterminate::before{transform:translateX(10px) scaleY(.22)}
input[type=checkbox]:not(:disabled):hover{border-color:#14304b55}
input[type=checkbox][aria-invalid=true]{border-color:var(--danger)}
label:has(input[type=checkbox]){min-height:44px;cursor:pointer}
label:has(input[type=checkbox]:disabled){cursor:not-allowed}
@media(prefers-reduced-motion:reduce){input[type=checkbox],input[type=checkbox]::before{transition:none}}
@media(forced-colors:active){input[type=checkbox]{appearance:auto;width:24px;height:24px;padding:0;border:0;background:Canvas;transition:none}input[type=checkbox]::before{display:none}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;min-height:46px;background:#fff;border:1px solid var(--control-border);border-radius:var(--control-radius);font-weight:500;text-align:center}
.btn:hover{background:var(--tint)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:white}
.btn.primary:hover{background:var(--accent-hover)}
.btn--highlight{background:var(--tint);border-color:var(--accent);color:var(--accent);box-shadow:inset 0 -2px 0 var(--accent)}
.btn.danger{color:var(--danger);border-color:var(--danger)}
.btn.danger:hover{background:#fff0eb}
.btn[aria-disabled=true]{color:var(--muted);background:var(--surface-soft);cursor:default}
.field-error,.field .field-error{display:block;color:var(--danger);font-size:14px;font-weight:400;margin-top:7px}
.character-count,.field .character-count{display:block;margin-top:7px;color:var(--muted);font-size:14px;font-weight:400;text-align:end;overflow-wrap:anywhere}
.character-count--exceeded,.field .character-count--exceeded{color:var(--danger)}

/* Low-emphasis actions, e.g. the shared admin toolbar. */
.btn--quiet{background:transparent;border-color:transparent;padding-inline:6px;font-size:inherit}
/* Shared informational button: a 44px target with a filled info icon. */
.btn.btn--help{background:transparent;border-color:transparent;padding:8px}
.btn--help .cc-icon{width:28px;height:28px}
.btn--help .cc-icon circle{fill:var(--accent);stroke:var(--accent)}
.btn--help .cc-icon path{stroke:#fff}
.btn--help:hover .cc-icon circle{fill:var(--accent-hover);stroke:var(--accent-hover)}
.btn[aria-pressed=true]{background:var(--tint);border-color:var(--accent);color:var(--accent);box-shadow:inset 0 -2px 0 var(--accent)}
/* Row selection is a native square checkbox, distinct from on/off settings. */
input[type=checkbox].ui-selection-check{appearance:auto;width:20px;height:20px;padding:0;border-radius:3px;background:initial;transition:none}
input[type=checkbox].ui-selection-check::before{display:none}