/**
 * WordPress-style buttons.
 *
 * Implements button styles in the Wellow Brook theme.
 *
 * * Primary buttons.
 * * Delete buttons.
 * * Secondary buttons.
 * * Other buttons.
 * * Bootstrap buttons.
 *
 * @package CiviCRM_Admin_Utilities
 */

/*
------------------------------------------------------------------------------------------
Primary buttons.
------------------------------------------------------------------------------------------
*/

/* Buttons */
:root {
	--crm-info-color: #4d90eb;
	--crm-success-color: #00994d;
	--crm-warning-color: #f0b849;
	--crm-danger-color: #b32d2e;
	--crm-icon-danger-color: var(--crm-danger-color);
	--crm-btn-icon-padding: 12px;
	--crm-btn-padding-inline: 12px;
	--crm-btn-radius: 2px;
	--crm-wp-btn-height: 40px;
}

:root,
body.admin-color-fresh,
body.admin-color-light,
body.admin-color-modern,
body.admin-color-blue,
body.admin-color-coffee,
body.admin-color-ectoplasm,
body.admin-color-midnight,
body.admin-color-ocean,
body.admin-color-sunrise {
	--crm-wp-button-primary-bg: var(--wp-admin-theme-color);
	--crm-wp-button-primary-bg-hover: var(--wp-admin-theme-color-darker-10);
	--crm-wp-button-primary-color: #fff;
	--crm-wp-button-primary-color-hover: var(--crm-wp-button-primary-color);
	--crm-wp-button-primary-border: var(--crm-wp-button-primary-bg);
	--crm-wp-button-primary-border-hover: var(--crm-wp-button-primary-bg-hover);
	/* Toggle Buttons. */
	--crm-input-toggle-enabled-bg: var(--wp-admin-theme-color);
}

.crm-container a.button,
.crm-container a.button:link,
.crm-container a.button:visited,
.crm-container button:not(.btn, .hush-menu-button, .cancel),
.crm-container button.ui-button:has(.ui-button-icon),
.crm-container a.button,
.crm-container .crm-button:not(.cancel),
.crm-actions-ribbon a.button,
.crm-container .ui-widget-content .action-link a.button,
.crm-container [type="button"]:not(.btn, .hush-menu-button, .cancel),
.crm-container [type="reset"],
.crm-container [type="submit"]:not(.btn, .cancel) {
	background: var(--crm-wp-button-primary-bg);
	border: 1px solid var(--crm-wp-button-primary-border);
	color: var(--crm-wp-button-primary-color);
	min-height: var(--crm-wp-btn-height);
}

.crm-container a.button:hover,
.crm-container a.button:focus,
.crm-container .crm-actions-ribbon a.button:not(.delete):hover,
.crm-container .crm-actions-ribbon a.button:not(.delete):focus,
.crm-container .ui-widget-content .action-link a.button:hover,
.crm-container .ui-widget-content .action-link a.button:focus,
.crm-container.ui-dialog .ui-dialog-buttonset button:hover,
.crm-container.ui-dialog .ui-dialog-buttonset button:focus,
.crm-container button:not(.btn, .hush-menu-button, .cancel):hover,
.crm-container button:not(.btn, .hush-menu-button, .cancel):focus,
.crm-container .action-link a.button:hover,
.crm-container .action-link a.button:focus,
.crm-container .crm-button:not(.cancel):hover,
.crm-container .crm-button:not(.cancel):focus,
.crm-container [type="button"]:not(.btn, .hush-menu-button, .cancel):hover,
.crm-container [type="button"]:focus,
.crm-container [type="reset"]:hover,
.crm-container [type="reset"]:focus,
.crm-container [type="submit"]:not(.btn, .cancel):hover,
.crm-container [type="submit"]:not(.btn, .cancel):focus {
	background: var(--crm-wp-button-primary-bg-hover);
	border-color: var(--crm-wp-button-primary-border-hover);
	color: var(--crm-wp-button-primary-color-hover);
}

