/**
 * ELBIN Redesign 2 — Мій кабінет (/my-account/*)
 *
 * Світлі картки-секції у словнику cart/checkout. Каркас: desktop —
 * сайдбар-навігація + контент; mobile — горизонтальні пігулки-таби.
 * Вантажиться лише на is_account_page() (account.php).
 */

/* ─── Каркас ────────────────────────────────────────────────────────────── */

.elbin-r2-account {
    display: grid;
    /* 280px = ширина сайдбара «Покупцям» на інфо-сторінках (page-info.css) */
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 28px;
    align-items: start;
    /* Блоксі-контейнер сайзить дітей за контентом — без width грід
       стискається (на orders контент був 292px). */
    width: 100%;
}

@media (max-width: 999px) {
    .elbin-r2-account {
        grid-template-columns: minmax(0, 1fr);
        gap: 18px;
    }
}

/* ─── Заголовок сторінки ────────────────────────────────────────────────── */
/* Blocksy-hero h1 рендерився дефолтною типографікою теми — приводимо 1:1
   до заголовків інфо-сторінок (.elbin-r2-info__title + бірюзова крапка) */
body.woocommerce-account .hero-section .page-title {
    font-family: var(--elbin-r2-font-ui);
    font-size: var(--elbin-r2-fs-page-title);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--elbin-r2-text);
}
body.woocommerce-account .hero-section .page-title::after {
    content: ".";
    color: var(--elbin-r2-accent);
}

/* Вішліст без Blocksy-hero — власний h1 (розмітка wishlist.php) */
.elbin-r2-wishlist-title {
    margin: 0 0 18px;
    font: 800 var(--elbin-r2-fs-page-title)/1.1 var(--elbin-r2-font-ui);
    letter-spacing: -0.02em;
    color: var(--elbin-r2-text);
}
.elbin-r2-wishlist-title__dot {
    color: var(--elbin-r2-accent);
}

/* ─── Навігація ─────────────────────────────────────────────────────────── */

/* Blocksy-обгортка навігації: width:20%/min-width:220px стискали картку
   до 220px (інакші пропорції, ніж меню «Покупцям» 280px), а власні
   фон/тінь/radius:5px+overflow:hidden різали кути нашої картки */
.elbin-r2-account .ct-acount-nav {
    width: 100%;
    min-width: 0;
    margin: 0;
    overflow: visible;
    border-radius: 0;
    box-shadow: none;
    background: none;
}

.elbin-r2-account .woocommerce-MyAccount-navigation {
    float: none;
    width: 100%;
}

.elbin-r2-account .woocommerce-MyAccount-navigation ul {
    list-style: none;
    margin: 0;
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: var(--elbin-r2-surface);
    border: 1px solid var(--elbin-r2-line);
    border-radius: 14px;
}

.elbin-r2-account .woocommerce-MyAccount-navigation li {
    margin: 0;
}

/* height/сепаратор перебивають Blocksy-бандл (li a {height:55px},
   li:not(:last-child) a {border-bottom}) — щоб меню було 1:1 з
   .elbin-r2-info__nav-item на інфо-сторінках */
.elbin-r2-account .woocommerce-MyAccount-navigation li a,
.elbin-r2-account .woocommerce-MyAccount-navigation ul li:not(:last-child) a {
    display: flex;
    align-items: center;
    gap: 12px;
    height: auto;
    padding: 12px 14px;
    border-bottom: none;
    border-radius: 10px;
    font: var(--elbin-r2-fw-medium) 14.5px/1.3 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-2);
    text-decoration: none;
    transition: background var(--elbin-r2-transition-fast),
                color var(--elbin-r2-transition-fast);
}

/* Hover/active — селектори з `ul li`, бо базове правило вище містить
   варіант `ul li:not(:last-child) a` (перебиття Blocksy-сепараторів) з
   вищою специфічністю, і його color:text-2 глушив би ці стани */
.elbin-r2-account .woocommerce-MyAccount-navigation ul li:hover a {
    background: var(--elbin-r2-surface-2);
    color: var(--elbin-r2-text);
}

.elbin-r2-account .woocommerce-MyAccount-navigation ul li.is-active a {
    background: var(--elbin-r2-accent-50);
    color: var(--elbin-r2-accent-700);
}

