/* ==== Drupal jQuery UI dialog: мобильный скролл и видимая кнопка ==== */
@media (max-width: 576px) {

  /* Растягиваем диалог на весь экран */
  .ui-dialog.ui-front.ui-dialog-buttons {
    position: fixed !important;
    inset: 0 !important;                 /* top/right/bottom/left: 0 */
    width: 100vw !important;
    height: 100dvh !important;           /* корректная высота на мобилках */
    margin: 0 !important;
    border-radius: 0 !important;
    display: flex;
    flex-direction: column;              /* делаем колонку: titlebar + body + buttons */
  }

  /* Шапка остаётся авто-высоты */
  .ui-dialog .ui-dialog-titlebar {
    flex: 0 0 auto;
  }

  /* Само содержимое (у тебя это #drupal-modal) должно скроллиться */
  .ui-dialog .ui-dialog-content,
  #drupal-modal.ui-dialog-content {
    flex: 1 1 auto;
    min-height: 0;                       /* чтобы не выталкивало кнопки вниз */
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    height: auto !important;             /* переопределяем inline-стили jQuery UI */
    max-height: none !important;         /* (!) jQuery UI пишет max-height inline */
  }

  /* Панель с кнопками — всегда видна внизу */
  .ui-dialog .ui-dialog-buttonpane {
    flex: 0 0 auto;
    position: sticky;
    bottom: 0;
    z-index: 2;
    background: #fff;
    box-shadow: 0 -6px 12px rgba(0,0,0,.06);
  }

  /* На всякий случай, чтобы reCAPTCHA не разъезжала */
  .ui-dialog .g-recaptcha { max-width: 100%; }
}

/* Message hidden by default; JS will show it for blocked countries */
.webform-submission-form .geo-blocked-message {
  display: none;
}

/* Geo info box */
.geo-info-box {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 10px;
  background: linear-gradient(
    135deg,
    rgba(255, 0, 205, 0.08),
    rgba(255, 0, 205, 0.03)
  );
  border: 1px solid rgba(255, 0, 205, 0.35);
  box-shadow: 0 6px 16px rgba(255, 0, 205, 0.12);
  font-size: 14.5px;
  line-height: 1.5;
  margin-bottom: 16px;
}

/* Icon */
.geo-info-icon {
  min-width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #ff00cd;
  color: #fff;
  font-weight: 700;
  font-size: 16px;
  line-height: 32px;
  text-align: center;
  box-shadow: 0 4px 10px rgba(255, 0, 205, 0.35);
  flex-shrink: 0;
}

/* Text */
.geo-info-text {
  color: #2b2b2b;
}

/* Mobile */
@media (max-width: 576px) {
  .geo-info-box {
    padding: 12px 14px;
    font-size: 14px;
  }

  .geo-info-icon {
    min-width: 28px;
    height: 28px;
    line-height: 28px;
    font-size: 15px;
  }
}

/* hide ONLY while geo-check is running */
html.geo-checking form.webform-submission-form {
  display: none;
}

/* message hidden by default */
.geo-blocked-message {
  display: none;
}