/* ── Press feedback layer (ported from reference v2.1 app.css "Button states") ──
   Cross-cutting shared file like Accessibility.css/FocusRing.css (new file per
   UI-UX-STANDARDS §4 rule 2 — tokens.css/app.css untouched): press feedback is
   one pattern app-wide, so it lives in one layer. Loaded after component CSS in
   both hosts so its transition/press rules win the cascade.
   Press curve: cubic-bezier(.36,.07,.19,.97) (reference button curve). */

/* ── Branded CTAs (mudbutton trio) ──
   Press = 20% darker + 1% shrink (reference btn-primary). Login.css keeps the
   colors and hover; Accessibility.css keeps :focus-visible (brightness only —
   press *scale* is :active-only, reference rule); this file owns the press
   state and the transition. */
.mudbutton-ui, .mudbutton-danger, .mudbutton-grey {
    transition: filter .12s ease, transform .12s cubic-bezier(.36, .07, .19, .97);
}
.mudbutton-ui:active, .mudbutton-danger:active, .mudbutton-grey:active {
    filter: brightness(0.8);
    transform: scale(0.99);
    outline: none;
}

/* ── Project rule: NO drop-shadow on any button ──
   MudBlazor's Filled buttons ship a default Material elevation (mud-elevation-2) drop-shadow —
   strip it on every MudButton, in every state. This flattens the Hero CTA and all other filled
   CTAs (item/campaign/gate/layaway/account) uniformly. Keyboard focus uses outline/filter
   (Accessibility.css), never box-shadow, so accessibility is unaffected. */
.mud-button-root,
.mud-button-root:hover,
.mud-button-root:active,
.mud-button-root:focus,
.mud-button-root:focus-visible {
    box-shadow: none !important;
}

/* ── Catch-all: every other button shrinks 1% on press, no matter where it
   lives (reference rule). :where() keeps specificity at (0,1,1) so any
   component's own :active rule overrides cleanly. Excluded: the CTA trio and
   .fc-card-pressable (own press rules above/below), .fc-pay-chip and
   .fc-bottomnav-tab (reference opts chips + bottom-nav tabs out of press
   scale — their selected/active styling is the feedback). */
button:where(:not(.mudbutton-ui):not(.mudbutton-danger):not(.mudbutton-grey):not(.fc-card-pressable):not(.fc-pay-chip):not(.fc-bottomnav-tab)):active {
    transform: scale(0.99);
}

/* Item-gallery arrows centre themselves with translateY(-50%) — compose the
   press scale with it so the button doesn't jump to the top on press. */
.fc-item-nav:active { transform: translateY(-50%) scale(0.99); }

/* ── Pressable cards (reference .card-pressable) ──
   Opt-in class for clickable card surfaces (store cards, favorite-location
   cards, item thumbnails): press shows a 2px brand inset ring + 1% shrink. */
.fc-card-pressable {
    transition: box-shadow .12s ease, transform .12s cubic-bezier(.36, .07, .19, .97);
}
.fc-card-pressable:active {
    box-shadow: inset 0 0 0 2px var(--color-brand-primary);
    transform: scale(0.99);
    outline: none;
}

/* ── Option-row press tint (reference .sort-option/.filter-option overlays) ──
   Radio/checkbox rows in sort & filter sheets darken while pressed. ::before,
   not ::after — ::after is reserved for overlay borders (fc-lm-option and the
   design-system button-border rule). The tint inherits each row's own radius. */
.fc-sortmodal-opt, .fc-ssort-opt, .fc-filter-option, .fc-lm-option {
    position: relative;
}
.fc-sortmodal-opt::before, .fc-ssort-opt::before, .fc-filter-option::before, .fc-lm-option::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: transparent;
    pointer-events: none;
    transition: background 0.15s ease;
}
/* Hover tint (reference .sort-option:hover overlay) — lighter than press so the
   two states stay distinguishable; the :active rule below wins while pressed. */
.fc-sortmodal-opt:hover::before, .fc-ssort-opt:hover::before, .fc-filter-option:hover::before, .fc-lm-option:hover::before {
    background: rgba(0, 0, 0, 0.10);
}
.fc-sortmodal-opt:active::before, .fc-ssort-opt:active::before, .fc-filter-option:active::before, .fc-lm-option:active::before {
    background: rgba(0, 0, 0, 0.18);
}

/* ── Outlined/secondary buttons (reference btn-outlined-shadow) ──
   Opt-in marker class for bordered secondary buttons: press (and keyboard
   focus, mirroring the reference) draws a 3.5px currentColor inset ring over
   the resting border — an inset shadow, not a real border-width change, so
   nothing shifts (design-system button rule). currentColor picks up each
   button's own accent (blue/red/green). Press *scale* comes from the
   catch-all above; Accessibility.css excludes this class from the generic
   focus outline because the ring IS its keyboard treatment. */
.fc-btn-outlined {
    transition: box-shadow .12s ease, transform .12s cubic-bezier(.36, .07, .19, .97);
}
.fc-btn-outlined:active,
.fc-btn-outlined:focus-visible {
    box-shadow: inset 0 0 0 3.5px currentColor;
    outline: none;
}