/*
 * Личный кабинет (PRO) — редизайн по Figma «Тактик - Личный кабинет».
 * Всё скоуплено под .lk, чтобы не конфликтовать с base.css / bootstrap.
 * Токены: navy #27234E, green #28A745, bg #F8F9FA, border #E0E0E0.
 */

.lk {
    --lk-navy: #27234e;
    --lk-navy-dark: #221e43;
    --lk-green: #28a745;
    --lk-green-dark: #1f8e3b;
    --lk-bg: #f8f9fa;
    --lk-card: #fff;
    --lk-border: #e0e0e0;
    --lk-border-soft: #e7e7e7;
    --lk-text: #343a40;
    --lk-muted: #6c757d;
    --lk-muted-2: #666673;

    display: flex;
    align-items: stretch;
    gap: 0;
    /* Верхний отступ положительный: у tactic сразу над контентом идёт панель
       #navbar-main с бургером и меню категорий — отрицательный margin-top
       поднимал .lk под неё, сайдбар налезал на бургер (sites#91 п.4). */
    margin: 1rem -15px 2rem;
    background: var(--lk-bg);
    border: 1px solid var(--lk-border);
    border-radius: 10px;
    overflow: hidden;
    color: var(--lk-text);
    font-size: 14px;
    line-height: 1.4;
}

.lk * {
    box-sizing: border-box;
}

/* ===== Sidebar ===== */
.lk__sidebar {
    flex: 0 0 250px;
    width: 250px;
    background: var(--lk-bg);
    border-right: 1px solid var(--lk-border);
    padding: 24px 0;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.lk-nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.lk-nav__item {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 44px;
    padding: 0 16px;
    position: relative;
    color: var(--lk-text);
    font-weight: 500;
    text-decoration: none;
    transition: background-color .15s ease;
}

.lk-nav__item:hover {
    background: rgba(39, 35, 78, .05);
    color: var(--lk-text);
    text-decoration: none;
}

.lk-nav__item svg {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    stroke: var(--lk-muted);
}

.lk-nav__item.is-active {
    background: var(--lk-card);
    color: var(--lk-navy);
    font-weight: 600;
}

.lk-nav__item.is-active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--lk-navy);
}

.lk-nav__item.is-active svg {
    stroke: var(--lk-navy);
}

/* Заблокированный пункт (гейтинг доступа, R1) */
.lk-nav__item.is-locked {
    opacity: .55;
}
.lk-nav__item.is-locked:hover {
    opacity: .8;
}
.lk-nav__item .lk-nav__lock {
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
    margin-left: auto;
}

/* Действия в модалках гейтинга (вход/после подтверждения) */
.lk-gate__actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}
.lk-gate__actions .lk-modal__submit {
    flex: 1 1 auto;
    min-width: 150px;
}

/* Support block */
.lk-support {
    margin: 0 10px;
    padding: 16px;
    background: #f5f5f5;
    border: 1px solid var(--lk-border-soft);
    border-radius: 8px;
}

.lk-support__title {
    font-weight: 600;
    font-size: 14px;
    color: var(--lk-navy);
    margin: 0 0 4px;
}

.lk-support__hours {
    font-size: 11px;
    color: var(--lk-muted);
    margin: 0 0 12px;
}

.lk-support__phone {
    display: block;
    font-weight: 600;
    font-size: 21px;
    color: var(--lk-green);
    text-decoration: none;
    margin-bottom: 12px;
}

.lk-support__phone:hover {
    color: var(--lk-green-dark);
    text-decoration: none;
}

.lk-support__btn {
    display: block;
    width: 100%;
    padding: 7px 6px;
    background: var(--lk-green);
    color: #fff;
    font-size: 11px;
    text-align: center;
    border: none;
    border-radius: 4px;
    text-decoration: none;
    cursor: pointer;
}

.lk-support__btn:hover {
    background: var(--lk-green-dark);
    color: #fff;
    text-decoration: none;
}

