/* ==========================================================================
   Вход, регистрация и личный кабинет

   Макет: 1:3081 · 1:3121 · 1:3163 · 1:3223 · 1:3288 · 1:3321 · 1:3352 ·
          1:3393 · 1:3420 (авторизация),
          1:3451 · 1:3533 · 1:3609 · 1:3678 · 1:3760 · 1:15273 · 1:15347 (кабинет).

   Все значения сняты через Figma MCP (get_design_context), не на глаз.
   Ключевые отличия этих экранов от остального сайта:
     - радиус инпутов 12, а НЕ pill, как в общих формах (front-cta.css);
     - карточки кабинета скруглены на 16, а не на 24/32;
     - типографика мельче: подписи 16, значения 16–20, заголовки 24/32.
   Поэтому здесь много перекрытий общих классов .field / .checkbox —
   править base.css и front-cta.css нельзя, они держат остальные страницы.
   ========================================================================== */

:root {
  /* Токенов этих значений в variables.css нет: они встречаются ТОЛЬКО
     на экранах кабинета. Если появятся ещё где-то — перенести в
     variables.css. Источник у каждого — конкретная нода макета. */

  --ag-radius-16: 16px;   /* [RAW] 1:3484, 1:3645, 1:3713, 1:3796 — карточки кабинета */
  --ag-radius-6:  6px;    /* [RAW] 1:3283, 1:3800, 1:15342 — чекбокс и мелкий бейдж */
  --ag-radius-8:  8px;    /* [RAW] 1:3511 — бейдж статуса заказа */

  --ag-danger:    #BF4848;  /* [RAW] 1:3479 «Выйти», 1:3807 «Удалить» — мягче, чем --color-error */

  --ag-badge-done-bg:    #EAFAF0;  /* [RAW] 1:3511 «Доставлен» */
  --ag-badge-transit-bg: #E8EDF8;  /* [RAW] 1:3519 «В пути», 1:3800 «По умолчанию» */
  --ag-badge-work-bg:    #FFF3E6;  /* [RAW] 1:3527 «В обработке» */
  --ag-badge-work-text:  #FF9900;  /* [RAW] 1:3528 */

  --ag-error-tint: rgba(220, 38, 38, .08);  /* [RAW] 1:3147 — плашка ошибки входа */

  --ag-space-20:  20px;   /* [RAW] 1:3645 паддинг карточки заказа, 1:3673 «Итого», 1:15309 инпут адреса */

  --ag-sidebar:    280px;  /* [RAW] 1:3469 */
  --ag-col-gap:    40px;   /* [RAW] 1:3468 — зазор меню и контента */
}

/* --------------------------------------------------------------------------
   Обвязка страницы

   В макете (1:3081, 1:3451) над формой нет ни крошек, ни заголовка H1 —
   контент начинается сразу под шапкой, на 64 px ниже. page.php общий, его
   не трогаем, поэтому шапку раздела гасим здесь.
   -------------------------------------------------------------------------- */

.woocommerce-account .page-head { display: none; }

.woocommerce-account .page-section {
  /* 254 − 190 = 64 сверху; до футера 128 (--section-gap-sm), нода 1:3119. */
  padding-block: var(--space-64) var(--section-gap-sm);
}

/* Подвал на контентных страницах добавляет свои 95 сверху (половина ритма
   190). На экранах входа и кабинета зазор до футера в макете ровно 128
   (`Frame 2087326335`), поэтому свою половину подвал здесь не добавляет —
   иначе страница выходит на ~95 px длиннее макета. */
.woocommerce-account .site-footer { padding-block-start: 0; }

/* ==========================================================================
   1. АВТОРИЗАЦИЯ
   ========================================================================== */

.auth {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-24);   /* 1:3305 — зазор карточки и подписи под ней */
}

/* Карточка 580×auto, заливка bg_white-grey, рамка bg_light_grey, радиус 24.
   Теней в макете нет ни одной — см. variables.css. Нода 1:3098. */
.auth__card {
  display: flex;
  flex-direction: column;
  gap: var(--space-32);
  width: 580px;
  max-width: 100%;
  padding: var(--space-32);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-lg);
  background: var(--color-bg-soft);
}

/* На экранах входа и регистрации вкладки прижаты к верхнему краю
   карточки: у неё pb/px 32, а pt 0 (1:3098). */
.auth__card--tabs { padding-top: 0; }

