/* No control wrappers: existing toolbar, grid and form selectors remain valid. */
.input-clear-control{position:absolute;z-index:3;display:grid;place-items:center;width:28px;height:28px;min-width:28px;min-height:28px;padding:0;border:0;border-radius:5px;background:transparent;color:var(--text-secondary);cursor:pointer;line-height:1;box-shadow:none}
.input-clear-control[hidden]{display:none!important}
.input-clear-control::before{content:"";position:absolute;inset:4px;border-radius:4px;pointer-events:none}
.input-clear-control:hover{background:transparent;color:var(--text-primary)}
.input-clear-control:hover::before{background:var(--surface-hover)}
.input-clear-control:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}
.input-clear-control svg{position:relative;display:block;pointer-events:none}
input.has-input-clear-control:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),textarea.has-input-clear-control{padding-inline-end:var(--input-clear-reserve,36px)}
input.has-input-clear-control[type=search]::-webkit-search-cancel-button{display:none}
.query-dates input.has-input-clear-control[type=date]{width:190px;padding-inline-end:var(--input-clear-reserve,60px)}
@media(max-width:767px){
 .input-clear-control{width:44px;height:44px;min-width:44px;min-height:44px}
 .input-clear-control svg{width:18px;height:18px}
 .toolbar>input.has-input-clear-control{flex:1 1 160px;min-width:min(160px,100%)}
 .toolbar>input.has-input-clear-control:is([type=date],[type=datetime-local],[type=month],[type=week],[type=time]){flex-basis:100%;min-width:0}
 .query-dates>label:has(input[type=date]),.field-grid>label:has(input:is([type=date],[type=datetime-local],[type=month],[type=week],[type=time])),.admin-form-grid>label:has(input:is([type=date],[type=datetime-local],[type=month],[type=week],[type=time])){grid-column:1/-1}
 .query-dates input.has-input-clear-control[type=date]{width:100%;min-width:0}
 input.has-input-clear-control[type=number]{min-width:min(140px,100%)}
}