.crm-container a.button:focus,
.crm-container .crm-actions-ribbon a.button:not(.delete):focus,
.crm-container .ui-widget-content .action-link a.button:focus,
.crm-container.ui-dialog .ui-dialog-buttonset button:focus,
.crm-container button:not(.btn, .hush-menu-button, .cancel):focus,
.crm-container .action-link a.button:focus,
.crm-container .crm-button:not(.cancel):focus,
.crm-container [type="button"]:not(.btn, .hush-menu-button, .cancel):focus,
.crm-container [type="reset"]:focus,
.crm-container [type="submit"]:not(.btn, .cancel):focus {
	outline: none;
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-wp-button-primary-bg);
}

.crm-container .crm-actions-ribbon a.button:focus .crm-i {
	color: var(--crm-wp-button-primary-color-hover);
}

/* Button exceptions. */

/* Action links, e.g. on Contact Contributions Panel. */
.crm-container .ui-widget-content .action-link a.button {
	margin: 0;
	min-height: 0;
	height: var(--crm-btn-height);
}

/* Override RiverLea Action links focus. */
.crm-container .ui-widget-content .action-link a.button:focus {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-wp-button-primary-bg) !important;
}



/* "Hide" and "Unhide" Buttons on System Status screen. */
#crm-status-list h3 button[type="button"]:focus,
#crm-status-list h3 button[type="button"]:focus-visible,
#crm-status-list h3 .hush-menu button[type="button"]:focus,
#crm-status-list h3 .hush-menu button[type="button"]:focus-visible {
	outline: none;
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-wp-button-primary-bg);
}

/* "Unhide" Button on System Status screen. */
h3.crm-severity-notice .hush-menu [type="button"] {
	min-height: 0;
}



/*
------------------------------------------------------------------------------------------
Delete buttons.
------------------------------------------------------------------------------------------
*/

.crm-container button.ui-button:has(.fa-trash) {
	background: var(--crm-btn-cancel-bg-color);
	border-color: var(--crm-btn-cancel-bg-color);
	color: var(--crm-btn-cancel-text-color);
}

.crm-container button.ui-button:has(.fa-trash):hover,
.crm-container button.ui-button:has(.fa-trash):focus {
	border-color: var(--crm-btn-cancel-bg-color);
	background: linear-gradient(to top,rgba(0, 0, 0, 0.125),rgba(0, 0, 0, 0.125)) var(--crm-btn-cancel-bg-color);
}

.crm-container button.ui-button:has(.fa-trash):focus {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-btn-cancel-bg-color);
}

.crm-container a.button.crm-popup .fa-trash::before,
.crm-container button.ui-button .fa-trash::before {
	color: var(--crm-btn-cancel-text-color);
}

.crm-container a.button.delete-button,
.crm-container a.button.delete {
	border-color: var(--crm-btn-cancel-bg-color);
}

.crm-container a.button.delete-button:focus,
.crm-container a.button.delete:focus {
	outline: none;
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-btn-cancel-bg-color);
}

.crm-container a.button.delete .fa-trash::before,
.crm-container a.button.delete-button .icon.delete-icon::before {
	color: var(--crm-btn-cancel-text-color);
}

/* Delete-inline button and Soft Credit delete button. */
.crm-container a.crm-hover-button.crm-delete-inline:has(span.icon),
.crm-container a.crm-hover-button.soft-credit-delete-link:has(span.icon) {
	font-weight: 600;
	border-radius: 50%;
	padding-inline: var(--crm-l-radius);
	padding-block: var(--crm-l-xsmall-2);
}

.crm-container a.crm-hover-button.crm-delete-inline:focus-visible,
.crm-container a.crm-hover-button.soft-credit-delete-link:focus-visible {
	box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--crm-danger-color);
}

