/* GAMEIOS_FAST_UI_START */
:root {
    --gios-fast-ease: cubic-bezier(.2, .8, .2, 1);
    --gios-fast-duration: 120ms;
}

button,
a[href],
[role="button"],
input[type="button"],
input[type="submit"],
.btn,
.button,
.swal2-confirm,
.swal2-cancel {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

button:not([disabled]),
a[href],
[role="button"],
input[type="button"],
input[type="submit"],
.btn,
.button,
.swal2-confirm,
.swal2-cancel,
.transition-all {
    transition-property: transform, opacity, color, background-color, border-color, box-shadow !important;
    transition-duration: var(--gios-fast-duration) !important;
    transition-timing-function: var(--gios-fast-ease) !important;
    backface-visibility: hidden;
}

button:not([disabled]),
[role="button"],
.btn,
.button,
.swal2-confirm,
.swal2-cancel,
.theme-preset-card {
    will-change: transform;
}

button:not([disabled]):active,
a[href]:active,
[role="button"]:active,
input[type="button"]:active,
input[type="submit"]:active,
.btn:active,
.button:active,
.swal2-confirm:active,
.swal2-cancel:active {
    transform: translate3d(0, 1px, 0) scale(.985) !important;
}

button[disabled],
[aria-disabled="true"] {
    cursor: not-allowed !important;
    opacity: .55 !important;
    transform: none !important;
}

html.gameios-theme-changing * {
    transition-duration: 90ms !important;
}

html.gameios-fast-theme-no-motion *,
html.gameios-fast-theme-no-motion *::before,
html.gameios-fast-theme-no-motion *::after {
    transition-duration: 45ms !important;
    animation-duration: .001s !important;
    animation-iteration-count: 1 !important;
}

#theme-preset-grid {
    grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)) !important;
    gap: .55rem !important;
    max-height: 560px;
    overflow: auto;
    padding-right: 3px;
}

.theme-preset-card {
    min-height: 112px !important;
    padding: .6rem !important;
    border-radius: .9rem !important;
    contain: layout paint;
}

.theme-preset-card .w-10.h-10,
.theme-preset-card .w-10 {
    width: 28px !important;
    height: 28px !important;
    border-radius: .65rem !important;
}

.theme-preset-card [data-lucide] {
    width: 14px !important;
    height: 14px !important;
}

.theme-preset-card .w-6.h-6,
.theme-preset-card .w-6 {
    width: 14px !important;
    height: 14px !important;
    border-radius: .4rem !important;
}

.theme-preset-card .text-\[11px\] {
    font-size: 9.5px !important;
    line-height: 1.25 !important;
    min-height: 30px !important;
}

.theme-preset-card .font-bold.text-white.text-sm {
    font-size: 11.5px !important;
    line-height: 1.2 !important;
}

input[type="color"] {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    border-radius: 8px !important;
}

#gameios-theme-save-state.saving::after { content: 'Đang lưu...'; }
#gameios-theme-save-state.saved::after { content: 'Đã lưu'; }
#gameios-theme-save-state.error::after { content: 'Lỗi lưu'; color: #fca5a5; }

@media (max-width: 640px) {
    :root { --gios-fast-duration: 95ms; }
    #theme-preset-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        max-height: 520px;
    }
    .theme-preset-card {
        min-height: 96px !important;
        padding: .5rem !important;
    }
    .theme-preset-card .text-\[11px\] {
        display: none !important;
    }
    input[type="color"] {
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .001s !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 45ms !important;
    }
}
/* GAMEIOS_FAST_UI_END */