/* --- Вкладки «Вход | Регистрация» (1:3099) -------------------------------
   Две равные половины, под каждой полоса 3 px: активная синяя,
   неактивная bg_light_grey. */

.auth__tabs { display: flex; width: 100%; }

.auth__tab {
  position: relative;
  display: flex;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding-bottom: 3px;
  font-size: var(--fs-20);
  font-weight: var(--fw-regular);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-20);
  color: var(--color-text-muted);
  transition: color var(--dur-fast) var(--ease-out);
}

.auth__tab::after {
  content: '';
  position: absolute;
  inset: auto 0 0 0;
  height: 3px;
  background: var(--color-border-soft);
  transition: background var(--dur-fast) var(--ease-out);
}

.auth__tab.is-active { color: var(--color-brand); }
.auth__tab.is-active::after { background: var(--color-brand); }

/* --- Заголовок карточки (1:3307, 1:3340, 1:3371) -------------------------- */

.auth__titles {
  display: flex;
  flex-direction: column;
  gap: var(--space-12);
  width: 100%;
  text-align: center;
}

.auth__title {
  font-size: var(--fs-32);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-32);
}

.auth__subtitle {
  font-size: var(--fs-16);
  font-weight: var(--fw-regular);
  line-height: normal;
  letter-spacing: var(--ls-16);
  color: var(--color-text-muted);
}

/* --- Тело формы (1:3106) -------------------------------------------------- */

.auth__form {
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
  width: 100%;
}

/* Поля кабинета мельче общих: подпись 16 Medium, инпут 76 px, радиус 12.
   Рамка держится прозрачной 1.5 px, чтобы состояние ошибки (1.5 px
   #DC2626, нода 1:3151) не сдвигало высоту. */
.auth .field { gap: var(--space-8); }

.auth .field__label {
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
  color: var(--color-text);
}

.auth .field__input {
  width: 100%;
  height: 76px;
  min-height: 0;
  padding: 0 var(--space-24);
  border: 1.5px solid transparent;
  border-radius: var(--radius-md);
  background: var(--color-bg);
  font-size: var(--fs-20);
  font-weight: var(--fw-regular);
  letter-spacing: var(--ls-20);
}

.auth .field.has-error .field__input { border-color: var(--color-error); }

/* Поле с глазом: иконка 24×24 в 24 px от правого края (1:3116). */
.field__control { position: relative; width: 100%; }
.field__control .field__input { padding-right: 64px; }

.field__eye {
  position: absolute;
  top: 50%;
  right: var(--space-24);
  display: flex;
  width: 24px;
  height: 24px;
  margin-top: -12px;
  color: var(--color-text);
}

.field__eye svg { width: 24px; height: 24px; }

.field__error {
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
  color: var(--color-error);
}

/* Плашка «Неверный e-mail или пароль…» (1:3147): заливка красным 8 %. */
.auth__alert {
  padding: var(--space-16);
  border-radius: var(--radius-md);
  background: var(--ag-error-tint);
  font-size: var(--fs-16);
  font-weight: var(--fw-regular);
  line-height: normal;
  letter-spacing: var(--ls-16);
  color: var(--color-error);
}

.auth__alert ul { margin: 0; }
.auth__alert a { text-decoration: underline; }

.auth__link {
  align-self: flex-start;
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
  color: var(--color-brand);
  transition: opacity var(--dur-fast) var(--ease-out);
}

.auth__link:hover { opacity: .7; }

.auth__submit { width: 100%; }

/* Чекбокс согласия (1:3282): квадрат 24, рамка 1.5 bg_light_grey, радиус 6.
   Состояния ошибки у него в макете нет, но поле обязательное — текст
   ошибки уводим на отдельную строку, чтобы он не вставал рядом с подписью. */
.auth__consent { align-items: center; gap: var(--space-12); flex-wrap: wrap; }
.auth__consent .field__error { flex: 1 0 100%; }

/* Подпись занимает остаток строки и переносится ВНУТРИ себя — раньше она
   целиком уезжала на новую строку под квадрат, и чекбокс висел один. */
.auth__consent .checkbox__label { flex: 1; min-width: 0; }

.auth__consent .checkbox__box,
.address-form .checkbox__box {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  /* Рамка была цветом линий (#E7E7E7) — на светлой карточке квадрат
     почти невидим. Основной серый границ заметнее, при наведении синеет. */
  border: 1.5px solid var(--color-border);
  border-radius: var(--ag-radius-6);
  background: var(--color-bg);
}

