[data-koshi-consent-open][hidden] { display: none !important; }

/*
 * Koshi shared commercial button contract.
 *
 * Canonical source: shared/ui/koshi-buttons.css
 * Deployment copies:
 * - wordpress/theme/koshi-production/assets/css/koshi-buttons.css
 * - magento/theme/Koshi/production/web/css/koshi-buttons.css
 *
 * Keep the three files byte-identical with agent/tools/sync_koshi_ui_buttons.ps1.
 */
.koshi-ui-button,
.button,
.koshi-button,
.delivery-figma-button,
.resellers-figma-button,
.contact-figma-submit,
.faq-figma-cta__primary,
.guide-use-cta__primary,
.story-figma-cta a,
.manufacture-figma-cta a,
.qr-figma-button,
.koshi-system-state__action,
.popup-authentication .action-login,
.checkout-index-index .action-select-shipping-item,
.checkout-index-index .action-show-popup,
.checkout-index-index .koshi-summary-discount .action-apply,
.checkout-index-index .koshi-summary-discount .action-cancel,
.action.primary,
.wp-block-button__link {
    --koshi-button-surface: var(--koshi-clay);
    --koshi-button-surface-hover: var(--koshi-burgundy);
    --koshi-button-border: var(--koshi-button-surface);
    --koshi-button-border-hover: var(--koshi-button-surface-hover);
    --koshi-button-foreground: var(--koshi-white);
    --koshi-button-foreground-hover: var(--koshi-white);
    --koshi-button-height: calc(2.5 * var(--koshi-ui-unit, 1rem));
    --koshi-button-padding-inline: calc(1.25 * var(--koshi-ui-unit, 1rem));
    --koshi-button-font-family: var(--koshi-sans, "Instrument Sans", "Helvetica Neue", Helvetica, Arial, sans-serif);
    --koshi-button-font-size: calc(0.875 * var(--koshi-ui-unit, 1rem));
    --koshi-button-font-weight: 600;
    --koshi-button-letter-spacing: .1em;
    --koshi-button-line-height: 1.2;
    --koshi-button-text-transform: uppercase;
    box-sizing: border-box;
    display: inline-flex;
    /* Flex centering retains existing wrapped labels; extra lines grow the box. */
    height: auto;
    min-height: var(--koshi-button-height);
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--koshi-button-border) !important;
    border-radius: var(--koshi-radius-control, 5px) !important;
    padding-block: 0 !important;
    padding-inline: var(--koshi-button-padding-inline) !important;
    background: var(--koshi-button-surface) !important;
    color: var(--koshi-button-foreground) !important;
    box-shadow: none !important;
    cursor: pointer;
    font-family: var(--koshi-button-font-family) !important;
    font-size: var(--koshi-button-font-size) !important;
    font-weight: var(--koshi-button-font-weight) !important;
    letter-spacing: var(--koshi-button-letter-spacing);
    line-height: var(--koshi-button-line-height) !important;
    text-align: center;
    text-decoration: none !important;
    text-transform: var(--koshi-button-text-transform);
    transform: none !important;
    transition:
        background-color .3s cubic-bezier(0, 0, .58, 1),
        border-color .3s cubic-bezier(0, 0, .58, 1),
        color .3s cubic-bezier(0, 0, .58, 1);
}

