/*
 * Account layout (formerly account-navigation.css): navigation, order pagination, and compact titles.
 * Navigation/pagination are scoped to woocommerce-account; titles use the page class added in main.php.
 */
/* Navigation: reduce menu spacing while preserving Storefront icon glyphs. */
body.woocommerce-account .woocommerce-MyAccount-navigation ul {
    margin: 0 0 24px;
    padding: 0;
    border: 0;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    margin: 0;
    padding: 0;
    border: 0;
    border-bottom: 1px solid #f5e5d9;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link a {
    /* Override theme/page-builder link layout so the icon cannot wrap above the label. */
    display: flex !important;
    position: relative;
    flex-direction: row !important;
    flex-wrap: nowrap;
    align-items: center !important;
    gap: 12px;
    box-sizing: border-box;
    min-height: 52px;
    margin: 0;
    padding: 12px 48px 12px 14px !important; /* Reserve space on the right so long labels do not overlap the icon. */
    font-size: 16px;
    line-height: 1.5;
    text-decoration: none;
    color: #c6530b;
    border-radius: 6px;
    overflow-wrap: anywhere;
}

/* Some content formatters wrap labels in paragraphs or insert line breaks. */
body.woocommerce-account .woocommerce-MyAccount-navigation ul li a > p,
body.woocommerce-account .woocommerce-MyAccount-navigation ul li a > span {
    margin: 0 !important;
    padding: 0 !important;
    line-height: inherit;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li a > br {
    display: none;
}

/* Center icons within the link to avoid vertical offsets from theme floats and font baselines. */
body.woocommerce-account .woocommerce-MyAccount-navigation ul li a::before {
    position: absolute !important;
    top: 50% !important;
    right: 14px !important;
    bottom: auto !important;
    left: auto !important;
    transform: translateY(-50%);
    float: none !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 24px;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 17px;
    line-height: 1 !important;
    text-align: center;
    color: #f37429;
    opacity: 1;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    background: #ffeadb;
    font-weight: 600;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
    background: #fff2e8;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li a:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: -2px;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a::before,
body.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover::before {
    opacity: 1;
}

/* Order pagination: style the buttons while retaining WooCommerce links and first/last-page rules. */
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-pagination--without-numbers {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 20px;
}

/* Handle formatter-inserted paragraphs and breaks so Previous and Next stay on the same row. */
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-pagination--without-numbers > p {
    display: flex;
    gap: 10px;
    margin: 0;
}

body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-pagination--without-numbers br {
    display: none;
}

body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-pagination--without-numbers .woocommerce-button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    float: none !important;
    /* Keep both pagination buttons equally wide, regardless of label length. */
    width: 132px;
    min-width: 132px;
    flex: 0 0 132px;
    min-height: 44px;
    box-sizing: border-box;
    margin: 0 !important;
    padding: 9px 16px;
    border: 1px solid #8450b5;
    border-radius: 0;
    background: #fff;
    color: #7540a6;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    text-decoration: none;
}

body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-pagination--without-numbers .woocommerce-button:hover {
    background: #f4eef9;
}

body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-pagination--without-numbers .woocommerce-button:focus-visible {
    outline: 2px solid #7540a6;
    outline-offset: 3px;
}

/* Address overview: compact cards with a full-size, labelled edit link. */
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    width: 100%;
    float: none;
    margin: 20px 0 28px;
}

body.woocommerce-account .woocommerce-Addresses::before,
body.woocommerce-account .woocommerce-Addresses::after,
body.woocommerce-account .woocommerce-Address-title::before,
body.woocommerce-account .woocommerce-Address-title::after {
    display: none;
}

body.woocommerce-account .woocommerce-Addresses .woocommerce-Address {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    float: none;
    margin: 0;
    padding: 20px;
    border: 1px solid #e7e1ec;
    border-radius: 8px;
    background: #fff;
}