/* .auth__consent — это сам label.checkbox, поэтому hover на нём. */
.auth__consent:hover .checkbox__box,
.address-form .checkbox:hover .checkbox__box { border-color: var(--color-brand); }

.auth__consent .checkbox__box svg,
.address-form .checkbox__box svg { width: 14px; height: 14px; }

.auth__consent .checkbox__label {
  font-size: var(--fs-16);
  font-weight: var(--fw-regular);
  line-height: normal;
  letter-spacing: var(--ls-16);
  color: var(--color-text-muted);
}

/* --- Экраны-результаты (1:3343, 1:3414, 1:3442) --------------------------- */

.auth__result {
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
  width: 100%;
  text-align: center;
}

.auth__result-title {
  font-size: var(--fs-20);
  font-weight: var(--fw-regular);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-20);
  color: var(--color-text);
}

.auth__result-text {
  font-size: var(--fs-16);
  font-weight: var(--fw-regular);
  line-height: normal;
  letter-spacing: var(--ls-16);
  color: var(--color-text-muted);
}

/* Подпись под карточкой: «Вспомнили пароль? Войти» (1:3316, 1:3347). */
.auth__note {
  display: flex;
  align-items: center;
  gap: var(--space-8);
  font-size: var(--fs-16);
  letter-spacing: var(--ls-16);
}

.auth__note-text {
  font-weight: var(--fw-regular);
  line-height: normal;
  color: var(--color-text-muted);
}

.auth__note-link {
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  color: var(--color-brand);
  transition: opacity var(--dur-fast) var(--ease-out);
}

.auth__note-link:hover { opacity: .7; }

/* ==========================================================================
   2. КАБИНЕТ: РАСКЛАДКА
   ========================================================================== */

/* 1:3468 — меню 280, зазор 40, контент занимает остаток 1520. */
.woocommerce-account .woocommerce {
  display: grid;
  grid-template-columns: var(--ag-sidebar) minmax(0, 1fr);
  gap: var(--ag-col-gap);
  align-items: start;
}

/* Экраны авторизации и восстановления пароля Woo отдаёт без меню кабинета
   (в том числе залогиненному пользователю на /lost-password/). Тогда
   карточка осталась бы в узкой колонке меню — растягиваем на всю сетку. */
.woocommerce-account .auth { grid-column: 1 / -1; }

/* --- Меню (1:3469) -------------------------------------------------------- */

.account-nav {
  padding: var(--space-16);
  border-radius: var(--radius-lg);
  background: var(--color-bg-soft);
}

.account-nav__list { display: flex; flex-direction: column; }

.account-nav__item a {
  display: flex;
  align-items: center;
  padding: var(--space-16) var(--space-24);
  border-radius: var(--radius-md);
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
  color: var(--color-text);
  transition: background var(--dur-fast) var(--ease-out),
              color var(--dur-fast) var(--ease-out);
}

.account-nav__item a:hover { color: var(--color-brand); }

.account-nav__item.is-active a {
  background: var(--color-brand);
  color: var(--color-text-invert);
}

/* «Выйти» в макете красным (1:3479). */
.account-nav__item--customer-logout a { color: var(--ag-danger); }
.account-nav__item--customer-logout a:hover { color: var(--color-error); }

/* --- Колонка контента (1:3480) -------------------------------------------
   В макете это просто колонка с зазором 24, без подложки и паддингов. */

.woocommerce-MyAccount-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-24);
  min-width: 0;
  padding: 0;
  border-radius: 0;
  background: none;
}

.account-back {
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
  color: var(--color-brand);
  transition: opacity var(--dur-fast) var(--ease-out);
}

.account-back:hover { opacity: .7; }

.account-title {
  font-size: var(--fs-32);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-32);
}

.account-subtitle {
  font-size: var(--fs-24);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-24);
}

/* ==========================================================================
   3. ОБЗОР (1:3451)
   ========================================================================== */

.account-hello {
  font-size: var(--fs-32);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-32);
}

.account-company {
  font-size: var(--fs-20);
  font-weight: var(--fw-regular);
  line-height: var(--lh-loose);
  letter-spacing: var(--ls-20);
  color: var(--color-text-muted);
}

/* Плитки-счётчики 280×123, радиус 16, зазор 16 (1:3483).
   Ширина в макете фиксированная — ряд НЕ растягивается на всю колонку. */