.crm-container a.crm-hover-button.crm-delete-inline .icon.delete-icon,
.crm-container a.crm-hover-button.soft-credit-delete-link .icon.delete-icon {
	margin: 0;
}

.crm-container .crm-hover-button.crm-delete-inline:hover .icon.delete-icon,
.crm-container .crm-hover-button.soft-credit-delete-link:hover .icon.delete-icon,
.crm-container a.button.delete-button:hover .icon.delete-icon {
	font-weight: 600;
}

#bootstrap-theme.api4-explorer-page .crm-hover-button:has(.fa-times) {
	margin-left: var(--crm-l-medium);
}

/* Make sure that delete icons are aligned with rest of row. */
.crm-container td:has(> .crm-delete-inline) {
	vertical-align: middle;
}

.crm-container .crm-hover-button.crm-delete-inline:focus .icon.delete-icon,
.crm-container .crm-hover-button.soft-credit-delete-link:focus .icon.delete-icon {
	font-weight: 600;
}

/* APIv4 inline delete button. */
#bootstrap-theme.api4-explorer-page .crm-hover-button:has(.fa-times) {
	font-weight: 600;
	border-radius: 50%;
	padding-inline: var(--crm-l-radius);
	padding-block: var(--crm-l-xsmall);
}

#bootstrap-theme.api4-explorer-page .crm-hover-button:has(.fa-times):focus,
#bootstrap-theme.api4-explorer-page .crm-hover-button:has(.fa-times):focus-visible {
	box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--crm-danger-color);
}

#bootstrap-theme.api4-explorer-page .crm-hover-button:has(.fa-times):active,
#bootstrap-theme.api4-explorer-page .crm-hover-button:has(.fa-times):hover,
#bootstrap-theme.api4-explorer-page .crm-hover-button:has(.fa-times):focus,
#bootstrap-theme.api4-explorer-page .crm-hover-button:has(.fa-times):focus-visible,
#bootstrap-theme.api4-explorer-page .crm-hover-button:has(.fa-times):active .fa-times,
#bootstrap-theme.api4-explorer-page .crm-hover-button:has(.fa-times):hover .fa-times,
#bootstrap-theme.api4-explorer-page .crm-hover-button:has(.fa-times):focus .fa-times,
#bootstrap-theme.api4-explorer-page .crm-hover-button:has(.fa-times):focus-visible .fa-times {
	font-weight: 600;
	color: var(--crm-danger-color);
	background: transparent;
}



/*
------------------------------------------------------------------------------------------
Secondary buttons.
------------------------------------------------------------------------------------------
*/

:root,
body.admin-color-fresh,
body.admin-color-light,
body.admin-color-modern,
body.admin-color-blue,
body.admin-color-coffee,
body.admin-color-ectoplasm,
body.admin-color-midnight,
body.admin-color-ocean,
body.admin-color-sunrise {
	--crm-wp-button-secondary-bg: transparent;
	--crm-wp-button-secondary-bg-hover: rgba(var(--wp-admin-theme-color--rgb), 0.04);

	--crm-wp-button-secondary-color: var(--wp-admin-theme-color);
	--crm-wp-button-secondary-color-hover: var(--crm-wp-button-secondary-color);
	--crm-wp-button-secondary-color-focus: var(--crm-wp-button-secondary-color);

	--crm-wp-button-secondary-border: var(--crm-wp-button-secondary-color);
	--crm-wp-button-secondary-border-hover: var(--crm-wp-button-secondary-bg-hover);
	--crm-wp-button-secondary-border-focus: var(--crm-wp-button-secondary-border);
	--crm-wp-button-secondary-border-width-focus: var(--wp-admin-border-width-focus);

	--crm-wp-button-secondary-box-focus: var(--crm-wp-button-secondary-border-focus);
}