/* Іконки пунктів — stroke-SVG маскою, фарбується currentColor-фоном */
.elbin-r2-account .woocommerce-MyAccount-navigation li a::before {
    content: "";
    flex-shrink: 0;
    margin: 0; /* Blocksy дає a:before margin-inline-end:15px — гап уже є */
    width: 19px;
    height: 19px;
    background: currentColor;
    -webkit-mask: var(--acc-ico) center / contain no-repeat;
    mask: var(--acc-ico) center / contain no-repeat;
}

.elbin-r2-account .woocommerce-MyAccount-navigation-link--dashboard a {
    --acc-ico: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='7' height='7' rx='1'/><rect x='14' y='3' width='7' height='7' rx='1'/><rect x='3' y='14' width='7' height='7' rx='1'/><rect x='14' y='14' width='7' height='7' rx='1'/></svg>");
}
.elbin-r2-account .woocommerce-MyAccount-navigation-link--orders a {
    --acc-ico: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4Z'/><path d='M3 6h18'/><path d='M16 10a4 4 0 0 1-8 0'/></svg>");
}
.elbin-r2-account .woocommerce-MyAccount-navigation-link--edit-address a {
    --acc-ico: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z'/><circle cx='12' cy='10' r='3'/></svg>");
}
.elbin-r2-account .woocommerce-MyAccount-navigation-link--edit-account a {
    --acc-ico: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2'/><circle cx='12' cy='7' r='4'/></svg>");
}
.elbin-r2-account .woocommerce-MyAccount-navigation-link--elbin-wishlist a {
    --acc-ico: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z'/></svg>");
}
.elbin-r2-account .woocommerce-MyAccount-navigation-link--customer-logout a {
    --acc-ico: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/><path d='m16 17 5-5-5-5'/><path d='M21 12H9'/></svg>");
}

/* Вийти — окремо знизу, червонуватий hover */
.elbin-r2-account .woocommerce-MyAccount-navigation-link--customer-logout {
    margin-top: 6px;
    border-top: 1px solid var(--elbin-r2-line);
    padding-top: 6px;
}
.elbin-r2-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout:hover a {
    color: var(--elbin-r2-error);
    background: rgba(220, 68, 68, 0.06);
}

/* ─── Мобільна навігація: hub-and-spoke (рішення 04.07) ─────────────────────
   Чипи зверху промахувались і дублювали квік-лінки дашборда. Мобайл:
   дашборд сам є меню (нижні кнопки + «Вийти»), підсторінки — «← Кабінет»
   зверху + «Інші розділи» окремими кнопками під контентом (рендер
   account.php/elbin_r2_acc_bottom_nav). Десктоп: сайдбар як був. */

.elbin-r2-acc-back,
.elbin-r2-acc-bottomnav,
.elbin-r2-acc-link--logout {
    display: none;
}