.account-stats { display: flex; flex-wrap: wrap; gap: var(--space-16); }

.account-stat {
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
  width: 280px;
  max-width: 100%;
  padding: var(--space-24);
  border-radius: var(--ag-radius-16);
  background: var(--color-bg-soft);
}

.account-stat__value {
  font-size: var(--fs-32);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-32);
}

.account-stat__label {
  font-size: var(--fs-20);
  font-weight: var(--fw-regular);
  line-height: var(--lh-loose);
  letter-spacing: var(--ls-20);
  color: var(--color-text-muted);
}

/* Строка «Последние заказы …………… Все заказы →» (1:3496). */
.account-section-head {
  display: flex;
  align-items: center;
  gap: var(--space-16);
  padding-top: var(--space-16);
}

.account-section-head__title {
  font-size: var(--fs-24);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-24);
}

.account-section-head__link {
  margin-left: auto;
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
  color: var(--color-brand);
  transition: opacity var(--dur-fast) var(--ease-out);
}

.account-section-head__link:hover { opacity: .7; }

/* ==========================================================================
   4. ТАБЛИЦА ЗАКАЗОВ (1:3500 шапка, 1:3507 строка)

   В макете это не <table>, а строки-карточки: у каждой своя рамка и
   радиус 12, между ними зазор 12. Поэтому flex, а не table.
   ========================================================================== */

.ag-orders { display: flex; flex-direction: column; gap: var(--space-12); }

.ag-orders__head,
.ag-orders__row {
  display: flex;
  align-items: center;
  padding: var(--space-12);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-md);
}

.ag-orders__head {
  align-items: flex-start;
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
  color: var(--color-text-muted);
}

.ag-orders__col { min-width: 0; }
.ag-orders__col--number { width: 280px; }
.ag-orders__col--date   { width: 200px; }
.ag-orders__col--status { width: 250px; }
.ag-orders__col--total  { margin-left: auto; text-align: right; }

.ag-orders__row .ag-orders__col--number {
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
  color: var(--color-brand);
}

.ag-orders__row .ag-orders__col--date {
  font-size: var(--fs-20);
  font-weight: var(--fw-regular);
  line-height: var(--lh-loose);
  letter-spacing: var(--ls-20);
  color: var(--color-text-muted);
}

.ag-orders__row .ag-orders__col--total {
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
  color: var(--color-text);
}

.ag-orders__row .ag-orders__col--total .amount,
.ag-orders__row .ag-orders__col--total bdi { font: inherit; }

.ag-orders__empty {
  font-size: var(--fs-20);
  font-weight: var(--fw-regular);
  line-height: var(--lh-loose);
  letter-spacing: var(--ls-20);
  color: var(--color-text-muted);
}

/* Бейдж статуса 1:3511 / 1:3519 / 1:3527. */
.ag-badge {
  display: inline-flex;
  align-items: center;
  padding: 6px var(--space-12);
  border-radius: var(--ag-radius-8);
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
  background: var(--color-bg-soft);
  color: var(--color-text);
}

.ag-badge--completed { background: var(--ag-badge-done-bg);    color: var(--color-success); }
.ag-badge--on-hold   { background: var(--ag-badge-transit-bg); color: var(--color-brand); }
.ag-badge--processing,
.ag-badge--pending   { background: var(--ag-badge-work-bg);    color: var(--ag-badge-work-text); }
.ag-badge--cancelled,
.ag-badge--failed,
.ag-badge--refunded  { background: var(--ag-error-tint);       color: var(--color-error); }

/* Фильтр-пилюли статусов (1:3565). */
.ag-chips { display: flex; flex-wrap: wrap; gap: var(--space-8); }

.ag-chip {
  padding: 10px var(--ag-space-20);
  border-radius: var(--radius-md);
  background: var(--color-bg-soft);
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
  color: var(--color-text);
  transition: background var(--dur-fast) var(--ease-out),
              color var(--dur-fast) var(--ease-out);
}

.ag-chip:hover { background: var(--color-border-soft); }

.ag-chip.is-active {
  background: var(--color-brand);
  color: var(--color-text-invert);
}

.ag-chip.is-active:hover { background: var(--color-brand-hover); }

/* ==========================================================================
   5. КАРТОЧКА ЗАКАЗА (1:3638)
   ========================================================================== */

