/* tinynest x Shared Mobile Foundation: adapter. Loaded only for an enabled store.
   Tokens are the theme's own header values (generated by gen_adapters.py); no layout rules here.
   Drawer text: rgb(138, 127, 154) is 3.76:1 on the header background; theme text variable --tn-dark gives 14.73:1. */
body.sf-m.sf-m-t-tinynest {
    --sf-m-header-bg: var(--tn-white, rgb(255, 255, 255));
    --sf-m-header-fg: var(--tn-dark, rgb(46, 36, 56));
    --sf-m-header-line: var(--tn-border, rgb(237, 232, 245));
    --sf-m-header-line-w: 2px;
    --sf-m-color-accent: var(--tn-purple, rgb(126, 87, 194));
    --sf-m-color-on-accent: var(--tn-white, rgb(255, 255, 255));
    --sf-m-drawer-bg: var(--tn-white, rgb(255, 255, 255));
    --sf-m-drawer-fg: var(--tn-dark, rgb(46, 36, 56));
    --sf-m-bar-bg: var(--tn-white, rgb(255, 255, 255));
    --sf-m-bar-fg: var(--tn-dark, rgb(46, 36, 56));
    --sf-m-bar-line: var(--tn-border, rgb(237, 232, 245));
    --sf-m-bar-active: var(--tn-purple, rgb(126, 87, 194));
    --sf-m-sheet-bg: var(--tn-cream, rgb(253, 250, 248));
    --sf-m-sheet-fg: var(--tn-dark, rgb(46, 36, 56));
    --sf-m-sheet-line: var(--tn-border, rgb(237, 232, 245));
    --sf-m-control-bg: var(--tn-white, rgb(255, 255, 255));
    --sf-m-control-fg: var(--tn-dark, rgb(46, 36, 56));
    --sf-m-control-line: var(--tn-border, rgb(237, 232, 245));
}

@media (max-width: 991.98px) {
    /* promo banner artwork has a fixed 300px box */
    body.sf-m.sf-m-t-tinynest .tn-promo-banner-emoji {
        max-inline-size: 100%;
        flex: 0 1 auto;
    }

    /* add-to-cart is revealed on hover only; phones have no hover */
    body.sf-m.sf-m-t-tinynest .tn-card-actions {
        opacity: 1;
        visibility: visible;
        transform: none;
    }
}