/*
Theme Name: HolmesWebsite
Theme URI: https://www.holmeswebsite.co.uk
Description: A full FSE theme
Author: David Holmes
Copyright: 2026 David Holmes
Author URI: https://www.holmesportfolio.co.uk
Requires PHP: 7
Tested up to: 6.5
Version: 4.3
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: holmeswebsite
Tags: full-site-editing, custom-logo, one-column, two-columns, custom-background

@package holmeswebsite
*/

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
                nav menu 
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.wp-block-navigation__responsive-container-open::after {
  content: " ▼";
  font-size: 0.9em;
  transition: transform 0.2s ease;
}

.wp-block-navigation__responsive-container-close::after {
  content: " ✖";
  font-size: 0.9em;
  transition: transform 0.2s ease;
}

.wp-block-navigation__responsive-container-close {
  padding: 10px 14px !important;
  border-radius: 999px;
  margin-right: 1em;
  font-weight: 600 !important;
}

.wp-block-navigation__responsive-container-open {
  padding: 10px 14px !important;
  border-radius: 999px;
  width: fit-content !important;
  height: auto !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px;
  gap: 0.4em;
}

.wp-block-navigation__responsive-container-close:hover {
  background: #7b2c7b !important;
  font-weight: bolder;
  color: white;
}

.wp-block-navigation__responsive-container {
  max-width: 75%;
  width: 80%;
  height: 80%;
  margin: auto !important;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.wp-block-navigation__responsive-container ul {
  padding-left: 1.8em !important;
  position: relative;
}

.wp-block-navigation__responsive-container > ul > li {
  margin-bottom: 0.5em !important;
  position: relative;
}

.wp-block-navigation__responsive-container ul ul {
  margin: 0 !important;
  padding: 0 !important;
  padding-left: 1.5em !important;
}

.wp-block-navigation-submenu > .wp-block-navigation-item__content {
  position: relative;
  padding-left: 1.8em !important;
  cursor: pointer;
}

.wp-block-navigation-submenu > .wp-block-navigation-item__content::before {
  content: "▼";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  font-weight: bold;
  transition: transform 0.25s ease;
}

.wp-block-navigation-submenu
  > .wp-block-navigation-item__content[aria-expanded="true"]::before {
  transform: translateY(-50%) rotate(180deg);
}

.wp-block-navigation-item:not(.wp-block-navigation-submenu)
  > .wp-block-navigation-item__content {
  position: relative;
}

.menu-blur-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  backdrop-filter: blur(6px);
  background: rgba(0, 0, 0, 0.15);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
  z-index: 900;
}
.menu-blur-overlay.active {
  opacity: 1;
  pointer-events: auto;
}

.wp-block-navigation-submenu {
  display: none;
}
.wp-block-navigation-submenu.is-open {
  display: block;
}

.wp-block-navigation-submenu li:not(.has-child) > a::before {
  content: "🐾 ";
  font-weight: bold;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.menu-blur-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  backdrop-filter: blur(6px);
  background: rgba(0, 0, 0, 0.15);
  z-index: 900;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
}

.wp-block-navigation__responsive-container.is-menu-open + .menu-blur-overlay,
.menu-blur-overlay.active {
  opacity: 1;
  pointer-events: auto;
}

.wp-block-navigation .wp-block-navigation__submenu-container {
  display: none !important;
}

.wp-block-navigation-submenu
  > .wp-block-navigation-item__content[aria-expanded="true"]
  ~ .wp-block-navigation__submenu-container {
  display: block !important;
}

.wp-block-navigation__submenu-container
  .wp-block-navigation__submenu-container {
  display: none !important;
}

.wp-block-navigation__submenu-container
  > .wp-block-navigation-submenu
  > .wp-block-navigation-item__content[aria-expanded="true"]
  ~ .wp-block-navigation__submenu-container {
  display: block !important;
}

.wp-block-navigation__responsive-container > ul > li {
  opacity: 0;
  transform: translateY(8px);
  transition:
    opacity 0.25s ease,
    transform 0.25s ease;
}

.wp-block-navigation__responsive-container.is-menu-open > ul > li {
  opacity: 1;
  transform: translateY(0);
}

.wp-block-navigation__responsive-container.is-menu-open > ul > li:nth-child(1) {
  transition-delay: 0.05s;
}
.wp-block-navigation__responsive-container.is-menu-open > ul > li:nth-child(2) {
  transition-delay: 0.15s;
}
.wp-block-navigation__responsive-container.is-menu-open > ul > li:nth-child(3) {
  transition-delay: 0.25s;
}
.wp-block-navigation__responsive-container.is-menu-open > ul > li:nth-child(4) {
  transition-delay: 0.35s;
}
.wp-block-navigation__responsive-container.is-menu-open > ul > li:nth-child(5) {
  transition-delay: 0.45s;
}
.wp-block-navigation__responsive-container.is-menu-open > ul > li:nth-child(6) {
  transition-delay: 0.55s;
}
.wp-block-navigation__responsive-container.is-menu-open > ul > li:nth-child(7) {
  transition-delay: 0.65s;
}