body.woocommerce-account .woocommerce-Address .woocommerce-Address-title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: 12px;
    min-height: 0;
    height: auto;
    margin: 0 0 16px;
    padding: 0 0 14px;
    border-bottom: 1px solid #eeeaf2;
}

/* Auto-formatting must not insert extra rows into one address header only. */
body.woocommerce-account .woocommerce-Address-title > br {
    display: none;
}
body.woocommerce-account .woocommerce-Address-title > p {
    margin: 0;
    padding: 0;
}

body.woocommerce-account .woocommerce-Address-title h2,
body.woocommerce-account .woocommerce-Address-title h3 {
    float: none;
    margin: 0;
    padding: 0;
    font-size: 22px;
    font-weight: 600;
    line-height: 1.3;
}

body.woocommerce-account .woocommerce-Address-title a.edit {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box;
    float: none;
    position: static;
    width: auto;
    height: auto !important;
    min-height: 44px;
    margin: 0;
    padding: 10px 14px !important;
    overflow: visible;
    text-indent: 0;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4 !important;
    text-align: center;
    text-decoration: none;
    color: #70409b;
    background: #f5effa;
    border: 1px solid #ded0ea;
    border-radius: 5px;
}

body.woocommerce-account .woocommerce-Address-title a.edit::before,
body.woocommerce-account .woocommerce-Address-title a.edit::after {
    display: none !important;
    content: none !important;
}

/* Ignore formatter-inserted spacing inside the button label. */
body.woocommerce-account .woocommerce-Address-title a.edit > br {
    display: none;
}

body.woocommerce-account .woocommerce-Address-title a.edit > p,
body.woocommerce-account .woocommerce-Address-title a.edit > span {
    margin: 0 !important;
    padding: 0 !important;
    line-height: inherit !important;
}

body.woocommerce-account .woocommerce-Address-title a.edit:hover {
    background: #eae0f3;
    color: #542d78;
}

body.woocommerce-account .woocommerce-Address-title a.edit:focus-visible {
    outline: 2px solid #70409b;
    outline-offset: 3px;
}

body.woocommerce-account .woocommerce-Address address {
    margin: 0;
    font-style: normal;
    line-height: 1.65;
    overflow-wrap: anywhere;
}

@media (max-width: 767px) {
    body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
    }
}

/* Account endpoints, Promotions, and Brands share title spacing controlled by this variable. */
body.jj-compact-page-header {
    --jj-title-space: 24px;
}

/* Remove accumulated theme container spacing that pushes page content below the title. */
body.jj-compact-page-header .site-header {
    margin-bottom: 0 !important;
}

