/* =====================================================================
   ETP-redesign.css — переопределение Naumen-классов под дизайн-систему
   Спецтендер v2.5.0 + новые .etp-* helper-классы.
   Подключается ПОСЛЕ design-system.css, default.css, env.css, inner.css,
   scrollbar.css, add.css — наш каскад выигрывает по порядку.
   Стратегия "без инжекта" — этот файл просто в /etp/css/ как остальные.
   ===================================================================== */

/* === Глобальная типографика === */
body, html, td, th, input, select, textarea, button {
  font-family: var(--font-body) !important;
  color: var(--ink-1000);
  background-color: var(--surface-page);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body.etp-redesign h1,
body.etp-redesign h2,
body.etp-redesign h3,
body.etp-redesign h4,
body.etp-redesign .header-section-title {
  font-family: var(--font-display) !important;
  letter-spacing: -0.01em;
  color: var(--ink-1000);
}
body.etp-redesign {
  font-size: 15px;
  line-height: 1.5;
}
body.etp-redesign a {
  color: var(--brand-blue-500);
  text-decoration: none;
  transition: color 160ms;
}
body.etp-redesign a:hover { color: var(--brand-blue-700); text-decoration: underline; }
body.etp-redesign a:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus);
  border-radius: var(--r-xs);
}

/* === Skip-link === */
.etp-skip-link {
  position: absolute; top: -100px; left: 0;
  background: var(--brand-blue-500); color: #fff !important;
  padding: var(--space-3) var(--space-5);
  border-radius: 0 0 var(--r-md) 0;
  font-weight: 600;
  z-index: 10000;
  text-decoration: none !important;
}
.etp-skip-link:focus { top: 0; outline: none; color: #fff !important; }

/* === Wrapper / layout === */
body.etp-redesign #wrapper { background: var(--surface-page); min-height: 100vh; }
body.etp-redesign .wrapper {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--space-5);
}
@media (min-width: 768px) {
  body.etp-redesign .wrapper { padding: 0 var(--space-7); }
}
@media (min-width: 1280px) {
  body.etp-redesign .wrapper { padding: 0 var(--space-8); }
}

/* === HEADER (navy-800, sticky) === */
body.etp-redesign .header {
  background: var(--navy-800) !important;
  color: #fff !important;
  border-bottom: 0;
}
body.etp-redesign .header.mini {
  position: fixed; top: 0; left: 0; right: 0; z-index: 900;
  background: var(--navy-800) !important;
  box-shadow: var(--shadow-md);
  transform: translateY(-100%);
  transition: transform 240ms ease;
}
body.etp-redesign .header.mini.slideDown { transform: translateY(0); }

body.etp-redesign .header__wrapper {
  max-width: 1280px;
  margin: 0 auto;
  padding: var(--space-4) var(--space-5);
  display: flex; align-items: center; gap: var(--space-5);
  flex-wrap: wrap;
}
@media (min-width: 768px) {
  body.etp-redesign .header__wrapper { padding: var(--space-4) var(--space-7); }
}

body.etp-redesign .h-light {
  display: flex; align-items: center; gap: var(--space-7); width: 100%;
  flex-wrap: wrap;
}

/* Logo block */
body.etp-redesign .h-logo a {
  display: inline-block;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.125rem;
  color: #fff !important;
  text-decoration: none !important;
}
body.etp-redesign .h-logo a:hover { color: var(--brand-blue-200) !important; }
body.etp-redesign .hl-hidden {
  position: absolute; left: -10000px; width: 1px; height: 1px;
  overflow: hidden;
}
body.etp-redesign .h-logo a::before {
  content: 'СПЕЦТЕНДЕР';
  display: inline-block;
}

/* Section info (для personal section) */
body.etp-redesign .h-section .hs-link {
  color: #fff !important;
  display: inline-flex; align-items: center; gap: var(--space-3);
  padding: var(--space-2) var(--space-3);
  background: rgba(255,255,255,0.08);
  border-radius: var(--r-sm);
}

