:root {
    --argus-button-primary: #46627f;
    --argus-button-primary-hover: #3b536d;
    --argus-button-primary-pressed: #31465d;
    --argus-button-text: #172033;
    --argus-button-muted: #64748b;
    --argus-button-border: #cbd5e1;
    --argus-button-secondary-hover: #f1f5f9;
    --argus-button-danger: #b42318;
    --argus-button-danger-hover: #8f1d14;
    --argus-button-danger-soft: #fff3f2;
    --argus-button-focus: #2563eb;
}

:where(
    button:not(.btn-close):not(.sidebar-toggle):not(.close-sidebar):not(.password-toggle):not(.receipt-add-button),
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    .btn,
    .app-btn,
    .btn-table,
    .text-btn,
    a[class$="-button"],
    a[class*="-button "],
    a[class$="-btn"],
    a[class*="-btn "]
) {
    min-height: 40px !important;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 9px 16px !important;
    color: var(--argus-button-text);
    background: #ffffff;
    border: 1px solid var(--argus-button-border);
    border-radius: 6px !important;
    box-shadow: none !important;
    font-family: inherit;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
    text-align: center;
    text-decoration: none !important;
    vertical-align: middle;
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
    appearance: none;
    cursor: pointer;
    transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
}

:where(
    button:not(.btn-close):not(.sidebar-toggle):not(.close-sidebar):not(.password-toggle):not(.receipt-add-button),
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    .btn,
    .app-btn,
    .btn-table,
    .text-btn,
    a[class$="-button"],
    a[class*="-button "],
    a[class$="-btn"],
    a[class*="-btn "]
):hover {
    color: var(--argus-button-text);
    background: var(--argus-button-secondary-hover);
    border-color: #94a3b8;
    text-decoration: none !important;
}

:where(
    button,
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    .btn,
    .app-btn,
    .btn-table,
    .text-btn,
    a[class$="-button"],
    a[class*="-button "],
    a[class$="-btn"],
    a[class*="-btn "],
    .custom-modal-close
):focus-visible {
    outline: 2px solid var(--argus-button-focus) !important;
    outline-offset: 2px !important;
    box-shadow: none !important;
}

:where(
    button:not(.btn-close):not(.sidebar-toggle):not(.close-sidebar):not(.password-toggle):not(.receipt-add-button),
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    .btn,
    .app-btn,
    .btn-table,
    .text-btn,
    a[class$="-button"],
    a[class*="-button "],
    a[class$="-btn"],
    a[class*="-btn "]
):active {
    transform: none !important;
}

.btn-primary,
.btn-success,
.btn-warning,
.app-btn-primary,
.app-btn-primary-small,
.btn-blue,
.btn-blue-small,
.btn-green,
.btn-green-2,
.receipt-save-button,
.receipt-modal-submit,
.receipt-duplicate-confirm,
.receipt-order-confirm-button,
.receipt-action-primary,
.receipt-search-button,
.receipt-client-search-button,
.receipt-order-button,
.cash-withdraw-button,
.cash-modal-submit,
.dealer-report-build,
.shipment-sticker__ship-button,
.supplement-editor-save,
.verification-confirm-button,
.login-submit,
.create-order-submit,
.select-order-for-receipt,
.attach-stock-door,
.receipt-add-button {
    color: #ffffff !important;
    background: var(--argus-button-primary) !important;
    border-color: var(--argus-button-primary) !important;
}

