/*
Theme Name: Pteat FSE
Theme URI: https://pteat.ru
Author: Pteat
Author URI: https://pteat.ru
Description: FSE (Full Site Editing) тема для Pteat
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.0
Version: 1.0.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: pteat-fse
Tags: full-site-editing, block-themes, one-column, wide-blocks
*/

/* =============================================
   Sticky footer — push footer to viewport bottom
   ============================================= */
.wp-site-blocks {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.admin-bar .wp-site-blocks {
  min-height: calc(100vh - 32px);
}

@media screen and (max-width: 782px) {
  .admin-bar .wp-site-blocks {
    min-height: calc(100vh - 46px);
  }
}

.wp-site-blocks > main {
  flex: 1 0 auto;
}

/* =============================================
   Sticky header
   ============================================= */
header.wp-block-template-part {
  position: sticky;
  top: 0;
  z-index: 100;
}

.admin-bar header.wp-block-template-part {
  top: 32px;
}

@media screen and (max-width: 782px) {
  .admin-bar header.wp-block-template-part {
    z-index: 99999;
    top: 0;
  }
}

/* =============================================
   SVG site-logo fix (editor iframe + frontend)
   ============================================= */
.wp-block-site-logo .custom-logo-link {
  display: block !important;
}

/* =============================================
   Navigation breakpoint override: 1080px
   ============================================= */

/* Between WP default (600px) and our target (1080px):
   re-apply mobile behaviour — show hamburger, hide inline nav */
@media (min-width: 600px) and (max-width: 1079px) {
  .wp-block-navigation__responsive-container-open {
    display: flex !important;
  }
  .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none !important;
  }
}

/* =============================================
   Mobile header — swap logo and nav toggle
   ============================================= */
@media (max-width: 1079px) {
  header .wp-block-navigation {
    order: 1;
  }
  header .wp-block-site-logo, .wp-block-group:has(.wp-block-site-logo) {
    order: 2;
    margin-inline: auto;
  }
  header .wp-block-pteat-fse-login-button, .pteat-user-menu {
    order: 3;
  }
}

/* =============================================
   Mobile Navigation — full-screen overlay
   ============================================= */

/* Overlay background */
.wp-block-navigation__responsive-container.is-menu-open {
  background: #fff !important;
  justify-content: flex-start !important;
  align-items: stretch !important;
}

/* Don't cover the WP admin bar */
.admin-bar .wp-block-navigation__responsive-container.is-menu-open {
  top: 0px !important;
}

@media screen and (max-width: 782px) {
  .admin-bar .wp-block-navigation__responsive-container.is-menu-open {
    z-index: 99999;
    top: 0;
  }
}

/* Full-screen panel */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-close {
  width: 100%;
  height: 100%;
  background: #fff;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}

/* Slide-in animation on the container itself — replays on every open,
   composed with core's overlay-menu__fade-in-animation */
.wp-block-navigation__responsive-container.is-menu-open {
  animation:
    overlay-menu__fade-in-animation 0.1s ease-out forwards,
    pteat-slide-in 0.22s ease-out forwards !important;
}

@keyframes pteat-slide-in {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(0);
  }
}

/* Dialog fills panel */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-dialog {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: 0;
}

/* Close button */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-close {
  align-self: flex-end !important;
  margin-right: 12px;
  margin-top: 12px;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  display: flex !important;
  position: fixed !important;
  top: 0px !important;
  right: 0px !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background 0.15s !important;
}

.wp-block-navigation__responsive-container-close:hover {
  background: #e5e7eb !important;
}


/* Content area */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content {
  padding: 4px 0 32px;
}

/* Fix alignment */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation.items-justified-right {
  --navigation-layout-justification-setting: flex-start !important;
  --navigation-layout-justify: flex-start !important;
}

/* Top-level items */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container
  > .wp-block-navigation-item {
  border-bottom: 1px solid #f3f4f6;
  width: 100%;
}

/* Links & submenu toggles */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-submenu__toggle {
  padding: 13px 24px !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  color: #1f2937 !important;
  text-decoration: none !important;
  width: 100% !important;
  text-align: left !important;
  background: none !important;
  border: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  cursor: pointer !important;
  transition:
    background 0.12s,
    color 0.12s !important;
}

.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item__content:hover,
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-submenu__toggle:hover {
  background: #fdf2f8 !important;
  color: #db2777 !important;
}

/* Hide WP's built-in chevron (markup varies; we draw our own) */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__submenu-icon {
  display: none !important;
}

/* Custom chevron on submenu toggle — always visible, flips when expanded */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-submenu__toggle::after {
  content: '';
  width: 8px;
  height: 8px;
  margin-left: 12px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translate(-2px, -2px);
  transition: transform 0.2s ease;
  flex-shrink: 0;
}

.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-submenu__toggle[aria-expanded='true']::after {
  transform: rotate(-135deg) translate(-2px, -2px);
}

/* Hide submenus by default */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__submenu-container {
  display: none !important;
}

/* Show submenu when toggle is expanded */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-submenu__toggle[aria-expanded='true']
  ~ .wp-block-navigation__submenu-container {
  display: block !important;
  background: #fafafa;
  border-top: 1px solid #f3f4f6;
}

/* Sub-menu items — indented, smaller */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__submenu-container
  .wp-block-navigation-item__content {
  padding: 10px 24px 10px 36px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #6b7280 !important;
  width: 100% !important;
  overflow: hidden;
}

.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__submenu-container
  .wp-block-navigation-item__content:hover {
  color: #db2877 !important;
  background: #fdf2f8 !important;
}

.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content
  .wp-block-navigation__container {
  width: 100% !important;
  overflow: hidden;
}

.post-tools {
  top: 130px !important;
}

.admin-bar .post-tools {
  top: 162px !important;
}

.pteat-sticky {
  position: sticky;
  top: 120px !important;
}

/* Hide empty comment-list wrapper when the post has no comments */
.wp-block-comments > .wp-block-group:empty {
  display: none;
}

/* =============================================
   RTB ad blocks
   ============================================= */
.pteat-rtb {
  position: relative;
  max-height: 60vh;
  min-height: 54vh;
}

.pteat-rtb + figure {
  margin-top: 1.25rem;
}

.pteat-rtb + script + figure {
  margin-top: 1.25rem;
}

.adsDesktopContainer {
  display: flex;
  align-items: start;
}

.adsDesktopContainer div {
  flex-grow: 1;
}

ins.adsbygoogle[data-ad-status='unfilled'] {
  display: none !important;
}

/* =============================================
   AdSense sticky show/hide
   ============================================= */
.pteat-sticky--hidden {
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition: all 0.3s ease;
}

.wp-block-pteat-blocks-ingredients {
  scroll-margin-top: 8rem;
}

.ingredients-title {
  font-weight: 600;
}

.group-of-ingredients-title {
  color: var(--wp--preset--color--primary);
}

.group-of-ingredients-ingredient-title a:where(:not(.wp-element-button)) {
  color: var(--wp--preset--color--foreground) !important;
  text-decoration: none;
}

.wp-block-pteat-blocks-ingredients .group-of-ingredients-ingredient {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.wp-block-pteat-blocks-ingredients .group-of-ingredients-ingredient-line {
  background: radial-gradient(circle, rgba(0, 0, 0, 0.4) 1px, transparent 0)
    repeat-x;
  background-position: 50%;
  background-size: 6px 100%;
  display: block;
  flex: 1 1 0%;
}

.wp-block-pteat-blocks-ingredients .group-of-ingredients-ingredient-amount,
.wp-block-pteat-blocks-ingredients .group-of-ingredients-ingredient-measure {
  white-space: nowrap;
}