/* ci-shop My Account — old design: narrow nav rail, content filling the card,
   borderless detail tables, pill active nav state */

body.ci-shop.woocommerce-account .shop-card { max-width: 1240px; margin: 0 auto; }

body.ci-shop .woocommerce-MyAccount-navigation { float: left; width: 20%; max-width: 250px; }
body.ci-shop .woocommerce-MyAccount-content { float: right; width: 76%; }
body.ci-shop.woocommerce-account .shop-card::after { content: ''; display: table; clear: both; }

body.ci-shop .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; }
body.ci-shop .woocommerce-MyAccount-navigation li a {
    display: block;
    padding: 0.7rem 0.9rem;
    color: #4a4a4a;
    border-radius: 6px;
}
body.ci-shop .woocommerce-MyAccount-navigation li.is-active a {
    background: var(--hcl-neutral-3, #f0f0f0);
    color: var(--shop-accent);
}
body.ci-shop .woocommerce-MyAccount-navigation li a:hover { background: var(--hcl-neutral-2, #f9f9f9); color: var(--shop-accent); }

/* Content links bold orange per old design */
body.ci-shop .woocommerce-MyAccount-content a:not(.button) { font-weight: 700; }

/* Section headings at old scale */
body.ci-shop .woocommerce-MyAccount-content h2 { font-size: 1.75rem; margin: 2rem 0 1rem; }

/* Dashboard greeting — blue info panel with icon (old design). Scoped to the
   dashboard body class so endpoint pages' first paragraph is left untouched.
   Matches base.css .woocommerce-info: reserved icon gutter + supplied glyph. */
body.ci-shop.ci-account-dashboard .woocommerce-MyAccount-content > p:first-of-type {
    position: relative;
    background: var(--shop-info-bg, #eaf4fb);
    color: var(--shop-info-text, #2779bd);
    font-weight: 700;
    border: 0;
    border-radius: 4px;
    padding: 1em 1.5em 1em 3.25em;
    margin: 0 0 1.5rem;
}
body.ci-shop.ci-account-dashboard .woocommerce-MyAccount-content > p:first-of-type::before {
    content: '\24D8';
    position: absolute;
    left: 1.15em;
    top: 0.95em;
    color: var(--shop-info-text, #2779bd);
    font-weight: 400;
}
body.ci-shop.ci-account-dashboard .woocommerce-MyAccount-content > p:first-of-type a {
    color: var(--shop-info-text, #2779bd);
    font-weight: 700;
}

/* Row-label / totals-label th stay normal weight (Woo bolds all th) — the
   Subtotal/Total labels and subscription_details row labels read at 400. The
   uppercase COLUMN headers (thead th) go bold below, per Luke's request. */
body.ci-shop .woocommerce-MyAccount-content table.shop_table th { font-weight: 400; }

/* Column headers bold: Luke wants the orders/related-orders/downloads/license
   table header rows bold (old was 500; he asked for 700). Scoped to thead th so
   body/tfoot row-label th keep 400 (the general th:400 rule above still wins
   there — thead th is one element more specific, so 700 wins only on headers). */
body.ci-shop .woocommerce-MyAccount-content table.shop_table thead th { font-weight: 700; }

/* Row density: account content tables (downloads, license codes, related
   orders, totals, orders list) are airier in the old design — measured ~21px
   vertical / ~12.9px horizontal on every cell. The borderless
   subscription_details block keeps its own tighter rhythm, so exclude it. */
body.ci-shop .woocommerce-MyAccount-content table.shop_table:not(.subscription_details) th,
body.ci-shop .woocommerce-MyAccount-content table.shop_table:not(.subscription_details) td {
    padding: 1.3rem 0.8rem;
}
/* First column matches every other cell (measured padding-left 12.9px ≈ 0.8rem).
   Explicit/defensive — the shorthand above already covers first-child, but this
   guarantees the left indent even if a low-specificity reset ever lands. */
body.ci-shop .woocommerce-MyAccount-content table.shop_table:not(.subscription_details) th:first-child,
body.ci-shop .woocommerce-MyAccount-content table.shop_table:not(.subscription_details) td:first-child {
    padding-left: 0.8rem;
}

/* Subscription/order status + dates: borderless label/value list (old design) */
body.ci-shop table.subscription_details,
body.ci-shop table.subscription_details th,
body.ci-shop table.subscription_details td { border: 0; }
body.ci-shop table.subscription_details th,
body.ci-shop table.subscription_details td { padding: 0.55rem 0.5rem; }

/* Buttons: default outline-orange in account context (downloads, View) */
body.ci-shop .woocommerce-MyAccount-content .button { background: transparent; color: var(--shop-accent); }
body.ci-shop .woocommerce-MyAccount-content .button:hover { background: var(--shop-accent); color: #fff; }
/* Cancel: pale-pink fill, red text (old treatment) */
body.ci-shop .woocommerce-MyAccount-content a.button.cancel { background: #fdeaea; border-color: #fdeaea; color: #b81c23; }
body.ci-shop .woocommerce-MyAccount-content a.button.cancel:hover { background: #f8d7d7; border-color: #f8d7d7; color: #b81c23; }
/* Renew now: plain text link (old treatment) */
body.ci-shop .woocommerce-MyAccount-content a.button.subscription_renewal_early {
    background: transparent;
    border: 0;
    padding: 0.7rem 0.5rem;
    color: var(--shop-accent);
    text-decoration: underline;
}

/* Login (logged-out my-account) */
body.ci-shop .woocommerce-form-login {
    max-width: 420px;
    margin: 0 auto;
    border: 1px solid var(--shop-border);
    border-radius: 2px;
    padding: 1.5rem;
}
body.ci-shop .woocommerce-form-login .button { width: 100%; text-align: center; }
body.ci-shop .woocommerce-LostPassword { font-weight: 500; }

@media (max-width: 900px) {
    body.ci-shop .woocommerce-MyAccount-navigation,
    body.ci-shop .woocommerce-MyAccount-content { float: none; width: 100%; max-width: none; }
    body.ci-shop .woocommerce-MyAccount-navigation { margin-bottom: 1.5rem; }
}

/* --- Phase C residuals --- */

/* Woo's download button carries .button.alt — the base solid-orange alt rule
   outranks the account outline treatment; re-outline it in account context */
body.ci-shop .woocommerce-MyAccount-content a.button.alt {
    background: transparent;
    color: var(--shop-accent);
    border-color: var(--shop-accent);
}
body.ci-shop .woocommerce-MyAccount-content a.button.alt:hover { background: var(--shop-accent); color: #fff; }

/* "Renew now" is sentence case in the old design — undo the global capitalize */
body.ci-shop .woocommerce-MyAccount-content a.button.subscription_renewal_early { text-transform: none; }

/* Login card fields at the old taller scale */
body.ci-shop .woocommerce-form-login .input-text { min-height: 2.9rem; }

/* Billing address: old design is plain flush-left text. WC renders <address>
   with a border box + italic and gives the phone/email lines padding-left:1.5em
   (via .woocommerce .woocommerce-customer-details .--phone, specificity 0,3,0,
   which outranked the old 0,2,1 override — that's why the phone/email stayed
   indented). All selectors below carry .woocommerce-MyAccount-content to reach
   0,3,x and win. Measured old: address normal (not italic), line-height 24.7px,
   margin/padding 0, every line flush-left with no indent. */
body.ci-shop .woocommerce-MyAccount-content address {
    border: 0;
    padding: 0;
    margin: 0;
    width: auto;
    font-style: normal;
    line-height: 24.7px;
    text-align: left;
}
/* Kill any stray column float/width so the billing block runs full flush-left */
body.ci-shop .woocommerce-MyAccount-content .woocommerce-column--billing-address,
body.ci-shop .woocommerce-MyAccount-content .woocommerce-column--address {
    float: none;
    width: auto;
}
/* Hide WC's phone/email glyph and remove its reserved indent so those lines
   align with the address lines above (no icon, no left padding, no text-indent) */
body.ci-shop .woocommerce-MyAccount-content .woocommerce-customer-details--phone::before,
body.ci-shop .woocommerce-MyAccount-content .woocommerce-customer-details--email::before { display: none; }
body.ci-shop .woocommerce-MyAccount-content .woocommerce-customer-details--phone,
body.ci-shop .woocommerce-MyAccount-content .woocommerce-customer-details--email {
    padding-left: 0;
    margin-left: 0;
    text-indent: 0;
    text-align: left;
}

/* --- Item 7a: Add payment method (/my-account/add-payment-method/) --- */

/* Add-payment-method (Luke 2026-07-09 eve): match the restructured checkout
   payment block — containers 1 (#payment) and 2 (.payment_box) carry NO chrome;
   the grey box styling lives on the Stripe fieldset (container 3). WC paints
   the outer #payment lavender and payment_box #dcd7e2 through two-ID selectors
   (#add_payment_method #payment ..., specificity 2,0,0+), so these overrides
   must also carry both IDs to win. Scoped to .woocommerce-Payment so the
   checkout #payment (checkout.css) is never touched.
   Stripe samples the first opaque ancestor background for its appearance API —
   with .payment_box transparent it falls through to #payment's opaque white. */
body.ci-shop #add_payment_method #payment.woocommerce-Payment {
    background: #fff;
    padding: 0;
    border: 0;
    box-shadow: none;
}
body.ci-shop #add_payment_method #payment.woocommerce-Payment ul {
    padding: 0;
    border: 0;
    background: transparent;
}
body.ci-shop #add_payment_method #payment.woocommerce-Payment .woocommerce-PaymentBox,
body.ci-shop #add_payment_method #payment.woocommerce-Payment div.payment_box {
    background: transparent;
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}
/* The "4" upward triangle is WC's speech-bubble ::before on the payment box */
body.ci-shop #add_payment_method #payment.woocommerce-Payment .woocommerce-PaymentBox::before,
body.ci-shop #add_payment_method #payment.woocommerce-Payment div.payment_box::before { display: none; }
/* Container 3 — the Stripe UPE fieldset (UA groove default) wears the checkout
   grey-box styling */
body.ci-shop #add_payment_method #payment.woocommerce-Payment fieldset#wc-stripe-upe-form {
    background-color: #f6f6f6;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    padding: 18px;
    margin: 0;
}
/* Single-gateway radio renders with no label because ci_client.css hides
   label[for="payment_method_stripe"] with !important (a Breakdance-era rule the
   checkout relies on) — on THIS page show the label so the radio isn't naked.
   !important required to beat the ci_client !important at higher specificity. */
body.ci-shop #add_payment_method label[for="payment_method_stripe"] {
    display: inline-block !important;
    font-weight: 500;
    margin-left: 0.35rem;
}

/* Account-details "Password change" fieldset — soften the UA groove border to
   the shared field-border grey; legend bold, a touch larger, with side breathing room */
body.ci-shop .woocommerce-EditAccountForm fieldset {
    border: 1px solid #d1d5db;
    border-radius: 3px;
    padding: 0.5rem 1.25rem 1rem;
}
body.ci-shop .woocommerce-EditAccountForm fieldset legend {
    font-weight: 700;
    font-size: 1.1em;
    padding: 0 0.6em;
    margin-left: -0.6em;
}