.crm-container .crm-button.btn-secondary:not(.btn, .dropdown-toggle),
.crm-container button#ceo-feature-image-switcher,
.crm-container button.crm-button-type-cancel,
.crm-container button.crm-button-type-back,
.crm-container button.crm-button.cancel,
/* Cancel button on "New Case Type" and "Edit Case Type" screens. */
.crm-container .crmCaseType button[crm-icon="fa-times"],
.crm-form-submit .cancel.crm-button,
.crm-container button.ui-button:has(.fa-times, .fa-th-list, .fa-pencil) {
	background: var(--crm-wp-button-secondary-bg);
	border: 1px solid var(--crm-wp-button-secondary-border);
	color: var(--crm-wp-button-secondary-color);
	min-height: var(--crm-wp-btn-height);
}

.crm-container .crm-button.btn-secondary:not(.btn, .dropdown-toggle):hover,
.crm-container button#ceo-feature-image-switcher:hover,
.crm-container button.crm-button-type-cancel:hover,
.crm-container button.crm-button-type-back:hover,
.crm-container button.crm-button.cancel:hover,
.crm-container .crmCaseType button[crm-icon="fa-times"]:hover,
.crm-container button.ui-button:has(.fa-times, .fa-th-list, .fa-pencil):hover {
	background: var(--crm-wp-button-secondary-bg-hover);
	border-color: var(--crm-wp-button-secondary-color-hover);
	color: var(--crm-wp-button-secondary-color-hover);
}

.crm-container .crm-button.btn-secondary:not(.btn, .dropdown-toggle):focus,
.crm-container button#ceo-feature-image-switcher:focus,
.crm-container button.crm-button-type-cancel:focus,
.crm-container button.crm-button-type-back:focus,
.crm-container button.crm-button.cancel:focus,
.crm-container .crmCaseType button[crm-icon="fa-times"]:focus,
.crm-container button.ui-button:has(.fa-times, .fa-th-list, .fa-pencil):focus {
	background: var(--crm-wp-button-secondary-bg);
	border-color: var(--crm-wp-button-secondary-border-focus);
	box-shadow: 0 0 0 var(--crm-wp-button-secondary-border-width-focus, 1.5px) var(--crm-wp-button-secondary-box-focus);
	color: var(--crm-wp-button-secondary-color-focus);
	outline: 2px solid transparent;
	outline-offset: 0;
}

.crm-container .crm-button.btn-secondary:not(.btn, .dropdown-toggle):active,
.crm-container button#ceo-feature-image-switcher:active,
.crm-container button.crm-button-type-cancel:active,
.crm-container button.crm-button-type-back:active,
.crm-container button.crm-button.cancel:active,
.crm-container .crmCaseType button[crm-icon="fa-times"]:active,
.crm-container button.ui-button:has(.fa-times, .fa-th-list, .fa-pencil):active {
	background: var(--crm-wp-button-secondary-bg);
}

/* Misc cancel buttons. */
.crm-container button.crm-button.cancel .fa-times,
.crm-container .crmCaseType button[crm-icon="fa-times"] .fa-times,
.crm-container button.crm-button-type-cancel .fa-times {
	color: var(--crm-wp-button-secondary-color-focus);
}



/* Broken "Find Contacts" button in "Dedupe Exceptions" screen. */
.crm-container button.crm-button.filtercontacts span {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
}



/*
------------------------------------------------------------------------------------------
Other buttons.
------------------------------------------------------------------------------------------
*/

/* Table row buttons. */
.crm-container .crm-hover-button:hover,
.crm-container a.crm-hover-button:hover
.crm-container a.crm-hover-button:active {
	box-shadow: none;
}

/* Table pencil buttons. */
.crm-container a.crm-hover-button.action-item:has(.fa-pencil) {
	padding-inline: var(--crm-l-radius);
	padding-block: var(--crm-l-xsmall-2);
	border-radius: 50%;
}

/* Table expand row buttons. */
.crm-container a.crm-expand-row {
	padding-inline: var(--crm-l-radius);
	border-radius: 50%;
}

