/* Shared feedback for public pages, auth and cabinet. See design-system/arvr-media/INTERACTIONS.md.
   Existing component aliases live here; feature styles must not invent another motion system. */
html[data-theme="arvr_theme"] body.ds-theme :where(a, button, summary, input, select, textarea, [role="tab"]) {
    transition: color var(--transition-fast), background-color var(--transition-fast),
        border-color var(--transition-fast), text-decoration-color var(--transition-fast);
}

/* Actions: surface moves inside the button; its hit area never moves on hover. */
html[data-theme="arvr_theme"] body.ds-theme :is(.ui-button, .button, .btn, .arvr-action,
    .homepage-swiper__button, .arvr-content-rail__actions button, .games-filter-toggle,
    .catalog-filter-toggle, .ui-dialog__close, .arvr-menu-toggle, .arvr-compact-account, .page-link) {
    transition: color var(--transition-fast), background-color var(--transition-fast),
        border-color var(--transition-fast), background-position var(--duration-normal) var(--easing-standard),
        translate var(--transition-fast), opacity var(--transition-fast);
}

html[data-theme="arvr_theme"] body.ds-theme :is(.ui-button--primary, .button--primary, .btn-primary, .arvr-action) {
    background-color: var(--color-ink);
    background-image: var(--button-primary-surface);
    background-size: 100% 180%;
    background-position: center top;
    border-color: var(--color-ink);
    color: var(--color-on-dark);
}

html[data-theme="arvr_theme"] body.ds-theme :is(.ui-button, .button, .btn, .arvr-action,
    .homepage-swiper__button, .arvr-content-rail__actions button, .games-filter-toggle,
    .catalog-filter-toggle, .ui-dialog__close, .arvr-menu-toggle, .arvr-compact-account, .page-link):active:not(
    :disabled, [aria-disabled="true"], [aria-busy="true"], .disabled, .button--disabled, .swiper-button-disabled) {
    translate: 0 var(--motion-press-distance);
}

/* Focus is immediate and uses a real outline, including on dark surfaces. */
html[data-theme="arvr_theme"] body.ds-theme :is(a, button, summary, input, select, textarea, [tabindex]):focus-visible {
    outline: var(--interaction-focus-width) solid var(--color-ring);
    outline-offset: var(--interaction-focus-offset);
}
html[data-theme="arvr_theme"] body.ds-theme :is(.arvr-footer, .arvr-wire, .profile-hero) :focus-visible {
    outline-color: var(--color-on-dark);
}
html[data-theme="arvr_theme"] body.ds-theme :is(.arvr-card__link, .arvr-news li>a, .arvr-event):focus-visible {
    outline-offset: calc(-1 * var(--interaction-focus-width));
}

/* Arrow feedback belongs to actions and cards, never to decorative content icons. */
html[data-theme="arvr_theme"] body.ds-theme :is(a, button, summary) :is(.bi-arrow-right, .bi-arrow-up-right, .bi-arrow-left) {
    display: inline-block;
    transition: translate var(--transition-fast);
}

/* Existing text links opt in by component, new ones can use data-ui-motion="link". */
html[data-theme="arvr_theme"] body.ds-theme :is(.arvr-panel__heading>a, .arvr-content-rail__actions>a,
    .ui-breadcrumbs a, .arvr-mega__panel a, .arvr-footer__legal a, [data-ui-motion="link"]) {
    text-decoration-line: underline;
    text-decoration-color: transparent;
    text-decoration-thickness: var(--interaction-focus-width);
    text-underline-offset: var(--space-xs);
}
html[data-theme="arvr_theme"] body.ds-theme :is(.arvr-panel__heading>a, .arvr-content-rail__actions>a,
    .ui-breadcrumbs a, .arvr-mega__panel a, .arvr-footer__legal a, [data-ui-motion="link"]):focus-visible {
    text-decoration-color: currentColor;
}

/* Card boundaries and surfaces react without lifting the grid or clipping its focus. */
html[data-theme="arvr_theme"] body.ds-theme a:is(.ui-card--interactive, [data-ui-motion="card"]) {
    text-decoration: none;
    color: var(--color-ink);
}
html[data-theme="arvr_theme"] body.ds-theme :is(.ui-card--interactive, .arvr-card__link,
    .arvr-news li>a, .arvr-event, .arvr-company, .arvr-club, .news-card, .arvr-news-card,
    .game-card, .equipment-card, .company-card, .club-card, .event-card, .howto-card,
    .opinion-card, .editorial-feed-card, [data-ui-motion="card"]) {
    transition: background-color var(--transition-fast), border-color var(--transition-fast);
    transform: none;
}
html[data-theme="arvr_theme"] body.ds-theme :is(.ui-card--interactive, .arvr-card__link,
    .arvr-news li>a, .arvr-event, .arvr-company, .arvr-club, .news-card, .arvr-news-card,
    .game-card, .equipment-card, .company-card, .club-card, .event-card, .howto-card,
    .opinion-card, .editorial-feed-card, [data-ui-motion="card"]):focus-within {
    border-color: var(--color-ink);
}