body.jj-compact-page-header .site-content,
body.jj-compact-page-header .content-area,
body.jj-compact-page-header .site-main {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

body.jj-compact-page-header .storefront-breadcrumb {
    padding-top: 12px;
    padding-bottom: 0;
    margin-bottom: 0;
}

body.jj-compact-page-header .site-main > .type-page {
    padding-top: 0 !important;
}

/* Give both title containers the same vertical spacing and remove fixed/minimum heights. */
body.jj-compact-page-header .site-main .type-page > .entry-header,
body.jj-compact-page-header .site-main .woocommerce-products-header {
    height: auto !important;
    min-height: 0 !important;
    padding: var(--jj-title-space) 0 !important;
    margin: 0 !important;
    text-align: center;
}

body.jj-compact-page-header .entry-header .entry-title,
body.jj-compact-page-header .woocommerce-products-header .page-title {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.2;
}

body.jj-compact-page-header .woocommerce-products-header .term-description {
    margin: 12px 0 0 !important;
    padding: 0 !important;
}

body.jj-compact-page-header .woocommerce-products-header .term-description p {
    margin: 0 !important;
}

/* Category cards are inside the header, so header padding cannot separate them from the title. */
body.jj-compact-page-header .woocommerce-products-header .jj-v2-subcategories {
    margin-top: 32px;
}

/* Reduce title spacing on small screens while keeping titles and promotion descriptions visible. */
@media (max-width: 767px) {
    body.jj-compact-page-header {
        --jj-title-space: 16px;
    }

    body.jj-compact-page-header .woocommerce-products-header .jj-v2-subcategories {
        margin-top: 24px;
    }
}

/* Guest login: keep the form readable instead of spanning the entire page. */
body.woocommerce-account:not(.logged-in) .woocommerce:has(> form.woocommerce-form-login) {
    box-sizing: border-box;
    max-width: 480px;
    margin: 8px auto 48px;
    padding: 28px 32px;
    border: 1px solid #e7e1ec;
    border-radius: 8px;
    background: #fff;
}

body.woocommerce-account:not(.logged-in) .woocommerce:has(> form.woocommerce-form-login) > h2 {
    margin: 0 0 24px;
    font-size: 28px;
    font-weight: 500;
    line-height: 1.3;
}

body.woocommerce-account:not(.logged-in) form.woocommerce-form-login {
    margin: 0;
    padding: 0;
    border: 0;
}

body.woocommerce-account form.woocommerce-form-login .form-row {
    width: 100%;
    float: none;
    margin: 0 0 18px;
    padding: 0;
}

body.woocommerce-account form.woocommerce-form-login .form-row > label:not(.woocommerce-form-login__rememberme) {
    display: block;
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;
}

body.woocommerce-account form.woocommerce-form-login .form-row > br {
    display: none;
}

body.woocommerce-account form.woocommerce-form-login input.input-text {
    box-sizing: border-box;
    width: 100%;
    min-height: 48px;
    margin: 0;
    padding: 11px 14px;
    border: 1px solid #d7dce1;
    border-radius: 4px;
    background: #fff;
    box-shadow: none;
    font-size: 16px;
    line-height: 1.5;
}

body.woocommerce-account form.woocommerce-form-login .password-input {
    display: block;
    position: relative;
}

body.woocommerce-account form.woocommerce-form-login .password-input input {
    padding-right: 52px;
}

body.woocommerce-account form.woocommerce-form-login .show-password-input {
    position: absolute;
    top: 50%;
    right: 2px;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

body.woocommerce-account form.woocommerce-form-login .woocommerce-form-login__rememberme {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 16px;
    font-size: 14px;
    line-height: 1.5;
}

body.woocommerce-account form.woocommerce-form-login input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: #9a3b08;
}

body.woocommerce-account form.woocommerce-form-login .woocommerce-form-login__submit {
    float: none;
    width: 100%;
    min-height: 48px;
    margin: 0;
    padding: 12px 20px;
    border-radius: 4px;
    background: #f37429;
    color: #fff;
    font-size: 16px;
    line-height: 1.5;
}

body.woocommerce-account form.woocommerce-form-login .woocommerce-form-login__submit:hover {
    background: #d95f18;
}

body.woocommerce-account form.woocommerce-form-login .lost_password {
    margin: 6px 0 0;
    font-size: 14px;
    text-align: center;
}

body.woocommerce-account form.woocommerce-form-login input:focus-visible,
body.woocommerce-account form.woocommerce-form-login button:focus-visible,
body.woocommerce-account form.woocommerce-form-login a:focus-visible {
    outline: 2px solid #9a3b08;
    outline-offset: 3px;
}

@media (max-width: 480px) {
    body.woocommerce-account:not(.logged-in) .woocommerce:has(> form.woocommerce-form-login) {
        padding: 24px 18px;
        margin-bottom: 32px;
    }
}

/* Account home: welcome message and full-card shortcut links. */
body.woocommerce-account .jj-account-home .jj-account-welcome {
    margin: 0 0 8px;
    font-size: 24px;
    font-weight: 500;
    line-height: 1.4;
    overflow-wrap: anywhere;
}
body.woocommerce-account .jj-account-home .jj-account-intro {
    margin: 0 0 26px;
    color: #74675f;
    font-size: 14px;
    line-height: 1.6;
}
body.woocommerce-account .jj-account-shortcuts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 32px;
}
body.woocommerce-account .jj-account-shortcuts .jj-account-shortcut {
    position: relative;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-height: 220px;
    padding: 28px 20px 22px;
    border: 1px solid #f6c5a4;
    border-radius: 8px;
    background: #fff8f2;
    color: #c6530b;
    text-align: center;
    text-decoration: none;
    transition: background-color 150ms ease, border-color 150ms ease, transform 150ms ease;
}
body.woocommerce-account .jj-account-shortcut:hover {
    background: #ffeadb;
    border-color: #f37429;
    transform: translateY(-1px);
}
body.woocommerce-account .jj-account-shortcut:focus-visible {
    outline: 2px solid #c6530b;
    outline-offset: 3px;
}
body.woocommerce-account .jj-account-shortcut-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    margin: 0 auto;
    background: #ffeadb;
    border-radius: 12px;
    color: #f37429;
}
body.woocommerce-account .jj-account-shortcut-icon svg {
    width: 28px;
    height: 28px;
}
body.woocommerce-account .jj-account-shortcut-copy {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-width: 0;
    max-width: 220px;
    overflow-wrap: anywhere;
}
body.woocommerce-account .jj-account-shortcut-title {
    display: block;
    color: #c6530b;
    font-size: clamp(22px, 2vw, 28px);
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: -0.02em;
}
body.woocommerce-account .jj-account-shortcut-description {
    display: block;
    color: #74675f;
    font-size: 13px;
    line-height: 1.5;
}
body.woocommerce-account .jj-account-shortcut-arrow {
    position: absolute;
    right: 16px;
    bottom: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #f37429;
    font-size: 28px;
    line-height: 1;
}
@media (max-width: 767px) {
    body.woocommerce-account .jj-account-shortcuts {
        grid-template-columns: minmax(0, 1fr);
    }
    body.woocommerce-account .jj-account-shortcuts .jj-account-shortcut {
        min-height: 180px;
    }
}

