.vn-account-page {
    background: #f4f0eb;
    color: #1a1818;
}

.vn-account-page a {
    color: inherit;
}

.vn-account-hero {
    background: #171717;
    color: #fff;
    overflow: hidden;
    padding: 112px 24px 106px;
    position: relative;
    text-align: center;
}

.vn-account-hero::before,
.vn-account-hero::after {
    border: 1px solid rgba(199, 162, 111, .16);
    border-radius: 50%;
    content: "";
    height: 360px;
    position: absolute;
    top: 48%;
    transform: translateY(-50%);
    width: 360px;
}

.vn-account-hero::before { left: -210px; }
.vn-account-hero::after { right: -210px; }

.vn-account-hero__glow {
    background: radial-gradient(circle, rgba(87, 12, 29, .35), transparent 68%);
    height: 480px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 760px;
}

.vn-account-hero__inner {
    max-width: 760px;
    position: relative;
    z-index: 1;
}

.vn-account-eyebrow,
.vn-account-kicker {
    color: #c9a56f;
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .26em;
    margin: 0 0 18px;
    text-transform: uppercase;
}

.vn-account-hero h1 {
    color: #fff;
    font-family: var(--font-heading);
    font-size: clamp(3rem, 5vw, 5rem);
    font-weight: 400;
    line-height: 1;
    margin: 0 0 24px;
}

.vn-account-intro {
    color: #bdb7b2;
    font-size: .98rem;
    line-height: 1.8;
    margin: 0 auto;
    max-width: 560px;
}

.vn-account-shell {
    padding: 88px 24px 110px;
}

.vn-account-container {
    max-width: 1180px;
}

.vn-account-content > .woocommerce {
    align-items: stretch;
    display: grid;
    gap: 28px;
    grid-template-columns: 270px minmax(0, 1fr);
}

/* WooCommerce adds clearfix pseudo-elements for its legacy floated layout.
 * They become real grid items unless explicitly removed. */
.vn-account-content > .woocommerce::before,
.vn-account-content > .woocommerce::after {
    content: none;
    display: none;
}

.vn-account-content > .woocommerce > .woocommerce-notices-wrapper,
.vn-account-content > .woocommerce > .woocommerce-form-login,
.vn-account-content > .woocommerce > .woocommerce-form-register,
.vn-account-content > .woocommerce > h2,
.vn-account-content > .woocommerce > .u-columns {
    grid-column: 1 / -1;
}

/* Signed-out customer access */
.vn-account-content > .woocommerce > #customer_login {
    display: grid;
    gap: 28px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
    width: 100%;
}

.vn-account-content #customer_login::before,
.vn-account-content #customer_login::after {
    content: none;
    display: none;
}

.woocommerce-account .vn-account-content #customer_login .u-column1,
.woocommerce-account .vn-account-content #customer_login .u-column2 {
    background: #fff;
    border: 1px solid #ded7d0;
    box-shadow: 0 22px 60px rgba(42, 25, 24, .06);
    box-sizing: border-box;
    float: none;
    min-width: 0;
    padding: clamp(32px, 4vw, 54px);
    width: auto;
}

.woocommerce-account .vn-account-content #customer_login .u-column2 {
    background: #e8d8c8;
    border-color: #d8c2ad;
    color: #332b28;
}

.vn-customer-card__eyebrow {
    color: #a67b42 !important;
    font-size: .65rem;
    font-weight: 600;
    letter-spacing: .2em;
    margin: 0 0 15px !important;
    text-transform: uppercase;
}

.vn-customer-card__intro {
    color: #716b67 !important;
    font-size: .86rem;
    line-height: 1.75 !important;
    margin: -18px 0 34px !important;
    max-width: 480px;
}

.vn-account-content #customer_login h2 {
    font-family: var(--font-heading);
    font-size: clamp(2.1rem, 3vw, 3rem);
    font-weight: 400;
    line-height: 1.1;
    margin: 0 0 34px;
}

.vn-account-content #customer_login .u-column2 h2 {
    color: #241d1a;
}

.vn-account-content #customer_login .u-column2 .vn-customer-card__eyebrow {
    color: #7d142b !important;
}

