/* v4.5.8 — category-card presentation and balanced header logo.
   Loaded after the theme upgrade and light palette; search styles are untouched. */

/* Keep the header artwork centered vertically, without changing the provided logo art. */
.site-header .header-main{
  grid-template-columns:162px minmax(230px,1fr) auto;
  align-items:center;
}
.site-header .brand{
  display:flex;
  width:150px;
  height:62px;
  align-items:center;
  justify-content:center;
  justify-self:start;
  align-self:center;
  flex-shrink:0;
}
.site-header .brand .mh-logo-light,
.site-header .brand .mh-logo-dark{
  display:block;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
}
/* The theme's explicit light/dark visibility rules remain in charge. */
.site-header .brand .mh-logo-dark{display:none!important}
html[data-theme="dark"] .site-header .brand .mh-logo-light{display:none!important}
html[data-theme="dark"] .site-header .brand .mh-logo-dark{display:block!important}

/* Nested-category card: exactly the same photo ratio and label typography as
   its plain neighbours. The new artwork is only selected on the home strip. */
.mh-home .categories .mh-category-parent-card > .mh-category-main{
  display:flex;
  width:100%;
  height:100%;
  min-height:inherit;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
}
.mh-home .categories .mh-category-parent-card > .mh-category-main > .category-visual{
  flex:0 0 auto;
  aspect-ratio:16/11!important;
}
.mh-home .categories .mh-category-parent-card > .mh-category-main > .category-visual .mh-dining-cover{
  object-position:center 55%!important;
}
.mh-home .categories .mh-category-parent-card > .mh-category-main > b{
  display:flex!important;
  width:100%;
  min-height:54px!important;
  align-items:center;
  justify-content:center;
  margin:0!important;
  padding:12px 10px!important;
  border-top:1px solid var(--line);
  background:var(--paper)!important;
  color:var(--ink)!important;
  font-family:Vazirmatn,Tahoma,Arial,sans-serif!important;
  font-size:13px!important;
  font-weight:700!important;
  line-height:1.6!important;
  text-align:center;
}
.mh-category-parent-card > .mh-category-main > .mh-category-has-children{
  top:9px;
  left:9px;
  padding:4px 9px;
  border:1px solid rgba(255,255,255,.3);
  background:rgba(56,41,28,.84);
  color:#fff7e9;
  font-size:10px;
}

/* Clear, readable walnut-and-champagne flyout, scrollable when there are many
   child categories. Hover (mouse), focus (keyboard) and .open (touch) all work. */
.mh-category-parent-card > .mh-category-children{
  inset:6px;
  z-index:5;
  gap:6px;
  padding:12px;
  border:1px solid rgba(236,200,138,.72);
  border-radius:13px;
  background:linear-gradient(155deg,rgba(51,39,30,.97),rgba(90,63,39,.97));
  box-shadow:0 14px 30px rgba(35,24,17,.26);
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:#dfbb80 transparent;
  transform:translateY(9px) scale(.97);
  transition:opacity .22s ease,transform .22s ease,visibility .22s;
}
.mh-category-parent-card > .mh-category-children > strong{
  flex:none;
  margin:0 0 2px;
  padding:0 2px 8px;
  border-bottom:1px solid rgba(255,244,223,.3);
  color:#f8dfa9;
  font-size:13px;
  font-weight:800;
  line-height:1.6;
  text-align:right;
}
.mh-category-parent-card > .mh-category-children > a{
  flex:none;
  min-height:36px;
  gap:8px;
  padding:7px 9px;
  border:1px solid rgba(245,225,190,.38);
  border-radius:9px;
  background:rgba(255,249,239,.11);
  color:#fff9f0!important;
  font-size:12px;
  font-weight:600;
  line-height:1.5;
  text-align:right;
  transition:background .2s ease,border-color .2s ease,transform .2s ease;
}
.mh-category-parent-card > .mh-category-children > a > span{
  display:grid;
  width:22px;
  height:22px;
  flex:0 0 22px;
  place-items:center;
  border-radius:50%;
  background:rgba(247,222,174,.18);
  color:#f7dfa9;
  font-size:15px;
}
.mh-category-parent-card > .mh-category-children > a > b{
  font-size:inherit;
  font-weight:700;
  overflow-wrap:anywhere;
}
.mh-category-parent-card > .mh-category-children > a:hover,
.mh-category-parent-card > .mh-category-children > a:focus-visible{
  transform:translateX(-2px);
  border-color:#f4d799;
  background:rgba(237,198,126,.29);
  outline:0;
}
.mh-category-parent-card > .mh-category-children > .mh-category-all-link{
  border-color:#f2d79e;
  background:#f7e8ca;
  color:#392a1e!important;
}
.mh-category-parent-card > .mh-category-children > .mh-category-all-link > span{
  background:#e5c584;
  color:#392a1e;
}
.mh-category-parent-card > .mh-category-children > .mh-category-all-link:hover,
.mh-category-parent-card > .mh-category-children > .mh-category-all-link:focus-visible{
  background:#fff3d9;
  color:#392a1e!important;
}
.mh-category-parent-card:focus-within > .mh-category-children{
  visibility:visible;
  opacity:1;
  transform:none;
  pointer-events:auto;
}