/* Scale only images inside an existing clipping frame. Logos and article media stay still. */
html[data-theme="arvr_theme"] body.ds-theme :is(.arvr-news__image, .arvr-event__image) img {
    transition: scale var(--duration-slow) var(--easing-standard);
}
html[data-theme="arvr_theme"] body.ds-theme .news-digest__item:not(.news-digest__item--lead) .news-digest__image img {
    transition: scale var(--duration-slow) var(--easing-standard);
}

/* Fields keep their layout and native validation. Checked/selected is persistent feedback. */
html[data-theme="arvr_theme"] body.ds-theme :is(input, select, textarea):not([type="checkbox"], [type="radio"]):focus {
    border-color: var(--color-ink);
}
html[data-theme="arvr_theme"] body.ds-theme :is(input[type="checkbox"], input[type="radio"]) {
    accent-color: var(--color-ink);
}
html[data-theme="arvr_theme"] body.ds-theme :is(.games-filter__option, .cabinet-choice-list label) {
    transition: background-color var(--transition-fast), border-color var(--transition-fast);
}
html[data-theme="arvr_theme"] body.ds-theme :is(.games-filter__option, .cabinet-choice-list label):has(input:checked) {
    background-color: var(--color-surface-strong);
}

/* Opening is native; feedback does not delay closing, focus or hidden-state semantics. */
html[data-theme="arvr_theme"] body.ds-theme [data-ui-motion="disclosure"]>summary {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    min-height: var(--button-height);
    cursor: pointer;
    list-style: none;
}
html[data-theme="arvr_theme"] body.ds-theme [data-ui-motion="disclosure"]>summary::-webkit-details-marker { display: none; }
html[data-theme="arvr_theme"] body.ds-theme .ui-disclosure__body { padding-block: var(--space-md); }
html[data-theme="arvr_theme"] body.ds-theme summary>.bi-chevron-down {
    transition: rotate var(--transition-fast);
}
html[data-theme="arvr_theme"] body.ds-theme details[open]>summary>.bi-chevron-down { rotate: 180deg; }
html[data-theme="arvr_theme"] body.ds-theme :is(.arvr-mega[open]>.arvr-mega__panel,
    .ui-dialog[open], .dropdown-menu.show, [data-ui-motion="disclosure"][open]>.ui-disclosure__body) {
    animation: arvr-feedback-enter var(--duration-normal) var(--easing-standard);
}
html[data-theme="arvr_theme"] body.ds-theme .ui-dialog[open]::backdrop {
    animation: arvr-feedback-fade var(--duration-normal) var(--easing-standard);
}
html[data-theme="arvr_theme"] body.ds-theme :is(.message-stack .ui-alert, .htmx-added.ui-alert) {
    animation: arvr-feedback-enter var(--duration-normal) var(--easing-standard);
}
html[data-theme="arvr_theme"] body.ds-theme .arvr-icon-spin {
    animation-duration: var(--motion-loading-duration);
}
@keyframes arvr-feedback-enter {
    from { opacity: 0; translate: 0 var(--motion-enter-distance); }
    to { opacity: 1; translate: 0 0; }
}
@keyframes arvr-feedback-fade { from { opacity: 0; } to { opacity: 1; } }

/* Touch gets press/focus feedback, never sticky desktop hover choreography. */
@media (hover: hover) and (pointer: fine) {
    html[data-theme="arvr_theme"] body.ds-theme :is(.ui-button--primary, .button--primary, .btn-primary, .arvr-action):hover {
        background-image: var(--button-primary-surface);
        background-position: center bottom;
        color: var(--color-on-dark);
    }
    html[data-theme="arvr_theme"] body.ds-theme :is(.ui-button--secondary, .button--secondary, .btn-secondary,
        .games-filter-toggle, .catalog-filter-toggle, .ui-dialog__close, .arvr-compact-account, .page-link:not(.active .page-link)):hover {
        background: var(--color-surface-strong);
        border-color: var(--color-ink);
        color: var(--color-ink);
    }
    html[data-theme="arvr_theme"] body.ds-theme :is(.homepage-swiper__button, .arvr-content-rail__actions button):hover {
        background: var(--button-primary-surface);
        color: var(--color-on-dark);
    }
    html[data-theme="arvr_theme"] body.ds-theme :is(a, button, summary):hover:not(
        :disabled, [aria-disabled="true"], [aria-busy="true"], .disabled, .button--disabled, .swiper-button-disabled) .bi-arrow-right {
        translate: var(--motion-icon-distance) 0;
    }
    html[data-theme="arvr_theme"] body.ds-theme :is(a, button):hover:not(
        :disabled, [aria-disabled="true"], [aria-busy="true"], .disabled, .button--disabled, .swiper-button-disabled) .bi-arrow-left {
        translate: calc(-1 * var(--motion-icon-distance)) 0;
    }
    html[data-theme="arvr_theme"] body.ds-theme a:hover:not([aria-disabled="true"], [aria-busy="true"]) .bi-arrow-up-right {
        translate: var(--motion-icon-distance) calc(-1 * var(--motion-icon-distance));
    }
    html[data-theme="arvr_theme"] body.ds-theme :is(.arvr-panel__heading>a, .arvr-content-rail__actions>a,
        .ui-breadcrumbs a, .arvr-mega__panel a, .arvr-footer__legal a, [data-ui-motion="link"]):hover {
        text-decoration-color: currentColor;
    }
    html[data-theme="arvr_theme"] body.ds-theme :is(.ui-card--interactive, .arvr-card__link,
        .arvr-news li>a, .arvr-event, .arvr-company, .arvr-club, .news-card, .arvr-news-card,
        .game-card, .equipment-card, .company-card, .club-card, .event-card, .howto-card,
        .opinion-card, .editorial-feed-card, [data-ui-motion="card"]):hover {
        background-color: var(--color-bg);
        border-color: var(--color-ink);
        transform: none;
    }
    html[data-theme="arvr_theme"] body.ds-theme :is(.arvr-news li>a, .arvr-event):hover :is(.arvr-news__image, .arvr-event__image) img {
        scale: var(--motion-image-scale);
    }
    html[data-theme="arvr_theme"] body.ds-theme .news-digest__item:not(.news-digest__item--lead) .news-digest__link:hover .news-digest__image img {
        scale: var(--motion-image-scale);
    }
    html[data-theme="arvr_theme"] body.ds-theme :is(.games-filter__option, .cabinet-choice-list label):hover {
        background-color: var(--color-surface-strong);
    }
}

