.page-main {
    width: 90% !important;
}

/* Login page - exclude from dashboard grid layout */
.customer-account-login .column.main {
    display: block;
    padding: 20px 0;
}

.customer-account-login .login-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 40px;
    max-width: 1200px;
    margin: 0 auto;
}

.customer-account-login .login-container .block {
    flex: 1 1 400px;
    max-width: 500px;
    min-width: 300px;
    padding: 30px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 30, 60, 0.1);
}

.customer-account-login .login-container .block-title {
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 2px solid #017ae3;
}

.customer-account-login .login-container .block-title strong {
    font-size: 1.4rem;
    color: #333;
}

.customer-account-login .login-container .field {
    margin-bottom: 20px;
}

.customer-account-login .login-container .field .label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #333;
}

.customer-account-login .login-container .field .control input {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 1rem;
    transition: border-color 0.3s ease;
}

.customer-account-login .login-container .field .control input:focus {
    border-color: #017ae3;
    outline: none;
}

.customer-account-login .login-container .field.note {
    color: #666;
    font-size: 0.95rem;
    margin-bottom: 20px;
}

.customer-account-login .login-container .actions-toolbar {
    margin-top: 25px;
}

.customer-account-login .login-container .actions-toolbar .primary button,
.customer-account-login .login-container .actions-toolbar .primary a {
    display: inline-block;
    padding: 12px 30px;
    background: #017ae3;
    color: #fff;
    border: none;
    border-radius: 5px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 0.3s ease;
}

.customer-account-login .login-container .actions-toolbar .primary button:hover,
.customer-account-login .login-container .actions-toolbar .primary a:hover {
    background: #0056b3;
}

.customer-account-login .login-container .actions-toolbar .secondary {
    margin-top: 15px;
}

.customer-account-login .login-container .actions-toolbar .secondary a {
    color: #017ae3;
    text-decoration: none;
}

.customer-account-login .login-container .actions-toolbar .secondary a:hover {
    text-decoration: underline;
}

.customer-account-login .block-new-customer .block-content p {
    color: #666;
    line-height: 1.6;
    margin-bottom: 20px;
}

/* Social login section styling */
.customer-account-login .amsl-login-page {
    text-align: center;
    margin: 40px auto 0;
    max-width: 500px;
}

.customer-account-login .amsl-separator {
    display: block;
    margin: 20px 0;
    position: relative;
}

.customer-account-login .amsl-separator::before,
.customer-account-login .amsl-separator::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 40%;
    height: 1px;
    background: #ddd;
}

.customer-account-login .amsl-separator::before {
    left: 0;
}

.customer-account-login .amsl-separator::after {
    right: 0;
}

/* Login page responsive */
@media screen and (max-width: 768px) {
    .customer-account-login .column.main {
        padding: 10px 0;
        margin-top: 20px;
    }

    .customer-account-login .login-container {
        flex-direction: column;
        padding: 0 10px;
        gap: 15px;
        width: 100%;
        box-sizing: border-box;
    }

    .customer-account-login .login-container .block {
        max-width: 100%;
        min-width: unset;
        width: 100%;
        padding: 15px;
        margin: 0;
        box-sizing: border-box;
    }

    .customer-account-login .login-container .block-title {
        margin-bottom: 15px;
        padding-bottom: 10px;
        background: #f5f5f5;
        margin: -15px -15px 15px -15px;
        padding: 12px 15px;
        border-radius: 8px 8px 0 0;
        border-bottom: 2px solid #017ae3;
    }

    .customer-account-login .login-container .block-title strong {
        font-size: 1.1rem;
    }

    .customer-account-login .login-container .field {
        margin-bottom: 15px;
    }

    .customer-account-login .login-container .field .label {
        margin-bottom: 5px;
        font-size: 0.95rem;
    }

    .customer-account-login .login-container .field .control input {
        padding: 14px 12px;
        font-size: 16px;
        /* Prevents iOS zoom on focus */
        width: 100%;
        box-sizing: border-box;
    }

    .customer-account-login .login-container .field.note {
        font-size: 0.9rem;
        margin-bottom: 15px;
    }

    .customer-account-login .login-container .field.choice {
        margin-bottom: 10px;
    }

    .customer-account-login .login-container .field.choice label {
        font-size: 0.9rem;
    }

    .customer-account-login .login-container .actions-toolbar {
        margin-top: 20px;
    }

    .customer-account-login .login-container .actions-toolbar .primary {
        width: 100%;
    }

    .customer-account-login .login-container .actions-toolbar .primary button,
    .customer-account-login .login-container .actions-toolbar .primary a {
        width: 100%;
        padding: 14px 20px;
        font-size: 1rem;
        text-align: center;
        box-sizing: border-box;
    }

    .customer-account-login .login-container .actions-toolbar .secondary {
        margin-top: 12px;
        text-align: center;
    }

    .customer-account-login .block-new-customer .block-content p {
        font-size: 0.95rem;
        margin-bottom: 15px;
    }

    /* Social login mobile */
    .customer-account-login .amsl-login-page {
        margin: 20px auto 0;
        padding: 0 10px;
        max-width: 100%;
    }

    .customer-account-login .amsl-social-wrapper {
        padding: 0;
    }

    .customer-account-login .amsl-button {
        width: 100%;
        padding: 12px;
    }
}

/* End login page styles */

/* ============================================
   CREATE PASSWORD / RESET PASSWORD PAGE STYLES
   ============================================ */
.customer-account-createpassword .column.main {
    display: block;
    padding: 40px 20px;
    max-width: 600px;
    margin: 0 auto;
}

.customer-account-createpassword .form-create-password,
.customer-account-createpassword .form.password.reset {
    background: #fff;
    padding: 40px;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 30, 60, 0.1);
}

.customer-account-createpassword .page-title-wrapper {
    margin-bottom: 30px;
    text-align: center;
}

.customer-account-createpassword .page-title {
    font-size: 1.8rem;
    color: #333;
    font-weight: 600;
}

.customer-account-createpassword .fieldset {
    border: none;
    padding: 0;
    margin: 0;
}

.customer-account-createpassword .legend {
    display: none;
}

.customer-account-createpassword .field {
    margin-bottom: 20px;
}

.customer-account-createpassword .field .label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #333;
    font-size: 18px;
}

.customer-account-createpassword .field .control input {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 1rem;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
    box-sizing: border-box;
}

.customer-account-createpassword .field .control input:focus {
    border-color: #017ae3;
    outline: none;
    box-shadow: 0 0 0 3px rgba(1, 122, 227, 0.1);
}

/* Password strength meter styling */
.customer-account-createpassword .password-strength-meter {
    margin-top: 10px;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 500;
}

.customer-account-createpassword .password-none .password-strength-meter {
    background: #f5f5f5;
    color: #666;
}

.customer-account-createpassword .password-weak .password-strength-meter {
    background: #ffebee;
    color: #c62828;
}

.customer-account-createpassword .password-medium .password-strength-meter {
    background: #fff3e0;
    color: #ef6c00;
}

.customer-account-createpassword .password-strong .password-strength-meter {
    background: #e8f5e9;
    color: #2e7d32;
}

.customer-account-createpassword .password-very-strong .password-strength-meter {
    background: #e3f2fd;
    color: #1565c0;
}

/* Show password checkbox */
.customer-account-createpassword .field.choice {
    margin: 15px 0;
}

.customer-account-createpassword .field.choice label {
    font-size: 0.9rem;
    color: #666;
}

/* Submit button styling */
.customer-account-createpassword .actions-toolbar {
    margin-top: 30px;
}

.customer-account-createpassword .actions-toolbar .primary {
    width: 100%;
}

.customer-account-createpassword .actions-toolbar .primary button {
    width: 100%;
    padding: 16px 30px;
    background: #017ae3;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.3s ease, opacity 0.3s ease;
}

.customer-account-createpassword .actions-toolbar .primary button:hover {
    background: #0056b3;
}