@media (max-width: 999px) {
    /* верхній список ховаємо всюди; на дашборді — весь блок навігації */
    .elbin-r2-account .woocommerce-MyAccount-navigation ul {
        display: none;
    }
    body.elbin-acc-dash .elbin-r2-account .ct-acount-nav {
        display: none;
    }

    /* «← Кабінет» — одна велика ціль замість ряду дрібних чипів */
    .elbin-r2-acc-back {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        padding: 12px 16px;
        background: var(--elbin-r2-surface);
        border: 1px solid var(--elbin-r2-line);
        border-radius: 12px;
        font: 600 14px/1.2 var(--elbin-r2-font-ui);
        color: var(--elbin-r2-text);
        text-decoration: none;
    }
    .elbin-r2-acc-back::before {
        content: "";
        width: 18px;
        height: 18px;
        background: currentColor;
        -webkit-mask: var(--acc-back-ico) center / contain no-repeat;
        mask: var(--acc-back-ico) center / contain no-repeat;
        --acc-back-ico: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m12 19-7-7 7-7'/><path d='M19 12H5'/></svg>");
    }

    /* «Інші розділи» — окремі кнопки в стилі квік-лінків дашборда */
    .elbin-r2-acc-bottomnav {
        display: block;
        margin-top: 24px;
    }
    .elbin-r2-acc-bottomnav__title {
        margin: 0 0 12px;
    }
    .elbin-r2-account .elbin-r2-acc-bottomnav .woocommerce-MyAccount-navigation ul {
        display: flex;
        flex-direction: column;
        gap: 8px;
        padding: 0;
        background: none;
        border: none;
        border-radius: 0;
    }
    .elbin-r2-account .elbin-r2-acc-bottomnav .woocommerce-MyAccount-navigation ul li a {
        padding: 14px;
        background: var(--elbin-r2-surface);
        border: 1px solid var(--elbin-r2-line);
        border-radius: 14px;
        font: 600 14px/1.2 var(--elbin-r2-font-ui);
        color: var(--elbin-r2-text);
    }
    .elbin-r2-account .elbin-r2-acc-bottomnav .woocommerce-MyAccount-navigation ul li a::before {
        background: var(--elbin-r2-accent-700);
    }
    /* поточний розділ і «Кабінет» (його покриває чип зверху) не показуємо */
    .elbin-r2-acc-bottomnav .woocommerce-MyAccount-navigation li.is-active,
    .elbin-r2-acc-bottomnav .woocommerce-MyAccount-navigation-link--dashboard {
        display: none;
    }
    .elbin-r2-acc-bottomnav .woocommerce-MyAccount-navigation-link--customer-logout {
        margin-top: 0;
        border-top: none;
        padding-top: 0;
    }
    .elbin-r2-account .elbin-r2-acc-bottomnav ul li.woocommerce-MyAccount-navigation-link--customer-logout a {
        color: var(--elbin-r2-error);
    }
    .elbin-r2-account .elbin-r2-acc-bottomnav ul li.woocommerce-MyAccount-navigation-link--customer-logout a::before {
        background: var(--elbin-r2-error);
    }

    /* «Вийти» у квік-лінках дашборда (на десктопі він у сайдбарі) */
    .elbin-r2-acc-link--logout {
        display: flex;
    }
    .elbin-r2-acc-link--logout .elbin-r2-acc-link__icon {
        background: rgba(220, 68, 68, 0.08);
        color: var(--elbin-r2-error);
    }
}

/* ─── Дашборд ───────────────────────────────────────────────────────────── */

.elbin-r2-acc-dash__hello {
    margin: 0 0 18px;
    font: 400 15px/1.55 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-2);
}
.elbin-r2-acc-dash__hello b {
    color: var(--elbin-r2-text);
}

.elbin-r2-acc-tiles {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 26px;
}

.elbin-r2-acc-tile {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px;
    background: var(--elbin-r2-surface);
    border: 1px solid var(--elbin-r2-line);
    border-radius: 14px;
    text-decoration: none;
    transition: border-color var(--elbin-r2-transition-fast),
                box-shadow var(--elbin-r2-transition-fast);
}
.elbin-r2-acc-tile:hover {
    border-color: var(--elbin-r2-accent);
    box-shadow: 0 4px 14px rgba(13, 13, 13, 0.06);
}
.elbin-r2-acc-tile.is-accent {
    background: var(--elbin-r2-accent-50);
    border-color: var(--elbin-r2-accent-100);
}
.elbin-r2-acc-tile__text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.elbin-r2-acc-tile__icon {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--elbin-r2-accent-50);
    color: var(--elbin-r2-accent-700);
}
.elbin-r2-acc-tile.is-accent .elbin-r2-acc-tile__icon {
    background: var(--elbin-r2-accent-100);
}
.elbin-r2-acc-tile__value {
    font: 700 26px/1 var(--elbin-r2-font-mono);
    color: var(--elbin-r2-text);
}
.elbin-r2-acc-tile.is-accent .elbin-r2-acc-tile__value {
    color: var(--elbin-r2-accent-700);
}
.elbin-r2-acc-tile__label {
    font: 500 12.5px/1.2 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-3);
}

.elbin-r2-acc-dash__section {
    margin-bottom: 26px;
}
.elbin-r2-acc-dash__section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}
.elbin-r2-acc-dash__section-title {
    margin: 0;
    font: var(--elbin-r2-fw-heading) 17px/1.2 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text);
}
.elbin-r2-acc-dash__section-link {
    font: 600 13.5px/1 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-accent-700);
    text-decoration: none;
}
.elbin-r2-acc-dash__section-link:hover {
    text-decoration: underline;
}

