/* ===========================================================
   LS My Account — Phase 1 Styles
   Plugin: ls-my-account v1.0.0

   Brand:      #499CC2 (teal) | #252531 (dark) | #E8833A (orange)
   Font:       DM Sans
   Breakpoints: 640px (mobile) | 1024px (tablet → desktop)

   Every rule is scoped under body.ls-my-account to avoid
   conflicts with Kava / Elementor / JetWooBuilder.
   =========================================================== */


/* ── Custom Properties ── */
body.ls-my-account {
    --ls-teal: #499CC2;
    --ls-teal-dark: #3a8aaf;
    --ls-teal-light: #e8f4fa;
    --ls-teal-subtle: #f0f7fb;
    --ls-dark: #252531;
    --ls-dark-muted: #374151;
    --ls-gray-100: #f8fafb;
    --ls-gray-200: #eef2f5;
    --ls-gray-300: #d1d5db;
    --ls-gray-400: #9ca3af;
    --ls-gray-500: #6b7280;
    --ls-white: #ffffff;
    --ls-orange: #E8833A;
    --ls-orange-light: #fef3eb;
    --ls-green: #10b981;
    --ls-green-light: #ecfdf5;
    --ls-red: #ef4444;
    --ls-purple: #7c3aed;
    --ls-purple-light: #f5f0ff;
    --ls-indigo: #4f46e5;
    --ls-indigo-light: #eef2ff;
    --ls-amber: #d97706;
    --ls-amber-light: #fffbeb;
    --ls-radius: 12px;
    --ls-radius-sm: 8px;
    --ls-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    --ls-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.07), 0 1px 3px rgba(0, 0, 0, 0.04);
}


/* ═══════════════════════════════════════
   KAVA / WOO-MODULE RESET

   Kava's woo-module.css uses floats and percentage widths
   for .woocommerce-MyAccount-navigation (25%) and
   .woocommerce-MyAccount-content (73%). We need to kill
   these to use flexbox.
   ═══════════════════════════════════════ */

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content {
    float: none !important;
    width: auto !important;
    clear: none !important;
}

/* Kill Kava's ::after clearfix if present */
body.ls-my-account.woocommerce-account .woocommerce::after {
    display: none !important;
    content: none !important;
}

/* Reset any Elementor column widths on the account page container */
body.ls-my-account.woocommerce-account .elementor-column-wrap,
body.ls-my-account.woocommerce-account .elementor-widget-wrap {
    padding: 0 !important;
}


/* ═══════════════════════════════════════
   PAGE LAYOUT

   Specificity strategy:
   Kava woo-module uses .woocommerce-account .woocommerce (0,2,0).
   We use body.ls-my-account.woocommerce-account .woocommerce (0,3,1)
   to win without !important.
   ═══════════════════════════════════════ */

/* Target only the My Account content .woocommerce — NOT the cart widget in the header.
   The cart widget also has class .woocommerce and was being affected by these rules. */
body.ls-my-account.woocommerce-account .jet-theme-core-document__inner > .woocommerce,
body.ls-my-account.woocommerce-account .site-content .woocommerce,
body.ls-my-account.woocommerce-account .entry-content > .woocommerce {
    display: flex !important;
    flex-wrap: nowrap;
    gap: 32px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 32px 40px;
    font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Undo any bleed into the header cart widget */
body.ls-my-account.woocommerce-account .jet-blocks-cart .woocommerce,
body.ls-my-account.woocommerce-account .jet-theme-core-location--header-location .woocommerce {
    display: block !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
    flex-wrap: initial !important;
    font-family: inherit !important;
}

/* Add spacing between header and page content */
body.ls-my-account.woocommerce-account #jet-theme-core-document .jet-theme-core-document__inner {
    padding-top: 20px;
}

/* Kill Kava's float-based layout — it conflicts with flexbox (content area only) */
body.ls-my-account.woocommerce-account .jet-theme-core-document__inner > .woocommerce::after,
body.ls-my-account.woocommerce-account .jet-theme-core-document__inner > .woocommerce::before {
    display: none;
}

/* Override Kava / Elementor full-width wrappers (content area only — NOT header/footer) */
body.ls-my-account.woocommerce-account .jet-theme-core-document__inner > .woocommerce .content-area,
body.ls-my-account.woocommerce-account .jet-theme-core-document__inner > .woocommerce .site-main,
body.ls-my-account.woocommerce-account .jet-theme-core-document__inner > .woocommerce .site-content {
    width: 100% !important;
    max-width: none !important;
    float: none !important;
}

/* Hide any theme sidebar on account pages */
body.ls-my-account.woocommerce-account .sidebar,
body.ls-my-account.woocommerce-account #secondary {
    display: none !important;
}

/* Reset Kava woo-module nav float/width overrides */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content {
    float: none !important;
}


/* ═══════════════════════════════════════
   SIDEBAR NAVIGATION
   ═══════════════════════════════════════ */

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation {
    width: 220px !important;
    flex-shrink: 0;
    align-self: flex-start;
    position: sticky;
    top: 32px;
    padding: 0 !important;
    margin: 0 !important;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 4px !important;
    background: var(--ls-white);
    border: none !important;
    border-radius: var(--ls-radius);
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    overflow: hidden;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    border: none !important;
    text-transform: none !important;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    display: flex !important;
    align-items: center;
    gap: 12px;
    padding: 11px 18px !important;
    font-size: 14px !important;
    font-weight: 500;
    color: var(--ls-dark-muted) !important;
    text-decoration: none !important;
    border: none !important;
    border-radius: 8px;
    transition: all 0.15s ease;
    line-height: 1.4;
    background: none !important;
    margin: 1px 0;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
    background: var(--ls-gray-100) !important;
    color: var(--ls-dark) !important;
}

/* Active state */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    background: var(--ls-teal-light) !important;
    color: var(--ls-teal) !important;
    font-weight: 600;
}