/* Keep shortcode auto-formatting from inserting extra card/grid items. */
body.woocommerce-account .jj-account-home .jj-account-shortcuts br {
    display: none !important;
}
body.woocommerce-account .jj-account-home .jj-account-shortcuts > p,
body.woocommerce-account .jj-account-home .jj-account-shortcut > p {
    display: contents;
}
body.woocommerce-account .jj-account-home .jj-account-shortcuts::before,
body.woocommerce-account .jj-account-home .jj-account-shortcuts::after,
body.woocommerce-account .jj-account-home .jj-account-shortcut::before,
body.woocommerce-account .jj-account-home .jj-account-shortcut::after {
    content: none !important;
    display: none !important;
}
body.woocommerce-account .jj-account-home .jj-account-shortcut {
    width: 100%;
    min-width: 0;
    margin: 0;
}
body.woocommerce-account .jj-account-home .jj-account-shortcut-copy {
    width: 100%;
    word-break: normal;
    overflow-wrap: break-word;
}
body.woocommerce-account .jj-account-home .jj-account-shortcut-copy p {
    margin: 0;
    padding: 0;
}

/* Shared focus ring for links, buttons and form controls across the storefront. */
body a:focus,
body button:focus,
body input:focus,
body select:focus,
body textarea:focus,
body [role="button"]:focus {
    outline: 2px solid #804bb1 !important;
    outline-offset: 3px !important;
}

/* Checkout themes may draw a second focus ring with box-shadow. */
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:focus,
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:focus-visible,
body.woocommerce-cart .wc-block-cart__submit-button:focus,
body.woocommerce-cart .wc-block-cart__submit-button:focus-visible {
    box-shadow: none !important;
    outline: 2px solid #804bb1 !important;
    outline-offset: 3px !important;
}