/**
 * Pumpkin Duke — account.css
 * My Account — all states: login, register, dashboard,
 * orders, view order, addresses, forms, password.
 * Built by The Hollowed Ones.
 */

.account-page { padding-bottom: var(--space-10); }

.account-layout {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: var(--space-8);
    align-items: start;
}

/* ==========================================
   SIDEBAR
   ========================================== */
.account-sidebar { position: sticky; top: var(--space-6); display: flex; flex-direction: column; gap: var(--space-4); }

.account-nav {
    background-color: var(--color-surface-1);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    overflow: hidden;
}

.account-nav-identity {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-5);
    border-bottom: 1px solid var(--color-border);
    background-color: var(--color-surface-2);
}

.account-nav-avatar {
    width: 44px; height: 44px;
    border-radius: 50%;
    background-color: var(--color-primary-glow);
    border: 1px solid rgba(196, 123, 58, 0.3);
    display: flex; align-items: center; justify-content: center;
    font-family: var(--font-display);
    font-size: var(--text-small);
    font-weight: 700;
    color: var(--color-primary);
    flex-shrink: 0;
    letter-spacing: 0.04em;
}

.account-nav-identity-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

.account-nav-name {
    font-size: var(--text-small); font-weight: 500; color: var(--color-white);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.account-nav-role { font-size: var(--text-micro); color: var(--color-gray-dark); letter-spacing: 0.08em; text-transform: uppercase; }

.account-nav-list { list-style: none; padding: var(--space-2) 0; margin: 0; }
.account-nav-list li { list-style: none; }

.account-nav-list li a {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-5);
    font-size: var(--text-small);
    color: var(--color-gray);
    text-decoration: none;
    transition: color var(--t-fast), background-color var(--t-fast);
    letter-spacing: 0.02em;
}

.account-nav-list li a svg { flex-shrink: 0; }
.account-nav-list li a:hover { color: var(--color-white); background-color: var(--color-surface-2); }

.account-nav-list li.is-active a,
.account-nav-list li.woocommerce-MyAccount-navigation-link--active a {
    color: var(--color-primary);
    background-color: var(--color-primary-glow);
    border-right: 2px solid var(--color-primary);
}

.account-nav-list li.woocommerce-MyAccount-navigation-link--customer-logout a {
    color: var(--color-gray-dark);
    margin-top: var(--space-2);
    border-top: 1px solid var(--color-border-soft);
    padding-top: var(--space-4);
}

.account-nav-list li.woocommerce-MyAccount-navigation-link--customer-logout a:hover {
    color: var(--color-danger-text);
    background-color: rgba(139, 58, 58, 0.08);
}

.account-sidebar-brand {
    padding: var(--space-4) var(--space-5);
    background-color: var(--color-surface-1);
    border: 1px solid var(--color-border);
    border-left: 3px solid var(--color-primary);
    border-radius: var(--radius-md);
}

.account-sidebar-brand p { font-size: var(--text-small); color: var(--color-gray); font-style: italic; margin: 0 0 var(--space-1); line-height: 1.6; }
.account-sidebar-brand span { font-size: var(--text-micro); color: var(--color-gray-dark); letter-spacing: 0.08em; text-transform: uppercase; }

/* ==========================================
   DASHBOARD
   ========================================== */
.account-dashboard { display: flex; flex-direction: column; gap: var(--space-6); }

.account-dashboard-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-5);
    padding-bottom: var(--space-6);
    border-bottom: 1px solid var(--color-border);
}

.account-dashboard-label { display: block; font-size: var(--text-micro); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-primary); margin-bottom: var(--space-2); }
.account-dashboard-title { font-family: var(--font-display); font-size: clamp(28px, 3vw, 44px); font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase; color: var(--color-white); line-height: 1; margin: 0 0 var(--space-3); }
.account-dashboard-sub { font-size: var(--text-small); color: var(--color-gray-dark); margin: 0; line-height: 1.6; }

.account-logout-link { color: var(--color-gray-dark); text-decoration: underline; text-underline-offset: 3px; font-size: var(--text-micro); margin-left: var(--space-3); transition: color var(--t-fast); }
.account-logout-link:hover { color: var(--color-danger-text); }

