/* Page wrapper */
.content.notime.main {
  padding: 40px 20px;
  box-sizing: border-box;
  font-family: Inter, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: #111827;
}

/* Card */
.content.notime.main .contentBody {
  width: 100%;
  background: #ffffff;
  border: 1px solid #e6e9ef;
  border-radius: 8px;
  padding: 18px;
  box-sizing: border-box;
  overflow: hidden;
}

/* Top link */
.notime .surrent { margin-bottom: 10px; }
.notime .scrlink {
  display: inline-block;
  text-decoration: none;
  color: #2563eb;
  font-weight: 600;
  font-size: 14px;
  border-radius: 6px;
  padding: 6px 8px;
}
.notime .scrlink:hover { opacity: 0.9; }

/* system errors */
.notime .errors.sysedit {
  color: #dc2626;
  font-weight: 600;
  margin-bottom: 12px;
  min-height: 20px;
}

/* countdown (flat) */
#count_down_container {
  display:flex;
  justify-content:center;
  margin: 8px 0 18px;
}
.notime .count_down {
  display:flex;
  gap:10px;
  align-items:center;
  padding:8px;
  border-radius:999px;
  background: transparent;
}
.notime .count_down .arg {
  font-weight:700;
  font-size:18px;
  padding:8px 10px;
  border-radius:6px;
  border:1px solid #e6e9ef;
  min-width:54px;
  text-align:center;
  background: #ffffff;
}
.notime .count_down .name {
  font-size:12px;
  color:#6b7280;
  padding-right:6px;
  white-space:nowrap;
}

/* commons / form wrapper */
.notime #commons { margin-top:12px; }

/* title */
.notime .commmon_title {
  font-size:18px;
  font-weight:700;
  padding:10px 0;
  display:block;
  border-bottom:1px dashed #f1f3f5;
  margin-bottom:14px;
}

/* form blocks */
.notime #commons .main { box-sizing:border-box; }

.notime #commons .main.l_name,
.notime #commons .main.f_name,
.notime #commons .main.s_name,
.notime #commons .main.email,
.notime #commons .main.phone {
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-bottom:12px;
}

/* labels */
.notime .maintxt {
  font-size:13px;
  color:#111827;
  font-weight:600;
  display:flex;
  align-items:center;
  gap:6px;
}

/* required star */
.notime .stars {
  color:#dc2626;
  font-weight:700;
  font-size:14px;
  line-height:1;
}

/* inputs (flat) */
.notime .maininp {
  height:44px;
  padding:10px 12px;
  border-radius:8px;
  border:1px solid #d1d5db;
  background: #ffffff;
  outline:none;
  transition: border-color 160ms, background 160ms;
  font-size:14px;
  color:#0f172a;
  width:100%;
  box-sizing:border-box;
}
.notime .maininp::placeholder { color:#9ca3af; }

/* focus */
.notime .maininp:focus {
  border-color:#2563eb;
  background: #ffffff;
  outline: none;
}

/* button area */
.notime .button_area {
  display:flex;
  justify-content:flex-end;
  margin-top:8px;
}

/* flat button */
.notime .input_button {
  cursor:pointer;
  height:44px;
  padding:0 16px;
  border-radius:8px;
  border: none;
  font-weight:700;
  letter-spacing:0.2px;
  background:#2563eb;
  color:#ffffff;
  transition: opacity 140ms, transform 120ms;
}
.notime .input_button:hover { opacity:0.95; }
.notime .input_button:active { transform: translateY(1px); }
.notime .input_button:focus { outline:3px solid rgba(37,99,235,0.12); }

/* success message (flat) */
.notime .finish {
  margin-top:12px;
  padding:12px;
  background:#ecfdf5;
  color:#065f46;
  border-left:4px solid #10b981;
  border-radius:6px;
  font-weight:600;
  display:none; /* управляется стилем/JS */
}

/* responsive: small screens */
@media (max-width:699px) {
  .notime .button_area { justify-content:stretch; }
  .notime .input_button { width:100%; }
  .notime .count_down {
    flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
    gap: 10px 0;
  }
  .notime .count_down .arg {
    width: 50%;
  }
  .notime .count_down .name {
    width: 50%;
    padding-left: 5px;
  }
}

/* responsive: larger screens (simple grid) */
@media (min-width:700px) {
  .notime #commons {
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:16px;
    align-items:start;
  }

  .notime .commmon_title { grid-column: 1 / -1; }
  .notime .button_area { grid-column: 1 / -1; }
  .notime .email { grid-column: 1 / -1; }
  .notime .phone { grid-column: 2 / 3; }
}




/*** Стили субстраницы 1 ***/

/* контейнер */
.content.notime.cont_sub1 {
  background: #ffffff;
  border: 1px solid #e6e9ef;
  border-radius: 8px;
  padding: 18px;
  box-sizing: border-box;
  max-width: 100%;
  font-family: Inter, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: #111827;
}

/* список вверху */
.content.notime.cont_sub1 .list {
  gap: 12px;
  margin-bottom: 12px;
}

/* "Весь список" — кликабельный текст */
.content.notime.cont_sub1 .othertxt {
  font-size: 14px;
  color: #2563eb;
  font-weight: 600;
  cursor: pointer;
  user-select: none;
  padding: 6px 8px;
  border-radius: 6px;
}
.content.notime.cont_sub1 .othertxt:hover { opacity: 0.92; }

