/**
 * My Orders — load AFTER kitup-brand.css (Lexend/grey .column.main inheritance + link colors).
 * Max-specificity + :visited fixes for View / icons.
 *
 * KitUP reference typography: Montserrat / Poppins (geometric sans). kitup-brand forces Lexend on
 * body / .columns / .column.main — these rules win via order + specificity.
 */
html body.account,
html body[class*="customer-account"] {
    font-family: 'Montserrat', 'Poppins', ui-sans-serif, system-ui, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

html body.account .page-main,
html body[class*="customer-account"] .page-main,
html body.account .columns,
html body[class*="customer-account"] .columns,
html body.account .column.main,
html body[class*="customer-account"] .column.main {
    font-family: 'Montserrat', 'Poppins', ui-sans-serif, system-ui, sans-serif !important;
}

html body.account .page-title-wrapper .page-title,
html body[class*="customer-account"] .page-title-wrapper .page-title,
html body.account .page-title-wrapper .page-title span,
html body[class*="customer-account"] .page-title-wrapper .page-title span {
    font-family: 'Montserrat', 'Poppins', ui-sans-serif, system-ui, sans-serif !important;
}

html body.account .block.account-nav .title strong,
html body[class*="customer-account"] .block.account-nav .title strong,
html body.account .block.account-nav .nav.item > a,
html body.account .block.account-nav .nav.item > strong,
html body[class*="customer-account"] .block.account-nav .nav.item > a,
html body[class*="customer-account"] .block.account-nav .nav.item > strong {
    font-family: 'Montserrat', 'Poppins', ui-sans-serif, system-ui, sans-serif !important;
}

html body.account .order-products-toolbar,
html body[class*="customer-account"] .order-products-toolbar,
html body.account .order-products-toolbar .pager,
html body[class*="customer-account"] .order-products-toolbar .pager {
    font-family: 'Montserrat', 'Poppins', ui-sans-serif, system-ui, sans-serif !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history {
    width: 100% !important;
    max-width: 100% !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history .kitup-orders-history__panel,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history .kitup-orders-history__panel {
    width: 100% !important;
    max-width: 100% !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table.data.table,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table.data.table {
    border: none !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    font-family: 'Montserrat', 'Poppins', ui-sans-serif, system-ui, sans-serif !important;
}

/* Use full row width: wider data columns, Actions only its share (no empty slab on the right) */
html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.id,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.id {
    width: 17% !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.date,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.date {
    width: 14% !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.items,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.items {
    width: 14% !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.total,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.total {
    width: 15% !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.status,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.status {
    width: 26% !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.actions,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.actions {
    width: 14% !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table > thead > tr > th,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table > thead > tr > th {
    color: #111827 !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    line-height: 1.35 !important;
    font-family: 'Montserrat', 'Poppins', ui-sans-serif, system-ui, sans-serif !important;
    background: #f3f4f6 !important;
    border: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
    padding: 14px 16px !important;
    vertical-align: middle !important;
    text-align: left !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table > thead > tr > th:first-child,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table > thead > tr > th:first-child {
    border-top-left-radius: 8px !important;
    border-bottom-left-radius: 8px !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table > thead > tr > th:last-child,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table > thead > tr > th:last-child {
    border-top-right-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table > tbody > tr > td,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table > tbody > tr > td {
    color: #111827 !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    font-weight: 400 !important;
    font-family: 'Montserrat', 'Poppins', ui-sans-serif, system-ui, sans-serif !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 18px 16px !important;
    vertical-align: middle !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.id,
html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.total,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.id,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table .col.total {
    font-weight: 700 !important;
}

/* Status pills — explicit td + span so nothing from .column.main grey wins */
html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table td.col.status .kitup-order-status.kitup-order-status--shipped,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table td.col.status .kitup-order-status.kitup-order-status--shipped {
    background-color: #0a114f !important;
    background: #0a114f !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border-radius: 999px !important;
    padding: 7px 16px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
    display: inline-block !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table td.col.status .kitup-order-status.kitup-order-status--delivered,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table td.col.status .kitup-order-status.kitup-order-status--delivered {
    background-color: #00d1b2 !important;
    background: #00d1b2 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border-radius: 999px !important;
    padding: 7px 16px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
    display: inline-block !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table td.col.status .kitup-order-status.kitup-order-status--plain,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table td.col.status .kitup-order-status.kitup-order-status--plain {
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
    font-weight: 400 !important;
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

/* Actions row */
html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table td.col.actions,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table td.col.actions {
    white-space: nowrap !important;
    min-width: 0 !important;
    overflow: visible !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history .kitup-order-actions,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history .kitup-order-actions {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    line-height: 1 !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history .kitup-order-actions__icons,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history .kitup-order-actions__icons {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 4px !important;
    height: 22px !important;
    line-height: 0 !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--text,
html body.account .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--text:visited,
html body.account .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--text:hover,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--text,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--text:visited,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--text:hover {
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
    font-weight: 400 !important;
    opacity: 1 !important;
    text-decoration: none !important;
    font-family: 'Montserrat', 'Poppins', ui-sans-serif, system-ui, sans-serif !important;
    font-size: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    align-self: center !important;
    line-height: 1.5 !important;
    min-height: 22px !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--icon,
html body.account .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--icon:visited,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--icon,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--icon:visited,
html body.account .column.main .table-wrapper.kitup-orders-history span.kitup-order-action--icon,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history span.kitup-order-action--icon {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 14px !important;
    line-height: 0 !important;
    color: #374151 !important;
    -webkit-text-fill-color: #374151 !important;
    opacity: 1 !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--icon .fa,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--icon .fa,
html body.account .column.main .table-wrapper.kitup-orders-history span.kitup-order-action--icon .fa,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history span.kitup-order-action--icon .fa {
    line-height: 1 !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
}

/* Single PDF glyph — avoids clipped/overlapping fa-file-o + fa-arrow-down in 24px hit area */
html body.account .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--icon.kitup-order-action--invoice,
html body.account .column.main .table-wrapper.kitup-orders-history span.kitup-order-action--icon.kitup-order-action--invoice,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--icon.kitup-order-action--invoice,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history span.kitup-order-action--icon.kitup-order-action--invoice {
    overflow: visible !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history .kitup-invoice-icon,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history .kitup-invoice-icon {
    font-size: 14px !important;
    line-height: 1 !important;
    display: block !important;
    font-family: FontAwesome !important;
    font-style: normal !important;
    font-weight: normal !important;
    color: inherit !important;
    -webkit-text-fill-color: inherit !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--icon:hover,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history a.kitup-order-action--icon:hover {
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history .kitup-order-action--disabled,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history .kitup-order-action--disabled {
    opacity: 0.4 !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom {
    /* font-size: 14px !important;
    margin-top: 20px !important;
    padding-top: 16px !important;
    border-top: 1px solid #e5e7eb !important;
    display: flex !important;
    flex-direction: row !important; */
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    row-gap: 12px !important;
    column-gap: 20px !important;
    color: #111827 !important;
    clear: both !important;
    text-align: left !important;
    width: 100% !important;
}

/* Core pager wraps rows in .pager; floats caused “3 Item(s)” + “Show” to touch */
html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px 20px !important;
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager .toolbar-amount,
html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager .limiter,
html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager .pages,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager .toolbar-amount,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager .limiter,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager .pages {
    float: none !important;
    clear: none !important;
}

/* Theme pager: hard separator between “Item(s)” and “Show” (flex item) */
html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .kitup-pager-amount-gap,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .kitup-pager-amount-gap {
    flex: 0 0 auto !important;
    width: 12px !important;
    min-width: 12px !important;
    max-width: 12px !important;
    height: 1px !important;
    overflow: hidden !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .toolbar-amount,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .toolbar-amount {
    margin: 0 !important;
    padding: 0 !important;
    padding-right: 8px !important;
    line-height: 1.5 !important;
    flex: 0 0 auto !important;
    float: none !important;
}

/* Space after count so “3 Item(s)” does not run into “Show” */
html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .toolbar-amount::after,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .toolbar-amount::after {
    content: '\2003' !important;
    display: inline !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .toolbar-amount .toolbar-number::after,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .toolbar-amount .toolbar-number::after {
    content: '\00a0' !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .limiter,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .limiter {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    margin: 0 !important;
    margin-inline-start: 0 !important;
    padding: 0 !important;
    line-height: 1.5 !important;
    float: none !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .limiter .label,
html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .limiter .limiter-label,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .limiter .label,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .limiter .limiter-label {
    margin: 0 !important;
    padding: 0 8px 0 0 !important;
    padding-top: 0 !important;
    white-space: nowrap !important;
    line-height: 1.5 !important;
    display: inline-flex !important;
    align-items: center !important;
    font-weight: 400 !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .limiter .limiter-text,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .limiter .limiter-text {
    margin: 0 !important;
    padding: 0 0 0 8px !important;
    line-height: 1.5 !important;
    display: inline-flex !important;
    align-items: center !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .limiter .limiter-options,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .limiter .limiter-options {
    border-radius: 6px !important;
    padding: 6px 10px !important;
    border: 1px solid #d1d5db !important;
    background: #fff !important;
    color: #111827 !important;
    min-height: 36px !important;
    line-height: 1.25 !important;
    vertical-align: middle !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pages,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pages,
html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager .pages,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager .pages {
    flex: 1 1 100% !important;
    margin-top: 4px !important;
    float: none !important;
    clear: both !important;
    order: 3 !important;
    text-align: left !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pages .items,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pages .items,
html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager .pages .items,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager .pages .items {
    display: inline-flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager .toolbar-amount,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager .toolbar-amount {
    order: 1 !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager .limiter,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom .pager .limiter {
    order: 2 !important;
}

/* No .pager wrapper: keep page numbers on second row after amount + limiter */
html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom > .toolbar-amount,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom > .toolbar-amount {
    order: 1 !important;
}

html body.account .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom > .limiter,
html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history + .order-products-toolbar.toolbar.bottom > .limiter {
    order: 2 !important;
}

@media only screen and (max-width: 767px) {
    html body.account .column.main .table-wrapper.kitup-orders-history #my-orders-table tbody > tr > td.col.actions,
    html body[class*="customer-account"] .column.main .table-wrapper.kitup-orders-history #my-orders-table tbody > tr > td.col.actions {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
    }
}