/* =========================================================================
   Rosbotanic — Форма регистрации B2B (Simple B2B v2)
   Использует palette.css v1 (var(--rb-*)) — палитра ОБЯЗАТЕЛЬНА к подключению
   раньше этого файла.

   Ссылка в шаблон:
     <link rel="stylesheet" href="catalog/view/theme/mango/stylesheet/rosbotanic/register_b2b.css">

   Все селекторы новые (rb-b2b-*), не конфликтуют со штатными Bootstrap 3.
   ========================================================================= */

.rb-b2b {
  background: var(--rb-cream);
  min-height: 60vh;
}

/* ---------- HERO ---------- */
.rb-b2b-hero {
  background: var(--rb-tertiary);
  padding: 64px 24px 56px;
  text-align: center;
  border-bottom: 1px solid var(--rb-border);
}

.rb-b2b-hero__inner {
  max-width: 720px;
  margin: 0 auto;
}

.rb-b2b-hero__title {
  font-family: 'Lora', Georgia, serif;
  font-weight: 500;
  font-size: clamp(28px, 4.5vw, 40px);
  color: var(--rb-ink);
  margin: 0 0 12px;
  line-height: 1.2;
}

.rb-b2b-hero__sub {
  font-family: 'Manrope', -apple-system, sans-serif;
  font-size: 18px;
  color: var(--rb-ink);
  margin: 0 0 16px;
  font-weight: 500;
}

.rb-b2b-hero__lead {
  font-family: 'Manrope', -apple-system, sans-serif;
  font-size: 15px;
  color: var(--rb-ink-soft);
  margin: 0;
  line-height: 1.55;
}

/* ---------- BODY ---------- */
.rb-b2b-body {
  padding: 48px 0 80px;
}

.rb-b2b-form {
  max-width: 1040px;
  margin: 0 auto;
  background: var(--rb-paper);
  border: 1px solid var(--rb-border);
  border-radius: 12px;
  padding: 40px 40px 32px;
  box-shadow: 0 2px 16px var(--rb-shadow-soft);
}

/* Honeypot скрываем полностью (не CSS-класс, но нужен) */
.rb-b2b-honeypot {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

/* ---------- GRID ---------- */
.rb-b2b-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  margin-bottom: 32px;
}

.rb-b2b-col {
  min-width: 0;
}

/* ---------- FIELDSET ---------- */
.rb-b2b-fieldset {
  border: none;
  padding: 0;
  margin: 0 0 24px;
}

.rb-b2b-legend {
  font-family: 'Manrope', sans-serif;
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--rb-cta);
  margin: 0 0 20px;
  padding: 0 0 8px;
  width: 100%;
  border-bottom: 1px solid var(--rb-border);
}

/* ---------- FIELD ---------- */
.rb-b2b-field {
  margin-bottom: 18px;
}

.rb-b2b-label {
  display: block;
  font-family: 'Manrope', sans-serif;
  font-weight: 500;
  font-size: 13px;
  color: var(--rb-ink);
  margin-bottom: 6px;
  letter-spacing: 0.01em;
}

.rb-b2b-req {
  color: #a04030;
  font-weight: 700;
  margin-left: 2px;
}

.rb-b2b-input {
  width: 100%;
  padding: 11px 14px;
  font-family: 'Manrope', -apple-system, sans-serif;
  font-size: 15px;
  color: var(--rb-ink);
  background: var(--rb-paper);
  border: 1px solid var(--rb-border-mid);
  border-radius: 6px;
  transition: border-color 140ms ease, box-shadow 140ms ease;
  box-sizing: border-box;
  line-height: 1.4;
}

.rb-b2b-input::placeholder {
  color: var(--rb-ink-soft);
  opacity: 0.6;
}

.rb-b2b-input:focus {
  border-color: var(--rb-secondary);
  box-shadow: 0 0 0 3px var(--rb-lavender-glow);
  outline: none;
}

.rb-b2b-hint {
  font-family: 'Manrope', sans-serif;
  font-size: 12px;
  color: var(--rb-ink-soft);
  margin-top: 5px;
  line-height: 1.4;
}

/* ---------- ERROR ---------- */
.rb-b2b-error {
  font-family: 'Manrope', sans-serif;
  font-size: 12px;
  color: #a04030;
  margin-top: 5px;
  display: flex;
  align-items: center;
  gap: 4px;
}

.rb-b2b-error::before {
  content: "\26A0\FE0E"; /* U+26A0 WARNING SIGN, VS15 (текстовый) */
  font-size: 13px;
  color: #a04030;
}

