/* =========================================
   Базовые стили под Tailwind-верстку
   ========================================= */

body {
  font-family: "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

a:hover{
    color: #ff8000;
}

.text-base{
    font-size: 14px !important;
}

/* Фон верхнего баннера */
.hero-bg {
  background-image: url("../img/top-banner.png");
  background-size: cover;
  background-position: center;
}

/* Стрелки в меню (если где-то нужны) */
.menu-arrow {
  transition: transform 0.15s ease;
}

.menu-arrow-open {
  transform: rotate(180deg);
}

/* В выпадающем списке делаем тёмный текст,
   чтобы он не исчезал на белом фоне браузера */
select option {
  color: #0f172a; /* как text-slate-900 */
}


/* =========================================
   Каталог слева (аккордеон products)
   ========================================= */

/* Корневые кнопки (Фторопласт, Капролон, ...) */
.catalog-nav .cms-menu-accordion-button {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;

  padding: 0.625rem 1rem;   /* py-2.5 px-4 */
  border-style: solid;
  border-color: #e5e7eb;    /* slate-200 */
  border-width: 0 0 1px 0;  /* только снизу */

  background-color: #ffffff;
  font-size: 0.875rem;      /* text-sm */
  text-align: left;
  cursor: pointer;
}

/* Активно раскрытый корень */
.catalog-nav .cms-menu-accordion-button[aria-expanded="true"] {
  background-color: #fff7ed; /* мягкий оранжевый фон */
  font-weight: 600;
}

.catalog-nav
  .cms-menu-accordion-button[aria-expanded="true"]
  .cms-menu-accordion-title {
  color: #c2410c; /* оранжево-коричневый текст названия раздела */
}

/* Панель с дочерними пунктами */
.catalog-nav .cms-menu-accordion-panel {
  padding: 0.5rem 1rem 0.5rem;   /* px-4 py-2 */
  font-size: 0.875rem;
  color: #374151;                /* slate-700 */
}

.catalog-nav .cms-menu-accordion-panel.hidden {
  display: none;
}

/* Открытая панель явно показываем */
.catalog-nav .cms-menu-accordion-panel.is-open {
  display: block;
}

/* Закрытая панель (сервер даёт is-collapsed) */
.catalog-nav .cms-menu-accordion-panel.is-collapsed {
  display: none;
}

/* Ссылки внутри панелей — как в макете */
.catalog-nav .cms-menu-accordion-panel > li > a {
  display: block;
  padding: 0.35rem 0;
  text-decoration: none;
  color: #374151;                /* slate-700 */
}

.catalog-nav .cms-menu-accordion-panel > li > a:hover {
  color: #ea580c;                /* hover:text-orange-600 */
}

/* Если у раздела есть дочерние пункты, не показываем его как первый пункт списка */
.catalog-nav .cms-menu-accordion-panel > li.has-children > a {
  display: none;
}

/* Чуть отступаем список детей от верхней границы */
.catalog-nav .cms-menu-accordion-panel > li.has-children > ul {
  margin-top: 0.25rem;
}

/* Вложенные уровни (если появится 3-й и дальше) чуть отступаем */
.catalog-nav .cms-menu-accordion-panel ul {
  margin-left: 0.75rem;
  padding-left: 0.75rem;
  border-left: 1px solid #e5e7eb;
}

/* Подсветка активного подпункта (кроме листовых разделов) */
.catalog-nav li.is-current > a:not(.cms-menu-leaf),
.catalog-nav li.is-active > a:not(.cms-menu-leaf) {
  position: relative;
  color: #c2410c;
  font-weight: 600;
}

.catalog-nav li.is-current > a:not(.cms-menu-leaf)::before,
.catalog-nav li.is-active > a:not(.cms-menu-leaf)::before {
  content: "";
  position: absolute;
  left: -0.75rem;
  top: 0.35rem;
  bottom: 0.35rem;
  width: 2px;
  border-radius: 999px;
  background-color: #fb923c;
}


/* Стрелка-уголок на кнопке (корневые разделы) */
.catalog-nav .cms-menu-accordion-button::after {
  content: "▾";
  font-size: 0.75rem;
  color: #9ca3af;                /* slate-400 */
  transition: transform 0.15s ease;
}

/* Поворачиваем стрелку, когда раздел открыт */
.catalog-nav .cms-menu-accordion-button[aria-expanded="true"]::after {
  transform: rotate(180deg);
}

/* Листовые пункты (разделы без дочерних элементов) — без стрелки */
.catalog-nav .cms-menu-accordion-button.cms-menu-leaf::after {
  content: none !important;
  background-image: none !important;
}

/* Листовой пункт — убираем лишние бордеры, оставляем низ,
   чтобы визуально попадал в сетку */
.catalog-nav .cms-menu-accordion-button.cms-menu-leaf {
  border: none !important;
  border-bottom: 1px solid #e5e7eb !important;
}

/* Активный листовой раздел (например, "Формопласт-компаунд", "Фторлакоткань") */
.catalog-nav .cms-menu-accordion-button.cms-menu-leaf.is-current {
  position: relative;
  background-color: #fff7ed;
  font-weight: 600;
  color: #c2410c;
}

/* Оранжевая полоска слева у активного листового раздела */
.catalog-nav .cms-menu-accordion-button.cms-menu-leaf.is-current::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.35rem;
  bottom: 0.35rem;
  width: 2px;
  border-radius: 999px;
  background-color: #fb923c;
}

/* Увеличиваем расстояние между подпунктами второго уровня */
.catalog-nav .cms-menu-accordion-panel ul li {
  margin-bottom: 4px;
}

.catalog-nav .cms-menu-accordion-panel ul li:last-child {
  margin-bottom: 0;
}


/* =========================================
   Верхнее меню
   ========================================= */

.top-nav a.is-current,
.top-nav a.is-active {
  color: #fb923c !important;   /* ярко-оранжевый */
  font-weight: 600;
}

/* Ховер (для всех пунктов) */
.top-nav a:hover {
  color: #fba454; /* светлый оранжевый */
}


/* =========================================
   Универсальный белый контентный блок
   ========================================= */

.txt-block {
  background-color: #ffffff;
  border: 1px solid rgba(226, 232, 240, 1); /* slate-200 */
  border-radius: 1rem; /* rounded-2xl */
  padding: 1rem 1.25rem; /* px-5 py-4 */

  /* адаптивность для md */
  /* (эта конструкция корректна только в отдельном CSS-файле) */
}

@media (min-width: 768px) {
  .txt-block {
    padding: 1.25rem 1.5rem;
  }
}

.txt-block {
  color: #334155; /* slate-700 */
  font-size: 0.875rem; /* text-sm */
  line-height: 1.5;
  display: block;
}

.txt-block ul,
.txt-block ol {
  margin: 0;
  padding-left: 1.1em;
}

.txt-block li {
  margin-bottom: 0.4rem;
}

.txt-block h3 {
  margin-bottom: 0.75rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: #0f172a; /* slate-900 */
}

/* Списки внутри контентного блока */
.txt-block ul {
  list-style: none;          /* убираем стандартные маркеры */
  margin: 0;
  padding-left: 0;
}

/* Элементы списка — аккуратные оранжевые точки слева */
.txt-block ul li {
  position: relative;
  padding-left: 1rem;
}

.txt-block ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.6em;
  width: 0.3rem;
  height: 0.3rem;
  border-radius: 999px;
  background-color: #fb923c; /* orange-400/500 */
}