.koshi-ui-button:hover,
.koshi-ui-button:focus-visible,
.button:hover,
.button:focus-visible,
.koshi-button:hover,
.koshi-button:focus-visible,
.delivery-figma-button:hover,
.delivery-figma-button:focus-visible,
.resellers-figma-button:hover,
.resellers-figma-button:focus-visible,
.contact-figma-submit:hover,
.contact-figma-submit:focus-visible,
.faq-figma-cta__primary:hover,
.faq-figma-cta__primary:focus-visible,
.guide-use-cta__primary:hover,
.story-figma-cta a:hover,
.manufacture-figma-cta a:hover,
.guide-use-cta__primary:focus-visible,
.story-figma-cta a:focus-visible,
.manufacture-figma-cta a:focus-visible,
.qr-figma-button:hover,
.qr-figma-button:focus-visible,
.koshi-system-state__action:hover,
.koshi-system-state__action:focus-visible,
.popup-authentication .action-login:hover,
.popup-authentication .action-login:focus-visible,
.checkout-index-index .action-select-shipping-item:hover,
.checkout-index-index .action-select-shipping-item:focus-visible,
.checkout-index-index .action-show-popup:hover,
.checkout-index-index .action-show-popup:focus-visible,
.checkout-index-index .koshi-summary-discount .action-apply:hover,
.checkout-index-index .koshi-summary-discount .action-apply:focus-visible,
.checkout-index-index .koshi-summary-discount .action-cancel:hover,
.checkout-index-index .koshi-summary-discount .action-cancel:focus-visible,
.action.primary:hover,
.action.primary:focus-visible,
.wp-block-button__link:hover,
.wp-block-button__link:focus-visible {
    border-color: var(--koshi-button-border-hover) !important;
    background: var(--koshi-button-surface-hover) !important;
    color: var(--koshi-button-foreground-hover) !important;
    transform: none !important;
}

.koshi-ui-button:focus-visible,
.button:focus-visible,
.koshi-button:focus-visible,
.delivery-figma-button:focus-visible,
.resellers-figma-button:focus-visible,
.contact-figma-submit:focus-visible,
.faq-figma-cta__primary:focus-visible,
.guide-use-cta__primary:focus-visible,
.story-figma-cta a:focus-visible,
.manufacture-figma-cta a:focus-visible,
.qr-figma-button:focus-visible,
.koshi-system-state__action:focus-visible,
.popup-authentication .action-login:focus-visible,
.checkout-index-index .action-select-shipping-item:focus-visible,
.checkout-index-index .action-show-popup:focus-visible,
.checkout-index-index .koshi-summary-discount .action-apply:focus-visible,
.checkout-index-index .koshi-summary-discount .action-cancel:focus-visible,
.action.primary:focus-visible,
.wp-block-button__link:focus-visible {
    outline: 2px solid var(--koshi-ink);
    outline-offset: 2px;
}

.koshi-ui-button--clay,
.delivery-figma-button--shop,
.resellers-figma-button,
.contact-figma-submit,
.faq-figma-cta__primary,
.guide-use-cta__primary,
.story-figma-cta a,
.manufacture-figma-cta a,
.qr-figma-button--clay,
.koshi-system-state__action--primary {
    --koshi-button-surface: var(--koshi-clay);
    --koshi-button-surface-hover: var(--koshi-burgundy);
}

