.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-weight: 600;
    text-decoration: none;
    padding: 10px 18px;
    border-radius: var(--ewp-radius-pill);
    border: 1px solid transparent;
    cursor: pointer;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

/* Base button (corporativo por defecto). */
.btn,
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.wp-element-button,
.wp-block-button__link,
a.button,
button.button,
input.button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
    background: var(--ewp-primary);
    color: #fff;
    border: 1px solid transparent;
    border-radius: var(--ewp-radius-pill);
    padding: 10px 18px;
    min-height: 44px;
    line-height: 1;
    font-weight: 700;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.btn:hover,
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
.wp-element-button:hover,
.wp-block-button__link:hover,
a.button:hover,
button.button:hover,
input.button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
    background: var(--ewp-primary-hover);
    color: #fff;
}

.btn:focus-visible,
button:focus-visible,
input[type="button"]:focus-visible,
input[type="submit"]:focus-visible,
input[type="reset"]:focus-visible,
.wp-element-button:focus-visible,
.wp-block-button__link:focus-visible,
a.button:focus-visible,
button.button:focus-visible,
input.button:focus-visible,
.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.woocommerce input.button:focus-visible,
.woocommerce #respond input#submit:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 170, 0, .18);
}

.btn--primary {
    background: var(--ewp-primary);
    color: #fff;
}

.btn--primary:hover {
    background: var(--ewp-primary-hover);
    color: #fff;
}

.btn--ghost {
    background: transparent;
    border-color: var(--ewp-border);
    color: var(--ewp-primary);
}

/* Ghost / outline / secondary / alt: no corporativo por defecto. */
.btn--ghost,
.ewp-btn--ghost,
.is-style-outline .wp-block-button__link,
.button.is-outline {
    background: transparent !important;
    color: var(--ewp-primary) !important;
    border-color: var(--ewp-border) !important;
}

.button.secondary,
.button.alt,
.woocommerce a.button.secondary,
.woocommerce button.button.secondary,
.woocommerce input.button.secondary,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
    background: transparent !important;
    color: var(--ewp-text) !important;
    border-color: var(--ewp-border) !important;
}

.btn--ghost:hover,
.ewp-btn--ghost:hover,
.is-style-outline .wp-block-button__link:hover,
.button.is-outline:hover {
    background: rgba(0, 170, 0, .08) !important;
    color: var(--ewp-primary) !important;
}

.button.secondary:hover,
.button.alt:hover,
.woocommerce a.button.secondary:hover,
.woocommerce button.button.secondary:hover,
.woocommerce input.button.secondary:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
    background: #f8fafc !important;
    color: var(--ewp-text) !important;
    border-color: var(--ewp-border) !important;
}

.btn--danger {
    background: var(--ewp-danger);
    color: #fff;
}

.ewp-btn--danger {
    background: var(--ewp-danger) !important;
    color: #fff !important;
}

.btn--danger:hover {
    filter: brightness(.92);
}

.ewp-btn--danger:hover {
    filter: brightness(.92);
}

/* Gutenberg button: primary por defecto. */
body .wp-block-button .wp-block-button__link,
body .wp-element-button,
body .wp-block-file .wp-block-file__button {
    background: var(--ewp-primary) !important;
    color: #fff !important;
    border: 1px solid transparent !important;
    border-radius: var(--ewp-radius-pill) !important;
    padding: 10px 18px !important;
    min-height: 44px;
    line-height: 1;
    font-weight: 700;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

body .wp-block-button .wp-block-button__link:hover,
body .wp-element-button:hover,
body .wp-block-file .wp-block-file__button:hover {
    background: var(--ewp-primary-hover) !important;
    color: #fff !important;
}

body .is-style-outline .wp-block-button__link,
body .wp-block-button.is-style-outline .wp-block-button__link,
body .wp-block-button__link.is-style-outline {
    background: transparent !important;
    color: var(--ewp-primary) !important;
    border-color: var(--ewp-border) !important;
}

body .wp-block-button .wp-block-button__link:focus-visible,
body .wp-element-button:focus-visible,
body .wp-block-file .wp-block-file__button:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 170, 0, .18);
}

:where(
    .field__input,
    input[type="text"],
    input[type="search"],
    input[type="email"],
    input[type="tel"],
    input[type="url"],
    input[type="password"],
    input[type="number"],
    select
) {
    height: 44px;
    border-radius: var(--ewp-radius-pill);
    border: 1px solid var(--ewp-border);
    padding: 0 14px;
    background: #fff;
}

:where(.field__input, textarea) {
    border: 1px solid var(--ewp-border);
    background: #fff;
}

textarea {
    border-radius: var(--ewp-radius-md);
    padding: 10px 14px;
}

:where(
    .field__input,
    input[type="text"],
    input[type="search"],
    input[type="email"],
    input[type="tel"],
    input[type="url"],
    input[type="password"],
    input[type="number"],
    select,
    textarea
):focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 170, 0, .18);
    border-color: var(--ewp-primary);
}

.card {
    background: var(--ewp-card);
    border: 1px solid var(--ewp-border);
    border-radius: var(--ewp-radius-md);
    box-shadow: var(--ewp-shadow-sm);
    padding: 16px;
}

.alert {
    border: 1px solid var(--ewp-border);
    border-radius: var(--ewp-radius-md);
    padding: 12px 14px;
    color: var(--ewp-text);
    background: #fff;
}

.alert--success {
    border-color: #bce6bc;
    background: #ebf9eb;
    color: #0f5a0f;
}

.alert--warning {
    border-color: #f3cfab;
    background: #fff6ec;
    color: #8c3c08;
}

.alert--error {
    border-color: #f7c5c1;
    background: #fef2f1;
    color: #9f1d14;
}

.alert--info {
    border-color: #b9d5f7;
    background: #eef6ff;
    color: #1d4a8c;
}