/* ===== Main content ===== */
.lk__main {
    flex: 1 1 auto;
    min-width: 0;
    padding: 40px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.lk__title {
    font-size: 26px;
    font-weight: 700;
    color: var(--lk-navy);
    margin: 0;
}

.lk-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

/* ===== Cards ===== */
.lk-card {
    background: var(--lk-card);
    border: 1px solid var(--lk-border);
    border-radius: 8px;
    padding: 24px;
}

.lk-card__title {
    font-size: 18px;
    font-weight: 700;
    color: var(--lk-navy);
    margin: 0 0 16px;
}

/* Greeting */
.lk-greeting {
    background: var(--lk-navy);
    color: #fff;
    border-radius: 8px;
    padding: 24px;
}

.lk-greeting__title {
    font-size: 22px;
    font-weight: 700;
    margin: 0 0 8px;
}

.lk-greeting__text {
    margin: 0;
    color: rgba(255, 255, 255, .8);
    font-size: 14px;
}

/* Alert (overdue invoices) */
.lk-alert {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 14px 16px;
    background: #fcebeb;
    border: 1px solid #ffcdcd;
    border-radius: 8px;
    color: #d93838;
}

.lk-alert svg {
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    stroke: #d93838;
    margin-top: 1px;
}

.lk-alert__title {
    display: block;
    font-weight: 700;
    margin: 0 0 2px;
}

.lk-alert__text {
    display: block;
    margin: 0;
    color: #a33;
    font-size: 13px;
}

/* ===== Badges ===== */
.lk-badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
}