/* Disabled wins over every hover rule; busy keeps its label and a single progress icon. */
html[data-theme="arvr_theme"] body.ds-theme :is(.ui-button, .button, .btn, .arvr-action,
    .homepage-swiper__button, .arvr-content-rail__actions button, .games-filter-toggle,
    .catalog-filter-toggle, .page-link):is(:disabled, [aria-disabled="true"], .disabled, .button--disabled, .swiper-button-disabled) {
    background: var(--color-surface-strong);
    color: var(--color-muted);
    border-color: var(--color-border);
    opacity: var(--interaction-disabled-opacity);
    cursor: not-allowed;
    translate: none;
    transform: none;
}
html[data-theme="arvr_theme"] body.ds-theme :is(.ui-button, .button, .btn)[aria-busy="true"][disabled] {
    cursor: progress;
    opacity: 1;
    background: var(--color-surface-strong);
    color: var(--color-ink);
    translate: none;
    transform: none;
}

/* Scoped override of legacy motion too. State changes remain visible without travel. */
@media (prefers-reduced-motion: reduce) {
    html[data-theme="arvr_theme"] body.ds-theme *,
    html[data-theme="arvr_theme"] body.ds-theme *::before,
    html[data-theme="arvr_theme"] body.ds-theme *::after {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
        translate: none !important;
        scale: none !important;
    }
    html[data-theme="arvr_theme"] body.ds-theme :is(.ui-button, .button, .btn, .arvr-action,
        .ui-card--interactive, .arvr-footer a, .arvr-footer__channel-arrow):hover { transform: none; }
}

/* Event posters retain contrast while sharing immediate keyboard feedback. */
html[data-theme="arvr_theme"] body.ds-theme .event-agenda__poster { transition:color var(--transition-fast); }
html[data-theme="arvr_theme"] body.ds-theme .event-agenda__poster:focus-visible { outline-color:var(--color-on-dark); outline-offset:calc(-1 * var(--interaction-focus-width)); }
html[data-theme="arvr_theme"] body.ds-theme .event-agenda__poster h3 { text-decoration:underline; text-decoration-color:transparent; text-decoration-thickness:var(--interaction-focus-width); text-underline-offset:var(--space-xs); transition:text-decoration-color var(--transition-fast); }
@media(hover:hover) and (pointer:fine) {
 html[data-theme="arvr_theme"] body.ds-theme .event-agenda__poster:hover h3 { text-decoration-color:currentColor; }
}

html[data-theme="arvr_theme"] body.ds-theme .company-showcase__lead:focus-visible { outline-color:var(--color-on-dark); outline-offset:calc(-1 * var(--interaction-focus-width)); }
html[data-theme="arvr_theme"] body.ds-theme .company-showcase__lead h3 { text-decoration:underline; text-decoration-color:transparent; text-decoration-thickness:var(--interaction-focus-width); text-underline-offset:var(--space-xs); transition:text-decoration-color var(--transition-fast); }
@media(hover:hover) and (pointer:fine) {
 html[data-theme="arvr_theme"] body.ds-theme .company-showcase__lead:hover h3 { text-decoration-color:currentColor; }
}

/* Functional disclosure: fade/chevron share system timings; height uses the same
   slow token in expandable-prose.js only after explicit activation. */
.ui-expandable-prose__fade { transition: opacity var(--duration-normal) var(--easing-standard); }
.ui-expandable-prose__toggle .bi-chevron-down { transition: rotate var(--duration-normal) var(--easing-standard); }
.ui-expandable-prose__toggle[aria-expanded="true"] .bi-chevron-down { rotate: 180deg; }
@media (prefers-reduced-motion: reduce) {
    .ui-expandable-prose__fade, .ui-expandable-prose__toggle .bi-chevron-down { transition: none; }
}