.account-dashboard-badge {
    display: flex; flex-direction: column; align-items: center; gap: var(--space-2);
    padding: var(--space-4) var(--space-5);
    background-color: var(--color-primary-glow);
    border: 1px solid rgba(196, 123, 58, 0.2);
    border-radius: var(--radius-md);
    color: var(--color-primary); flex-shrink: 0;
}

.account-dashboard-badge span { font-size: var(--text-micro); font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-primary); }

.account-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-4); }

.account-stat {
    display: flex; flex-direction: column; gap: var(--space-2);
    padding: var(--space-5);
    background-color: var(--color-surface-1);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.account-stat-value { font-family: var(--font-display); font-size: var(--text-h4); font-weight: 600; color: var(--color-white); line-height: 1; }
.account-stat-value .woocommerce-Price-amount { color: var(--color-primary); }
.account-stat-label { font-size: var(--text-micro); color: var(--color-gray-dark); letter-spacing: 0.08em; text-transform: uppercase; }

.account-stat-status--completed  { color: var(--color-success-text); }
.account-stat-status--processing { color: var(--color-primary); }
.account-stat-status--pending    { color: var(--color-gray); }
.account-stat-status--cancelled,
.account-stat-status--failed     { color: var(--color-danger-text); }

.account-section-title { font-family: var(--font-display); font-size: var(--text-h4); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-white); margin: 0 0 var(--space-4); }

.account-quick-links-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-4); }

.account-quick-link {
    display: flex; align-items: flex-start; gap: var(--space-4);
    padding: var(--space-5);
    background-color: var(--color-surface-1);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    text-decoration: none;
    transition: border-color var(--t-base), background-color var(--t-base);
}

.account-quick-link:hover { border-color: var(--color-primary); background-color: var(--color-primary-glow); }
.account-quick-link svg { color: var(--color-primary); flex-shrink: 0; margin-top: 2px; }
.account-quick-link span { display: block; font-size: var(--text-small); font-weight: 500; color: var(--color-white); margin-bottom: var(--space-1); }
.account-quick-link p { font-size: var(--text-micro); color: var(--color-gray-dark); margin: 0; line-height: 1.5; }

.account-syndicate-note {
    display: flex; gap: var(--space-4);
    padding: var(--space-5);
    background-color: var(--color-surface-1);
    border: 1px solid var(--color-border);
    border-left: 3px solid var(--color-primary);
    border-radius: var(--radius-md);
}

.account-syndicate-icon { color: var(--color-primary); flex-shrink: 0; margin-top: 2px; }
.account-syndicate-content span { display: block; font-size: var(--text-small); font-weight: 500; color: var(--color-white); margin-bottom: var(--space-2); }
.account-syndicate-content p { font-size: var(--text-small); color: var(--color-gray-dark); margin: 0; line-height: 1.6; }
.account-syndicate-content a { color: var(--color-primary); text-decoration: underline; text-underline-offset: 3px; }

/* ==========================================
   ACCOUNT CONTENT — SHARED FORM STYLES
   ========================================== */
.account-content { min-width: 0; }

.woocommerce-MyAccount-content h2 {
    font-family: var(--font-display);
    font-size: var(--text-h4);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-white);
    margin: 0 0 var(--space-5);
    padding-bottom: var(--space-4);
    border-bottom: 1px solid var(--color-border);
}

.woocommerce-MyAccount-content .form-row,
.woocommerce-MyAccount-content .woocommerce-form-row {
    margin: 0 0 var(--space-4) !important;
    padding: 0 !important;
    float: none !important;
    width: 100% !important;
}

.woocommerce-MyAccount-content .form-row-first,
.woocommerce-MyAccount-content .form-row-last {
    width: calc(50% - var(--space-2)) !important;
    display: inline-block !important;
}

.woocommerce-MyAccount-content .form-row-first { margin-right: var(--space-4) !important; }

.woocommerce-MyAccount-content label {
    font-size: var(--text-micro) !important;
    font-weight: 600 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    color: var(--color-gray-dark) !important;
    display: block !important;
    margin-bottom: var(--space-2) !important;
}