/* Швидкі лінки */
.elbin-r2-acc-links {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.elbin-r2-acc-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    background: var(--elbin-r2-surface);
    border: 1px solid var(--elbin-r2-line);
    border-radius: 14px;
    text-decoration: none;
    transition: border-color var(--elbin-r2-transition-fast);
}
.elbin-r2-acc-link:hover {
    border-color: var(--elbin-r2-accent);
}
.elbin-r2-acc-link__icon {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--elbin-r2-accent-50);
    color: var(--elbin-r2-accent-700);
}
.elbin-r2-acc-link__text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.elbin-r2-acc-link__text b {
    font: 600 14px/1.2 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text);
}
.elbin-r2-acc-link__text span {
    font: 400 12.5px/1.3 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-3);
}

@media (max-width: 767px) {
    .elbin-r2-acc-tiles {
        gap: 8px;
    }
    .elbin-r2-acc-tile {
        padding: 12px;
    }
    .elbin-r2-acc-tile__value {
        font-size: 22px;
    }
    .elbin-r2-acc-links {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Вузькі екрани: 3 колонки тайлів лишали тексту ~15px і підписи
   ламались по літерах — стовпчик на всю ширину */
@media (max-width: 479px) {
    .elbin-r2-acc-tiles {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ─── Картка замовлення ─────────────────────────────────────────────────── */

.elbin-r2-orders-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.elbin-r2-order-card {
    background: var(--elbin-r2-surface);
    border: 1px solid var(--elbin-r2-line);
    border-radius: 14px;
    overflow: hidden;
}

.elbin-r2-order-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--elbin-r2-line);
    background: var(--elbin-r2-surface-2);
}
.elbin-r2-order-card__id {
    display: flex;
    align-items: baseline;
    gap: 10px;
    min-width: 0;
}
.elbin-r2-order-card__num {
    font: 700 14.5px/1 var(--elbin-r2-font-mono);
    color: var(--elbin-r2-text);
}
.elbin-r2-order-card__date {
    font: 500 12.5px/1 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-3);
}

/* Статус-бейджі */
.elbin-r2-order-badge {
    flex-shrink: 0;
    padding: 5px 10px;
    border-radius: 999px;
    font: 700 11px/1 var(--elbin-r2-font-ui);
    letter-spacing: 0.02em;
    text-transform: uppercase;
}
.elbin-r2-order-badge--success { background: rgba(34, 178, 106, 0.12); color: #157a47; }
.elbin-r2-order-badge--info    { background: var(--elbin-r2-accent-50); color: var(--elbin-r2-accent-700); }
.elbin-r2-order-badge--warning { background: rgba(240, 165, 0, 0.14); color: #9a6b00; }
.elbin-r2-order-badge--error   { background: rgba(220, 68, 68, 0.12); color: var(--elbin-r2-error, #c0392b); }
.elbin-r2-order-badge--muted   { background: var(--elbin-r2-surface-3); color: var(--elbin-r2-text-3); }

.elbin-r2-order-card__body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 18px;
}
.elbin-r2-order-card__items {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}
.elbin-r2-order-card__names {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}
.elbin-r2-order-card__name {
    font: 600 13.5px/1.35 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text);
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.elbin-r2-order-card__thumbs {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}
.elbin-r2-order-card__thumbs img.elbin-r2-order-card__thumb {
    width: 44px;
    height: 44px;
    object-fit: contain;
    border: 1px solid var(--elbin-r2-line);
    border-radius: 8px;
    background: #fff;
}
.elbin-r2-order-card__more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 8px;
    background: var(--elbin-r2-surface-3);
    font: 700 12px/1 var(--elbin-r2-font-mono);
    color: var(--elbin-r2-text-3);
}
.elbin-r2-order-card__side {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-shrink: 0;
}
.elbin-r2-order-card__count {
    font: 500 12.5px/1 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-3);
}
.elbin-r2-order-card__total {
    font: 700 16px/1.2 var(--elbin-r2-font-mono);
    color: var(--elbin-r2-text);
    white-space: nowrap;
}

.elbin-r2-order-card__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 18px;
    border-top: 1px solid var(--elbin-r2-line);
}
.elbin-r2-order-card__ttn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font: 600 12.5px/1 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-2);
    text-decoration: none;
}
.elbin-r2-order-card__ttn:hover {
    color: var(--elbin-r2-accent-700);
}
.elbin-r2-order-card__ttn-num {
    font-family: var(--elbin-r2-font-mono);
}
.elbin-r2-order-card__actions {
    display: flex;
    gap: 8px;
    margin-left: auto;
}

