

.my-account-page .commerce-heading
{
    margin-bottom: 38px;
}

.nanika-account-shell
{
    display: grid;
    grid-template-columns: 285px minmax(0,1fr);
    gap: 70px;
    align-items: start;
}

.nanika-account-sidebar
{
    position: sticky;
    top: 110px;
}

.nanika-account-sidebar__intro
{
    padding: 0 0 25px;
    border-bottom: 1px solid var(--color-line);
}

.nanika-account-sidebar__intro h2
{
    margin: 8px 0 10px;
    font-size: 30px;
}

.nanika-account-sidebar__intro p
{
    color: var(--color-text2);
    font-size: 12px;
    line-height: 1.7;
}

.woocommerce-MyAccount-navigation ul
{
    list-style: none;
    margin: 0;
    padding: 12px 0 0;
}

.woocommerce-MyAccount-navigation li a
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 50px;
    border-bottom: 1px solid var(--color-line);
    font-size: 11px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.woocommerce-MyAccount-navigation li a svg
{
    width: 16px;
    height: 16px;
    opacity: .45;
    transition: transform .25s ease, opacity .25s ease;
}

.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation li a:hover
{
    color: var(--color-acc);
}

.woocommerce-MyAccount-navigation li a:hover svg
{
    transform: translateX(3px);
    opacity: 1;
}

.nanika-account-heading
{
    padding-bottom: 28px;
    border-bottom: 1px solid var(--color-line);
    margin-bottom: 28px;
}

.nanika-account-heading h1
{
    margin: 7px 0 10px;
    font-size: clamp(44px,5vw,68px);
    text-transform: uppercase;
}

.nanika-account-heading p,
.nanika-account-content > p
{
    color: var(--color-text2);
    font-size: 13px;
    line-height: 1.75;
}

.nanika-account-cards
{
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 14px;
}

.nanika-account-card
{
    min-height: 210px;
    display: flex;
    flex-direction: column;
    padding: 24px;
    border: 1px solid var(--color-line);
    background: rgba(255,255,255,.25);
    transition: transform .3s ease, background-color .3s ease;
}

.nanika-account-card:hover
{
    transform: translateY(-3px);
    background: var(--color-surface);
}

.nanika-account-card > span
{
    color: var(--color-acc);
    font-size: 10px;
    letter-spacing: .12em;
}

.nanika-account-card h2
{
    margin: auto 0 8px;
    font-size: 28px;
}

.nanika-account-card p
{
    color: var(--color-text2);
    font-size: 12px;
    line-height: 1.6;
}

.nanika-account-content table
{
    width: 100%;
    border-collapse: collapse;
}

.nanika-account-content th,
.nanika-account-content td
{
    padding: 15px 12px;
    border-bottom: 1px solid var(--color-line);
    text-align: left;
    font-size: 12px;
}

.nanika-account-content th:first-child,
.nanika-account-content td:first-child
{
    padding-left: 0;
}

.nanika-account-content fieldset
{
    margin: 30px 0 0;
    padding: 24px;
    border: 1px solid var(--color-line);
}

.nanika-account-content legend
{
    padding: 0 8px;
    font-family: var(--serif);
    font-size: 22px;
}

.nanika-account-content .form-row
{
    margin-bottom: 15px;
}

.nanika-account-content input,
.nanika-account-content select,
.nanika-account-content textarea
{
    width: 100%;
    min-height: 46px;
    padding: 12px 13px;
    border: 1px solid var(--color-line);
    background: rgba(255,255,255,.3);
}

.woocommerce-Addresses
{
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 16px;
}

.woocommerce-Address
{
    padding: 25px;
    border: 1px solid var(--color-line);
}

.woocommerce-Address-title
{
    margin-bottom: 18px;
}

.woocommerce-Address address
{
    color: var(--color-text2);
    font-size: 13px;
    line-height: 1.8;
}

@media(max-width: 900px)
{
    .nanika-account-shell
    {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .nanika-account-sidebar
    {
        position: static;
    }

    .woocommerce-MyAccount-navigation ul
    {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        gap: 0 18px;
    }

    .nanika-account-cards
    {
        grid-template-columns: 1fr;
    }
}

@media(max-width: 580px)
{

    .woocommerce-MyAccount-navigation ul,
    .woocommerce-Addresses
    {
        grid-template-columns: 1fr;
    }
}

.nanika-auth-grid
{
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 18px;
}

.nanika-auth-grid--single
{
    grid-template-columns: minmax(0,620px);
}

.nanika-auth-card
{
    padding: clamp(28px,4vw,48px);
    border: 1px solid var(--color-line);
    background: rgba(255,255,255,.3);
}

.nanika-auth-card--register
{
    background: var(--color-bg2);
}

.nanika-auth-card h2
{
    margin: 8px 0 12px;
    font-size: clamp(36px,4vw,52px);
    text-transform: uppercase;
}

.nanika-auth-card__intro
{
    max-width: 430px;
    margin-bottom: 28px;
    color: var(--color-text2);
    font-size: 12px;
    line-height: 1.7;
}

.nanika-auth-card .form-row
{
    margin-bottom: 16px;
}

.nanika-auth-card label
{
    display: block;
    margin-bottom: 7px;
    font-size: 10px;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.nanika-auth-card input[type="text"],
.nanika-auth-card input[type="email"],
.nanika-auth-card input[type="password"]
{
    width: 100%;
    min-height: 48px;
    padding: 12px 14px;
    border: 1px solid var(--color-line);
    background: rgba(255,255,255,.6);
}

.nanika-auth-card__meta
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 5px 0 22px;
    color: var(--color-text2);
    font-size: 11px;
}

.nanika-auth-card__meta label
{
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    text-transform: none;
    letter-spacing: 0;
}

.nanika-auth-card__meta input[type="checkbox"]
{
    width: 14px;
    height: 14px;
    margin: 0;
}

.nanika-auth-card__generated
{
    margin: -5px 0 22px;
    color: var(--color-text2);
    font-size: 11px;
}

@media(max-width: 760px)
{
    .nanika-auth-grid
    {
        grid-template-columns: 1fr;
    }
}

.nanika-account-page h1,
.woocommerce-account .entry-title
{
    font-size: var(--nanika-page-title-size);
    line-height: 1.02;
}
.nanika-account-heading h1
{
    font-size: var(--nanika-page-title-size);
    line-height: 1.02;
}