.woocommerce-MyAccount-content input[type="text"],
.woocommerce-MyAccount-content input[type="email"],
.woocommerce-MyAccount-content input[type="password"],
.woocommerce-MyAccount-content input[type="tel"],
.woocommerce-MyAccount-content select,
.woocommerce-MyAccount-content textarea {
    width: 100% !important;
    background-color: var(--color-surface-2) !important;
    color: var(--color-white) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-base) !important;
    padding: 12px 16px !important;
    font-family: var(--font-main) !important;
    font-size: var(--text-body) !important;
    font-weight: 300 !important;
    outline: none !important;
    transition: border-color var(--t-base), box-shadow var(--t-base) !important;
    appearance: none !important;
    box-shadow: none !important;
}

.woocommerce-MyAccount-content input:focus,
.woocommerce-MyAccount-content select:focus,
.woocommerce-MyAccount-content textarea:focus {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 3px var(--color-primary-glow) !important;
}

.woocommerce-MyAccount-content fieldset { border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-5); margin: var(--space-5) 0; }
.woocommerce-MyAccount-content fieldset legend { font-size: var(--text-micro); font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-gray-dark); padding: 0 var(--space-2); }

.woocommerce-MyAccount-content .button,
.woocommerce-MyAccount-content button[type="submit"] {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 14px 32px;
    font-family: var(--font-main); font-size: var(--text-small); font-weight: 500;
    letter-spacing: 0.1em; text-transform: uppercase;
    background-color: var(--color-primary); color: #0d0d0d;
    border: 1px solid var(--color-primary); border-radius: var(--radius-base);
    cursor: pointer; transition: background-color var(--t-base), box-shadow var(--t-base);
    text-decoration: none;
}

.woocommerce-MyAccount-content .button:hover,
.woocommerce-MyAccount-content button[type="submit"]:hover {
    background-color: var(--color-primary-light);
    border-color: var(--color-primary-light);
    box-shadow: var(--shadow-brass);
    color: #0d0d0d;
}

/* ==========================================
   ORDERS TABLE
   ========================================== */
.woocommerce-orders-table { width: 100%; border-collapse: collapse; }
.woocommerce-orders-table thead tr { border-bottom: 1px solid var(--color-border); }

.woocommerce-orders-table th {
    font-size: var(--text-micro); font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
    color: var(--color-gray-dark); padding: var(--space-3) var(--space-4); text-align: left;
}

.woocommerce-orders-table td {
    padding: var(--space-4); font-size: var(--text-small); color: var(--color-gray);
    border-bottom: 1px solid var(--color-border-soft); vertical-align: middle;
}

.woocommerce-orders-table tr:last-child td { border-bottom: none; }
.woocommerce-orders-table td a { color: var(--color-primary); text-decoration: none; font-weight: 500; transition: color var(--t-fast); }
.woocommerce-orders-table td a:hover { color: var(--color-primary-light); }

.woocommerce-orders-table__cell-order-status { font-size: var(--text-micro) !important; font-weight: 600 !important; letter-spacing: 0.06em !important; text-transform: uppercase !important; }

.woocommerce-orders-table__row--status-completed td { color: var(--color-gray); }
.woocommerce-orders-table__row--status-completed .woocommerce-orders-table__cell-order-status { color: var(--color-success-text) !important; }
.woocommerce-orders-table__row--status-processing .woocommerce-orders-table__cell-order-status { color: var(--color-primary) !important; }
.woocommerce-orders-table__row--status-cancelled .woocommerce-orders-table__cell-order-status,
.woocommerce-orders-table__row--status-failed .woocommerce-orders-table__cell-order-status { color: var(--color-danger-text) !important; }

.woocommerce-orders-table .woocommerce-button {
    display: inline-flex; align-items: center; padding: 6px 14px;
    font-size: var(--text-micro); font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase;
    background-color: transparent; color: var(--color-gray);
    border: 1px solid var(--color-border-mid); border-radius: var(--radius-base);
    text-decoration: none; transition: color var(--t-fast), border-color var(--t-fast), background-color var(--t-fast);
    margin-right: var(--space-2);
}

.woocommerce-orders-table .woocommerce-button:hover { color: var(--color-white); border-color: var(--color-primary); background-color: var(--color-primary-glow); }

.woocommerce-pagination { display: flex; gap: var(--space-3); margin-top: var(--space-5); }
.woocommerce-pagination .woocommerce-button { padding: 10px 20px; }

/* ==========================================
   LOGIN PAGE
   ========================================== */
