/**
 * GR Reserve - My Account UI/UX Improvements
 * Version: 1.0.0
 * Description: Gold-branded styling for WooCommerce My Account pages.
 *              Replaces all browser-default blue accents with GR Reserve
 *              brand gold, polishes buttons, forms, tables, and navigation.
 *
 * Brand Palette:
 *   Gold Light:  #ECD67E
 *   Gold Dark:   #C5A84A
 *   Black:       #000000
 *   White:       #FFFFFF
 *
 * Font Stack:
 *   Regular:     Conv_Poppins-Regular
 *   Medium:      Conv_Poppins-Medium
 *   Light:       Conv_Poppins-Light
 *   Bold:        Conv_Poppins-Bold
 *
 * Scope: All rules scoped under .woocommerce-account to prevent bleed.
 */


/* ==========================================================================
   1. ACCENT COLOR OVERRIDE  —  Blue-to-Gold
   ========================================================================== */

/**
 * Universal accent-color for native controls.
 * Covers radios, checkboxes, range sliders, and progress bars
 * that haven't been fully custom-styled.
 */
.woocommerce-account input[type="radio"],
.woocommerce-account input[type="checkbox"] {
    accent-color: #C5A84A;
}


/* ---------------------------------------------------------------------------
   1a. Custom Radio Buttons
   --------------------------------------------------------------------------- */