.vn-account-content #customer_login .u-column2 .vn-customer-card__intro,
.vn-account-content #customer_login .u-column2 .vn-registration-privacy {
    color: #514641 !important;
}

.vn-account-content #customer_login form.login,
.vn-account-content #customer_login form.register {
    border: 0;
    margin: 0;
    padding: 0;
}

.vn-account-content #customer_login .form-row {
    margin: 0 0 22px;
    padding: 0;
}

.vn-account-content #customer_login .u-column2 label {
    color: #302723;
}

.vn-account-content #customer_login .u-column2 input.input-text {
    background: #fff;
    border-color: #b9a18f;
    color: #211b18;
}

.vn-account-content #customer_login .u-column2 input.input-text:focus {
    border-color: #7d142b;
    box-shadow: 0 0 0 1px #7d142b;
    outline: 0;
}

.vn-account-content #customer_login .u-column2 .show-password-input {
    color: #4a3b34;
}

.vn-account-content #customer_login .woocommerce-form-login__rememberme {
    align-items: center;
    color: #4c4744;
    cursor: pointer;
    display: flex;
    font-size: .78rem;
    gap: 7px;
    letter-spacing: 0;
    margin: 0;
    text-transform: none;
}

.vn-account-content #customer_login .woocommerce-form-login__rememberme input {
    accent-color: #4a0e1b;
    flex: 0 0 16px;
    height: 15px;
    margin: 0;
    width: 16px;
}

.vn-login-options {
    border-bottom: 1px solid #e2dcd6;
    margin: -2px 0 22px;
    padding: 0 0 20px;
}

.vn-login-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 18px 22px;
}

.vn-account-content #customer_login .vn-forgot-password {
    border-bottom: 1px solid #7d142b;
    color: #7d142b;
    font-size: .76rem;
    padding-bottom: 3px;
    text-decoration: none;
}

.vn-registration-privacy {
    font-size: .78rem;
    line-height: 1.7 !important;
    margin: 4px 0 24px !important;
}

.vn-registration-privacy a {
    color: #6b0d22 !important;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.vn-register-action {
    margin-bottom: 0 !important;
}

.vn-code-control {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
}

.vn-account-content #customer_login .vn-code-control input.input-text {
    border-right: 0;
    letter-spacing: .24em;
}

.vn-send-code {
    background: #4a0e1b;
    border: 1px solid #4a0e1b;
    color: #fff;
    cursor: pointer;
    font-family: var(--font-body);
    font-size: .67rem;
    font-weight: 600;
    letter-spacing: .1em;
    min-width: 118px;
    padding: 0 17px;
    text-transform: uppercase;
}

.vn-send-code:hover:not(:disabled) {
    background: #211b18;
    border-color: #211b18;
}

.vn-send-code:disabled {
    cursor: wait;
    opacity: .65;
}

.vn-code-status {
    color: #594b44 !important;
    font-size: .72rem;
    margin: -12px 0 22px !important;
}

