/*
 * Pension Resource button standard.
 * Restyles Bootstrap 5 buttons inside page content (#include) and modals. All values come
 * from pr-theme.css; the sidebar (#mainmenu) is not affected.
 */

/* Base. Exclusions sit in :where() so group and variant rules below can override them. */
:is(#include, .modal) .btn:where(:not(.btn-close, .btn-link, .btn-toggle)) {
    border-radius: var(--pr-btn-radius);
    font-weight: 500;
    transition: var(--pr-btn-transition);
}

:is(#include, .modal) .btn:where(:not(.btn-close, .btn-link, .btn-toggle, :disabled, .disabled)):hover {
    transform: translateY(var(--pr-btn-lift));
    box-shadow: var(--pr-shadow-neutral);
}

:is(#include, .modal) .btn:where(:not(.btn-close, .btn-link, .btn-toggle, :disabled, .disabled)):active {
    transform: translateY(0);
}

:is(#include, .modal) .btn:where(:not(.btn-close, .btn-link, .btn-toggle)):focus-visible {
    box-shadow: var(--pr-focus-ring);
}

/* Primary: gradient */
:is(#include, .modal) .btn-primary,
:is(#include, .modal) .btn-outline-primary:not(:disabled):not(.disabled):hover,
:is(#include, .modal) .btn-check:checked + .btn-outline-primary,
:is(#include, .modal) .btn-outline-primary.active {
    background-image: var(--pr-primary-gradient);
    border-color: transparent;
    color: var(--text-on-primary);
}

:is(#include, .modal) .btn-primary:not(:disabled):not(.disabled):hover,
:is(#include, .modal) .btn-outline-primary:not(:disabled):not(.disabled):hover {
    box-shadow: var(--pr-shadow-primary);
}

:is(#include, .modal) :is(.btn-primary, .btn-success, .btn-danger):not(:disabled):not(.disabled):active,
:is(#include, .modal) :is(.btn-primary, .btn-success, .btn-danger).active,
:is(#include, .modal) .btn-check:checked + :is(.btn-primary, .btn-success, .btn-danger) {
    filter: brightness(0.95);
}

/* Success and danger: gradients in their own color */
:is(#include, .modal) .btn-success,
:is(#include, .modal) .btn-outline-success:not(:disabled):not(.disabled):hover,
:is(#include, .modal) .btn-check:checked + .btn-outline-success,
:is(#include, .modal) .btn-outline-success.active {
    background-image: var(--pr-success-gradient);
    border-color: transparent;
    color: var(--text-on-primary);
}

:is(#include, .modal) .btn-danger,
:is(#include, .modal) .btn-outline-danger:not(:disabled):not(.disabled):hover,
:is(#include, .modal) .btn-check:checked + .btn-outline-danger,
:is(#include, .modal) .btn-outline-danger.active {
    background-image: var(--pr-danger-gradient);
    border-color: transparent;
    color: var(--text-on-primary);
}

/* Outline buttons at rest: soft tint of their color instead of plain white */
:is(#include, .modal) .btn-outline-primary:where(:not(:hover, .active, .btn-check:checked + *)) {
    background-image: var(--pr-primary-soft);
}
:is(#include, .modal) .btn-outline-success:where(:not(:hover, .active, .btn-check:checked + *)) {
    background-image: var(--pr-success-soft);
}
:is(#include, .modal) .btn-outline-danger:where(:not(:hover, .active, .btn-check:checked + *)) {
    background-image: var(--pr-danger-soft);
}
:is(#include, .modal) .btn-outline-secondary:where(:not(:hover, .active, .btn-check:checked + *)) {
    background-image: var(--pr-secondary-soft);
}
:is(#include, .modal) .btn-outline-warning:where(:not(:hover, .active, .btn-check:checked + *)) {
    background-image: var(--pr-warning-soft);
}
:is(#include, .modal) .btn-outline-info:where(:not(:hover, .active, .btn-check:checked + *)) {
    background-image: var(--pr-info-soft);
}
:is(#include, .modal) .btn-outline-dark:where(:not(:hover, .active, .btn-check:checked + *)) {
    background-image: var(--pr-dark-soft);
}

/* Solid and outline variants keep Bootstrap colors; hover shadow matches the color */
:is(#include, .modal) :is(.btn-secondary, .btn-outline-secondary):not(:disabled):not(.disabled):hover {
    box-shadow: var(--pr-shadow-secondary);
}
:is(#include, .modal) :is(.btn-success, .btn-outline-success):not(:disabled):not(.disabled):hover {
    box-shadow: var(--pr-shadow-success);
}
:is(#include, .modal) :is(.btn-danger, .btn-outline-danger):not(:disabled):not(.disabled):hover {
    box-shadow: var(--pr-shadow-danger);
}
:is(#include, .modal) :is(.btn-warning, .btn-outline-warning):not(:disabled):not(.disabled):hover {
    box-shadow: var(--pr-shadow-warning);
}
:is(#include, .modal) :is(.btn-info, .btn-outline-info):not(:disabled):not(.disabled):hover {
    box-shadow: var(--pr-shadow-info);
}
:is(#include, .modal) :is(.btn-dark, .btn-outline-dark):not(:disabled):not(.disabled):hover {
    box-shadow: var(--pr-shadow-dark);
}

/* Grouped buttons stay joined and in line: square inner corners, no lift */
:is(#include, .modal) :is(.btn-group, .btn-group-vertical, .input-group) .btn:not(:disabled):not(.disabled):hover,
:is(#include, .modal) :is(.btn-group, .btn-group-vertical, .input-group) .btn:not(:disabled):not(.disabled):active {
    transform: none;
}

:is(#include, .modal) .btn-group > .btn:not(:last-child):not(.dropdown-toggle),
:is(#include, .modal) .btn-group > .btn-group:not(:last-child) > .btn,
:is(#include, .modal) .input-group > .btn:not(:last-child):not(.dropdown-toggle),
:is(#include, .modal) .input-group > .dropdown-toggle:nth-last-child(n+3) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

:is(#include, .modal) .btn-group > .btn:nth-child(n+3),
:is(#include, .modal) .btn-group > :not(.btn-check) + .btn,
:is(#include, .modal) .btn-group > .btn-group:not(:first-child) > .btn,
:is(#include, .modal) .input-group > .btn:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

:is(#include, .modal) .btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle),
:is(#include, .modal) .btn-group-vertical > .btn-group:not(:last-child) > .btn {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

:is(#include, .modal) .btn-group-vertical > .btn ~ .btn,
:is(#include, .modal) .btn-group-vertical > .btn-group:not(:first-child) > .btn {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

/* Shared gradient surface for non-button elements such as modal headers */
.pr-gradient-bg {
    background-image: var(--pr-primary-gradient);
    color: var(--text-on-primary);
}

@media (prefers-reduced-motion: reduce) {
    :is(#include, .modal) .btn:hover,
    :is(#include, .modal) .btn:active {
        transform: none !important;
    }
}

@media print {
    :is(#include, .modal) .btn {
        box-shadow: none !important;
        transform: none !important;
    }
}