/* FIX: Ensure button is ALWAYS clickable when password is strong/valid */
/* The Magento JS may add disabled attribute but we override with CSS */
.customer-account-createpassword .password-strong .actions-toolbar .primary button,
.customer-account-createpassword .password-very-strong .actions-toolbar .primary button {
    pointer-events: auto !important;
    opacity: 1 !important;
}

/* Style for disabled state (weak password) */
.customer-account-createpassword .password-weak .actions-toolbar .primary button,
.customer-account-createpassword .password-none .actions-toolbar .primary button {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Mobile styles for password reset */
@media screen and (max-width: 768px) {
    .customer-account-createpassword .column.main {
        padding: 20px 15px;
        margin-top: 20px;
    }

    .customer-account-createpassword .form-create-password,
    .customer-account-createpassword .form.password.reset {
        padding: 25px 20px;
    }

    .customer-account-createpassword .page-title {
        font-size: 1.4rem;
    }

    .customer-account-createpassword .field .control input {
        padding: 14px 12px;
        font-size: 16px;
        /* Prevents iOS zoom */
    }

    .customer-account-createpassword .actions-toolbar .primary button {
        padding: 14px 20px;
        font-size: 1rem;
    }
}

/* End password reset page styles */

.column.main {
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
}

.c-sidebar {
    display: none;
}

.box {
    float: none !important;
    margin-top: 20px;
}

.column.main>.block {
    width: 100%;
    min-height: 120px;
    box-sizing: border-box;
    margin: 0 5px 10px;
    justify-content: space-between;
}

.box-billing-address {
    float: left !important;
}

.box-shipping-address {
    float: right !important;
}

/*
.block-dashboard-info {
    width: 30%!important;;
}
.block-dashboard-addresses {
    width: 40%!important;;
}
.block-dashboard-orders {
    width: 68%!important;;
}
.block-reviews-dashboard {
    width: 28%!important;;
}
*/
.items.order-links {
    display: none;
}

.orders-history {
    width: 100%;
}

.sidebar-main {
    display: none !important;
}

.pages {
    position: relative !important;
}

.form-wishlist-items {
    width: 100%;
}

.wishlist-toolbar {
    width: 250px;
    margin-top: 20%;
}

.form-address-edit {
    width: 100%;
    max-width: 100%;
}

.form-edit-account {
    width: 100%;
}

/* Nav */
.block-collapsible-nav .content {
    box-shadow: 0 12px 32px 0 rgb(0 30 60 / 12%);
    border-radius: 20px;
    background-color: #fff;
    padding: 15px;
}

.block-collapsible-nav .item.current>strong {
    border-color: #017ae3 !important;
}

.block-collapsible-nav .item a:hover {
    background: #e8e8e88c;
    color: #017ae3;
    font-weight: bold;
}

/* Generic column.main grid disabled - handled per-page now */
.column.main {
    display: block;
    padding: 20px;
}

.block {
    border: 1px solid #f2f2f2;
    border-radius: 5px;
    padding: 15px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.block-title {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 15px;
    border-bottom: 2px solid #333;
    padding-bottom: 5px;
}

.box {
    margin-bottom: 20px;
}

.box-title {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
    display: block;
}

.box-content address {
    font-style: normal;
    line-height: 1.5;
}

.box-actions {
    margin-top: 10px;
}

.action.edit {
    display: inline-block;
    padding: 5px 10px;
    background-color: #1979c3;
    color: white;
    text-decoration: none;
    border-radius: 3px;
}

.table-wrapper {
    overflow-x: auto;
}

table {
    width: 100%;
    border-collapse: collapse;
}

th,
td {
    padding: 10px;
    border: 1px solid #ddd;
    text-align: left;
}

th {
    background-color: #f2f2f2;
    font-weight: bold;
}

.toolbar {
    margin-top: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Responsive */
@media screen and (max-width: 768px) {
    #maincontent {
        margin-top: 50px;
    }

    .page-main {
        width: 100% !important;
    }

    .column.main {
        text-align: center;
        display: block;
        margin-top: 20px;
    }

    .column.main>.block {
        width: 100% !important;
        ;
        margin-left: 0;
    }

    .block-collapsible-nav {
        width: 100% !important;
        margin-top: 0 !important;
        margin-bottom: 20px;
    }

    .block-dashboard-info {
        margin-top: 0 !important;
    }

    .block-collapsible-nav-title {
        border-bottom: 0;
    }

    .block-collapsible-nav-title::after {
        font-size: 32px !important;
        top: -3px !important;
    }

    .box {
        float: none !important;
    }

    .block-dashboard-orders>.block-content {
        text-align: left;
        padding-left: 10px;
    }

    .orders-history {
        max-width: 100%;
        margin-top: 0;
    }

    .form-address-edit {
        width: 100%;
        max-width: 100%;
        margin-top: 0;
    }

    .form-edit-account {
        margin-top: 0;
    }


    .page-main {
        width: 100% !important;
        padding: 10px;
    }

    .column.main {
        display: block;
        margin-top: 20px;
    }

    .block {
        width: 100% !important;
        margin: 0 0 20px 0 !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }

    .block-title {
        font-size: 1.2rem;
        padding: 10px;
        background-color: #f2f2f2;
        margin: -15px -15px 15px -15px;
        border-radius: 5px 5px 0 0;
    }

    .box {
        margin-bottom: 15px;
        padding: 10px;
        background-color: #fff;
        border-radius: 5px;
    }

    .box-title {
        font-size: 1rem;
    }

    .box-content address {
        font-size: 18px;
    }

    .box-actions {
        text-align: center;
        margin-top: 15px;
    }

    .action.edit {
        display: block;
        width: 100%;
        padding: 10px;
        text-align: center;
        font-size: 16px;
    }

    .table-wrapper {
        margin-top: 20px;
        border-top: 0;
    }

    table,
    thead,
    tbody,
    th,
    td,
    tr {
        display: block;
    }

    thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    tr {
        margin-bottom: 15px;
        border: 1px solid #ddd;
        border-radius: 5px;
    }

    td {
        border: none;
        position: relative;
        padding-left: 50%;
        text-align: right;
        padding: 11px 10px !important;
    }

    td:before {
        position: absolute;

        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
        content: attr(data-th) !important;
        font-weight: bold;
        text-align: left;
    }

    .col.actions {
        border: 0;
    }

    .col.actions a {
        margin-top: 30px;
        display: block;
    }

    .action.edit span::after {
        display: none !important;
    }

    .action.delete {
        background-color: #ff0000b5;
        color: white !important;
        text-decoration: none;
        border-radius: 3px;
        height: 25px;
        width: 100%;
        padding: 10px;
        text-align: center;
        font-size: 16px;
    }

    .toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .toolbar .pager {
        margin-top: 15px;
    }

    .limiter,
    .limiter-text {
        display: none;
    }

    .block-collapsible-nav {
        margin-bottom: 20px;
        border: 0;
        box-shadow: none;
    }

    .block-collapsible-nav .content {
        padding: 10px;
    }

    .block-collapsible-nav .item a,
    .block-collapsible-nav .item>strong {
        padding: 10px 15px;
    }

    /* Zamowienie page */
    .order-details-items .table-wrapper {
        overflow-x: visible !important;
    }

    .order-details-items table,
    .order-details-items thead,
    .order-details-items tbody,
    .order-details-items th,
    .order-details-items td,
    .order-details-items tr {
        display: block !important;
    }

    .order-details-items thead tr {
        position: absolute !important;
        top: -9999px !important;
        left: -9999px !important;
    }

    .order-details-items tr {
        border: 1px solid #ccc !important;
        margin-bottom: 10px !important;
    }

    .order-details-items td {
        border: none !important;
        position: relative !important;
        padding-left: 50% !important;
        text-align: left !important;
    }

    .order-details-items td:before {
        content: attr(data-th) !important;
        position: absolute !important;
        left: 6px !important;
        width: 45% !important;
        padding-right: 10px !important;
        white-space: nowrap !important;
        font-weight: bold !important;
    }

    .order-details-items .price-including-tax,
    .order-details-items .price-excluding-tax {
        display: block !important;
        margin-bottom: 5px !important;
    }

    .order-details-items tfoot tr {
        border: none !important;
    }

    .order-details-items tfoot td {
        text-align: right !important;
        padding-left: 0 !important;
    }

    .order-details-items tfoot td:before {
        content: attr(data-th) !important;
        float: left !important;
        font-weight: bold !important;
    }

    .actions-toolbar {
        text-align: center !important;
        margin-top: 20px !important;
    }

    /* Additional styles to ensure visibility */
    .order-details-items * {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .order-details-items td,
    .order-details-items th {
        width: 100% !important;
        float: left !important;
        clear: both !important;
    }

    .order-details-items .price {
        display: inline-block !important;
        margin-left: 5px !important;
    }
}

/* NOWE */

/* ==========================================
   DASHBOARD CARDS - Modern Design
   ========================================== */

/* Dashboard grid layout for index page */
.customer-account-index .column.main {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    padding: 20px;
}

/* Sidebar nav is in sidebar, not in main content on desktop */

/* Cards take their column */
.customer-account-index .column.main>.pg-dashboard-card {
    min-width: 0;
}

/* Orders table spans full width */
.customer-account-index .column.main>.block-dashboard-orders {
    grid-column: 1 / -1;
}

/* Address card spans full width below nav and info */
.customer-account-index .column.main>.pg-card-address {
    grid-column: 1 / -1;
}

/* Hide extra elements from grid */
.customer-account-index .column.main>.loading-mask,
.customer-account-index .column.main>input[type="hidden"],
.customer-account-index .column.main>#authenticationPopup,
.customer-account-index .column.main>form.amhideprice-form,
.customer-account-index .column.main>section.amsearch-overlay-block {
    display: none !important;
    position: absolute;
    visibility: hidden;
}

/* Card Base Styles */
.pg-dashboard-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.pg-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid #f3f4f6;
    background: #fff;
}

.pg-card-title {
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
    margin: 0;
}

.pg-card-edit {
    color: #9ca3af;
    transition: color 0.2s;
    display: flex;
    align-items: center;
}

.pg-card-edit:hover {
    color: #1f2937;
}

.pg-card-edit svg {
    width: 18px;
    height: 18px;
}

.pg-card-body {
    padding: 20px;
}

/* Info Card Sections */
.pg-info-section {
    margin-bottom: 16px;
}

.pg-info-section:last-child {
    margin-bottom: 0;
}

.pg-info-title {
    font-size: 11px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 8px;
}

.pg-customer-name {
    font-size: 14px;
    font-weight: 500;
    color: #1f2937;
    margin: 0;
}

.pg-customer-email {
    font-size: 13px;
    color: #6b7280;
    margin: 2px 0 0;
}

.pg-info-actions {
    margin-top: 8px;
}

.pg-link {
    font-size: 13px;
    color: #2563eb;
    text-decoration: none;
}

.pg-link:hover {
    text-decoration: underline;
}

/* Address Card - Two Columns */
.pg-address-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.pg-address-title {
    font-size: 11px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 8px;
}

.pg-address-content {
    font-size: 13px;
    color: #374151;
    line-height: 1.5;
    font-style: normal;
}

.pg-no-address {
    font-size: 13px;
    color: #9ca3af;
    font-style: italic;
    margin: 0;
}

/* Orders Table */
.customer-account-index .block-dashboard-orders {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    padding: 0;
}

.customer-account-index .block-dashboard-orders .block-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid #f3f4f6;
    margin: 0;
    background: #fff;
}

.customer-account-index .block-dashboard-orders .block-title strong {
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
}

.customer-account-index .block-dashboard-orders .block-title .action.view {
    font-size: 13px;
    color: #2563eb;
    text-decoration: none;
}

.customer-account-index .block-dashboard-orders .block-content {
    padding: 0;
}

.customer-account-index .block-dashboard-orders table {
    border: none;
}

.customer-account-index .block-dashboard-orders table th,
.customer-account-index .block-dashboard-orders table td {
    border: none;
    border-bottom: 1px solid #f3f4f6;
}

.customer-account-index .block-dashboard-orders table thead th {
    background: #f9fafb;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
    font-weight: 600;
    padding: 12px 16px;
}

.customer-account-index .block-dashboard-orders table tbody td {
    padding: 16px;
    color: #374151;
    font-size: 14px;
}

.customer-account-index .block-dashboard-orders table tbody tr:last-child td {
    border-bottom: none;
}

/* Hide shipping column */
.customer-account-index .block-dashboard-orders table th.col.shipping,
.customer-account-index .block-dashboard-orders table td.col.shipping {
    display: none;
}

/* Action links as icons */
.customer-account-index .block-dashboard-orders table td.col.actions .action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    color: #6b7280;
    background: transparent;
    text-decoration: none;
    margin-right: 4px;
    font-size: 0;
}