.vn-code-status.is-success { color: #2f6335 !important; }
.vn-code-status.is-error { color: #8c1720 !important; }

.vn-code-status.is-account-exists {
    background: #fff4f2;
    border-left: 3px solid #8c1720;
    margin-top: -10px !important;
    padding: 12px 14px;
}

.vn-existing-account-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 16px;
    margin-top: 10px;
}

.vn-existing-account-actions button,
.vn-existing-account-actions a {
    background: transparent;
    border: 0;
    border-bottom: 1px solid #7d142b;
    color: #7d142b;
    cursor: pointer;
    font-family: var(--font-body);
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .06em;
    padding: 0 0 3px;
    text-decoration: none;
    text-transform: uppercase;
}

@media (max-width: 480px) {
    .vn-code-control { grid-template-columns: 1fr; gap: 8px; }
    .vn-account-content #customer_login .vn-code-control input.input-text { border-right: 1px solid #b9a18f; }
    .vn-send-code { min-height: 46px; }
}

/* Password recovery */
.vn-account-content > .woocommerce > .vn-password-card,
.vn-account-content > .woocommerce > .woocommerce-notices-wrapper + .vn-password-card {
    grid-column: 1 / -1;
}

.vn-password-card {
    background: #fff;
    border: 1px solid #ddd5ce;
    box-shadow: 0 26px 80px rgba(43, 29, 25, .09);
    box-sizing: border-box;
    margin: 0 auto;
    max-width: 680px;
    padding: clamp(38px, 6vw, 72px);
    position: relative;
    width: 100%;
}

.vn-password-card::before {
    background: #4a0e1b;
    content: "";
    height: 4px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}

.vn-password-eyebrow {
    color: #a67b42 !important;
    font-size: .66rem;
    font-weight: 600;
    letter-spacing: .22em;
    margin: 0 0 16px !important;
    text-transform: uppercase;
}

.vn-password-card h2 {
    color: #211b18;
    font-family: var(--font-heading);
    font-size: clamp(2.35rem, 4vw, 3.8rem);
    font-weight: 400;
    line-height: 1.08;
    margin: 0 0 20px;
}

.vn-password-intro {
    color: #6c625d !important;
    font-size: .92rem;
    line-height: 1.8 !important;
    margin: 0 0 38px !important;
    max-width: 530px;
}

.vn-password-card .lost_reset_password {
    margin: 0;
}

.vn-password-card .form-row {
    float: none !important;
    margin: 0 0 25px !important;
    padding: 0 !important;
    width: 100% !important;
}

.vn-password-card label {
    color: #322b27;
    display: block;
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .1em;
    margin-bottom: 9px;
    text-transform: uppercase;
}

.vn-account-content .vn-password-card input.input-text {
    background: #fbfaf8;
    border: 1px solid #cfc3b9;
    border-radius: 0;
    box-sizing: border-box;
    min-height: 54px;
    padding: 14px 16px;
    width: 100%;
}

.vn-account-content .vn-password-card input.input-text:focus {
    border-color: #4a0e1b;
    box-shadow: 0 0 0 1px #4a0e1b;
    outline: 0;
}

.vn-password-actions {
    align-items: center;
    border-top: 1px solid #e3ddd7;
    display: flex;
    flex-wrap: wrap;
    gap: 18px 24px;
    margin-top: 30px;
    padding-top: 28px;
}

.vn-password-actions a {
    border-bottom: 1px solid #7d142b;
    color: #7d142b;
    font-size: .76rem;
    padding-bottom: 3px;
    text-decoration: none;
}

.vn-password-card--confirmation {
    text-align: center;
}

.vn-password-card--confirmation .vn-password-intro {
    margin-left: auto !important;
    margin-right: auto !important;
}

.vn-password-check {
    align-items: center;
    background: #4a0e1b;
    border-radius: 50%;
    color: #fff;
    display: flex;
    font-size: 1.25rem;
    height: 48px;
    justify-content: center;
    margin: 0 auto 26px;
    width: 48px;
}

.vn-password-note {
    background: #f5f0ea;
    color: #6c625d !important;
    font-size: .78rem;
    margin: 0 0 28px !important;
    padding: 15px 18px;
}

.vn-password-primary-link {
    background: #4a0e1b;
    color: #fff !important;
    display: inline-block;
    font-size: .7rem;
    letter-spacing: .12em;
    padding: 15px 23px;
    text-decoration: none;
    text-transform: uppercase;
}

@media (max-width: 600px) {
    .vn-password-card { padding: 38px 24px; }
    .vn-password-actions { align-items: flex-start; flex-direction: column; }
}

.vn-account-content #customer_login .u-column2 .button {
    background: #4a0e1b;
    border-color: #4a0e1b;
    color: #fff;
}

.vn-account-content #customer_login .u-column2 .button:hover {
    background: #211b18;
    border-color: #211b18;
    color: #fff;
}

.vn-account-content #customer_login .woocommerce-password-strength {
    border: 0;
    color: #241d1a;
    font-size: .76rem;
    font-weight: 600;
    margin-top: 0;
    padding: 9px 12px;
}

.vn-account-content #customer_login .woocommerce-password-strength.short,
.vn-account-content #customer_login .woocommerce-password-strength.bad {
    background: #f2b8b5;
    color: #65120f;
}

.vn-account-content #customer_login .woocommerce-password-strength.good {
    background: #f2d48d;
    color: #5b3b00;
}