/* Кнопки замовлення */
.elbin-r2-order-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 16px;
    border: 1px solid var(--elbin-r2-line);
    border-radius: 9px;
    background: var(--elbin-r2-surface);
    font: 600 13px/1 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-2);
    text-decoration: none;
    cursor: pointer;
    transition: border-color var(--elbin-r2-transition-fast),
                color var(--elbin-r2-transition-fast),
                background var(--elbin-r2-transition-fast);
}
.elbin-r2-order-btn:hover {
    border-color: var(--elbin-r2-accent);
    color: var(--elbin-r2-accent-700);
}
.elbin-r2-order-btn--primary {
    border-color: var(--elbin-r2-ink);
    background: var(--elbin-r2-ink);
    color: #fff;
}
.elbin-r2-order-btn--primary:hover {
    border-color: var(--elbin-r2-accent-700);
    background: var(--elbin-r2-accent-700);
    color: #fff;
}
.elbin-r2-order-btn--accent {
    border-color: var(--elbin-r2-accent);
    background: var(--elbin-r2-accent);
    color: var(--elbin-r2-ink-on-accent);
}
.elbin-r2-order-btn--accent:hover {
    border-color: var(--elbin-r2-accent-hover, #16B8B2);
    background: var(--elbin-r2-accent-hover, #16B8B2);
    color: var(--elbin-r2-ink-on-accent);
}

@media (max-width: 599px) {
    .elbin-r2-order-card__head,
    .elbin-r2-order-card__body,
    .elbin-r2-order-card__foot {
        padding-left: 14px;
        padding-right: 14px;
    }
    .elbin-r2-order-card__body {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
    .elbin-r2-order-card__side {
        justify-content: space-between;
    }
    .elbin-r2-order-card__actions .elbin-r2-order-btn {
        flex: 1;
    }
}

/* ─── Пагінація замовлень ───────────────────────────────────────────────── */

.elbin-r2-orders-pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 18px;
}
.elbin-r2-orders-pager__info {
    font: 500 13px/1 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-3);
}

/* ─── Порожній стан ─────────────────────────────────────────────────────── */

.elbin-r2-acc-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    padding: 44px 20px;
    background: var(--elbin-r2-surface);
    border: 1px dashed var(--elbin-r2-line);
    border-radius: 14px;
    text-align: center;
    color: var(--elbin-r2-text-3);
    margin-bottom: 26px;
}
.elbin-r2-acc-empty p {
    margin: 0;
    font: 500 14.5px/1.4 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-2);
}

/* ─── Форми кабінету (адреси, особисті дані, логін/реєстрація) ──────────── */

