/* ============================================================
   BOSRA HOME · ОПТ-ПОРТАЛ — скин «op-torg»
   ------------------------------------------------------------
   Полная перекраска опт-отдела под вид сайта-конкурента op-torg.ru:
   • шрифт Roboto, межбуквенный интервал .025em, текст #333
   • фон #f5f5f5, белые карточки, синяя «админ»-хромировка
   • основной цвет — азур #039be5 (шапка, шапки таблицы, активные пункты)
   • зелёный #5cb85c (кнопка «Оформить», цена за м², звёзды-хиты)
   • бирюзовый #087380 (верхняя кромка карточек, акценты)
   • красный #d9534f (метки)
   Подключается ТОЛЬКО на opt.html, после styles.css — поэтому
   перебивает фирменный «тихий люкс» только в опт-отделе.
   Откат: убрать <link ... opt.css> в opt.html.
   ============================================================ */
:root{
  --ot-blue:#039be5;     /* основной азур */
  --ot-blue-d:#0689c9;   /* тёмный азур (наведение, верхняя полоса) */
  --ot-blue-l:#06abfc;   /* светлый азур */
  --ot-blue-soft:#e6f5fd;/* заливка наведения/строк */
  --ot-blue-fill:#cdeefb;/* заполненная ячейка матрицы */
  --ot-teal:#087380;     /* бирюзовый акцент */
  --ot-ok:#5cb85c;       /* зелёный — действия/хиты */
  --ot-ok-d:#4cae4c;
  --ot-gold:#f0a500;     /* золото — звезда «топ продаж» */
  --ot-dng:#d9534f;      /* красный — метки */
  --ot-bg:#f5f5f5;       /* фон страницы */
  --ot-bar:#e9e9e9;      /* полоса заголовка */
  --ot-txt:#333;         /* текст */
  --ot-txt-2:#777;       /* приглушённый текст */
  --ot-txt-3:#9aa0a6;
  --ot-bd:#e0e0e0;       /* линии */
  --ot-bd-2:#d6dadf;
  --ot-grid:#ccd1d6;     /* тонкие серо-белые линии сетки (как у op-torg / Bootstrap) */
  --ot-cellbg:#eceef0;   /* серый фон ячеек матрицы (как у op-torg, приятнее белого) */
  --ot-cross:#b2b7bc;    /* тёмно-серый крест при наведении (строка+столбец) */
  --ot-square:#eceef0;   /* светло-серый квадрат-инпут */
  --ot-card-sh:rgba(0,0,0,.2) 0 0 4px;
  --ot-font:Roboto,"Helvetica Neue",Arial,sans-serif;
}

/* ---------- база: ТОЛЬКО внутри портала (#chrome-portal).
   Страница регистрации (#chrome-guest) остаётся в старом фирменном стиле BOSRA. ---------- */
#chrome-portal{
  font-family:var(--ot-font)!important;
  background:var(--ot-bg)!important;
  color:var(--ot-txt);
  letter-spacing:.025em;
}
/* засечные заголовки → рубленый Roboto только в портале */
#chrome-portal h1,#chrome-portal h2,#chrome-portal h3,#chrome-portal .disp,
#chrome-portal .prof-name,#chrome-portal .mo-month{
  font-family:var(--ot-font)!important;
  font-weight:500!important;
  letter-spacing:.02em!important;
}
#chrome-portal .opt-screen{color:var(--ot-txt)}

/* поля ввода и кнопки в стиле bootstrap-админки — только в портале */
#chrome-portal .inp{
  background:#fff!important;border:1px solid #ccc!important;border-radius:4px!important;
  color:var(--ot-txt)!important;box-shadow:none!important;
}
#chrome-portal .inp:focus{border-color:var(--ot-blue)!important;box-shadow:0 0 0 2px rgba(3,155,229,.18)!important;outline:none}
#chrome-portal .btn{border-radius:4px!important;letter-spacing:.02em!important;font-weight:500!important;box-shadow:none!important;background:var(--ot-blue);color:#fff}
#chrome-portal .btn::after{display:none!important}
#chrome-portal .btn:hover{background:var(--ot-blue-d);transform:none!important;box-shadow:none!important}
#chrome-portal .btn--w{width:100%}
#chrome-portal .btn--gold{background:var(--ot-ok)!important;color:#fff!important}
#chrome-portal .btn--gold:hover{background:var(--ot-ok-d)!important;transform:none!important;box-shadow:none!important}
#chrome-portal .btn--ghost{background:#fff!important;color:var(--ot-blue)!important;box-shadow:inset 0 0 0 1px var(--ot-blue)!important}
#chrome-portal .btn--ghost:hover{background:var(--ot-blue)!important;color:#fff!important;transform:none!important}
#chrome-portal .btn--blue{background:var(--ot-blue)!important;color:#fff!important;box-shadow:none!important}
#chrome-portal .btn--blue:hover{background:var(--ot-blue-d)!important;color:#fff!important;transform:none!important;box-shadow:none!important}
#chrome-portal .auth-err{border-radius:4px}
#chrome-portal .ic-ok{background:var(--ot-ok)!important;color:#fff!important}

/* ============================================================
   ГОСТЬ (страница регистрации #chrome-guest) — БЕЗ скина op-torg.
   Оставляем фирменный стиль BOSRA «тихая роскошь» из styles.css.
   ============================================================ */

/* ============================================================
   ПОРТАЛ: синяя верхняя полоса
   ============================================================ */
