/*
 * Semantic action guards
 * ----------------------
 * This file is intentionally loaded after website PanelCSSCode in
 * _PanelLayout.cshtml. Keep it narrow: it is the final cascade boundary for
 * neutral navigation actions (Back/Close), not a general page-style override.
 */
html body .btn.btn-light,
html body .btn.btn-secondary,
html body .btn.btn-gray {
    border-color: var(--x-action-neutral) !important;
    background: var(--x-action-neutral) !important;
    background-color: var(--x-action-neutral) !important;
    background-image: none !important;
    color: var(--x-action-neutral-text) !important;
    filter: none !important;
    opacity: 1 !important;
}

html body .btn.btn-light:hover,
html body .btn.btn-light:hover:not(.btn-active),
html body .btn.btn-light:focus,
html body .btn.btn-light:focus:not(.btn-active),
html body .btn.btn-light:focus-visible,
html body .btn.btn-light:active,
html body .btn.btn-light:active:not(.btn-active),
html body .btn.btn-light.active,
html body .btn.btn-light.show,
html body .btn.btn-light[class*="btn-active-"]:hover,
html body .btn.btn-light[class*="btn-active-"]:focus,
html body .btn.btn-light[class*="btn-active-"]:focus-visible,
html body .btn.btn-light[class*="btn-active-"]:active,
html body .btn.btn-secondary:hover,
html body .btn.btn-secondary:hover:not(.btn-active),
html body .btn.btn-secondary:focus,
html body .btn.btn-secondary:focus:not(.btn-active),
html body .btn.btn-secondary:focus-visible,
html body .btn.btn-secondary:active,
html body .btn.btn-secondary:active:not(.btn-active),
html body .btn.btn-secondary.active,
html body .btn.btn-secondary.show,
html body .btn.btn-gray:hover,
html body .btn.btn-gray:hover:not(.btn-active),
html body .btn.btn-gray:focus,
html body .btn.btn-gray:focus:not(.btn-active),
html body .btn.btn-gray:focus-visible,
html body .btn.btn-gray:active,
html body .btn.btn-gray:active:not(.btn-active),
html body .btn.btn-gray.active,
html body .btn.btn-gray.show,
html body .show > .btn.btn-light,
html body .show > .btn.btn-secondary,
html body .show > .btn.btn-gray {
    border-color: var(--x-action-neutral-hover) !important;
    background: var(--x-action-neutral-hover) !important;
    background-color: var(--x-action-neutral-hover) !important;
    background-image: none !important;
    color: var(--x-action-neutral-text) !important;
    filter: none !important;
    opacity: 1 !important;
}

html body .btn.btn-light > i,
html body .btn.btn-light > span,
html body .btn.btn-light:hover:not(.btn-active) > i,
html body .btn.btn-light:hover:not(.btn-active) > span,
html body .btn.btn-light:focus:not(.btn-active) > i,
html body .btn.btn-light:focus:not(.btn-active) > span,
html body .btn.btn-light:active:not(.btn-active) > i,
html body .btn.btn-light:active:not(.btn-active) > span,
html body .btn.btn-secondary > i,
html body .btn.btn-secondary > span,
html body .btn.btn-secondary:hover:not(.btn-active) > i,
html body .btn.btn-secondary:hover:not(.btn-active) > span,
html body .btn.btn-gray > i,
html body .btn.btn-gray > span,
html body .btn.btn-gray:hover:not(.btn-active) > i,
html body .btn.btn-gray:hover:not(.btn-active) > span {
    border-color: transparent !important;
    background: transparent !important;
    background-color: transparent !important;
    color: inherit !important;
    opacity: 1 !important;
}

/*
 * Metronic's generic disabled rule uses a very pale surface. A btn-light can
 * temporarily receive disabled/aria-disabled while a form is submitting, and
 * without this semantic override it looks white or disappears under the
 * pointer. Keep it visibly neutral while preserving its disabled cursor and
 * interaction semantics.
 */
html body .btn.btn-light:disabled,
html body .btn.btn-light[disabled],
html body .btn.btn-light.disabled,
html body .btn.btn-light[aria-disabled="true"],
html body .btn.btn-light:disabled:hover,
html body .btn.btn-light[disabled]:hover,
html body .btn.btn-light.disabled:hover,
html body .btn.btn-light[aria-disabled="true"]:hover {
    border-color: var(--x-action-neutral) !important;
    background: var(--x-action-neutral) !important;
    background-color: var(--x-action-neutral) !important;
    background-image: none !important;
    color: var(--x-action-neutral-text) !important;
    filter: none !important;
    opacity: 1 !important;
}

/*
 * Compact Metronic actions are frequently restyled by page-level
 * `.btn-sm.btn-light` rules. Keep this more specific rule at the final cascade
 * boundary so their hover/focus state cannot fall back to a white surface in
 * any xPlatform color theme.
 */
html[data-bs-theme] body .btn.btn-sm.btn-light {
    border-color: var(--x-action-neutral) !important;
    background: var(--x-action-neutral) !important;
    background-color: var(--x-action-neutral) !important;
    background-image: none !important;
    color: var(--x-action-neutral-text) !important;
    filter: none !important;
    opacity: 1 !important;
}