.customer-account-index .block-dashboard-orders table td.col.actions .action:hover {
    background: #f3f4f6;
    color: #1f2937;
}

.customer-account-index .block-dashboard-orders table td.col.actions .action.view::before {
    content: '';
    width: 18px;
    height: 18px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' 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%3C/path%3E%3Ccircle cx='12' cy='12' r='3'%3E%3C/circle%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}

.customer-account-index .block-dashboard-orders table td.col.actions .action.order::before {
    content: '';
    width: 18px;
    height: 18px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='23 4 23 10 17 10'%3E%3C/polyline%3E%3Cpath d='M20.49 15a9 9 0 1 1-2.12-9.36L23 10'%3E%3C/path%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}

/* Mobile responsive for dashboard */
@media screen and (max-width: 768px) {
    .customer-account-index .column.main {
        grid-template-columns: 1fr !important;
        display: block !important;
    }

    .pg-address-columns {
        grid-template-columns: 1fr;
    }

    .pg-dashboard-card {
        margin-bottom: 20px;
    }
}

/* ==========================================
   STATS CARDS - Top of Dashboard
   ========================================== */

.pg-stats-cards {
    grid-column: 1 / -1;
    display: flex;
    gap: 20px;
    margin-bottom: 0;
}

.pg-stat-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 20px 24px;
    flex: 1;
    min-width: 0;
}

.pg-stat-label {
    font-size: 13px;
    color: #6b7280;
    margin-bottom: 4px;
}

.pg-stat-value {
    font-size: 32px;
    font-weight: 700;
    color: #1f2937;
}

.pg-stat-order {
    font-size: 14px;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 4px;
}

.pg-stat-status {
    font-size: 13px;
    color: #f59e0b;
    font-weight: 500;
}

.pg-stat-status.complete,
.pg-stat-status.shipped,
.pg-stat-status.delivered {
    color: #10b981;
}

.pg-stat-status.processing,
.pg-stat-status.pending {
    color: #f59e0b;
}

.pg-stat-action {
    display: flex;
    align-items: center;
    justify-content: center;
}

.pg-reorder-btn {
    display: inline-block;
    padding: 10px 20px;
    border: 1px solid #374151;
    border-radius: 6px;
    color: #374151;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s;
    white-space: nowrap;
}

.pg-reorder-btn:hover {
    background: #374151;
    color: #fff;
}

/* ==========================================
   SIDEBAR - Icons for Navigation
   ========================================== */

.sidebar .block-collapsible-nav .content {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 8px 0;
    box-shadow: none;
}

.sidebar .block-collapsible-nav .nav.item a,
.sidebar .block-collapsible-nav .nav.item>strong {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    font-size: 14px;
    color: #374151;
    text-decoration: none;
    transition: all 0.15s;
    font-weight: 400;
    border: none;
}

.sidebar .block-collapsible-nav .nav.item a:hover {
    background: #f9fafb;
    color: #1f2937;
}

.sidebar .block-collapsible-nav .nav.item.current>strong {
    background: #eff6ff;
    color: #2563eb;
    font-weight: 500;
    border: none;
}

