/**
 * Darealmop_StoreSwitcher — STRUCTURE-ONLY skeleton (placement + mechanics; NO appearance).
 * The theme paints 100% of the look via the `--dm-switcher-*` / `--dm-store-suggest-*` custom
 * properties and these selectors (same philosophy as Darealmop_Gdpr's banner.css).
 *
 * Selectors a theme owns:
 *   .dm-switcher / .dm-switcher__item / .dm-switcher__link / .dm-switcher__flag / .dm-switcher__label
 *   .dm-store-suggest / __title / __message / __actions / __btn(.--primary)
 */

/* ── switcher list (theme decides inline row vs dropdown) ─────────────────── */
.dm-switcher { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--dm-switcher-gap, 8px); }
.dm-switcher__link { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; cursor: pointer; }
.dm-switcher__item.is-current .dm-switcher__link { cursor: default; }
/* Flag is a 4:3 box the theme fills (sprite / background-image / emoji). It carries no image here. */
.dm-switcher__flag { display: inline-block; width: 20px; height: 15px; flex: none; border-radius: 2px; background-size: cover; }

/* ── geo-suggest banner (always in DOM; toggled by switcher.js) ───────────── */
.dm-store-suggest {
    position: fixed;
    z-index: var(--dm-store-suggest-z, 8800);
    bottom: var(--dm-store-suggest-offset, 16px);
    left: 50%;
    width: min(420px, calc(100vw - 24px));
    box-sizing: border-box;
    transform: translate(-50%, 24px);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--dm-store-suggest-transition, .3s ease),
                transform var(--dm-store-suggest-transition, .3s ease);
}
.dm-store-suggest[hidden] { display: none; }
.dm-store-suggest.is-visible { opacity: 1; pointer-events: auto; transform: translate(-50%, 0); }
.dm-store-suggest * { box-sizing: border-box; }
.dm-store-suggest__title { margin: 0 0 4px; }
.dm-store-suggest__message { margin: 0 0 12px; }
.dm-store-suggest__actions { display: flex; gap: 8px; }
.dm-store-suggest__btn { cursor: pointer; flex: 1; text-align: center; text-decoration: none; }

@media (prefers-reduced-motion: reduce) {
    .dm-store-suggest { transition: none; }
}