/*
 * «Базар» — a marketplace showcase with its own face: a teal header, lemon
 * price tags, tangerine delivery, pine footer and banners. Wide Unbounded
 * for prices and headlines, Manrope for everything else.
 *
 * Loaded after the parent's base layers and the shop's styles. This file
 * holds the fonts, the design-schema defaults, the tokens and the variants
 * the owner's settings switch; the rest is split by area:
 *   bz-chrome.css  header, ticker, category panel, footer
 *   bz-blocks.css  the theme's own blocks
 *   bz-shop.css    cards, listing, product page, cart
 */
@import url('bz-chrome.css');
@import url('bz-blocks.css');
@import url('bz-shop.css');

@font-face {
    font-family: 'Bazar Manrope';
    font-style: normal;
    font-display: swap;
    font-weight: 200 800;
    src: url(/themes/default/assets/fonts/manrope-cyrillic-wght-normal.woff2) format('woff2-variations');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Bazar Manrope';
    font-style: normal;
    font-display: swap;
    font-weight: 200 800;
    src: url(/themes/default/assets/fonts/manrope-latin-wght-normal.woff2) format('woff2-variations');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Bazar Unbounded';
    font-style: normal;
    font-display: swap;
    font-weight: 200 900;
    src: url(/themes/default/assets/fonts/unbounded-cyrillic-wght-normal.woff2) format('woff2-variations');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Bazar Unbounded';
    font-style: normal;
    font-display: swap;
    font-weight: 200 900;
    src: url(/themes/default/assets/fonts/unbounded-latin-wght-normal.woff2) format('woff2-variations');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Bazar Inter';
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url(/themes/default/assets/fonts/inter-cyrillic-wght-normal.woff2) format('woff2-variations');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Bazar Inter';
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url(/themes/default/assets/fonts/inter-latin-wght-normal.woff2) format('woff2-variations');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Bazar Onest';
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url(/themes/default/assets/fonts/onest-cyrillic-wght-normal.woff2) format('woff2-variations');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Bazar Onest';
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url(/themes/default/assets/fonts/onest-latin-wght-normal.woff2) format('woff2-variations');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* The owner's design settings (theme.json → design.controls). Core prints
   the chosen values as :root{--bazar-…} after this file, so these are only
   the defaults; every token below derives from them. */
:root {
    --bazar-brand: #0B7A75;
    --bazar-lemon: #FFD84D;
    --bazar-mandarin: #FF8A1F;
    --bazar-pine: #16443A;
    --bazar-font-display: 'Bazar Unbounded', 'Bazar Manrope', system-ui, sans-serif;
    --bazar-font-ui: 'Bazar Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    --bazar-radius: 12px;
}

/* -------------------------------------------------------------------------
   Tokens
   ------------------------------------------------------------------------- */

html.bazar {
    --bz-brand: var(--bazar-brand);
    --bz-brand-2: color-mix(in srgb, var(--bz-brand) 84%, #000);
    --bz-brand-soft: color-mix(in srgb, var(--bz-brand) 10%, #fff);
    --bz-lemon: var(--bazar-lemon);
    --bz-mandarin: var(--bazar-mandarin);
    --bz-pine: var(--bazar-pine);
    --bz-ink: #111414;
    --bz-muted: #6d7270;
    --bz-bg: #f2f3f1;
    --bz-white: #fff;
    --bz-star: #f5b400;
    --bz-r: var(--bazar-radius);
    --bz-r-sm: calc(var(--bazar-radius) * 0.5);
    --bz-gap: 16px;
    --bz-cols: 6;
    --bz-lift: 0 8px 28px rgba(17, 20, 20, 0.1);

    --c-bg: var(--bz-bg);
    --c-surface: var(--bz-white);
    --c-surface-sunk: #e9ebe8;
    --c-text: #26302e;
    --c-text-strong: var(--bz-ink);
    --c-text-muted: var(--bz-muted);
    --c-text-faint: #8d928f;
    --c-border: #e1e4e0;
    --c-border-strong: #cdd2cd;
    --c-accent: var(--bz-brand);
    --c-accent-hover: var(--bz-brand-2);
    --c-accent-soft: var(--bz-brand-soft);
    --c-accent-contrast: #fff;
    --c-link: var(--bz-brand);
    --c-link-hover: var(--bz-brand-2);
    --c-mark: var(--bz-lemon);
    --c-mark-text: var(--bz-ink);
    --c-mark-soft: color-mix(in srgb, var(--bz-lemon) 30%, #fff);
    --c-slab: var(--bz-pine);
    --c-slab-text: #fff;
    --c-slab-muted: #b9d0c8;
    --c-danger: #b3361b;
    --c-success: #1c8a5b;

    --font-ui: var(--bazar-font-ui);
    --font-display: var(--bazar-font-display);
    --font-prose: var(--bazar-font-ui);
    --fw-heading: 700;
    --tr-tight: -0.03em;
    --tr-snug: -0.015em;

    --r-xs: calc(var(--bazar-radius) * 0.4);
    --r-sm: calc(var(--bazar-radius) * 0.65);
    --r-md: var(--bazar-radius);
    --r-lg: var(--bazar-radius);
    --r-btn: 999px;
    --w-container: 76rem;
    --w-wide: 90rem;
    --gutter: clamp(0.75rem, 2.4vw, 1.5rem);

    --shadow-sm: none;
    --shadow-md: none;
    --shadow-lg: var(--bz-lift);
    --shadow-lift: var(--bz-lift);
    --card-bg: var(--bz-white);
    --card-border: 0;
    --card-shadow: none;
    --card-radius: var(--bz-r);
    --sp-sm: clamp(1.25rem, 1rem + 1.4vw, 2rem);
    --sp-md: clamp(1.75rem, 1.4rem + 2vw, 2.75rem);
    --sp-lg: clamp(2.25rem, 1.8rem + 3vw, 3.75rem);

    --shop-star: var(--bz-star);
    --shop-sticker-discount-bg: var(--bz-lemon);
    --shop-sticker-discount-fg: var(--bz-ink);
    --shop-sticker-hit-bg: var(--bz-pine);
    --shop-sticker-hit-fg: #fff;
    --shop-sticker-new-bg: var(--bz-brand);
    --shop-sticker-new-fg: #fff;
    --shop-sticker-few-bg: var(--bz-ink);
    --shop-sticker-few-fg: #fff;

    color-scheme: light;
}

html.bazar { background: var(--bz-bg); }

html.bazar body {
    background: var(--bz-bg);
    color: var(--c-text);
    font-family: var(--font-ui);
    font-feature-settings: 'tnum' 0;
}

html.bazar ::selection { background: var(--bz-lemon); color: var(--bz-ink); }
html.bazar :focus-visible { outline-color: var(--bz-brand); }

html.bazar h1,
html.bazar h2,
html.bazar h3,
html.bazar h4 {
    font-family: var(--font-display);
    letter-spacing: var(--tr-snug);
    color: var(--c-text-strong);
}

.bz-wrap {
    width: 100%;
    max-width: var(--w-wide);
    margin-inline: auto;
    padding-inline: var(--gutter);
}

/* The page's own sections are wide; the editor's headings are Unbounded. */
html.bazar .cms-section__title,
html.bazar .cms-head__title {
    font-size: clamp(1.35rem, 1.1rem + 0.9vw, 1.75rem);
    font-weight: 700;
    letter-spacing: -0.02em;
}

/* -------------------------------------------------------------------------
   Variants switched by the design settings
   ------------------------------------------------------------------------- */

html[data-bazar-bg='white'].bazar { --bz-bg: #fff; --c-surface-sunk: #f1f3f0; }
html[data-bazar-bg='white'].bazar body { background: #fff; }
html[data-bazar-bg='sand'].bazar { --bz-bg: #f4efe6; --c-surface-sunk: #ebe4d6; --c-border: #e4dccb; }
html[data-bazar-bg='sand'].bazar body { background: #f4efe6; }

html[data-bazar-cols='5'].bazar { --bz-cols: 5; }
html[data-bazar-cols='4'].bazar { --bz-cols: 4; }

html[data-bazar-catbtn='white'] .bz-catbtn { background: #fff; color: var(--bz-brand); }
html[data-bazar-catbtn='pine'] .bz-catbtn { background: var(--bz-pine); color: #fff; }

html[data-bazar-ticker='off'] .bz-ticker { display: none; }

/* The delivery tag: the offset itself is read by bazar.js. */
html[data-bazar-eta='0'] .bz-eta { background: var(--bz-lemon); }