.elbin-r2-account .woocommerce-MyAccount-content input[type="text"],
.elbin-r2-account .woocommerce-MyAccount-content input[type="email"],
.elbin-r2-account .woocommerce-MyAccount-content input[type="tel"],
.elbin-r2-account .woocommerce-MyAccount-content input[type="password"],
.elbin-r2-account .woocommerce-MyAccount-content select,
.elbin-r2-account .woocommerce-MyAccount-content textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--elbin-r2-line);
    border-radius: 8px;
    font: 400 14px/1.5 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text);
    background: var(--elbin-r2-surface);
    box-sizing: border-box;
    outline: none;
    transition: border-color var(--elbin-r2-transition-fast),
                box-shadow var(--elbin-r2-transition-fast);
}
.elbin-r2-account .woocommerce-MyAccount-content input:focus,
.elbin-r2-account .woocommerce-MyAccount-content select:focus,
.elbin-r2-account .woocommerce-MyAccount-content textarea:focus {
    border-color: var(--elbin-r2-accent);
    box-shadow: 0 0 0 3px var(--elbin-r2-accent-50);
}
.elbin-r2-account .woocommerce-MyAccount-content label {
    font: 600 13px/1.3 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-2);
}
.elbin-r2-account .woocommerce-MyAccount-content button[type="submit"],
.elbin-r2-account .woocommerce-MyAccount-content .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 22px;
    border: none;
    border-radius: 9px;
    background: var(--elbin-r2-accent);
    font: 700 14px/1 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-ink-on-accent);
    cursor: pointer;
    transition: background var(--elbin-r2-transition-fast);
}
.elbin-r2-account .woocommerce-MyAccount-content button[type="submit"]:hover,
.elbin-r2-account .woocommerce-MyAccount-content .button:hover {
    background: var(--elbin-r2-accent-hover, #16B8B2);
    color: var(--elbin-r2-ink-on-accent);
}

/* Адреси: дві картки */
.elbin-r2-account .woocommerce-Addresses {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.elbin-r2-account .woocommerce-Address {
    width: auto !important; /* Woo ставить інлайн-float розкладку */
    float: none !important;
    padding: 16px 18px;
    background: var(--elbin-r2-surface);
    border: 1px solid var(--elbin-r2-line);
    border-radius: 14px;
}
.elbin-r2-account .woocommerce-Address address {
    font-style: normal;
    color: var(--elbin-r2-text-2);
    line-height: 1.55;
}
@media (max-width: 767px) {
    .elbin-r2-account .woocommerce-Addresses {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ─── Нова пошта у формі адреси ─────────────────────────────────────────── */

.elbin-r2-np--account {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--elbin-r2-line);
}
.elbin-r2-np--account .elbin-r2-np__acc-title {
    margin: 0 0 4px;
    font: var(--elbin-r2-fw-heading) 16px/1.2 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text);
}
.elbin-r2-np--account .elbin-r2-np__acc-hint {
    margin: 0 0 14px;
    font: 400 12.5px/1.45 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-3);
}

/* ─── Деталі замовлення (view-order) ────────────────────────────────────── */

.elbin-r2-vieworder-head {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px 18px;
    background: var(--elbin-r2-surface);
    border: 1px solid var(--elbin-r2-line);
    border-radius: 14px;
    margin-bottom: 18px;
}
.elbin-r2-vieworder-head__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.elbin-r2-vieworder-head__ttn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding-top: 12px;
    border-top: 1px solid var(--elbin-r2-line);
    font: 500 13.5px/1.4 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-2);
}

/* Таблиця товарів замовлення — картка.
   Селектори якорять table.…​.shop_table (0-3-x), щоб перебити дефолтні
   стилі WooCommerce/Blocksy `.woocommerce table.shop_table` (0-2-x). */
.elbin-r2-account table.woocommerce-table--order-details.shop_table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--elbin-r2-line);
    border-radius: 14px;
    overflow: hidden;
    background: var(--elbin-r2-surface);
}
.elbin-r2-account table.woocommerce-table--order-details.shop_table th,
.elbin-r2-account table.woocommerce-table--order-details.shop_table td {
    padding: 12px 16px;
    border: none;
    border-bottom: 1px solid var(--elbin-r2-line);
    font: 400 14px/1.45 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-2);
    text-align: left;
}
.elbin-r2-account table.woocommerce-table--order-details.shop_table thead th {
    background: var(--elbin-r2-surface-2);
    font-weight: 600;
    color: var(--elbin-r2-text);
}
.elbin-r2-account table.woocommerce-table--order-details.shop_table tfoot th {
    font-weight: 600;
    color: var(--elbin-r2-text-3);
}
.elbin-r2-account table.woocommerce-table--order-details.shop_table tfoot tr:last-child th,
.elbin-r2-account table.woocommerce-table--order-details.shop_table tfoot tr:last-child td {
    border-bottom: none;
    font-weight: 700;
    color: var(--elbin-r2-text);
    background: var(--elbin-r2-surface-2);
}
.elbin-r2-account table.woocommerce-table--order-details.shop_table .product-name a {
    color: var(--elbin-r2-text);
    text-decoration: none;
    font-weight: 500;
}
.elbin-r2-account table.woocommerce-table--order-details.shop_table .product-name a:hover {
    color: var(--elbin-r2-accent-700);
}