/* Мягкие бейджи (тон-фон + цветной текст) — как на экранах макета. */
.lk-badge--blue    { background: #e7effc; color: #3875de; }
.lk-badge--amber   { background: #fbefd8; color: #c6871a; }
.lk-badge--purple  { background: #ece9f8; color: #5c47b8; }
.lk-badge--cyan    { background: #e2f3f9; color: #1c86b4; }
.lk-badge--green   { background: #e3f5e9; color: #1f8e3b; }
.lk-badge--gray    { background: #eef0f2; color: #6c757d; }
.lk-badge--red     { background: #fcebeb; color: #d93838; }
.lk-badge--orange  { background: #fdeede; color: #d9701a; }

.lk-badge--soft-green { background: #e3f5e9; color: #1f8e3b; }

.lk-fav-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

@media (max-width: 1100px) {
    .lk-fav-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 575px) {
    .lk-fav-grid { grid-template-columns: 1fr; }
}

/* ===== Dashboard widgets ===== */
.lk-widgets {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.lk-widget__list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.lk-widget__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px;
    background: #f8f9fa;
    border-radius: 6px;
}

.lk-widget__row--start {
    justify-content: flex-start;
    gap: 12px;
}

.lk-widget__row-main {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.lk-widget__row-title {
    font-weight: 600;
    color: var(--lk-navy);
    font-size: 13px;
}

.lk-widget__row-sub {
    font-size: 12px;
    color: var(--lk-muted);
}

.lk-widget__row-heart {
    flex: 0 0 16px;
    width: 16px;
    height: 16px;
    fill: var(--lk-green);
}

.lk-widget__more {
    display: inline-block;
    margin-top: 12px;
    color: var(--lk-green);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

.lk-widget__more:hover {
    color: var(--lk-green-dark);
    text-decoration: none;
}

/* ===== Product grid / recommendations ===== */
.lk-section__title {
    font-size: 20px;
    font-weight: 700;
    color: var(--lk-navy);
    margin: 0 0 16px;
}

.lk-products {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.lk-product {
    display: flex;
    flex-direction: column;
    background: var(--lk-card);
    border: 1px solid var(--lk-border);
    border-radius: 8px;
    overflow: hidden;
}

.lk-product__img {
    display: block;
    aspect-ratio: 1 / 1;
    background: #fff;
    border-bottom: 1px solid var(--lk-border);
    padding: 16px;
}

.lk-product__img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.lk-product__body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px;
    flex: 1 1 auto;
}

.lk-product__art {
    font-size: 12px;
    font-weight: 700;
    color: var(--lk-green);
}

.lk-product__name {
    font-size: 13px;
    font-weight: 600;
    color: var(--lk-navy);
    line-height: 1.3;
    text-decoration: none;
}

.lk-product__name:hover {
    color: var(--lk-navy);
    text-decoration: underline;
}

.lk-product__stock {
    font-size: 12px;
    color: var(--lk-muted);
    margin-top: auto;
}

.lk-product__cart {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin-top: 8px;
    background: var(--lk-navy);
    border: none;
    border-radius: 6px;
    cursor: pointer;
    color: #fff;
}

.lk-product__cart:hover {
    background: var(--lk-navy-dark);
}

.lk-product__cart svg {
    width: 16px;
    height: 16px;
    stroke: #fff;
}

/* ===== Favorites ===== */
.lk-fav-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
}

.lk-fav-count {
    color: var(--lk-muted);
    font-size: 14px;
}

.lk-view-toggle {
    display: inline-flex;
    gap: 4px;
    background: #eceef1;
    border-radius: 8px;
    padding: 4px;
}

.lk-view-toggle button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 30px;
    border: none;
    background: none;
    border-radius: 6px;
    color: var(--lk-muted);
    cursor: pointer;
}

.lk-view-toggle button.is-active {
    background: var(--lk-navy);
    color: #fff;
}

.lk-fav-card {
    display: flex;
    flex-direction: column;
    background: var(--lk-card);
    border: 1px solid var(--lk-border);
    border-radius: 8px;
    overflow: hidden;
}

.lk-fav-card__img {
    display: block;
    aspect-ratio: 1 / 1;
    padding: 16px;
    background: #fff;
    border-bottom: 1px solid var(--lk-border);
}

.lk-fav-card__img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.lk-fav-card__body {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px;
}

.lk-fav-card__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 4px;
}

.lk-stepper {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--lk-border);
    border-radius: 6px;
    overflow: hidden;
}

.lk-stepper button {
    width: 32px;
    height: 32px;
    border: none;
    background: #f8f9fa;
    color: var(--lk-navy) !important;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
}

.lk-stepper input {
    width: 40px;
    height: 32px;
    border: none;
    border-left: 1px solid var(--lk-border);
    border-right: 1px solid var(--lk-border);
    text-align: center;
    font-size: 14px;
}

.lk-trash {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--lk-border);
    background: #fff;
    border-radius: 6px;
    color: var(--lk-muted);
    cursor: pointer;
}

.lk-trash:hover {
    color: #d93838;
    border-color: #f0b6b6;
}

/* Глобальный svg-стиль темы перебивает inline stroke (атрибут слабее CSS) —
   задаём stroke явно для иконок-кнопок ЛК, где stroke шёл inline. */
.lk-trash svg,
.lk-icon-btn svg,
.lk-view-toggle button svg,
.lk-link-btn svg {
    stroke: currentColor;
    fill: none;
}

.lk-trash svg { stroke: #6c757d !important; }
.lk-trash:hover svg { stroke: #d93838 !important; }

/* ===== Buttons ===== */
.lk-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 18px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid transparent;
    cursor: pointer;
}

.lk-btn--navy {
    background: var(--lk-navy);
    color: #fff;
}

.lk-btn--navy:hover {
    background: var(--lk-navy-dark);
    color: #fff;
    text-decoration: none;
}

.lk-btn--green {
    background: var(--lk-green);
    color: #fff;
}

.lk-btn--green:hover {
    background: var(--lk-green-dark);
    color: #fff;
    text-decoration: none;
}

.lk-btn--ghost {
    background: #fff;
    color: var(--lk-navy);
    border-color: var(--lk-border);
}

.lk-btn--ghost:hover {
    background: #f8f9fa;
    color: var(--lk-navy);
    text-decoration: none;
}

/* Легаси-тема задаёт глобальное `button { color:#fff !important }`
   (original/bundle-1.css) — у светлых LK-кнопок, отрендеренных как <button>,
   текст становился белым на белом. Возвращаем задуманный цвет тем же !important
   (специфичность класса 0,1,0 бьёт элементный button 0,0,1). Ссылки <a> с теми
   же классами правило темы не трогает — фикс нужен только для button. */
.lk-btn--ghost,
.lk-btn--ghost:hover,
.lk-link-btn {
    color: var(--lk-navy) !important;
}

.lk-btn--danger-ghost,
.lk-btn--danger-ghost:hover {
    color: #d93838 !important;
}

/* ===== Profile ===== */
.lk-profile-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: start;
}

.lk-profile-col {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.lk-field {
    margin-bottom: 14px;
}

.lk-field:last-child {
    margin-bottom: 0;
}

.lk-field__label {
    display: block;
    font-size: 12px;
    color: var(--lk-muted);
    margin-bottom: 2px;
}

.lk-field__value {
    font-size: 14px;
    font-weight: 600;
    color: var(--lk-text);
}

.lk-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.lk-card__head .lk-card__title {
    margin: 0;
}

.lk-note {
    margin-top: 16px;
    font-size: 12px;
    color: var(--lk-muted);
}

.lk-stack {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.lk-stack .lk-btn,
.lk-stack .logout-form,
.lk-stack .logout-form .lk-btn {
    width: 100%;
}

/* ===== Orders (list) ===== */
.lk-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

.lk-tab {
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    color: var(--lk-muted);
    background: transparent;
    border: 1px solid var(--lk-border);
    text-decoration: none;
    cursor: pointer;
}

.lk-tab.is-active {
    background: var(--lk-navy);
    color: #fff;
    border-color: var(--lk-navy);
}

.lk-order {
    background: var(--lk-card);
    border: 1px solid var(--lk-border);
    border-radius: 8px;
    overflow: hidden;
}

.lk-order__summary {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    cursor: pointer;
    list-style: none;
}

.lk-order__summary::-webkit-details-marker {
    display: none;
}

.lk-order__num {
    font-weight: 700;
    color: var(--lk-navy);
}

.lk-order__date {
    color: var(--lk-muted);
    font-size: 13px;
}

.lk-order__spacer {
    margin-left: auto;
}

.lk-order__body {
    padding: 0 20px 20px;
    border-top: 1px solid var(--lk-border);
}

.lk-order__item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
}

.lk-order__item:last-child {
    border-bottom: none;
}

.lk-order__item-img {
    flex: 0 0 56px;
    width: 56px;
    height: 56px;
    border: 1px solid var(--lk-border);
    border-radius: 6px;
    padding: 4px;
    background: #fff;
}

.lk-order__item-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.lk-order__item-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.lk-order__item-qty {
    margin-left: auto;
    color: var(--lk-muted);
    white-space: nowrap;
}

/* ===== Underline tabs ===== */
.lk-tabs--underline {
    gap: 28px;
    border-bottom: 1px solid var(--lk-border);
    margin-bottom: 24px;
}

.lk-tabs--underline .lk-tab {
    padding: 0 0 12px;
    border: none;
    border-radius: 0;
    background: none;
    color: var(--lk-muted);
    position: relative;
}

.lk-tabs--underline .lk-tab.is-active {
    color: var(--lk-navy);
    background: none;
}

.lk-tabs--underline .lk-tab.is-active::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: var(--lk-navy);
}

/* ===== Search bar ===== */
.lk-search {
    display: flex;
    gap: 12px;
    margin-bottom: 24px;
}

.lk-search__input {
    flex: 1 1 auto;
    padding: 12px 16px;
    border: 1px solid var(--lk-border);
    border-radius: 8px;
    font-size: 14px;
    background: #fff;
}

/* ===== Data table ===== */
.lk-table-wrap {
    background: var(--lk-card);
    border: 1px solid var(--lk-border);
    border-radius: 8px;
    overflow-x: auto;
}

.lk-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.lk-table th {
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    color: var(--lk-muted);
    padding: 16px 20px;
    background: #f8f9fa;
    border-bottom: 1px solid var(--lk-border);
    white-space: nowrap;
}

.lk-table td {
    padding: 16px 20px;
    border-bottom: 1px solid #f0f0f0;
    vertical-align: middle;
}

.lk-table tr:last-child td {
    border-bottom: none;
}

.lk-table__num {
    font-weight: 700;
    color: var(--lk-navy);
}

.lk-table__sum {
    font-weight: 700;
    color: var(--lk-text);
    white-space: nowrap;
}

.lk-table__link {
    color: var(--lk-navy);
    text-decoration: underline;
}

.lk-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: none;
    color: var(--lk-muted);
    cursor: pointer;
}

.lk-icon-btn:hover {
    color: var(--lk-navy);
}

.lk-doc-name {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--lk-navy);
    font-weight: 600;
}

.lk-doc-name svg {
    flex: 0 0 18px;
    stroke: var(--lk-muted);
}

.lk-table__meta {
    color: var(--lk-muted);
}

.lk-table__actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    white-space: nowrap;
}

.lk-link-btn {
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid var(--lk-border);
    color: var(--lk-navy);
    background: #fff;
    cursor: pointer;
}

.lk-link-btn--green {
    background: var(--lk-green);
    color: #fff;
    border-color: var(--lk-green);
}

.lk-link-btn--navy {
    background: var(--lk-navy);
    color: #fff;
    border-color: var(--lk-navy);
}

.lk-link-btn--navy:hover {
    background: var(--lk-navy-dark);
    color: #fff;
}

/* Document banner */
.lk-doc-banner {
    background: var(--lk-navy);
    color: #fff;
    border-radius: 8px;
    padding: 24px;
}

.lk-doc-banner__title {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 8px;
}

.lk-doc-banner__text {
    margin: 0 0 16px;
    color: rgba(255, 255, 255, .8);
    font-size: 14px;
}

.lk-table__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 20px;
    border-top: 1px solid var(--lk-border);
}

.lk-preview-note {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 12px 16px;
    background: #fff7e6;
    border: 1px solid #ffe0a3;
    border-radius: 8px;
    color: #8a6d3b;
    font-size: 13px;
    margin-bottom: 8px;
}

/* ===== Cart PRO (list) ===== */
.lk-cart-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.lk-cart-row {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 16px;
    background: var(--lk-card);
    border: 1px solid var(--lk-border);
    border-radius: 8px;
}

.lk-cart-row__img {
    flex: 0 0 56px;
    width: 56px;
    height: 56px;
    border: 1px solid var(--lk-border);
    border-radius: 6px;
    padding: 4px;
    background: #fff;
}

.lk-cart-row__img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.lk-cart-row__info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1 1 auto;
}

.lk-cart-row__badge {
    flex: 0 0 auto;
    width: 110px;
    text-align: center;
}

.lk-cart-row__qty {
    flex: 0 0 auto;
}

.lk-cart-row .lk-stepper input,
.lk-cart-row .quantity-edit-input {
    width: 54px;
    height: 32px;
    border: none;
    border-left: 1px solid var(--lk-border);
    border-right: 1px solid var(--lk-border);
    text-align: center;
    font-size: 14px;
}

.lk-cart-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 24px;
    flex-wrap: wrap;
}

