/* Shared control finish, loaded after component styles.
   Important declarations prevent isolated component hover/focus rules from
   restoring native arrows or the old oversized rings. */
select:not([multiple]):not([size]),
select[size="1"]:not([multiple]) {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    padding-right: 42px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23c7bbec' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 16px 16px !important;
    color-scheme: dark;
    cursor: pointer;
}
select:disabled { cursor: not-allowed; }
:focus-within { outline: none !important; }
:focus,
:focus-visible {
    outline: none !important;
    outline-offset: 0 !important;
    box-shadow: none !important;
}
/* Keep keyboard location visible without a ring outside the component. */
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[contenteditable="true"]:focus-visible {
    border-color: #c499ef !important;
}
a:focus-visible,
button:focus-visible,
summary:focus-visible,
[role="button"]:focus-visible {
    border-color: #c499ef !important;
    text-decoration-line: underline;
    text-decoration-color: #d8b9ff;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
}
[tabindex]:focus-visible { filter: brightness(1.15); }
@media (forced-colors: active) {
    :focus-visible { outline: 2px solid Highlight !important; outline-offset: 2px !important; }
    select:not([multiple]):not([size]),
    select[size="1"]:not([multiple]) {
        appearance: auto !important;
        -webkit-appearance: auto !important;
        -moz-appearance: auto !important;
        background-image: none !important;
    }
}

/* Preserve native number validation and keyboard stepping without browser arrows. */
input[type="number"] {
    appearance: textfield !important;
    -webkit-appearance: textfield !important;
    -moz-appearance: textfield !important;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
    appearance: none !important;
    margin: 0 !important;
}

/* Coin amounts throughout admin, including fields with custom step controls. */
.admin-content input.admin-coin-field,
.admin-content .bundle-coin-input input,
.admin-content .style-coin-input input {
    min-width:0;
    min-height:48px;
    padding-left:49px !important;
    border:1px solid #46405c;
    border-radius:10px;
    background-color:#141624 !important;
    color:#ffe1a0 !important;
    font-size:1rem;
    font-weight:600;
}
.admin-content input.admin-coin-field {
    background-image:url('/images/currency/gold-coin.png') !important;
    background-position:13px center !important;
    background-size:26px 26px !important;
    background-repeat:no-repeat !important;
}
.admin-content .bundle-coin-input,
.admin-content .style-coin-input {display:block;position:relative;min-width:0}
.admin-content .bundle-coin-input img,
.admin-content .style-coin-input img {position:absolute;left:13px;top:50%;transform:translateY(-50%);width:26px;height:26px;object-fit:contain;pointer-events:none}
.admin-content input.admin-coin-field:hover:not(:disabled){border-color:#b7a2ff}
.admin-content input.admin-coin-field:disabled{opacity:.55}

/* Feature switches retain native checkbox binding and keyboard interaction. */
input[type=checkbox].settings-switch {
    appearance:none!important;
    -webkit-appearance:none!important;
    display:inline-block;
    position:relative;
    flex:0 0 42px;
    width:42px;
    height:24px;
    margin:0;
    padding:0;
    border:1px solid #645570;
    border-radius:999px;
    background:#302936!important;
    cursor:pointer;
    vertical-align:middle;
    transition:background-color .18s,border-color .18s;
}
input[type=checkbox].settings-switch::before {
    content:"";
    position:absolute;
    width:16px;
    height:16px;
    top:3px;
    left:3px;
    border-radius:50%;
    background:#c9c0d1;
    box-shadow:0 1px 3px #0005;
    transition:transform .18s,background-color .18s;
}
input[type=checkbox].settings-switch:checked {background:#b7a2ff!important;border-color:#b7a2ff}
input[type=checkbox].settings-switch:checked::before {transform:translateX(18px);background:#fff}
input[type=checkbox].settings-switch:hover:not(:disabled) {border-color:#c7bbec}
input[type=checkbox].settings-switch:focus-visible {border-color:#fff!important}
input[type=checkbox].settings-switch:disabled {opacity:.45;cursor:not-allowed}
@media(prefers-reduced-motion:reduce){input[type=checkbox].settings-switch,input[type=checkbox].settings-switch::before{transition:none}}
@media(forced-colors:active){input[type=checkbox].settings-switch{background:Canvas!important;border-color:ButtonText}input[type=checkbox].settings-switch:checked{background:Highlight!important}input[type=checkbox].settings-switch::before{background:ButtonText}input[type=checkbox].settings-switch:checked::before{background:HighlightText}}