/*
 * Ursum Pro Shop — shared storefront design system.
 *
 * One token set + reusable components for the three redesigned screens:
 * checkout (kassa-2a), order confirmation (kinnitus 3a/3b) and My Account
 * (minu konto 1a). Tokens come from the design handoff READMEs; the three
 * screens share the same palette/type/radii, so they live here exactly once.
 *
 * Everything is scoped under `.ursum-store` so the tokens never leak into the
 * rest of the Blocksy theme. Wrap each overridden template's root in that class.
 *
 * Hand-written, no build step — same convention as direct-checkout.css.
 */

.ursum-store {
    /* Inks */
    --us-ink: #141C2B;
    --us-body: #5A6B82;
    --us-muted: #7A8494;
    --us-label: #4B5768;
    --us-faint: #8A94A3;
    --us-placeholder: #A6ADB8;

    /* Surfaces */
    --us-page: #F3F4F5;
    --us-card: #FFFFFF;
    --us-card-border: #E7E9EC;
    --us-divider: #ECEEF1;
    --us-divider-strong: #E4E7EA;
    --us-input-border: #D5DAE1;
    --us-tint: #F0F3F7;
    --us-saved-bg: #F8F9FA;
    --us-note-bg: #F0F3F7;

    /* Segmented control */
    --us-seg-track: #EEF0F3;

    /* Chips */
    --us-chip-bg: #E9EEF4;
    --us-chip-text: #4E657F;

    /* Status badges */
    --us-badge-progress-bg: #F2EADC;
    --us-badge-progress-text: #8A6A3B;
    --us-badge-shipped-bg: #E9EEF4;
    --us-badge-shipped-text: #4E657F;
    --us-badge-done-bg: #E3EFE7;
    --us-badge-done-text: #3B7A54;

    /* Success (kinnitus) */
    --us-success-bg: #E3EFE7;
    --us-success-check: #3B7A54;

    /* Errors / alerts */
    --us-err-text: #8C3B2B;
    --us-err-help: #A6462F;
    --us-err-border: #C0503B;
    --us-err-bg: #FAF1EF;
    --us-err-border-soft: #D8A79E;
    --us-err-banner-bg: #FBEFEC;
    --us-err-banner-border: #E4B7AC;

    /* Radii */
    --us-r-card: 18px;
    --us-r-card-sm: 14px;
    --us-r-input: 10px;
    --us-r-note: 12px;
    --us-r-pill: 999px;

    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: var(--us-ink);
    -webkit-font-smoothing: antialiased;
}

/* Tabular figures wherever numbers/dates/prices render. */
.ursum-store .us-num { font-variant-numeric: tabular-nums; }

/* --------------------------------------------------------------------- *
 * Page shell + slim top bar
 * --------------------------------------------------------------------- */
.ursum-store.us-page,
.ursum-store .us-page { background: var(--us-page); }

/* Blocksy renders us inside a max-width content column — break out so the
   page background runs edge to edge; .us-shell re-centers the content. */
.ursum-store.us-page {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.ursum-store .us-shell { max-width: 1080px; margin: 0 auto; padding: 40px 44px; }

.ursum-store .us-topbar {
    display: flex; align-items: center; justify-content: space-between;
    height: 72px; padding: 0 44px;
    background: #fff; border-bottom: 1px solid var(--us-divider-strong);
}
.ursum-store .us-logo { font-size: 20px; font-weight: 700; letter-spacing: 0.02em; }
.ursum-store .us-topbar__right { display: flex; align-items: center; gap: 20px; font-size: 13px; color: var(--us-body); }

.ursum-store .us-h1 { font-size: 28px; font-weight: 700; letter-spacing: -0.02em; margin: 0; }
.ursum-store .us-breadcrumb { font-size: 13px; color: var(--us-muted); margin-top: 6px; }
/* Heading-sized breadcrumb (checkout has no H1) + breathing room above the grid. */
.ursum-store .us-breadcrumb--lead { font-size: 18px; margin: 0 0 32px; }
.ursum-store .us-breadcrumb--lead strong { color: var(--us-ink); }
.ursum-store .us-subline { font-size: 13px; color: var(--us-muted); margin-top: 6px; }

/* --------------------------------------------------------------------- *
 * Layout grids
 * --------------------------------------------------------------------- */
.ursum-store .us-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; }
.ursum-store .us-stack { display: flex; flex-direction: column; gap: 20px; }

