/* Стили для экранов шириной до 768px (смартфоны и небольшие планшеты) */
@media (max-width: 768px) {
    .subtitle.is-italic {
        font-size: 1em; /* Уменьши размер подзаголовка */
    }

    /* Пример: кнопки или другие элементы могут быть больше для удобства нажатия */
    #printButton {
        position: static !important; /* Убери абсолютное позиционирование */
        text-align: center;
        margin-top: 20px;
    }
}

/* Фиксированная высота под заголовок рецепта (3 строки) */
.card .title,
.card-header-title {
  min-height: 4.5em; /* 3 строки по 1.5em */
}


/* --- Print rules: aim for 2 pages A4 --- */
@media print {
  @page { size: A4; margin: 12mm; }

  /* скрыть блок Download / Print / Share / Copy */
  .gr-utils { display: none !important; }

  /* скрыть рекламу со страниц рецептов*/
  .ad-slot { display: none !important; }

  /* убрать лишние отступы контейнеров */
  .section, .container { padding: 0 !important; margin: 0 !important; }

  /* скрыть верхнюю полосу Hero/Banner */
  .gr-hero { display: none !important; }

  /* картинка рецепта: половина ширины листа, без растяжения */
  .recipe-hero img{
    width: 50% !important;
    height: auto !important;
    display: block !important;
    margin: 8pt auto 12pt !important; /* по центру */
  }
  
}

.recipe-rating {
  display: flex;
  align-items: center;
  gap: 4px;
}

.recipe-rating i {
  cursor: pointer;
  color: #FFD700; /* золотой для активных */
}

.recipe-rating .far {
  color: #ccc; /* серый для пустых */
}

.recipe-rating .rating-text {
  margin-left: 6px;
  font-size: 0.85em;
  color: #555;
}

