/**
 * Romeof Hyvä brand — Magma/luma_armyoga pinks (not Magma theme name).
 * Magma refs: palevioletred buttons, #e276dc pinkyoga, footer lighten(pinkyoga,28%)
 *
 * Tokens are also set in web/tailwind/hyva.config.json (compiled into styles.css).
 * This file is a hard override so CTAs stay pink even if styles.css is stale.
 *
 * MageOS Blog Hyvä Yoga CSS uses var(--color-primary) — pink portfolio/blog
 * accents come from these tokens, not from the artifact module.
 */
:root,
:host {
    --color-primary: #db7093 !important;
    --color-primary-lighter: #e276dc !important;
    --color-primary-darker: #c4567a !important;
    --color-on-primary: #ffffff !important;
    --color-secondary: #e276dc !important;
    --color-on-secondary: #ffffff !important;

    --romeof-pink: #e276dc; /* Magma @color-pinkyoga — copyright bar */
    --romeof-pink-button: #db7093;
    /* Magma @footer__background-color: lighten(#e276dc, 28%) = #fbecfa (compiled styles-l.css) */
    --romeof-pink-soft: #fbecfa;
    --romeof-pink-softer: #fbecfa; /* Magma .nav-sections / .navigation */
}

/* Soft wash for Hyvä Yoga blog/portfolio placeholders (module uses color-mix fallback) */
.hyva-yoga,
.hyva-yoga-blog {
    --hyva-yoga-accent-soft: var(--romeof-pink-soft);
}

/* Stripe checkout — hint under Effettua ordine (right-aligned).
   Avoid max-width shrink column (was 22rem → 4-line wrap on Italian copy). */
.stripe-payments .actions-toolbar .primary,
#stripe-checkout-actions-toolbar .primary {
    width: 100%;
    max-width: 100%;
    text-align: right;
}

.stripe-payments .actions-toolbar .primary .stripe-place-order-hint,
#stripe-checkout-actions-toolbar .primary .stripe-place-order-hint,
.stripe-payments .stripe-place-order-hint,
#stripe-checkout-actions-toolbar .stripe-place-order-hint {
    display: block;
    clear: both;
    margin: 1.75rem 0 0;
    max-width: none;
    width: 100%;
    text-align: right;
    font-size: 0.875rem;
    line-height: 1.45;
    color: #555;
}

/* Force primary CTAs pink — hex literals beat compiled oklch blue */
.btn-primary,
button.btn-primary,
a.btn-primary,
.action.primary,
button.action.primary,
.action.tocart,
#product-addtocart-button,
.pagebuilder-button-primary,
button.tocart,
form#product_addtocart_form button.btn,
.product-info-main .btn-primary,
.box-tocart .btn-primary,
.actions .btn-primary,
#newsletter-validate-detail button,
#newsletter-validate-detail .btn-primary,
form.form.subscribe button,
.page-footer button.btn-primary {
    --btn-bg: #db7093 !important;
    --btn-color: #ffffff !important;
    --btn-hover-bg: #e276dc !important;
    --btn-hover-color: #ffffff !important;
    --btn-active-bg: #c4567a !important;
    --btn-active-color: #ffffff !important;
    background: #db7093 !important;
    background-color: #db7093 !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

.btn-primary:hover,
button.btn-primary:hover,
a.btn-primary:hover,
.action.primary:hover,
#product-addtocart-button:hover,
.action.tocart:hover,
form#product_addtocart_form button.btn:hover,
.product-info-main .btn-primary:hover,
#newsletter-validate-detail button:hover,
.page-footer button.btn-primary:hover {
    background: #e276dc !important;
    background-color: #e276dc !important;
    color: #ffffff !important;
}

.btn-secondary,
button.btn-secondary,
a.btn-secondary {
    --btn-stroke: #e276dc !important;
    --btn-color: #c4567a !important;
    --btn-hover-stroke: #db7093 !important;
    --btn-hover-color: #e276dc !important;
    border-color: #e276dc !important;
    color: #c4567a !important;
}

/* Header — Magma .nav-sections / .navigation { background: #fbecfa } */
header.page-header,
.page-header,
header[x-data] {
    background-color: #fbecfa !important;
}

/* Main footer — Magma .page-footer { background: #fbecfa } */
.page-footer,
footer .bg-gray-100,
div.bg-gray-100.border-t,
.romeof-footer-main {
    background-color: #fbecfa !important;
    border-color: #f2c2ef !important; /* Magma nav-sections border family */
}

/* Copyright bar — Magma @copyright__background-color */
.romeof-footer-copyright,
div.bg-surface.border-t.border-b {
    background-color: #e276dc !important;
    border-color: #e276dc !important;
    color: #ffffff !important;
}

.romeof-footer-copyright a,
.romeof-footer-copyright p,
.romeof-footer-copyright small {
    color: #ffffff !important;
}

/* Homepage product widget title — space below heading before grid */
.cms-index-index .block.widget.block-products-list .block-title,
.cms-home-page .block.widget.block-products-list .block-title {
    margin-bottom: 1.5rem;
}