/* Logout separator */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout {
    margin-top: 4px !important;
    padding-top: 4px !important;
    border-top: 1px solid #eef2f5 !important;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout a {
    color: var(--ls-red) !important;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout a:hover {
    background: #fef2f2 !important;
}


/* ── Nav icons ──
   Icons removed for a clean text-only navigation.
   The ::before pseudo-element is hidden to prevent any
   theme or WooCommerce default icons from appearing.
   ──────────────────────────────────────── */

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation ul li a::before {
    display: none !important;
}


/* ═══════════════════════════════════════
   MAIN CONTENT AREA
   ═══════════════════════════════════════ */

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content {
    flex: 1;
    min-width: 0;
    width: auto !important;
    max-width: none !important;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content h2,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content h3 {
    font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--ls-dark);
}

/* Default paragraph text */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content p {
    color: var(--ls-dark-muted);
    font-size: 14px;
    line-height: 1.6;
}


/* ── Shop tables (Orders, etc.) ── */

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.shop_table {
    border: 1px solid var(--ls-gray-200);
    border-radius: var(--ls-radius);
    overflow: hidden;
    border-collapse: collapse;
    width: 100%;
    background: var(--ls-white);
    box-shadow: var(--ls-shadow);
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.shop_table thead th {
    background: var(--ls-gray-100);
    padding: 12px 24px;
    font-size: 11px;
    font-weight: 600;
    color: var(--ls-gray-500);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-bottom: 1px solid var(--ls-gray-200);
    text-align: left;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.shop_table tbody td {
    padding: 16px 24px;
    font-size: 14px;
    color: var(--ls-dark-muted);
    border-bottom: 1px solid var(--ls-gray-200);
    vertical-align: middle;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.shop_table tbody tr:last-child td {
    border-bottom: none;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.shop_table td a {
    color: var(--ls-teal);
    font-weight: 600;
    text-decoration: none;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.shop_table td a:hover {
    color: var(--ls-teal-dark);
}


/* ── Order status badges ── */

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .order-status,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content mark.order-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    background: var(--ls-gray-100) !important;
    color: var(--ls-gray-500);
}

/* WooCommerce default statuses */
body.ls-my-account.woocommerce-account .order-status-processing { background: var(--ls-teal-light) !important; color: var(--ls-teal) !important; }
body.ls-my-account.woocommerce-account .order-status-completed  { background: var(--ls-green-light) !important; color: var(--ls-green) !important; }
body.ls-my-account.woocommerce-account .order-status-on-hold    { background: var(--ls-amber-light) !important; color: var(--ls-amber) !important; }
body.ls-my-account.woocommerce-account .order-status-pending     { background: var(--ls-amber-light) !important; color: var(--ls-amber) !important; }
body.ls-my-account.woocommerce-account .order-status-cancelled,
body.ls-my-account.woocommerce-account .order-status-refunded,
body.ls-my-account.woocommerce-account .order-status-failed      { background: #fef2f2 !important; color: var(--ls-red) !important; }

/* LabelSwift custom statuses (LS Artwork Upload plugin) */
body.ls-my-account.woocommerce-account .order-status-awaiting-artwork { background: var(--ls-orange-light) !important; color: var(--ls-orange) !important; }
body.ls-my-account.woocommerce-account .order-status-artwork-received { background: var(--ls-teal-light) !important;   color: var(--ls-teal) !important; }
body.ls-my-account.woocommerce-account .order-status-proof-sent       { background: var(--ls-purple-light) !important; color: var(--ls-purple) !important; }
body.ls-my-account.woocommerce-account .order-status-art-approved     { background: var(--ls-green-light) !important;  color: var(--ls-green) !important; }

/* Phase 2 statuses (will be registered in LS Artwork Upload) */
body.ls-my-account.woocommerce-account .order-status-in-production { background: var(--ls-indigo-light) !important; color: var(--ls-indigo) !important; }
body.ls-my-account.woocommerce-account .order-status-shipped       { background: var(--ls-amber-light) !important;  color: var(--ls-amber) !important; }


/* ── Action buttons ── */

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Button,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .button {
    background: var(--ls-teal);
    color: var(--ls-white);
    border: none;
    padding: 10px 22px;
    border-radius: var(--ls-radius-sm);
    font-size: 14px;
    font-weight: 600;
    font-family: 'DM Sans', sans-serif;
    cursor: pointer;
    transition: background 0.15s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    line-height: 1.4;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Button:hover,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .button:hover {
    background: var(--ls-teal-dark);
    color: var(--ls-white);
}

/* View order button in table — smaller */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.shop_table .button {
    padding: 6px 14px;
    font-size: 12px;
}

/* Outline button variant */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .button--outline {
    background: transparent;
    border: 1px solid var(--ls-gray-300);
    color: var(--ls-dark-muted);
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .button--outline:hover {
    background: var(--ls-gray-100);
    color: var(--ls-dark);
}


/* ── Form fields ── */

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-EditAccountForm,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-address-fields {
    background: var(--ls-white);
    border: 1px solid var(--ls-gray-200);
    border-radius: var(--ls-radius);
    padding: 28px;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content form label {
    font-size: 12px;
    font-weight: 600;
    color: var(--ls-gray-500);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 6px;
    display: block;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content form input[type="text"],
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content form input[type="email"],
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content form input[type="tel"],
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content form input[type="password"],
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content form select,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content form textarea {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid var(--ls-gray-300);
    border-radius: var(--ls-radius-sm);
    font-size: 14px;
    font-family: 'DM Sans', sans-serif;
    color: var(--ls-dark);
    background: var(--ls-white);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    box-sizing: border-box;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content form input:focus,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content form select:focus,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content form textarea:focus {
    border-color: var(--ls-teal);
    outline: none;
    box-shadow: 0 0 0 3px rgba(73, 156, 194, 0.12);
}


/* ── Address cards ── */

body.ls-my-account.woocommerce-account .woocommerce-Addresses {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

body.ls-my-account.woocommerce-account .woocommerce-Addresses .woocommerce-Address {
    background: var(--ls-white);
    border: 1px solid var(--ls-gray-200);
    border-radius: var(--ls-radius);
    padding: 24px;
}

body.ls-my-account.woocommerce-account .woocommerce-Addresses .woocommerce-Address header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--ls-gray-200);
}

body.ls-my-account.woocommerce-account .woocommerce-Addresses .woocommerce-Address header h3 {
    font-size: 15px;
    font-weight: 600;
    margin: 0;
}

body.ls-my-account.woocommerce-account .woocommerce-Addresses .woocommerce-Address header a {
    background: transparent;
    border: 1px solid var(--ls-gray-300);
    border-radius: 6px;
    padding: 6px 14px;
    font-size: 12px;
    font-weight: 600;
    color: var(--ls-teal);
    text-decoration: none;
    transition: background 0.15s ease;
}

body.ls-my-account.woocommerce-account .woocommerce-Addresses .woocommerce-Address header a:hover {
    background: var(--ls-teal-light);
}

body.ls-my-account.woocommerce-account .woocommerce-Addresses .woocommerce-Address address {
    font-size: 14px;
    color: var(--ls-dark-muted);
    line-height: 1.7;
    font-style: normal;
}


/* ── WooCommerce notices ── */

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error {
    border-radius: var(--ls-radius-sm);
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    margin-bottom: 20px;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message {
    border-left-color: var(--ls-teal);
}


/* ── Pagination ── */

body.ls-my-account.woocommerce-account .woocommerce-pagination {
    margin-top: 20px;
    text-align: center;
}

body.ls-my-account.woocommerce-account .woocommerce-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

body.ls-my-account.woocommerce-account .woocommerce-pagination .page-numbers li {
    list-style: none;
}

body.ls-my-account.woocommerce-account .woocommerce-pagination .page-numbers a,
body.ls-my-account.woocommerce-account .woocommerce-pagination .page-numbers span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--ls-radius-sm);
    font-size: 13px;
    font-weight: 500;
    color: var(--ls-dark-muted);
    text-decoration: none;
    transition: background 0.15s ease;
}

body.ls-my-account.woocommerce-account .woocommerce-pagination .page-numbers a:hover {
    background: var(--ls-gray-100);
}

body.ls-my-account.woocommerce-account .woocommerce-pagination .page-numbers span.current {
    background: var(--ls-teal);
    color: var(--ls-white);
    font-weight: 600;
}


/* ═══════════════════════════════════════
   MOBILE NAV TOGGLE
   ═══════════════════════════════════════ */

body.ls-my-account.woocommerce-account .ls-mobile-nav-toggle {
    display: none; /* shown via media query */
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 14px 20px;
    margin-bottom: 16px;
    background: var(--ls-white);
    border: 1px solid var(--ls-gray-200);
    border-radius: var(--ls-radius);
    box-shadow: var(--ls-shadow);
    cursor: pointer;
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: var(--ls-dark);
}

body.ls-my-account.woocommerce-account .ls-mobile-nav-toggle svg {
    flex-shrink: 0;
}

body.ls-my-account.woocommerce-account .ls-mobile-nav-toggle .ls-nav-label {
    flex: 1;
    text-align: left;
}

body.ls-my-account.woocommerce-account .ls-mobile-nav-toggle .ls-nav-chevron {
    transition: transform 0.2s ease;
}

body.ls-my-account.woocommerce-account .ls-nav-open .ls-mobile-nav-toggle .ls-nav-chevron {
    transform: rotate(180deg);
}

/* Overlay backdrop */
body.ls-my-account.woocommerce-account .ls-nav-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: 998;
}

body.ls-my-account.woocommerce-account .ls-nav-open ~ .ls-nav-overlay,
body.ls-my-account.ls-nav-active .ls-nav-overlay {
    display: block;
}


/* ═══════════════════════════════════════
   RESPONSIVE: < 1024px (Tablet)
   ═══════════════════════════════════════ */

@media (max-width: 1023px) {
    body.ls-my-account.woocommerce-account .jet-theme-core-document__inner > .woocommerce,
    body.ls-my-account.woocommerce-account .site-content .woocommerce,
    body.ls-my-account.woocommerce-account .entry-content > .woocommerce {
        flex-direction: column;
        gap: 0;
        padding: 24px;
    }

    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation {
        width: 100%;
        position: relative;
        top: auto;
        margin-bottom: 24px;
    }

    body.ls-my-account.woocommerce-account .ls-mobile-nav-toggle {
        display: flex;
    }

    /* Dropdown nav: hidden by default, slides down below toggle */
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation ul {
        display: none;
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        height: auto;
        max-height: 0;
        overflow: hidden;
        border-radius: 0 0 12px 12px;
        z-index: 10;
        padding: 0;
        margin-top: -12px;
        background: var(--ls-white);
        border: 1px solid var(--ls-gray-200);
        border-top: none;
        box-shadow: 0 4px 12px rgba(0,0,0,0.06);
        transform: none;
        transition: max-height 0.25s ease, padding 0.25s ease;
    }

    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation.ls-nav-open ul {
        display: block;
        max-height: 500px;
        padding: 8px 0;
        overflow: visible;
    }

    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
        padding: 12px 24px;
        font-size: 14px;
    }
}


/* ═══════════════════════════════════════
   RESPONSIVE: < 640px (Mobile)
   ═══════════════════════════════════════ */

@media (max-width: 639px) {
    body.ls-my-account.woocommerce-account .jet-theme-core-document__inner > .woocommerce,
    body.ls-my-account.woocommerce-account .site-content .woocommerce,
    body.ls-my-account.woocommerce-account .entry-content > .woocommerce {
        padding: 16px;
    }

    /* Stack orders LIST table as cards (not order detail tables) */
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.woocommerce-orders-table thead {
        display: none;
    }

    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.woocommerce-orders-table,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.woocommerce-orders-table tbody,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.woocommerce-orders-table tr,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.woocommerce-orders-table td,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.woocommerce-orders-table th {
        display: block;
        width: 100%;
    }

    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.woocommerce-orders-table tbody tr {
        padding: 16px;
        margin-bottom: 12px;
        border: 1px solid var(--ls-gray-200);
        border-radius: var(--ls-radius-sm);
        background: var(--ls-white);
    }

    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.woocommerce-orders-table tbody td,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.woocommerce-orders-table tbody th {
        padding: 4px 0;
        border: none;
        font-size: 13px;
    }

    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.woocommerce-orders-table tbody td::before,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.woocommerce-orders-table tbody th::before {
        content: attr(data-title);
        display: inline-block;
        font-size: 11px;
        font-weight: 600;
        color: var(--ls-gray-400);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin-right: 8px;
        min-width: 80px;
    }

    /* ── Order DETAIL table: keep as table but make responsive ── */
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.order_details {
        font-size: 13px;
    }

    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.order_details th,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.order_details td {
        padding: 12px 14px !important;
    }

    /* Order detail tfoot: labels + amounts on same line */
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.order_details tfoot tr {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
        padding: 10px 14px !important;
        border-bottom: 1px solid var(--ls-gray-200);
    }

    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.order_details tfoot tr:last-child {
        border-bottom: none;
    }

    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.order_details tfoot th,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.order_details tfoot td {
        display: inline !important;
        width: auto !important;
        padding: 0 !important;
        border: none !important;
    }

    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.order_details tfoot th {
        font-weight: 500;
        color: var(--ls-gray-500);
    }

    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content table.order_details tfoot td {
        font-weight: 600;
        color: var(--ls-dark);
    }

    /* Address cards stack */
    body.ls-my-account.woocommerce-account .woocommerce-Addresses {
        grid-template-columns: 1fr;
    }

    /* Reduce form padding */
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-EditAccountForm,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-address-fields {
        padding: 18px;
    }

    /* Full-width buttons on mobile */
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Button,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .button {
        width: 100%;
        justify-content: center;
    }

    /* ── Order detail: version/qty table — keep as compact table on mobile ── */
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .lsau-version-table {
        font-size: 13px !important;
        width: 100% !important;
    }

    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .lsau-version-table,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .lsau-version-table thead,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .lsau-version-table tbody,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .lsau-version-table tr,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .lsau-version-table th,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .lsau-version-table td {
        display: revert !important;
    }

    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .lsau-version-table th,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .lsau-version-table td {
        padding: 8px 12px !important;
        border: none !important;
    }

    /* ── Hide "× N" product quantity on order detail ── */
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .product-quantity {
        display: none !important;
    }

    /* ── Order detail: Reorder button — smaller on mobile ── */
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content a.edit-reorder,
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .edit-reorder.button {
        padding: 8px 20px !important;
        font-size: 13px !important;
        width: auto !important;
    }

    /* ── Order detail: CPO meta grid — stack on mobile ── */
    body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .cpo-cart-item-meta {
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }

    /* ── My Designs table — use mobile cards ── */
    body.ls-my-account.woocommerce-account .lsma-designs__table .lsma-hide-mobile {
        display: none !important;
    }

    body.ls-my-account.woocommerce-account .lsma-designs__table .lsma-show-mobile {
        display: block !important;
    }

    /* ── Dashboard stat cards — 2 columns on mobile ── */
    body.ls-my-account.woocommerce-account .lsma-stats {
        grid-template-columns: 1fr 1fr !important;
    }

    /* ── Dashboard CTA — stack on mobile ── */
    body.ls-my-account.woocommerce-account .lsma-cta {
        flex-direction: column;
        text-align: center;
        gap: 12px;
    }

    body.ls-my-account.woocommerce-account .lsma-cta__btn {
        width: 100%;
        justify-content: center;
    }

    /* ── Login/Register forms — stack ── */
    body.ls-my-account.woocommerce-account .u-columns {
        flex-direction: column;
        gap: 24px;
    }

    body.ls-my-account.woocommerce-account .woocommerce-form-login,
    body.ls-my-account.woocommerce-account .woocommerce-form-register {
        padding: 24px 20px;
    }
}


/* ═══════════════════════════════════════
   PHASE 2 — DASHBOARD
   ═══════════════════════════════════════ */

/* ── Welcome ── */
body.ls-my-account.woocommerce-account .lsma-welcome {
    margin-bottom: 24px;
}

body.ls-my-account.woocommerce-account .lsma-welcome__title {
    font-size: 22px;
    font-weight: 700;
    color: var(--ls-dark);
    margin: 0 0 6px;
    font-family: 'DM Sans', sans-serif;
}

body.ls-my-account.woocommerce-account .lsma-welcome__subtitle {
    font-size: 14px;
    color: var(--ls-gray-500);
    margin: 0;
}


/* ── Stat Cards ── */
body.ls-my-account.woocommerce-account .lsma-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-bottom: 24px;
}

body.ls-my-account.woocommerce-account .lsma-stat {
    background: var(--ls-white);
    border: 1px solid var(--ls-gray-200);
    border-radius: 12px;
    padding: 18px 20px;
    position: relative;
    overflow: hidden;
}

body.ls-my-account.woocommerce-account .lsma-stat__bar {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
}

/* Color bars per stat */
body.ls-my-account.woocommerce-account .lsma-stat--teal   .lsma-stat__bar { background: var(--ls-teal); }
body.ls-my-account.woocommerce-account .lsma-stat--orange .lsma-stat__bar { background: var(--ls-orange); }
body.ls-my-account.woocommerce-account .lsma-stat--purple .lsma-stat__bar { background: var(--ls-purple); }
body.ls-my-account.woocommerce-account .lsma-stat--indigo .lsma-stat__bar { background: var(--ls-indigo); }
body.ls-my-account.woocommerce-account .lsma-stat--amber  .lsma-stat__bar { background: var(--ls-amber); }
body.ls-my-account.woocommerce-account .lsma-stat--green  .lsma-stat__bar { background: var(--ls-green); }

body.ls-my-account.woocommerce-account .lsma-stat__body {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

body.ls-my-account.woocommerce-account .lsma-stat__text {
    display: flex;
    flex-direction: column;
}

body.ls-my-account.woocommerce-account .lsma-stat__label {
    font-size: 11px;
    color: var(--ls-gray-500);
    margin: 0 0 4px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

body.ls-my-account.woocommerce-account .lsma-stat__value {
    font-size: 26px;
    font-weight: 700;
    color: var(--ls-dark);
    line-height: 1;
    font-family: 'DM Sans', sans-serif;
}

body.ls-my-account.woocommerce-account .lsma-stat__icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 20px;
}

/* Stat icon backgrounds — use color at 8% opacity */
body.ls-my-account.woocommerce-account .lsma-stat--teal   .lsma-stat__icon { background-color: #499CC214; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23499CC2' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 3H8a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2z'/%3E%3Cline x1='10' y1='8' x2='14' y2='8'/%3E%3Cline x1='10' y1='12' x2='14' y2='12'/%3E%3Cline x1='10' y1='16' x2='12' y2='16'/%3E%3C/svg%3E"); }
body.ls-my-account.woocommerce-account .lsma-stat--orange .lsma-stat__icon { background-color: #E8833A14; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23E8833A' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpolyline points='17 8 12 3 7 8'/%3E%3Cline x1='12' y1='3' x2='12' y2='15'/%3E%3C/svg%3E"); }
body.ls-my-account.woocommerce-account .lsma-stat--purple .lsma-stat__icon { background-color: #7c3aed14; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }
body.ls-my-account.woocommerce-account .lsma-stat--indigo .lsma-stat__icon { background-color: #4f46e514; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 20h20V8l-6 4V8l-6 4V4H2z'/%3E%3Cpath d='M6 20v-4'/%3E%3Cpath d='M10 20v-4'/%3E%3Cpath d='M14 20v-4'/%3E%3Cpath d='M18 20v-4'/%3E%3C/svg%3E"); }
body.ls-my-account.woocommerce-account .lsma-stat--amber  .lsma-stat__icon { background-color: #d9770614; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23d97706' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1' y='3' width='15' height='13'/%3E%3Cpolygon points='16 8 20 8 23 11 23 16 16 16 16 8'/%3E%3Ccircle cx='5.5' cy='18.5' r='2.5'/%3E%3Ccircle cx='18.5' cy='18.5' r='2.5'/%3E%3C/svg%3E"); }
body.ls-my-account.woocommerce-account .lsma-stat--green  .lsma-stat__icon { background-color: #10b98114; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2310b981' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E"); }


/* ── CTA Banners ── */
body.ls-my-account.woocommerce-account .lsma-ctas {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
}

body.ls-my-account.woocommerce-account .lsma-cta {
    border-radius: 12px;
    padding: 16px 22px;
    display: flex;
    align-items: center;
    gap: 14px;
    justify-content: space-between;
}

body.ls-my-account.woocommerce-account .lsma-cta--orange {
    background: linear-gradient(135deg, var(--ls-orange-light), #fff8f0);
    border: 1px solid #fde0c4;
}

body.ls-my-account.woocommerce-account .lsma-cta--purple {
    background: linear-gradient(135deg, var(--ls-purple-light), #faf5ff);
    border: 1px solid #e0d4f5;
}

body.ls-my-account.woocommerce-account .lsma-cta__icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    flex-shrink: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 20px;
}

body.ls-my-account.woocommerce-account .lsma-cta__icon--upload {
    background-color: var(--ls-orange);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpolyline points='17 8 12 3 7 8'/%3E%3Cline x1='12' y1='3' x2='12' y2='15'/%3E%3C/svg%3E");
}

body.ls-my-account.woocommerce-account .lsma-cta__icon--eye {
    background-color: var(--ls-purple);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

body.ls-my-account.woocommerce-account .lsma-cta__text {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

body.ls-my-account.woocommerce-account .lsma-cta__title {
    font-size: 14px;
    font-weight: 600;
    color: var(--ls-dark);
}

body.ls-my-account.woocommerce-account .lsma-cta__subtitle {
    font-size: 13px;
    color: var(--ls-gray-500);
    margin-top: 2px;
}

body.ls-my-account.woocommerce-account .lsma-cta__btn {
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
    text-align: center;
    transition: opacity 0.15s ease;
}

body.ls-my-account.woocommerce-account .lsma-cta__btn:hover { opacity: 0.9; }
body.ls-my-account.woocommerce-account .lsma-cta__btn--orange { background: var(--ls-orange); }
body.ls-my-account.woocommerce-account .lsma-cta__btn--purple { background: var(--ls-purple); }


/* ── Status Badges (dashboard) ── */
body.ls-my-account.woocommerce-account .lsma-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

body.ls-my-account.woocommerce-account .lsma-badge__dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* Badge colors — keyed to WC status slug (without wc- prefix) */
body.ls-my-account.woocommerce-account .lsma-badge--processing           { background: var(--ls-teal-light);   color: var(--ls-teal); }
body.ls-my-account.woocommerce-account .lsma-badge--processing   .lsma-badge__dot { background: var(--ls-teal); }

body.ls-my-account.woocommerce-account .lsma-badge--completed            { background: var(--ls-green-light);  color: var(--ls-green); }
body.ls-my-account.woocommerce-account .lsma-badge--completed    .lsma-badge__dot { background: var(--ls-green); }

body.ls-my-account.woocommerce-account .lsma-badge--on-hold              { background: #fffbeb;               color: var(--ls-amber); }
body.ls-my-account.woocommerce-account .lsma-badge--on-hold      .lsma-badge__dot { background: var(--ls-amber); }

body.ls-my-account.woocommerce-account .lsma-badge--pending              { background: #fffbeb;               color: var(--ls-amber); }
body.ls-my-account.woocommerce-account .lsma-badge--pending       .lsma-badge__dot { background: var(--ls-amber); }

body.ls-my-account.woocommerce-account .lsma-badge--cancelled,
body.ls-my-account.woocommerce-account .lsma-badge--refunded,
body.ls-my-account.woocommerce-account .lsma-badge--failed               { background: #fef2f2;               color: var(--ls-red); }
body.ls-my-account.woocommerce-account .lsma-badge--cancelled    .lsma-badge__dot,
body.ls-my-account.woocommerce-account .lsma-badge--refunded     .lsma-badge__dot,
body.ls-my-account.woocommerce-account .lsma-badge--failed        .lsma-badge__dot { background: var(--ls-red); }

body.ls-my-account.woocommerce-account .lsma-badge--awaiting-artwork     { background: var(--ls-orange-light); color: var(--ls-orange); }
body.ls-my-account.woocommerce-account .lsma-badge--awaiting-artwork .lsma-badge__dot { background: var(--ls-orange); }

body.ls-my-account.woocommerce-account .lsma-badge--artwork-received     { background: var(--ls-teal-light);   color: var(--ls-teal); }
body.ls-my-account.woocommerce-account .lsma-badge--artwork-received .lsma-badge__dot { background: var(--ls-teal); }

body.ls-my-account.woocommerce-account .lsma-badge--proof-sent           { background: var(--ls-purple-light); color: var(--ls-purple); }
body.ls-my-account.woocommerce-account .lsma-badge--proof-sent   .lsma-badge__dot { background: var(--ls-purple); }

body.ls-my-account.woocommerce-account .lsma-badge--art-approved         { background: var(--ls-green-light);  color: var(--ls-green); }
body.ls-my-account.woocommerce-account .lsma-badge--art-approved .lsma-badge__dot { background: var(--ls-green); }

body.ls-my-account.woocommerce-account .lsma-badge--in-production        { background: var(--ls-indigo-light); color: var(--ls-indigo); }
body.ls-my-account.woocommerce-account .lsma-badge--in-production .lsma-badge__dot { background: var(--ls-indigo); }

body.ls-my-account.woocommerce-account .lsma-badge--production-ready     { background: var(--ls-indigo-light); color: var(--ls-indigo); }
body.ls-my-account.woocommerce-account .lsma-badge--production-ready .lsma-badge__dot { background: var(--ls-indigo); }

body.ls-my-account.woocommerce-account .lsma-badge--proof-rejected       { background: var(--ls-orange-light); color: var(--ls-orange); }
body.ls-my-account.woocommerce-account .lsma-badge--proof-rejected .lsma-badge__dot { background: var(--ls-orange); }

body.ls-my-account.woocommerce-account .lsma-badge--shipped              { background: #fffbeb;               color: var(--ls-amber); }
body.ls-my-account.woocommerce-account .lsma-badge--shipped      .lsma-badge__dot { background: var(--ls-amber); }


/* ── Recent Orders ── */
body.ls-my-account.woocommerce-account .lsma-recent-orders {
    background: var(--ls-white);
    border: 1px solid var(--ls-gray-200);
    border-radius: 12px;
    overflow: hidden;
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__header {
    padding: 18px 24px;
    border-bottom: 1px solid var(--ls-gray-200);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__title {
    font-size: 15px;
    font-weight: 600;
    color: var(--ls-dark);
    margin: 0;
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__viewall {
    color: var(--ls-teal);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 4px;
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__viewall:hover {
    color: var(--ls-teal-dark);
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__empty {
    padding: 40px 24px;
    text-align: center;
    color: var(--ls-gray-500);
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__table {
    width: 100%;
    border-collapse: collapse;
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__table thead tr {
    background: var(--ls-gray-100);
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__table th {
    padding: 10px 24px;
    font-size: 11px;
    font-weight: 600;
    color: var(--ls-gray-500);
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-bottom: 1px solid var(--ls-gray-200);
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__table td {
    padding: 14px 24px;
    border-bottom: 1px solid var(--ls-gray-200);
    font-size: 14px;
    vertical-align: middle;
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__table tr:last-child td {
    border-bottom: none;
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__table .lsma-order-number a {
    font-weight: 600;
    color: var(--ls-teal);
    text-decoration: none;
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__table .lsma-order-number a:hover {
    color: var(--ls-teal-dark);
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__table .lsma-order-date {
    color: var(--ls-gray-500);
    font-size: 13px;
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__table .lsma-order-total {
    font-weight: 600;
    color: var(--ls-dark);
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__table .lsma-order-total small {
    font-weight: 400;
    color: var(--ls-gray-500);
    margin-left: 4px;
}

body.ls-my-account.woocommerce-account .lsma-recent-orders__table .lsma-order-actions {
    text-align: right;
}


/* ── Shared Buttons ── */
body.ls-my-account.woocommerce-account .lsma-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.15s ease;
    border: none;
    text-align: center;
    white-space: nowrap;
}

body.ls-my-account.woocommerce-account .lsma-btn--teal {
    background: var(--ls-teal);
    color: #fff;
}

body.ls-my-account.woocommerce-account .lsma-btn--teal:hover { opacity: 0.9; }

body.ls-my-account.woocommerce-account .lsma-btn--outline {
    background: none;
    border: 1px solid var(--ls-gray-300);
    color: var(--ls-dark-muted);
}

body.ls-my-account.woocommerce-account .lsma-btn--outline:hover {
    border-color: var(--ls-teal);
    color: var(--ls-teal);
}

body.ls-my-account.woocommerce-account .lsma-btn--sm {
    padding: 6px 14px;
    font-size: 12px;
}


/* ── Mobile order cards (for recent orders) ── */
body.ls-my-account.woocommerce-account .lsma-order-card {
    display: block;
    padding: 14px 16px;
    border-bottom: 1px solid var(--ls-gray-200);
    text-decoration: none;
    color: inherit;
    transition: background 0.1s ease;
}

body.ls-my-account.woocommerce-account .lsma-order-card:last-child {
    border-bottom: none;
}

body.ls-my-account.woocommerce-account .lsma-order-card:hover {
    background: var(--ls-gray-100);
}

body.ls-my-account.woocommerce-account .lsma-order-card__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

body.ls-my-account.woocommerce-account .lsma-order-card__number {
    font-size: 14px;
    font-weight: 600;
    color: var(--ls-teal);
}

body.ls-my-account.woocommerce-account .lsma-order-card__total {
    font-size: 14px;
    font-weight: 600;
    color: var(--ls-dark);
}

body.ls-my-account.woocommerce-account .lsma-order-card__bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

body.ls-my-account.woocommerce-account .lsma-order-card__date {
    font-size: 12px;
    color: var(--ls-gray-400);
}


/* ── Responsive visibility helpers ── */
body.ls-my-account.woocommerce-account .lsma-hide-mobile {
    display: table; /* for tables */
}

body.ls-my-account.woocommerce-account .lsma-hide-desktop {
    display: none;
}

@media (max-width: 639px) {
    body.ls-my-account.woocommerce-account .lsma-hide-mobile {
        display: none !important;
    }

    body.ls-my-account.woocommerce-account .lsma-hide-desktop {
        display: block !important;
    }

    /* Stats: 2 columns on mobile */
    body.ls-my-account.woocommerce-account .lsma-stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    body.ls-my-account.woocommerce-account .lsma-stat {
        padding: 14px;
    }

    body.ls-my-account.woocommerce-account .lsma-stat__value {
        font-size: 22px;
    }

    body.ls-my-account.woocommerce-account .lsma-stat__label {
        font-size: 10px;
    }

    /* Hide stat icons on mobile */
    body.ls-my-account.woocommerce-account .lsma-stat__icon {
        display: none;
    }

    /* CTA banner: stack */
    body.ls-my-account.woocommerce-account .lsma-cta {
        flex-direction: column;
        align-items: flex-start;
        padding: 14px 16px;
        gap: 12px;
    }

    body.ls-my-account.woocommerce-account .lsma-cta__btn {
        width: 100%;
    }

    /* Recent orders header */
    body.ls-my-account.woocommerce-account .lsma-recent-orders__header {
        padding: 14px 16px;
    }

    /* Welcome */
    body.ls-my-account.woocommerce-account .lsma-welcome__title {
        font-size: 20px;
    }
}


/* =====================================================================
   MY DESIGNS — Artwork-First Table Layout (v3)
   ===================================================================== */

/* ── Page header ── */
body.ls-my-account.woocommerce-account .lsma-designs__header h2 {
    font-family: 'DM Sans', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: #252531;
    margin: 0 0 4px;
}

body.ls-my-account.woocommerce-account .lsma-designs__header p {
    font-size: 14px;
    color: #6b7280;
    margin: 0 0 24px;
}

/* ── Desktop table ── */
body.ls-my-account.woocommerce-account .lsma-designs__table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
    border: 1px solid #eef2f5;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

body.ls-my-account.woocommerce-account .lsma-designs__table thead th {
    padding: 12px 24px;
    font-size: 11px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-align: left;
    border-bottom: 1px solid #eef2f5;
    background: #f8fafb;
    white-space: nowrap;
}

body.ls-my-account.woocommerce-account .lsma-designs__table tbody tr {
    transition: background 0.12s ease;
}

body.ls-my-account.woocommerce-account .lsma-designs__table tbody tr:nth-child(even) {
    background: #f8fafb;
}

body.ls-my-account.woocommerce-account .lsma-designs__table tbody tr:hover {
    background: #eef6fa;
}

body.ls-my-account.woocommerce-account .lsma-designs__table tbody td {
    padding: 14px 24px;
    border-bottom: 1px solid #eef2f5;
    vertical-align: middle;
    font-size: 14px;
    color: #374151;
}

body.ls-my-account.woocommerce-account .lsma-designs__table tbody tr:last-child td {
    border-bottom: none;
}

/* Thumbnail cell */
body.ls-my-account.woocommerce-account .lsma-dt-thumb {
    width: 48px;
    padding-right: 0 !important;
}

body.ls-my-account.woocommerce-account .lsma-dt-thumb img {
    width: 44px;
    height: 44px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid rgba(73,156,194,0.12);
    display: block;
}

body.ls-my-account.woocommerce-account .lsma-dt-thumb__icon {
    width: 44px;
    height: 44px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e8f4fa;
    color: #499CC2;
}

body.ls-my-account.woocommerce-account .lsma-dt-thumb__icon--pending {
    background: #fff;
    border: 2px dashed #d1d5db;
    color: #9ca3af;
}

/* Design name cell */
body.ls-my-account.woocommerce-account .lsma-dt-name__version {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #252531;
}

body.ls-my-account.woocommerce-account .lsma-dt-name__project {
    display: block;
    font-size: 11px;
    color: #9ca3af;
    margin-top: 2px;
}

/* File info cell */
body.ls-my-account.woocommerce-account .lsma-dt-file__name {
    display: block;
    font-size: 12px;
    color: #374151;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 200px;
}

body.ls-my-account.woocommerce-account .lsma-dt-file__meta {
    display: block;
    font-size: 11px;
    color: #9ca3af;
    margin-top: 2px;
}

body.ls-my-account.woocommerce-account .lsma-dt-file__none {
    font-size: 12px;
    color: #d1d5db;
    font-style: italic;
}

/* Order link cell */
body.ls-my-account.woocommerce-account .lsma-dt-order {
    white-space: nowrap;
}

body.ls-my-account.woocommerce-account .lsma-dt-order a {
    color: #499CC2;
    font-weight: 600;
    font-size: 13px;
    text-decoration: none;
}

body.ls-my-account.woocommerce-account .lsma-dt-order a:hover {
    text-decoration: underline;
}

/* Status + Action cells */
body.ls-my-account.woocommerce-account .lsma-dt-status {
    white-space: nowrap;
}

body.ls-my-account.woocommerce-account .lsma-dt-action {
    white-space: nowrap;
    text-align: right;
}

/* ── Version badge (reused) ── */
body.ls-my-account.woocommerce-account .lsma-version-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 16px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

body.ls-my-account.woocommerce-account .lsma-version-badge__dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
}

body.ls-my-account.woocommerce-account .lsma-version-badge--green  { background: #ecfdf5; color: #10b981; }
body.ls-my-account.woocommerce-account .lsma-version-badge--green  .lsma-version-badge__dot { background: #10b981; }
body.ls-my-account.woocommerce-account .lsma-version-badge--purple { background: #f5f0ff; color: #7c3aed; }
body.ls-my-account.woocommerce-account .lsma-version-badge--purple .lsma-version-badge__dot { background: #7c3aed; }
body.ls-my-account.woocommerce-account .lsma-version-badge--teal   { background: #e8f4fa; color: #499CC2; }
body.ls-my-account.woocommerce-account .lsma-version-badge--teal   .lsma-version-badge__dot { background: #499CC2; }
body.ls-my-account.woocommerce-account .lsma-version-badge--orange { background: #fef3eb; color: #E8833A; }
body.ls-my-account.woocommerce-account .lsma-version-badge--orange .lsma-version-badge__dot { background: #E8833A; }

/* ── Shared button styles ── */
body.ls-my-account.woocommerce-account .lsma-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 18px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    border: none;
    transition: all 0.2s ease;
    font-family: 'DM Sans', sans-serif;
    line-height: 1;
    white-space: nowrap;
}

body.ls-my-account.woocommerce-account .lsma-btn--primary { background: #499CC2; color: #fff; }
body.ls-my-account.woocommerce-account .lsma-btn--primary:hover { background: #3a8aaf; color: #fff; }
body.ls-my-account.woocommerce-account .lsma-btn--outline { background: none; border: 1px solid #d1d5db; color: #374151; }
body.ls-my-account.woocommerce-account .lsma-btn--outline:hover { background: #f8fafb; border-color: #9ca3af; color: #252531; }
body.ls-my-account.woocommerce-account .lsma-btn--sm { padding: 7px 14px; border-radius: 7px; font-size: 12px; }
body.ls-my-account.woocommerce-account .lsma-btn--orange { background: #E8833A; color: #fff; }
body.ls-my-account.woocommerce-account .lsma-btn--orange:hover { background: #d4702e; color: #fff; }
body.ls-my-account.woocommerce-account .lsma-btn--green { background: #10b981; color: #fff; }
body.ls-my-account.woocommerce-account .lsma-btn--green:hover { background: #0d9668; color: #fff; }
body.ls-my-account.woocommerce-account .lsma-btn--lg { padding: 12px 24px; font-size: 14px; border-radius: 10px; }
body.ls-my-account.woocommerce-account .lsma-btn:disabled { opacity: 0.55; cursor: not-allowed; }

/* ── Empty state ── */
body.ls-my-account.woocommerce-account .lsma-designs__empty {
    text-align: center;
    padding: 60px 20px;
    background: #fff;
    border: 1px solid #eef2f5;
    border-radius: 12px;
}

body.ls-my-account.woocommerce-account .lsma-designs__empty-icon { color: #d1d5db; margin-bottom: 16px; }
body.ls-my-account.woocommerce-account .lsma-designs__empty h3 { font-size: 18px; font-weight: 600; color: #252531; margin: 0 0 8px; }
body.ls-my-account.woocommerce-account .lsma-designs__empty p { font-size: 14px; color: #6b7280; margin: 0 0 20px; max-width: 360px; margin-left: auto; margin-right: auto; }

/* ── Pagination ── */
body.ls-my-account.woocommerce-account .lsma-designs__pagination {
    margin-top: 28px;
    display: flex;
    justify-content: center;
    gap: 4px;
}

body.ls-my-account.woocommerce-account .lsma-designs__pagination .page-numbers {
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    color: #374151;
    background: #fff;
    border: 1px solid #d1d5db;
    text-decoration: none;
    transition: all 0.2s ease;
}

body.ls-my-account.woocommerce-account .lsma-designs__pagination .page-numbers.current {
    background: #499CC2;
    color: #fff;
    border-color: #499CC2;
}

/* ── Mobile cards ── */
body.ls-my-account.woocommerce-account .lsma-designs__cards {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

body.ls-my-account.woocommerce-account .lsma-art-card {
    background: #fff;
    border: 1px solid #eef2f5;
    border-radius: 12px;
    padding: 14px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    position: relative;
}

body.ls-my-account.woocommerce-account .lsma-art-card::before {
    content: '';
    position: absolute;
    top: 0; bottom: 0; left: 0;
    width: 3px;
    border-radius: 12px 0 0 12px;
}

body.ls-my-account.woocommerce-account .lsma-art-card--green::before  { background: #10b981; }
body.ls-my-account.woocommerce-account .lsma-art-card--purple::before { background: #7c3aed; }
body.ls-my-account.woocommerce-account .lsma-art-card--teal::before   { background: #499CC2; }
body.ls-my-account.woocommerce-account .lsma-art-card--orange::before { background: #E8833A; }

body.ls-my-account.woocommerce-account .lsma-art-card__top {
    display: flex;
    gap: 12px;
    margin-bottom: 10px;
}

body.ls-my-account.woocommerce-account .lsma-art-card__thumb {
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    border-radius: 8px;
    overflow: hidden;
}

body.ls-my-account.woocommerce-account .lsma-art-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.ls-my-account.woocommerce-account .lsma-art-card__name {
    font-size: 14px;
    font-weight: 600;
    color: #252531;
    margin: 0;
}

body.ls-my-account.woocommerce-account .lsma-art-card__project {
    font-size: 11px;
    color: #9ca3af;
    margin: 2px 0 0;
}

body.ls-my-account.woocommerce-account .lsma-art-card__file {
    font-size: 11px;
    color: #6b7280;
    margin: 4px 0 0;
}

body.ls-my-account.woocommerce-account .lsma-art-card__file--none {
    color: #d1d5db;
    font-style: italic;
}

body.ls-my-account.woocommerce-account .lsma-art-card__bottom {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-top: 10px;
    border-top: 1px solid #f3f4f6;
}

body.ls-my-account.woocommerce-account .lsma-art-card__order {
    font-size: 12px;
    font-weight: 600;
    color: #499CC2;
    text-decoration: none;
}

body.ls-my-account.woocommerce-account .lsma-art-card__action {
    margin-left: auto;
}

/* ── Responsive show/hide ── */
body.ls-my-account.woocommerce-account .lsma-hide-mobile { display: block; }
body.ls-my-account.woocommerce-account .lsma-hide-desktop { display: none; }

@media (max-width: 768px) {
    body.ls-my-account.woocommerce-account .lsma-hide-mobile { display: none; }
    body.ls-my-account.woocommerce-account .lsma-hide-desktop { display: block; }
}

/* ── Modal styles (kept from v2) ── */
body.ls-my-account.woocommerce-account .lsma-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    backdrop-filter: blur(2px);
}

body.ls-my-account.woocommerce-account .lsma-modal {
    background: #fff;
    border-radius: 16px;
    max-width: 520px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    padding: 28px;
    position: relative;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    animation: lsmaModalIn 0.2s ease;
}

body.ls-my-account.woocommerce-account .lsma-modal--sm { max-width: 440px; }

@keyframes lsmaModalIn {
    from { opacity: 0; transform: translateY(12px) scale(0.97); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

body.ls-my-account.woocommerce-account .lsma-modal__close {
    position: absolute; top: 16px; right: 16px;
    background: none; border: none; color: #9ca3af;
    cursor: pointer; padding: 4px; border-radius: 6px;
    transition: all 0.15s;
}
body.ls-my-account.woocommerce-account .lsma-modal__close:hover { background: #f3f4f6; color: #374151; }

body.ls-my-account.woocommerce-account .lsma-modal__header { margin-bottom: 20px; }
body.ls-my-account.woocommerce-account .lsma-modal__header h3 { font-size: 18px; font-weight: 700; color: #252531; margin: 0 0 6px; font-family: 'DM Sans', sans-serif; }
body.ls-my-account.woocommerce-account .lsma-modal__header p { font-size: 13px; color: #6b7280; margin: 0; }
body.ls-my-account.woocommerce-account .lsma-modal__cs-icon { margin-bottom: 12px; }

body.ls-my-account.woocommerce-account .lsma-modal__actions { display: flex; gap: 10px; margin-bottom: 12px; }
body.ls-my-account.woocommerce-account .lsma-modal__actions .lsma-btn { flex: 1; justify-content: center; }

@media (max-width: 640px) {
    body.ls-my-account.woocommerce-account .lsma-modal { padding: 20px; border-radius: 14px; margin: 10px; }
    body.ls-my-account.woocommerce-account .lsma-modal__actions { flex-direction: column; }
}

/* ── Orders list project name ── */
body.ls-my-account.woocommerce-account .lsma-order-project {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: #6b7280;
    margin-top: 3px;
}

/* ── Order list action buttons — brute-force override of WooCommerce/Kava ── */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-orders-table a.woocommerce-button.button,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions a.woocommerce-button.button {
    display: inline-flex !important;
    align-items: center !important;
    padding: 5px 10px !important;
    border-radius: 7px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    font-family: 'DM Sans', sans-serif !important;
    text-decoration: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    border: 1px solid #d1d5db !important;
    background: none !important;
    color: #374151 !important;
    min-height: 0 !important;
    min-width: 0 !important;
    height: auto !important;
    width: auto !important;
    box-shadow: none !important;
    margin: 0 3px !important;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-orders-table a.woocommerce-button.button:hover {
    background: #f8fafb !important;
    border-color: #9ca3af !important;
    color: #252531 !important;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-orders-table a.woocommerce-button.button.edit-reorder {
    background: #499CC2 !important;
    color: #fff !important;
    border-color: #499CC2 !important;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-orders-table a.woocommerce-button.button.edit-reorder:hover {
    background: #3a8aaf !important;
    border-color: #3a8aaf !important;
    color: #fff !important;
}

/* ── Orders table — match My Designs table styling ── */
body.ls-my-account.woocommerce-account .woocommerce-orders-table thead th,
body.ls-my-account.woocommerce-account .woocommerce-orders-table thead td {
    padding: 12px 24px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #6b7280 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    background: #f8fafb !important;
    border-bottom: 1px solid #eef2f5 !important;
}

body.ls-my-account.woocommerce-account .woocommerce-orders-table tbody td,
body.ls-my-account.woocommerce-account .woocommerce-orders-table tbody th {
    padding: 14px 24px !important;
    font-size: 14px !important;
    color: #374151 !important;
    border-bottom: 1px solid #eef2f5 !important;
    vertical-align: middle !important;
}

body.ls-my-account.woocommerce-account .woocommerce-orders-table tbody tr:last-child td,
body.ls-my-account.woocommerce-account .woocommerce-orders-table tbody tr:last-child th {
    border-bottom: none !important;
}

body.ls-my-account.woocommerce-account .woocommerce-orders-table tbody tr {
    transition: background 0.12s ease;
}

body.ls-my-account.woocommerce-account .woocommerce-orders-table tbody tr:nth-child(even) td,
body.ls-my-account.woocommerce-account .woocommerce-orders-table tbody tr:nth-child(even) th {
    background: #f8fafb;
}

body.ls-my-account.woocommerce-account .woocommerce-orders-table tbody tr:hover td,
body.ls-my-account.woocommerce-account .woocommerce-orders-table tbody tr:hover th {
    background: #eef6fa;
}

/* ── Space between order action buttons ── */
body.ls-my-account.woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-actions {
    white-space: nowrap;
}

body.ls-my-account.woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-actions a {
    margin-right: 6px;
}

body.ls-my-account.woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-actions a:last-child {
    margin-right: 0;
}

/* ── Reorder button on order detail page ── */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .edit-reorder.button,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content a.edit-reorder {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    padding: 5px 10px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    font-family: 'DM Sans', sans-serif !important;
    background: #499CC2 !important;
    color: #fff !important;
    border: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
    cursor: pointer;
    transition: background 0.2s ease;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .edit-reorder.button:hover,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content a.edit-reorder:hover {
    background: #3a8aaf !important;
    color: #fff !important;
}

/* ── Hide WooCommerce "Order Again" button on order detail page ── */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .order-again,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-button--order-again,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content a.order-again {
    display: none !important;
}

/* =====================================================================
   LOGIN / REGISTER PAGE
   ===================================================================== */

/* ── Layout: center the forms, max-width ── */
body.ls-my-account.woocommerce-account .u-columns {
    display: flex;
    gap: 32px;
    max-width: 900px;
    margin: 0 auto;
    flex-wrap: wrap;
}

body.ls-my-account.woocommerce-account .u-columns .u-column-1,
body.ls-my-account.woocommerce-account .u-columns .u-column-2,
body.ls-my-account.woocommerce-account .u-columns .col-1,
body.ls-my-account.woocommerce-account .u-columns .col-2 {
    flex: 1;
    min-width: 280px;
}

/* ── Form card ── */
body.ls-my-account.woocommerce-account .woocommerce-form-login,
body.ls-my-account.woocommerce-account .woocommerce-form-register {
    background: #fff;
    border: 1px solid var(--ls-gray-200);
    border-radius: 12px;
    padding: 32px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}

/* ── Form headings ── */
body.ls-my-account.woocommerce-account .u-columns h2,
body.ls-my-account.woocommerce-account .woocommerce-form-login h2,
body.ls-my-account.woocommerce-account .woocommerce-form-register h2 {
    font-family: 'DM Sans', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: var(--ls-dark);
    margin: 0 0 24px;
}

/* ── Form rows ── */
body.ls-my-account.woocommerce-account .woocommerce-form-login .form-row,
body.ls-my-account.woocommerce-account .woocommerce-form-register .form-row {
    margin-bottom: 18px;
}

/* ── Labels ── */
body.ls-my-account.woocommerce-account .woocommerce-form-login label,
body.ls-my-account.woocommerce-account .woocommerce-form-register label {
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--ls-dark-muted);
    display: block;
    margin-bottom: 6px;
}

/* Checkbox labels: inline with the checkbox, not block */
body.ls-my-account.woocommerce-account .woocommerce-form-login label.woocommerce-form__label-for-checkbox,
body.ls-my-account.woocommerce-account .woocommerce-form-register label.woocommerce-form__label-for-checkbox,
body.ls-my-account.woocommerce-account .woocommerce-form-register .mailchimp-newsletter label {
    display: flex !important;
    align-items: center;
    gap: 8px;
    font-weight: 500;
    color: var(--ls-gray-500);
    cursor: pointer;
    margin-bottom: 0;
    padding-left: 0 !important;
    position: static !important;
}

/* Kill Kava's custom checkbox pseudo-element */
body.ls-my-account.woocommerce-account .woocommerce-form-login label.woocommerce-form__label-for-checkbox::before,
body.ls-my-account.woocommerce-account .woocommerce-form-login label.woocommerce-form__label-for-checkbox::after,
body.ls-my-account.woocommerce-account .woocommerce-form-register label.woocommerce-form__label-for-checkbox::before,
body.ls-my-account.woocommerce-account .woocommerce-form-register label.woocommerce-form__label-for-checkbox::after,
body.ls-my-account.woocommerce-account .woocommerce-form-register .mailchimp-newsletter label::before,
body.ls-my-account.woocommerce-account .woocommerce-form-register .mailchimp-newsletter label::after {
    display: none !important;
}

/* ── Inputs ── */
body.ls-my-account.woocommerce-account .woocommerce-form-login input[type="text"],
body.ls-my-account.woocommerce-account .woocommerce-form-login input[type="email"],
body.ls-my-account.woocommerce-account .woocommerce-form-login input[type="password"],
body.ls-my-account.woocommerce-account .woocommerce-form-register input[type="text"],
body.ls-my-account.woocommerce-account .woocommerce-form-register input[type="email"],
body.ls-my-account.woocommerce-account .woocommerce-form-register input[type="password"] {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid var(--ls-gray-300);
    border-radius: 8px;
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    color: var(--ls-dark);
    background: var(--ls-white);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    outline: none;
    box-sizing: border-box;
}

body.ls-my-account.woocommerce-account .woocommerce-form-login input:focus,
body.ls-my-account.woocommerce-account .woocommerce-form-register input:focus {
    border-color: var(--ls-teal);
    box-shadow: 0 0 0 3px rgba(73, 156, 194, 0.12);
}

/* ── Submit buttons (orange) ── */
body.ls-my-account.woocommerce-account .woocommerce-form-login button[type="submit"],
body.ls-my-account.woocommerce-account .woocommerce-form-login .button,
body.ls-my-account.woocommerce-account .woocommerce-form-register button[type="submit"],
body.ls-my-account.woocommerce-account .woocommerce-form-register .button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 10px 32px !important;
    border-radius: 8px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #fff !important;
    background: var(--ls-orange) !important;
    border: none !important;
    cursor: pointer;
    transition: background 0.2s ease;
    text-decoration: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4 !important;
    width: auto;
    box-shadow: none !important;
}

body.ls-my-account.woocommerce-account .woocommerce-form-login button[type="submit"]:hover,
body.ls-my-account.woocommerce-account .woocommerce-form-register button[type="submit"]:hover {
    background: #d4702e !important;
}

/* ── Remember me checkbox ── */
body.ls-my-account.woocommerce-account .woocommerce-form-login .woocommerce-form-login__rememberme {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--ls-gray-500);
    margin-bottom: 18px;
}

/* ── All checkboxes on login/register forms ── */
/* Kava hides native checkboxes (display:none on label.inline input[type=checkbox])
   and replaces with ::before pseudo on the adjacent span. We undo all of this. */
body.ls-my-account.woocommerce-account .woocommerce-form-login input[type="checkbox"],
body.ls-my-account.woocommerce-account .woocommerce-form-register input[type="checkbox"] {
    display: inline-block !important;
    width: 16px !important;
    height: 16px !important;
    accent-color: var(--ls-teal);
    cursor: pointer;
    -webkit-appearance: auto !important;
    appearance: auto !important;
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    margin: 0 !important;
    flex-shrink: 0;
}

/* Kill Kava's fake checkbox pseudo-element on the span after the input */
body.ls-my-account.woocommerce-account .woocommerce-form-login label input[type="checkbox"] + span::before,
body.ls-my-account.woocommerce-account .woocommerce-form-login label input[type="checkbox"] + span::after,
body.ls-my-account.woocommerce-account .woocommerce-form-register label input[type="checkbox"] + span::before,
body.ls-my-account.woocommerce-account .woocommerce-form-register label input[type="checkbox"] + span::after {
    display: none !important;
}

/* ── Newsletter / other checkbox labels ── */
body.ls-my-account.woocommerce-account .woocommerce-form-register .form-row label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

body.ls-my-account.woocommerce-account .woocommerce-form-register .mailchimp-newsletter label,
body.ls-my-account.woocommerce-account .woocommerce-form-register .woocommerce-form__label-for-checkbox.inline {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 500;
    color: var(--ls-gray-500);
    cursor: pointer;
}

body.ls-my-account.woocommerce-account .woocommerce-form-register .mailchimp-newsletter label span {
    font-size: 13px;
    font-weight: 500;
    color: var(--ls-gray-500);
}

body.ls-my-account.woocommerce-account .woocommerce-form-register .woocommerce-form-register__newsletter,
body.ls-my-account.woocommerce-account .woocommerce-form-register [class*="newsletter"],
body.ls-my-account.woocommerce-account .woocommerce-form-register [class*="subscribe"] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--ls-dark-muted);
}

/* ── Show/hide password toggle ── */
body.ls-my-account.woocommerce-account .show-password-input,
body.ls-my-account.woocommerce-account .wp-hide-pw {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    color: var(--ls-gray-400);
    font-size: 14px;
    padding: 4px;
    width: auto;
    height: auto;
}

body.ls-my-account.woocommerce-account .woocommerce-form-login .form-row,
body.ls-my-account.woocommerce-account .woocommerce-form-register .form-row {
    position: relative;
}

/* ── Lost password link ── */
body.ls-my-account.woocommerce-account .woocommerce-form-login .woocommerce-LostPassword a,
body.ls-my-account.woocommerce-account .lost_password a {
    color: var(--ls-teal);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: color 0.15s ease;
}

body.ls-my-account.woocommerce-account .woocommerce-form-login .woocommerce-LostPassword a:hover,
body.ls-my-account.woocommerce-account .lost_password a:hover {
    color: var(--ls-teal-dark);
    text-decoration: underline;
}

/* ── Privacy policy text ── */
body.ls-my-account.woocommerce-account .woocommerce-privacy-policy-text p {
    font-size: 12px;
    color: var(--ls-gray-500);
    line-height: 1.5;
    margin-bottom: 16px;
}

body.ls-my-account.woocommerce-account .woocommerce-privacy-policy-text a {
    color: var(--ls-teal);
}

/* =====================================================================
   ELEMENTOR HEADER FIX — Image-box + mega menu dropdown
   Elementor conditionally loads widget CSS. Pages that don't use
   image-box widgets in content miss these rules, breaking the header
   mega menu dropdown layout.
   ===================================================================== */

/* Image-box widget: side-by-side layout */
.elementor-widget-image-box.elementor-position-left .elementor-image-box-wrapper,
.elementor-widget-image-box.elementor-position-right .elementor-image-box-wrapper {
    display: flex;
}

.elementor-widget-image-box.elementor-position-right .elementor-image-box-wrapper {
    flex-direction: row-reverse;
    text-align: end;
}

.elementor-widget-image-box.elementor-position-left .elementor-image-box-wrapper {
    text-align: start;
}

.elementor-widget-image-box.elementor-vertical-align-top .elementor-image-box-wrapper {
    align-items: flex-start;
}

.elementor-widget-image-box.elementor-vertical-align-middle .elementor-image-box-wrapper {
    align-items: center;
}

.elementor-widget-image-box.elementor-vertical-align-bottom .elementor-image-box-wrapper {
    align-items: flex-end;
}

.elementor-widget-image-box.elementor-position-top .elementor-image-box-img {
    margin: 0 auto;
}

.elementor-widget-image-box .elementor-image-box-content {
    width: 100%;
}

/* Mega menu dropdown: hide inner content until Elementor activates */
.elementor-widget-n-menu .e-n-menu-content > .e-con:not(.e-active) {
    display: none;
}

/* =====================================================================
   LOST PASSWORD / RESET PASSWORD PAGE
   ===================================================================== */

/* ── Center and card-style the form ── */
body.ls-my-account.woocommerce-account .woocommerce form.woocommerce-ResetPassword,
body.ls-my-account.woocommerce-account .woocommerce form.lost_reset_password {
    max-width: 440px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid var(--ls-gray-200);
    border-radius: 12px;
    padding: 32px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}

/* ── Description text ── */
body.ls-my-account.woocommerce-account .woocommerce form.woocommerce-ResetPassword p,
body.ls-my-account.woocommerce-account .woocommerce form.lost_reset_password p {
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    color: var(--ls-dark-muted);
    line-height: 1.6;
    margin-bottom: 18px;
}

/* ── Labels ── */
body.ls-my-account.woocommerce-account .woocommerce form.woocommerce-ResetPassword label,
body.ls-my-account.woocommerce-account .woocommerce form.lost_reset_password label {
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--ls-dark-muted);
    display: block;
    margin-bottom: 6px;
}

/* ── Inputs ── */
body.ls-my-account.woocommerce-account .woocommerce form.woocommerce-ResetPassword input[type="text"],
body.ls-my-account.woocommerce-account .woocommerce form.woocommerce-ResetPassword input[type="email"],
body.ls-my-account.woocommerce-account .woocommerce form.woocommerce-ResetPassword input[type="password"],
body.ls-my-account.woocommerce-account .woocommerce form.lost_reset_password input[type="text"],
body.ls-my-account.woocommerce-account .woocommerce form.lost_reset_password input[type="email"],
body.ls-my-account.woocommerce-account .woocommerce form.lost_reset_password input[type="password"] {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid var(--ls-gray-300);
    border-radius: 8px;
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    color: var(--ls-dark);
    background: var(--ls-white);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    outline: none;
    box-sizing: border-box;
}

body.ls-my-account.woocommerce-account .woocommerce form.woocommerce-ResetPassword input:focus,
body.ls-my-account.woocommerce-account .woocommerce form.lost_reset_password input:focus {
    border-color: var(--ls-teal);
    box-shadow: 0 0 0 3px rgba(73, 156, 194, 0.12);
}

/* ── Form rows ── */
body.ls-my-account.woocommerce-account .woocommerce form.woocommerce-ResetPassword .form-row,
body.ls-my-account.woocommerce-account .woocommerce form.lost_reset_password .form-row {
    margin-bottom: 18px;
}

/* ── Submit button (orange) ── */
body.ls-my-account.woocommerce-account .woocommerce form.woocommerce-ResetPassword button[type="submit"],
body.ls-my-account.woocommerce-account .woocommerce form.woocommerce-ResetPassword .button,
body.ls-my-account.woocommerce-account .woocommerce form.lost_reset_password button[type="submit"],
body.ls-my-account.woocommerce-account .woocommerce form.lost_reset_password .button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 10px 32px !important;
    border-radius: 8px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #fff !important;
    background: var(--ls-orange) !important;
    border: none !important;
    cursor: pointer;
    transition: background 0.2s ease;
    text-decoration: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4 !important;
    width: auto;
    box-shadow: none !important;
}

body.ls-my-account.woocommerce-account .woocommerce form.woocommerce-ResetPassword button[type="submit"]:hover,
body.ls-my-account.woocommerce-account .woocommerce form.lost_reset_password button[type="submit"]:hover {
    background: #d4702e !important;
}

/* =====================================================================
   EMPTY ORDERS STATE (no orders yet)
   ===================================================================== */

/* ── Hide the broken WooCommerce/Kava icon bar ── */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info::before {
    display: none !important;
}

/* ── Info message container (empty orders, etc.) ── */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info {
    display: flex !important;
    align-items: center;
    gap: 16px;
    background: var(--ls-orange-light) !important;
    border: 1px solid #f5d5b8 !important;
    border-radius: 12px !important;
    padding: 20px 24px !important;
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    color: var(--ls-dark-muted);
    margin-bottom: 20px;
    overflow: visible !important;
}

/* ── Orange alert icon circle ── */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info::after {
    content: '!';
    order: -1;
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    min-width: 36px;
    border-radius: 50%;
    background: var(--ls-orange);
    color: #fff;
    font-family: 'DM Sans', sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
    position: static !important;
}

/* ── "Get a Label Quote" button inside the info message ── */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info .woocommerce-Button,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info .button,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info .wc-forward {
    display: inline-flex !important;
    align-items: center;
    margin-left: auto;
    padding: 10px 24px !important;
    border-radius: 8px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #fff !important;
    background: var(--ls-orange) !important;
    border: none !important;
    text-decoration: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4 !important;
    white-space: nowrap !important;
    cursor: pointer;
    transition: background 0.2s ease;
    box-shadow: none !important;
    min-height: 0 !important;
    height: auto !important;
    width: auto !important;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info .woocommerce-Button:hover,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info .button:hover,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info .wc-forward:hover {
    background: #d4702e !important;
}

/* =====================================================================
   SUCCESS TOAST (.woocommerce-message) ON MY ACCOUNT PAGES
   ===================================================================== */

/* -- Kill Kava's icon bar -- */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message::before {
    display: none !important;
}

/* -- Success message container (teal tint) -- */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message {
    display: flex !important;
    align-items: center;
    gap: 16px;
    background: var(--ls-teal-light) !important;
    border: 1px solid #b8dff0 !important;
    border-radius: 12px !important;
    padding: 20px 24px !important;
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    color: var(--ls-dark-muted);
    margin-bottom: 20px;
    overflow: visible !important;
}

/* -- Teal checkmark icon -- */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message::after {
    content: '\2713';
    order: -1;
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    min-width: 36px;
    border-radius: 50%;
    background: var(--ls-teal);
    color: #fff;
    font-family: 'DM Sans', sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
    position: static !important;
}

/* -- Buttons inside success toast -- */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message .button,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message .wc-forward {
    display: inline-flex !important;
    align-items: center;
    margin-left: auto;
    padding: 10px 24px !important;
    border-radius: 8px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #fff !important;
    background: var(--ls-teal) !important;
    border: none !important;
    text-decoration: none !important;
    text-transform: none !important;
    white-space: nowrap !important;
    box-shadow: none !important;
}


/* =====================================================================
   EDIT ACCOUNT — RADIO BUTTONS (Mailchimp newsletter preferences)
   ===================================================================== */

/* -- Radio button labels: inline with text -- */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .form-row label[for*="mailchimp"],
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .form-row label:has(input[type="radio"]) {
    display: flex !important;
    align-items: center;
    gap: 8px;
    font-weight: 500;
    color: var(--ls-dark-muted);
    cursor: pointer;
    padding-left: 0 !important;
    position: static !important;
}

/* -- Kill Kava's fake radio pseudo-elements -- */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content label[for*="mailchimp"]::before,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content label[for*="mailchimp"]::after,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content label:has(input[type="radio"])::before,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content label:has(input[type="radio"])::after {
    display: none !important;
}

/* -- Show native radio buttons -- */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content input[type="radio"] {
    display: inline-block !important;
    width: 16px !important;
    height: 16px !important;
    accent-color: var(--ls-teal);
    cursor: pointer;
    -webkit-appearance: auto !important;
    appearance: auto !important;
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    margin: 0 !important;
    flex-shrink: 0;
}

/* -- Kill Kava's fake radio on span siblings -- */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content input[type="radio"] + span::before,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content input[type="radio"] + span::after {
    display: none !important;
}

/* -- Save Changes button on edit-account -- */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-EditAccountForm button[type="submit"],
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-EditAccountForm .button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 10px 32px !important;
    border-radius: 8px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #fff !important;
    background: var(--ls-orange) !important;
    border: none !important;
    cursor: pointer;
    transition: background 0.2s ease;
    text-transform: none !important;
    box-shadow: none !important;
    float: none !important;
    margin-left: 0 !important;
}

body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-EditAccountForm button[type="submit"]:hover {
    background: #d4702e !important;
}

/* -- Edit account form: left-align button row -- */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-EditAccountForm p:last-of-type,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .woocommerce-EditAccountForm .form-row:last-of-type {
    text-align: left !important;
    display: block !important;
    clear: both;
}

/* =====================================================================
   ORDERS PAGE — EMPTY STATE (matches My Designs layout)
   ===================================================================== */
body.ls-my-account.woocommerce-account .lsma-orders-page .lsma-section-title {
    font-family: 'DM Sans', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: var(--ls-dark);
    margin: 0 0 4px;
}

body.ls-my-account.woocommerce-account .lsma-orders-page .lsma-section-subtitle {
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    color: var(--ls-gray-500);
    margin: 0 0 24px;
}

/* Hide WooCommerce's default empty orders notice when our custom empty state is present */
body.ls-my-account.woocommerce-account .lsma-orders-page ~ .woocommerce-info,
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content > .woocommerce-info:first-child {
    display: none !important;
}

/* ── Hide "× N" product quantity from order detail product names (all viewports) ── */
body.ls-my-account.woocommerce-account .woocommerce-MyAccount-content .product-quantity {
    display: none !important;
}

/* ── Footer: hide list bullets/markers on icon-list items ── */
.jet-theme-core-location--footer-location .elementor-icon-list-items,
.jet-theme-core-location--footer-location .elementor-icon-list-items li,
.jet-theme-core-location--footer-location .elementor-icon-list-item {
    list-style: none !important;
    list-style-type: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.jet-theme-core-location--footer-location .elementor-icon-list-items li::before,
.jet-theme-core-location--footer-location .elementor-icon-list-items li::marker {
    display: none !important;
    content: none !important;
    font-size: 0 !important;
}