/* компактный ul справа/снизу */
.content.notime.cont_sub1 .list ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.content.notime.cont_sub1 .list li {
  margin: 0;
}
.content.notime.cont_sub1 .list .scrlink {
  display: inline-block;
  text-decoration: none;
  color: #2563eb;
  font-size: 13px;
  padding: 6px 8px;
  border-radius: 6px;
}
.content.notime.cont_sub1 .list .scrlink:hover { opacity: 0.92; }

/* таблица — обёртка для прокрутки (если нужно) */
.content.notime.cont_sub1 .tables {
  width: 100%;
  border-collapse: collapse;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-bottom: 14px;
}

/* Базовая табличная вёрстка (чтобы таблица оставалась таблицей на широких экранах) */
.content.notime.cont_sub1 .tables {
  width: 100%;
  border-collapse: collapse;
  font-family: Inter, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: #111827;
  margin-bottom: 14px;
}

/* Заголовки — визуально выделены */
.content.notime.cont_sub1 .tables th,
.content.notime.cont_sub1 .tables .tableHeader {
  text-align: left;
  font-weight: 700;
  font-size: 13px;
  padding: 12px 10px;
  background: #f1f5f9;          /* фон заголовка */
  color: #0f172a;
  border-bottom: 1px solid #e6e9ef;
  vertical-align: middle;
}

/* Ячейки */
.content.notime.cont_sub1 .tables td {
  padding: 12px 10px;
  font-size: 14px;
  color: #111827;
  border-bottom: 1px solid #f1f3f5;
  vertical-align: middle;
  white-space: nowrap;
}

/* Горизонтальная прокрутка контейнера */
/* Используйте обёртку в HTML: <div class="table-wrap" data-responsive="scroll"> <table class="tables"...> */
.content.notime.cont_sub1 .table-wrap[data-responsive="scroll"] {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* При прокрутке задайте минимум ширины таблице, чтобы колонки не сжимались слишком сильно */
.content.notime.cont_sub1 .table-wrap[data-responsive="scroll"] .tables {
  min-width: 720px; /* настройте при необходимости */
}

/* Зебра — включается, если добавить data-zebra="true" в сам <table> */
.content.notime.cont_sub1 .tables[data-zebra="true"] tbody tr:nth-child(even) {
  background: #fbfdff; /* светло-голубой / почти белый */
}
.content.notime.cont_sub1 .tables[data-zebra="true"] tbody tr:nth-child(odd) {
  background: #ffffff;
}

/* Подсветка строки при наведении (легкая) */
.content.notime.cont_sub1 .tables tbody tr:hover td {
  background: #f8fbff;
}


/* кнопочная область */
.content.notime.cont_sub1 .but_area {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: center;
  margin-top: 8px;
  flex-wrap: wrap;
}

/* кнопки (плоские, минималистичные) */
.content.notime.cont_sub1 .buttonSend {
  height: 44px;
  padding: 0 14px;
  border-radius: 8px;
  border: none;
  font-weight: 700;
  cursor: pointer;
  font-size: 14px;
  box-sizing: border-box;
}

/* Сохранить в CSV — основной (primary) */
.content.notime.cont_sub1 .buttonSend.save {
  background: #2563eb;
  color: #ffffff;
}

/* Назад — вторичная, светлая рамка */
.content.notime.cont_sub1 .buttonSend.back {
  background: transparent;
  color: #111827;
  border: 1px solid #e6e9ef;
}

/* состояния фокуса (доступность) */
.content.notime.cont_sub1 .buttonSend:focus,
.content.notime.cont_sub1 .othertxt:focus,
.content.notime.cont_sub1 .list .scrlink:focus {
  outline: 3px solid rgba(37,99,235,0.12);
  outline-offset: 2px;
}

@media (min-width:700px) {
  .content.notime.cont_sub1 .tables[data-sticky="true"] thead th,
  .content.notime.cont_sub1 .tables[data-sticky="true"] .tableHeader {
    position: sticky;
    top: 0;
    z-index: 2;
  }
}

/* адаптация для узких экранов */
@media (max-width: 699px) {
  .content.notime.cont_sub1 .list {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .content.notime.cont_sub1 .but_area {
    width: 100%;
    flex-direction: column-reverse;
    gap: 8px;
  }
  .content.notime.cont_sub1 .buttonSend {
    width: 100%;
  }
   .content.notime.cont_sub1 .tables[data-responsive="stack"] {
    border: none;
  }

  .content.notime.cont_sub1 .tables[data-responsive="stack"] thead {
    display: none; /* скрываем заголовок в этом режиме */
  }

  /* каждая строка становится карточкой */
  .content.notime.cont_sub1 .tables[data-responsive="stack"] tbody tr {
    display: block;
    margin-bottom: 10px;
    border: 1px solid #e6e9ef;
    border-radius: 8px;
    padding: 10px;
    background: #ffffff;
  }

  .content.notime.cont_sub1 .tables[data-responsive="stack"] tbody tr td {
    display: flex;
    justify-content: space-between;
    padding: 8px 6px;
    white-space: normal;
    border-bottom: none;
    font-size: 14px;
  }

  /* метка столбца слева — берётся из data-label атрибута td */
  .content.notime.cont_sub1 .tables[data-responsive="stack"] tbody tr td::before {
    content: attr(data-label);
    font-weight: 700;
    margin-right: 12px;
    color: #374151;
    flex: 0 0 auto;
  }

  .content.notime.cont_sub1 .tables[data-responsive="stack"] tbody tr td span {
    max-width: calc(100% - 110px); /* чтобы текст переносился аккуратно */
    overflow-wrap: anywhere;
  }
}