.crm-container a.crm-expand-row:focus {
	box-shadow: none;
}

.crm-container a.crm-expand-row:focus-visible {
	color: var(--wp-admin-theme-color);
	box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color);
}

/* Not sure why this icon is floated, but it trashes the box shadow. Remove it. */
.crm-container a.expanded::before,
.crm-container a.crm-expand-row.expanded::before {
	float: none;
}



/* Wrench hover button in e.g. Contributions table action items. */
.crm-container .crm-hover-button:has(.crm-i.fa-wrench) {
	padding-inline: var(--crm-l-radius);
	padding-block: var(--crm-l-xsmall-2);
	margin-inline: var(--crm-l-radius);
	border-radius: 50%;
}

/* Wrench hover button in multiple radio options. */
.crm-container .crm-multiple-checkbox-radio-options .crm-hover-button:has(.crm-i.fa-wrench) {
	padding-block: var(--crm-l-xsmall);
}


/* Contributions table action items. */
.crm-container .crm-hover-button:has(.crm-i) {
}

.crm-container .crm-hover-button:has(.crm-i):hover,
.crm-container .crm-hover-button:has(.crm-i):focus {
	text-decoration: underline;
}
.crm-container .crm-hover-button:has(.crm-i):focus {
	text-decoration: none;
}

.crm-container .crm-hover-button:has(.crm-i):hover .crm-i,
.crm-container .crm-hover-button:has(.crm-i):focus .crm-i {
	color: var(--crm-wp-button-primary-bg);
	font-weight: 600;
}



/* jQuery UI "spinner" up/down arrows to the right of numbers, e.g. "Rows per page". */
.crm-container .ui-spinner a.ui-spinner-button {
	line-height: 1.6;
}



/* Table navigation buttons. */
.crm-container .crm-pager-nav a.crm-hover-button {
	--crm-btn-padding-block: 6px;
}

.crm-container .crm-pager-nav a.crm-hover-button:focus,
.crm-container .crm-pager-nav a.crm-hover-button:focus-visible {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-secondary-color);
}



/* Inline editing buttons. */
.crm-editable-editing form.crm-editable-form button:has(.fa-check),
.crm-editable-editing form.crm-editable-form button:has(.fa-times) {
	min-height: 0;
	background: transparent;
	border: none;
	font-size: 120%;
	opacity: 0.7;
}

.crm-editable-editing form.crm-editable-form button:has(.fa-check):hover,
.crm-editable-editing form.crm-editable-form button:has(.fa-check):focus,
.crm-editable-editing form.crm-editable-form button:has(.fa-times):hover,
.crm-editable-editing form.crm-editable-form button:has(.fa-times):focus {
	opacity: 1.0;
	background: transparent;
}

.crm-editable-editing form.crm-editable-form button:has(.fa-check):hover {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-success-color);
}

.crm-editable-editing form.crm-editable-form button:has(.fa-times):hover {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-danger-color);
}

.crm-editable-editing form.crm-editable-form button:has(.fa-check) .crm-i,
.crm-editable-editing form.crm-editable-form button:has(.fa-times) .crm-i {
	padding: var(--crm-l-xsmall);
}



/* Apply correct state to "crm-submit-buttons". */
.crm-container .crm-submit-buttons a:hover .crm-i {
	font-weight: 600;
}

/* Apply correct style to "Delete" buttons in "crm-submit-buttons". */
.crm-container .crm-submit-buttons a:has(.fa-trash) {
	background: var(--crm-btn-cancel-bg-color);
	border-color: var(--crm-btn-cancel-bg-color);
	color: var(--crm-btn-cancel-text-color);
}

.crm-container .crm-submit-buttons a:has(.fa-trash):hover,
.crm-container .crm-submit-buttons a:has(.fa-trash):focus {
	border-color: var(--crm-btn-cancel-bg-color);
	background: linear-gradient(to top,rgba(0, 0, 0, 0.125),rgba(0, 0, 0, 0.125)) var(--crm-btn-cancel-bg-color);
}

