/* Shared native controls. Widths, native form values and picker behavior stay owned by each page. */
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry){--a4-control-bg:#0a1b2b;--a4-control-border:#334b60;--a4-control-hover:#597085;--a4-control-focus:#60a5fa;--a4-control-text:#edf6ff;--a4-chevron-down:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23a1b8cc' stroke-width='1.65' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");--a4-chevron-up:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 10 4-4 4 4' fill='none' stroke='%23a1b8cc' stroke-width='1.65' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(input:not([type]),input[type=text],input[type=password],input[type=email],input[type=number],input[type=search],input[type=url],input[type=tel],input[type=date],input[type=time],input[type=datetime-local],input[type=month],input[type=week],select,textarea),
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(main,form,.modal,.ui-dialog) :is(input:not([type]),input[type=text],input[type=password],input[type=email],input[type=number],input[type=search],input[type=url],input[type=tel],input[type=date],input[type=time],input[type=datetime-local],input[type=month],input[type=week],select,textarea){box-sizing:border-box;max-width:100%;min-height:42px;height:auto;padding:9px 12px;border:1px solid var(--a4-control-border);border-radius:10px;background-color:var(--a4-control-bg);color:var(--a4-control-text);color-scheme:dark;font-size:12px;line-height:1.5;vertical-align:middle;box-shadow:inset 0 1px 2px #00000014;caret-color:var(--a4-control-focus);transition:border-color .16s,box-shadow .16s,background-color .16s}
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(main,form,.modal,.ui-dialog) :is(input,textarea)::placeholder{color:#809bb3;opacity:1}
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(main,form,.modal,.ui-dialog) :is(input:not([type]),input[type=text],input[type=password],input[type=email],input[type=number],input[type=search],input[type=url],input[type=tel],input[type=date],input[type=time],input[type=datetime-local],input[type=month],input[type=week],select,textarea):hover:not(:disabled):not(:focus){border-color:var(--a4-control-hover)}
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(main,form,.modal,.ui-dialog) :is(input:not([type]),input[type=text],input[type=password],input[type=email],input[type=number],input[type=search],input[type=url],input[type=tel],input[type=date],input[type=time],input[type=datetime-local],input[type=month],input[type=week],select,textarea):focus{border-color:var(--a4-control-focus);outline:0;box-shadow:0 0 0 3px #60a5fa24;background-color:#0d2134}
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(main,form,.modal,.ui-dialog) :is(input:not([type]),input[type=text],input[type=password],input[type=email],input[type=number],input[type=search],input[type=url],input[type=tel],input[type=date],input[type=time],input[type=datetime-local],input[type=month],input[type=week],select,textarea):disabled{background-color:#091725;border-color:#334b6080;color:#91a5b7;opacity:.58;cursor:not-allowed;box-shadow:none}
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(main,form,.modal,.ui-dialog) :is(input,textarea)[readonly]{background-color:#091928;color:#bfd1e0}
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) textarea:is(:enabled,:disabled),
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(main,form,.modal,.ui-dialog) textarea:is(:enabled,:disabled){min-height:104px;height:auto;line-height:1.8;padding:12px;resize:vertical}
/* Reserve a separate arrow lane; the native select remains focusable and opens its native picker. */
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) select:is(:enabled,:disabled),
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(main,form,.modal,.ui-dialog) select:is(:enabled,:disabled){-webkit-appearance:none;appearance:none;padding-inline-start:12px;padding-inline-end:38px;background-image:var(--a4-chevron-down);background-repeat:no-repeat;background-size:16px 16px;background-position:right 12px center;cursor:pointer;text-overflow:ellipsis;left:auto;right:auto}
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) select:dir(rtl),
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(main,form,.modal,.ui-dialog) select:dir(rtl){background-position:left 12px center}
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) select:dir(ltr),
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(main,form,.modal,.ui-dialog) select:dir(ltr){background-position:right 12px center}
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) select option{color:#edf6ff;background:#0f263b}
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) select option:disabled{color:#809bb3}
@supports selector(select:open){body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(main,form,.modal,.ui-dialog) select:open{background-image:var(--a4-chevron-up);border-color:#60a5fa}}
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) select:is([multiple],[size]:not([size="0"]):not([size="1"])),
body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(main,form,.modal,.ui-dialog) select:is([multiple],[size]:not([size="0"]):not([size="1"])){-webkit-appearance:auto;appearance:auto;background-image:none;padding:9px 12px;height:auto;cursor:default;white-space:normal}
/* Native and existing custom folder controls share the same outline and chevron. */
body.a4-workspace .a4-files .search>#key,body.a4-workspace .a4-upload #files_list .a4-selected-description .fdescr{min-height:42px;height:auto;padding:9px 12px;border-radius:10px;background-color:#0a1b2b;border-color:#334b60}
body.a4-workspace .a4-files .search>#key:focus,body.a4-workspace .a4-upload #files_list .a4-selected-description .fdescr:focus{border-color:#60a5fa;background-color:#0d2134;outline:0;box-shadow:0 0 0 3px #60a5fa24}
body.a4-workspace .a4-files .search>#key:hover:not(:focus),body.a4-workspace .a4-upload #files_list .a4-selected-description .fdescr:hover:not(:focus){border-color:#597085}
body.a4-workspace .a4-files--studio .search{padding-block:7px}
body.a4-workspace .a4-files--studio .a4-files__folder-select-trigger{min-height:42px;border-radius:10px;padding:9px 12px;border-color:#334b60;background:#0a1b2b;color:#edf6ff;line-height:1.5}
body.a4-workspace .a4-files--studio .a4-files__folder-select-trigger:hover,body.a4-workspace .a4-files--studio .a4-files__folder-select-trigger[aria-expanded=true]{border-color:#597085;background:#10283e}
body.a4-workspace .a4-files--studio .a4-files__folder-select-trigger:focus-visible{outline:0;border-color:#60a5fa;box-shadow:0 0 0 3px #60a5fa24}
body.a4-workspace :is(.a4-menu,.a4-files__sidebar)>summary,body.a4-workspace .a4-admin-advanced>summary{list-style:none}
body.a4-workspace :is(.a4-menu,.a4-files__sidebar)>summary::-webkit-details-marker,body.a4-workspace .a4-admin-advanced>summary::-webkit-details-marker{display:none}
body.a4-workspace :is(.a4-menu,.a4-files__sidebar)>summary::marker,body.a4-workspace .a4-admin-advanced>summary::marker{content:""}
body.a4-workspace .a4-menu>summary>.a4-chevron,body.a4-workspace .a4-files--studio .a4-files__sidebar>summary>.a4-files__chevron,body.a4-workspace .a4-files--studio .a4-files__folder-select-trigger>svg{width:16px;height:16px;flex:0 0 16px;stroke:transparent;fill:none;background:var(--a4-chevron-down) center/16px 16px no-repeat;transform:rotate(0);transition:transform .16s}
body.a4-workspace .a4-menu[open]>summary>.a4-chevron,body.a4-workspace .a4-files--studio .a4-files__sidebar[open]>summary>.a4-files__chevron,body.a4-workspace .a4-files--studio .a4-files__folder-select-trigger[aria-expanded=true]>svg{transform:rotate(180deg)}
body.a4-workspace .a4-admin-advanced>summary{display:flex;align-items:center;justify-content:space-between;gap:12px}
body.a4-workspace .a4-admin-advanced>summary::after{content:"";display:block;width:16px;height:16px;flex:0 0 16px;background:var(--a4-chevron-down) center/16px 16px no-repeat;transition:transform .16s}
body.a4-workspace .a4-admin-advanced[open]>summary::after{transform:rotate(180deg)}
/* The password reveal occupies its own lane after the entry fields become compact. */
body:is(.login-page,.a4-entry) form .field input[name=password]{padding-inline-end:46px}
body:is(.login-page,.a4-entry) .input-wrap .reveal{top:4px;bottom:4px;height:auto;width:34px}
/* Existing settings rules use !important font sizes; keep mobile inputs legible without zoom. */
@media(max-width:640px){body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(main,form,.modal,.ui-dialog) :is(input:not([type]),input[type=text],input[type=password],input[type=email],input[type=number],input[type=search],input[type=url],input[type=tel],input[type=date],input[type=time],input[type=datetime-local],input[type=month],input[type=week],select,textarea){font-size:16px!important;line-height:1.4;padding-block:9px}}
@media(prefers-reduced-motion:reduce){body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(input,select,textarea),body.a4-workspace .a4-menu>summary>.a4-chevron,body.a4-workspace .a4-files--studio .a4-files__sidebar>summary>.a4-files__chevron,body.a4-workspace .a4-files--studio .a4-files__folder-select-trigger>svg,body.a4-workspace .a4-admin-advanced>summary::after{transition:none}}
@media(forced-colors:active){body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(main,form,.modal,.ui-dialog) select{appearance:auto;-webkit-appearance:auto;background-image:none;padding-inline-end:12px}body:is(.a4-workspace,.a4-legacy,.login-page,.a4-entry) :is(input,select,textarea):focus-visible{outline:2px solid Highlight;outline-offset:2px}body.a4-workspace .a4-menu>summary>.a4-chevron,body.a4-workspace .a4-files--studio .a4-files__sidebar>summary>.a4-files__chevron,body.a4-workspace .a4-files--studio .a4-files__folder-select-trigger>svg{background:none;stroke:ButtonText}body.a4-workspace .a4-admin-advanced>summary::after{background:none;border-inline-end:2px solid ButtonText;border-bottom:2px solid ButtonText;width:8px;height:8px;flex-basis:8px;transform:rotate(45deg)}body.a4-workspace .a4-admin-advanced[open]>summary::after{transform:rotate(225deg)}}