.order-view__head {
  display: flex;
  align-items: center;
  gap: var(--space-16);
  padding-top: var(--space-8);
}

.order-view__info {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;   /* 1:3644 — плитки по содержимому, не тянутся */
  gap: var(--space-24);
  padding-top: var(--space-8);
}

/* 1:3645 — 350×86, радиус 16, обе строки 16 Medium. */
.order-fact {
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
  width: 350px;
  max-width: 100%;
  padding: var(--ag-space-20);
  border-radius: var(--ag-radius-16);
  background: var(--color-bg-soft);
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
}

.order-fact__label { color: var(--color-text-muted); }
.order-fact__value { color: var(--color-text); }
.order-fact__value .amount,
.order-fact__value bdi { font: inherit; }

.order-items { display: flex; flex-direction: column; gap: var(--space-24); }

/* 1:3655 — строка 54 px: рамка 1, радиус 12, паддинг 12. */
.order-item {
  display: flex;
  align-items: center;
  padding: var(--space-12);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-md);
}

.order-item__name,
.order-item__qty,
.order-item__price {
  min-width: 0;
  font-size: var(--fs-20);
  font-weight: var(--fw-regular);
  line-height: var(--lh-loose);
  letter-spacing: var(--ls-20);
}

.order-item__name  { flex: 0 1 600px; color: var(--color-text); }
.order-item__qty   { flex: 0 0 150px; color: var(--color-text-muted); }
.order-item__price { flex: 0 0 200px; color: var(--color-text-muted); }

.order-item__total {
  margin-left: auto;
  padding-left: var(--space-16);
  text-align: right;
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
  color: var(--color-text);
}

.order-item__total .amount,
.order-item__total bdi { font: inherit; }

/* 1:3673 — «Итого» прижато вправо, вертикальный паддинг 20. */
.order-total {
  display: flex;
  justify-content: flex-end;
  padding-block: var(--ag-space-20);
  font-size: var(--fs-24);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-24);
}

.order-total .amount,
.order-total bdi { font: inherit; }

/* ==========================================================================
   6. КАРТОЧКА-ФОРМА: ДАННЫЕ КОМПАНИИ (1:3713) И АДРЕС (1:15305)
   ========================================================================== */

.account-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-24);
  width: 100%;
  padding: var(--space-32);
  border-radius: var(--ag-radius-16);
  background: var(--color-bg-soft);
}

.account-card__section {
  display: flex;
  flex-direction: column;
  gap: var(--ag-space-20);
  padding-top: var(--space-8);
}

.account-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-24);
  align-items: flex-start;
}

.account-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-24);
}

.account-form .field { gap: var(--space-8); }

.account-form .field__label {
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
  color: var(--color-text-muted);
}

/* 1:3719 — инпут 66 px: 18 сверху/снизу, 24 по бокам, рамка 1, радиус 12. */
.account-form .field__input {
  width: 100%;
  min-height: 0;
  padding: 18px var(--space-24);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-md);
  background: var(--color-bg);
  font-size: var(--fs-20);
  font-weight: var(--fw-regular);
  line-height: var(--lh-loose);
  letter-spacing: var(--ls-20);
}

.account-form .field__input:disabled { color: var(--color-text-muted); }

.account-form .field__hint {
  font-size: var(--fs-16);
  line-height: normal;
  letter-spacing: var(--ls-16);
  color: var(--color-text-muted);
  opacity: 1;
}

/* --- Форма адреса (1:15305): подписи и инпуты мельче, чем в компании --- */

.address-form { display: flex; flex-direction: column; gap: var(--space-24); align-items: flex-start; }

.address-form .field__label {
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: normal;
  letter-spacing: var(--ls-16);
  color: var(--color-text);
}

/* 1:15309 — инпут 53 px: 16 сверху/снизу, 20 по бокам. */
.address-form .field__input,
.address-form select.field__input {
  width: 100%;
  min-height: 0;
  padding: var(--space-16) var(--ag-space-20);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-md);
  background: var(--color-bg);
  font-size: var(--fs-16);
  font-weight: var(--fw-regular);
  line-height: normal;
  letter-spacing: var(--ls-16);
}

.address-form .checkbox { align-items: center; gap: var(--space-12); }

.address-form .checkbox__label {
  font-size: var(--fs-16);
  font-weight: var(--fw-regular);
  line-height: normal;
  letter-spacing: var(--ls-16);
  color: var(--color-text);
}