.rb-b2b-field.is-error .rb-b2b-input {
  border-color: #a04030;
  background-color: #fdf6f4;
}

/* ---------- ALERT ---------- */
.rb-b2b-alert {
  max-width: 1040px;
  margin: 0 auto 24px;
  padding: 14px 20px;
  border-radius: 8px;
  font-family: 'Manrope', sans-serif;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.rb-b2b-alert--error {
  background: #fdf6f4;
  border: 1px solid #a04030;
  color: #7a2a20;
}

.rb-b2b-alert__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #a04030;
  color: #fff;
  font-weight: 700;
  font-size: 13px;
  flex-shrink: 0;
}

/* ---------- INFO (мятная плашка) ---------- */
.rb-b2b-info {
  background: var(--rb-tertiary);
  border-radius: 8px;
  padding: 14px 18px;
  font-family: 'Manrope', sans-serif;
  font-size: 13px;
  color: var(--rb-ink);
  line-height: 1.55;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin: 20px 0 24px;
}

.rb-b2b-info__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--rb-cta);
  color: var(--rb-paper);
  font-family: 'Lora', Georgia, serif;
  font-style: italic;
  font-weight: 700;
  font-size: 13px;
  flex-shrink: 0;
}

/* ---------- CONSENT ---------- */
.rb-b2b-field--consent {
  margin-top: 8px;
}

.rb-b2b-consent {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  cursor: pointer;
  font-family: 'Manrope', sans-serif;
  font-size: 13px;
  color: var(--rb-ink);
  line-height: 1.5;
}

.rb-b2b-checkbox {
  width: 16px;
  height: 16px;
  margin: 3px 0 0;
  accent-color: var(--rb-cta);
  cursor: pointer;
  flex-shrink: 0;
}

.rb-b2b-consent__text a {
  color: var(--rb-ink);
  text-decoration-color: var(--rb-secondary);
  text-decoration-thickness: 1.5px;
}

.rb-b2b-consent__text a:hover {
  text-decoration-color: var(--rb-ink);
}

/* ---------- SUBMIT ---------- */
.rb-b2b-submit-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding-top: 24px;
  border-top: 1px solid var(--rb-border);
}

.rb-b2b-submit {
  background: var(--rb-cta);
  color: var(--rb-paper);
  border: none;
  border-radius: 6px;
  padding: 15px 48px;
  font-family: 'Manrope', sans-serif;
  font-weight: 600;
  font-size: 16px;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: background-color 160ms ease;
  min-width: 260px;
}

.rb-b2b-submit:hover,
.rb-b2b-submit:focus {
  background: var(--rb-cta-hover);
  outline: none;
}

.rb-b2b-alt-link {
  font-family: 'Manrope', sans-serif;
  font-size: 13px;
  color: var(--rb-ink-soft);
  text-decoration-color: var(--rb-border-mid);
}

.rb-b2b-alt-link:hover {
  color: var(--rb-ink);
  text-decoration-color: var(--rb-ink);
}

/* ---------- SUCCESS-страница (переиспользуем success/index.twig) ---------- */
.rb-b2b-success {
  max-width: 640px;
  margin: 48px auto;
  padding: 40px;
  background: var(--rb-paper);
  border: 1px solid var(--rb-border);
  border-radius: 12px;
  text-align: center;
}

.rb-b2b-success__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--rb-cta);
  color: var(--rb-paper);
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 20px;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 768px) {
  .rb-b2b-hero {
    padding: 48px 20px 40px;
  }

  .rb-b2b-body {
    padding: 32px 16px 56px;
  }

  .rb-b2b-form {
    padding: 24px 20px;
  }

  .rb-b2b-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .rb-b2b-submit {
    width: 100%;
    min-width: 0;
  }
}

/* =========================================================================
   АВТОЗАПОЛНЕНИЕ ИЗ КАРТОЧКИ ПРЕДПРИЯТИЯ (Фаза 1: PDF/XLSX)
   Блок над формой — предлагает загрузить файл и заполняет реквизиты сам.
   ========================================================================= */