.crm-container .crm-submit-buttons a:has(.fa-trash):focus {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-btn-cancel-bg-color);
}



/* Apply style to "Help spread the word" buttons. */
.crm-container .crm-socialnetwork button {
	margin-right: var(--crm-l-medium);
}



/* Delete button on "A/B Testing" wizard. */
.crm-container button[crm-icon="fa-trash"].crm-button:has(.fa-trash) {
	background: var(--crm-btn-cancel-bg-color);
	border-color: var(--crm-btn-cancel-bg-color);
	color: var(--crm-btn-cancel-text-color);
}

.crm-container button[crm-icon="fa-trash"].crm-button:has(.fa-trash):hover,
.crm-container button[crm-icon="fa-trash"].crm-button:has(.fa-trash):focus {
	border-color: var(--crm-btn-cancel-bg-color);
	background: linear-gradient(to top,rgba(0, 0, 0, 0.125),rgba(0, 0, 0, 0.125)) var(--crm-btn-cancel-bg-color);
}

.crm-container button[crm-icon="fa-trash"].crm-button:has(.fa-trash):focus {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-btn-cancel-bg-color);
}

.crm-container button[crm-icon="fa-trash"].crm-button .fa-trash::before {
	color: var(--crm-btn-cancel-text-color);
}

/* Previous button on "A/B Testing" wizard. */
.crm-container .crm-wizard button[crm-icon="fa-chevron-left"] {
	margin-right: var(--crm-flex-gap);
}

/* Next button on "A/B Testing" wizard. */
.crm-container .crm-wizard button[crm-icon="fa-chevron-right"] {
	margin-right: auto;
}

/* Standalone wrench on "A/B Testing" wizard. */
.crm-container .crm-hover-button:has(.crm-i.fa-wrench):hover {
	text-decoration: none;
}



/* Icon Picker button. */
.crm-container .ui-button.crm-icon-picker-button {
	height: var(--crm-wp-btn-height);
	margin-right: var(--crm-l-small);
}

.crm-container .ui-button.crm-icon-picker-button:focus {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-primary-hover-color);
}

.crm-container .ui-button.crm-icon-picker-button .crm-i {
	height: 18px;
}

.crm-container .ui-button.crm-icon-picker-button:focus .crm-i {
	color: #fff;
}



/* Sometimes "Done" buttons have .fa-times icon. */
.crm-container .action-link a.button:has(.fa-times) .crm-i.fa-times,
.crm-container .action-link a.button.cancel .crm-i.fa-times {
	color: #fff;
}



/* Contact Layout Editor "Layout: ContactType" button. */
.crm-container .crm-contact-summary-edit-layout a.crm-hover-button:hover {
	text-decoration: none;
}

.crm-container .crm-contact-summary-edit-layout a.crm-hover-button:focus-visible {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-secondary-color);
}

.crm-container .crm-contact-summary-edit-layout a.crm-hover-button .crm-i::before {
	color: var(--crm-primary-text-color);
}

.crm-container .crm-contact-summary-edit-layout a.crm-hover-button:hover .crm-i::before {
	color: var(--crm-primary-text-color);
}



/* Credit Card buttons. */
.crm-container .crm-credit_card_type-icons a {
	padding: var(--crm-l-xsmall) var(--crm-l-radius);
	border-radius: 6px;
}



/* Fix "Contacts in this Group" link. */
.CRM_Group_Form_Edit .action-link a {
	padding: var(--crm-l-radius);
	margin-left: var(--crm-l-reg);
}

.CRM_Group_Form_Edit .action-link a:focus-visible .crm-i {
	color: var(--crm-secondary-color);
}



/* Legacy Custom Searches don't need two "Submit" buttons. */
#Custom.crm-search-form .crm-submit-buttons:has(+ table) {
	display: none;
}