.btn-primary:hover,
.btn-primary:focus-visible,
.btn-success:hover,
.btn-success:focus-visible,
.btn-warning:hover,
.btn-warning:focus-visible,
.app-btn-primary:hover,
.app-btn-primary-small:hover,
.btn-blue:hover,
.btn-blue-small:hover,
.btn-green:hover,
.btn-green-2:hover,
.receipt-save-button:hover,
.receipt-save-button:focus-visible,
.receipt-modal-submit:hover,
.receipt-modal-submit:focus-visible,
.receipt-duplicate-confirm:hover,
.receipt-duplicate-confirm:focus-visible,
.receipt-order-confirm-button:hover,
.receipt-order-confirm-button:focus-visible,
.receipt-action-primary:hover,
.receipt-action-primary:focus-visible,
.receipt-search-button:hover,
.receipt-search-button:focus-visible,
.receipt-client-search-button:hover,
.receipt-client-search-button:focus-visible,
.receipt-order-button:hover,
.receipt-order-button:focus-visible,
.cash-withdraw-button:hover,
.cash-withdraw-button:focus-visible,
.cash-modal-submit:hover,
.cash-modal-submit:focus-visible,
.dealer-report-build:hover,
.dealer-report-build:focus-visible,
.shipment-sticker__ship-button:hover,
.shipment-sticker__ship-button:focus-visible,
.supplement-editor-save:hover,
.supplement-editor-save:focus-visible,
.verification-confirm-button:hover,
.verification-confirm-button:focus-visible,
.login-submit:hover,
.login-submit:focus-visible,
.create-order-submit:hover,
.create-order-submit:focus-visible,
.select-order-for-receipt:hover,
.select-order-for-receipt:focus-visible,
.attach-stock-door:hover,
.attach-stock-door:focus-visible,
.receipt-add-button:hover,
.receipt-add-button:focus-visible {
    color: #ffffff !important;
    background: var(--argus-button-primary-hover) !important;
    border-color: var(--argus-button-primary-hover) !important;
}

.btn-primary:active,
.btn-success:active,
.btn-warning:active,
.receipt-save-button:active,
.receipt-modal-submit:active,
.receipt-duplicate-confirm:active,
.receipt-order-confirm-button:active,
.receipt-action-primary:active,
.receipt-search-button:active,
.receipt-client-search-button:active,
.cash-withdraw-button:active,
.cash-modal-submit:active,
.dealer-report-build:active,
.supplement-editor-save:active,
.verification-confirm-button:active,
.login-submit:active,
.create-order-submit:active {
    background: var(--argus-button-primary-pressed) !important;
    border-color: var(--argus-button-primary-pressed) !important;
}

.btn-secondary,
.btn-light,
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-dark,
.btn-outline-success,
.btn-outline-warning,
.app-btn-secondary,
.app-btn-secondary-small,
.receipt-history-load-button,
.receipt-modal-cancel,
.receipt-duplicate-cancel,
.receipt-action-secondary,
.receipt-order-skip-button,
.cash-modal-cancel,
.dealer-report-copy,
.supplement-editor-cancel,
.calendar-nav-button,
.calendar-today-button,
.new-clear-btn,
.js-clear-role-search,
.compact-view-toggle,
.receipt-unassigned-button,
.verification-receipt-button,
.split-receipt-add,
.new-toggle-btn-left,
.new-toggle-btn-right,
.bottom-bar-button {
    color: var(--argus-button-text) !important;
    background: #ffffff !important;
    border-color: var(--argus-button-border) !important;
}

.btn-secondary:hover,
.btn-light:hover,
.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.btn-outline-dark:hover,
.btn-outline-success:hover,
.btn-outline-warning:hover,
.app-btn-secondary:hover,
.app-btn-secondary-small:hover,
.receipt-history-load-button:hover,
.receipt-history-load-button:focus-visible,
.receipt-modal-cancel:hover,
.receipt-modal-cancel:focus-visible,
.receipt-duplicate-cancel:hover,
.receipt-duplicate-cancel:focus-visible,
.receipt-action-secondary:hover,
.receipt-action-secondary:focus-visible,
.receipt-order-skip-button:hover,
.receipt-order-skip-button:focus-visible,
.cash-modal-cancel:hover,
.cash-modal-cancel:focus-visible,
.dealer-report-copy:hover,
.dealer-report-copy:focus-visible,
.supplement-editor-cancel:hover,
.supplement-editor-cancel:focus-visible,
.calendar-nav-button:hover,
.calendar-nav-button:focus-visible,
.calendar-today-button:hover,
.calendar-today-button:focus-visible,
.new-clear-btn:hover,
.new-clear-btn:focus-visible,
.js-clear-role-search:hover,
.js-clear-role-search:focus-visible,
.compact-view-toggle:hover,
.compact-view-toggle:focus-visible,
.receipt-unassigned-button:hover,
.receipt-unassigned-button:focus-visible,
.verification-receipt-button:hover,
.verification-receipt-button:focus-visible,
.split-receipt-add:hover,
.split-receipt-add:focus-visible,
.new-toggle-btn-left:hover,
.new-toggle-btn-left:focus-visible,
.new-toggle-btn-right:hover,
.new-toggle-btn-right:focus-visible,
.bottom-bar-button:hover,
.bottom-bar-button:focus-visible {
    color: var(--argus-button-text) !important;
    background: var(--argus-button-secondary-hover) !important;
    border-color: #94a3b8 !important;
}