.optbar{background:var(--ot-blue)!important;color:#fff!important;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.optbar .lg{font-family:var(--ot-font)!important;color:#fff!important;font-weight:700;letter-spacing:.1em}
.optbar .lg i{color:#cdeefb!important}
.optbar .lg em{font-family:var(--ot-font)!important;color:#fff!important;background:rgba(255,255,255,.18);padding:3px 9px;border-radius:3px;letter-spacing:.14em;font-size:10px;margin-left:12px}
.ob-ic{color:#fff!important;border-radius:3px}
.ob-ic:hover{background:rgba(255,255,255,.15)!important}
.ob-ic svg{stroke:#fff!important}
/* кнопка-аватар: белый кружок с бизнесменом-«в галстуке» на синей полосе */
#chrome-portal .ob-ava{width:38px!important;height:38px!important;border-radius:50%!important;background:#fff!important;box-shadow:0 1px 4px rgba(0,0,0,.18)}
#chrome-portal .ob-ava:hover{background:#fff!important;box-shadow:0 2px 8px rgba(0,0,0,.26)}
#chrome-portal .ob-ava svg{width:23px!important;height:23px!important;stroke:var(--ot-blue)!important}

/* выпадающее меню пользователя — белая карточка (как у op-torg) */
#chrome-portal .ob-menu{width:278px!important;padding:0!important;border-radius:12px!important;
  box-shadow:0 14px 40px rgba(8,40,66,.18)!important;border:1px solid var(--ot-bd)!important;overflow:hidden}
/* шапка карточки: аватар-бизнесмен + имя + почта */
#chrome-portal .um-head{display:flex;align-items:center;gap:13px;padding:18px 18px 16px;
  background:linear-gradient(180deg,#f3fafe,#fff)}
#chrome-portal .um-ava{flex:0 0 50px;width:50px;height:50px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--ot-blue-l),var(--ot-blue-d));
  box-shadow:0 4px 12px rgba(3,155,229,.32)}
#chrome-portal .um-ava svg{width:30px;height:30px;stroke:#fff}
#chrome-portal .um-id{min-width:0}
#chrome-portal .um-name{color:var(--ot-txt)!important;font-weight:700;font-size:15px;
  letter-spacing:.02em;text-transform:uppercase;line-height:1.2;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#chrome-portal .um-mail{color:var(--ot-txt-2)!important;font-size:12.5px;margin-top:3px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#chrome-portal .um-sep{height:1px;background:var(--ot-bd);margin:0}
/* пункты меню — с иконкой слева */
#chrome-portal .um-item{display:flex!important;align-items:center;gap:11px;width:100%;
  padding:11px 18px!important;margin:0!important;border-radius:0!important;
  font-size:14px;font-weight:500;color:var(--ot-txt)!important;text-align:left;
  transition:background .12s,color .12s}
#chrome-portal .um-item svg{width:18px;height:18px;flex:0 0 18px;stroke:var(--ot-txt-2);transition:stroke .12s}
#chrome-portal .um-item:first-of-type{padding-top:13px!important}
#chrome-portal .um-item:hover{background:var(--ot-blue-soft)!important;color:var(--ot-blue-d)!important}
#chrome-portal .um-item:hover svg{stroke:var(--ot-blue-d)}
/* «Выход» — синяя кнопка (как у op-torg) */
#chrome-portal .um-logout{display:flex!important;align-items:center;justify-content:center;gap:8px;
  width:auto!important;margin:10px 14px 14px!important;padding:11px 14px!important;
  border-radius:8px!important;background:var(--ot-blue)!important;color:#fff!important;
  font-size:13.5px;font-weight:600;letter-spacing:.02em;transition:background .14s}
#chrome-portal .um-logout svg{width:17px;height:17px;stroke:#fff}
#chrome-portal .um-logout:hover{background:var(--ot-blue-d)!important;color:#fff!important}
.opt-note{background:#eaf6ea!important;color:var(--ot-ok-d)!important}

/* ============================================================
   ПОРТАЛ: оболочка и левый каталог (235px, белый)
   ============================================================ */
.opt-shell{background:var(--ot-bg)!important;border-top:none!important}
.opt-side{
  flex:0 0 235px!important;width:235px!important;
  background:#fff!important;border-right:1px solid var(--ot-bd)!important;
}
.opt-side .srch{background:#fff!important;border-bottom:1px solid var(--ot-bd)!important;padding:12px}
.opt-side .srch .inp{font-size:13px;padding:9px 12px;border-radius:4px!important}
/* чипы-фильтры по стране — укорачивают длинное меню каталога */
.opt-side .side-cf{display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px;background:#fff;border-bottom:1px solid var(--ot-bd)}
.opt-side .side-cf:empty{display:none}
.opt-side .cf-chip{border:1px solid var(--ot-bd);background:#fff;color:var(--ot-txt-2);border-radius:999px;padding:5px 12px;font-size:12px;font-weight:500;line-height:1;letter-spacing:.02em;cursor:pointer;transition:background .12s,border-color .12s,color .12s}
.opt-side .cf-chip:hover{border-color:var(--ot-blue);color:var(--ot-blue-d)}
.opt-side .cf-chip.act{background:var(--ot-blue);border-color:var(--ot-blue);color:#fff}
/* кнопка «Мои заказы» вместо чипов стран — полноширинная, в стиле портала */
.opt-side .cf-myorders{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;border-radius:8px;background:var(--ot-blue);border:1px solid var(--ot-blue);color:#fff;padding:9px 12px;font-size:13px;font-weight:600;letter-spacing:.02em;cursor:pointer;transition:background .14s,border-color .14s}
.opt-side .cf-myorders svg{width:17px;height:17px;flex:0 0 17px}
.opt-side .cf-myorders:hover{background:var(--ot-blue-d);border-color:var(--ot-blue-d);color:#fff}
.opt-side .side-title{
  font-family:var(--ot-font)!important;color:var(--ot-txt)!important;
  font-weight:700;letter-spacing:.03em;font-size:18px;padding:14px 14px 8px;
}
.opt-side .side-title .st-cart{stroke:var(--ot-blue)!important;width:24px!important;height:24px!important}
.opt-side .grp{padding:0 6px 18px}

/* страна (раскрывающийся раздел) */
.opt-side .co{
  border-radius:3px;padding:13px 12px;font-size:20px;font-weight:700;
  color:var(--ot-txt)!important;letter-spacing:.02em;text-transform:uppercase;
  border-bottom:1px solid #f0f0f0;
}
.opt-side .co:hover{background:var(--ot-blue-soft)!important;color:var(--ot-blue-d)!important}
.opt-side .co .ar{color:var(--ot-txt-3)!important;font-weight:400}

/* группа внутри страны (Круги / Дорожки) — сворачиваемый под-раздел */
.opt-side .grp-sub{margin-left:14px}
.opt-side .co-sub{
  padding:10px 10px;font-size:15px;font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;color:var(--ot-blue-d)!important;border-bottom:0;
}
.opt-side .co-sub .ar{font-size:15px}

/* список коллекций */
.opt-side ul{border-left:1px solid var(--ot-bd)!important;margin-left:14px;padding-left:4px}
.opt-side ul button{
  font-size:18px;font-weight:500;color:var(--ot-txt)!important;
  border-radius:0 3px 3px 0;padding:11px 10px;
}
.opt-side ul button:hover{background:var(--ot-blue-soft)!important;color:var(--ot-blue-d)!important}
.opt-side ul button.act{background:var(--ot-blue)!important;color:#fff!important;font-weight:500}
.opt-side ul button.act .cnt{color:rgba(255,255,255,.85)!important}
.opt-side ul button.act .hot,.opt-side ul button.act .lowp{color:#fff!important}
.opt-side ul button .hot{color:var(--ot-ok)!important;font-size:21px!important;flex:0 0 23px!important;width:23px!important}   /* большая зелёная звезда-хит */
.opt-side ul button .lowp{color:var(--ot-dng)!important;font-style:normal;font-weight:800;font-size:20px;flex:0 0 21px;width:21px;text-align:center;line-height:1}   /* красный ₽ — низкая цена */
.opt-side ul button .cnt{display:none!important}     /* цифры-счётчики рядом с коллекциями убраны */
/* золотая ★ «топ продаж» — перекрывает зелёную */
.opt-side ul button .hot.gold{color:var(--ot-gold)!important}
.opt-side ul button.act .hot.gold{color:#fff!important}
/* зелёная плашка NEW «новинка» */
.opt-side ul button .optnew{flex:0 0 auto;display:inline-flex;align-items:center;background:var(--ot-ok);color:#fff!important;font-style:normal;font-weight:800;font-size:10px;letter-spacing:.05em;line-height:1;padding:3px 5px;border-radius:3px;margin-right:2px}
.opt-side ul button.act .optnew{background:#fff;color:var(--ot-blue)!important}

/* мобильный селект */
.opt-mobile{background:#fff!important;border-bottom:1px solid var(--ot-bd)!important}
.opt-mobile .sortsel{border:1px solid #ccc!important;border-radius:4px!important;background:#fff!important;padding:10px 12px}

/* ============================================================
   ПОРТАЛ: заголовок коллекции (полоса над матрицей)
   ============================================================ */
.opt-main{background:var(--ot-bg)!important}
.opt-main .chead{
  background:#fff!important;border-bottom:none!important;
  border-top:none!important;padding:13px 20px 0;
  position:relative!important;z-index:8!important;   /* верхний ярус единой примороженной шапки — над списком и над синей шапкой */
}
/* блок «название коллекции + оптовая цена» соединён с сеткой вплотную:
   без синей линии на весь экран — синяя шапка «Размеры/Модели» начинается сразу под названием */
.opt-main .chead h2{font-size:24px!important;color:var(--ot-txt)!important;font-weight:500!important}
.opt-main .chead .m2p{background:var(--ot-ok)!important;color:#fff!important;border-radius:3px!important;font-weight:600}
.opt-main .chead .mt{color:var(--ot-txt-2)!important}
.opt-main .chead .ch-tot b{color:var(--ot-txt)!important}
.opt-main .chead .ch-go{
  background:var(--ot-ok)!important;color:#fff!important;border-radius:4px!important;
  box-shadow:none!important;font-weight:600;
}
.opt-main .chead .ch-go:hover{background:var(--ot-ok-d)!important;filter:none!important;transform:none!important}
.opt-main .chead .ch-go[disabled]{background:#a9d3a9!important}

/* ============================================================
   ПОРТАЛ: «приложение» — страница НЕ дёргается и НЕ уезжает.
   Двигается только список ковров внутри матрицы; коллекция,
   шапка «Размеры/Модели» и каталог слева стоят на месте.
   • overscroll-behavior:contain — колесо мыши не «перетекает»
     со списка ковров на всю страницу (раньше из-за этого сетка
     дёргалась, а сайт уезжал на последних коврах);
   • body.opt-app{overflow:hidden} — на экранах «Главная»/«Каталог»
     сама страница неподвижна (только на десктопе; на телефоне
     раскладка обычная, прокручиваемая).
   ============================================================ */
.opt-tablewrap,.opt-home-main{overscroll-behavior:contain!important}
@media(min-width:921px){
  body.opt-app{overflow:hidden!important}
}

/* ============================================================
   ПОРТАЛ: матрица — сплошная Excel-сетка, как у конкурента
   ============================================================ */
.opt-tablewrap{background:#fff!important;border-top:none}  /* серым остаётся только сама сетка ячеек (см. .opt-t td), вокруг — белое */
.opt-t{font-family:var(--ot-font)!important;border-collapse:separate!important;border-spacing:0!important;border-top:none!important;border-left:1px solid var(--ot-grid)!important;width:max-content!important}  /* width:max-content: таблица ровно по размерам — синяя шапка заканчивается на последнем размере, БЕЗ растяжки на весь экран. Много размеров → шире обёртки → горизонтальная прокрутка внутри .opt-tablewrap (overflow:auto). */

/* --- плотные синие шапки: белый ЖИРНЫЙ текст; линии шапки ОДНОГО цвета по всей ширине --- */
.opt-t th{background:var(--ot-blue)!important;color:#fff!important;letter-spacing:.02em;border-right:1px solid rgba(255,255,255,.32)!important;border-bottom:1px solid rgba(255,255,255,.32)!important}
.opt-t th.mod{background:var(--ot-blue)!important;color:#fff!important;font-weight:700!important}
.opt-t th.szh{
  background:var(--ot-blue)!important;color:#fff!important;
  border-bottom:1px solid rgba(255,255,255,.32)!important;border-left:1px solid rgba(255,255,255,.32)!important;
  font-size:16px!important;font-weight:700!important;letter-spacing:0!important;padding:8px 3px!important;
}
.opt-t th.shh{
  background:#0288c9!important;color:#fff!important;border-right:1px solid rgba(255,255,255,.32)!important;
  font-size:18px!important;font-weight:700!important;letter-spacing:.02em!important;padding:6px 1px!important;
}
/* ЖЁСТКАЯ заморозка двухрядной шапки «Размеры/Модели».
   Раньше sticky висел на самом <thead> — в части браузеров (и при некоторых
   условиях в Chrome) sticky на <thead>/<tr> НЕ держится, и шапка уезжала при
   прокрутке. Теперь sticky стоит НА КАЖДОЙ ЯЧЕЙКЕ <th> — это самый совместимый
   способ, работает во всех браузерах. Высота 1-го ряда шапки постоянна (метки
   «Размеры»/«Модели» + размеры одинаковы на ЛЮБОЙ коллекции), поэтому фиксируем её
   и 2-й ряд прижимаем ровно под 1-м. Шапка стоит намертво при вертикальной
   прокрутке — на любых коллекциях. */
#chrome-portal .opt-t{position:relative}
#chrome-portal .opt-t thead tr:first-child > th{position:sticky!important;top:0!important;height:50px!important;z-index:5} /* верхний ряд (Размеры) — к самому верху */
#chrome-portal .opt-t thead tr:nth-child(2) > th{position:sticky!important;top:50px!important;z-index:5}                  /* нижний ряд (Модели/Пр/Ов) — ровно под верхним */
#chrome-portal .opt-t thead th.mod{left:0!important;z-index:7}                                                          /* углы «Размеры/Модели» стоят и слева при гор. прокрутке */
/* Заголовок коллекции + двухрядная шапка «Размеры/Модели» = ОДИН монолитный примороженный блок.
   Их связывает синяя кромка под названием (тот же азур, что и шапка), а нижний край шапки
   отбрасывает тень на список ковров — поэтому весь верх стоит неподвижно как единая панель,
   а строки-модели уезжают ПОД него. Делается на любой коллекции (правило общее). */
#chrome-portal .opt-t thead tr:nth-child(2) > th,
#chrome-portal .opt-t thead th.szpad{box-shadow:0 7px 8px -5px rgba(2,72,120,.32)!important}
/* добивочный столбец справа: синий в шапке (продолжает монолит), белый-пустой в строках */
.opt-t th.szpad{background:var(--ot-blue)!important;border-right:none!important;width:auto!important;min-width:0!important;padding:0!important}   /* добивочный столбец забирает остаток ширины справа */
.opt-t td.cellpad{background:#fff!important;border-right:none!important;width:auto!important;min-width:0!important;padding:0!important}  /* добивочный столбец справа — белый, не серый */
.opt-t tr.cx-row td.cellpad{background:var(--ot-cross)!important}   /* крест-подсветка строки тянется на всю ширину */
/* подсветка столбца НЕ перекрашивает синие шапки (и текст остаётся белым) */
.opt-t thead th.cx-col,.opt-t thead th.szh.cx-col{background:var(--ot-blue)!important;color:#fff!important}
.opt-t thead th.shh.cx-col{background:#0288c9!important;color:#fff!important}

/* --- сплошная сетка: тонкие голубоватые линии на КАЖДОЙ ячейке.
   зебру убирает само правило .opt-t td (с !important) — отдельное nth-child НЕ добавляем,
   иначе его специфичность перебивает подсветку столбца на чётных строках (крест ломается) --- */
.opt-t td{border-bottom:1px solid var(--ot-grid)!important;border-right:1px solid var(--ot-grid)!important;background:var(--ot-cellbg)!important}

/* модельная ячейка: только код над фото, узкая колонка, чёткая граница до размеров */
.opt-t td.mod{background:var(--ot-blue)!important}     /* колонка моделей — синяя, как шапка */
.opt-t td.mod b{color:#fff!important;font-weight:600}
.opt-t td.mod span{color:rgba(255,255,255,.82)!important}
.opt-t td.mod img{border-radius:4px!important;border:2px solid #fff!important;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.28)!important}
.opt-t th.mod,.opt-t td.mod{min-width:92px!important;max-width:112px;width:92px}
.opt-t td.mod{padding:8px 7px!important;border-right:2px solid #0277b5!important;box-shadow:2px 0 0 #0277b5}
.opt-t th.mod{border-right:2px solid #0277b5!important}     /* вертикальная линия модель|размеры — один цвет сверху донизу */
.opt-t td.mod .in{flex-direction:column!important;align-items:center;gap:6px;text-align:center}
.opt-t td.mod .mcode{font-size:13px;font-weight:700;color:#fff;line-height:1.15;letter-spacing:.02em;word-break:break-word}
.opt-t td.mod img{width:52px!important;height:52px!important;cursor:zoom-in;transition:transform .12s ease}
@media (hover:hover){.opt-t td.mod img:hover{transform:scale(1.12)}} /* зум только на устройствах с мышью — на тач :hover «прилипает» */

/* ---- hover-превью миниатюры ковра: при наведении показываем крупное фото,
        клик открывает полную галерею-слайдшоу (openGallery). На тач-устройствах
        hover не срабатывает — там сразу работает клик. ---- */
.opt-hoverprev{
  position:fixed;z-index:210;pointer-events:none;
  width:340px;max-width:42vw;
  background:#fff;border-radius:12px;padding:7px;
  box-shadow:0 20px 56px rgba(7,40,66,.36),0 3px 10px rgba(7,40,66,.22);
  border:1px solid rgba(255,255,255,.9);
  opacity:0;transform:scale(.94);transform-origin:left center;
  transition:opacity .14s ease,transform .14s ease;
}
.opt-hoverprev.on{opacity:1;transform:scale(1)}
.opt-hoverprev img{display:block;width:100%;height:auto;max-height:72vh;object-fit:contain;border-radius:7px;background:#f3f5f6}
.opt-hoverprev .hp-code{
  position:absolute;top:14px;left:14px;
  background:rgba(2,119,181,.94);color:#fff;font-size:12px;font-weight:700;
  padding:3px 10px;border-radius:6px;letter-spacing:.02em;box-shadow:0 1px 5px rgba(0,0,0,.28);
}
.opt-hoverprev .hp-hint{
  position:absolute;bottom:14px;right:14px;
  display:inline-flex;align-items:center;gap:5px;
  background:rgba(15,28,38,.62);color:#fff;font-size:11px;font-weight:600;
  padding:3px 10px;border-radius:6px;backdrop-filter:blur(2px);
}

/* --- ячейки кол-ва: остаток сверху (зелёным) + квадрат ввода с регулятором ▲▼ ---
   Сверху «горит» зелёный остаток на складе, ниже — белый квадрат, куда оптовик
   вбивает нужное кол-во, и регулятор ▲▼ справа с зазором (не впритык к цифрам). */
.opt-t td.cell{width:62px!important;height:58px!important;padding:4px 3px!important;text-align:center!important;vertical-align:middle!important;position:relative!important}
.opt-t.has-shapes td.cell{width:56px!important}

/* зелёный остаток на складе — всегда виден сверху, по центру над квадратом, жирный */
.opt-t td.cell .stocknum{
  display:block;line-height:1;font-size:14px;font-weight:900;letter-spacing:.01em;
  color:var(--ot-ok)!important;margin:0 0 4px 0;text-align:center;
}

/* строка: столбец [остаток+квадрат] + регулятор справа, разделены зазором (gap) */
.opt-t td.cell .qfield{display:flex;align-items:flex-end;justify-content:center;gap:6px}
/* столбец: зелёный остаток ровно по центру над квадратом ввода */
.opt-t td.cell .qcol{display:flex;flex-direction:column;align-items:center;flex:0 0 auto}

/* белый квадрат, куда оптовик вбивает нужное количество */
.opt-t td.cell input{
  width:30px!important;height:28px!important;flex:0 0 auto;
  border:1px solid #c2c8ce!important;background:#fff!important;border-radius:4px;
  text-align:center;font-size:15px;font-weight:700;color:var(--ot-txt)!important;
}
.opt-t.has-shapes td.cell input{width:27px!important;height:28px!important}
/* убираем родной мини-спиннер number — у нас свой ▲▼ */
.opt-t td.cell input::-webkit-outer-spin-button,
.opt-t td.cell input::-webkit-inner-spin-button{-webkit-appearance:none!important;margin:0!important}
.opt-t td.cell input[type=number]{-moz-appearance:textfield;appearance:textfield}
/* бледная «0» — подсказка, что сюда вводят */
.opt-t td.cell input::placeholder{color:#c0c5cb!important;opacity:1;font-weight:600}

/* регулятор ▲▼ — вертикальная пара кнопок справа от квадрата, с зазором */
.opt-t td.cell .qstep{display:flex;flex-direction:column;gap:3px;flex:0 0 auto}
.opt-t td.cell .qbtn{
  width:17px;height:12px;padding:0;line-height:1;font-size:8px;font-weight:700;
  border:1px solid var(--ot-blue)!important;background:#fff!important;color:var(--ot-blue)!important;
  border-radius:3px;display:flex;align-items:center;justify-content:center;cursor:pointer;
  transition:background .1s ease,color .1s ease;
}
.opt-t td.cell .qbtn:hover{background:var(--ot-blue)!important;color:#fff!important}
.opt-t td.cell .qbtn:active{transform:translateY(.5px)}

.opt-t td.cell input:focus{background:#fff!important;border-color:var(--ot-blue)!important;box-shadow:0 0 0 2px rgba(3,155,229,.28)!important;outline:none}
.opt-t td.cell.filled{background:var(--ot-cellbg)!important}  /* выбранная ячейка — тот же серый фон (без голубого тона за остатком); подсветка только на квадрате ввода */
.opt-t td.cell.filled input{background:#bfe6fb!important;border-color:#5cb8e6!important;color:#0b3a52!important}
.opt-t td.cell .stockhint{display:none!important}
/* нет в наличии: без инпута, еле заметное тире */
.opt-t td.cell.out{background:var(--ot-cellbg)!important;color:#b6bcc2!important;font-size:13px;font-weight:400}

/* --- КРЕСТ при наведении: тёмно-серые строка+столбец.
   специфичность ВЫШЕ, чем у .opt-t td.cell.out (0,3,1) — иначе пустые ячейки рвут крест --- */
.opt-t td.cell.cx-col,
.opt-t tr.cx-row td.cell,
.opt-t td.cell.out.cx-col,
.opt-t tr.cx-row td.cell.out{background:var(--ot-cross)!important}
.opt-t td.cell.out.cx-col,
.opt-t tr.cx-row td.cell.out{color:#7f868d!important}          /* тире видно на сером */
.opt-t tr.cx-row td.mod{background:#0277b5!important}          /* строка-модель: тёмно-синий при наведении (текст белый) */
/* квадраты-инпуты на сером кресте остаются светлыми */
.opt-t td.cell.cx-col input,.opt-t tr.cx-row td.cell input{background:#f4f6f7!important}
/* при наведении (серый крест) зелёный остаток плохо виден → делаем его белым */
.opt-t td.cell.cx-col .stocknum,.opt-t tr.cx-row td.cell .stocknum{color:#fff!important}
.opt-t td.cell.filled.cx-col input,.opt-t tr.cx-row td.cell.filled input{background:#bfe6fb!important}
/* активное пересечение — самый светлый квадрат */
.opt-t tr.cx-row td.cell.cx-col input{background:#fff!important;box-shadow:0 0 0 1px #868c93}

/* плавающая сводка */
.opt-summary{border-radius:6px!important;border:1px solid var(--ot-bd)!important;box-shadow:0 12px 40px rgba(0,0,0,.16)!important;background:#fff!important}
.opt-summary .s b{color:var(--ot-txt)!important}
.opt-summary .s:last-child b{color:var(--ot-ok-d)!important}
.opt-summary .s span{color:var(--ot-txt-3)!important}

/* ============================================================
   ГЛАВНАЯ: карусели топ-коллекций (как у конкурента)
   ============================================================ */
.opt-home{background:var(--ot-bg)}
.opt-home-main{flex:1;min-width:0;overflow-y:auto;overflow-x:hidden;background:var(--ot-bg)}
@media(max-width:920px){.opt-home-main{overflow:visible}}
.opt-home-in{max-width:none;margin:0;padding:18px 24px 56px}
.home-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:4px}
.home-h{font-size:24px;color:var(--ot-txt)!important;font-weight:500!important}
.home-allbtn{background:#fff;border:1px solid var(--ot-blue);color:var(--ot-blue);border-radius:4px;padding:9px 16px;font-size:14px;font-weight:600;white-space:nowrap}
.home-allbtn:hover{background:var(--ot-blue);color:#fff}
.hc{background:#fff;border:1px solid var(--ot-bd);border-top:3px solid var(--ot-blue);border-radius:4px;box-shadow:var(--ot-card-sh);margin-top:18px;padding:14px 16px 16px}
.hc-top{display:flex;align-items:baseline;gap:12px;margin-bottom:12px}
.hc-title{font-family:var(--ot-font);font-size:21px;font-weight:600;color:var(--ot-txt);letter-spacing:.01em}
.hc-title:hover{color:var(--ot-blue)}
.hc-rail{position:relative}
.hc-vp{overflow:hidden}
.hc-track{display:flex;gap:16px;transition:transform .55s cubic-bezier(.4,0,.2,1);will-change:transform}
.hc-card{flex:0 0 230px;width:230px;cursor:pointer}
/* ячейка в пропорции фото (3:4, портрет) + object-fit:cover — ковёр заполняет квадрат во всю ширину, без серых полей и без обреза */
.hc-card img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:8px;border:1px solid #e1e6ea;background:#f4f6f8;display:block;transition:.2s}
.hc-card:hover img{border-color:var(--ot-blue);box-shadow:0 7px 20px rgba(3,155,229,.20);transform:translateY(-2px)}
.hc-nav{position:absolute;top:50%;margin-top:-19px;width:38px;height:38px;border-radius:50%;background:#fff;border:1px solid var(--ot-bd);box-shadow:0 2px 10px rgba(0,0,0,.18);color:var(--ot-blue);font-size:23px;line-height:1;display:flex;align-items:center;justify-content:center;z-index:4}
.hc-nav:hover{background:var(--ot-blue);color:#fff;border-color:var(--ot-blue)}
.hc-prev{left:-12px}.hc-next{right:-12px}
.hc-dots{display:flex;gap:6px;justify-content:center;margin-top:13px;flex-wrap:wrap}
.hc-dots i{width:7px;height:7px;border-radius:50%;background:#cfd6dd;transition:.25s}
.hc-dots i.on{background:var(--ot-blue);width:20px;border-radius:4px}
@media(max-width:920px){.hc-card{flex-basis:180px;width:180px}.hc-card img{height:180px}.hc-nav{display:none}}
/* маркеры в заголовке карусели */
.hc-title{display:inline-flex;align-items:center;gap:9px}
.hc-mk{display:inline-flex;align-items:center;gap:6px}
.hc-mk .hot{color:var(--ot-ok);font-size:20px;line-height:1}
.hc-mk .hot.gold{color:var(--ot-gold)}
.hc-mk .lowp{color:var(--ot-dng);font-weight:800;font-style:normal}
.hc-mk .optnew{background:var(--ot-ok);color:#fff;font-style:normal;font-weight:800;font-size:11px;letter-spacing:.05em;line-height:1;padding:3px 6px;border-radius:3px}
.hc-mk .hot-x{display:none}

/* ============================================================
   ХАБ «НОВОСТИ ДЛЯ ОПТОВИКОВ» — верх Главной (бенто-плитки + лента)
   ============================================================ */
#home-news:empty{display:none}
.nh{margin-top:6px}
.nh-head{display:flex;align-items:baseline;gap:14px;margin:14px 0 12px;flex-wrap:wrap}
.nh-h{font-size:19px;font-weight:600;color:var(--ot-txt);letter-spacing:.01em}
.nh-today{font-size:13px;color:var(--ot-txt-2);text-transform:capitalize}

.nh-bento{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-items:stretch}
.nh-card{background:#fff;border:1px solid var(--ot-bd);border-top:3px solid var(--ot-blue);border-radius:4px;box-shadow:var(--ot-card-sh);padding:16px 18px;display:flex;flex-direction:column;min-width:0}
.nh-card-h{display:flex;align-items:center;gap:10px;margin-bottom:13px}
.nh-ic{width:34px;height:34px;flex:0 0 34px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:var(--ot-blue-soft);color:var(--ot-blue-d)}
.nh-ic svg{width:19px;height:19px}
.nh-ic--new{background:#e9f7ec;color:var(--ot-ok-d)}
.nh-ic--ship{background:#e6f1f3;color:var(--ot-teal)}
.nh-k{font-size:12.5px;font-weight:600;color:var(--ot-txt-2);text-transform:uppercase;letter-spacing:.04em}

/* курс доллара */
.nh-rate-val{font-size:34px;font-weight:700;color:var(--ot-txt);line-height:1;letter-spacing:-.01em}
.nh-rate-val .nh-cur{font-size:20px;font-weight:500;color:var(--ot-txt-2);margin-left:5px}
.nh-soon{font-size:22px;color:var(--ot-txt-3);font-weight:500}
.nh-rate-meta{font-size:12.5px;color:var(--ot-txt-2);margin-top:9px}
.nh-trend{font-weight:700}
.nh-trend.up{color:var(--ot-dng)}
.nh-trend.down{color:var(--ot-ok-d)}
.nh-note{font-size:11.5px;color:var(--ot-txt-3);margin-top:11px;line-height:1.5}

/* новые поступления (кликабельная плитка) */
.nh-arrivals{cursor:pointer;transition:box-shadow .15s,transform .15s,border-color .15s}
.nh-arrivals:hover{box-shadow:0 8px 24px rgba(3,155,229,.14);transform:translateY(-2px)}
.nh-arrivals:focus-visible{outline:2px solid var(--ot-blue);outline-offset:2px}
.nh-arrivals-val{font-size:30px;font-weight:700;color:var(--ot-txt);line-height:1}
.nh-arrivals-val span{font-size:14px;font-weight:500;color:var(--ot-txt-2);margin-left:5px}
.nh-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.nh-chip{font-size:12px;font-weight:600;color:var(--ot-ok-d);background:#e9f7ec;border-radius:999px;padding:4px 10px;line-height:1}
.nh-chip--more{color:var(--ot-txt-2);background:#eef1f4}
.nh-link{margin-top:auto;padding-top:13px;font-size:13px;font-weight:600;color:var(--ot-blue)}
.nh-arrivals:hover .nh-link{color:var(--ot-blue-d)}

/* доставка из Махачкалы — список ТК */
.nh-tk-list{margin-top:1px;display:flex;flex-direction:column;max-height:212px;overflow:auto;overscroll-behavior:contain}
.nh-tk{padding:7px 0;border-bottom:1px solid var(--ot-bd);list-style:none}
.nh-tk:last-child{border-bottom:0}
.nh-tk-main{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.nh-tk-name{font-size:13.5px;font-weight:600;color:var(--ot-txt)}
.nh-tk-tel{font-size:13px;font-weight:600;color:var(--ot-blue);white-space:nowrap}
.nh-tk-tel:hover{color:var(--ot-blue-d)}
.nh-tk-sub{display:flex;align-items:baseline;gap:8px;margin-top:2px}
.nh-tk-sub span{font-size:11px;color:var(--ot-txt-3);line-height:1.35;flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nh-tk-site{font-size:11px;color:var(--ot-teal);white-space:nowrap;flex:0 0 auto}
.nh-tk-site:hover{text-decoration:underline}

/* лента объявлений */
.nh-feed{background:#fff;border:1px solid var(--ot-bd);border-radius:4px;box-shadow:var(--ot-card-sh);margin-top:14px;padding:4px 18px 8px}
.nh-feed-h{font-size:12.5px;font-weight:600;color:var(--ot-txt-2);text-transform:uppercase;letter-spacing:.04em;padding:13px 0 7px;border-bottom:1px solid var(--ot-bd)}
.nh-post{display:flex;align-items:flex-start;gap:14px;padding:14px 0;border-bottom:1px solid var(--ot-bd)}
.nh-post:last-child{border-bottom:0}
.nh-tag{flex:0 0 auto;font-size:10.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;padding:4px 9px;border-radius:4px;line-height:1;margin-top:2px}
.nh-tag.green{background:#e9f7ec;color:var(--ot-ok-d)}
.nh-tag.blue{background:var(--ot-blue-soft);color:var(--ot-blue-d)}
.nh-tag.gold{background:#fdf2d8;color:#b07d00}
.nh-tag.red{background:#fdeceb;color:var(--ot-dng)}
.nh-post-b{flex:1;min-width:0}
.nh-post-t{font-size:14.5px;font-weight:600;color:var(--ot-txt);line-height:1.35}
.nh-pin{margin-right:5px;font-size:12px}
.nh-post-x{font-size:13px;color:var(--ot-txt-2);line-height:1.55;margin-top:4px}
.nh-post-d{flex:0 0 auto;font-size:12px;color:var(--ot-txt-3);white-space:nowrap;margin-top:3px}

/* заголовок-разделитель над каруселями коллекций */
.hc-section-h{display:flex;align-items:center;gap:14px;margin:28px 0 0}
.hc-section-h span{font-size:14px;font-weight:700;color:var(--ot-txt-2);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}
.hc-section-h::after{content:"";flex:1;height:1px;background:var(--ot-bd)}

@media(max-width:920px){
  .nh-bento{grid-template-columns:1fr}
  .nh-tk-list{max-height:none}
  .nh-post{flex-wrap:wrap;gap:8px}
  .nh-post-d{order:-1}
}

/* ============================================================
   ПРОМО-РАЗДЕЛЫ В МЕНЮ «Каталог ковров» (под Китаем):
   РАСПРОДАЖА / СКИДКИ / ЛИКВИДАЦИЯ — сворачиваемые, закрыты по умолчанию.
   Внутри: СТРАНА (.co-pco) → группа (.co-sub) → коллекции — каждый уровень кликабелен.
   ============================================================ */
.opt-side .promo-wrap{border-top:2px solid var(--ot-bd);margin-top:12px;padding-top:4px}
.opt-side .co-promo{border-left:4px solid var(--ot-blue);padding-left:9px;margin-top:4px;border-bottom:0}
.opt-side .co-promo .ar{color:inherit!important;opacity:.6}
.opt-side .co-promo--red{border-left-color:var(--ot-dng);color:var(--ot-dng)!important}
.opt-side .co-promo--green{border-left-color:var(--ot-ok-d);color:var(--ot-ok-d)!important}
.opt-side .co-promo--blue{border-left-color:var(--ot-blue);color:var(--ot-blue-d)!important}
.opt-side .pm-co{margin-left:6px}
.opt-side .co-pco{padding:11px 10px;font-size:16px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ot-txt)!important;border-bottom:0}
.opt-side .co-pco .ar{font-size:15px;color:var(--ot-txt-3)!important}
.opt-side .pm-empty{color:var(--ot-txt-3);font-size:13px;padding:10px 12px}

/* ============================================================
   СТРАНИЦЫ: оформление / заказы / профиль
   ============================================================ */
.opt-page{background:var(--ot-bg)!important}
.page-back{color:var(--ot-blue)!important}
.page-back:hover{color:var(--ot-blue-d)!important}
.page-h{color:var(--ot-txt)!important}
.page-sub{color:var(--ot-txt-2)!important}

/* ===== Оформление заявки — ровная «эксель»-таблица (по эскизу клиента) ===== */
.co-table-wrap{background:#fff!important;border:1px solid var(--ot-grid)!important;border-radius:0!important;border-top:1px solid var(--ot-grid)!important;box-shadow:var(--ot-card-sh)!important}
.co-table{font-family:var(--ot-font)!important}
/* чёткая сетка как в Excel: тонкие голубоватые линии по всем ячейкам, без скруглений */
.co-table--xls{border-collapse:collapse!important;border-spacing:0!important}
.co-table--xls td,.co-table--xls th{border:1px solid var(--ot-grid)!important;border-radius:0!important}
/* верхняя шапка — голубая */
.co-table thead th{background:var(--ot-blue)!important;color:#fff!important;font-weight:600;text-transform:none;letter-spacing:0;font-size:12.5px;border-color:var(--ot-blue-d)!important}
.co-table tbody td{color:var(--ot-txt)!important;background:#fff!important}
.co-table--grouped tbody tr:nth-child(even) td{background:#fff!important}
.ct-sku b{color:var(--ot-txt)!important;font-weight:600}
.ct-sku span{color:var(--ot-txt-3)!important}
/* фото — квадрат */
.co-table .ct-ph{position:relative}
.co-table .ct-ph img{border-radius:2px!important}
/* подытог по коллекции: снизу — завершающая ГОЛУБАЯ линия, без боковых штрихов; крупные голубые суммы */
.co-table--xls .ct-sub td{background:#fff!important;border:0!important;border-top:1px solid var(--ot-grid)!important;padding-top:11px!important;padding-bottom:11px!important;font-weight:700;color:var(--ot-txt)!important;vertical-align:middle}
.co-table .ct-sub-l{text-align:left!important;color:var(--ot-txt)!important;font-weight:700;font-size:14px;text-transform:none;letter-spacing:0}
.co-table .ct-sub .ct-q,.co-table .ct-sub .num{color:var(--ot-txt)!important;font-weight:700;font-size:14px!important;line-height:1.3}
.co-table .ct-sub .ct-sum{color:var(--ot-txt)!important;font-weight:700;font-size:14px!important}
/* заголовок коллекции — мягкая голубая плашка над её коврами (например «Isfahan») */
/* специфичность 0,3,3 — перебивает зебру tr:nth-child(even) (0,2,3), чтобы полоса была голубой у ВСЕХ коллекций, а не через одну */
.co-table--grouped.co-table--xls tbody tr.ct-collhead td{background:var(--ot-blue-soft)!important;border:1px solid var(--ot-grid)!important;text-align:left!important;color:var(--ot-blue-d)!important;font-weight:800;font-size:24px;letter-spacing:.02em;padding:9px 14px!important;text-transform:none}
/* общий итог по заявке — зелёный, отделён зазором от таблицы */
.co-table tfoot tr.ct-grand td{background:var(--ot-ok)!important;color:#fff!important;border:1px solid var(--ot-ok-d)!important;border-top:8px solid #fff!important;font-weight:700;font-size:19px;padding-top:16px!important;padding-bottom:16px!important}
.co-table tfoot tr.ct-grand .ct-foot-l{text-align:left!important;text-transform:none!important;letter-spacing:.01em;font-size:20px;font-weight:800;color:#fff!important}
.co-table tfoot tr.ct-grand .ct-q,.co-table tfoot tr.ct-grand .num{color:#fff!important;font-weight:800;font-size:19px}
.co-table tfoot tr.ct-grand .ct-sum{color:#fff!important;font-weight:900;font-size:21px}
/* колонки 3(Артикул),6,7,8,9,10 — тот же шрифт/размер/цвет, что и 2(Страна); выравнивание не трогаем */
.co-table--xls tbody tr:not(.ct-sub) td:nth-child(3),
.co-table--xls tbody tr:not(.ct-sub) td:nth-child(6),
.co-table--xls tbody tr:not(.ct-sub) td:nth-child(7),
.co-table--xls tbody tr:not(.ct-sub) td:nth-child(8),
.co-table--xls tbody tr:not(.ct-sub) td:nth-child(9),
.co-table--xls tbody tr:not(.ct-sub) td:nth-child(10),
.co-table--xls tbody tr:not(.ct-sub) td:nth-child(3) b,
.co-table--xls tbody tr:not(.ct-sub) td:nth-child(9) input{font-family:var(--ot-font)!important;font-size:24px!important;font-weight:400!important;color:var(--ot-txt)!important}
/* крупнее весь текст таблицы заявки (≈×2), КРОМЕ «Оформление заявки» (заголовок страницы) и зелёного «Итого по заявке:» (tfoot .ct-grand — не трогаем) */
.co-table--xls tbody tr:not(.ct-sub):not(.ct-collhead) td,
.co-table--xls tbody tr:not(.ct-sub):not(.ct-collhead) td b,
.co-table--xls tbody tr:not(.ct-sub):not(.ct-collhead) td input{font-size:24px!important}
.co-table--xls thead th{font-size:17px!important}
.co-table .ct-sub-l,.co-table .ct-sub .ct-q,.co-table .ct-sub .num,.co-table .ct-sub .ct-sum{font-size:24px!important}
.cl-step{font-size:20px!important}
.co-table--grouped tbody tr:hover td{background:var(--ot-blue-soft)!important}
.ct-sum{color:var(--ot-txt)!important}
.ct-qty input{border:1px solid var(--ot-bd-2)!important;border-radius:3px!important}
.cl-step{background:#fff!important;border:1px solid var(--ot-bd-2)!important;color:var(--ot-blue)!important;border-radius:3px}
.cl-step:hover{background:var(--ot-blue)!important;color:#fff!important}
.cl-rm{color:var(--ot-dng)!important}

/* мои заказы */
.mo-srch .inp{border:1px solid #ccc!important;border-radius:4px!important}
.mo-count{color:var(--ot-txt-2)!important}
.mo-month{color:var(--ot-txt)!important;font-weight:500}
.mo-card{background:#fff!important;border:1px solid var(--ot-bd)!important;border-radius:4px!important;box-shadow:none!important}
.mo-head b{color:var(--ot-txt)!important}
.mo-when,.mo-facts{color:var(--ot-txt-2)!important}
.mo-sum{color:var(--ot-txt)!important;font-weight:600}
.mo-chev{color:var(--ot-txt-3)!important}
.mo-xls{color:var(--ot-blue)!important;border:1px solid var(--ot-blue)!important;border-radius:4px;background:#fff!important}
.mo-xls:hover{background:var(--ot-blue)!important;color:#fff!important}
/* статусы заявок */
.mo-st{border-radius:3px!important;font-weight:500}
.mo-st--новая{background:#e6f5fd!important;color:var(--ot-blue-d)!important}
.mo-st--в-работе,.mo-st--подтверждена{background:#eaf6ea!important;color:var(--ot-ok-d)!important}
.mo-st--отклонена,.mo-st--отменена{background:#fdeceb!important;color:var(--ot-dng)!important}

/* профиль */
.prof-card{background:#fff!important;border:1px solid var(--ot-bd)!important;border-radius:4px!important;border-top:3px solid var(--ot-teal)!important;box-shadow:none!important}
.prof-ava{background:var(--ot-blue)!important;color:#fff!important}
.prof-name{color:var(--ot-txt)!important}
.prof-mail{color:var(--ot-txt-2)!important}
.prof-badge{background:#e6f5fd!important;color:var(--ot-blue-d)!important;border-radius:3px}
.prof-badge.ok{background:#eaf6ea!important;color:var(--ot-ok-d)!important}
.prof-title{color:var(--ot-txt)!important}
.prof-dl dt,.pf-row dt{color:var(--ot-txt-3)!important}
.prof-dl dd,.pf-row dd{color:var(--ot-txt)!important}
.prof-link{color:var(--ot-blue)!important}
.pf-order{border-color:var(--ot-bd)!important}
.pf-order b{color:var(--ot-txt)!important}
.pf-order span{color:var(--ot-txt-2)!important}

/* ===== Профиль оптовика (структура как у op-torg) ===== */
#chrome-portal .opt-page-wide{max-width:1200px}
#chrome-portal .prof-grid{grid-template-columns:300px 1fr;align-items:start;margin-bottom:0}
#chrome-portal .prof-aside,#chrome-portal .prof-main{display:flex;flex-direction:column;gap:18px;margin:0}
@media(max-width:820px){#chrome-portal .prof-grid{grid-template-columns:1fr}}
#chrome-portal .prof-card{padding:20px 22px}
#chrome-portal .prof-id{padding:24px 22px}
#chrome-portal .prof-title{font-family:inherit!important;font-size:16px;font-weight:700;margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid var(--ot-bd)}
#chrome-portal .prof-card-head{margin-bottom:14px;border-bottom:1px solid var(--ot-bd);padding-bottom:10px}
#chrome-portal .prof-card-head .prof-title{border:0;margin:0;padding:0}

/* блок «Параметры» — пункты-ссылки */
.prof-params .prof-title{margin-bottom:8px}
.prof-param{display:flex;align-items:center;gap:11px;width:100%;background:none;border:0;border-radius:6px;padding:10px;font:inherit;font-size:14px;color:var(--ot-blue)!important;cursor:pointer;text-align:left;transition:background .12s}
.prof-param svg{width:18px;height:18px;flex:none}
.prof-param:hover{background:var(--ot-blue-soft)}
.prof-param--exit{color:var(--ot-dng)!important;margin-top:4px}
.prof-param--exit:hover{background:#fdeceb}

/* «Данные пользователя» / «Карточка клиента» — двухколоночная сетка ярлык+значение */
.pf-cols{display:grid;grid-template-columns:1fr 1fr;gap:0 32px}
@media(max-width:560px){.pf-cols{grid-template-columns:1fr}}
.pf-cell{display:flex;flex-direction:column;gap:3px;padding:11px 0;border-bottom:1px solid var(--ot-bd);min-width:0}
.pf-k{font-size:12px;font-weight:700;color:var(--ot-blue)!important;letter-spacing:.01em}
.pf-v{font-size:14px;color:var(--ot-txt);word-break:break-word}
.pf-empty{color:var(--ot-txt-3);font-style:normal}

/* таблица «Последние заказы» */
.pf-otab-wrap{overflow-x:auto}
.pf-otab{width:100%;border-collapse:collapse;font-size:13.5px}
.pf-otab th{background:var(--ot-blue);color:#fff;font-weight:600;text-align:left;padding:10px 12px;white-space:nowrap}
.pf-otab th:first-child{border-top-left-radius:4px}.pf-otab th:last-child{border-top-right-radius:4px}
.pf-otab td{padding:11px 12px;border-bottom:1px solid var(--ot-bd);color:var(--ot-txt);vertical-align:middle}
.pf-otab tbody tr:hover{background:var(--ot-blue-soft)}
.pf-otd-num{font-weight:600}
.pf-coll{display:inline-block;background:var(--ot-ok);color:#fff;border-radius:3px;padding:3px 8px;font-size:12px;font-weight:600;line-height:1.3;white-space:nowrap}
.pf-coll-more{color:var(--ot-txt-2);font-size:12px}
.pf-otd-eye{width:1%;text-align:center}
.pf-eye{background:none;border:0;cursor:pointer;color:var(--ot-blue);padding:4px;line-height:0}
.pf-eye svg{width:18px;height:18px}
.pf-eye:hover{color:var(--ot-blue-d)}
.pf-otab-foot{margin:14px 0 0;font-size:13px;color:var(--ot-txt-2);background:var(--ot-blue-soft);padding:10px 12px;border-radius:4px}
.pf-otab-foot .prof-link{background:none;border:0;cursor:pointer;font:inherit;font-weight:600;padding:0}

/* ===== Формы редактирования (свои данные / карточка / пароль) ===== */
.opt-form{max-width:720px;background:#fff;border:1px solid var(--ot-bd);border-top:3px solid var(--ot-teal);border-radius:4px;padding:24px 26px}
.opt-form .field{margin-bottom:16px}
.opt-form .field label i{color:var(--ot-dng);font-style:normal}
.opt-radio{display:flex;gap:22px;flex-wrap:wrap;padding-top:2px}
.opt-radio label{display:flex;align-items:center;gap:7px;font-size:14px;color:var(--ot-txt);text-transform:none;letter-spacing:0;font-weight:400;cursor:pointer}
.opt-radio input{width:16px;height:16px;accent-color:var(--ot-blue)}
.opt-form-sep{border:0;border-top:1px solid var(--ot-bd);margin:6px 0 18px}
.opt-form-acts{display:flex;gap:10px;margin-top:6px}
.optreg-hint{font-size:12.5px;color:var(--ot-txt-2);margin:-4px 0 14px;line-height:1.5}

/* лайтбокс подписи */
.lbx .cap{color:#fff}

/* футер оставляем в фирменном стиле BOSRA (без переопределения) */