.woocommerce-account input[type="radio"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    border: 2px solid #C5A84A;
    border-radius: 50%;
    background: #fff;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
    margin: 0 6px 0 0;
    flex-shrink: 0;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.woocommerce-account input[type="radio"]:hover {
    border-color: #ECD67E;
    box-shadow: 0 0 0 3px rgba(236, 214, 126, 0.2);
}

.woocommerce-account input[type="radio"]:focus {
    outline: none;
    border-color: #C5A84A;
    box-shadow: 0 0 0 3px rgba(236, 214, 126, 0.35);
}

.woocommerce-account input[type="radio"]:checked {
    border-color: #C5A84A;
    background: #fff;
}

.woocommerce-account input[type="radio"]:checked::after {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #C5A84A;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


/* ---------------------------------------------------------------------------
   1b. Custom Checkboxes
   --------------------------------------------------------------------------- */

.woocommerce-account input[type="checkbox"],
.woocommerce-account .woocommerce form .form-row input.input-checkbox {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: inline-block !important;
    width: 18px;
    height: 18px;
    min-width: 18px;
    border: 2px solid #C5A84A;
    border-radius: 3px;
    background: #fff;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
    margin: 0 6px 0 0;
    flex-shrink: 0;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.woocommerce-account input[type="checkbox"]:hover {
    border-color: #ECD67E;
    box-shadow: 0 0 0 3px rgba(236, 214, 126, 0.2);
}

.woocommerce-account input[type="checkbox"]:focus {
    outline: none;
    border-color: #C5A84A;
    box-shadow: 0 0 0 3px rgba(236, 214, 126, 0.35);
}

.woocommerce-account input[type="checkbox"]:checked,
.woocommerce-account .woocommerce form .form-row input.input-checkbox:checked {
    background: #C5A84A !important;
    border-color: #C5A84A !important;
}

.woocommerce-account input[type="checkbox"]:checked::after,
.woocommerce-account .woocommerce form .form-row input.input-checkbox:checked::after {
    content: "";
    display: block;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -60%) rotate(45deg);
}


/* ---------------------------------------------------------------------------
   1b-2. SMS Preferences Info Box  —  Override plugin blue to gold
   --------------------------------------------------------------------------- */

.woocommerce-account .sms-optin-details {
    border-left-color: #C5A84A !important;
}

/* ---------------------------------------------------------------------------
   1c. Global Focus Outline Override  —  No Blue Anywhere
   --------------------------------------------------------------------------- */

.woocommerce-account input:focus,
.woocommerce-account select:focus,
.woocommerce-account textarea:focus,
.woocommerce-account button:focus,
.woocommerce-account a:focus,
.woocommerce-account .select2-container--focus .select2-selection {
    outline: 2px solid #ECD67E;
    outline-offset: 1px;
}

/**
 * Remove Webkit blue tap-highlight on mobile.
 */
.woocommerce-account input,
.woocommerce-account select,
.woocommerce-account textarea,
.woocommerce-account button,
.woocommerce-account a {
    -webkit-tap-highlight-color: rgba(236, 214, 126, 0.3);
}

/**
 * Selection highlight (text selection).
 */
.woocommerce-account .accountWrap ::selection {
    background: rgba(236, 214, 126, 0.4);
    color: #000;
}

.woocommerce-account .accountWrap ::-moz-selection {
    background: rgba(236, 214, 126, 0.4);
    color: #000;
}


/* ==========================================================================
   2. BUTTON STYLING
   ========================================================================== */

/* ---------------------------------------------------------------------------
   2a. Primary CTA Buttons
   --------------------------------------------------------------------------- */

.woocommerce-account .woocommerce-Button,
.woocommerce-account .woocommerce-button,
.woocommerce-account button[name="save_account_details"],
.woocommerce-account button[name="save_sms_preferences"],
.woocommerce-account .woocommerce-MyAccount-content > form button[type="submit"],
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-form-login button[type="submit"],
.woocommerce-account .woocommerce-MyAccount-content input[type="submit"] {
    display: inline-block;
    background: #ECD67E !important;
    color: #000 !important;
    border: 2px solid #C5A84A;
    border-radius: 0;
    padding: 11px 24px 10px;
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    font-size: 14px;
    font-weight: 400;
    text-transform: none;
    letter-spacing: normal;
    line-height: 1.4;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.woocommerce-account .woocommerce-Button:hover,
.woocommerce-account .woocommerce-Button:focus,
.woocommerce-account .woocommerce-button:hover,
.woocommerce-account .woocommerce-button:focus,
.woocommerce-account button[name="save_account_details"]:hover,
.woocommerce-account button[name="save_account_details"]:focus,
.woocommerce-account button[name="save_sms_preferences"]:hover,
.woocommerce-account button[name="save_sms_preferences"]:focus,
.woocommerce-account .woocommerce-MyAccount-content > form button[type="submit"]:hover,
.woocommerce-account .woocommerce-MyAccount-content > form button[type="submit"]:focus,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-form-login button[type="submit"]:hover,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-form-login button[type="submit"]:focus,
.woocommerce-account .woocommerce-MyAccount-content input[type="submit"]:hover,
.woocommerce-account .woocommerce-MyAccount-content input[type="submit"]:focus {
    background: #C5A84A !important;
    color: #000 !important;
    border-color: #C5A84A;
    box-shadow: 0 2px 8px rgba(197, 168, 74, 0.35);
    outline: none;
}

.woocommerce-account .woocommerce-Button:active,
.woocommerce-account .woocommerce-button:active,
.woocommerce-account button[name="save_account_details"]:active,
.woocommerce-account button[name="save_sms_preferences"]:active,
.woocommerce-account .woocommerce-MyAccount-content > form button[type="submit"]:active,
.woocommerce-account .woocommerce-MyAccount-content input[type="submit"]:active {
    background: #b89a3e !important;
    border-color: #b89a3e;
    box-shadow: 0 1px 4px rgba(197, 168, 74, 0.25);
    transform: translateY(1px);
}


/* ---------------------------------------------------------------------------
   2b. Secondary / Ghost Buttons  (e.g. VIEW in orders table)
   --------------------------------------------------------------------------- */

.woocommerce-account .woocommerce-orders-table .button,
.woocommerce-account .woocommerce-button--view,
.woocommerce-account .woocommerce-MyAccount-content .button.view,
.woocommerce-account .woocommerce-orders-table .woocommerce-button {
    display: inline-block;
    background: transparent;
    color: #000;
    border: 1px solid #ECD67E;
    border-radius: 0;
    padding: 6px 14px !important;
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif !important;
    font-size: 12px !important;
    font-weight: 400;
    text-transform: none;
    letter-spacing: normal;
    line-height: 1.4;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.woocommerce-account .woocommerce-orders-table .button:hover,
.woocommerce-account .woocommerce-orders-table .button:focus,
.woocommerce-account .woocommerce-button--view:hover,
.woocommerce-account .woocommerce-button--view:focus,
.woocommerce-account .woocommerce-MyAccount-content .button.view:hover,
.woocommerce-account .woocommerce-MyAccount-content .button.view:focus,
.woocommerce-account .woocommerce-orders-table .woocommerce-button:hover,
.woocommerce-account .woocommerce-orders-table .woocommerce-button:focus {
    background: #ECD67E;
    color: #000;
    border-color: #ECD67E;
    box-shadow: 0 2px 6px rgba(236, 214, 126, 0.3);
    outline: none;
    text-decoration: none;
}

.woocommerce-account .woocommerce-orders-table .button:active,
.woocommerce-account .woocommerce-button--view:active,
.woocommerce-account .woocommerce-MyAccount-content .button.view:active {
    background: #C5A84A;
    border-color: #C5A84A;
}

/**
 * Generic a.button inside My Account content (e.g. "Add payment method").
 * Override theme's uppercase/letter-spacing on .button class.
 */
.woocommerce-account .woocommerce-MyAccount-content a.button {
    text-transform: none;
    letter-spacing: normal;
    font-weight: 400;
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
}


/* ==========================================================================
   3. FORM ELEMENTS
   ========================================================================== */

/**
 * Text inputs, selects, and textareas inside the account wrapper.
 * Focus state replaces default blue with gold glow.
 */
.woocommerce-account .accountWrap input[type="text"],
.woocommerce-account .accountWrap input[type="email"],
.woocommerce-account .accountWrap input[type="password"],
.woocommerce-account .accountWrap input[type="tel"],
.woocommerce-account .accountWrap input[type="date"],
.woocommerce-account .accountWrap input[type="number"],
.woocommerce-account .accountWrap input[type="url"],
.woocommerce-account .accountWrap input[type="search"],
.woocommerce-account .accountWrap select,
.woocommerce-account .accountWrap textarea,
.woocommerce-account .woocommerce-MyAccount-content input[type="text"],
.woocommerce-account .woocommerce-MyAccount-content input[type="email"],
.woocommerce-account .woocommerce-MyAccount-content input[type="password"],
.woocommerce-account .woocommerce-MyAccount-content input[type="tel"],
.woocommerce-account .woocommerce-MyAccount-content input[type="date"],
.woocommerce-account .woocommerce-MyAccount-content input[type="number"],
.woocommerce-account .woocommerce-MyAccount-content input[type="url"],
.woocommerce-account .woocommerce-MyAccount-content input[type="search"],
.woocommerce-account .woocommerce-MyAccount-content select,
.woocommerce-account .woocommerce-MyAccount-content textarea {
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.woocommerce-account .accountWrap input[type="text"]:focus,
.woocommerce-account .accountWrap input[type="email"]:focus,
.woocommerce-account .accountWrap input[type="password"]:focus,
.woocommerce-account .accountWrap input[type="tel"]:focus,
.woocommerce-account .accountWrap input[type="date"]:focus,
.woocommerce-account .accountWrap input[type="number"]:focus,
.woocommerce-account .accountWrap input[type="url"]:focus,
.woocommerce-account .accountWrap input[type="search"]:focus,
.woocommerce-account .accountWrap select:focus,
.woocommerce-account .accountWrap textarea:focus,
.woocommerce-account .woocommerce-MyAccount-content input[type="text"]:focus,
.woocommerce-account .woocommerce-MyAccount-content input[type="email"]:focus,
.woocommerce-account .woocommerce-MyAccount-content input[type="password"]:focus,
.woocommerce-account .woocommerce-MyAccount-content input[type="tel"]:focus,
.woocommerce-account .woocommerce-MyAccount-content input[type="date"]:focus,
.woocommerce-account .woocommerce-MyAccount-content input[type="number"]:focus,
.woocommerce-account .woocommerce-MyAccount-content input[type="url"]:focus,
.woocommerce-account .woocommerce-MyAccount-content input[type="search"]:focus,
.woocommerce-account .woocommerce-MyAccount-content select:focus,
.woocommerce-account .woocommerce-MyAccount-content textarea:focus {
    border-color: #C5A84A;
    box-shadow: 0 0 0 2px rgba(236, 214, 126, 0.25);
    outline: none;
}

/**
 * Placeholder text color.
 */
.woocommerce-account .accountWrap input::placeholder,
.woocommerce-account .accountWrap textarea::placeholder,
.woocommerce-account .woocommerce-MyAccount-content input::placeholder,
.woocommerce-account .woocommerce-MyAccount-content textarea::placeholder {
    color: #999;
    opacity: 1;
}

.woocommerce-account .accountWrap input::-webkit-input-placeholder,
.woocommerce-account .accountWrap textarea::-webkit-input-placeholder {
    color: #999;
}

.woocommerce-account .accountWrap input::-moz-placeholder,
.woocommerce-account .accountWrap textarea::-moz-placeholder {
    color: #999;
    opacity: 1;
}

/**
 * Select2 dropdown focus override (WooCommerce uses Select2 for some selects).
 */
.woocommerce-account .select2-container--default .select2-selection--single:focus,
.woocommerce-account .select2-container--default.select2-container--focus .select2-selection--single,
.woocommerce-account .select2-container--default.select2-container--open .select2-selection--single {
    border-color: #C5A84A;
    box-shadow: 0 0 0 3px rgba(236, 214, 126, 0.25);
    outline: none;
}

.woocommerce-account .select2-container--default .select2-results__option--highlighted[aria-selected],
.woocommerce-account .select2-container--default .select2-results__option--highlighted[data-selected] {
    background-color: #C5A84A !important;
    color: #000 !important;
}

.woocommerce-account .select2-container--default .select2-results__option[aria-selected="true"],
.woocommerce-account .select2-container--default .select2-results__option[data-selected="true"] {
    background-color: #ECD67E;
    color: #000;
}


/* ==========================================================================
   4. ORDERS TABLE  (Updated: condensed layout matching Pre-Orders)
   ========================================================================== */

/* ---------------------------------------------------------------------------
   4a. Table Base
   --------------------------------------------------------------------------- */

.woocommerce-account .woocommerce-orders-table {
    width: 100% !important;
    max-width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

/* ---------------------------------------------------------------------------
   4b. Table Header
   --------------------------------------------------------------------------- */

.woocommerce-account .woocommerce-orders-table thead th {
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 8px 6px !important;
    border-bottom: 2px solid #ECD67E;
    text-align: left;
    line-height: 1.4 !important;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---------------------------------------------------------------------------
   4c. Table Body Rows
   --------------------------------------------------------------------------- */

.woocommerce-account .woocommerce-orders-table tbody td,
.woocommerce-account .woocommerce-orders-table tbody th {
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif !important;
    font-size: 12px !important;
    padding: 10px 6px !important;
    border-bottom: 1px solid #eee;
    vertical-align: middle;
    line-height: 1.4 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 400 !important;
}

.woocommerce-account .woocommerce-orders-table tbody tr:nth-child(even) {
    background: #fafafa;
}

.woocommerce-account .woocommerce-orders-table tbody tr:hover {
    background: rgba(236, 214, 126, 0.08);
}

/* ---------------------------------------------------------------------------
   4d. Column Widths (5-col: Order, Date, Status, Total, Actions)
   --------------------------------------------------------------------------- */

.woocommerce-account .woocommerce-orders-table__header-order-number,
.woocommerce-account .woocommerce-orders-table__cell-order-number { width: 12%; }

.woocommerce-account .woocommerce-orders-table__header-order-date,
.woocommerce-account .woocommerce-orders-table__cell-order-date { width: 18%; }

.woocommerce-account .woocommerce-orders-table__header-order-status,
.woocommerce-account .woocommerce-orders-table__cell-order-status { width: 18%; }

.woocommerce-account .woocommerce-orders-table__header-order-total,
.woocommerce-account .woocommerce-orders-table__cell-order-total { width: 34%; }

.woocommerce-account .woocommerce-orders-table__header-order-actions,
.woocommerce-account .woocommerce-orders-table__cell-order-actions { width: 18%; }

/* ---------------------------------------------------------------------------
   4e. Order Status Cell
   --------------------------------------------------------------------------- */

.woocommerce-account .woocommerce-orders-table__cell-order-status {
    font-weight: 500 !important;
}

/* ---------------------------------------------------------------------------
   4f. Desktop: headers don't wrap when table has room
   --------------------------------------------------------------------------- */

@media (min-width: 1200px) {
    .woocommerce-account .woocommerce-orders-table thead th {
        white-space: nowrap;
    }
}

/* ---------------------------------------------------------------------------
   4g. Tablet: hide Date column at 993-1199px to fit content area
   --------------------------------------------------------------------------- */

@media (max-width: 1199px) and (min-width: 993px) {
    .woocommerce-account .woocommerce-orders-table__header-order-date,
    .woocommerce-account .woocommerce-orders-table__cell-order-date {
        display: none;
    }

    /* Rebalance 4 columns */
    .woocommerce-account .woocommerce-orders-table__header-order-number,
    .woocommerce-account .woocommerce-orders-table__cell-order-number { width: 14%; }

    .woocommerce-account .woocommerce-orders-table__header-order-status,
    .woocommerce-account .woocommerce-orders-table__cell-order-status { width: 22%; }

    .woocommerce-account .woocommerce-orders-table__header-order-total,
    .woocommerce-account .woocommerce-orders-table__cell-order-total { width: 42%; }

    .woocommerce-account .woocommerce-orders-table__header-order-actions,
    .woocommerce-account .woocommerce-orders-table__cell-order-actions { width: 22%; }

    .woocommerce-account .woocommerce-orders-table thead th {
        white-space: nowrap;
        font-size: 11px !important;
        padding: 8px 4px !important;
    }

    .woocommerce-account .woocommerce-orders-table tbody td,
    .woocommerce-account .woocommerce-orders-table tbody th {
        font-size: 11px !important;
        padding: 8px 4px !important;
    }

    /* Prevent order number from wrapping */
    .woocommerce-account .woocommerce-orders-table__cell-order-number {
        white-space: nowrap;
    }
}

/* ---------------------------------------------------------------------------
   4h. Mobile: stacked card layout at 992px and below
   --------------------------------------------------------------------------- */

@media (max-width: 992px) {
    .woocommerce-account .woocommerce-orders-table {
        table-layout: auto;
    }

    .woocommerce-account .woocommerce-orders-table thead {
        display: none;
    }

    .woocommerce-account .woocommerce-orders-table tbody tr {
        display: block;
        padding: 12px 0;
        border-bottom: 1px solid #eee;
    }

    .woocommerce-account .woocommerce-orders-table tbody td,
    .woocommerce-account .woocommerce-orders-table tbody th {
        display: block;
        padding: 3px 12px !important;
        border-bottom: none;
        font-size: 13px !important;
        text-align: left;
    }

    .woocommerce-account .woocommerce-orders-table tbody tr td:first-child,
    .woocommerce-account .woocommerce-orders-table tbody tr th:first-child {
        padding-top: 10px !important;
    }

    .woocommerce-account .woocommerce-orders-table tbody tr td:last-child {
        padding-bottom: 10px !important;
    }

    .woocommerce-account .woocommerce-orders-table tbody td::before,
    .woocommerce-account .woocommerce-orders-table tbody th::before {
        content: attr(data-title) ": ";
        font-family: "Conv_Poppins-Medium", "Poppins", sans-serif;
        font-weight: 500;
        font-size: 12px;
        color: #666;
    }

    /* Show Date column again in stacked view */
    .woocommerce-account .woocommerce-orders-table__cell-order-date {
        display: block;
    }

    /* Reset column widths in stacked view */
    .woocommerce-account .woocommerce-orders-table__cell-order-number,
    .woocommerce-account .woocommerce-orders-table__cell-order-date,
    .woocommerce-account .woocommerce-orders-table__cell-order-status,
    .woocommerce-account .woocommerce-orders-table__cell-order-total,
    .woocommerce-account .woocommerce-orders-table__cell-order-actions,
    .woocommerce-account .woocommerce-orders-table__header-order-number,
    .woocommerce-account .woocommerce-orders-table__header-order-date,
    .woocommerce-account .woocommerce-orders-table__header-order-status,
    .woocommerce-account .woocommerce-orders-table__header-order-total,
    .woocommerce-account .woocommerce-orders-table__header-order-actions {
        width: auto;
    }

    /* Hide "Actions:" label in stacked card view — button is self-explanatory */
    .woocommerce-account .woocommerce-orders-table__cell-order-actions::before {
        display: none !important;
    }

    /* Make View button wider and easier to tap on mobile */
    .woocommerce-account .woocommerce-orders-table__cell-order-actions .button.view {
        display: block;
        width: 100%;
        text-align: center;
        padding: 8px 16px;
        box-sizing: border-box;
    }
}


/* ==========================================================================
   5. SIDEBAR NAVIGATION
   ========================================================================== */

/**
 * Active item  —  stands out from siblings with brighter gold and bolder font.
 */
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active {
    filter: brightness(1.15);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    font-family: "Conv_Poppins-Medium", "Poppins", sans-serif;
    font-weight: 500;
}

/**
 * Left-border indicator on active item for additional visual cue.
 * Uses box-shadow (inset) to avoid shifting layout from clip-path shapes.
 */
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active {
    box-shadow: inset 4px 0 0 0 #ECD67E;
}

/**
 * Hover on non-active items  —  subtle brightness lift.
 */
.woocommerce-account .woocommerce-MyAccount-navigation ul li:not(.is-active):hover {
    filter: brightness(1.08);
    transition: filter 0.2s ease;
}

/**
 * Ensure all nav links inherit proper font.
 */
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    transition: filter 0.2s ease;
}


/* ==========================================================================
   6. LINKS
   ========================================================================== */

.woocommerce-account .woocommerce-MyAccount-content a {
    color: #C5A84A;
    text-decoration: none;
    transition: color 0.2s ease;
}

.woocommerce-account .woocommerce-MyAccount-content a:hover,
.woocommerce-account .woocommerce-MyAccount-content a:focus {
    color: #C5A84A;
    text-decoration: underline;
}

.woocommerce-account .woocommerce-MyAccount-content a:active {
    color: #b89a3e;
}

/**
 * Ensure button-styled links don't get underlines on hover.
 */
.woocommerce-account .woocommerce-MyAccount-content a.button:hover,
.woocommerce-account .woocommerce-MyAccount-content a.woocommerce-button:hover,
.woocommerce-account .woocommerce-MyAccount-content a.woocommerce-Button:hover {
    text-decoration: none;
}


/* ==========================================================================
   7. PAGINATION
   ========================================================================== */

.woocommerce-account .woocommerce-pagination a,
.woocommerce-account .woocommerce-Pagination a,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-pagination a,
.woocommerce-account .woocommerce-MyAccount-content nav.woocommerce-pagination ul li a {
    color: #000;
    border: 1px solid #ddd;
    padding: 6px 12px;
    text-decoration: none;
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    font-size: 14px;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.woocommerce-account .woocommerce-pagination a:hover,
.woocommerce-account .woocommerce-Pagination a:hover,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-pagination a:hover,
.woocommerce-account .woocommerce-MyAccount-content nav.woocommerce-pagination ul li a:hover {
    background: #ECD67E;
    border-color: #C5A84A;
    color: #000;
}

/**
 * Current / active page.
 */
.woocommerce-account .woocommerce-pagination span.current,
.woocommerce-account .woocommerce-Pagination span.current,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-pagination span.current,
.woocommerce-account .woocommerce-MyAccount-content nav.woocommerce-pagination ul li span.current {
    background: #C5A84A;
    border: 1px solid #C5A84A;
    color: #000;
    padding: 6px 12px;
    font-family: "Conv_Poppins-Medium", "Poppins", sans-serif;
    font-weight: 500;
}

/**
 * Previous / Next page links.
 */
.woocommerce-account .woocommerce-pagination a.prev,
.woocommerce-account .woocommerce-pagination a.next,
.woocommerce-account .woocommerce-Pagination a.prev,
.woocommerce-account .woocommerce-Pagination a.next {
    border-color: #C5A84A;
    color: #C5A84A;
}

.woocommerce-account .woocommerce-pagination a.prev:hover,
.woocommerce-account .woocommerce-pagination a.next:hover,
.woocommerce-account .woocommerce-Pagination a.prev:hover,
.woocommerce-account .woocommerce-Pagination a.next:hover {
    background: #C5A84A;
    color: #000;
}


/* ==========================================================================
   8. WOOCOMMERCE NOTICES  —  Gold-themed alerts
   ========================================================================== */

/**
 * Success notices.
 */
.woocommerce-account .woocommerce-message,
.woocommerce-account .woocommerce-Message {
    border-top-color: #C5A84A;
}

.woocommerce-account .woocommerce-message::before {
    color: #C5A84A;
}

/**
 * Info notices.
 */
.woocommerce-account .woocommerce-info {
    border-top-color: #ECD67E;
}

.woocommerce-account .woocommerce-info::before {
    color: #C5A84A;
}

/**
 * Action links inside notices.
 */
.woocommerce-account .woocommerce-message a.button,
.woocommerce-account .woocommerce-info a.button,
.woocommerce-account .woocommerce-Message a.button {
    background: #ECD67E;
    color: #000;
    border: 2px solid #C5A84A;
    text-decoration: none;
}

.woocommerce-account .woocommerce-message a.button:hover,
.woocommerce-account .woocommerce-info a.button:hover,
.woocommerce-account .woocommerce-Message a.button:hover {
    background: #C5A84A;
    color: #000;
}


/* ==========================================================================
   9. ADDRESS CARDS  —  Edit/Billing/Shipping sections
   ========================================================================== */

.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address-title h3 {
    font-family: "Conv_Poppins-Medium", "Poppins", sans-serif;
    font-weight: 500;
}

.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address-title a.edit {
    color: #C5A84A;
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    text-decoration: none;
    transition: color 0.2s ease;
}

.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address-title a.edit:hover {
    text-decoration: underline;
}

/**
 * Address card containers  —  subtle border to create visual cards.
 */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address {
    border: 1px solid #eee;
    padding: 20px;
    transition: border-color 0.2s ease;
}

.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address:hover {
    border-color: #ECD67E;
}


/* ==========================================================================
   10. MISCELLANEOUS OVERRIDES
   ========================================================================== */

/**
 * Password strength meter  —  override WooCommerce default green with gold.
 * Only partially themed; strong/good states get gold to match brand.
 */
.woocommerce-account .woocommerce-password-strength.strong {
    border-color: #C5A84A !important;
}

/**
 * WooCommerce form row  —  ensure label styling is consistent.
 */
.woocommerce-account .woocommerce-MyAccount-content .form-row label {
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    font-size: 14px;
    color: #333;
}

.woocommerce-account .woocommerce-MyAccount-content .form-row label .required {
    color: #C5A84A;
}

/**
 * Disabled / loading button state.
 */
.woocommerce-account .woocommerce-MyAccount-content button[disabled],
.woocommerce-account .woocommerce-MyAccount-content button.loading {
    opacity: 0.6;
    cursor: not-allowed;
}

/**
 * WooCommerce loader / blockUI overlay  —  gold spinner if customizable.
 */
.woocommerce-account .blockUI.blockOverlay::before {
    border-top-color: #C5A84A !important;
}

/**
 * Ensure no blue outline on any focusable element we may have missed.
 * This is the nuclear fallback scoped tightly to .woocommerce-account.
 */
.woocommerce-account *:focus {
    outline-color: #ECD67E;
}

.woocommerce-account *:focus-visible {
    outline: 2px solid #ECD67E;
    outline-offset: 1px;
}


/* ==========================================================================
   11. WISHLIST  —  Phase 2
   ========================================================================== */

/**
 * Wishlist list container — clean bordered list.
 */
.woocommerce-account .favorites-list {
    border: 1px solid #eee;
    padding: 0;
    margin: 0 0 20px 0;
    list-style: none;
}

/**
 * Wishlist items — consistent spacing with room for X button.
 */
.woocommerce-account .favorites-list li {
    position: relative;
    padding: 12px 44px 12px 15px;
    border-bottom: 1px solid #eee;
    list-style: none;
    transition: opacity 0.3s ease;
}

.woocommerce-account .favorites-list li:last-child {
    border-bottom: none;
}

/**
 * Individual remove (X) button — circular, positioned right.
 */
.woocommerce-account .gr-wishlist-remove {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: 1px solid #ddd;
    color: #999;
    width: 28px;
    height: 28px;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    border-radius: 50%;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
}

.woocommerce-account .gr-wishlist-remove:hover {
    color: #991b1b;
    border-color: #991b1b;
    background: #fee2e2;
}

.woocommerce-account .gr-wishlist-remove:focus {
    outline: 2px solid #ECD67E;
    outline-offset: 1px;
}

/**
 * "Clear Wishlist" button — ghost style matching brand.
 */
.woocommerce-account .simplefavorites-clear {
    display: inline-block;
    background: transparent;
    color: #000;
    border: 1px solid #ECD67E;
    padding: 8px 20px;
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    font-size: 13px;
    font-weight: 400;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.woocommerce-account .simplefavorites-clear:hover {
    background: #ECD67E;
    border-color: #C5A84A;
}


/* ==========================================================================
   12. ORDERS DATA TABLE CONTROLS  —  Search, Sort, Pagination, Export
   ========================================================================== */

/* ---------------------------------------------------------------------------
   12a. Table Toolbar (Search + Export row above table)
   --------------------------------------------------------------------------- */

.woocommerce-account .gr-table-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    gap: 12px;
}

.woocommerce-account .gr-toolbar-left {
    flex: 1;
    max-width: 280px;
}

.woocommerce-account .gr-toolbar-right {
    flex-shrink: 0;
}

/* Search input */
.woocommerce-account .gr-table-search {
    width: 100%;
    padding: 7px 12px !important;
    border: 1px solid #ddd !important;
    border-radius: 0;
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif !important;
    font-size: 12px !important;
    color: #333;
    background: #fff;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    box-sizing: border-box;
}

.woocommerce-account .gr-table-search::placeholder {
    color: #999;
    opacity: 1;
}

.woocommerce-account .gr-table-search:focus {
    border-color: #C5A84A !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(236, 214, 126, 0.25);
}

/* Export button */
.woocommerce-account .gr-table-export {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: transparent;
    border: 1px solid #ECD67E;
    border-radius: 0;
    padding: 6px 14px;
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    font-size: 12px;
    font-weight: 400;
    color: #000;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.woocommerce-account .gr-table-export:hover {
    background: #ECD67E;
    border-color: #C5A84A;
}

.woocommerce-account .gr-table-export:active {
    background: #C5A84A;
    border-color: #C5A84A;
}

.woocommerce-account .gr-table-export:focus {
    outline: 2px solid #ECD67E;
    outline-offset: 1px;
}

.woocommerce-account .gr-export-icon {
    display: inline-block;
    vertical-align: middle;
    flex-shrink: 0;
}

/* ---------------------------------------------------------------------------
   12b. Sortable Column Headers
   --------------------------------------------------------------------------- */

.woocommerce-account .gr-sortable {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.woocommerce-account .gr-sortable:hover {
    color: #C5A84A !important;
}

.woocommerce-account .gr-sortable:focus-visible {
    outline: 2px solid #ECD67E;
    outline-offset: -2px;
}

.woocommerce-account .gr-sort-indicator {
    display: inline-block;
    margin-left: 3px;
    font-size: 10px;
    vertical-align: middle;
    opacity: 0.3;
    font-style: normal;
    transition: opacity 0.15s ease;
}

.woocommerce-account .gr-sort-indicator::after {
    content: '\21C5'; /* ⇅ */
}

.woocommerce-account .gr-sort-asc .gr-sort-indicator {
    opacity: 1;
    color: #C5A84A;
}

.woocommerce-account .gr-sort-asc .gr-sort-indicator::after {
    content: '\2191'; /* ↑ */
}

.woocommerce-account .gr-sort-desc .gr-sort-indicator {
    opacity: 1;
    color: #C5A84A;
}

.woocommerce-account .gr-sort-desc .gr-sort-indicator::after {
    content: '\2193'; /* ↓ */
}

/* ---------------------------------------------------------------------------
   12c. Pagination Bar (below table)
   --------------------------------------------------------------------------- */

.woocommerce-account .gr-table-pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 14px;
    padding: 10px 0;
    border-top: 1px solid #eee;
    gap: 12px;
}

.woocommerce-account .gr-pagination-left {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.woocommerce-account .gr-pagination-label {
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    font-size: 12px;
    color: #666;
    white-space: nowrap;
}

.woocommerce-account .gr-rows-per-page {
    border: 1px solid #ddd;
    padding: 3px 6px;
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    font-size: 12px;
    cursor: pointer;
    background: #fff;
    border-radius: 0;
}

.woocommerce-account .gr-rows-per-page:focus {
    border-color: #C5A84A;
    outline: none;
    box-shadow: 0 0 0 2px rgba(236, 214, 126, 0.25);
}

.woocommerce-account .gr-pagination-center {
    flex: 1;
    text-align: center;
}

.woocommerce-account .gr-pagination-summary {
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    font-size: 12px;
    color: #666;
    white-space: nowrap;
}

.woocommerce-account .gr-pagination-right {
    display: flex;
    gap: 4px;
    flex-shrink: 0;
}

.woocommerce-account .gr-page-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    background: transparent;
    border: 1px solid #ddd;
    border-radius: 0;
    font-size: 14px;
    line-height: 1;
    color: #333;
    cursor: pointer;
    padding: 0;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.woocommerce-account .gr-page-btn:hover:not(:disabled) {
    background: #ECD67E;
    border-color: #C5A84A;
    color: #000;
}

.woocommerce-account .gr-page-btn:focus {
    outline: 2px solid #ECD67E;
    outline-offset: 1px;
}

.woocommerce-account .gr-page-btn:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

/* ---------------------------------------------------------------------------
   12d. JS-controlled alternating rows (overrides nth-child when active)
   --------------------------------------------------------------------------- */

.woocommerce-account .woocommerce-orders-table.gr-datatable-active tbody tr:nth-child(even) {
    background: transparent;
}

.woocommerce-account .woocommerce-orders-table.gr-datatable-active tbody tr.gr-row-even {
    background: #fafafa;
}

.woocommerce-account .woocommerce-orders-table.gr-datatable-active tbody tr:hover {
    background: rgba(236, 214, 126, 0.08);
}

/* ---------------------------------------------------------------------------
   12e. Hide native WooCommerce pagination when data table is active
   --------------------------------------------------------------------------- */

.woocommerce-account .woocommerce-orders-table.gr-datatable-active ~ .woocommerce-pagination,
.woocommerce-account .woocommerce-orders-table.gr-datatable-active ~ nav.woocommerce-pagination {
    display: none !important;
}

/* ---------------------------------------------------------------------------
   12f. Responsive: Tablet (max-width: 1199px)
   --------------------------------------------------------------------------- */

@media (max-width: 1199px) and (min-width: 993px) {
    .woocommerce-account .gr-table-toolbar {
        gap: 8px;
    }

    .woocommerce-account .gr-toolbar-left {
        max-width: 220px;
    }

    .woocommerce-account .gr-table-search {
        font-size: 11px !important;
        padding: 6px 10px !important;
    }

    .woocommerce-account .gr-table-export {
        font-size: 11px;
        padding: 5px 10px;
    }

    .woocommerce-account .gr-pagination-label,
    .woocommerce-account .gr-pagination-summary {
        font-size: 11px;
    }

    .woocommerce-account .gr-rows-per-page {
        font-size: 11px;
    }

    .woocommerce-account .gr-page-btn {
        width: 26px;
        height: 26px;
        font-size: 12px;
    }
}

/* ---------------------------------------------------------------------------
   12g. Responsive: Mobile (max-width: 992px)
   --------------------------------------------------------------------------- */

@media (max-width: 992px) {
    .woocommerce-account .gr-table-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .woocommerce-account .gr-toolbar-left {
        max-width: 100%;
    }

    .woocommerce-account .gr-toolbar-right {
        align-self: flex-start;
    }

    .woocommerce-account .gr-table-search {
        font-size: 13px !important;
    }

    .woocommerce-account .gr-table-pagination {
        flex-wrap: wrap;
        gap: 8px;
    }

    .woocommerce-account .gr-pagination-left {
        order: 1;
    }

    .woocommerce-account .gr-pagination-center {
        order: 2;
        text-align: left;
    }

    .woocommerce-account .gr-pagination-right {
        order: 3;
        margin-left: auto;
    }
}

/* ---------------------------------------------------------------------------
   12h. Responsive: Small Mobile (max-width: 480px)
   --------------------------------------------------------------------------- */

@media (max-width: 480px) {
    .woocommerce-account .gr-table-toolbar {
        gap: 6px;
    }

    .woocommerce-account .gr-toolbar-right {
        width: 100%;
    }

    .woocommerce-account .gr-table-export {
        width: 100%;
        justify-content: center;
    }

    .woocommerce-account .gr-pagination-left,
    .woocommerce-account .gr-pagination-center {
        width: 100%;
    }

    .woocommerce-account .gr-pagination-center {
        text-align: left;
    }

    .woocommerce-account .gr-pagination-right {
        width: 100%;
        justify-content: flex-end;
    }
}


/* ==========================================================================
   13. PRE-ORDERS TAB  —  Phase 3.1 (Unified 6-Column Table)
   ========================================================================== */

/* --- Count text --- */
.woocommerce-account .gr-preorders-count {
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    font-size: 13px;
    color: #666;
    margin-bottom: 10px;
}

/* --- Table base: smaller font for 6-column density --- */
.woocommerce-account .gr-preorders-table {
    width: 100% !important;
    max-width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.woocommerce-account .gr-preorders-table thead th {
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 8px 6px !important;
    border-bottom: 2px solid #ECD67E;
    text-align: left;
    line-height: 1.4 !important;
    overflow: hidden;
    text-overflow: ellipsis;
}

.woocommerce-account .gr-preorders-table tbody td {
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif !important;
    font-size: 12px !important;
    padding: 10px 6px !important;
    border-bottom: 1px solid #eee;
    vertical-align: middle;
    line-height: 1.4 !important;
    overflow: hidden;
    text-overflow: ellipsis;
}

.woocommerce-account .gr-preorders-table tbody tr:nth-child(even) {
    background: #fafafa;
}

.woocommerce-account .gr-preorders-table tbody tr:hover {
    background: rgba(236, 214, 126, 0.08);
}

/* --- Column widths (5-col: Date column removed) --- */
.woocommerce-account .gr-po-col-order { width: 12%; }
.woocommerce-account .gr-po-col-product { width: 36%; }
.woocommerce-account .gr-po-col-status { width: 20%; }
.woocommerce-account .gr-po-col-release { width: 18%; }
.woocommerce-account .gr-po-col-actions { width: 14%; }

/* --- Product name truncation (width controlled by table-layout: fixed + col %) --- */
.woocommerce-account .gr-po-product {
    display: block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* --- TBD release date --- */
.woocommerce-account .gr-po-tbd {
    color: #999;
    font-style: italic;
    font-size: 12px;
}

/* --- Unified badges: ALL gold/charcoal palette, NO blue --- */
.woocommerce-account .gr-preorder-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 11px;
    font-weight: 500;
    font-family: "Conv_Poppins-Medium", "Poppins", sans-serif;
    line-height: 1.4;
    white-space: nowrap;
}

/* Payment: Paid */
.woocommerce-account .gr-badge-paid {
    background: rgba(236, 214, 126, 0.2);
    color: #8B7424;
    border: 1px solid rgba(197, 168, 74, 0.3);
}

/* Payment: Pay Later */
.woocommerce-account .gr-badge-pay-later {
    background: rgba(197, 168, 74, 0.12);
    color: #6B5A1E;
    border: 1px solid rgba(197, 168, 74, 0.25);
}

/* Pre-order status: Active */
.woocommerce-account .gr-badge-active {
    background: rgba(236, 214, 126, 0.15);
    color: #8B7424;
    border: 1px solid rgba(236, 214, 126, 0.35);
}

/* Pre-order status: Completed */
.woocommerce-account .gr-badge-completed {
    background: rgba(139, 116, 36, 0.1);
    color: #5A4A15;
    border: 1px solid rgba(139, 116, 36, 0.25);
}

/* Pre-order status: Cancelled */
.woocommerce-account .gr-badge-cancelled {
    background: rgba(102, 102, 102, 0.1);
    color: #666;
    border: 1px solid rgba(102, 102, 102, 0.2);
}

/* --- Desktop: headers don't wrap when table has room --- */
@media (min-width: 1200px) {
    .woocommerce-account .gr-preorders-table thead th {
        white-space: nowrap;
    }
}

/* --- Tablet: 4-column table (hide Release Date to fit content area) --- */
/* Only show table at 993px+ where container is 960px and table has ~601px */
@media (max-width: 1199px) and (min-width: 993px) {
    .woocommerce-account .gr-po-col-release,
    .woocommerce-account .gr-preorders-table tbody td:nth-child(4) {
        display: none;
    }

    /* Rebalance 4 columns for ~578px table area */
    .woocommerce-account .gr-po-col-order { width: 14%; }
    .woocommerce-account .gr-po-col-product { width: 42%; }
    .woocommerce-account .gr-po-col-status { width: 26%; }
    .woocommerce-account .gr-po-col-actions { width: 18%; }

    .woocommerce-account .gr-preorders-table thead th {
        white-space: nowrap;
        font-size: 11px !important;
        padding: 8px 4px !important;
    }

    .woocommerce-account .gr-preorders-table tbody td {
        font-size: 11px !important;
        padding: 8px 4px !important;
    }

    /* Prevent order number from wrapping at tablet */
    .woocommerce-account .gr-preorders-table tbody td:nth-child(1) {
        white-space: nowrap;
    }

    .woocommerce-account .gr-preorder-badge {
        font-size: 10px !important;
        padding: 2px 5px;
    }
}

/* --- Mobile: data-title stacking at 992px and below --- */
/* Stacked layout for all viewports where 5-col table would be too cramped */
@media (max-width: 992px) {
    .woocommerce-account .gr-preorders-table {
        table-layout: auto;
    }

    .woocommerce-account .gr-preorders-table thead {
        display: none;
    }

    .woocommerce-account .gr-preorders-table tbody tr {
        display: block;
        padding: 12px 0;
        border-bottom: 1px solid #eee;
    }

    .woocommerce-account .gr-preorders-table tbody td {
        display: block;
        padding: 3px 12px;
        border-bottom: none;
        font-size: 13px;
        text-align: left;
    }

    .woocommerce-account .gr-preorders-table tbody td:first-child {
        padding-top: 10px;
    }

    .woocommerce-account .gr-preorders-table tbody td:last-child {
        padding-bottom: 10px;
    }

    .woocommerce-account .gr-preorders-table tbody td::before {
        content: attr(data-title) ": ";
        font-family: "Conv_Poppins-Medium", "Poppins", sans-serif;
        font-weight: 500;
        font-size: 12px;
        color: #666;
    }

    /* Show all columns again in mobile stacked view (including Release Date) */
    .woocommerce-account .gr-preorders-table tbody td:nth-child(4) {
        display: block;
    }

    .woocommerce-account .gr-po-product {
        max-width: 100%;
        white-space: normal;
    }

    .woocommerce-account .gr-po-col-order,
    .woocommerce-account .gr-po-col-product,
    .woocommerce-account .gr-po-col-status,
    .woocommerce-account .gr-po-col-release,
    .woocommerce-account .gr-po-col-actions {
        width: auto;
    }

    /* Hide "Actions:" label in stacked card view — button is self-explanatory */
    .woocommerce-account .gr-preorders-table td[data-title="Actions"]::before {
        display: none !important;
    }

    /* Make View button wider and easier to tap on mobile */
    .woocommerce-account .gr-preorders-table td[data-title="Actions"] .button.view {
        display: block;
        width: 100%;
        text-align: center;
        padding: 8px 16px;
        box-sizing: border-box;
    }
}


/* ---------------------------------------------------------------------------
   13d. Pre-Orders Data Table Controls (JS-controlled alternating rows)
   --------------------------------------------------------------------------- */

.woocommerce-account .gr-preorders-table.gr-datatable-active tbody tr:nth-child(even) {
    background: transparent;
}

.woocommerce-account .gr-preorders-table.gr-datatable-active tbody tr.gr-row-even {
    background: #fafafa;
}

/* ---------------------------------------------------------------------------
   13e. Hide native pagination when data table is active
   --------------------------------------------------------------------------- */

.woocommerce-account .gr-preorders-table.gr-datatable-active ~ .woocommerce-pagination {
    display: none !important;
}


/* ==========================================================================
   14. DASHBOARD WIDGETS  —  v4.0 Premium Redesign
   ========================================================================== */

/* ---------------------------------------------------------------------------
   14a. Hide WooCommerce default greeting + description
   The WC template outputs these BEFORE our dashboard hook fires.
   --------------------------------------------------------------------------- */

.woocommerce-account .woocommerce-MyAccount-content > p:first-of-type,
.woocommerce-account .woocommerce-MyAccount-content > p:nth-of-type(2) {
    display: none;
}

/* ---------------------------------------------------------------------------
   14b. Dashboard Container
   --------------------------------------------------------------------------- */

.woocommerce-account .gr-dashboard {
    margin-top: 0;
}

/* ---------------------------------------------------------------------------
   14c. Hero Greeting
   --------------------------------------------------------------------------- */

.woocommerce-account .gr-dashboard-greeting {
    background: rgba(236, 214, 126, 0.06);
    border-bottom: 2px solid #ECD67E;
    padding: 20px 24px;
    margin-bottom: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.woocommerce-account .gr-dashboard-greeting h2 {
    font-family: "Conv_Poppins-Medium", "Poppins", sans-serif;
    font-weight: 500;
    font-size: 22px;
    color: #000;
    margin: 0;
}

.woocommerce-account .gr-dashboard-greeting .gr-member-since {
    font-family: "Conv_Poppins-Light", "Poppins", sans-serif;
    font-size: 13px;
    color: #999;
    white-space: nowrap;
}

/* ---------------------------------------------------------------------------
   14d. KPI Stat Cards  —  4-column grid with gold top accent
   --------------------------------------------------------------------------- */

.woocommerce-account .gr-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}

.woocommerce-account .gr-stat-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px 20px;
    background: #fff;
    border: 1px solid #e0d9c8;
    border-top: 3px solid #C5A84A;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    text-decoration: none;
    color: #000;
    transition: border-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
    cursor: pointer;
}

.woocommerce-account .gr-stat-card:hover {
    border-color: #ECD67E;
    border-top-color: #C5A84A;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
    text-decoration: none;
    color: #000;
}

.woocommerce-account .gr-stat-number {
    font-family: "Conv_Poppins-Medium", "Poppins", sans-serif;
    font-size: 28px;
    font-weight: 500;
    line-height: 1.2;
    color: #C5A84A;
}

/* Anchor metric (Total Orders) — larger number */
.woocommerce-account .gr-stat-card:first-child .gr-stat-number {
    font-size: 32px;
}

.woocommerce-account .gr-stat-label {
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    font-size: 12px;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 6px;
}

/* ---------------------------------------------------------------------------
   14e. Recent Orders  —  matching Orders tab styling (Section 4)
   --------------------------------------------------------------------------- */

.woocommerce-account .gr-recent-orders {
    margin-bottom: 24px;
}

.woocommerce-account .gr-recent-orders h3 {
    font-family: "Conv_Poppins-Medium", "Poppins", sans-serif;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #333;
    margin: 0 0 12px 0;
}

.woocommerce-account .gr-recent-orders-table {
    width: 100%;
    border-collapse: collapse;
}

.woocommerce-account .gr-recent-orders-table thead th {
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-bottom: 2px solid #ECD67E;
    padding: 8px 12px;
    text-align: left;
}

.woocommerce-account .gr-recent-orders-table tbody td {
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    font-size: 14px;
    padding: 10px 12px;
    border-bottom: 1px solid #eee;
    vertical-align: middle;
}

.woocommerce-account .gr-recent-orders-table tbody tr:nth-child(even) {
    background: #fafafa;
}

.woocommerce-account .gr-recent-orders-table tbody tr:hover {
    background: rgba(236, 214, 126, 0.08);
}

.woocommerce-account .gr-recent-orders-table a {
    color: #C5A84A;
    text-decoration: none;
}

.woocommerce-account .gr-recent-orders-table a:hover {
    text-decoration: underline;
}

/* ---------------------------------------------------------------------------
   14f. Order Status Dots
   --------------------------------------------------------------------------- */

.woocommerce-account .gr-status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 6px;
    vertical-align: middle;
}

.woocommerce-account .gr-status-processing  { background: #C5A84A; }
.woocommerce-account .gr-status-completed   { background: #388E3C; }
.woocommerce-account .gr-status-pre-ordered { background: #ECD67E; }
.woocommerce-account .gr-status-on-hold     { background: #F57C00; }
.woocommerce-account .gr-status-pending      { background: #999; }
.woocommerce-account .gr-status-cancelled    { background: #333; }
.woocommerce-account .gr-status-refunded     { background: #333; }

/* ---------------------------------------------------------------------------
   14g. View Button + View All Orders Link
   --------------------------------------------------------------------------- */

.woocommerce-account .gr-view-btn {
    display: inline-block;
    padding: 4px 14px;
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    font-size: 12px;
    color: #C5A84A !important;
    border: 1px solid #C5A84A;
    text-decoration: none !important;
    transition: background 0.2s ease, color 0.2s ease;
}

.woocommerce-account .gr-view-btn:hover {
    background: #C5A84A;
    color: #fff !important;
    text-decoration: none !important;
}

.woocommerce-account .gr-view-all-orders {
    text-align: right;
    padding: 12px 0 0;
}

.woocommerce-account .gr-view-all-orders a {
    font-family: "Conv_Poppins-Medium", "Poppins", sans-serif;
    font-size: 13px;
    color: #C5A84A;
    text-decoration: none;
    transition: color 0.2s ease;
}

.woocommerce-account .gr-view-all-orders a:hover {
    color: #ECD67E;
    text-decoration: none;
}

/* ---------------------------------------------------------------------------
   14h. No Orders Message
   --------------------------------------------------------------------------- */

.woocommerce-account .gr-no-orders {
    font-family: "Conv_Poppins-Regular", "Poppins", sans-serif;
    font-size: 14px;
    color: #999;
    padding: 20px 0;
}

/* ---------------------------------------------------------------------------
   14i. Dashboard Responsive  —  768px (Tablet)
   --------------------------------------------------------------------------- */

@media (max-width: 768px) {
    .woocommerce-account .gr-dashboard-greeting {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        padding: 16px 20px;
    }

    .woocommerce-account .gr-dashboard-greeting h2 {
        font-size: 18px;
    }

    .woocommerce-account .gr-stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .woocommerce-account .gr-stat-card {
        padding: 18px 14px;
    }

    .woocommerce-account .gr-stat-number {
        font-size: 24px;
    }

    .woocommerce-account .gr-stat-card:first-child .gr-stat-number {
        font-size: 26px;
    }

    .woocommerce-account .gr-recent-orders-table thead {
        display: none;
    }

    .woocommerce-account .gr-recent-orders-table tbody td {
        display: block;
        padding: 4px 12px;
        border-bottom: none;
        font-size: 13px;
    }

    .woocommerce-account .gr-recent-orders-table tbody td:first-child {
        padding-top: 12px;
    }

    .woocommerce-account .gr-recent-orders-table tbody td:last-child {
        padding-bottom: 12px;
        border-bottom: 1px solid #eee;
    }

    .woocommerce-account .gr-recent-orders-table tbody td::before {
        content: attr(data-title) ": ";
        font-family: "Conv_Poppins-Medium", "Poppins", sans-serif;
        font-weight: 500;
        font-size: 12px;
        color: #666;
    }

    .woocommerce-account .gr-view-btn {
        display: inline-block;
        margin-top: 4px;
    }
}

/* ---------------------------------------------------------------------------
   14j. Dashboard Responsive  —  480px (Small Mobile)
   --------------------------------------------------------------------------- */

@media (max-width: 480px) {
    .woocommerce-account .gr-dashboard-greeting .gr-member-since {
        display: none;
    }

    .woocommerce-account .gr-stats-grid {
        grid-template-columns: 1fr;
    }

    .woocommerce-account .gr-stat-card {
        flex-direction: row;
        justify-content: space-between;
        padding: 12px 16px;
    }

    .woocommerce-account .gr-stat-number {
        order: 2;
        font-size: 24px;
    }

    .woocommerce-account .gr-stat-card:first-child .gr-stat-number {
        font-size: 26px;
    }

    .woocommerce-account .gr-stat-label {
        order: 1;
        margin-top: 0;
    }
}

/* ==========================================================================
   15. MOBILE HORIZONTAL SCROLL NAV  —  Phase 4
   ========================================================================== */

@media (max-width: 768px) {
    .woocommerce-account .woocommerce-MyAccount-navigation ul {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
        gap: 8px;
        padding-bottom: 8px;
        mask-image: linear-gradient(to right, black 85%, transparent 100%);
        -webkit-mask-image: linear-gradient(to right, black 85%, transparent 100%);
    }

    .woocommerce-account .woocommerce-MyAccount-navigation ul li {
        flex: 0 0 auto;
        scroll-snap-align: start;
    }

    /* Remove desktop left-border indicator on mobile */
    .woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active {
        box-shadow: none;
    }
}


/* === SPA v1.3.11 sidebar trim — locked 2026-05-07 ===
 * Reduces WC My Account sidebar width to free space for content panels.
 * Mobile (<=767px) untouched — uses native inline-block stack from theme.
 * Applies to all My Account pages so menu doesn't shift between tabs.
 */
@media (min-width: 768px) {
	.woocommerce-account .accountWrap .woocommerce-MyAccount-navigation {
		width: 19% !important;
	}
	.woocommerce-account .accountWrap .woocommerce-MyAccount-content {
		width: 77% !important;
		padding: 20px 24px !important;
	}
	.accountWrap .woocommerce-MyAccount-navigation li a {
		padding: 11px 14px !important;
		font-size: 13px !important;
		line-height: 17px !important;
		letter-spacing: 0.3px !important;
	}
	.accountWrap .woocommerce-MyAccount-navigation li,
	.page-loaded .accountWrap .woocommerce-MyAccount-navigation li {
		-webkit-clip-path: polygon(90% 0%, 98% 50%, 88% 100%, 0% 100%, 0 50%, 0% 0%) !important;
		clip-path: polygon(90% 0%, 98% 50%, 88% 100%, 0% 100%, 0 50%, 0% 0%) !important;
	}
}