.bottom-bar-button.selected-button,
.bottom-bar-button.selected-button:hover,
.bottom-bar-button.selected-button:focus-visible {
    color: #ffffff !important;
    background: var(--argus-button-primary) !important;
    border-color: var(--argus-button-primary) !important;
}

.btn-check:checked + .btn,
.btn-check:checked + .btn:hover,
.btn-check:checked + .btn:focus-visible {
    color: #ffffff !important;
    background: var(--argus-button-primary) !important;
    border-color: var(--argus-button-primary) !important;
    box-shadow: inset 0 0 0 1px var(--argus-button-primary-pressed) !important;
}

.btn-danger {
    color: #ffffff !important;
    background: var(--argus-button-danger) !important;
    border-color: var(--argus-button-danger) !important;
}

.btn-danger:hover,
.btn-danger:focus-visible {
    color: #ffffff !important;
    background: var(--argus-button-danger-hover) !important;
    border-color: var(--argus-button-danger-hover) !important;
}

.btn-outline-danger,
.app-btn-danger,
.app-btn-danger-small,
.btn-red,
.btn-red-small,
.receipt-delete-button,
.remove-split-receipt-field,
.delete-order-btn,
.delete-stock-door,
.detach-stock-door,
.receipt-expense-button,
.cash-expense-button {
    color: var(--argus-button-danger) !important;
    background: #ffffff !important;
    border-color: #f0b8b3 !important;
}

.btn-outline-danger:hover,
.btn-outline-danger:focus-visible,
.app-btn-danger:hover,
.app-btn-danger-small:hover,
.btn-red:hover,
.btn-red-small:hover,
.receipt-delete-button:hover,
.receipt-delete-button:focus-visible,
.remove-split-receipt-field:hover,
.remove-split-receipt-field:focus-visible,
.delete-order-btn:hover,
.delete-order-btn:focus-visible,
.delete-stock-door:hover,
.delete-stock-door:focus-visible,
.detach-stock-door:hover,
.detach-stock-door:focus-visible,
.receipt-expense-button:hover,
.receipt-expense-button:focus-visible,
.cash-expense-button:hover,
.cash-expense-button:focus-visible {
    color: var(--argus-button-danger-hover) !important;
    background: var(--argus-button-danger-soft) !important;
    border-color: #e18b84 !important;
}

.btn-link,
.btn-table,
.text-btn,
.app-btn-table,
.app-btn-table-small,
table .view-client-orders-btn,
table .attach-order-btn,
table .receipt-select-client,
table .select-client-btn,
table .attach-unassigned-receipt-button,
table .stock-select-client,
table .stock-select-order,
table .attach-stock-door,
table .details-stock-door,
table .edit-stock-door,
table .split-receipt-btn,
table .reassign-client-btn {
    min-height: 36px !important;
    padding: 4px 0 !important;
    color: var(--argus-button-primary) !important;
    background: transparent !important;
    border-color: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-align: left;
}

.btn-link:hover,
.btn-link:focus-visible,
.btn-table:hover,
.btn-table:focus-visible,
.text-btn:hover,
.text-btn:focus-visible,
.app-btn-table:hover,
.app-btn-table:focus-visible,
.app-btn-table-small:hover,
.app-btn-table-small:focus-visible,
table .view-client-orders-btn:hover,
table .view-client-orders-btn:focus-visible,
table .attach-order-btn:hover,
table .attach-order-btn:focus-visible,
table .receipt-select-client:hover,
table .receipt-select-client:focus-visible,
table .select-client-btn:hover,
table .select-client-btn:focus-visible,
table .attach-unassigned-receipt-button:hover,
table .attach-unassigned-receipt-button:focus-visible,
table .stock-select-client:hover,
table .stock-select-client:focus-visible,
table .stock-select-order:hover,
table .stock-select-order:focus-visible,
table .attach-stock-door:hover,
table .attach-stock-door:focus-visible,
table .details-stock-door:hover,
table .details-stock-door:focus-visible,
table .edit-stock-door:hover,
table .edit-stock-door:focus-visible,
table .split-receipt-btn:hover,
table .split-receipt-btn:focus-visible,
table .reassign-client-btn:hover,
table .reassign-client-btn:focus-visible {
    color: var(--argus-button-primary-hover) !important;
    background: transparent !important;
    border-color: transparent !important;
    text-decoration: underline !important;
}

