/* 1) Давим «чёрный контур» при клике мышью.
   Сохраняем видимый фокус для клавиатуры (доступность). */
.thanks-btn:focus { outline: none; box-shadow: none; }
.thanks-btn:active { outline: none; box-shadow: none; }
.thanks-btn:focus:not(:focus-visible) { outline: none; box-shadow: none; }
/* Если хотите полностью убрать и для клавиатуры — раскомментируйте строку ниже,
   но лучше оставить :focus-visible для доступности. */
/* .thanks-btn:focus-visible { outline: none; box-shadow: none; } */

/* 2) Ровное выравнивание иконки и текста */
.thanks-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;         /* расстояние между иконкой и текстом */
  border-width: 0px !important;
}

/* Иконка ровно по центру по высоте текста */
.thanks-btn__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;    /* убираем лишние отступы */
}

/* Текст — обычный inline-block, чтобы ровно центрировался */
.thanks-btn__text { display: inline-block; }

/* 3) Ваш «серый» вид на тёмном фоне с уже существующим селектором */
.dark-bg .btn.disabled,
.dark-bg .btn:disabled {
  color: #8f9399;
  background: transparent;
  border-color: #8f9399;
  cursor: default !important;
}

/* (опционально) Если нужно такой же вид и вне .dark-bg: */
.btn.btn--accent.disabled,
.btn.btn--accent:disabled {
  color: #000000 !important;
  background: #F2F2F2 !important;
  border-color: #8f9399;
  cursor: default !important;
}

/* заголовок */
.page-thanks--alt .page__head-title {
  font-weight: 800;
  letter-spacing: .4px;
  font-size: 32px;
  line-height: 1.15;
  margin: 0 0 8px;
}

/* ===== Кнопки-табов: активная — .hip-item (синяя), неактивная — .hip-item--ghost ===== */
.hip-item,
.hip-item * { box-sizing: border-box; }

.hip-item {
  background: #0000ff;
  border-radius: var(--size-cmt-radius-08, 12px);
  padding: var(--size-cmt-space-vertical-05, 8px) var(--size-cmt-space-horizontal-07, 12px);
  display: flex;
  flex-direction: row;
  gap: var(--size-cmt-gap-05, 8px);
  align-items: center;
  justify-content: center;
  min-width: var(--size-cmt-width-22, 36px);
  min-height: var(--size-cmt-height-22, 36px);
  max-height: var(--size-cmt-height-22, 36px);
  position: relative;
  border: 0;
  cursor: pointer;
}
.hip-item .label {
  color: #ffffff;
  text-align: left;
  font-family: 'TrialRooftop-Regular', sans-serif;
  font-size: 15px;
  line-height: 22px;
  font-weight: 400;
  position: relative;
}
/* неактивная */
.hip-item--ghost {
  background: #ECEFF3;
}
.hip-item--ghost .label {
  color: #111111;
}

.page-thanks--alt .thanks-tabs { display:flex; gap:8px; margin:16px 0 20px; }

/* ===== Карточка из фигмы (.rectangle-4855) ===== */
.rectangle-4855,
.rectangle-4855 * { box-sizing: border-box; }

.rectangle-4855 {
  background: #ffffff;
  border-radius: 32px;
  min-height: 151px !important;  /* вместо фиксированной высоты */
  height: auto !important;
  position: relative;
  box-shadow: var(--card-box-shadow,
    0px 2px 16px rgba(0,0,0,0.06),
    0px -10px 22px rgba(0,0,0,0.03));
  padding: 20px 24px;
  padding-bottom: 20px !important; /* одинаковый отступ сверху и снизу */
  overflow: visible !important;    /* не обрезаем контент */
}

/* сетка карточек */
.page-thanks--alt .thanks-grid {
  display: grid; gap: 20px;
  grid-template-columns: repeat(12, 1fr);
}
@media (min-width: 992px) { .page-thanks--alt .thanks-card { grid-column: span 4; } }
@media (max-width: 991px) { .page-thanks--alt .thanks-card { grid-column: 1 / -1; } }

/* Внутренний лэйаут карточки */
.thanks-item {
  display: grid;
  grid-template-columns: 54px 1fr; /* аватар 54px + контент */
  column-gap: 16px;
}
.thanks-item__avatar { display:flex; align-items:flex-start; }

.thanks-item__content {
  min-width: 0;
  display: grid;
  grid-template-rows: auto auto 1fr auto; /* имя, должность, текст, дата */
  row-gap: 6px;
}

/* Имя — жирный */
.thanks-item__name {
  margin: 0;
  font-weight: 600;        /* менее значимо */
  font-size: 16px;         /* уменьшили размер */
  line-height: 1.2;
  color: #444;             /* менее контрастно */
}

/* Должность (из userprofile title) */
.thanks-item__title {
  font-size: 14px;
  color: #2B2B2B;
}

/* Блок названия объекта и региона */
.thanks-item__object { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.thanks-item__object-title {
  font-weight: 800;
  font-size: 18px;
  color: #1f2229;         /* как на странице идеи */
  text-decoration: none;  /* убрать подчёркивание */
}
.thanks-item__object-title:hover { text-decoration: none; }
.thanks-item__object-region {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #1f2229;        /* как .idea__meta-item */
  font-size: 16px;
}
.thanks-item__object-region::before {
  content: '';
  display: inline-block;
  width: 12px;
  height: 12px;
  background-repeat: no-repeat;
  background-size: 12px 12px;
  /* монохромная (ч/б) иконка локации через inline SVG */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%231f2229' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 10c0 7-9 13-9 13S3 17 3 10a9 9 0 1 1 18 0Z'/><circle cx='12' cy='10' r='3'/></svg>");
}

/* Текст сообщения — теперь без обрезки */
/* Цитата с текстом комментария */
.thanks-item__quote {
  font-size: 15px;
  color: #444B53;
  background: none;            /* убираем фон */
  border-left: 0;              /* убираем левый бордер */
  padding: 0;                  /* убираем внутренние отступы */
  margin: 6px 0 0 0;
  border-radius: 0;
  white-space: pre-wrap;
}
.thanks-item__quote::before {
  content: '';
  display: inline-block;
  width: 18px;                  /* крупнее */
  height: 14px;
  margin-right: 6px;
  background-repeat: no-repeat;
  background-size: 14px 18px;
  /* серые «закрывающие» кавычки как SVG-иконка */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'><path fill='%238f9399' d='M2 2h8v10l-6 12h-2l6-12H2z'/><path fill='%238f9399' d='M14 2h8v10l-6 12h-2l6-12h-6z'/></svg>");
}

/* Дата */
.thanks-item__date {
  align-self: end;
  font-size: 14px;
  color: #8A9098;
}

/* утилиты */
.page-thanks--alt .link-back { text-decoration: none; }
.page-thanks--alt .muted { color: #7C828A; }