/* Server time */
body.etp-redesign .h-time__wrapper {
  display: flex; align-items: center; gap: var(--space-4);
  font-family: var(--font-mono);
  color: rgba(255,255,255,0.85);
  font-size: 0.8125rem;
}
body.etp-redesign .h-time__wrapper_wrapper { display: contents; }
body.etp-redesign .h-time::before {
  content: 'Сервер';
  display: inline-block;
  margin-right: var(--space-3);
  text-transform: uppercase;
  font-size: 0.6875rem;
  letter-spacing: 0.06em;
  opacity: 0.7;
}
body.etp-redesign .ht-num {
  display: inline-flex; align-items: center; gap: var(--space-1);
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: 0.9375rem;
}
body.etp-redesign .htn-item { display: inline-flex; align-items: center; }
body.etp-redesign .htn-line {
  display: inline-block;
  width: 1px; height: 12px;
  background: rgba(255,255,255,0.3);
  margin: 0 var(--space-2);
}
body.etp-redesign .htn-item:first-child .htn-line { display: none; }
body.etp-redesign .htn-text { color: #fff; }
body.etp-redesign .ht-location {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  opacity: 0.7;
  margin-left: var(--space-3);
}

/* Contacts */
body.etp-redesign .h-contacts {
  display: flex; gap: var(--space-5);
  margin-left: auto;
  font-size: 0.8125rem;
  color: rgba(255,255,255,0.95);
  flex-wrap: wrap;
}
body.etp-redesign .hc-phone,
body.etp-redesign .hc-code,
body.etp-redesign .h-operator { display: inline-flex; align-items: center; gap: var(--space-2); }
body.etp-redesign .hc-phone a { color: #fff !important; font-weight: 600; }
body.etp-redesign .ho-text { color: rgba(255,255,255,0.7); }

/* === H-DARK (nav bar background) === */
body.etp-redesign .h-dark {
  background: #fff;
  border-bottom: 1px solid var(--border-default);
}
body.etp-redesign .h-dark_left { display: none; }
body.etp-redesign .h-date { display: none; }   /* дата не показываем, время в header */

/* === MAIN NAV === */
body.etp-redesign .h-menu { width: 100%; }
body.etp-redesign .hm-list {
  list-style: none;
  margin: 0; padding: var(--space-2) 0;
  display: flex; gap: var(--space-2);
  flex-wrap: wrap;
}
body.etp-redesign .hm-item {
  position: relative;
  margin: 0;
}
body.etp-redesign .hm-link {
  display: inline-flex; align-items: center;
  padding: var(--space-3) var(--space-4);
  border-radius: var(--r-sm);
  color: var(--ink-700) !important;
  font-size: 0.875rem;
  font-weight: 500;
  text-decoration: none !important;
  white-space: nowrap;
  min-height: 40px;
}
body.etp-redesign .hm-link:hover {
  background: var(--ink-100);
  color: var(--ink-1000) !important;
}
body.etp-redesign .hm-item:hover > .hm-sub {
  display: block;
}
body.etp-redesign .hm-sub {
  display: none;
  position: absolute;
  top: 100%; left: 0;
  min-width: 240px;
  background: #fff;
  border: 1px solid var(--border-default);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-md);
  padding: var(--space-3);
  list-style: none;
  margin: var(--space-2) 0 0;
  z-index: 800;
}
body.etp-redesign .hm-sub li {
  display: block;
  padding: 0;
  margin: 0;
}
body.etp-redesign .hm-sub li a {
  display: block;
  padding: var(--space-3) var(--space-4);
  border-radius: var(--r-sm);
  color: var(--ink-700) !important;
  font-size: 0.875rem;
  text-decoration: none !important;
}
body.etp-redesign .hm-sub li a:hover {
  background: var(--brand-blue-050);
  color: var(--brand-blue-700) !important;
}
body.etp-redesign .hm-caption {
  display: block;
  font-size: 0.6875rem;
  text-transform: uppercase;
  color: var(--ink-400);
  padding: var(--space-3) var(--space-4) var(--space-2);
  letter-spacing: 0.06em;
}

/* === HEADER-SECTION (breadcrumbs + page title) === */
body.etp-redesign .header-section {
  background: linear-gradient(135deg, var(--brand-blue-050) 0%, var(--surface-card) 100%);
  padding: var(--space-7) 0;
}
body.etp-redesign .header-section.empty { display: none; }
body.etp-redesign .header-section-container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--space-5);
}
@media (min-width: 768px) {
  body.etp-redesign .header-section-container { padding: 0 var(--space-7); }
}
@media (min-width: 1280px) {
  body.etp-redesign .header-section-container { padding: 0 var(--space-8); }
}
body.etp-redesign .breadcrumbs-menu {
  list-style: none; margin: 0 0 var(--space-4); padding: 0;
  display: flex; flex-wrap: wrap; gap: var(--space-2);
  font-size: 0.8125rem;
}
body.etp-redesign .breadcrumbs-item { display: inline-block; }
body.etp-redesign .breadcrumbs-separator {
  display: inline-block;
  color: var(--ink-400);
  padding: 0 var(--space-1);
}
body.etp-redesign .breadcrumbs-link {
  color: var(--ink-500) !important;
}
body.etp-redesign .breadcrumbs-link:hover { color: var(--brand-blue-700) !important; }
body.etp-redesign .header-section-title {
  font-size: 1.75rem;
  margin: 0;
  color: var(--ink-1000);
}
@media (min-width: 768px) {
  body.etp-redesign .header-section-title { font-size: 2.25rem; }
}