@media (max-width: 860px) {
    .ursum-store .us-grid { grid-template-columns: 1fr; }
    .ursum-store .us-shell { padding: 24px 16px; }
    .ursum-store .us-topbar { padding: 0 16px; }
}

/* --------------------------------------------------------------------- *
 * Cards
 * --------------------------------------------------------------------- */
.ursum-store .us-card {
    background: var(--us-card);
    border: 1px solid var(--us-card-border);
    border-radius: var(--us-r-card);
    padding: 32px;
}
.ursum-store .us-card--sm { border-radius: var(--us-r-card-sm); padding: 16px 18px; }

.ursum-store .us-card__head {
    display: flex; align-items: baseline; justify-content: space-between;
    margin-bottom: 14px;
}
.ursum-store .us-card__title { font-size: 17px; font-weight: 700; }
.ursum-store .us-card__meta { font-size: 13px; color: var(--us-muted); }

.ursum-store .us-section-label {
    font-size: 12px; font-weight: 600; text-transform: uppercase;
    letter-spacing: 0.1em; color: var(--us-faint); margin: 16px 0 8px;
}
.ursum-store .us-divider { height: 1px; background: var(--us-divider); border: 0; margin: 16px 0; }

/* Saved / read-only info card (company block, salon address, payment term). */
.ursum-store .us-saved {
    background: var(--us-saved-bg); border: 1px solid var(--us-card-border);
    border-radius: var(--us-r-card-sm); padding: 16px 18px;
}
.ursum-store .us-saved__name { font-size: 14px; font-weight: 600; }
.ursum-store .us-saved__row { font-size: 12px; color: var(--us-body); margin-top: 4px; }

/* --------------------------------------------------------------------- *
 * Chips + status badges
 * --------------------------------------------------------------------- */