.lk-cart-actions__spacer {
    margin-left: auto;
}

.lk-btn--danger-ghost {
    background: #fff;
    color: #d93838;
    border-color: #f0c2c2;
}

.lk-btn--danger-ghost:hover {
    background: #fdf2f2;
    color: #d93838;
}

.lk-btn svg {
    stroke: currentColor !important;
    fill: none;
}

@media (max-width: 767px) {
    .lk-cart-row {
        flex-wrap: wrap;
    }

    .lk-cart-row__info {
        flex-basis: 100%;
        order: 2;
    }
}

/* ===== Orders filter bar ===== */
.lk-filter {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 24px;
}

.lk-filter__search {
    flex: 1 1 260px;
    padding: 12px 16px;
    border: 1px solid var(--lk-border);
    border-radius: 8px;
    font-size: 14px;
    background: #fff;
}

.lk-filter__label {
    color: var(--lk-muted);
    font-size: 14px;
}

.lk-filter__date,
.lk-filter__select {
    padding: 12px 14px;
    border: 1px solid var(--lk-border);
    border-radius: 8px;
    font-size: 14px;
    background: #fff;
    color: var(--lk-text);
}

.lk-icon-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid var(--lk-border);
    background: #fff;
    border-radius: 6px;
    color: var(--lk-muted);
    cursor: pointer;
}