/* === CONTENT LAYOUT (table → flex) === */
body.etp-redesign #content_table {
  width: 100%;
  border-collapse: collapse;
  margin: var(--space-7) 0;
}
body.etp-redesign #content_table > tbody > tr,
body.etp-redesign #content_table > tr { display: flex; gap: var(--space-7); flex-wrap: wrap; }
body.etp-redesign .ct-cell.ct-left {
  flex: 0 0 100%;
  display: block;
  padding: 0;
}
body.etp-redesign .ct-cell:not(.ct-left) {
  flex: 1 1 100%;
  display: block;
  padding: 0;
}
@media (min-width: 1280px) {
  body.etp-redesign .ct-cell.ct-left { flex: 0 0 280px; }
  body.etp-redesign .ct-cell:not(.ct-left) { flex: 1 1 0; min-width: 0; }
}

body.etp-redesign .content_indent { padding: 0; }

/* === LEFT SIDE (login / personal account) === */
body.etp-redesign .left_side {
  background: var(--surface-card);
  border: 1px solid var(--border-subtle);
  border-radius: var(--r-md);
  padding: var(--space-5);
  box-shadow: var(--shadow-xs);
  font-size: 0.875rem;
}
body.etp-redesign .left_side .title {
  font-family: var(--font-display);
  font-size: 0.875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ink-800);
  margin-bottom: var(--space-4);
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--border-subtle);
}
body.etp-redesign .left_side hr {
  border: 0;
  border-top: 1px solid var(--border-subtle);
  margin: var(--space-3) 0;
}

/* === LOGIN FORM (.login_form / .spf-*) === */
body.etp-redesign .login_form { margin-bottom: var(--space-5); }
body.etp-redesign .separate_form { margin-top: var(--space-3); }
body.etp-redesign .spf-tabs {
  display: flex;
  gap: var(--space-2);
  margin-bottom: var(--space-4);
  border-bottom: 1px solid var(--border-subtle);
  padding-bottom: 0;
}
body.etp-redesign .spf-tab {
  padding: var(--space-3) var(--space-4);
  color: var(--ink-500) !important;
  font-size: 0.8125rem;
  font-weight: 500;
  text-decoration: none !important;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}
