/**
 * WooCommerce Buttons
 *
 * Button styles for account pages and WooCommerce elements
 *
 * @package BadassNetwork
 */

/* ==========================================================================
   BUTTONS - Account Page Specific
   Override components.css with higher specificity for account pages
   ========================================================================== */

/* Account page button overrides - these match the original HTML mockup */
/* Use high specificity to override any .entry-content a link styles */
body.woocommerce-account .btn,
body.woocommerce-account a.btn,
body.woocommerce-account button.btn,
body.woocommerce-account .entry-content a.btn,
body.woocommerce-account .woocommerce-MyAccount-content a.btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 24px;
    font-family: var(--font-main);
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-decoration: none;
    border: 3px solid var(--color-border);
    border-bottom: 3px solid var(--color-border); /* Explicit reset */
    cursor: pointer;
    transition: all 0.15s ease;
}

body.woocommerce-account .btn-primary,
body.woocommerce-account a.btn-primary,
body.woocommerce-account .entry-content a.btn-primary {
    background: var(--color-electric);
    color: white;
    box-shadow: var(--shadow-sm);
}

body.woocommerce-account .btn-primary:hover,
body.woocommerce-account a.btn-primary:hover,
body.woocommerce-account .entry-content a.btn-primary:hover {
    transform: translate(2px, 2px);
    box-shadow: 1px 1px 0 var(--color-border);
    text-decoration: none;
    color: white;
    background: var(--color-electric);
}

body.woocommerce-account .btn-secondary,
body.woocommerce-account a.btn-secondary,
body.woocommerce-account .entry-content a.btn-secondary {
    background: var(--color-bg);
    color: var(--color-text);
    box-shadow: var(--shadow-sm);
}

body.woocommerce-account .btn-secondary:hover,
body.woocommerce-account a.btn-secondary:hover,
body.woocommerce-account .entry-content a.btn-secondary:hover {
    background: var(--color-sun);
    transform: translate(2px, 2px);
    box-shadow: 1px 1px 0 var(--color-border);
    text-decoration: none;
    color: var(--color-text);
}

body.woocommerce-account .btn-small,
body.woocommerce-account a.btn-small,
body.woocommerce-account .entry-content a.btn-small {
    padding: 8px 14px;
    font-size: 11px;
}

/* ==========================================================================
   WOOCOMMERCE BUTTON OVERRIDES
   ========================================================================== */

.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button,
body.woocommerce-account .entry-content a.button,
body.woocommerce-account .entry-content a.woocommerce-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-md) var(--space-2xl);
    font-family: var(--font-main);
    font-size: var(--text-sm);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-decoration: none;
    border: 3px solid var(--color-border);
    border-bottom: 3px solid var(--color-border); /* Explicit reset */
    cursor: pointer;
    transition: all 0.15s ease;
    background: var(--color-electric);
    color: white;
    box-shadow: var(--shadow);
}

.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button:hover,
body.woocommerce-account .entry-content a.button:hover,
body.woocommerce-account .entry-content a.woocommerce-button:hover {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0 var(--color-border);
    text-decoration: none;
    color: white;
}

.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce a.button.alt {
    background: var(--color-hot);
}

/* ==========================================================================
   TABLE ACTION BUTTONS
   ========================================================================== */

/* Table action buttons (View, Cancel, etc.) - styled as secondary/small */
body.woocommerce-account table.shop_table a.button,
body.woocommerce-account table.shop_table a.woocommerce-button,
body.woocommerce-account .woocommerce-orders-table a.button,
body.woocommerce-account .entry-content table a.button {
    background: var(--color-bg);
    color: var(--color-text);
    box-shadow: var(--shadow-sm);
    padding: 8px 14px;
    font-size: 11px;
}

body.woocommerce-account table.shop_table a.button:hover,
body.woocommerce-account table.shop_table a.woocommerce-button:hover,
body.woocommerce-account .woocommerce-orders-table a.button:hover,
body.woocommerce-account .entry-content table a.button:hover {
    background: var(--color-sun);
    color: var(--color-text);
    transform: translate(2px, 2px);
    box-shadow: 1px 1px 0 var(--color-border);
    text-decoration: none;
}