.client-search-page .view-client-orders-btn {
    min-height: 36px !important;
    padding: 4px 0 !important;
    color: var(--argus-button-primary) !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    white-space: nowrap;
}

.client-search-page .view-client-orders-btn:hover,
.client-search-page .view-client-orders-btn:focus-visible {
    color: var(--argus-button-primary-hover) !important;
    background: transparent !important;
    text-decoration: underline !important;
}

.btn-sm,
.app-btn-small,
.app-btn-primary-small,
.app-btn-secondary-small,
.app-btn-danger-small,
.app-btn-table-small {
    min-height: 36px !important;
    padding: 7px 12px !important;
    font-size: 0.8125rem !important;
}

.btn-lg {
    min-height: 44px !important;
    padding: 11px 20px !important;
    font-size: 0.9375rem !important;
}

.btn-close,
.sidebar-toggle,
.sidebar .close-sidebar,
.password-toggle,
.custom-modal-close,
.btn-icon {
    display: inline-flex !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    border-radius: 6px !important;
    cursor: pointer;
}

.custom-modal-close,
.close.btn-icon {
    font-size: 1.5rem !important;
    line-height: 1 !important;
}

table :where(button:not(.btn-close), .btn, .app-btn, a[class$="-button"], a[class*="-button "], a[class$="-btn"], a[class*="-btn "]) {
    min-height: 36px !important;
    padding: 7px 10px !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

button.center-button {
    margin-inline: auto !important;
}

.btn-group > .btn:not(:first-child),
.btn-group > .btn-group:not(:first-child) > .btn,
.new-toggle-btn-group > :not(:first-child) {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.btn-group > .btn:not(:last-child),
.btn-group > .btn-group:not(:last-child) > .btn,
.new-toggle-btn-group > :not(:last-child) {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

:where(
    button,
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    .btn,
    .app-btn,
    a[class$="-button"],
    a[class*="-button "],
    a[class$="-btn"],
    a[class*="-btn "]
):disabled,
:where(.btn, .app-btn, a[class$="-button"], a[class*="-button "], a[class$="-btn"], a[class*="-btn "])[aria-disabled="true"] {
    color: var(--argus-button-muted) !important;
    background: #e2e8f0 !important;
    border-color: #cbd5e1 !important;
    opacity: 0.72;
    cursor: not-allowed !important;
    pointer-events: none;
}

:where(button, .btn, .app-btn)[aria-busy="true"] {
    cursor: wait !important;
}

@media (max-width: 768px) {
    :where(
        button:not(.btn-close):not(.sidebar-toggle):not(.close-sidebar):not(.password-toggle):not(.receipt-add-button),
        input[type="button"],
        input[type="submit"],
        input[type="reset"],
        .btn,
        .app-btn,
        .btn-table,
        .text-btn,
        a[class$="-button"],
        a[class*="-button "],
        a[class$="-btn"],
        a[class*="-btn "]
    ) {
        min-height: 44px !important;
        white-space: normal;
        overflow-wrap: normal;
        word-break: normal;
    }

    .btn-sm,
    .app-btn-small,
    .app-btn-primary-small,
    .app-btn-secondary-small,
    .app-btn-danger-small,
    .app-btn-table-small,
    .btn-link,
    .btn-table,
    .text-btn,
    .app-btn-table {
        min-height: 44px !important;
    }

    .btn-close,
    .sidebar-toggle,
    .sidebar .close-sidebar,
    .password-toggle,
    .custom-modal-close,
    .btn-icon {
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
    }

    table :where(button:not(.btn-close), .btn, .app-btn, a[class$="-button"], a[class*="-button "], a[class$="-btn"], a[class*="-btn "]) {
        min-height: 44px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    :where(button, input[type="button"], input[type="submit"], input[type="reset"], .btn, .app-btn, .btn-table, .text-btn) {
        transition: none !important;
    }
}