/* ==========================================================================
   7. АДРЕСА ДОСТАВКИ (1:3791)
   ========================================================================== */

.address-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-24);
}

.address-list { display: flex; flex-direction: column; gap: var(--space-16); }

/* У экрана адресов зазор между заголовком и списком 32 (1:3791),
   а не общие 24 — добираем 8. */
.address-head + .address-list { margin-top: var(--space-8); }

/* 1:3796 — карточка: заливка bg_white-grey, радиус 16, паддинг 24. */
.address-card {
  display: flex;
  align-items: flex-start;
  gap: var(--space-24);
  padding: var(--space-24);
  border-radius: var(--ag-radius-16);
  background: var(--color-bg-soft);
}

.address-card__info {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: var(--space-8);
  min-width: 0;
}

.address-card__name {
  display: flex;
  align-items: center;
  gap: var(--space-12);
  font-size: var(--fs-20);
  font-weight: var(--fw-regular);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-20);
}

/* 1:3800 — бейдж «По умолчанию»: 8/4, радиус 6. */
.address-card__badge {
  padding: var(--space-4) var(--space-8);
  border-radius: var(--ag-radius-6);
  background: var(--ag-badge-transit-bg);
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
  color: var(--color-brand);
}

.address-card__line {
  font-size: var(--fs-20);
  font-weight: var(--fw-regular);
  line-height: var(--lh-loose);
  letter-spacing: var(--ls-20);
  color: var(--color-text-muted);
}

.address-card__actions {
  display: flex;
  align-items: center;
  gap: var(--space-16);
  flex-shrink: 0;
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-16);
}

.address-card__edit { color: var(--color-brand); }
.address-card__delete { color: var(--ag-danger); }
.address-card__edit:hover,
.address-card__delete:hover { opacity: .7; }

/* Кнопка «Добавить адрес» в макете фиксированной ширины 300 (1:3794). */
.address-head__add { width: 300px; }

/* --- Поля адреса приходят из woocommerce_form_field() --------------------
   Woo оборачивает каждое поле в <p class="form-row …"> и <span
   class="woocommerce-input-wrapper">. Сбрасываем их и раскладываем
   в сетку макета: половина ряда или весь ряд. */

.account-row--fields > .form-row { margin: 0; }

.address-form .woocommerce-input-wrapper { display: block; width: 100%; }

.address-form .ag-col--full { grid-column: 1 / -1; }

/* В макете (1:15306) у подписей нет ни звёздочек, ни «(необязательно)» —
   Woo дописывает их сам. Прячем, чтобы подпись совпадала с макетом. */
.address-form .required,
.address-form abbr.required,
.address-form .optional { display: none; }

/* Селект страны: та же коробка, что у инпута, плюс место под стрелку.
   Стрелка нарисована градиентом-«галочкой» — отдельной иконки в макете нет. */
.address-form select.field__input {
  appearance: none;
  height: 54px;
  padding-right: 44px;
  background-image:
    linear-gradient(45deg, transparent 50%, currentColor 50%),
    linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 24px) 24px, calc(100% - 18px) 24px;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}

/* ==========================================================================
   8. УВЕДОМЛЕНИЯ WOO

   Приводим к плашке из макета (1:3147): радиус 12, паддинг 16, 16 Regular.
   ========================================================================== */

.woocommerce-account .woocommerce-message,
.woocommerce-account .woocommerce-error,
.woocommerce-account .woocommerce-info {
  margin: 0 0 var(--space-24);
  padding: var(--space-16);
  border-radius: var(--radius-md);
  background: var(--ag-badge-transit-bg);
  font-size: var(--fs-16);
  font-weight: var(--fw-regular);
  line-height: normal;
  letter-spacing: var(--ls-16);
  color: var(--color-brand);
  list-style: none;
}

.woocommerce-account .woocommerce-error {
  background: var(--ag-error-tint);
  color: var(--color-error);
}

.woocommerce-account .woocommerce-message { background: var(--ag-badge-done-bg); color: var(--color-success); }
.woocommerce-account .woocommerce-message a,
.woocommerce-account .woocommerce-error a,
.woocommerce-account .woocommerce-info a { text-decoration: underline; }

/* Внутри карточки авторизации уведомление уже стоит в потоке формы. */
.auth .woocommerce-message,
.auth .woocommerce-error,
.auth .woocommerce-info { margin-bottom: 0; }