/* Адреса доставки в деталях */
.elbin-r2-account .woocommerce-customer-details address {
    padding: 16px 18px;
    border: 1px solid var(--elbin-r2-line);
    border-radius: 14px;
    background: var(--elbin-r2-surface);
    font-style: normal;
    line-height: 1.55;
    color: var(--elbin-r2-text-2);
}

/* ─── Гість: логін/реєстрація ───────────────────────────────────────────────
   Гостьові форми рендеряться БЕЗ обгортки .elbin-r2-account (form-login.php
   замість my-account.php), тому скоуп — body-клас сторінки кабінету. */

body.woocommerce-account .woocommerce-form-login,
body.woocommerce-account .woocommerce-form-register {
    padding: 22px;
    background: var(--elbin-r2-surface);
    border: 1px solid var(--elbin-r2-line);
    border-radius: 14px;
}

body.woocommerce-account .woocommerce-form-login input[type="text"],
body.woocommerce-account .woocommerce-form-login input[type="email"],
body.woocommerce-account .woocommerce-form-login input[type="password"],
body.woocommerce-account .woocommerce-form-register input[type="text"],
body.woocommerce-account .woocommerce-form-register input[type="email"],
body.woocommerce-account .woocommerce-form-register input[type="password"] {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--elbin-r2-line);
    border-radius: 8px;
    font: 400 14px/1.5 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text);
    background: var(--elbin-r2-surface);
    box-sizing: border-box;
    outline: none;
}
body.woocommerce-account .woocommerce-form-login input:focus,
body.woocommerce-account .woocommerce-form-register input:focus {
    border-color: var(--elbin-r2-accent);
    box-shadow: 0 0 0 3px var(--elbin-r2-accent-50);
}
body.woocommerce-account .woocommerce-form-login button[type="submit"],
body.woocommerce-account .woocommerce-form-register button[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 22px;
    border: none;
    border-radius: 9px;
    background: var(--elbin-r2-accent);
    font: 700 14px/1 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-ink-on-accent);
    cursor: pointer;
    transition: background var(--elbin-r2-transition-fast);
}
body.woocommerce-account .woocommerce-form-login button[type="submit"]:hover,
body.woocommerce-account .woocommerce-form-register button[type="submit"]:hover {
    background: var(--elbin-r2-accent-hover, #16B8B2);
}

/* ─── Згода на розсилку у формі реєстрації (Retention Фаза 1) ──────────────── */
body.woocommerce-account .elbin-r2-marketing-consent {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font: 400 13px/1.45 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-2);
    cursor: pointer;
}
body.woocommerce-account .elbin-r2-marketing-consent input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: var(--elbin-r2-accent);
    flex-shrink: 0;
    margin: 1px 0 0;
}

/* ─── Банер welcome-купона на дашборді (Retention Фаза 2) ──────────────────── */
.elbin-r2-acc-promo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin: 0 0 20px;
    padding: 16px 20px;
    background: var(--elbin-r2-accent-50);
    border: 1px dashed var(--elbin-r2-accent);
    border-radius: 12px;
}
.elbin-r2-acc-promo__text b {
    display: block;
    font: 700 15px/1.35 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text);
}
.elbin-r2-acc-promo__text span {
    display: block;
    margin-top: 2px;
    font: 400 13px/1.45 var(--elbin-r2-font-ui);
    color: var(--elbin-r2-text-2);
}
.elbin-r2-acc-promo__code {
    padding: 10px 16px;
    background: var(--elbin-r2-surface);
    border: 1px solid var(--elbin-r2-accent);
    border-radius: 9px;
    font: 700 16px/1 var(--elbin-r2-font-mono, monospace);
    letter-spacing: 1px;
    color: var(--elbin-r2-text);
    user-select: all;
}

/* ─── Вхід/реєстрація за кодом (OTP) — Retention Фаза 2 ─────────────────────────
   Стилі блока переїхали в account-drawer.css (реворк 16.07): він глобальний,
   бо блок живе і в акаунт-дровері на будь-якій сторінці, не лише в кабінеті. */