.vn-account-content #customer_login .woocommerce-password-strength.strong {
    background: #b9ddbc;
    color: #17481c;
}

.vn-account-content #customer_login .woocommerce-password-hint {
    color: #594b44;
    display: block;
    font-size: .72rem;
    line-height: 1.6;
    margin-top: 8px;
}

.woocommerce-account .vn-account-content .woocommerce-MyAccount-navigation {
    background: #1b1a1a;
    box-sizing: border-box;
    float: none;
    min-height: 580px;
    padding: 34px 0;
    width: auto;
    grid-column: 1;
}

.woocommerce-MyAccount-navigation::before {
    color: #c9a56f;
    content: "ACCOUNT MENU";
    display: block;
    font-size: .64rem;
    font-weight: 600;
    letter-spacing: .22em;
    padding: 0 30px 25px;
}

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

.woocommerce-MyAccount-navigation li {
    border-top: 1px solid rgba(255, 255, 255, .08);
    margin: 0;
}

.woocommerce-MyAccount-navigation li:last-child {
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.woocommerce-MyAccount-navigation a {
    align-items: center;
    color: #aaa5a1;
    display: flex;
    font-size: .76rem;
    font-weight: 500;
    justify-content: space-between;
    letter-spacing: .12em;
    padding: 19px 30px;
    text-decoration: none;
    text-transform: uppercase;
    transition: .25s ease;
}

.woocommerce-MyAccount-navigation a::after {
    color: #6f6965;
    content: "→";
    font-size: .95rem;
}

.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation a:hover {
    background: #350812;
    color: #fff;
    padding-left: 36px;
}

.woocommerce-MyAccount-navigation li.is-active a::after,
.woocommerce-MyAccount-navigation a:hover::after {
    color: #c9a56f;
}

.woocommerce-account .vn-account-content .woocommerce-MyAccount-content {
    background: #fff;
    box-sizing: border-box;
    box-shadow: 0 24px 70px rgba(42, 25, 24, .07);
    float: none;
    min-width: 0;
    padding: clamp(34px, 5vw, 68px);
    width: auto;
    grid-column: 2;
}

.woocommerce-account .vn-account-content .woocommerce-MyAccount-content form,
.woocommerce-account .vn-account-content .woocommerce-MyAccount-content fieldset {
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
    width: 100%;
}

.woocommerce-account .vn-account-content .woocommerce-MyAccount-content .form-row-wide {
    clear: both;
    float: none;
    width: 100%;
}

.vn-account-welcome {
    border-bottom: 1px solid #ded8d2;
    margin-bottom: 18px;
    padding-bottom: 42px;
}

.vn-account-welcome__heading {
    align-items: center;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    margin-bottom: 16px;
}

.vn-account-welcome h2,
.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
    color: #1a1818;
    font-family: var(--font-heading);
    font-weight: 400;
}

.vn-account-welcome h2 {
    font-size: clamp(2.4rem, 4vw, 3.7rem);
    line-height: 1;
    margin: 0;
}

.vn-account-welcome > p:last-child {
    color: #716b67;
    line-height: 1.8;
    margin: 0;
}

.vn-account-signout {
    border-bottom: 1px solid #7d142b;
    color: #7d142b !important;
    font-size: .68rem;
    letter-spacing: .15em;
    padding-bottom: 5px;
    text-decoration: none;
    text-transform: uppercase;
}

.vn-account-actions {
    display: grid;
}

.vn-account-action {
    align-items: center;
    border-bottom: 1px solid #ded8d2;
    display: grid;
    gap: 22px;
    grid-template-columns: 34px minmax(0, 1fr) 32px;
    padding: 25px 8px;
    text-decoration: none !important;
    transition: .25s ease;
}

.vn-account-action:hover {
    background: #faf7f3;
    padding-left: 18px;
    padding-right: 18px;
}

.vn-account-action__number {
    color: #a78a65;
    font-family: var(--font-heading);
    font-size: .82rem;
}

.vn-account-action__copy strong,
.vn-account-action__copy small {
    display: block;
}

.vn-account-action__copy strong {
    font-family: var(--font-heading);
    font-size: 1.35rem;
    font-weight: 400;
    margin-bottom: 5px;
}