/* Prevent action buttons from being italicised in disabled table rows. */
.crm-container tr.disabled a.crm-hover-button.action-item,
.crm-container tr.disabled .more-panel.crm-hover-button {
	font-style: normal;
}



/*
------------------------------------------------------------------------------------------
Bootstrap buttons.
------------------------------------------------------------------------------------------
*/

/* Primary buttons. */
#bootstrap-theme .btn.btn-primary {
	background: var(--crm-wp-button-primary-bg);
	border: 1px solid var(--crm-wp-button-primary-border);
	color: var(--crm-wp-button-primary-color);
	min-height: 0;
}

#bootstrap-theme .btn.btn-primary:hover,
#bootstrap-theme .btn.btn-primary:focus {
	background: var(--crm-wp-button-primary-bg-hover);
	border-color: var(--crm-wp-button-primary-border-hover);
	color: var(--crm-wp-button-primary-color-hover);
}

#bootstrap-theme .btn.btn-primary:focus {
	outline: none;
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-wp-button-primary-bg);
}



/* Standard size buttons with text. */
#bootstrap-theme .btn:not(.btn-xs):focus-visible .crm-i {
	color: var(--crm-primary-text-color);
}

/* Some buttons don't make their icon bold on hover. */
#bootstrap-theme .btn-xs:hover i.crm-i,
#bootstrap-theme .btn-sm:hover i.crm-i {
	font-weight: 600;
}

/* Fix input-group. */
#bootstrap-theme .input-group-btn {
	display: inline-flex;
	max-width: fit-content;
	align-items: center;
	gap: 0;
}

/* Fix button-group gap. */
#bootstrap-theme .btn-group > a.btn {
	z-index: 2;
}

#bootstrap-theme .btn-group .btn + .btn.dropdown-toggle {
	z-index: 1;
}

#bootstrap-theme .btn-group .btn + .btn.dropdown-toggle:focus {
	border-left-color: var(--crm-primary-hover-color);
	z-index: 3;
}

/* "Settings Wheel" icon focus. */
#bootstrap-theme .btn-group .btn:has(.fa-gear).dropdown-toggle:focus .crm-i {
	color: var(--crm-wp-button-primary-bg);
}

/* Fix search display icon alignment. */
#bootstrap-theme .crm-search-display-control {
	top: 15%;
}

#bootstrap-theme .btn-xs,
#bootstrap-theme .btn-group-xs > .btn {
	height: var(--crm-btn-height);
}

/* Remove default focus properties. */
#bootstrap-theme .btn:focus {
	outline: none;
	outline-offset: 0;
}



/* Bootstrap standard button. */
#bootstrap-theme .btn:focus-visible,
#bootstrap-theme .btn.btn-default:focus-visible {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-secondary-color);
	outline: none;
	outline-offset: 0;
}



/* Bootstrap "success" button focus state. */
#bootstrap-theme .btn.btn-success:focus-visible {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-btn-success-bg-color);
	outline: none;
	outline-offset: 0;
}



/* Bootstrap delete button. */
#bootstrap-theme .btn.btn-danger:focus-visible {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-btn-danger-bg-color);
	outline: none;
	outline-offset: 0;
}

/* Bootstrap delete button without text. */
#bootstrap-theme button.btn-xs:has(.fa-trash),
#bootstrap-theme button.btn-xs:has(.fa-trash):hover,
#bootstrap-theme .btn-sm:has(.fa-trash),
#bootstrap-theme .btn-sm:has(.fa-trash):hover {
	background-color: transparent;
}

