/* Shared editable surfaces. Keep native toggles, file pickers, and color/range
   controls intact; preserve each component's sizing and validation borders. */
@media screen {
    html:is([data-theme-scope="admin"], [data-theme-scope="customer"]) {
        --field-glass-fill: rgba(255,255,255,.38);
        --field-glass-sheen: rgba(255,255,255,.18);
    }
    html:is([data-theme-scope="admin"], [data-theme-scope="customer"])[data-color-mode="dark"] {
        --field-glass-fill: rgba(255,255,255,.055);
        --field-glass-sheen: rgba(255,255,255,.035);
    }
    html:is([data-theme-scope="admin"], [data-theme-scope="customer"])[data-color-mode] body :is(input:not([type]), input:is([type="text"], [type="search"], [type="email"], [type="password"], [type="tel"], [type="url"], [type="number"], [type="date"], [type="datetime-local"], [type="time"], [type="month"], [type="week"]), textarea, .input-group-text, .product-search, .billing-search, .catalog-search-field, .addon-price-input) {
        background-color: var(--glass-fallback) !important;
        color: var(--site-text);
        color-scheme: var(--site-scheme);
    }
    @supports ((backdrop-filter: blur(12px)) or (-webkit-backdrop-filter: blur(12px))) {
        html:is([data-theme-scope="admin"], [data-theme-scope="customer"])[data-color-mode] body :is(input:not([type]), input:is([type="text"], [type="search"], [type="email"], [type="password"], [type="tel"], [type="url"], [type="number"], [type="date"], [type="datetime-local"], [type="time"], [type="month"], [type="week"]), textarea, .input-group-text, .product-search, .billing-search, .catalog-search-field, .addon-price-input) {
            background-color: var(--field-glass-fill) !important;
            background-image: linear-gradient(135deg, var(--field-glass-sheen), transparent 70%) !important;
            backdrop-filter: blur(12px) saturate(115%);
            -webkit-backdrop-filter: blur(12px) saturate(115%);
        }
    }
    html:is([data-theme-scope="admin"], [data-theme-scope="customer"])[data-color-mode] body :is(input:not([type]), input:is([type="text"], [type="search"], [type="email"], [type="password"], [type="tel"], [type="url"], [type="number"], [type="date"], [type="datetime-local"], [type="time"], [type="month"], [type="week"]), textarea)::placeholder { color: var(--site-muted); opacity: 1; }
    html:is([data-theme-scope="admin"], [data-theme-scope="customer"])[data-color-mode] body :is(input:not([type]), input:is([type="text"], [type="search"], [type="email"], [type="password"], [type="tel"], [type="url"], [type="number"], [type="date"], [type="datetime-local"], [type="time"], [type="month"], [type="week"]), textarea):focus-visible {
        outline: 2px solid var(--site-accent-text);
        outline-offset: 2px;
    }
    html:is([data-theme-scope="admin"], [data-theme-scope="customer"])[data-color-mode] body :is(input:not([type]), input:is([type="text"], [type="search"], [type="email"], [type="password"], [type="tel"], [type="url"], [type="number"], [type="date"], [type="datetime-local"], [type="time"], [type="month"], [type="week"]), textarea):disabled { opacity: .65; cursor: not-allowed; }
    /* Search and price wrappers own the glass, avoiding a second inset box. */
    html:is([data-theme-scope="admin"], [data-theme-scope="customer"])[data-color-mode] body :is(.product-search, .billing-search, .catalog-search-field, .addon-price-input) input {
        background: transparent !important;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
}
@media (prefers-reduced-transparency: reduce), (forced-colors: active) {
    html:is([data-theme-scope="admin"], [data-theme-scope="customer"])[data-color-mode] body :is(input:not([type]), input:is([type="text"], [type="search"], [type="email"], [type="password"], [type="tel"], [type="url"], [type="number"], [type="date"], [type="datetime-local"], [type="time"], [type="month"], [type="week"]), textarea, .input-group-text, .product-search, .billing-search, .catalog-search-field, .addon-price-input) {
        background-color: var(--glass-fallback) !important;
        background-image: none !important;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
}