/* =========================
   Общие стили мульти-формы
   ========================= */
.js-multistep { max-width: 760px; margin: 0 auto; }
.cf7-steps { position: relative; }
.cf7-step { display: none; }
.cf7-step.active { display: block; }

.cf7-steps .row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cf7-steps .col  { width: 100%; }
.cf7-steps label { display: block; margin-bottom: 10px; font-weight: 500; }
.cf7-steps input,
.cf7-steps select,
.cf7-steps textarea { width: 100%; }

.cf7-steps .nav { display: flex; gap: 10px; margin: 12px 0 16px; justify-content: flex-end; }
.cf7-btn { padding: 12px 30px; font-size: 1.05rem; border: 1px solid #ddd; border-radius: 10px; cursor: pointer; background: #fff; }
.cf7-btn:hover { background: #f6f6f6; }



.note-nonus { padding: 10px; background: #fff7e6; border: 1px solid #ffe1b3; border-radius: 8px; }

@media (max-width: 640px){
  .cf7-steps .row { grid-template-columns: 1fr; }
}

/* Скрываем кнопку Next только на первом шаге (если она есть в разметке) */
.cf7-step[data-step="1"] .cf7-btn.next,
.cf7-step.step-1 .cf7-btn-next { display: none !important; }

.cf7-btn.next {
  color: #fff;
  background: #34a853;
}

/* =========================
   STEP 1 — Радио-карточки
   (CF7 radio с use_label_element)
   ========================= */
/* Контейнер */
.wpcf7 .loc-choices { display: flex; flex-wrap: wrap; gap: 24px; justify-content: center; }

/* Две в ряд на десктопе */
.wpcf7 .loc-choices .wpcf7-list-item { flex: 1 1 calc(50% - 12px); min-width: 280px; }

/* Карточка-лейбл (внутри CF7 это <label><input type="radio"><span class="wpcf7-list-item-label">…</span></label>) */
.wpcf7 .loc-choices .wpcf7-list-item > label{
  display: flex;
  align-items: center;       /* точка и текст в одну линию */
  justify-content: center;
  gap: 14px;
  padding: 18px 24px;
  border: 2px solid #2f2f2f;
  border-radius: 18px;
  background: #fff;
  cursor: pointer;
  transition: box-shadow .2s, border-color .2s, transform .03s;
  font-size: clamp(16px, 2.2vw, 20px);
  font-weight: 700;
  text-align: center;
  max-width: 300px;
  margin: 0 auto;
}
.wpcf7 .loc-choices .wpcf7-list-item > label:hover { box-shadow: 0 8px 22px rgba(0,0,0,.08); }

/* Радиокнопка слева от текста */
.wpcf7 .loc-choices input[type="radio"] { width: 20px; height: 20px; margin: 0; }

/* Выбранная карточка — используем :has для родителя label */
.wpcf7 .loc-choices .wpcf7-list-item > label:has(input[type="radio"]:checked){
  border-color: #06b454;
  box-shadow: 0 8px 22px rgba(59,130,246,.18);
}

/* Мобилка — по одной карточке */
@media (max-width: 768px){
  .wpcf7 .loc-choices .wpcf7-list-item { flex: 1 1 100%; }
}

/* =========================
   STEP 2 — Карточки сэмплов
   (чистый HTML: input[type=checkbox].sample-check + label.sample-card[for])
   ========================= */
   /* Сетка: 2 в ряд, на мобилке — одна */
   .samples-grid.cards{
     display: grid;
     grid-template-columns: repeat(2, minmax(0,1fr));
     gap: 24px;
   }

   /* Карточка-лейбл (label внутри .samples-grid.cards) */
   .samples-grid.cards .sample-card{
     display: flex;
     flex-direction: column;
     align-items: center;
     text-align: center;
     padding: 16px;
     border: 2px solid #e5e5e5;
     border-radius: 16px;
     background: #fff;
     cursor: pointer;
     transition: border-color .2s, box-shadow .2s;
   }

   /* Бейдж "Selected" */
   .sample-card .badge-selected {
     position: absolute;
     top: 0;
     left: 0;
     background: green;
     border-radius: 5px 0 5px 0;
     padding: 0 9px;
     font-size: 0.8rem;
     color: #fff;
     font-weight: bold;
     display: none; /* скрыт по умолчанию */
   }

   /* Скрываем стандартный чекбокс */
   .sample-card input[type="checkbox"] {
     display: none;
   }

   /* Когда карточка выбрана */
   .sample-card input[type="checkbox"]:checked ~ .badge-selected {
     display: inline-block;
   }

   .sample-card input[type="checkbox"]:checked {
     background: #f0fff0;
   }

   .sample-card input[type="checkbox"]:checked ~ .thumb {
     outline: 3px solid green;
     outline-offset: -2px;
   }


   /* Изображение */
   .samples-grid.cards .sample-card .thumb{
     width: 100%;
     max-width: 300px;
     height: auto;
     aspect-ratio: 244 / 200;
     object-fit: cover;
     object-position: center;
     border-radius: 12px;
     background: #f6f7f9;
     display: block;
     margin: 8px 0 12px;
   }

   /* Подпись */
   .samples-grid.cards .sample-card .title{
     font-size: 23px;
     font-weight: 600;
     color: #111;
   }

   /* Скрываем стандартный чекбокс */
   .samples-grid.cards .sample-card input[type="checkbox"]{
     position: absolute;
     opacity: 0;
     pointer-events: none;
   }

   /* Hover эффект */
   .samples-grid.cards .sample-card:hover{
     border-color: #06b454;
     box-shadow: 0 8px 22px rgba(59,130,246,.12);
   }

   /* Выбрано — когда input внутри label выбран */
   .samples-grid.cards .sample-card input[type="checkbox"]:checked ~ .thumb{
     outline: 4px solid #06b454;
     outline-offset: -2px;
   }
   .samples-grid.cards .sample-card input[type="checkbox"]:checked ~ .title{
     font-weight: 700;
     color: #06b454;
   }
   .samples-grid.cards .sample-card input[type="checkbox"]:checked ~ .thumb,
   .samples-grid.cards .sample-card input[type="checkbox"]:checked ~ .title,
   .samples-grid.cards .sample-card input[type="checkbox"]:checked{
     border-color: #06b454;
   }

   /* Мобилка */
   @media (max-width: 768px){
     .samples-grid.cards{ grid-template-columns: 1fr; gap: 16px; }
     .samples-grid.cards .sample-card .thumb{ max-width: 100%; }
   }





/* =========================
   Прочее (acceptance/marketing в одну линию)
   ========================= */
.wpcf7 form .wpcf7-form-control.cf7-inline .wpcf7-list-item > label{
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  margin: 0;
}
.wpcf7 form .wpcf7-form-control.cf7-inline input[type="checkbox"]{
  width: 18px; height: 18px; margin: 0; vertical-align: middle;
}
.wpcf7 form .wpcf7-form-control.cf7-inline .wpcf7-list-item-label{ line-height: 1.3; }

/* Блок верификации лицензии (твои стили) */
.cf7-step .med-license{
  background: #c8e4ff4f;
  padding: 20px;
  border-radius: 10px;
  margin: 5px 0 25px;
}
.cf7-step .med-license p{ margin-bottom: 0; }
.cf7-step .med-license p.title{
  font-size: 20px; color: #000; font-weight: bold; margin-bottom: 10px;
}
.cf7-step .wpcf7-submit{ font-size: 20px; padding: 15px; }

/* =========================
   ЗАЩИТА от старого шорткода samples (если вдруг остался)
   ========================= */
/* Если на странице всё ещё выводится стандартный CF7-контрол для samples — прячем его,
   чтобы не дублировать список с карточками */
.wpcf7-form-control-wrap[data-name="samples"]{ display: none !important; }


/* сетка: 2 в ряд */
.samples-grid.cards{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
}
/* если CF7 оборачивает в <p>, убираем отступы */
.samples-grid.cards p{ margin:0; }

/* карточка */
.sample-card{
  position:relative;                /* нужно для бейджа */
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding:16px;
  border:2px solid #e5e5e5; border-radius:16px; background:#fff;
  cursor:pointer; transition:border-color .2s, box-shadow .2s, background .2s;
}
.sample-card:hover{ border-color:#06b454; box-shadow:0 8px 22px rgba(59,130,246,.12); }

/* картинка */
.sample-card .thumb{
  width:100%; max-width:244px; height:auto;
  aspect-ratio:244/200; object-fit:cover; object-position:center;
  border-radius:12px; background:#f6f7f9; display:block; margin:8px 0 12px;
}

/* бейдж "Selected" */
.sample-card .badge-selected{
  position:absolute; top:0; left:0;
  background:#198754; color:#fff; font-weight:700;
  font-size:.8rem; padding:2px 10px;
  border-radius:14px 0 6px 0;
  display:none;                      /* по умолчанию скрыт */
}

/* Прячем чекбокс (он внутри label, кликается вся карточка) */
.sample-card input[type="checkbox"]{ position:absolute; opacity:0; }

/* ВЫБРАНО — когда input внутри карточки отмечен */
.sample-card:has(input[type="checkbox"]:checked){
  background:#f0fff0;
  border-color:#34a853;
  box-shadow:0 0 0 3px rgba(52,168,83,.12) inset;
}
.sample-card:has(input[type="checkbox"]:checked) .thumb{
  outline:3px solid #34a853; outline-offset:-2px;
}
.sample-card:has(input[type="checkbox"]:checked) .badge-selected{
  display:inline-block;
}
.sample-card:has(input[type="checkbox"]:checked) .title{
  color:#1f7a3d; font-weight:700;
}

/* мобилка — по одной карточке */
@media (max-width:768px){
  .samples-grid.cards{ grid-template-columns:1fr; gap:16px; }
  .sample-card .thumb{ max-width:100%; }
}