html[data-bs-theme] body .btn.btn-sm.btn-light:hover,
html[data-bs-theme] body .btn.btn-sm.btn-light:hover:not(.btn-active),
html[data-bs-theme] body .btn.btn-sm.btn-light:focus,
html[data-bs-theme] body .btn.btn-sm.btn-light:focus:not(.btn-active),
html[data-bs-theme] body .btn.btn-sm.btn-light:focus-visible,
html[data-bs-theme] body .btn.btn-sm.btn-light:active,
html[data-bs-theme] body .btn.btn-sm.btn-light:active:not(.btn-active),
html[data-bs-theme] body .btn.btn-sm.btn-light.active,
html[data-bs-theme] body .btn.btn-sm.btn-light.show,
html[data-bs-theme] body .btn.btn-sm.btn-light[class*="btn-active-"]:hover,
html[data-bs-theme] body .btn.btn-sm.btn-light[class*="btn-active-"]:focus,
html[data-bs-theme] body .btn.btn-sm.btn-light[class*="btn-active-"]:focus-visible,
html[data-bs-theme] body .btn.btn-sm.btn-light[class*="btn-active-"]:active,
html[data-bs-theme] body .show > .btn.btn-sm.btn-light {
    border-color: var(--x-action-neutral-hover) !important;
    background: var(--x-action-neutral-hover) !important;
    background-color: var(--x-action-neutral-hover) !important;
    background-image: none !important;
    color: var(--x-action-neutral-text) !important;
    filter: none !important;
    opacity: 1 !important;
}

html[data-bs-theme] body .btn.btn-sm.btn-light > i,
html[data-bs-theme] body .btn.btn-sm.btn-light > span,
html[data-bs-theme] body .btn.btn-sm.btn-light > .svg-icon {
    border-color: transparent !important;
    background: transparent !important;
    background-color: transparent !important;
    color: inherit !important;
    opacity: 1 !important;
}

/*
 * Panel pages use body#kt_body. The ID is intentional: page-level rules often
 * add one or more wrapper classes (for example `.org-manage-actions`) and can
 * otherwise beat the shared !important declaration through specificity. This
 * is the final semantic boundary for exact neutral button classes.
 */
html body#kt_body .btn.btn-light,
html body#kt_body .btn.btn-secondary,
html body#kt_body .btn.btn-gray,
html body#kt_body .btn.btn-light:disabled,
html body#kt_body .btn.btn-light[disabled],
html body#kt_body .btn.btn-light.disabled,
html body#kt_body .btn.btn-light[aria-disabled="true"] {
    border-color: var(--x-action-neutral, #5F6B7A) !important;
    background: var(--x-action-neutral, #5F6B7A) !important;
    background-color: var(--x-action-neutral, #5F6B7A) !important;
    background-image: none !important;
    color: var(--x-action-neutral-text, #FFFFFF) !important;
    filter: none !important;
    opacity: 1 !important;
}

html body#kt_body .btn.btn-light:hover,
html body#kt_body .btn.btn-light:hover:not(.btn-active),
html body#kt_body .btn.btn-light:focus,
html body#kt_body .btn.btn-light:focus:not(.btn-active),
html body#kt_body .btn.btn-light:focus-visible,
html body#kt_body .btn.btn-light:active,
html body#kt_body .btn.btn-light:active:not(.btn-active),
html body#kt_body .btn.btn-light.active,
html body#kt_body .btn.btn-light.show,
html body#kt_body .btn.btn-secondary:hover,
html body#kt_body .btn.btn-secondary:focus,
html body#kt_body .btn.btn-secondary:focus-visible,
html body#kt_body .btn.btn-secondary:active,
html body#kt_body .btn.btn-secondary.active,
html body#kt_body .btn.btn-secondary.show,
html body#kt_body .btn.btn-gray:hover,
html body#kt_body .btn.btn-gray:focus,
html body#kt_body .btn.btn-gray:focus-visible,
html body#kt_body .btn.btn-gray:active,
html body#kt_body .btn.btn-gray.active,
html body#kt_body .btn.btn-gray.show,
html body#kt_body .show > .btn.btn-light,
html body#kt_body .show > .btn.btn-secondary,
html body#kt_body .show > .btn.btn-gray {
    border-color: var(--x-action-neutral-hover, #4B5563) !important;
    background: var(--x-action-neutral-hover, #4B5563) !important;
    background-color: var(--x-action-neutral-hover, #4B5563) !important;
    background-image: none !important;
    color: var(--x-action-neutral-text, #FFFFFF) !important;
    filter: none !important;
    opacity: 1 !important;
}

html body#kt_body .btn.btn-light > i,
html body#kt_body .btn.btn-light > span,
html body#kt_body .btn.btn-light > .svg-icon,
html body#kt_body .btn.btn-secondary > i,
html body#kt_body .btn.btn-secondary > span,
html body#kt_body .btn.btn-secondary > .svg-icon,
html body#kt_body .btn.btn-gray > i,
html body#kt_body .btn.btn-gray > span,
html body#kt_body .btn.btn-gray > .svg-icon {
    border-color: transparent !important;
    background: transparent !important;
    background-color: transparent !important;
    color: inherit !important;
    opacity: 1 !important;
}