.my-account { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; padding-bottom: 32px; padding-top: 32px }
.my-account__heading { align-items: center; background-color: #f7f8fa; display: flex; flex-direction: column; padding: 32px 0; }
.my-account__category,
.my-account__title { margin-bottom: unset; text-transform: uppercase } 
.my-account a:not(.btn) { color: #28465c } 
.my-account__navigation { border-right: 1px solid #e2e8ee } 
.my-account__navigation .is-active a { color: #28465c; font-weight: 600 } 
.my-account__navigation .is-active:after { height: 100% } 
.my-account__navigation li { padding: 12px 0; position: relative } 
.my-account__navigation li .is-active:after, .my-account__navigation li:after { background-color: #28465c; bottom: 0; content: ""; height: 0; position: absolute; right: 0; transition: .2s; width: 4px } 
.my-account__navigation li:hover:after { height: 100% } 
.my-account__navigation li:not(:last-child) { border-bottom: 1px solid #e2e8ee } 
.my-account__navigation li a { color: #424242; display: block; font-size: .875rem; text-transform: uppercase }
.my-account__navigation--user { font-weight: 600 }
.my-account__dashboard--grid { display: grid; gap: 12px; grid-template-columns: 1fr }
.my-account__dashboard--grid a { border: 1px solid #e2e8ee; border-radius: 5px; font-size: 1.125rem; padding: 20px 0; text-align: center; }
.woocommerce-account .woocommerce .woocommerce-LostPassword a { color: #424242; }
.woocommerce-account .woocommerce:after { margin-bottom: 32px; }

.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce-account .woocommerce-MyAccount-navigation { float: none; width: 100%; }

.woocommerce table.shop_table { font-size: 15px; border: none; border-radius: 0; }
.woocommerce table.shop_table td .description { margin-left: 3px; }


@media (min-width:576px) {
    .my-account__dashboard--grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 768px) {
    .my-account { grid-template-columns: 1fr 2fr; }
}

@media (min-width:992px) {
    .my-account__dashboard--grid { grid-template-columns: repeat(3, 1fr); }
}

.section--login { 
    .container > .woocommerce {
        &::before, &::after { display: none; }
    }
    form.login { border: 1px solid var(--clr-border); padding: 20px; border-radius: 6px; margin: 0;
        h2 { margin-bottom: 24px; }   
        .form-row { padding: 0; margin: 0;
            label { font-size: 13px; line-height: 1; color: var(--clr-dark);
                .required { font: inherit; color: var(--clr-dark); }   
            }

            [type="text"], [type="password"] { font-family: var(--font-primary); font-size: 16px; font-weight: 400; }

            &::before, &::after { display: none; }
            &.form-row-wide + .form-row-wide { margin-top: 23px; }
            &.form-row-submit { display: flex; align-items: center; column-gap: 26px;
                .btn { margin: 0; }
                .btn.btn--link-copper { text-transform: uppercase; text-decoration: underline; font-style: italic; }
            }
        }
        p.lost_password { font-size: 10px; color: var(--clr-dark); margin-top: 13px; margin-bottom: 36px; }
    }
}

.section--lostpassword { 
    .container > .woocommerce {
        &::before, &::after { display: none; }
    }
    form { border: 1px solid var(--clr-border); padding: 20px; border-radius: 6px; 
        .lost-pass-explanation { font-size: 14px; line-height: 1.8; }
        .form-row { padding: 0; margin: 0; width: 100%;
            label { font-size: 13px; line-height: 1; color: var(--clr-dark);
                .required { font: inherit; color: var(--clr-dark); }   
            }

            &::before, &::after { display: none; }
            &.form-row-submit { display: flex; align-items: center; padding-top: 24px;
                .btn { margin: 0; }
            }

            &.form-row-first + .form-row-last { margin-top: 23px; }
        }

        .woocommerce-password-strength { border-radius: 6px; margin-top: 6px; line-height: 1; font-size: 13px; padding: 6px 10px; } 
    
        .woocommerce-password-hint { font-size: 12px; line-height: 1.4; }
    }
}

.section--account { padding-bottom: 0;
    h2 { font-size: clamp(20px, 4vw, 28px); }

    .form-row label { font-size: 12px;  
        .required { font: inherit; color: var(--clr-dark); }
    }

    table { 
        .btn-group { gap: 5px; }  
    }

    .woocommerce-order-details { margin-bottom: 64px;
        table {
            tbody, tfoot, tr, th, td { display: block; margin: 0; padding: 0; border: none!important; }
            
            tbody { 
                tr { display: flex; align-items: center; justify-content: space-between; gap: 20px;
                    td.product-name { flex-grow: 1;
                        .order-product { display: flex; align-items: center; gap: 20px;
                            .order-product__image { width: 85px; }
                            .order-product__text { 
                                a { font-size: 16px; font-weight: 700; }
                                .wc-item-meta { padding: 0; margin: 0; font-size: 14px; line-height: 1.4;
                                    * { font: inherit; 
                                        strong { font-weight: 700; }  
                                    }
                                }
                            }
                        }
                        .product-total * { font-size: 16px; font-weight: 700; }
                    } 

                    + tr { border-top: 1px solid var(--clr-light)!important; margin-top: 20px; padding-top: 20px; }
                }
            }

            tfoot { max-width: 347px; margin-left: auto; margin-top: 32px;
                tr { display: flex; align-items: center; justify-content: space-between; gap: 20px; 
                    + tr { margin-top: 10px; }
                    th + td { font-weight: 400; }
                    &.order_total { border-top: 1px solid var(--clr-light)!important; margin-top: 20px; padding-top: 20px;
                        small { display: none!important; }  
                    }
                }
            }
        }
    }

    .woocommerce-customer-details { margin: 0; 
        address { border: 1px solid var(--clr-light); padding: 13px 31px; box-shadow: none; font-size: 15px;
            strong { display: block; width: 100%; font-size: 16px; }

            p { margin: .5em 0 0 0; line-height: 1.4; }
        }
    }

    .woocommerce-Addresses { 
        address { position: relative; padding: 14px 20px; border: 1px solid var(--clr-light); border-radius: 3px; font-style: normal; font-size: 15px;
            a { cursor: pointer; font-size: 10px; text-decoration: underline; position: absolute; right: 20px; bottom: 14px; padding: 14px 0 0 0;  }
            
            &.address--billing { background: url('/wp-content/themes/socialbrothers/assets/icons/lock.svg') no-repeat calc(100% - 13px) 13px/11px var(--clr-light); }
        }
    }

    .select2-container .select2-selection { border: none; border-radius: 0; border-bottom: 1px solid var(--clr-light) !important; }
}

@media (min-width: 768px) {
    .section--login {
        .container { max-width: 540px; }
        form.login { padding: 40px; }
    }

    .section--lostpassword {
        .container { max-width: 540px; }
        form { padding: 40px; }
    }
}