.vn-account-action__copy small {
    color: #817b76;
    font-size: .78rem;
}

.vn-account-action__arrow {
    color: #7d142b;
    font-size: 1.15rem;
    text-align: right;
}

.woocommerce-MyAccount-content p {
    color: #615c58;
    line-height: 1.75;
}

.woocommerce-MyAccount-content table.shop_table {
    border: 1px solid #ddd6d0;
    border-collapse: collapse;
    border-radius: 0;
}

.woocommerce-MyAccount-content table.shop_table th {
    background: #f5f1ec;
    color: #302c2a;
    font-size: .68rem;
    letter-spacing: .12em;
    padding: 17px;
    text-transform: uppercase;
}

.woocommerce-MyAccount-content table.shop_table td {
    border-color: #e5dfda;
    padding: 17px;
}

.woocommerce-MyAccount-content .button,
.vn-account-content .woocommerce button.button,
.vn-account-content .woocommerce input.button {
    background: #4a0e1b;
    border: 1px solid #4a0e1b;
    border-radius: 0;
    color: #fff;
    font-size: .7rem;
    font-weight: 500;
    letter-spacing: .12em;
    padding: 14px 20px;
    text-transform: uppercase;
    transition: .25s ease;
}

.woocommerce-MyAccount-content .button:hover,
.vn-account-content .woocommerce button.button:hover,
.vn-account-content .woocommerce input.button:hover {
    background: #1a1818;
    border-color: #1a1818;
    color: #fff;
}

.vn-account-content .woocommerce form .form-row input.input-text,
.vn-account-content .woocommerce form .form-row textarea,
.vn-account-content .woocommerce form .form-row select {
    background: #fff;
    border: 1px solid #cec6bf;
    border-radius: 0;
    box-sizing: border-box;
    min-height: 48px;
    padding: 12px 14px;
}

.vn-account-content .woocommerce form .form-row label {
    color: #393432;
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .08em;
    margin-bottom: 8px;
    text-transform: uppercase;
}

.vn-account-content .woocommerce-Address {
    border: 1px solid #ded8d2;
    box-sizing: border-box;
    padding: 28px;
}

.vn-account-content .woocommerce-message,
.vn-account-content .woocommerce-info,
.vn-account-content .woocommerce-error {
    background: #fff;
    border-top-color: #7d142b;
    box-shadow: none;
}

@media (max-width: 820px) {
    .vn-account-hero { padding: 82px 20px 78px; }
    .vn-account-shell { padding: 50px 16px 70px; }
    .vn-account-content > .woocommerce { grid-template-columns: 1fr; }
    .woocommerce-account .vn-account-content .woocommerce-MyAccount-navigation { grid-column: 1; min-height: 0; padding: 18px 0 0; width: 100%; }
    .woocommerce-MyAccount-navigation::before { padding-bottom: 18px; }
    .woocommerce-MyAccount-navigation ul { display: flex; overflow-x: auto; scrollbar-width: thin; }
    .woocommerce-MyAccount-navigation li { border-bottom: 0 !important; border-left: 1px solid rgba(255,255,255,.08); border-top: 0; flex: 0 0 auto; }
    .woocommerce-MyAccount-navigation a { padding: 16px 20px; white-space: nowrap; }
    .woocommerce-MyAccount-navigation a::after { display: none; }
    .woocommerce-MyAccount-navigation li.is-active a,
    .woocommerce-MyAccount-navigation a:hover { padding-left: 20px; }
    .woocommerce-account .vn-account-content .woocommerce-MyAccount-content { grid-column: 1; padding: 34px 24px; width: 100%; }
    .vn-account-content > .woocommerce > #customer_login { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
    .vn-account-hero::before,
    .vn-account-hero::after { display: none; }
    .vn-account-welcome__heading { align-items: flex-start; flex-direction: column; }
    .vn-account-action { gap: 12px; grid-template-columns: 25px minmax(0, 1fr) 22px; padding: 21px 0; }
    .vn-account-action:hover { padding-left: 8px; padding-right: 8px; }
    .woocommerce-account .vn-account-content .woocommerce-MyAccount-content { padding: 28px 18px; }
    .woocommerce-MyAccount-content table.shop_table { display: block; overflow-x: auto; }
}