body.etp-redesign .spf-tab:hover { color: var(--ink-1000) !important; }
body.etp-redesign .spf-tab_cur {
  color: var(--brand-blue-700) !important;
  border-bottom-color: var(--brand-blue-500);
}
body.etp-redesign .spf-content { display: flex; flex-direction: column; gap: var(--space-4); }
body.etp-redesign .spf-line { display: flex; flex-direction: column; gap: var(--space-2); }
body.etp-redesign .spf-label {
  font-size: 0.75rem;
  color: var(--ink-600);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
body.etp-redesign .spf-input {
  border: 1px solid var(--border-default);
  border-radius: var(--r-sm);
  background: #fff;
  padding: 0;
  transition: border-color 160ms, box-shadow 160ms;
}
body.etp-redesign .spf-input:focus-within {
  border-color: var(--brand-blue-500);
  box-shadow: var(--shadow-focus);
}
body.etp-redesign .spf-input input {
  border: 0 !important;
  outline: none !important;
  background: transparent !important;
  padding: var(--space-3) var(--space-4) !important;
  font-size: 0.875rem !important;
  width: 100% !important;
  color: var(--ink-1000) !important;
  font-family: var(--font-body) !important;
  min-height: 40px;
}
body.etp-redesign .spf-login-input { padding: 0; }
body.etp-redesign .login-button-panel {
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: center;
  margin-top: var(--space-3);
}
body.etp-redesign .spf-bottom {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin-top: var(--space-3);
  padding-top: var(--space-3);
  border-top: 1px solid var(--border-subtle);
  font-size: 0.8125rem;
}
body.etp-redesign .spf-reg a,
body.etp-redesign .spf-pass_recovery a { color: var(--brand-blue-600) !important; }

/* Buttons (.rec-go) */
body.etp-redesign .rec-go {
  display: inline-flex !important;
  align-items: center;
  background: var(--brand-blue-500) !important;
  color: #fff !important;
  padding: 0 var(--space-5) !important;
  border-radius: var(--r-sm) !important;
  font-weight: 600 !important;
  font-size: 0.8125rem !important;
  cursor: pointer;
  text-decoration: none !important;
  min-height: 40px;
  border: 0;
  position: relative;
  transition: background-color 160ms, transform 160ms;
  white-space: nowrap;
}
body.etp-redesign .rec-go:hover { background: var(--brand-blue-600) !important; }
body.etp-redesign .rec-go:active { transform: translateY(1px); }
body.etp-redesign .rec-go.grey { background: var(--ink-200) !important; color: var(--ink-1000) !important; }
body.etp-redesign .rec-go.grey:hover { background: var(--ink-300) !important; }
body.etp-redesign .rec-go.left { margin-right: var(--space-2); }
body.etp-redesign .rec-go .invisible_input {
  position: absolute; inset: 0;
  opacity: 0;
  cursor: pointer;
  border: 0;
  background: transparent;
  width: 100%; height: 100%;
}

/* Block dividers */
body.etp-redesign .block-margin-bottom { margin-bottom: var(--space-5); }
body.etp-redesign .line-margin-bottom { margin-bottom: var(--space-3); }
body.etp-redesign .etpp-small {
  font-size: 0.75rem;
  color: var(--ink-500);
  margin-top: var(--space-1);
}

/* === MAIN CONTENT (page content area) === */
body.etp-redesign .content_indent h1 {
  font-size: 1.75rem;
  margin: 0 0 var(--space-5);
  color: var(--ink-1000);
}
@media (min-width: 768px) {
  body.etp-redesign .content_indent h1 { font-size: 2.25rem; }
}

/* Flash error (login-error-red) */
body.etp-redesign .login-error,
body.etp-redesign .login-error-red {
  background: var(--danger-100);
  color: var(--danger-700);
  border: 1px solid var(--danger-500);
  border-radius: var(--r-md);
  padding: var(--space-4) var(--space-5);
  margin-bottom: var(--space-4);
  font-size: 0.875rem;
  position: relative;
}
body.etp-redesign .login-error-red { background: var(--danger-100); }

/* === FOOTER === */
body.etp-redesign .footer_wrap {
  background: var(--surface-card);
  border-top: 1px solid var(--border-subtle);
  margin-top: var(--space-10);
  padding: var(--space-7) 0;
}
body.etp-redesign .footer {
  text-align: center;
}
body.etp-redesign .f-copy {
  font-size: 0.8125rem;
  color: var(--ink-500);
  line-height: 1.6;
}
body.etp-redesign .f-copy a { color: var(--ink-700) !important; }
body.etp-redesign .f-copy a:hover { color: var(--brand-blue-700) !important; }

/* === Modal window === */
body.etp-redesign #win,
body.etp-redesign #certificatesList {
  background: var(--surface-card);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-lg);
  padding: 0;
}
body.etp-redesign .win_title {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1.125rem;
  padding: var(--space-5);
  border-bottom: 1px solid var(--border-subtle);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
body.etp-redesign .win_content { padding: var(--space-5); }
body.etp-redesign .exit {
  color: var(--ink-500) !important;
  text-decoration: none !important;
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r-sm);
}
body.etp-redesign .exit:hover { background: var(--ink-100); }
body.etp-redesign .exit::before { content: '×'; font-size: 1.5rem; line-height: 1; }