.rb-b2b-autofill {
  max-width: 1040px;
  margin: 0 auto 20px;
  background: var(--rb-tertiary, #E8F0E5);
  border: 1px solid var(--rb-border, #D4DED0);
  border-radius: 12px;
  padding: 24px 32px;
  transition: opacity .3s ease, transform .3s ease, max-height .4s ease;
  overflow: hidden;
}

.rb-b2b-autofill--collapsed {
  opacity: 0.35;
  padding: 8px 32px;
  max-height: 60px;
}

.rb-b2b-autofill__header {
  margin-bottom: 16px;
}

.rb-b2b-autofill__title {
  font-family: 'Lora', Georgia, serif;
  font-weight: 500;
  font-size: 20px;
  color: var(--rb-ink, #2C3E2A);
  margin: 0 0 6px;
  line-height: 1.3;
}

.rb-b2b-autofill__lead {
  font-family: 'Manrope', -apple-system, sans-serif;
  font-size: 14px;
  color: var(--rb-ink-soft, #55665C);
  margin: 0;
  line-height: 1.5;
}

.rb-b2b-autofill__body {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.rb-b2b-autofill__drop {
  flex: 1 1 320px;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 20px;
  background: var(--rb-paper, #FFFFFF);
  border: 2px dashed var(--rb-border, #C4CFC0);
  border-radius: 10px;
  cursor: pointer;
  transition: border-color .2s, background .2s;
  position: relative;
}

.rb-b2b-autofill__drop:hover,
.rb-b2b-autofill__drop:focus-within {
  border-color: var(--rb-cta, #5C7F5A);
  background: #FAFDF9;
}

.rb-b2b-autofill__input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 1px;
  height: 1px;
}

.rb-b2b-autofill__drop-icon {
  font-size: 28px;
  line-height: 1;
  flex-shrink: 0;
}

.rb-b2b-autofill__drop-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-family: 'Manrope', sans-serif;
}

.rb-b2b-autofill__drop-text strong {
  font-weight: 600;
  font-size: 15px;
  color: var(--rb-ink, #2C3E2A);
}

.rb-b2b-autofill__drop-text em {
  font-style: normal;
  font-size: 12px;
  color: var(--rb-ink-soft, #55665C);
}

.rb-b2b-autofill__manual {
  background: transparent;
  border: 1px solid var(--rb-border, #C4CFC0);
  border-radius: 8px;
  padding: 10px 18px;
  font-family: 'Manrope', sans-serif;
  font-size: 13px;
  color: var(--rb-ink-soft, #55665C);
  cursor: pointer;
  transition: border-color .2s, color .2s;
}

.rb-b2b-autofill__manual:hover {
  border-color: var(--rb-cta, #5C7F5A);
  color: var(--rb-ink, #2C3E2A);
}

.rb-b2b-autofill__status {
  width: 100%;
  padding: 10px 14px;
  border-radius: 8px;
  font-family: 'Manrope', sans-serif;
  font-size: 13.5px;
  line-height: 1.45;
}

.rb-b2b-autofill__status--loading {
  background: #FFF8E6;
  border: 1px solid #F0DFA0;
  color: #7A5A00;
}

.rb-b2b-autofill__status--success {
  background: #E8F5E4;
  border: 1px solid #A9CFA0;
  color: #2E5B2A;
}

.rb-b2b-autofill__status--error {
  background: #FBEBEB;
  border: 1px solid #E5B0B0;
  color: #8C2A2A;
}

/* Подсветка полей после автозаполнения */
.rb-b2b-field.is-autofilled .rb-b2b-input {
  background: #F4FBF2;
  border-color: #A9CFA0;
}

.rb-b2b-field.is-low-confidence .rb-b2b-input {
  background: #FFF8E6;
  border-color: #E8C864;
  box-shadow: 0 0 0 3px rgba(232, 200, 100, 0.15);
}

.rb-b2b-field.is-low-confidence::after {
  content: 'проверьте';
  display: inline-block;
  font-size: 11px;
  color: #A07A00;
  background: #FFF3C4;
  padding: 2px 8px;
  border-radius: 10px;
  margin-top: 6px;
  font-family: 'Manrope', sans-serif;
  font-weight: 600;
}

@media (max-width: 768px) {
  .rb-b2b-autofill {
    padding: 20px 20px;
    border-radius: 10px;
  }
  .rb-b2b-autofill__title {
    font-size: 17px;
  }
  .rb-b2b-autofill__body {
    flex-direction: column;
    align-items: stretch;
  }
  .rb-b2b-autofill__manual {
    width: 100%;
  }
}

/* ============================================================
   FIX 2026-07-07: Хлебные крошки не расширяются на всю ширину экрана
   ============================================================ */
.rb-b2b > .breadcrumb {
  max-width: 1170px;
  margin: 0 auto;
  padding: 8px 15px;
  background: transparent;
  border-radius: 0;
}
