/*
Theme Name: Mongolian Scripts
Text Domain: Mongolian Scripts
*/

@font-face {
  font-family: Mongolian Baiti;
  src: url("./assets/fonts/MongolianBaiti.woff2") format("woff2"),
    url("./assets/fonts/MongolianBaiti.woff") format("woff");
  font-weight: 500;
}

@font-face {
  font-family: MongolianScript;
  src: url("./assets/fonts/MongolianScript.woff2") format("woff2"),
    url("./assets/fonts/MongolianScript.woff") format("woff");
  font-weight: 500;
}

@font-face {
  font-family: CMs Ulaanbaatar;
  src: url("./assets/fonts/CMSUB.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

#main-menu-backdrop,
#search-backdrop {
  cursor: url(./assets/images/x-button.png), auto;
}

@media print {
  @page {
    size: landscape;
    margin: 1cm;
  }

  body {
    writing-mode: vertical-lr;
    text-orientation: mixed;
    margin: 0;
    padding: 1cm;
    font-family: Mongolian Baiti, serif;
  }

  .no-print {
    display: none;
  }
}

.home-menu {
  background-image: url(./assets/images/frame.png);
}

/* Base style for header-name */
.header-name {
  font-size: 2.5rem;
}

/* For screens with height between 540px and 900px */
@media (min-height: 540px) and (max-height: 900px) {
  .header-name {
    font-size: 1.5rem;
  }

  .footer-text {
    font-size: 1.5rem;
  }
}

/* For smaller screens */
@media (max-height: 540px) {
  .header-name {
    display: none;
  }

  .header-logo {
    display: none;
  }

  .footer-text {
    font-size: 1rem;
  }
}

/* Make submenu items clickable while parent remains clickable too */
.menu-item-has-children > a {
  pointer-events: auto;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
  padding: 8px;
}

.menu-item-has-children > ul > li {
  pointer-events: auto;
}

.leaflet-popup-content {
  height: 150px !important;
  min-width: 100px !important;
  word-wrap: break-word !important;
  writing-mode: vertical-lr !important;
}

.leaflet-pane,
.leaflet-top,
.leaflet-left,
.leaflet-bottom,
.leaflet-right {
  z-index: 20 !important;
}

@-moz-document url-prefix() {
  .group:hover > ul {
    transform: none !important;
  }

  /* Make sure each submenu has its own stacking context */
  .menu-item-has-children {
    position: relative;
    z-index: auto;
  }

  .menu-item-has-children:hover {
    z-index: 10;
  }
}

/* Touch device menu support */
.touch-visible {
  display: flex !important;
  transform: none !important;
  pointer-events: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Keep the hover effect for non-touch devices */
@media (hover: hover) {
  .group:hover > ul {
    display: flex !important;
    transform: none !important;
    opacity: 1;
    pointer-events: auto;
  }
}

/* Chrome-specific fixes for submenu positioning */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  .menu-item-has-children:hover > ul {
    transform: none !important;
    left: 100% !important;
  }

  /* Create proper stacking context for Chrome */
  .menu-item-has-children {
    position: relative;
    z-index: 1;
  }

  .menu-item-has-children:hover {
    z-index: 20;
  }
}