/* === icon classes (decoration) === */
body.etp-redesign .white_cross_icon {
  display: inline-block;
  width: 16px; height: 16px;
  position: relative;
}
body.etp-redesign .white_cross_icon::before {
  content: '×'; color: #fff; font-size: 1.25rem; line-height: 0.5;
}

/* === BANNERS (правый бок) === */
body.etp-redesign .left_side img {
  border-radius: var(--r-md) !important;
  border: 1px solid var(--border-subtle) !important;
}

/* === SCROLLBAR custom (jScrollPane) — оставляем как есть, мы их CSS не трогаем === */
/* === GWT widgets — выборочный override === */
body.etp-redesign .gwt-Button,
body.etp-redesign .gwt-SubmitButton,
body.etp-redesign input.gwt-Button {
  background: var(--brand-blue-500) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: var(--r-sm) !important;
  padding: var(--space-3) var(--space-5) !important;
  font-family: var(--font-body) !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important;
  cursor: pointer;
  min-height: 40px;
}
body.etp-redesign .gwt-Button:hover { background: var(--brand-blue-600) !important; }

body.etp-redesign .gwt-TextBox,
body.etp-redesign .gwt-TextArea,
body.etp-redesign .gwt-ListBox,
body.etp-redesign .gwt-DateBox > input {
  border: 1px solid var(--border-default) !important;
  border-radius: var(--r-sm) !important;
  padding: var(--space-3) var(--space-4) !important;
  font-family: var(--font-body) !important;
  font-size: 0.875rem !important;
  color: var(--ink-1000) !important;
  background: #fff !important;
}
body.etp-redesign .gwt-TextBox:focus,
body.etp-redesign .gwt-TextArea:focus,
body.etp-redesign .gwt-ListBox:focus {
  outline: none !important;
  border-color: var(--brand-blue-500) !important;
  box-shadow: var(--shadow-focus) !important;
}

body.etp-redesign .gwt-Label,
body.etp-redesign .gwt-HTML { color: var(--ink-1000); }

/* === Tables (GWT cell-table widgets — основной список лотов) === */
body.etp-redesign .cellTableWidget,
body.etp-redesign .filterContainer {
  background: var(--surface-card);
  border-radius: var(--r-md);
  border: 1px solid var(--border-subtle);
}

body.etp-redesign .gwt-DialogBox {
  background: var(--surface-card) !important;
  border-radius: var(--r-md) !important;
  box-shadow: var(--shadow-lg) !important;
  border: 0 !important;
}
body.etp-redesign .gwt-DialogBox .Caption {
  background: var(--navy-800) !important;
  color: #fff !important;
  border-radius: var(--r-md) var(--r-md) 0 0 !important;
  padding: var(--space-4) var(--space-5) !important;
  font-family: var(--font-display) !important;
}

/* === prefers-reduced-motion === */
@media (prefers-reduced-motion: reduce) {
  body.etp-redesign *, body.etp-redesign *::before, body.etp-redesign *::after {
    transition: none !important;
    animation: none !important;
  }
}

/* === Print === */
@media print {
  body.etp-redesign .header,
  body.etp-redesign .h-menu,
  body.etp-redesign .left_side,
  body.etp-redesign .footer_wrap { display: none !important; }
}