.account-login-page { padding: var(--space-8) 0 var(--space-10); }
.account-login-header { text-align: center; margin-bottom: var(--space-8); }
.account-login-label { display: block; font-size: var(--text-micro); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-primary); margin-bottom: var(--space-2); }
.account-login-title { font-family: var(--font-display); font-size: clamp(28px, 3vw, 44px); font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; color: var(--color-white); line-height: 1; margin: 0 0 var(--space-3); }
.account-login-sub { font-size: var(--text-small); color: var(--color-gray-dark); margin: 0; }

.account-login-layout { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-7); max-width: 900px; margin: 0 auto; }

.account-login-box { background-color: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-7); }
.account-login-box--register { background-color: var(--color-surface-2); }

.account-login-box-title { font-family: var(--font-display); font-size: var(--text-h4); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-white); margin: 0 0 var(--space-2); }
.account-login-box-sub { font-size: var(--text-small); color: var(--color-gray-dark); margin: 0 0 var(--space-6); padding-bottom: var(--space-5); border-bottom: 1px solid var(--color-border-soft); }

.account-form-group { display: flex; flex-direction: column; gap: var(--space-2); margin-bottom: var(--space-4); }
.account-form-label { font-size: var(--text-micro); font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-gray-dark); }
.account-form-required { color: var(--color-danger-text); margin-left: 2px; }

.account-form-input {
    width: 100%; background-color: var(--color-surface-2); color: var(--color-white);
    border: 1px solid var(--color-border); border-radius: var(--radius-base);
    padding: 12px 16px; font-family: var(--font-main); font-size: var(--text-body); font-weight: 300;
    outline: none; transition: border-color var(--t-base), box-shadow var(--t-base);
}

.account-login-box--register .account-form-input { background-color: var(--color-surface-3); }

.account-form-input:focus { border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-glow); }

.account-form-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--space-5); gap: var(--space-3); }

.account-form-remember { display: flex; align-items: center; gap: var(--space-2); font-size: var(--text-small); color: var(--color-gray); cursor: pointer; }

.account-checkbox {
    width: 16px; height: 16px;
    background-color: var(--color-surface-2);
    border: 1px solid var(--color-border-mid);
    border-radius: var(--radius-sm);
    appearance: none; -webkit-appearance: none;
    cursor: pointer; flex-shrink: 0; position: relative;
    transition: background-color var(--t-fast), border-color var(--t-fast);
}

.account-checkbox:checked { background-color: var(--color-primary); border-color: var(--color-primary); }
.account-checkbox:checked::after { content: ''; position: absolute; left: 4px; top: 1px; width: 5px; height: 9px; border: 2px solid #0d0d0d; border-top: none; border-left: none; transform: rotate(45deg); }

.account-lost-password { font-size: var(--text-micro); color: var(--color-gray-dark); text-decoration: underline; text-underline-offset: 3px; transition: color var(--t-fast); white-space: nowrap; }
.account-lost-password:hover { color: var(--color-primary); }

.account-form-note { font-size: var(--text-small); color: var(--color-gray-dark); line-height: 1.6; margin: 0 0 var(--space-4); padding: var(--space-3) var(--space-4); background-color: var(--color-surface-3); border-radius: var(--radius-base); border: 1px solid var(--color-border-soft); }
.account-submit-btn { margin-top: var(--space-2); }

/* ==========================================
   VIEW ORDER
   ========================================== */
.account-view-order { display: flex; flex-direction: column; gap: var(--space-6); }

.account-order-header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding-bottom: var(--space-5); border-bottom: 1px solid var(--color-border); flex-wrap: wrap; }
.account-order-header-info { display: flex; align-items: center; gap: var(--space-3); }
.account-order-number { font-family: var(--font-display); font-size: var(--text-h4); font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-white); }

.account-order-status { display: inline-flex; align-items: center; padding: 4px 12px; border-radius: 20px; font-size: var(--text-micro); font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; background-color: var(--color-surface-3); color: var(--color-gray); }
.account-order-status--completed  { background-color: rgba(74,124,89,0.15); color: var(--color-success-text); }
.account-order-status--processing { background-color: var(--color-primary-glow); color: var(--color-primary); }
.account-order-status--pending    { background-color: var(--color-surface-3); color: var(--color-gray); }
.account-order-status--cancelled,
.account-order-status--failed     { background-color: rgba(139,58,58,0.15); color: var(--color-danger-text); }