.lk-icon-action:hover {
    color: var(--lk-navy);
    border-color: var(--lk-navy);
}

.lk-icon-action svg {
    stroke: currentColor !important;
    fill: none;
}

/* ===== Order details / repeat ===== */
.lk-back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--lk-muted);
    font-size: 14px;
    text-decoration: none;
    margin-bottom: 16px;
}

.lk-back:hover {
    color: var(--lk-navy);
    text-decoration: none;
}

.lk-order-head {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.lk-order-head h1 {
    font-size: 26px;
    font-weight: 700;
    color: var(--lk-navy);
    margin: 0;
}

.lk-order-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: start;
}

.lk-kv {
    display: grid;
    grid-template-columns: 160px 1fr;
    gap: 6px 16px;
    font-size: 14px;
}

.lk-kv dt {
    color: var(--lk-muted);
    font-weight: 400;
    margin: 0;
}

.lk-kv dd {
    color: var(--lk-text);
    font-weight: 600;
    margin: 0;
}

.lk-count-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 4px 0 12px;
}

.lk-count-line__title {
    font-weight: 700;
    color: var(--lk-navy);
    font-size: 16px;
}

.lk-info-note {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 14px 16px;
    background: #eaf3ff;
    border: 1px solid #c7e0ff;
    border-radius: 8px;
    color: #2f5b8f;
    font-size: 14px;
    line-height: 1.5;
}