.koshi-ui-button--sage,
.delivery-figma-button--contact,
.qr-figma-button--sage {
    --koshi-button-surface: var(--koshi-sage);
    --koshi-button-surface-hover: var(--koshi-sage-dark, #667f6b);
}

.koshi-ui-button--ink,
.button--dark {
    --koshi-button-surface: var(--koshi-ink);
    --koshi-button-surface-hover: var(--koshi-black, #000);
}

.koshi-ui-button--paper {
    --koshi-button-surface: var(--koshi-paper);
    --koshi-button-surface-hover: var(--koshi-white);
    --koshi-button-border: var(--koshi-paper);
    --koshi-button-border-hover: var(--koshi-white);
    --koshi-button-foreground: var(--koshi-ink);
    --koshi-button-foreground-hover: var(--koshi-ink);
}

.customer-account-login .block-new-customer .action.primary {
    --koshi-button-surface: var(--koshi-paper);
    --koshi-button-surface-hover: var(--koshi-white);
    --koshi-button-border: var(--koshi-paper);
    --koshi-button-border-hover: var(--koshi-white);
    --koshi-button-foreground: var(--koshi-ink);
    --koshi-button-foreground-hover: var(--koshi-ink);
}

.koshi-ui-button--outline,
.koshi-system-state__action--secondary {
    --koshi-button-surface: transparent;
    --koshi-button-surface-hover: var(--koshi-burgundy);
    --koshi-button-border: var(--koshi-clay);
    --koshi-button-border-hover: var(--koshi-burgundy);
    --koshi-button-foreground: var(--koshi-clay);
    --koshi-button-foreground-hover: var(--koshi-white);
}

.koshi-ui-button--body,
.koshi-primitive--profile-action-professional.koshi-primitive--layout-stack[class] .koshi-composition__actions > .koshi-ui-button,
.resellers-figma-button,
.contact-figma-submit {
    --koshi-button-font-size: calc(1 * var(--koshi-ui-unit, 1rem));
    --koshi-button-font-weight: 400;
    --koshi-button-letter-spacing: .02em;
    --koshi-button-line-height: 1.5;
}

.koshi-ui-button.koshi-ui-button--product {
    --koshi-button-padding-inline: calc(1.5 * var(--koshi-ui-unit, 1rem));
    --koshi-button-font-size: calc(0.875 * var(--koshi-ui-unit, 1rem));
    --koshi-button-font-weight: 500;
    --koshi-button-letter-spacing: .08em;
    --koshi-button-line-height: 1.5;
}

/* Centered editorial actions: established body type and clay hover variant. */
.koshi-primitive--layout-stack.koshi-primitive--profile-callout .koshi-ui-button,
.koshi-primitive--layout-stack.koshi-primitive--profile-callout-wide .koshi-ui-button,
.story-figma-cta a,
.manufacture-figma-cta a {
    --koshi-button-font-size: calc(1 * var(--koshi-ui-unit, 1rem));
    --koshi-button-font-weight: 400;
    --koshi-button-letter-spacing: normal;
    --koshi-button-line-height: 1.5;
    --koshi-button-surface-hover: #84382f;
}

.koshi-ui-button--tight,
.qr-figma-button {
    --koshi-button-padding-inline: calc(1.5 * var(--koshi-ui-unit, 1rem));
    --koshi-button-letter-spacing: .025em;
    --koshi-button-line-height: 1;
}

.koshi-ui-button--small,
.button--small,
.koshi-system-state__action {
    --koshi-button-padding-inline: calc(0.875 * var(--koshi-ui-unit, 1rem));
    --koshi-button-font-size: calc(0.75 * var(--koshi-ui-unit, 1rem));
    --koshi-button-font-weight: 500;
    --koshi-button-letter-spacing: .08em;
    --koshi-button-line-height: 1.5;
}

.koshi-ui-button--micro,
.koshi-primitive--profile-image-statement.koshi-primitive--layout-overlay .koshi-primitive--buttons .koshi-ui-button {
    --koshi-button-height: calc(1.625 * var(--koshi-ui-unit, 1rem));
    --koshi-button-padding-inline: 0;
    --koshi-button-font-size: calc(0.75 * var(--koshi-ui-unit, 1rem));
    --koshi-button-font-weight: 400;
    --koshi-button-letter-spacing: .08em;
    --koshi-button-line-height: 1.5;
}

.koshi-ui-button--roboto,
.koshi-primitive--profile-image-statement.koshi-primitive--layout-overlay .koshi-primitive--buttons .koshi-ui-button {
    --koshi-button-font-family: "Roboto", Arial, sans-serif;
}

.koshi-ui-button--normal-case,
.koshi-primitive--profile-action-professional.koshi-primitive--layout-stack[class] .koshi-composition__actions > .koshi-ui-button,
.resellers-figma-button {
    --koshi-button-text-transform: none;
}

.koshi-ui-button:disabled,
.koshi-ui-button[aria-disabled="true"],
.action.primary:disabled,
.action.primary[aria-disabled="true"] {
    cursor: default;
}

@media (prefers-reduced-motion: reduce) {
    .koshi-ui-button,
    .button,
    .koshi-button,
    .delivery-figma-button,
    .resellers-figma-button,
    .contact-figma-submit,
    .faq-figma-cta__primary,
    .guide-use-cta__primary,
.story-figma-cta a,
.manufacture-figma-cta a,
    .qr-figma-button,
    .koshi-system-state__action,
    .popup-authentication .action-login,
    .checkout-index-index .action-select-shipping-item,
    .checkout-index-index .action-show-popup,
    .checkout-index-index .koshi-summary-discount .action-apply,
    .checkout-index-index .koshi-summary-discount .action-cancel,
    .action.primary,
    .wp-block-button__link {
        transition: none;
    }
}