@media(max-width:1100px){
  .site-header .header-main{grid-template-columns:146px minmax(180px,1fr) auto;gap:14px}
  .site-header .brand{width:136px;height:57px}
}
@media(max-width:600px){
  .site-header .header-main{grid-template-columns:auto minmax(0,1fr) auto}
  .site-header .brand{width:107px;height:47px}
  .mh-home .categories .mh-category-parent-card > .mh-category-main > .category-visual{aspect-ratio:1/1!important}
  .mh-home .categories .mh-category-parent-card > .mh-category-main > b{
    min-height:46px!important;
    padding:8px 5px!important;
    font-size:11px!important;
  }
  .mh-category-parent-card > .mh-category-main > .mh-category-has-children{top:6px;left:6px;font-size:8px}
  .mh-category-parent-card > .mh-category-children{inset:4px;gap:4px;padding:8px;border-radius:10px}
  .mh-category-parent-card > .mh-category-children > strong{font-size:11px;padding-bottom:5px}
  .mh-category-parent-card > .mh-category-children > a{min-height:32px;padding:5px 6px;font-size:11px;gap:5px}
  .mh-category-parent-card > .mh-category-children > a > span{width:19px;height:19px;flex-basis:19px;font-size:13px}
}
@media(max-width:380px){
  .site-header .brand{width:94px;height:43px}
}
@media(prefers-reduced-motion:reduce){
  .mh-category-parent-card > .mh-category-children,
  .mh-category-parent-card > .mh-category-children > a{transition:none}
}

/* ---------- v4.5.10 — nested categories open BESIDE the card, with photos ----------
   Request: hovering «میز ناهارخوری» must not cover the card itself; the three child
   categories appear as ONE vertical column on the card's LEFT side, each row carrying
   its own photo (term thumbnail, or the generated cover when none is uploaded).
   Touch/small screens keep the previous in-card overlay (no room beside the card). */
body{overflow-x:clip}
/* the card used to clip everything (overflow:hidden) so a side panel could never
   escape it; move the clipping to the inner link that actually holds the artwork. */
.category-grid>.mh-category-parent-card{overflow:visible!important}
.mh-category-parent-card>.mh-category-main{overflow:hidden;border-radius:14px}

.mh-category-parent-card > .mh-category-children > a > .mh-child-thumb{
  display:block;
  width:42px;
  height:42px;
  flex:0 0 42px;
  border:1px solid rgba(245,225,190,.4);
  border-radius:9px;
  background:rgba(255,249,239,.14);
  object-fit:cover;
}
.mh-category-parent-card > .mh-category-children > a > b{flex:1}
.mh-category-parent-card > .mh-category-children > a > span{margin-inline-start:auto}

@media(min-width:601px) and (hover:hover) and (pointer:fine){
  .mh-category-parent-card.has-children:hover,
  .mh-category-parent-card.has-children:focus-within,
  .mh-category-parent-card.has-children.open{z-index:40}
  .mh-category-parent-card > .mh-category-children{
    top:-6px;
    bottom:auto;
    left:auto;
    right:calc(100% + 10px);        /* physical LEFT of the card in the RTL grid */
    width:262px;
    max-height:min(430px,82vh);
    transform:translateX(-10px) scale(.98);
  }
  /* a card sitting in the row's last (leftmost) column flips the panel to its
     right so it never leaves the viewport */
  .category-grid>.mh-category-parent-card:nth-child(6n) > .mh-category-children,
  .category-grid>.mh-category-parent-card:last-child > .mh-category-children{
    right:auto;
    left:calc(100% + 10px);
    transform:translateX(10px) scale(.98);
  }
  .mh-category-parent-card > .mh-category-children > a{min-height:54px}
}
@media(max-width:600px){
  .mh-category-parent-card > .mh-category-children > a > .mh-child-thumb{width:30px;height:30px;flex-basis:30px;border-radius:7px}
}