.lk-info-note svg {
    flex: 0 0 20px;
    stroke: #3875de !important;
    fill: none;
    margin-top: 1px;
}

.lk-check {
    width: 18px;
    height: 18px;
    accent-color: var(--lk-green);
}

.lk-order-note {
    font-size: 13px;
    color: var(--lk-muted);
    margin-top: 12px;
}

/* ===== Legal (agreement) ===== */
.lk-legal h2 {
    font-size: 16px;
    font-weight: 700;
    color: var(--lk-navy);
    margin: 24px 0 8px;
}

.lk-legal h2:first-child {
    margin-top: 0;
}

.lk-legal p {
    font-size: 14px;
    line-height: 1.6;
    color: var(--lk-text);
    margin: 0 0 8px;
}

/* ===== Support modal ===== */
.lk-modal {
    width: 520px;
    max-width: calc(100% - 32px);
    padding: 32px;
    border: none;
    border-radius: 14px;
    box-shadow: 0 15px 40px rgba(0, 0, 0, .15);
    color: var(--lk-text);
}

.lk-modal::backdrop {
    background: rgba(39, 35, 78, .6);
}

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

.lk-modal__title {
    font-size: 22px;
    font-weight: 700;
    color: var(--lk-navy);
    margin: 0;
}

.lk-modal__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 50%;
    background: #f8f9fa !important;
    color: var(--lk-navy) !important;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
}

.lk-modal__field {
    margin-bottom: 16px;
}

.lk-modal__label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--lk-text);
    margin-bottom: 6px;
}

.lk-modal__label span {
    color: #dc3545;
}

.lk-modal__input,
.lk-modal__textarea {
    width: 100%;
    padding: 11px 14px;
    border: 1px solid #cfcfcf;
    border-radius: 6px;
    font-size: 14px;
    color: var(--lk-text);
    background: #fff;
}

.lk-modal__textarea {
    min-height: 100px;
    resize: vertical;
}

.lk-modal__input:focus,
.lk-modal__textarea:focus {
    outline: none;
    border-color: var(--lk-navy);
}