/* Bootstrap delete button without text focussed. */
#bootstrap-theme .btn-sm:has(.fa-trash):focus,
#bootstrap-theme .btn-sm:has(.fa-trash):focus-visible,
#bootstrap-theme button.btn-xs:has(.fa-trash):focus,
#bootstrap-theme button.btn-xs:has(.fa-trash):focus-visible,
#bootstrap-theme.crm-search button.btn-xs:has(.fa-trash):focus,
#bootstrap-theme.crm-search button.btn-xs:has(.fa-trash):focus-visible,
#bootstrap-theme.crm-search .panel button.btn-xs.btn-danger-outline:has(.fa-trash):focus,
#bootstrap-theme.crm-search .panel button.btn-xs.btn-danger-outline:has(.fa-trash):focus-visible {
	background-color: transparent;
	box-shadow: 0 0 0 2px var(--crm-danger-color);
}

/* Bootstrap delete button in SearchKit "Select Fields" section. */
#bootstrap-theme.crm-search .crm-draggable button.btn-xs:has(i.crm-i.fa-times) {
	background: transparent;
}

#bootstrap-theme.crm-search .crm-draggable button.btn-xs:has(i.crm-i.fa-times):hover {
	font-weight: 600;
}

#bootstrap-theme.crm-search .crm-draggable button.btn-xs:has(i.crm-i.fa-times):focus,
#bootstrap-theme.crm-search .crm-draggable button.btn-xs:has(i.crm-i.fa-times):focus-visible {
	font-weight: 600;
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-btn-danger-bg-color);
	outline: none;
	outline-offset: 0;
}

/* Bootstrap delete button in SearchKit clauses. */
#bootstrap-theme .btn-group-xs > .btn.btn-danger-outline {
	background: transparent;
	padding: 0;
}

#bootstrap-theme .btn-group-xs > .btn.btn-danger-outline:hover {
	font-weight: 600;
}

#bootstrap-theme .btn-group-xs > .btn.btn-danger-outline:focus,
#bootstrap-theme .btn-group-xs > .btn.btn-danger-outline:focus-visible {
	font-weight: 600;
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-btn-danger-bg-color);
	outline: none;
	outline-offset: 0;
}



/* Bootstrap buttons in Campaign Dashboard table. */
#bootstrap-theme a.btn.btn-xs.btn-default .crm-i::before,
#bootstrap-theme a.btn.btn-xs.btn-danger .crm-i::before {
	color: var(--crm-primary-text-color);
}



/* Bootstrap inline edit buttons in tables. */
#bootstrap-theme button.btn.btn-xs.btn-success .crm-i::before,
#bootstrap-theme button.btn.btn-xs.btn-danger .crm-i::before {
	color: var(--crm-primary-text-color);
}



/* Bootstrap "remove" button in SearchKit layouts. */
#bootstrap-theme .crm-draggable .btn.btn-xs:has(.fa-ban) {
	background: transparent;
	padding: 0;
	color: var(--crm-danger-color);
}

#bootstrap-theme .crm-draggable .btn.btn-xs:has(.fa-ban):hover {
	font-weight: 600;
}

#bootstrap-theme .crm-draggable .btn.btn-xs:has(.fa-ban):focus,
#bootstrap-theme .crm-draggable .btn.btn-xs:has(.fa-ban):focus-visible {
	font-weight: 600;
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--crm-btn-danger-bg-color);
	outline: none;
	outline-offset: 0;
}



/* Bootstrap "remove" button in SearchKit draggable fieldsets. */
/* Some SearchKit draggable fieldsets have "details" elements. */
#bootstrap-theme .crm-search-admin-edit-columns fieldset.crm-draggable:has(> details) .btn.btn-xs.pull-right {
	top: var(--crm-accordion-header-padding);
	margin: 0;
}

/* The ones that do not need different "top" declarations. */
#bootstrap-theme .crm-search-admin-edit-columns fieldset.crm-draggable:has(> .form-inline) .btn.btn-xs.pull-right {
	top: -1rem;
	margin: 0;
}

/* Give "View Display" button some room. */
#bootstrap-theme .btn-group.crm-search-admin-display-header-links {
	margin-bottom: var(--crm-l-medium);
}