/* === Brand Bar (header rework) === */
.gr-brandbar{background:#fff;border-bottom:1px solid #e5e7eb;}
.gr-brandbar__home{display:inline-flex;align-items:center;gap:12px;text-decoration:none;}
.gr-brandbar__logo{width:36px;height:36px;border-radius:9999px;object-fit:cover;}
.gr-brandbar__title{
  font-family:"Georgia","Garamond","Times New Roman",serif;
  font-weight:700;font-size:3.75rem;line-height:1.05;
}
.gr-brandbar__right{margin-left:auto;}

/* Brand bar: tablet down */
@media (max-width:768px){
  .gr-brandbar__title{font-size:2rem;}
}

/* === Breadcrumbs polish === */
.gr-bc{background:#fff;border-top:1px solid #e5e7eb;border-bottom:1px solid #f1f5f9;}
.gr-bc-wrap{max-width:1200px;margin:0 auto;padding:10px 16px;color:#6b7280;font-size:.95rem;}
.gr-bc a{color:#374151;text-decoration:none;}
.gr-bc a:hover{text-decoration:underline;}
.gr-bc .sep{color:#9ca3af;margin:0 .35rem;}
@media (max-width:768px){
  .gr-bc-wrap{font-size:.8rem;} /* уменьшили крошки ~20% */
}

/* Mobile tweaks */
@media (max-width:480px){
  .gr-brandbar__right{display:none;}
  .gr-brandbar__logo{width:32px;height:32px;}
  .gr-bc-wrap{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
}

/* Убрать тап‑хайлайт на мобильных */
a, button { -webkit-tap-highlight-color: transparent; }

/* Сохраняем фокус для клавиатуры, но убираем «прыгающую» обводку для тач/мыши в brandbar */
.gr-brandbar a:focus:not(:focus-visible),
.gr-brandbar button:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}

/* fix: hero image should fill the flex wrapper */
.is-flex > .recipe-hero { width: 100%; flex: 1 1 auto; }

/* mobile: hide print button on recipe page */
@media (max-width: 768px) {
  #printButton { display: none !important; }
}

/* fix: убираем внутренний скролл у заголовков в карточках */
.card .media-content {
  overflow: visible !important;
}

/* equal-height только для грида на главной */
.recipe-list.columns.is-multiline { align-items: stretch; }
.recipe-list .column { display: flex; }
.recipe-list .column > .card {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.recipe-list .card-image { flex-shrink: 0; }
.recipe-list .card-content {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}

/* Изолируем бренд-полосу от окраски ссылок Bulma. Brandbar: единый цвет для всего блока */
/*.gr-brandbar { color: #0c5f5f; } - это цвет Good Food*/
.gr-brandbar { color: #0f6c6c; }

/* Ссылки в brandbar наследуют цвет контейнера (перебивает Bulma) */
.gr-brandbar a,
.gr-brandbar a:visited,
.gr-brandbar a:hover,
.gr-brandbar a:focus {
  color: inherit !important;
  text-decoration: none;
}

/* Текст заголовка следует за цветом контейнера/ссылки */
.gr-brandbar__title { color: inherit; }


/* Цвет "зелёной" полосы (Bulma navbar primary) */
.navbar.is-primary {
  background-color: #0f6c6c;
}

/* Текст/иконки внутри полосы (включая бургер) */
.navbar.is-primary .navbar-item,
.navbar.is-primary .navbar-link,
.navbar.is-primary .navbar-brand .navbar-item,
.navbar.is-primary .navbar-burger {
  color: #fff;
}

/* Hover-состояния (легкий подсвет) */
.navbar.is-primary .navbar-item:hover,
.navbar.is-primary .navbar-link:hover {
  background-color: rgba(255,255,255,0.08);
  color: #fff;
}

/* Фон выпадающего меню на мобильном */
.navbar.is-primary .navbar-menu {
  background-color: #0f6c6c;
}


/* Цвет кнопки "View Recipe" под #0f6c6c */
.button.is-primary {
  background-color: #0f6c6c;
  border-color: #0f6c6c;
  color: #fff;
}

.button.is-primary:hover,
.button.is-primary.is-hovered {
  background-color: #0d6060;
  border-color: #0d6060;
}

.button.is-primary:active,
.button.is-primary.is-active {
  background-color: #0c5757;
  border-color: #0c5757;
}

.button.is-primary:focus:not(:active) {
  /* мягкое свечение в тоне бренда */
  box-shadow: 0 0 0 0.25em rgba(15, 108, 108, 0.25);
}

/* Делает зелёную навбар-полоску липкой */
.navbar.is-primary {
  position: sticky;
  top: 0;
  z-index: 1000; /* держим над контентом */
}

/* "Menu" слева от иконки бургера — только на мобиле */
@media (max-width: 1023.98px) {
  .navbar-burger {
    position: relative;      /* якорь для ::before */
    width: 3.25rem;          /* ширина бургера из Bulma */
  }
  .navbar-burger::before {
    content: "Menu / Search";
    white-space: nowrap;
    position: absolute;
    right: calc(100% + 8px); /* сразу слева от иконки */
    top: 50%;
    transform: translateY(-50%);
    font-weight: 600;
    font-size: 0.95rem;
    line-height: 1;
    pointer-events: none;    /* кликается вся кнопка */
  }
}

/* Recipes dropdown: мобильное поведение */
@media (max-width: 768px) {
  .gr-recipes-dropdown {
    position: fixed !important;
    /* высота вашей зелёной полоски (подкорректируй при необходимости) */
    top: 56px;
    left: 8px;
    right: 8px;
    max-height: calc(100vh - 56px - 16px); /* экран минус шапка и внешние отступы */
    overflow-y: auto;
    -webkit-overflow-scrolling: touch; /* плавный скролл на iOS */
    overscroll-behavior: contain;      /* не прокручивать фон при достижении края */
    z-index: 1000;                     /* поверх всего */
  }
}

/* Блокировка скролла страницы, когда меню открыто */
body.gr-modal-open {
  overflow: hidden;
  touch-action: none;
}

/* Utilities bar on recipe page */
.gr-utils { color:#111827; }

/* ссылки ведут себя как текст: чёрные, без подчёркивания, без синего bulma */
.gr-utils a,
.gr-utils a:visited {
  color: inherit !important;
  text-decoration: none;
  font-size: .95rem;       /* чуть мельче */
  font-weight: 500;        /* потоньше */
  display: inline-flex;
  align-items: center;
  gap: .4rem;              /* иконка + текст */
  transition: opacity .15s ease;
}

/* без hover-эффектов; отклик только на реальное нажатие/фокус */
.gr-utils a:focus-visible {
  outline: none;                  /* убираем тонкий контур */
  color: #0f6c6c;                 /* меняем цвет текста/иконки */
  background: rgba(15,108,108,.10); /* мягкий фон-подсветка */
  box-shadow: 0 0 0 2px rgba(15,108,108,.35); /* заметный “ореол” */
  border-radius: 8px;
}

/* иконка не должна быть слишком крупной */
.gr-utils i { font-size: 1.1rem; }

/* вертикальные разделители: внутри полос, с отступом сверху/снизу */
.gr-utils .column {
  border-right: none !important;  /* перекрываем inline border-right */
  position: relative;
}

.gr-utils .column:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 8px;     /* как у контейнера */
  bottom: 8px;  /* как у контейнера */
  right: 0;
  width: 1px;
  background: #dbdbdb;
}

.gr-utils a:hover {
  color: #0f6c6c !important;
  background: rgba(15,108,108,.10);
  box-shadow: 0 0 0 2px rgba(15,108,108,.35);
  border-radius: 8px;
}

/* Вертикальные отступы, чтобы блок был визуально между заголовком и Ingredients */
.gr-utils { 
  margin-block: 48px;  /* мобайл */
}

@media (min-width: 769px) {
  .gr-utils { 
    margin-block: 48px; /* десктоп */
  }
}

/* На мобиле скрываем "Скачать" и "Печать" в утилити-баре */
@media (max-width: 768px) {
  .gr-utils .columns .column:nth-child(1),
  .gr-utils .columns .column:nth-child(2) {
    display: none !important;
  }
}

/* Mobile: скрыть верхний Hero/Banner блок */
@media (max-width: 768px) {
  .gr-hero { 
    display: none !important;
  }
}


/* === Sticky page bar under green navbar (home only) === */
.gr-pagebar{
  position: sticky;
  top: 3.25rem;            /* высота зелёной полосы Bulma navbar */
  z-index: 900;            /* ниже самой навбары (1000), но выше контента */
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
  height: 1.625rem;        /* половина 3.25rem */
  display: flex;
  align-items: center;
}

.gr-pagebar__inner{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
  width: 100%;
  display: flex;
  align-items: center;
  gap: .5rem;
  justify-content: center; /* по центру */
  white-space: nowrap;
  overflow-x: auto;        /* на мобиле можно прокрутить числа горизонтально */
  -webkit-overflow-scrolling: touch;
}

.gr-pagebar__label{
  font-weight: 700;
  color: #0f6c6c;          /* бренд-зелёный */
}

.gr-pagebar__num,
.gr-pagebar__last{
  font-weight: 700;
  color: #0f6c6c;
  text-decoration: none;
}

.gr-pagebar__num:hover,
.gr-pagebar__last:hover{
  text-decoration: underline;
}

.gr-pagebar__num.is-current{
  cursor: default;
  text-decoration: none;
  opacity: .7;             /* визуальное отличие текущей страницы */
}

.gr-pagebar__dots{
  color: #9ca3af;
  padding: 0 .25rem;
}

/* мелкая настройка для очень узких экранов */
@media (max-width: 480px){
  .gr-pagebar { height: 1.75rem; }  /* чуть выше для тача */
}

.gr-pagebar { margin-bottom: 1rem; }

/* Свести верхнюю границу первой section к верхней границе #content */
#content > .section:first-of-type {
  padding-top: 0;
}

/* Отступ под полосой хлебных крошек "Home / …" */
nav.gr-breadcrumbs[aria-label="Breadcrumb"] {
  margin-bottom: 1rem;
}


/* === PRINT LAYOUT: home & taxonomy (A4 portrait, 4 cards per row) === */
@media print {
  @page { size: A4; margin: 12mm; }

  /* скрыть рекламу со страниц таксономий*/
  .columns .column.is-full { display: none !important; }

  /* Скрыть всё лишнее для печати ленты */
  .navbar.is-primary,            /* зелёная верхняя полоса */
  .gr-pagebar,                   /* белый sticky-бар с нумерацией */
  nav.gr-breadcrumbs[aria-label="Breadcrumb"], /* крошки на терм-страницах */
  .buttons.is-centered,          /* нижняя пагинация Prev/Next */
  .recipe-rating,                /* звёзды рейтинга в карточках */
  .card-footer,                  /* кнопка View Recipe в карточке */
  .content .is-small,            /* мелкий служебный текст в карточке (если есть) */
  .fas.fa-tags,                  /* иконка "теги" на терм-страницах */
  .single-rating,                /* скрыть рейтинг на странице рецепта */
  .related-recipes               /* скрыть блок related recipes */
  { display: none !important; }

  /* На терм-страницах скрыть крупный заголовок термина — остаётся только brandbar */
  .site-container > .is-size-2.has-text-centered { display: none !important; }

  /* Оставить brandbar (белая шапка "Great Recipes") и дать чуть воздуха ниже */
  .gr-brandbar { display: block !important; margin-bottom: 8mm !important; }

  /* Обнуляем внутренние отступы разделов — больше места под сетку */
  .section, .site-container { padding: 0 !important; }

  /* Сетка печати: 4 колонки, компактные поля, без "ломки" карточек */
  .columns { 
    display: flex !important; 
    flex-wrap: wrap !important; 
    margin: 0 !important; 
  }
  .columns .column {
    width: 25% !important;    /* 4 в ряд */
    padding: 6px !important;  /* компактные горизонтальные поля */
  }

  /* Карточка: без теней/бордеров, не разрывать между страницами */
  .card { 
    box-shadow: none !important; 
    border: 0 !important; 
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* Контент карточки для печати: фото + название одной строкой */
  .card-image img {
    width: 100% !important;
    height: 120px !important;          /* компактная высота превью */
    object-fit: cover !important;
    border-radius: 0 !important;
  }
  .card .title {
    font-size: 11pt !important;
    line-height: 1.2 !important;
    min-height: auto !important;
    margin: 6px 0 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  /* Футер с легал-ссылками — оставить и центрировать */
  p.footer, .footer {
    display: block !important;
    text-align: center !important;
    margin-top: 4mm !important;     /* было 10mm */
    font-size: 9pt !important;      /* меньше шрифт */
    line-height: 1.15 !important;   /* плотнее строки */
    break-inside: avoid !important; /* не разрывать футер */
    page-break-inside: avoid !important;
    word-wrap: break-word !important;
  }

  /* Ссылки футера — компактные промежутки */
  p.footer a, .footer a {
    margin: 0 3px !important;       /* меньше расстояние между ссылками */
    text-decoration: none !important;
  }
}
/* === END PRINT LAYOUT === */

/* Home intro block */
.home-intro {
  margin: 2rem 0 2.5rem;
}

.home-intro__label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #6b7280;
  margin-bottom: 0.5rem;
}

.home-intro__text {
  max-width: 720px;
  line-height: 1.65;
}

.home-intro {
  margin: 2.5rem 0 3rem;
}

.home-intro__inner {
  padding-left: 1.25rem;
  padding-bottom: 1.25rem;
  border-left: 3px solid #0f766e;
}

.home-intro__label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #6b7280;
  margin-bottom: 0.75rem;
}

.home-intro__text {
  max-width: 720px;
  line-height: 1.65;
}

.home-feedback {
  margin: 4rem auto 2.5rem;
  max-width: 720px;
  padding-top: 1.5rem;
  border-top: 1px solid #e5e7eb;

  font-size: 0.9rem;
  line-height: 1.6;
  color: #6b7280;
}

.home-feedback p {
  margin: 0;
}

.home-feedback a {
  color: #0f766e;
  text-decoration: none;
  border-bottom: 1px solid rgba(15, 118, 110, 0.3);
}

.home-feedback a:hover {
  border-bottom-color: #0f766e;
}

.home-feedback__label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #9ca3af;
  margin-bottom: 0.5rem;
}

/* Cards: text under stars */
.card .recipe-rating {
  display: block;
  text-align: center;
}

.card .recipe-rating i {
  display: inline-block;
}

.card .recipe-rating .rating-text {
  display: block;
  margin-top: 4px;
  text-align: center;
}


/* ===== Single page rating (only inside .single-rating) ===== */
.single-rating {
  margin: 24px auto;
  padding: 18px 22px;
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
  text-align: center;
  max-width: 280px;
}

.single-rating .recipe-rating {
  display: block;
  text-align: center;
}

.single-rating .recipe-rating i {
  margin: 0 2px;
}

.single-rating .rating-text {
  display: block;
  margin-top: 6px;
  font-size: 0.9rem;
  color: #666;
}

/* Make related cards equal height */
.columns.is-multiline .card {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.columns.is-multiline .card-content {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.columns.is-multiline .card-footer {
  margin-top: auto;
}

/* Search results: make layout look like main/taxonomy */
#searchResults {
  padding-top: 1.5rem;
}

/* ограничить ширину как у .container */
#searchResultsCol {
  max-width: 1152px;   /* типичная ширина Bulma container на desktop */
  margin-left: auto;
  margin-right: auto;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

/* колонки как на главной */
#searchResultsCol.columns.is-multiline {
  margin-top: 0.75rem;
}

.back-nav {
  padding: 0.25rem 0.5rem;
}
.back-nav .icon {
  margin-right: 0;
}

/* === ТОЛЬКО searchResults: одинаковая высота карточек === */

#searchResultsCol .column {
  display: flex;
}

#searchResultsCol .card {
  display: flex;
  flex-direction: column;
  width: 100%;
}

#searchResultsCol .card-content {
  flex: 1 1 auto;
}

#searchResultsCol .card-footer {
  margin-top: auto;
}

@media screen and (min-width: 1024px) {
  #searchResults .title.is-3 {
    text-align: center;
  }
}

/* === Related recipes adaptive desktop behaviour === */

/* 2 карточки в ряд на "ноутбучной" ширине */
@media screen and (min-width: 1024px) and (max-width: 1399px) {
  .related-recipes .column.is-one-quarter-desktop {
    width: 50%;
  }
}

/* 4 карточки только на широком десктопе */
@media screen and (min-width: 1400px) {
  .related-recipes .column.is-one-quarter-desktop {
    width: 25%;
  }
}