.account-order-date { font-size: var(--text-small); color: var(--color-gray-dark); }
.account-order-section-title { font-family: var(--font-display); font-size: var(--text-h5); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-white); margin: 0 0 var(--space-4); }

.account-order-items,
.account-order-notes,
.account-order-address { display: flex; flex-direction: column; gap: var(--space-3); }

.account-order-item { display: grid; grid-template-columns: 64px 1fr auto; gap: var(--space-4); align-items: center; padding: var(--space-4) 0; border-bottom: 1px solid var(--color-border-soft); }
.account-order-item:last-child { border-bottom: none; }

.account-order-item-image img { width: 64px !important; height: 64px !important; object-fit: cover; border-radius: var(--radius-base); border: 1px solid var(--color-border); display: block; }

.account-order-item-name { display: block; font-size: var(--text-small); font-weight: 500; color: var(--color-white); margin-bottom: var(--space-1); }
.account-order-item-name a { color: var(--color-white); text-decoration: none; transition: color var(--t-fast); }
.account-order-item-name a:hover { color: var(--color-primary); }
.account-order-item-qty { display: block; font-size: var(--text-micro); color: var(--color-gray-dark); }

.account-order-item-meta { margin-top: var(--space-1); }
.account-order-item-meta dl { margin: 0; }
.account-order-item-meta dt, .account-order-item-meta dd { display: inline; font-size: var(--text-micro); color: var(--color-gray-dark); margin: 0; }
.account-order-item-meta dt::after { content: ': '; }
.account-order-item-meta dd::after { content: ' · '; }
.account-order-item-meta dd:last-of-type::after { content: ''; }

.account-order-item-total { font-size: var(--text-small); font-weight: 600; color: var(--color-primary); white-space: nowrap; }
.account-order-item-total .woocommerce-Price-amount { color: var(--color-primary); }

.account-order-totals-table { width: 100%; max-width: 360px; margin-left: auto; border-collapse: collapse; background-color: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-md); overflow: hidden; }
.account-order-totals-table tr { border-bottom: 1px solid var(--color-border-soft); }
.account-order-totals-table tr:last-child { border-bottom: none; }
.account-order-totals-table th, .account-order-totals-table td { padding: var(--space-3) var(--space-5); font-size: var(--text-small); }
.account-order-totals-table th { color: var(--color-gray-dark); font-weight: 400; font-size: var(--text-micro); letter-spacing: 0.06em; text-transform: uppercase; text-align: left; }
.account-order-totals-table td { text-align: right; color: var(--color-white); font-weight: 500; }
.account-order-total-row th { color: var(--color-white); font-weight: 600; }
.account-order-total-row td { color: var(--color-primary); font-weight: 700; font-size: var(--text-body); }
.account-order-total-row .woocommerce-Price-amount { color: var(--color-primary); }

.account-order-notes-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--space-3); }

.account-order-note { padding: var(--space-4) var(--space-5); background-color: var(--color-surface-1); border: 1px solid var(--color-border); border-left: 3px solid var(--color-primary); border-radius: var(--radius-md); }
.account-order-note-date { display: block; font-size: var(--text-micro); color: var(--color-gray-dark); letter-spacing: 0.06em; margin-bottom: var(--space-2); }
.account-order-note-text { font-size: var(--text-small); color: var(--color-gray); line-height: 1.6; }
.account-order-note-text p { margin: 0; }

.account-order-address-card { font-style: normal; font-size: var(--text-small); color: var(--color-gray); line-height: 1.8; padding: var(--space-4) var(--space-5); background-color: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-md); display: block; }
.account-order-back { padding-top: var(--space-4); border-top: 1px solid var(--color-border); }

/* ==========================================
   MY ADDRESS
   ========================================== */
.account-addresses { display: flex; flex-direction: column; gap: var(--space-5); }
.account-addresses-desc { font-size: var(--text-small); color: var(--color-gray-dark); margin: 0; line-height: 1.6; }
.account-addresses-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-5); }

.account-address-card { background-color: var(--color-surface-1); border: 1px solid var(--color-border); border-radius: var(--radius-md); overflow: hidden; }

.account-address-card-header { display: flex; align-items: center; justify-content: space-between; padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--color-border-soft); background-color: var(--color-surface-2); }
.account-address-card-title { font-size: var(--text-small); font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-white); margin: 0; }

