/* MIK Form — базовые стили. Дефолты в var(--mik-f-*, дефолт); атрибут блока переопределяет.
   Тема-переменные Blocksy (--theme-*) как дефолт кнопки, с fallback для не-Blocksy тем. */
.mik-form{
  --_gap:var(--mik-f-gap,14px);
  --_h:var(--mik-f-h,46px);
  max-width:var(--mik-f-maxw,560px);
  width:100%;
}
.mik-form--center{margin-inline:auto}
.mik-form__title{margin:0 0 var(--_gap)}
.mik-form__title--left{text-align:left}
.mik-form__title--center{text-align:center}
.mik-form__title--right{text-align:right}

.mik-form__grid{display:flex;flex-wrap:wrap;gap:var(--_gap)}
.mik-form__grid--left{justify-content:flex-start}
.mik-form__grid--center{justify-content:center}
.mik-form__grid--right{justify-content:flex-end}

/* ширина поля -> «рядом» (Ім'я + Прізвище в один ряд) */
.mik-field{display:flex;flex-direction:column;gap:6px;flex:1 1 100%;min-width:0}
.mik-field--half{flex:1 1 calc(50% - var(--_gap)/2)}
.mik-field--third{flex:1 1 calc(33.333% - var(--_gap)*2/3)}

.mik-field__label{
  font-size:var(--mik-f-label-size,14px);
  color:var(--mik-f-label,inherit);
  font-weight:600;line-height:1.2;
}
.mik-req{color:#e11}

.mik-form input:not([type=checkbox]):not([type=radio]),
.mik-form select,
.mik-form textarea{
  height:var(--_h);
  padding:0 var(--mik-f-padx,14px);
  border-radius:var(--mik-f-radius,10px);
  border:1px solid var(--mik-f-border,rgba(0,0,0,.22));
  background:var(--mik-f-bg,#fff);
  color:var(--mik-f-text,inherit);
  font-size:16px;width:100%;box-sizing:border-box;
  transition:border-color .15s, box-shadow .15s;
}
.mik-form textarea{height:auto;min-height:calc(var(--_h)*2);padding:12px var(--mik-f-padx,14px);resize:vertical}

/* стандартная стрелка селекта — темы часто сбрасывают appearance без замены, оставляя только текст плейсхолдера */
.mik-form select{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  padding-right:calc(var(--mik-f-padx,14px) + 22px);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23666' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right var(--mik-f-padx,14px) center;
}
.mik-form input:focus,.mik-form select:focus,.mik-form textarea:focus{
  outline:0;border-color:var(--mik-f-btn-bg,var(--theme-palette-color-1,#0a7a5c));
  box-shadow:0 0 0 3px color-mix(in srgb, var(--mik-f-btn-bg,var(--theme-palette-color-1,#0a7a5c)) 20%, transparent);
}

.mik-choice{display:flex;flex-direction:column;gap:6px}
.mik-check{display:flex;align-items:center;gap:8px;font-weight:400;cursor:pointer}
.mik-check input{flex:0 0 auto}

/* button.mik-form__btn (не просто .mik-form__btn) — темы (напр. Blocksy main.min.css)
   часто стилизуют кнопки глобальным селектором [type="submit"] с той же специфичностью (1 класс/атрибут),
   но подключаются ПОСЛЕ этого файла → без element-квалификатора их правило побеждало по порядку подключения. */
button.mik-form__btn{
  margin-top:var(--_gap);
  height:var(--_h);padding:0 28px;border:0;cursor:pointer;
  border-radius:var(--mik-f-btn-radius,10px);
  background:var(--mik-f-btn-bg,var(--theme-palette-color-1,#0a7a5c));
  color:var(--mik-f-btn-color,#fff);
  font-size:16px;font-weight:700;line-height:1;
  transition:filter .15s, box-shadow .15s;
}
button.mik-form__btn:hover:not(:disabled){filter:brightness(1.06);box-shadow:0 4px 14px rgba(0,0,0,.15)}
button.mik-form__btn:disabled{opacity:.6;cursor:default}
button.mik-form__btn.is-full{width:100%}
button.mik-form__btn--left:not(.is-full){display:block;margin-inline:0}
button.mik-form__btn--center:not(.is-full){display:block;margin-inline:auto}
button.mik-form__btn--right:not(.is-full){display:block;margin-inline:auto 0}

.mik-form__msg{margin:12px 0 0;font-weight:600}
.mik-form__msg.is-ok{color:var(--theme-palette-color-1,#0a7a5c)}
.mik-form__msg.is-err{color:#e11}

/* на мобильном — все поля в один столбец */
@media (max-width:600px){
  .mik-field--half,.mik-field--third{flex:1 1 100%}
}