/* woocommerce_output_all_notices() печатает обёртку всегда, даже пустую.
   Как flex-элемент она съедала лишние 16 px зазора между вкладками
   и первым полем — в макете (1:3106) их нет. То же с <div class="clear">,
   который Woo вставляет в форму регистрации. */
.woocommerce-notices-wrapper:empty { display: none; }
.auth__form > div:empty,
.auth__form > .clear,
.auth__form > wc-order-attribution-inputs { display: none; }

/* Текст политики конфиденциальности Woo дублирует чекбокс согласия
   из макета (1:3284) и в макете отдельным абзацем не нарисован.
   Прячем только внутри карточки входа — в оформлении заказа он остаётся. */
.auth .woocommerce-privacy-policy-text { display: none; }

/* ==========================================================================
   9. АДАПТИВ

   В макете нет ни одного экрана уже 1920 px, поэтому пороги приняты
   вёрсткой: ниже них фиксированные колонки таблицы перестают помещаться.
   ========================================================================== */

@media (max-width: 1400px) {
  .ag-orders__col--number { width: 220px; }
  .ag-orders__col--date   { width: 150px; }
  .ag-orders__col--status { width: 190px; }
  .order-item__name  { flex: 1 1 auto; }
  .order-item__qty   { flex: 0 0 110px; }
  .order-item__price { flex: 0 0 150px; }
}

@media (max-width: 1100px) {
  .woocommerce-account .woocommerce { grid-template-columns: minmax(0, 1fr); }
  .account-nav__list { flex-direction: row; flex-wrap: wrap; }
  .account-stat { flex: 1 1 220px; width: auto; }
}

@media (max-width: 900px) {
  /* Строка заказа складывается в две строки: номер + сумма, дата + статус. */
  .ag-orders__head { display: none; }

  .ag-orders__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-8);
  }

  .ag-orders__col--number,
  .ag-orders__col--date,
  .ag-orders__col--status,
  .ag-orders__col--total { width: auto; margin: 0; }

  .ag-orders__col--total { text-align: right; }

  .order-item { flex-wrap: wrap; gap: var(--space-8); }
  .order-item__name { flex: 1 1 100%; }
  .order-item__qty,
  .order-item__price { flex: 0 0 auto; }

  .account-row { grid-template-columns: minmax(0, 1fr); }

  .address-card { flex-direction: column; gap: var(--space-16); }
}

@media (max-width: 700px) {
  .woocommerce-account .page-section { padding-block: var(--space-32) var(--space-64); }
  .auth__card { padding: var(--space-24); }
  .auth__card--tabs { padding-top: 0; }
  .account-card { padding: var(--space-24); }
  .account-hello,
  .account-title { font-size: var(--fs-28); letter-spacing: var(--ls-28); }
  .address-head { flex-direction: column; align-items: stretch; }
  .address-head__add { width: 100%; }
  .auth .field__input { height: 64px; }

  /* Кнопка-таблетка на всю ширину формы: при 24 px подписи «Зарегистрироваться»
     вместе с кругом 56 не влезает в 375 px и даёт горизонтальный скролл. */
  .auth .cta-btn,
  .woocommerce-MyAccount-content .cta-btn {
    gap: var(--space-12);
    padding-left: var(--space-16);
    font-size: var(--fs-18);
  }

  .auth .cta-btn__text,
  .woocommerce-MyAccount-content .cta-btn__text { white-space: normal; }

  .auth .cta-btn__icon,
  .woocommerce-MyAccount-content .cta-btn__icon { width: 44px; height: 44px; }

  .auth .cta-btn__icon svg,
  .woocommerce-MyAccount-content .cta-btn__icon svg { width: 24px; height: 24px; }
}

/* --- Телефон: размеры, не попавшие в блоки выше ---------------------------- */
@media (max-width: 700px) {
  .auth__title,
  .account-stat__value { font-size: var(--fs-24); letter-spacing: var(--ls-24); }

  .account-subtitle,
  .account-section-head__title,
  .order-total { font-size: var(--fs-20); letter-spacing: var(--ls-20); }

  /* Поля входа и кабинета — вровень с остальными формами сайта (52–56). */
  .auth .field__input { height: 56px; font-size: var(--fs-16); }

  .account-form .field__input,
  .address-form .field__input,
  .address-form select.field__input { min-height: 52px; font-size: var(--fs-16); }
}