/* Navigation Icons */
.sidebar .block-collapsible-nav .nav.item a::before,
.sidebar .block-collapsible-nav .nav.item>strong::before {
    content: '';
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* Moje konto (Account) */
.sidebar .block-collapsible-nav .nav.item:first-child a::before,
.sidebar .block-collapsible-nav .nav.item:first-child>strong::before {
    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='%236b7280' stroke-width='2'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'%3E%3C/path%3E%3Ccircle cx='12' cy='7' r='4'%3E%3C/circle%3E%3C/svg%3E");
}

/* Moje zamówienia (Orders) */
.sidebar .block-collapsible-nav .nav.item:nth-child(2) a::before {
    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='%236b7280' stroke-width='2'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'%3E%3C/path%3E%3Cpolyline points='14,2 14,8 20,8'%3E%3C/polyline%3E%3C/svg%3E");
}

/* Moja lista życzeń (Wishlist) */
.sidebar .block-collapsible-nav .nav.item:nth-child(3) a::before,
.sidebar .block-collapsible-nav .nav.item a[href*="wishlist"]::before {
    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='%236b7280' stroke-width='2'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z'%3E%3C/path%3E%3C/svg%3E");
}

/* Książka adresowa (Address) */
.sidebar .block-collapsible-nav .nav.item a[href*="customer/address"]::before {
    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='%236b7280' stroke-width='2'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'%3E%3C/path%3E%3Ccircle cx='12' cy='10' r='3'%3E%3C/circle%3E%3C/svg%3E");
}

/* Dane konta (Account Info) */
.sidebar .block-collapsible-nav .nav.item a[href*="customer/account/edit"]::before {
    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='%236b7280' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='3'%3E%3C/circle%3E%3Cpath d='M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9c.26.6.79 1 1.51 1H21a2 2 0 0 1 0 4h-.09c-.72.26-1.25.79-1.51 1z'%3E%3C/path%3E%3C/svg%3E");
}

/* Zapamiętane metody płatności (Payment) */
.sidebar .block-collapsible-nav .nav.item a[href*="vault"]::before {
    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='%236b7280' stroke-width='2'%3E%3Crect x='1' y='4' width='22' height='16' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='1' y1='10' x2='23' y2='10'%3E%3C/line%3E%3C/svg%3E");
}

/* Current item icon - blue */
.sidebar .block-collapsible-nav .nav.item.current>strong::before {
    filter: brightness(0) saturate(100%) invert(35%) sepia(95%) saturate(1000%) hue-rotate(200deg);
}

/* ==========================================
   STATUS BADGES - Colored
   ========================================== */

.customer-account-index .block-dashboard-orders table td.col.status {
    font-size: 0;
}

.customer-account-index .block-dashboard-orders table td.col.status::before {
    content: attr(data-th);
    display: none;
}

/* Add status badge via JavaScript or by using the status text */
.customer-account-index .block-dashboard-orders table td.col.status {
    position: relative;
}

/* We need JavaScript to add proper classes. For now, style the text */

/* Mobile responsive for stats */
@media screen and (max-width: 768px) {
    .pg-stats-cards {
        flex-direction: column;
        gap: 12px;
    }

    .pg-stat-card {
        padding: 16px;
    }

    .pg-stat-value {
        font-size: 24px;
    }
}

/* ==========================================
   NAVIGATION IN CONTENT AREA - Modern Icons
   ========================================== */

.account .column.main>.block-collapsible-nav {
    grid-column: 1;
    grid-row: 2 / 4;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    height: fit-content;
}

.account .column.main>.block-collapsible-nav .title {
    display: none;
}

.account .column.main>.block-collapsible-nav .content {
    padding: 8px 0;
    background: #fff;
    box-shadow: none;
    border-radius: 0;
}

.account .column.main>.block-collapsible-nav .nav.items {
    list-style: none;
    padding: 0;
    margin: 0;
}

.account .column.main>.block-collapsible-nav .nav.item {
    margin: 0;
}

.account .column.main>.block-collapsible-nav .nav.item .delimiter {
    display: block;
    height: 1px;
    background: #f3f4f6;
    margin: 8px 16px;
}

.account .column.main>.block-collapsible-nav .nav.item a,
.account .column.main>.block-collapsible-nav .nav.item>strong {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    font-size: 14px;
    color: #374151;
    text-decoration: none;
    transition: all 0.15s;
    font-weight: 400;
    border: none !important;
}

.account .column.main>.block-collapsible-nav .nav.item a:hover {
    background: #f9fafb;
    color: #1f2937;
}

.account .column.main>.block-collapsible-nav .nav.item.current>strong {
    background: #eff6ff;
    color: #2563eb;
    font-weight: 500;
    border: none !important;
    border-left: 3px solid #2563eb !important;
}

/* Navigation Icons */
.account .column.main>.block-collapsible-nav .nav.item a::before,
.account .column.main>.block-collapsible-nav .nav.item>strong::before {
    content: '';
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* Moje konto (Account) */
.account .column.main>.block-collapsible-nav .nav.item:first-child a::before,
.account .column.main>.block-collapsible-nav .nav.item:first-child>strong::before {
    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='%236b7280' stroke-width='2'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'%3E%3C/path%3E%3Ccircle cx='12' cy='7' r='4'%3E%3C/circle%3E%3C/svg%3E");
}

/* Moje zamówienia (Orders) */
.account .column.main>.block-collapsible-nav .nav.item:nth-child(2) a::before {
    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='%236b7280' stroke-width='2'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'%3E%3C/path%3E%3Cpolyline points='14,2 14,8 20,8'%3E%3C/polyline%3E%3C/svg%3E");
}

/* Produkty do pobrania (Downloads) */
.account .column.main>.block-collapsible-nav .nav.item:nth-child(3) a::before {
    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='%236b7280' stroke-width='2'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'%3E%3C/path%3E%3Cpolyline points='7 10 12 15 17 10'%3E%3C/polyline%3E%3Cline x1='12' y1='15' x2='12' y2='3'%3E%3C/line%3E%3C/svg%3E");
}

/* Moja lista życzeń (Wishlist) */
.account .column.main>.block-collapsible-nav .nav.item:nth-child(4) a::before {
    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='%236b7280' stroke-width='2'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z'%3E%3C/path%3E%3C/svg%3E");
}

/* Książka adresowa (Address) */
.account .column.main>.block-collapsible-nav .nav.item:nth-child(6) a::before {
    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='%236b7280' stroke-width='2'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'%3E%3C/path%3E%3Ccircle cx='12' cy='10' r='3'%3E%3C/circle%3E%3C/svg%3E");
}

/* Dane konta (Account Info) */
.account .column.main>.block-collapsible-nav .nav.item:nth-child(7) a::before {
    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='%236b7280' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='3'%3E%3C/circle%3E%3Cpath d='M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9c.26.6.79 1 1.51 1H21a2 2 0 0 1 0 4h-.09c-.72.26-1.25.79-1.51 1z'%3E%3C/path%3E%3C/svg%3E");
}

/* Zapamiętane metody płatności (Payment) */
.account .column.main>.block-collapsible-nav .nav.item:nth-child(8) a::before {
    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='%236b7280' stroke-width='2'%3E%3Crect x='1' y='4' width='22' height='16' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='1' y1='10' x2='23' y2='10'%3E%3C/line%3E%3C/svg%3E");
}

/* Moje opinie (Reviews) */
.account .column.main>.block-collapsible-nav .nav.item:nth-child(10) a::before {
    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='%236b7280' stroke-width='2'%3E%3Cpolygon points='12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2'%3E%3C/polygon%3E%3C/svg%3E");
}

/* Subskrypcje newslettera (Newsletter) */
.account .column.main>.block-collapsible-nav .nav.item:nth-child(11) a::before {
    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='%236b7280' stroke-width='2'%3E%3Cpath d='M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z'%3E%3C/path%3E%3Cpolyline points='22,6 12,13 2,6'%3E%3C/polyline%3E%3C/svg%3E");
}

/* Social accounts */
.account .column.main>.block-collapsible-nav .nav.item:nth-child(12) a::before {
    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='%236b7280' stroke-width='2'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'%3E%3C/path%3E%3Ccircle cx='9' cy='7' r='4'%3E%3C/circle%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87'%3E%3C/path%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'%3E%3C/path%3E%3C/svg%3E");
}

/* Current item icon - blue */
.account .column.main>.block-collapsible-nav .nav.item.current>strong::before {
    filter: brightness(0) saturate(100%) invert(35%) sepia(95%) saturate(1000%) hue-rotate(200deg);
}

/* ==========================================
   ORDER HISTORY PAGE - Modern Table Design
   ========================================== */

.sales-order-history .column.main {
    display: flex !important;
    flex-wrap: wrap;
    gap: 30px;
    padding: 30px 20px;
    align-items: flex-start;
}

/* Navigation - LEFT side */
.sales-order-history .column.main>.block-collapsible-nav {
    flex: 0 0 280px;
    max-width: 280px;
    order: 1;
}

/* Orders table - CENTER/MAIN content area */
.sales-order-history .column.main>.orders-history {
    flex: 1 1 0;
    min-width: 0;
    order: 2;
}

/* Toolbar (outside orders-history) - BOTTOM RIGHT, full width row */
.sales-order-history .column.main>.order-products-toolbar,
.sales-order-history .column.main>.toolbar {
    flex: 0 0 100%;
    order: 3;
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 16px 20px;
    background: #f9fafb;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    margin-left: 310px;
    /* Offset to align with orders table */
}

/* Orders History Card Styling */
.sales-order-history .orders-history {
    max-width: 100%;
    width: 100%;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.sales-order-history .orders-history .table-wrapper {
    overflow-x: auto;
    margin: 0;
}

.sales-order-history .orders-history table {
    width: 100%;
    border-collapse: collapse;
    border: none;
}

.sales-order-history .orders-history table th,
.sales-order-history .orders-history table td {
    border: none;
    border-bottom: 1px solid #f3f4f6;
    padding: 14px 16px;
    text-align: left;
}

.sales-order-history .orders-history table thead th {
    background: #f9fafb;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
    font-weight: 600;
}

.sales-order-history .orders-history table tbody td {
    color: #374151;
    font-size: 14px;
}

.sales-order-history .orders-history table tbody tr:hover {
    background: #f9fafb;
}

.sales-order-history .orders-history table tbody tr:last-child td {
    border-bottom: none;
}

/* Order Actions as Buttons */
.sales-order-history .orders-history table td.col.actions {
    white-space: nowrap;
}

.sales-order-history .orders-history table td.col.actions a {
    display: inline-block;
    padding: 6px 12px;
    margin-right: 6px;
    font-size: 13px;
    text-decoration: none;
    border-radius: 6px;
    transition: all 0.2s;
    background: transparent;
}

.sales-order-history .orders-history table td.col.actions a.action.view {
    color: #2563eb;
    border: 1px solid #2563eb;
}

.sales-order-history .orders-history table td.col.actions a.action.view:hover {
    background: #2563eb;
    color: #fff;
}

.sales-order-history .orders-history table td.col.actions a.action.order {
    color: #059669;
    border: 1px solid #059669;
}

.sales-order-history .orders-history table td.col.actions a.action.order:hover {
    background: #059669;
    color: #fff;
}

/* Toolbar INSIDE orders-history (bottom of table) */
.sales-order-history .orders-history .toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 16px 20px;
    background: #f9fafb;
    border-top: 1px solid #f3f4f6;
    gap: 15px;
}

.sales-order-history .orders-history .toolbar .toolbar-amount,
.sales-order-history .column.main>.toolbar .toolbar-amount,
.sales-order-history .column.main>.order-products-toolbar .toolbar-amount {
    font-size: 14px;
    color: #374151;
}

.sales-order-history .orders-history .toolbar .limiter,
.sales-order-history .column.main>.toolbar .limiter,
.sales-order-history .column.main>.order-products-toolbar .limiter {
    display: flex;
    align-items: center;
    gap: 8px;
}

.sales-order-history .orders-history .toolbar .limiter select,
.sales-order-history .column.main>.toolbar .limiter select,
.sales-order-history .column.main>.order-products-toolbar .limiter select {
    padding: 6px 30px 6px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    background: #fff;
    font-size: 14px;
    color: #374151;
    cursor: pointer;
}

/* ==========================================
   ORDER HISTORY PAGE - Mobile Responsive
   ========================================== */

@media screen and (max-width: 768px) {
    .sales-order-history .column.main {
        display: block !important;
        padding: 15px;
    }

    /* Navigation goes to bottom on mobile */
    .sales-order-history .column.main>.block-collapsible-nav {
        order: 10;
        max-width: 100%;
        margin-top: 20px;
    }

    /* Orders table full width */
    .sales-order-history .column.main>.orders-history {
        width: 100%;
        margin-bottom: 20px;
    }

    /* Toolbar full width, no offset */
    .sales-order-history .column.main>.order-products-toolbar,
    .sales-order-history .column.main>.toolbar {
        margin-left: 0;
        flex: 0 0 100%;
        margin-bottom: 20px;
    }

    /* Mobile table styling - card layout */
    .sales-order-history .orders-history table,
    .sales-order-history .orders-history thead,
    .sales-order-history .orders-history tbody,
    .sales-order-history .orders-history th,
    .sales-order-history .orders-history td,
    .sales-order-history .orders-history tr {
        display: block;
    }

    .sales-order-history .orders-history thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .sales-order-history .orders-history tbody tr {
        border: 1px solid #e5e7eb;
        margin-bottom: 15px;
        border-radius: 8px;
        overflow: hidden;
        background: #fff;
    }

    .sales-order-history .orders-history tbody td {
        border: none;
        border-bottom: 1px solid #f3f4f6;
        position: relative;
        padding: 12px 16px 12px 45%;
        text-align: right;
    }

    .sales-order-history .orders-history tbody td:before {
        content: attr(data-th);
        position: absolute;
        left: 16px;
        width: 40%;
        padding-right: 10px;
        font-weight: 600;
        color: #6b7280;
        text-align: left;
        font-size: 12px;
        text-transform: uppercase;
    }

    .sales-order-history .orders-history tbody td:last-child {
        border-bottom: none;
    }

    .sales-order-history .orders-history tbody td.col.actions {
        text-align: center;
        padding-left: 16px;
    }

    .sales-order-history .orders-history tbody td.col.actions:before {
        display: none;
    }

    .sales-order-history .orders-history tbody td.col.actions a {
        margin: 4px;
    }

    .sales-order-history .orders-history .toolbar {
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
    }
}

/* ==========================================
   ADDRESS BOOK PAGE - Card Design
   ========================================== */

.customer-address-index .column.main {
    display: flex !important;
    flex-wrap: wrap;
    gap: 20px;
    padding: 30px 20px;
    align-items: flex-start;
}

/* Navigation - LEFT side */
.customer-address-index .column.main>.block-collapsible-nav {
    flex: 0 0 280px;
    max-width: 280px;
    order: 1;
}

/* Domyślne adresy - RIGHT of nav, takes remaining space */
.customer-address-index .column.main>.block-addresses-default {
    flex: 1 1 0;
    min-width: 0;
    order: 2;
}

/* Dodatkowe adresy - BELOW, full width of content area (offset by nav) */
.customer-address-index .column.main>.block-addresses-list {
    flex: 0 0 calc(100% - 300px);
    margin-left: 300px;
    order: 3;
}

/* Actions toolbar - BOTTOM, aligned with content */
.customer-address-index .column.main>.actions-toolbar {
    flex: 0 0 calc(100% - 300px);
    margin-left: 300px;
    order: 4;
}

/* Block styling */
.customer-address-index .block-addresses-default,
.customer-address-index .block-addresses-list {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    margin-bottom: 0;
    padding: 0;
}

.customer-address-index .block-addresses-default .block-title,
.customer-address-index .block-addresses-list .block-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid #f3f4f6;
    margin: 0;
    background: #f9fafb;
}

.customer-address-index .block-addresses-default .block-title strong,
.customer-address-index .block-addresses-list .block-title strong {
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
    border-bottom: none;
}

.customer-address-index .block-addresses-default .block-content,
.customer-address-index .block-addresses-list .block-content {
    padding: 20px;
}

/* Address boxes inside Domyślne adresy - STACKED FULL WIDTH */
.customer-address-index .block-addresses-default .block-content {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.customer-address-index .box.box-address-billing,
.customer-address-index .box.box-address-shipping {
    width: 100%;
    background: #f9fafb;
    border-radius: 8px;
    padding: 20px;
    margin: 0;
    float: none !important;
    box-sizing: border-box;
}

.customer-address-index .box-title {
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 12px;
}

.customer-address-index .box-content address {
    font-size: 14px;
    color: #374151;
    line-height: 1.6;
    font-style: normal;
}

/* Action Buttons */
.customer-address-index .box-actions {
    margin-top: 16px;
}

.customer-address-index .box-actions a.action {
    display: inline-block;
    padding: 10px 20px;
    font-size: 13px;
    text-decoration: none;
    border-radius: 6px;
    transition: all 0.2s;
    background: #2563eb;
    color: #fff !important;
    border: none;
    margin-right: 8px;
}

.customer-address-index .box-actions a.action:hover {
    background: #1d4ed8;
}

/* Additional Addresses Table */
.customer-address-index .block-addresses-list .additional-addresses table {
    width: 100%;
    border-collapse: collapse;
    border: none;
}

.customer-address-index .block-addresses-list table th,
.customer-address-index .block-addresses-list table td {
    border: none;
    border-bottom: 1px solid #f3f4f6;
    padding: 14px 16px;
    text-align: left;
}

.customer-address-index .block-addresses-list table thead th {
    background: #f9fafb;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
    font-weight: 600;
}

.customer-address-index .block-addresses-list table tbody td {
    color: #374151;
    font-size: 14px;
}

/* Add New Address Button */
.customer-address-index .actions-toolbar {
    margin-top: 0;
}

.customer-address-index .actions-toolbar .action.primary {
    display: inline-block;
    padding: 12px 24px;
    background: #2563eb;
    color: #fff !important;
    text-decoration: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    transition: all 0.2s;
    border: none;
}

.customer-address-index .actions-toolbar .action.primary:hover {
    background: #1d4ed8;
}

/* Empty Message */
.customer-address-index .block-addresses-list .block-content .empty {
    padding: 20px;
    text-align: center;
    color: #6b7280;
    font-style: italic;
}

/* ==========================================
   ADDRESS BOOK PAGE - Mobile Responsive
   ========================================== */

@media screen and (max-width: 768px) {
    .customer-address-index .column.main {
        display: block !important;
        padding: 15px;
    }

    /* Navigation at bottom on mobile */
    .customer-address-index .column.main>.block-collapsible-nav {
        order: 10;
        max-width: 100%;
        margin-top: 20px;
    }

    /* Domyślne adresy full width */
    .customer-address-index .column.main>.block-addresses-default {
        width: 100%;
        margin-bottom: 20px;
    }

    /* Dodatkowe adresy full width, no offset */
    .customer-address-index .column.main>.block-addresses-list {
        flex: 0 0 100%;
        margin-left: 0;
        margin-bottom: 20px;
    }

    /* Actions toolbar full width, no offset */
    .customer-address-index .column.main>.actions-toolbar {
        flex: 0 0 100%;
        margin-left: 0;
        margin-bottom: 20px;
    }
}

/* ==========================================
   ACCOUNT EDIT PAGE - Modern Form Design
   ========================================== */

.customer-account-edit .column.main {
    display: flex !important;
    flex-wrap: wrap;
    gap: 30px;
    padding: 30px 20px;
    align-items: flex-start;
}

/* Navigation in first position */
.customer-account-edit .column.main>.block-collapsible-nav {
    flex: 0 0 280px;
    max-width: 280px;
    order: 1;
}

/* Form takes remaining space */
.customer-account-edit .column.main>.form-edit-account {
    flex: 1;
    min-width: 0;
    order: 2;
}

.customer-account-edit .form-edit-account {
    width: 100%;
    max-width: 600px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    padding: 0;
}

.customer-account-edit .form-edit-account .page-title-wrapper {
    padding: 20px 24px;
    border-bottom: 1px solid #f3f4f6;
    margin: 0;
    background: #f9fafb;
}

.customer-account-edit .form-edit-account .page-title {
    font-size: 18px;
    font-weight: 600;
    color: #1f2937;
    margin: 0;
    padding: 0;
    border: none;
}

.customer-account-edit .form-edit-account .fieldset {
    padding: 24px;
    border: none;
    margin: 0;
}

.customer-account-edit .form-edit-account .fieldset .legend {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #f3f4f6;
    width: 100%;
}

.customer-account-edit .form-edit-account .field {
    margin-bottom: 20px;
}

.customer-account-edit .form-edit-account .field .label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #374151;
    margin-bottom: 8px;
}

.customer-account-edit .form-edit-account .field .label .required {
    color: #dc2626;
}

.customer-account-edit .form-edit-account .field .control input[type="text"],
.customer-account-edit .form-edit-account .field .control input[type="email"],
.customer-account-edit .form-edit-account .field .control input[type="password"] {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 14px;
    color: #1f2937;
    background: #fff;
    transition: all 0.2s;
    box-sizing: border-box;
}

.customer-account-edit .form-edit-account .field .control input:focus {
    border-color: #2563eb;
    outline: none;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

/* Checkbox Fields */
.customer-account-edit .form-edit-account .field.choice {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.customer-account-edit .form-edit-account .field.choice input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.customer-account-edit .form-edit-account .field.choice label {
    font-size: 14px;
    color: #374151;
    cursor: pointer;
    margin: 0;
}

/* Submit Button */
.customer-account-edit .form-edit-account .actions-toolbar {
    padding: 20px 24px;
    background: #f9fafb;
    border-top: 1px solid #f3f4f6;
    margin: 0;
}

.customer-account-edit .form-edit-account .actions-toolbar .primary button {
    display: inline-block;
    padding: 12px 24px;
    background: #2563eb;
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    transition: all 0.2s;
    border: none;
    cursor: pointer;
}

.customer-account-edit .form-edit-account .actions-toolbar .primary button:hover {
    background: #1d4ed8;
}

/* ==========================================
   ADDRESS EDIT PAGE - Modern Form Design
   ========================================== */

.customer-address-form .column.main {
    display: flex !important;
    flex-wrap: wrap;
    gap: 30px;
    padding: 30px 20px;
    align-items: flex-start;
}

/* Navigation - LEFT side */
.customer-address-form .column.main>.block-collapsible-nav {
    flex: 0 0 280px;
    max-width: 280px;
    order: 1;
}

/* Form takes remaining space */
.customer-address-form .column.main>.form-address-edit {
    flex: 1;
    min-width: 0;
    order: 2;
}

/* Form card styling */
.customer-address-form .form-address-edit {
    width: 100%;
    max-width: 100%;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    padding: 0;
}

/* Fieldsets - stack vertically, not side by side */
.customer-address-form .form-address-edit .fieldset {
    padding: 24px;
    border: none;
    margin: 0;
    width: 100% !important;
    float: none !important;
    display: block !important;
    box-sizing: border-box;
}

/* Add border between fieldsets */
.customer-address-form .form-address-edit .fieldset+.fieldset {
    border-top: 1px solid #f3f4f6;
}

/* Fieldset legend/header */
.customer-address-form .form-address-edit .fieldset .legend {
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 2px solid #2563eb;
    width: 100%;
    display: block;
}

/* Form fields */
.customer-address-form .form-address-edit .field {
    margin-bottom: 20px;
}

.customer-address-form .form-address-edit .field .label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #374151;
    margin-bottom: 8px;
}

.customer-address-form .form-address-edit .field .label .required {
    color: #dc2626;
}

.customer-address-form .form-address-edit .field .control input,
.customer-address-form .form-address-edit .field .control select {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 14px;
    color: #1f2937;
    background: #fff;
    transition: all 0.2s;
    box-sizing: border-box;
}

.customer-address-form .form-address-edit .field .control input:focus,
.customer-address-form .form-address-edit .field .control select:focus {
    border-color: #2563eb;
    outline: none;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

/* Checkbox Fields */
.customer-address-form .form-address-edit .field.choice {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.customer-address-form .form-address-edit .field.choice input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    flex-shrink: 0;
}

.customer-address-form .form-address-edit .field.choice label {
    font-size: 14px;
    color: #374151;
    cursor: pointer;
    margin: 0;
}

/* Submit Button */
.customer-address-form .form-address-edit .actions-toolbar {
    padding: 20px 24px;
    background: #f9fafb;
    border-top: 1px solid #f3f4f6;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 16px;
}

.customer-address-form .form-address-edit .actions-toolbar .primary button,
.customer-address-form .form-address-edit .actions-toolbar .primary a.action {
    display: inline-block;
    padding: 12px 24px;
    background: #2563eb;
    color: #fff !important;
    text-decoration: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    transition: all 0.2s;
    border: none;
    cursor: pointer;
}

.customer-address-form .form-address-edit .actions-toolbar .primary button:hover,
.customer-address-form .form-address-edit .actions-toolbar .primary a.action:hover {
    background: #1d4ed8;
}

.customer-address-form .form-address-edit .actions-toolbar .secondary a {
    color: #6b7280;
    text-decoration: none;
    font-size: 14px;
}

.customer-address-form .form-address-edit .actions-toolbar .secondary a:hover {
    color: #374151;
    text-decoration: underline;
}

/* ==========================================
   ADDRESS EDIT PAGE - Mobile Responsive
   ========================================== */

@media screen and (max-width: 768px) {
    .customer-address-form .column.main {
        display: block !important;
        padding: 15px;
    }

    /* Navigation at bottom on mobile */
    .customer-address-form .column.main>.block-collapsible-nav {
        order: 10;
        max-width: 100%;
        margin-top: 20px;
    }

    /* Form full width */
    .customer-address-form .column.main>.form-address-edit {
        width: 100%;
    }

    .customer-address-form .form-address-edit .fieldset {
        padding: 16px;
    }

    .customer-address-form .form-address-edit .actions-toolbar {
        flex-direction: column;
        gap: 12px;
    }

    .customer-address-form .form-address-edit .actions-toolbar .primary button,
    .customer-address-form .form-address-edit .actions-toolbar .primary a.action {
        width: 100%;
        text-align: center;
    }
}

/* ==========================================
   PAGE TITLE STYLING - Consistent across all account pages
   ========================================== */

.account .page-title-wrapper {
    padding: 0 0 20px 0;
    margin-bottom: 0;
}

.account .page-title {
    font-size: 24px;
    font-weight: 600;
    color: #1f2937;
    margin: 0;
    padding: 0;
    border: none;
}

/* Hide page title that appears above content when sidebar has it */
.sales-order-history .column.main>.page-title-wrapper,
.customer-address-index .column.main>.page-title-wrapper {
    grid-column: 1 / -1;
    padding-left: 0;
}

/* ==========================================
   SALES ORDER VIEW PAGE - Modern Design
   ========================================== */

.sales-order-view .column.main {
    display: grid !important;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 30px;
    padding: 30px 20px;
    align-items: start;
    grid-auto-flow: row dense;
}

/* Navigation - LEFT side */
.sales-order-view .column.main>.block-collapsible-nav {
    grid-column: 1;
    grid-row: 1;
    max-width: 280px;
    width: 100%;
    align-self: start;
}

/* Page title - spans content area */
.sales-order-view .column.main>.page-title-wrapper {
    grid-column: 2;
    margin-left: 0;
    width: 100%;
}

/* Order Items Table - full content width */
.sales-order-view .column.main>.order-details-items {
    grid-column: 2;
    margin-left: 0;
    width: auto!important;
}

/* Order Info Block - own row, full content width */
.sales-order-view .column.main>.block-order-details-view {
    grid-column: 2;
    margin-left: 0;
    width: 100%;
}

/* Actions toolbar - own row */
.sales-order-view .column.main>.actions-toolbar {
    grid-column: 2;
    margin-left: 0;
    width: 100%;
}

.sales-order-view .column.main> :not(.block-collapsible-nav) {
    grid-column: 2;
    margin-left: 0;
    width: 100%;
    min-width: 0;
}

/* Order page title */
.sales-order-view .page-title-wrapper {
    margin-bottom: 20px;
}

.sales-order-view .page-title {
    font-size: 24px;
    font-weight: 600;
    color: #1f2937;
}

/* Order Items Table Card */
.sales-order-view .order-details-items {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    margin-bottom: 20px;
}

.sales-order-view .order-details-items .order-title {
    padding: 16px 20px;
    background: #f9fafb;
    border-bottom: 1px solid #f3f4f6;
    margin: 0;
}

.sales-order-view .order-details-items .order-title strong {
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
}

/* Product Table */
.sales-order-view .table-order-items {
    width: 100%;
    border-collapse: collapse;
}

.sales-order-view .table-order-items thead th {
    background: #f9fafb;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
    font-weight: 600;
    padding: 14px 16px;
    text-align: left;
    border-bottom: 1px solid #f3f4f6;
}

.sales-order-view .table-order-items tbody td {
    padding: 16px;
    color: #374151;
    font-size: 14px;
    border-bottom: 1px solid #f3f4f6;
    vertical-align: top;
}

.sales-order-view .table-order-items tbody tr:last-child td {
    border-bottom: none;
}

.sales-order-view .table-order-items .product-item-name {
    font-weight: 500;
    color: #1f2937;
}

.sales-order-view .table-order-items .item-options {
    margin-top: 8px;
    font-size: 13px;
    color: #6b7280;
}

/* Order Totals */
.sales-order-view .table-order-items tfoot {
    background: #f9fafb;
}

.sales-order-view .table-order-items tfoot th,
.sales-order-view .table-order-items tfoot td {
    padding: 10px 16px;
    font-size: 14px;
    border-top: 1px solid #f3f4f6;
}

.sales-order-view .table-order-items tfoot tr.grand_total th,
.sales-order-view .table-order-items tfoot tr.grand_total td {
    font-weight: 600;
    font-size: 16px;
    color: #1f2937;
}

/* Order Information Block */
.sales-order-view .block-order-details-view {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    margin-bottom: 20px;
}

.sales-order-view .block-order-details-view .block-title {
    padding: 16px 20px;
    background: #f9fafb;
    border-bottom: 1px solid #f3f4f6;
    margin: 0;
}

.sales-order-view .block-order-details-view .block-title strong {
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
}

.sales-order-view .block-order-details-view .block-content {
    padding: 20px;
    display: display;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    align-items: start;
    justify-items: stretch;
}

/* Order Info Boxes */
.sales-order-view .box {
    background: #f9fafb;
    border-radius: 8px;
    padding: 16px;
    margin: 0;
    float: none !important;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.sales-order-view .block-order-details-view .box {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
    align-self: stretch;
}

.sales-order-view .box-title {
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 12px;
    display: block;
}

.sales-order-view .box-content {
    font-size: 14px;
    color: #374151;
    line-height: 1.6;
    word-break: break-word;
}

.sales-order-view .box-content address {
    font-style: normal;
}

/* Order Actions */
.sales-order-view .actions-toolbar {
    margin-bottom: 20px;
}

.sales-order-view .actions-toolbar .action {
    display: inline-block;
    padding: 10px 20px;
    background: #2563eb;
    color: #fff !important;
    text-decoration: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s;
    margin-right: 10px;
    margin-bottom: 10px;
}

.sales-order-view .actions-toolbar .action:hover {
    background: #1d4ed8;
}

.sales-order-view .actions-toolbar .action.back {
    background: transparent;
    color: #6b7280 !important;
    border: 1px solid #d1d5db;
}

.sales-order-view .actions-toolbar .action.back:hover {
    background: #f3f4f6;
    color: #374151 !important;
}

/* ==========================================
   MOBILE RESPONSIVE - All Account Pages
   ========================================== */

@media screen and (max-width: 768px) {

    /* ========================================
       MOBILE NAVIGATION - Visible at TOP
       ======================================== */

    /* Parent container must be flex column for order to work */
    .account .column.main {
        display: flex !important;
        flex-direction: column !important;
        padding: 15px !important;
    }

    /* Navigation appears at TOP on mobile, in normal document flow */
    .account .column.main>.block-collapsible-nav {
        position: relative !important;
        /* Keep in document flow */
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 auto !important;
        margin: 0 0 20px 0 !important;
        order: -1 !important;
        /* Push to top */
        z-index: 1;
        /* Above content but not fixed */
    }

    /* All content blocks take full width in column layout */
    .account .column.main>* {
        flex: 0 0 auto;
        width: 100% !important;
        position: relative !important;
    }

    /* Navigation content styling on mobile */
    .account .block-collapsible-nav .content {
        display: block !important;
        padding: 12px;
        background: #fff;
        border-radius: 12px;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    }

    /* Mobile navigation items - horizontal scroll or compact */
    .account .block-collapsible-nav .nav.items {
        display: block;
    }

    .account .block-collapsible-nav .nav.item {
        width: 100%;
    }

    .account .block-collapsible-nav .nav.item a,
    .account .block-collapsible-nav .nav.item>strong {
        padding: 10px 14px !important;
        font-size: 13px;
        border-radius: 8px;
        justify-content: flex-start;
        text-align: left;
    }

    .account .block-collapsible-nav .nav.item.current>strong {
        background: #2563eb !important;
        color: #fff !important;
    }

    .account .block-collapsible-nav .nav.item.current>strong::before {
        filter: brightness(0) invert(1) !important;
    }

    /* Collapsible navigation title on mobile */
    .account .block-collapsible-nav .title {
        display: block !important;
        padding: 14px 16px;
        background: #1f2937;
        color: #fff;
        font-size: 14px;
        font-weight: 600;
        border-radius: 12px 12px 0 0;
        cursor: pointer;
        text-align: center;
    }

    .account .block-collapsible-nav .title::after {
        content: " ▼";
        font-size: 10px;
    }

    .account .block-collapsible-nav.active .title {
        border-radius: 12px 12px 0 0;
    }

    /* ========================================
       ORDER HISTORY - Mobile
       ======================================== */

    .sales-order-history .column.main {
        display: block !important;
        padding: 15px;
    }

    .sales-order-history .orders-history {
        margin-bottom: 20px;
    }

    /* Toolbar no offset */
    .sales-order-history .column.main>.order-products-toolbar,
    .sales-order-history .column.main>.toolbar {
        margin-left: 0 !important;
        margin-bottom: 20px;
    }

    .sales-order-history .orders-history table,
    .sales-order-history .orders-history thead,
    .sales-order-history .orders-history tbody,
    .sales-order-history .orders-history th,
    .sales-order-history .orders-history td,
    .sales-order-history .orders-history tr {
        display: block;
    }

    .sales-order-history .orders-history thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .sales-order-history .orders-history tbody tr {
        border: 1px solid #e5e7eb;
        margin-bottom: 15px;
        border-radius: 8px;
        overflow: hidden;
        background: #fff;
    }

    .sales-order-history .orders-history td {
        border: none;
        border-bottom: 1px solid #f3f4f6;
        position: relative;
        padding: 12px 16px 12px 45% !important;
        text-align: right;
    }

    .sales-order-history .orders-history td:before {
        content: attr(data-th);
        position: absolute;
        left: 16px;
        width: 40%;
        padding-right: 10px;
        font-weight: 600;
        color: #6b7280;
        text-align: left;
        font-size: 12px;
        text-transform: uppercase;
    }

    .sales-order-history .orders-history td:last-child {
        border-bottom: none;
    }

    .sales-order-history .orders-history td.col.actions {
        text-align: center;
        padding-left: 16px !important;
    }

    .sales-order-history .orders-history td.col.actions:before {
        display: none;
    }

    .sales-order-history .orders-history .toolbar {
        flex-direction: column;
        gap: 10px;
        text-align: center;
    }

    /* ========================================
       ADDRESS BOOK - Mobile
       ======================================== */

    .customer-address-index .column.main {
        display: block !important;
        padding: 15px;
    }

    /* Remove offset on mobile */
    .customer-address-index .column.main>.block-addresses-list,
    .customer-address-index .column.main>.actions-toolbar {
        margin-left: 0 !important;
        margin-bottom: 20px;
    }

    .customer-address-index .block-addresses-default,
    .customer-address-index .block-addresses-list {
        margin-bottom: 20px;
    }

    .customer-address-index .block-addresses-default .block-content {
        display: block;
    }

    .customer-address-index .box.box-address-billing,
    .customer-address-index .box.box-address-shipping {
        margin-bottom: 15px;
    }

    /* ========================================
       ACCOUNT EDIT - Mobile
       ======================================== */

    .customer-account-edit .column.main {
        display: block !important;
        padding: 15px;
    }

    .customer-account-edit .form-edit-account {
        max-width: 100%;
        margin-top: 0 !important;
    }

    /* ========================================
       ADDRESS FORM - Mobile
       ======================================== */

    .customer-address-form .column.main {
        display: block !important;
        padding: 15px;
    }

    .customer-address-form .form-address-edit {
        max-width: 100%;
        margin-top: 0 !important;
    }

    .customer-address-form .form-address-edit .fieldset {
        padding: 16px;
    }

    /* Form legend left-aligned on mobile */
    .customer-address-form .form-address-edit .fieldset .legend {
        text-align: left;
    }

    /* ========================================
       ORDER VIEW - Mobile
       ======================================== */

    .sales-order-view .column.main {
        display: grid !important;
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 15px !important;
    }

    .sales-order-view .column.main>.block-collapsible-nav {
        grid-column: 1;
    }

    .sales-order-view .column.main> :not(.block-collapsible-nav) {
        grid-column: 1;
    }

    /* Remove margin offsets on mobile */
    .sales-order-view .column.main>.page-title-wrapper,
    .sales-order-view .column.main>.order-details-items,
    .sales-order-view .column.main>.block-order-details-view,
    .sales-order-view .column.main>.actions-toolbar {
        margin-left: 0 !important;
        grid-column: 1;
        width: 100% !important;
    }

    .sales-order-view .block-order-details-view .block-content {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .sales-order-view .table-order-items,
    .sales-order-view .table-order-items thead,
    .sales-order-view .table-order-items tbody,
    .sales-order-view .table-order-items tfoot,
    .sales-order-view .table-order-items th,
    .sales-order-view .table-order-items td,
    .sales-order-view .table-order-items tr {
        display: block;
    }

    .sales-order-view .table-order-items thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .sales-order-view .table-order-items tbody tr {
        border-bottom: 1px solid #e5e7eb;
        padding: 16px;
        margin-bottom: 0;
    }

    .sales-order-view .table-order-items tbody td {
        border: none;
        padding: 8px 0 !important;
        padding-left: 0 !important;
        text-align: left !important;
        position: relative;
    }

    .sales-order-view .table-order-items tbody td:before {
        content: attr(data-th) ": ";
        font-weight: 600;
        color: #6b7280;
        display: block;
        font-size: 12px;
        text-transform: uppercase;
        margin-bottom: 4px;
        position: static !important;
        left: auto !important;
        width: auto !important;
        padding-right: 0 !important;
        white-space: normal !important;
    }

    .sales-order-view .table-order-items tfoot tr {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 12px;
        align-items: center;
        padding: 10px 16px;
        border-top: 1px solid #f3f4f6;
    }

    .sales-order-view .table-order-items tfoot th,
    .sales-order-view .table-order-items tfoot td {
        padding: 0 !important;
        display: block;
    }

    .sales-order-view .table-order-items tfoot th {
        text-align: left !important;
    }

    .sales-order-view .table-order-items tfoot td {
        text-align: right !important;
        padding-left: 0 !important;
    }

    .sales-order-view .table-order-items tfoot td:before {
        content: none !important;
        display: none !important;
    }

    /* ========================================
       GLOBAL LEFT ALIGNMENT - Mobile
       ======================================== */

    .account .column.main {
        text-align: left;
    }

    .account .column.main .actions-toolbar,
    .account .column.main table td.col.actions {
        text-align: left !important;
    }

    /* Keep buttons centered */
    .account .column.main .actions-toolbar .action,
    .account .column.main button,
    .account .column.main .btn {
        text-align: center !important;
    }
}
