/*
 * Global button style — single source of truth for the "soft & modern"
 * button treatment (rounded corners, soft shadow, hover lift) used
 * across the whole app. Edit this file only — do not re-add button
 * polish rules to style.css/custom.css.
 *
 * Note: style.css has a blanket `.btn, .btn:focus { box-shadow: 0 0 0 0em
 * ... !important; outline: none !important; }` rule that zeroes out any
 * shadow/outline on bootstrap-based buttons. Every shadow/outline value
 * below carries !important to win against that rule.
 *
 * Scope: solid/outline CTA buttons that a user clicks to perform an
 * action (save, cancel, filter, print, delete, etc). Status/state
 * badges (.status-btn) and small icon-only utility controls (close,
 * remove-row, square icon toggles) are a different UI category and are
 * intentionally left out — forcing them into this same mould would
 * break their compact badge/icon look.
 */

/* Buttons that sit inline with a 40px input and must match it exactly */
.theme-btn,
.btn-primary,
.cancel-btn,
.border-btn,
.save-btn,
.payment-btn,
.btn-danger,
.btn-outline-danger,
.btn-success,
.btn-category,
.btn-brand,
.btn-search {
    height: var(--control-height) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Every CTA button in the app shares the same corner radius + transition */
.theme-btn,
.btn-primary,
.cancel-btn,
.border-btn,
.save-btn,
.payment-btn,
.btn-danger,
.btn-outline-danger,
.btn-success,
.custom-print-btn,
.btn-category,
.btn-brand,
.add-order-btn,
.download-file-btn,
.process-csv-btn,
.verify-btn,
.btn-custom-warning,
.delete-pop-btn,
.add-feature-btn,
.plan-buy-btn,
.copy-link-btn,
.role-reset-btn,
.discount-btn,
.request-domain-btn,
.save-publish-btn {
    border-radius: var(--btn-radius) !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease,
        background-color 0.15s ease, color 0.15s ease, opacity 0.15s ease;
}

/* Solid (filled) buttons get a soft resting shadow and lift on hover */
.theme-btn,
.btn-primary,
.save-btn,
.payment-btn,
.btn-danger,
.btn-success,
.custom-print-btn,
.btn-category,
.btn-brand,
.btn-search,
.add-order-btn,
.download-file-btn,
.process-csv-btn,
.verify-btn,
.btn-custom-warning,
.delete-pop-btn,
.add-feature-btn {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
}

.theme-btn:hover,
.btn-primary:hover,
.save-btn:hover,
.payment-btn:hover,
.btn-danger:hover,
.btn-success:hover,
.custom-print-btn:hover,
.btn-category:hover,
.btn-brand:hover,
.btn-search:hover,
.add-order-btn:hover,
.download-file-btn:hover,
.process-csv-btn:hover,
.verify-btn:hover,
.btn-custom-warning:hover,
.delete-pop-btn:hover,
.add-feature-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.16) !important;
}

/* The main brand action gets a warmer, colour-matched hover glow */
.theme-btn:hover,
.btn-primary:hover,
.payment-btn:hover,
.btn-category:hover,
.btn-search:hover,
.verify-btn:hover,
.btn-custom-warning:hover,
.delete-pop-btn:hover,
.add-feature-btn:hover {
    box-shadow: 0 8px 18px rgba(var(--clr-primary-rgb), 0.35) !important;
}

.theme-btn:active,
.btn-primary:active,
.save-btn:active,
.payment-btn:active,
.btn-danger:active,
.btn-success:active,
.custom-print-btn:active,
.btn-category:active,
.btn-brand:active,
.btn-search:active,
.add-order-btn:active,
.download-file-btn:active,
.process-csv-btn:active,
.verify-btn:active,
.btn-custom-warning:active,
.delete-pop-btn:active,
.add-feature-btn:active {
    transform: translateY(0);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}

/* Outline buttons stay flat at rest, lift gently once filled on hover */
.cancel-btn:hover,
.border-btn:hover,
.btn-outline-danger:hover,
.plan-buy-btn:hover,
.copy-link-btn:hover,
.role-reset-btn:hover,
.discount-btn:hover,
.request-domain-btn:hover,
.save-publish-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12) !important;
}

.cancel-btn:active,
.border-btn:active,
.btn-outline-danger:active,
.plan-buy-btn:active,
.copy-link-btn:active,
.role-reset-btn:active,
.discount-btn:active,
.request-domain-btn:active,
.save-publish-btn:active {
    transform: translateY(0);
    box-shadow: none !important;
}

.theme-btn:disabled,
.btn-primary:disabled,
.cancel-btn:disabled,
.border-btn:disabled,
.save-btn:disabled,
.payment-btn:disabled,
.btn-danger:disabled,
.btn-outline-danger:disabled,
.btn-success:disabled,
.btn-category:disabled,
.btn-brand:disabled,
.btn-search:disabled,
.add-order-btn:disabled,
.download-file-btn:disabled,
.process-csv-btn:disabled,
.verify-btn:disabled,
.btn-custom-warning:disabled,
.delete-pop-btn:disabled,
.add-feature-btn:disabled,
.plan-buy-btn:disabled,
.copy-link-btn:disabled,
.role-reset-btn:disabled,
.discount-btn:disabled,
.request-domain-btn:disabled,
.save-publish-btn:disabled {
    opacity: 0.6;
    transform: none !important;
    box-shadow: none !important;
    cursor: not-allowed;
}

.theme-btn:focus-visible,
.btn-primary:focus-visible,
.cancel-btn:focus-visible,
.border-btn:focus-visible,
.save-btn:focus-visible,
.payment-btn:focus-visible,
.btn-danger:focus-visible,
.btn-outline-danger:focus-visible,
.btn-success:focus-visible,
.btn-category:focus-visible,
.btn-brand:focus-visible,
.btn-search:focus-visible,
.add-order-btn:focus-visible,
.download-file-btn:focus-visible,
.process-csv-btn:focus-visible,
.verify-btn:focus-visible,
.btn-custom-warning:focus-visible,
.delete-pop-btn:focus-visible,
.add-feature-btn:focus-visible,
.plan-buy-btn:focus-visible,
.copy-link-btn:focus-visible,
.role-reset-btn:focus-visible,
.discount-btn:focus-visible,
.request-domain-btn:focus-visible,
.save-publish-btn:focus-visible {
    outline: 2px solid rgba(var(--clr-primary-rgb), 0.5) !important;
    outline-offset: 2px;
}

/* Table row "..." action trigger — friendlier hover feedback */
/* Action column 3-dots: centered in the cell on every list */
.table-action button {
    border-radius: 50%;
    width: 32px;
    height: 32px;
    margin: 0 auto;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.table-action button:hover {
    background-color: rgba(var(--clr-primary-rgb), 0.1);
    color: var(--clr-primary);
}