.account-address-edit-link { display: inline-flex; align-items: center; gap: var(--space-2); font-size: var(--text-micro); color: var(--color-primary); text-decoration: none; letter-spacing: 0.06em; transition: color var(--t-fast); }
.account-address-edit-link:hover { color: var(--color-primary-light); }

.account-address-card-body { padding: var(--space-5); font-style: normal; font-size: var(--text-small); color: var(--color-gray); line-height: 1.8; display: block; }
.account-address-empty { color: var(--color-gray-dark); font-style: italic; }

.account-edit-address-actions { display: flex; align-items: center; gap: var(--space-4); margin-top: var(--space-5); padding-top: var(--space-5); border-top: 1px solid var(--color-border); }

/* ==========================================
   LOST + RESET PASSWORD
   ========================================== */
.account-lost-password,
.account-reset-password { max-width: 480px; margin: 0 auto; }

.account-lost-password-header { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--space-3); margin-bottom: var(--space-7); padding-bottom: var(--space-6); border-bottom: 1px solid var(--color-border); }
.account-lost-password-header svg { color: var(--color-primary); }
.account-lost-password-title { font-family: var(--font-display); font-size: var(--text-h3); font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-white); margin: 0; }
.account-lost-password-desc { font-size: var(--text-small); color: var(--color-gray-dark); line-height: 1.7; margin: 0; max-width: 360px; }

.account-lost-password-form { display: flex; flex-direction: column; gap: var(--space-4); }

.account-lost-password-back { text-align: center; margin-top: var(--space-4); }
.account-lost-password-back a { font-size: var(--text-small); color: var(--color-gray-dark); text-decoration: underline; text-underline-offset: 3px; transition: color var(--t-fast); }
.account-lost-password-back a:hover { color: var(--color-primary); }

.account-lost-password-confirmation-actions { display: flex; flex-direction: column; gap: var(--space-3); max-width: 480px; margin: 0 auto; }

/* ==========================================
   RESPONSIVE
   ========================================== */
@media (max-width: 1023px) {
    .account-layout { grid-template-columns: 220px 1fr; gap: var(--space-6); }
    .account-stats { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 789px) {
    .account-layout { grid-template-columns: 1fr; }
    .account-sidebar { position: static; }
    .account-nav-list { display: flex; flex-wrap: wrap; padding: var(--space-2); gap: var(--space-1); }
    .account-nav-list li { flex: 1 1 auto; }
    .account-nav-list li a { padding: var(--space-2) var(--space-3); font-size: var(--text-micro); justify-content: center; border-radius: var(--radius-base); }
    .account-nav-list li.woocommerce-MyAccount-navigation-link--active a { border-right: none; border-bottom: 2px solid var(--color-primary); }
    .account-nav-list li.woocommerce-MyAccount-navigation-link--customer-logout a { border-top: none; padding-top: var(--space-2); margin-top: 0; }
    .account-login-layout { grid-template-columns: 1fr; max-width: 480px; }
    .account-stats { grid-template-columns: repeat(2, 1fr); }
    .account-quick-links-grid { grid-template-columns: 1fr; }
    .account-dashboard-header { flex-direction: column; }
    .woocommerce-MyAccount-content .form-row-first,
    .woocommerce-MyAccount-content .form-row-last { width: 100% !important; display: block !important; margin-right: 0 !important; }
    .account-addresses-grid { grid-template-columns: 1fr; }
    .account-order-item { grid-template-columns: 56px 1fr; }
    .account-order-item-total { grid-column: 2; }
    .account-order-totals-table { max-width: 100%; }
    .account-edit-address-actions { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 479px) {
    .account-stats { grid-template-columns: 1fr 1fr; }
    .account-login-box { padding: var(--space-5); }
    .account-order-header { flex-direction: column; align-items: flex-start; }
    .woocommerce-orders-table thead { display: none; }
    .woocommerce-orders-table td { display: block; padding: var(--space-2) var(--space-4); border-bottom: none; }
    .woocommerce-orders-table td::before { content: attr(data-title) ': '; font-size: var(--text-micro); font-weight: 600; color: var(--color-gray-dark); text-transform: uppercase; letter-spacing: 0.06em; margin-right: var(--space-2); }
    .woocommerce-orders-table tr { display: block; border: 1px solid var(--color-border); border-radius: var(--radius-md); margin-bottom: var(--space-4); padding: var(--space-3) 0; }
}