/* 用途：复选框、单选框与主题色开关；文件：public/assets/selection-controls.css。 */
/* 模块：全站复选框、单选框及开关。统一尺寸和主题绿色，动态插入的表单自动继承。 */
/* 样式分区：input[type=checkbox]:not([role=switch]),input[type=radio]；维护此组件的布局、外观与交互状态。 */

input[type=checkbox]:not([role=switch]),input[type=radio]{appearance:none!important;-webkit-appearance:none!important;display:inline-block!important;position:relative;flex:0 0 18px!important;width:18px!important;height:18px!important;min-width:18px!important;min-height:18px!important;max-width:18px!important;margin:0 6px 0 0!important;padding:0!important;border:1.5px solid var(--border,#d6dfd5)!important;border-radius:5px!important;background:#fff!important;vertical-align:middle;cursor:pointer;accent-color:var(--green,#214c42);box-shadow:none;transition:background-color .15s,border-color .15s}
/* 样式分区：input[type=radio]；维护此组件的布局、外观与交互状态。 */

input[type=radio]{border-radius:50%!important}
input[type=checkbox]:not([role=switch]):checked{border-color:var(--green,#214c42)!important;background:var(--green,#214c42) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3.5 8 3 3 6-6' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px 14px no-repeat!important}
input[type=checkbox]:not([role=switch]):indeterminate{border-color:var(--green,#214c42)!important;background:var(--green,#214c42) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8h8' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/14px 14px no-repeat!important}
/* 样式分区：input[type=radio]:checked；维护此组件的布局、外观与交互状态。 */

input[type=radio]:checked{border-color:var(--green,#214c42)!important;background:radial-gradient(circle,#fff 0 3px,transparent 3.5px),var(--green,#214c42)!important}
/* 模块：开关共享外观。输入偏好、导航显示和键盘映射使用相同轨道与滑块。 */
/* 样式分区：input[type=checkbox][role=switch],button[role=switch]；维护此组件的布局、外观与交互状态。 */

input[type=checkbox][role=switch],button[role=switch]{appearance:none!important;-webkit-appearance:none!important;position:relative;display:inline-block;flex:0 0 44px;width:44px!important;min-width:44px!important;height:26px!important;min-height:26px!important;max-width:44px!important;padding:0!important;margin:0!important;border:0!important;border-radius:999px!important;background:#cdd5ce!important;vertical-align:middle;cursor:pointer;box-shadow:inset 0 0 0 1px #00000006;transition:background-color .15s}
/* 样式分区：input[type=checkbox][role=switch]::before,button[role=switch]::before；维护此组件的布局、外观与交互状态。 */

input[type=checkbox][role=switch]::before,button[role=switch]::before{content:'';position:absolute!important;top:3px!important;left:3px!important;width:20px!important;height:20px!important;border-radius:50%!important;background:#fff!important;box-shadow:0 1px 3px #0002;transform:translateX(0)!important;transition:transform .15s}
/* 样式分区：input[type=checkbox][role=switch]:checked,button[role=switch][aria-checked=true]；维护此组件的布局、外观与交互状态。 */

input[type=checkbox][role=switch]:checked,button[role=switch][aria-checked=true]{background:var(--green,#214c42)!important}
/* 样式分区：input[type=checkbox][role=switch]:checked::before,button[role=switch][aria-checked=true]::before；维护此组件的布局、外观与交互状态。 */

input[type=checkbox][role=switch]:checked::before,button[role=switch][aria-checked=true]::before{transform:translateX(18px)!important}
/* 样式分区：input[type=checkbox]:disabled,input[type=radio]:disabled,button[role=switch]:disabled；维护此组件的布局、外观与交互状态。 */

input[type=checkbox]:disabled,input[type=radio]:disabled,button[role=switch]:disabled{opacity:.45;cursor:default}
/* 键盘导航仍可找到未操作的控件；确认选择后由交互组件释放焦点。 */
/* 样式分区：input[type=checkbox]:focus-visible,input[type=radio]:focus-visible,button[role=switch]:focus-visible；维护此组件的布局、外观与交互状态。 */

input[type=checkbox]:focus-visible,input[type=radio]:focus-visible,button[role=switch]:focus-visible{outline:2px solid var(--green,#214c42)!important;outline-offset:3px}
/* 样式分区：@media(prefers-reduced-motion:reduce)；维护此组件的布局、外观与交互状态。 */

@media(prefers-reduced-motion:reduce){input[type=checkbox],input[type=radio],button[role=switch],input[type=checkbox][role=switch]::before,button[role=switch]::before{transition:none!important}}
@media(forced-colors:active){input[type=checkbox]:not([role=switch]),input[type=radio]{appearance:auto!important;background:Canvas!important;border-color:ButtonText!important}}