.lk-modal .lk-modal__submit,
button.lk-modal__submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 46px;
    border: none;
    border-radius: 6px;
    background: var(--lk-green) !important;
    color: #fff !important;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    margin-top: 8px;
}

.lk-modal .lk-modal__submit:hover,
button.lk-modal__submit:hover {
    background: var(--lk-green-dark) !important;
}

.lk-modal__notice {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 16px;
    color: var(--lk-muted);
    font-size: 12px;
    text-align: center;
}

.lk-modal__notice svg {
    flex: 0 0 16px;
    stroke: currentColor !important;
    fill: none;
}

/* ===== Empty state ===== */
.lk-empty {
    padding: 40px;
    text-align: center;
    color: var(--lk-muted);
}

/* ===== Pagination ===== */
.lk-pagination {
    display: flex;
    gap: 6px;
    list-style: none;
    padding: 0;
    margin: 8px 0 0;
}

.lk-pagination a,
.lk-pagination span {
    display: inline-flex;
    min-width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    border: 1px solid var(--lk-border);
    border-radius: 6px;
    text-decoration: none;
    color: var(--lk-navy);
}

.lk-pagination .is-active span {
    background: var(--lk-navy);
    color: #fff;
    border-color: var(--lk-navy);
}

/* ===== Responsive ===== */
@media (max-width: 991px) {
    .lk {
        flex-direction: column;
        margin: -1rem 0 2rem;
    }

    .lk__sidebar {
        flex-basis: auto;
        width: 100%;
        border-right: none;
        border-bottom: 1px solid var(--lk-border);
    }

    .lk-nav {
        flex-direction: row;
        flex-wrap: wrap;
        padding: 0 8px;
    }

    .lk-nav__item {
        height: 40px;
    }

    .lk-nav__item.is-active::before {
        display: none;
    }

    .lk-support {
        display: none;
    }

    .lk__main {
        padding: 24px 16px;
        gap: 24px;
    }

    .lk-widgets {
        grid-template-columns: 1fr;
    }

    .lk-products {
        grid-template-columns: repeat(2, 1fr);
    }

    .lk-profile-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575px) {
    .lk-products {
        grid-template-columns: 1fr;
    }
}

/* [hidden] должен скрывать даже элементы с display:flex/grid из .lk-*. */
.lk [hidden],
[hidden].lk-preview-note {
    display: none !important;
}

/* ===== Cart PRO: переключаемые виды (плитка/список/компакт) ===== */
.lk-cart__view { display: none; }
.lk-cart[data-view="list"]    .lk-cart__view--list    { display: flex; flex-direction: column; gap: 10px; }
.lk-cart[data-view="tile"]    .lk-cart__view--tile    { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.lk-cart[data-view="compact"] .lk-cart__view--compact { display: block; }

/* Избранное: плитка в 3 колонки (как в макете favorites). */
.lk-cart--fav[data-view="tile"] .lk-cart__view--tile { grid-template-columns: repeat(3, 1fr); }

@media (max-width: 1200px) { .lk-cart[data-view="tile"] .lk-cart__view--tile { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 900px)  { .lk-cart[data-view="tile"] .lk-cart__view--tile { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .lk-cart[data-view="tile"] .lk-cart__view--tile { grid-template-columns: 1fr; } }

/* ===== Support confirmation modal ===== */
.lk-modal--confirm {
    width: 480px;
    text-align: center;
}

.lk-confirm__check {
    width: 64px;
    height: 64px;
    margin: 0 auto 16px;
    border-radius: 50%;
    background: #2eb059;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lk-confirm__check svg {
    width: 32px;
    height: 32px;
    stroke: #fff !important;
    fill: none;
}

.lk-confirm__title {
    font-size: 22px;
    font-weight: 700;
    color: var(--lk-navy);
    margin: 0 0 6px;
}

.lk-confirm__sub {
    color: var(--lk-muted);
    margin: 0 0 12px;
}

.lk-confirm__text {
    font-size: 14px;
    color: var(--lk-text);
    margin: 0 0 20px;
    line-height: 1.5;
}