.ursum-store .us-chip {
    display: inline-block; border-radius: var(--us-r-pill);
    font-size: 11px; font-weight: 600; padding: 3px 10px;
    background: var(--us-chip-bg); color: var(--us-chip-text);
}
.ursum-store .us-chip--dark { background: var(--us-ink); color: #fff; }

.ursum-store .us-badge {
    display: inline-block; border-radius: var(--us-r-pill);
    font-size: 12px; font-weight: 600; padding: 4px 12px;
}
.ursum-store .us-badge--progress { background: var(--us-badge-progress-bg); color: var(--us-badge-progress-text); }
.ursum-store .us-badge--shipped { background: var(--us-badge-shipped-bg); color: var(--us-badge-shipped-text); }
.ursum-store .us-badge--done { background: var(--us-badge-done-bg); color: var(--us-badge-done-text); }

/* --------------------------------------------------------------------- *
 * Buttons / pills
 * --------------------------------------------------------------------- */
.ursum-store .us-btn {
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: var(--us-r-pill); font-size: 15px; font-weight: 600;
    padding: 16px 24px; cursor: pointer; border: 1px solid transparent;
    text-decoration: none; box-sizing: border-box; transition: opacity .15s ease;
}
.ursum-store .us-btn--primary { background: var(--us-ink); color: #fff; }
.ursum-store .us-btn--secondary { background: #fff; color: var(--us-ink); border-color: var(--us-input-border); }
.ursum-store .us-btn--block { width: 100%; }
.ursum-store .us-btn[disabled], .ursum-store .us-btn.is-disabled { opacity: 0.45; pointer-events: none; }

.ursum-store .us-btn--outline {
    background: #fff; color: var(--us-label); border-color: var(--us-input-border);
    font-size: 13px; padding: 9px 16px;
}
.ursum-store .us-link { font-size: 12px; font-weight: 600; color: var(--us-chip-text); text-decoration: underline; cursor: pointer; }

/* --------------------------------------------------------------------- *
 * Segmented control (destination toggle)
 * --------------------------------------------------------------------- */
.ursum-store .us-seg {
    display: grid; grid-template-columns: 1fr 1fr; gap: 0;
    background: var(--us-seg-track); border-radius: var(--us-r-pill); padding: 4px;
}
.ursum-store .us-seg__btn {
    appearance: none; border: 0; background: transparent; border-radius: var(--us-r-pill);
    padding: 11px; font-size: 14px; font-weight: 600; color: var(--us-body); cursor: pointer;
    transition: background .15s ease, color .15s ease;
}
.ursum-store .us-seg__btn.is-active { background: var(--us-ink); color: #fff; }
.ursum-store .us-seg__btn[disabled], .ursum-store .us-seg__btn.is-disabled { color: var(--us-placeholder); cursor: not-allowed; }

/* --------------------------------------------------------------------- *
 * Inputs
 * --------------------------------------------------------------------- */
.ursum-store .us-field { margin-bottom: 12px; }
.ursum-store .us-field__label { display: block; font-size: 12px; font-weight: 600; color: var(--us-label); margin-bottom: 6px; }
.ursum-store .us-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.ursum-store input[type="text"],
.ursum-store input[type="email"],
.ursum-store input[type="tel"],
.ursum-store input[type="password"],
.ursum-store select {
    width: 100%; box-sizing: border-box;
    border: 1px solid var(--us-input-border); border-radius: var(--us-r-input);
    padding: 12px 14px; font-size: 14px; color: var(--us-ink); background: #fff;
}
/* Native selects clip with vertical padding — fix height, horizontal padding only. */
.ursum-store select { height: 46px; padding: 0 14px; line-height: normal; }
.ursum-store input.us-invalid, .ursum-store select.us-invalid { border-color: var(--us-err-border); }
.ursum-store .us-field__help { font-size: 12px; color: var(--us-err-help); margin-top: 4px; }

/* --------------------------------------------------------------------- *
 * Carrier tiles
 * --------------------------------------------------------------------- */
.ursum-store .us-tiles { display: flex; flex-wrap: wrap; gap: 10px; }
.ursum-store .us-tile {
    flex: 1 1 30%; min-width: 140px;
    border: 1px solid var(--us-input-border); border-radius: var(--us-r-input);
    padding: 14px; cursor: pointer; display: flex; flex-direction: column; gap: 4px;
}
.ursum-store .us-tile input { position: absolute; opacity: 0; pointer-events: none; }
.ursum-store .us-tile.is-selected { border: 2px solid var(--us-ink); background: var(--us-tint); padding: 13px; }
.ursum-store .us-tile__name { font-size: 14px; font-weight: 600; }
.ursum-store .us-tile__price { font-size: 13px; color: var(--us-muted); font-variant-numeric: tabular-nums; }

/* --------------------------------------------------------------------- *
 * Info / gift-slip note + error banner
 * --------------------------------------------------------------------- */
.ursum-store .us-note {
    background: var(--us-note-bg); border-radius: var(--us-r-note);
    padding: 14px 16px; font-size: 12px; color: var(--us-chip-text);
}
.ursum-store .us-banner {
    background: var(--us-err-banner-bg); border: 1px solid var(--us-err-banner-border);
    border-radius: var(--us-r-note); padding: 14px 16px; font-size: 13px; color: var(--us-err-text);
}
.ursum-store .us-block {
    border: 1px solid var(--us-err-border-soft); background: var(--us-err-bg);
    border-radius: var(--us-r-note); padding: 18px 20px;
}
.ursum-store .us-block__title { font-size: 14px; font-weight: 700; color: var(--us-err-text); }
.ursum-store .us-block__body { font-size: 13px; color: var(--us-err-text); margin-top: 6px; }

/* --------------------------------------------------------------------- *
 * Order summary — item rows + totals (checkout left card + kinnitus + orders)
 * --------------------------------------------------------------------- */
.ursum-store .us-item {
    display: flex; align-items: flex-start; gap: 16px;
    padding: 18px 0;
}
/* One divider between consecutive items; the totals block draws its own
   top border, so items carry no bottom border (avoids a double line). */
.ursum-store .us-item + .us-item { border-top: 1px solid var(--us-divider); }
.ursum-store .us-item__thumb {
    width: 58px; height: 58px; border-radius: 12px; object-fit: cover; flex: 0 0 58px;
    background: var(--us-tint);
}
.ursum-store .us-item__body { flex: 1 1 auto; min-width: 0; }
.ursum-store .us-item__brand { font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--us-faint); }
.ursum-store .us-item__name { font-size: 14px; font-weight: 600; color: var(--us-ink); }
.ursum-store .us-item__qty { font-size: 13px; color: var(--us-muted); }
.ursum-store .us-item__total { font-size: 14px; font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Pro-only row highlight (mixed cart blocked state). */
.ursum-store .us-item--blocked {
    background: var(--us-err-bg); border-radius: 12px;
    margin: 0 -16px; padding-left: 16px; padding-right: 16px;
}
.ursum-store .us-item__flag { font-size: 12px; font-weight: 600; color: var(--us-err-help); }

.ursum-store .us-totals { border-top: 1px solid var(--us-card-border); margin-top: 8px; padding-top: 14px; }
.ursum-store .us-totals__row {
    display: flex; justify-content: space-between; font-size: 13px; color: var(--us-body);
    padding: 4px 0; font-variant-numeric: tabular-nums;
}
.ursum-store .us-totals__row--grand { margin-top: 8px; }
.ursum-store .us-totals__row--grand .us-totals__label { font-size: 15px; font-weight: 700; color: var(--us-ink); }
.ursum-store .us-totals__row--grand .us-totals__val { font-size: 20px; font-weight: 700; color: var(--us-ink); }

/* --------------------------------------------------------------------- *
 * Success circle + numbered progress list (kinnitus)
 * --------------------------------------------------------------------- */
.ursum-store .us-confirm { text-align: center; padding: 8px 0 28px; }
.ursum-store .us-success {
    width: 64px; height: 64px; border-radius: 999px; margin: 0 auto 16px;
    background: var(--us-success-bg); display: flex; align-items: center; justify-content: center;
}
.ursum-store .us-success svg { width: 30px; height: 30px; stroke: var(--us-success-check); fill: none; stroke-width: 3; }

.ursum-store .us-steps { list-style: none; margin: 0; padding: 0; counter-reset: us-step; }
.ursum-store .us-steps li {
    position: relative; padding: 0 0 16px 40px; counter-increment: us-step;
    font-size: 13px; color: var(--us-body);
}
.ursum-store .us-steps li::before {
    content: counter(us-step);
    position: absolute; left: 0; top: 0; width: 26px; height: 26px; border-radius: 999px;
    display: flex; align-items: center; justify-content: center;
    font-size: 12px; font-weight: 700;
    border: 1px solid #D9DDE2; color: var(--us-muted); background: #fff;
}
.ursum-store .us-steps li.is-active::before { background: var(--us-ink); color: #fff; border-color: var(--us-ink); }
.ursum-store .us-steps li:last-child { padding-bottom: 0; }

/* --------------------------------------------------------------------- *
 * My Account — horizontal tabs (1a)
 * --------------------------------------------------------------------- */
.ursum-store .us-tabs {
    display: flex; gap: 24px; border-bottom: 1px solid #DCE0E5; margin: 16px 0 28px;
}
.ursum-store .us-tabs a {
    font-size: 14px; font-weight: 600; color: var(--us-muted); text-decoration: none;
    padding: 0 0 12px; border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.ursum-store .us-tabs a.is-active { color: var(--us-ink); font-weight: 700; border-bottom-color: var(--us-ink); }

.ursum-store .us-account-head { display: flex; align-items: flex-start; justify-content: space-between; }

/* Orders table-like card (desktop). */
.ursum-store .us-orders__head,
.ursum-store .us-orders__row {
    display: grid; grid-template-columns: 110px 90px 1.4fr 130px 110px 170px;
    gap: 12px; align-items: center;
}
.ursum-store .us-orders__head {
    font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--us-muted);
    padding: 0 0 10px;
}
.ursum-store .us-orders__row { padding: 16px 0; border-top: 1px solid var(--us-divider); font-size: 13px; }
.ursum-store .us-orders__no { font-weight: 700; font-variant-numeric: tabular-nums; }
.ursum-store .us-orders__actions { display: flex; flex-direction: column; gap: 4px; text-align: right; }
.ursum-store .us-pager { display: flex; gap: 8px; margin-top: 20px; justify-content: center; }
.ursum-store .us-pager a, .ursum-store .us-pager span {
    min-width: 30px; height: 30px; border-radius: 999px; display: inline-flex;
    align-items: center; justify-content: center; font-size: 13px; text-decoration: none; color: var(--us-body);
}
.ursum-store .us-pager .is-active { background: var(--us-ink); color: #fff; }

@media (max-width: 860px) {
    .ursum-store .us-orders__head { display: none; }
    .ursum-store .us-orders__row { grid-template-columns: 1fr; gap: 8px; padding: 18px; border: 1px solid var(--us-card-border); border-radius: 16px; margin-bottom: 12px; }
    .ursum-store .us-orders__actions { flex-direction: row; text-align: left; }
    /* Comfortable touch targets on warehouse tablets / phones. */
    .ursum-store .us-btn, .ursum-store .us-seg__btn, .ursum-store .us-tile { min-height: 44px; }
    .ursum-store input, .ursum-store select { min-height: 44px; }
}

/* Right-column totals block (fragment .us-right-totals). */
.ursum-store .us-right-totals { margin-top: 20px; }
.ursum-store .us-right-totals .us-totals { border-top: 1px solid var(--us-divider); padding-top: 14px; }
.ursum-store .us-note--vat { margin-top: 12px; color: #A6462F; text-align: center; }

/* --------------------------------------------------------------------- *
 * Mobile (≤860px): stack columns, full-width controls, ≥44px touch targets
 * --------------------------------------------------------------------- */
@media (max-width: 860px) {
    .ursum-store .us-checkout__grid,
    .ursum-store .us-thanks__grid { grid-template-columns: 1fr !important; gap: 16px; }
    .ursum-store .us-card { padding: 20px; border-radius: 16px; }
    .ursum-store .us-h1 { font-size: 24px; }
    .ursum-store .us-shell { padding: 20px 14px; }
    /* Inputs: ≥44px targets; 16px font stops iOS zoom-on-focus. */
    .ursum-store input[type="text"], .ursum-store input[type="email"],
    .ursum-store input[type="tel"], .ursum-store select,
    #ursum-direct input[type="text"], #ursum-direct input[type="email"],
    #ursum-direct input[type="tel"], #ursum-direct select {
        font-size: 16px !important; min-height: 44px;
    }
    .ursum-store .us-btn, .ursum-store .ursum-seg, #ursum-direct .ursum-seg { min-height: 44px; }
    /* Carrier tiles: one per row, full width. */
    .ursum-direct .ursum-direct__tiles { grid-template-columns: 1fr !important; display: grid; gap: 10px; }
    .ursum-store .us-thanks__side .us-actions { flex-direction: column; }
}

/* --------------------------------------------------------------------- *
 * My Account (minu-konto 1a)
 * --------------------------------------------------------------------- */
.ursum-store.us-account .us-account-head { margin-bottom: 8px; }
.ursum-store .us-account-card { max-width: 630px; }
.ursum-store .us-account-card .us-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ursum-store .us-field { margin: 0 0 14px; }
.ursum-store .us-field__label { display: block; font-size: 12px; font-weight: 600; color: var(--us-label); margin-bottom: 6px; }
.ursum-store .us-account-card input[type="text"],
.ursum-store .us-account-card input[type="email"],
.ursum-store .us-account-card input[type="tel"],
.ursum-store .us-account-card input[type="password"],
.ursum-store .us-account-card select {
    width: 100%; border: 1px solid var(--us-input-border); border-radius: var(--us-r-input);
    padding: 12px 14px; font-size: 14px; color: var(--us-ink); background: #fff; box-sizing: border-box;
}
.ursum-store .us-account-card__foot {
    display: flex; align-items: center; justify-content: space-between; margin-top: 18px;
}
.ursum-store .us-password-fields { border: 0; padding: 0; margin: 8px 0 0; }

/* View order (kinnitus-style, inside the account shell). */
.ursum-store .us-vieworder__head {
    display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 20px;
}
.ursum-store .us-back-link--inline { display: block; text-align: left; margin: 0 0 8px; }
.ursum-store .us-vieworder__title { font-size: 20px; font-weight: 700; margin: 0; }
.ursum-store .us-vieworder__date { font-weight: 400; color: var(--us-muted); font-size: 14px; }
.ursum-store .us-vieworder__track { margin-top: 16px; }
.ursum-store .us-vieworder .us-note { margin-top: 16px; }

.ursum-store .us-account-password { margin-top: 20px; }
.ursum-store .us-account-password .us-password-fields { margin-top: 14px; }

/* Blocksy's global button/form chrome bleeds into this block: double focus
   ring on the pill, oversized inputs, label margins pulling out of the card.
   Normalize everything explicitly. */
.ursum-store button.us-btn,
.ursum-store .us-btn {
    appearance: none; -webkit-appearance: none;
    box-shadow: none !important; outline: none;
}
.ursum-store button.us-btn--outline {
    background: #fff !important; color: var(--us-label) !important;
    border: 1px solid var(--us-input-border) !important;
}
.ursum-store .us-btn:focus-visible { outline: 2px solid var(--us-ink); outline-offset: 2px; }
.ursum-store .us-password-fields { padding: 28px 32px; box-sizing: border-box; }
.ursum-store .us-password-fields .us-field { margin: 0 0 16px; }
.ursum-store .us-password-fields .us-field__label {
    display: block; font-size: 12px !important; font-weight: 600 !important;
    color: var(--us-label) !important; margin: 0 0 6px !important; line-height: 1.4;
}
.ursum-store .us-password-fields input[type="password"] {
    width: 100%; height: auto !important; min-height: 0 !important;
    border: 1px solid var(--us-input-border) !important;
    border-radius: var(--us-r-input) !important;
    padding: 12px 14px !important; font-size: 14px !important;
    line-height: 1.4 !important; background: #fff !important;
    box-sizing: border-box; box-shadow: none !important;
}
.ursum-store .us-password-fields button[type="submit"] { margin-top: 4px; }

.ursum-store .us-orders__dest { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; }
.ursum-store .us-orders__dest-sub { font-size: 12px; color: var(--us-body); }
.ursum-store .us-orders__empty { font-size: 14px; color: var(--us-body); margin: 0 0 16px; }

/* Restyle the (functional) shipping-default editor to the token language. */
.ursum-store .ursum-pro-sync-me select,
.ursum-store .ursum-pro-sync-me input.input-text {
    width: 100%; max-width: 420px; border: 1px solid var(--us-input-border);
    border-radius: var(--us-r-input); padding: 12px 14px; font-size: 14px;
    color: var(--us-ink); background: #fff; box-sizing: border-box;
}
.ursum-store .ursum-pro-sync-me select { height: 46px; padding: 0 14px; }
.ursum-store .ursum-pro-sync-me label { font-size: 12px; font-weight: 600; color: var(--us-label); }
.ursum-store .ursum-pro-sync-me .button {
    border-radius: var(--us-r-pill); background: var(--us-ink); color: #fff;
    border: 0; font-size: 14px; font-weight: 600; padding: 12px 22px; cursor: pointer;
}

@media (max-width: 860px) {
    /* Tabs scroll horizontally; orders rows stack into cards. */
    .ursum-store .us-tabs { overflow-x: auto; white-space: nowrap; gap: 18px; -webkit-overflow-scrolling: touch; }
    .ursum-store .us-orders__head { display: none; }
    .ursum-store .us-orders__row {
        grid-template-columns: 1fr 1fr; gap: 8px; padding: 16px 14px;
    }
    .ursum-store .us-card.us-orders { padding: 8px 6px; }
    .ursum-store .us-orders__dest { grid-column: 1 / -1; }
    .ursum-store .us-orders__actions { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; gap: 12px; text-align: left; }
    .ursum-store .us-account-card .us-grid2 { grid-template-columns: 1fr; gap: 0; }
    .ursum-store .us-account-head { flex-direction: column; gap: 12px; }
}

/* --------------------------------------------------------------------- *
 * Thank-you page (kinnitus 3a/3b)
 * --------------------------------------------------------------------- */
.ursum-store .us-thanks__head { text-align: center; padding: 36px 0 32px; }
.ursum-store .us-thanks__head .us-success { margin: 0 auto 18px; }
.ursum-store .us-thanks__head .us-h1 { font-size: 30px; }
.ursum-store .us-thanks__sub { margin: 10px 0 0; font-size: 13px; color: var(--us-body); }
.ursum-store .us-thanks__sub strong { color: var(--us-ink); }

.ursum-store .us-thanks__grid { max-width: 1080px; margin: 0 auto; }
.ursum-store .us-thanks__side { display: flex; flex-direction: column; gap: 20px; }
.ursum-store .us-thanks__side .us-actions { display: flex; gap: 12px; }
.ursum-store .us-thanks__side .us-actions .us-btn { flex: 1; text-align: center; }

.ursum-store .us-item--compact { padding: 14px 0; }
.ursum-store .us-item--compact .us-item__qty { margin-top: 2px; }

.ursum-store .us-thanks__addr { margin-bottom: 18px; }
.ursum-store .us-thanks__addr-name { font-size: 14px; font-weight: 600; }
.ursum-store .us-thanks__addr-meta { font-weight: 400; color: var(--us-body); }
.ursum-store .us-thanks__addr-row { font-size: 13px; color: var(--us-body); margin-top: 4px; }

.ursum-store .us-thanks__billing { margin: 0; font-size: 13px; color: var(--us-body); }

/* --------------------------------------------------------------------- *
 * Checkout page — terms row, payment skin, back link
 * --------------------------------------------------------------------- */
.ursum-store .us-terms-row {
    display: flex; align-items: baseline; justify-content: space-between;
    gap: 12px; margin: 20px 0 12px;
}
.ursum-store .us-terms-row__text { font-size: 12px; color: var(--us-body); }
.ursum-store .us-terms-row__total { font-size: 13px; font-weight: 700; }
.ursum-store .us-terms-row__total .amount { font-variant-numeric: tabular-nums; }

.ursum-store .us-back-link {
    display: block; text-align: center; margin-top: 14px;
    font-size: 13px; color: var(--us-muted); text-decoration: none;
}

/* --- Blocksy bleed hardening (dev-shop findings 2026-07-08) --------------- */
/* Blocksy uppercases page headings. */
.ursum-store .us-h1 { text-transform: none; }
/* Blocksy lays form.checkout out as its own grid, squashing our columns. */
.ursum-store form.woocommerce-checkout { display: block !important; width: 100%; }
@media (min-width: 861px) {
    .ursum-store .us-checkout__grid { grid-template-columns: 1fr 1fr !important; }
}
/* Blocksy boxes the review-order table AND #order_review (border + padding),
   and bleeds #payment past the card edge with negative margins. All flat here. */
.ursum-store .woocommerce-checkout-review-order-table,
.ursum-store #order_review {
    border: 0 !important; padding: 0 !important; margin: 0 !important;
    background: transparent !important; box-shadow: none !important;
}
.ursum-store #payment,
.ursum-store .woocommerce-checkout-payment {
    margin: 0 !important; padding: 0 !important;
    width: 100% !important; max-width: 100% !important;
    border-radius: 0 !important;
}
/* Segmented control: equal halves, never wrap into circles. */
.ursum-store .ursum-seg, .ursum-direct .ursum-seg { white-space: nowrap; }

/* The legacy no-VAT snippet prints itself into the left order summary; the
   shop's real DOM nests it unpredictably, so it is hidden by TEXT CONTENT in
   ursum-storefront.js (us-legacy-vat-note class), not by structural CSS —
   a broad :not() rule here once took the product rows down with it. */
.ursum-store .us-checkout__summary .us-legacy-vat-note { display: none !important; }

/* Stock checkout pieces the kassa-2a design does not show: the ship-to-a-
   different-address toggle and the order-notes textarea. Kept in the DOM so
   hooks/values still post; the courier flow writes the shipping address
   server-side from the Ursum fields. */
.ursum-store #ship-to-different-address,
.ursum-store .shipping_address,
.ursum-store .woocommerce-additional-fields > h3,
.ursum-store .woocommerce-additional-fields .notes { display: none; }

/* Place-order row: Woo/Blocksy give it bleed margins that overflow the card. */
.ursum-store .woocommerce-checkout-payment .form-row.place-order,
.ursum-store .place-order { padding: 0 !important; margin: 12px 0 0 !important; }
.ursum-store #place_order { width: 100%; max-width: 100%; box-sizing: border-box; margin: 0; }

/* Strip WooCommerce's payment box chrome — invoice-terms shop, no gateway UI. */
.ursum-store .woocommerce-checkout-payment { background: transparent !important; border: 0; }
.ursum-store .wc_payment_methods.us-single-method { display: none; }
.ursum-store .wc_payment_methods { list-style: none; margin: 0 0 12px; padding: 0; font-size: 13px; color: var(--us-body); }
.ursum-store .woocommerce-checkout-payment .form-row { margin: 0; padding: 0; }

/* WooCommerce billing form inside the collapsible editor. */
.ursum-store .us-billing-fields .form-row { margin: 0 0 12px; padding: 0; }
.ursum-store .us-billing-fields label { display: block; font-size: 12px; font-weight: 600; color: var(--us-label); margin-bottom: 6px; }
.ursum-store .us-billing-summary { margin-bottom: 4px; }

/* Inline notices (validation summary) in the token language. */
.ursum-store .woocommerce-error, .ursum-store .woocommerce-NoticeGroup .woocommerce-error {
    background: var(--us-err-banner-bg); border: 1px solid var(--us-err-banner-border);
    border-radius: var(--us-r-note); padding: 14px 16px; font-size: 13px; color: var(--us-err-text);
    list-style: none; margin: 0 0 16px;
}

/* Hidden container for woocommerce_thankyou hook output (duplicate order
   table + notices) — scripts inside still run. */
.us-thankyou-extras { display: none !important; }

/* Stacked notes (NB + gift-slip) need air between them. */
.ursum-store .us-note + .us-note { margin-top: 10px; }

/* The gray page must run down to the footer: Blocksy's body/main stays white
   below our full-bleed section otherwise. */
body.woocommerce-checkout,
body.woocommerce-order-received,
body.woocommerce-account { background: #F3F4F5 !important; }

/* selectWoo (searchable parcel-machine dropdown) in the token language. */
.ursum-store .select2-container .select2-selection--single,
#ursum-direct .select2-container .select2-selection--single {
    height: 46px; border: 1px solid #D5DAE1; border-radius: 10px;
}
#ursum-direct .select2-container .select2-selection__rendered { line-height: 44px; padding-left: 14px; font-size: 14px; color: #141C2B; }
#ursum-direct .select2-container .select2-selection__arrow { height: 44px; }

/* The [hidden] attribute must beat the flex/grid display rules above. */
.ursum-store [hidden] { display: none !important; }