/*
Theme Name: KMY Kailash Full Width
Theme URI: https://kmy.co.in/
Author: KMY
Description: Minimal full-width theme for KMY landing page plugin. Use page template "KMY Landing (Full Width)" and shortcode [kmy_kailash_landing].
Version: 1.0.1
Text Domain: kmy-kailash-theme
*/

/* Keep theme minimal; plugin provides the landing page CSS.
   We only style the theme header/footer menus + mobile hamburger. */

body{margin:0}

.kmy-site-header{
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--card, #fff);
  border-bottom: 1px solid var(--border, rgba(0,0,0,.08));
}
.kmy-header-inner{
  max-width: 1200px;
  margin: 0 auto;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.kmy-branding{min-width: 160px}
.kmy-site-title{
  text-decoration: none;
  color: var(--text, #111);
  font-weight: 800;
  letter-spacing: .2px;
}

/* Menus */
.kmy-menu{list-style: none; padding:0; margin:0; display:flex; gap: 14px; align-items:center;}
.kmy-menu a{color: var(--text, #111); text-decoration:none; padding: 8px 10px; border-radius: 12px; display:inline-block;}
.kmy-menu a:hover, .kmy-menu a:focus{background: var(--accent2, rgba(245,158,11,.2)); outline: none;}
.kmy-nav-desktop{margin-left:auto}

/* Dropdown (basic) */
.kmy-menu li{position: relative;}
.kmy-menu .sub-menu{
  position: absolute;
  left: 0;
  top: 100%;
  min-width: 220px;
  background: var(--card, #fff);
  border: 1px solid var(--border, rgba(0,0,0,.08));
  border-radius: 14px;
  box-shadow: var(--shadow, 0 12px 32px rgba(0,0,0,.12));
  padding: 8px;
  display: none;
  flex-direction: column;
  gap: 2px;
  z-index: 1200;
}
.kmy-menu li:hover > .sub-menu{display:flex;}
.kmy-menu .sub-menu a{width: 100%; padding: 10px 12px;}

/* Middle bar */
.kmy-middle-bar{
  border-top: 1px solid var(--border, rgba(0,0,0,.08));
  background: var(--bg, #fff7ed);
}
.kmy-menu--middle{max-width: 1200px; margin: 0 auto; padding: 6px 16px; flex-wrap: wrap;}

/* Hamburger */
.kmy-hamburger{
  margin-left: 8px;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  border: 1px solid var(--border, rgba(0,0,0,.10));
  background: var(--card, #fff);
  display: none;
  align-items: center;
  justify-content: center;
  flex-direction: column; /* ensures 3 bars stack vertically */
  gap: 4px;
  cursor: pointer;
}
.kmy-hamburger span{display:block; width: 18px; height: 2px; background: var(--text, #111); margin: 0; border-radius: 2px;}

/* Mobile drawer */
.kmy-mobile-backdrop{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.35);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
  z-index: 1100;
}
.kmy-mobile-backdrop.is-open{opacity:1; pointer-events:auto;}
.kmy-mobile-drawer{
  position: fixed;
  top: 0;
  right: 0;
  width: min(360px, 86vw);
  height: 100vh;
  background: var(--card, #fff);
  border-left: 1px solid var(--border, rgba(0,0,0,.10));
  box-shadow: var(--shadow, 0 12px 32px rgba(0,0,0,.12));
  transform: translateX(110%);
  transition: transform .22s ease;
  z-index: 1200;
  display: flex;
  flex-direction: column;
}
.kmy-mobile-drawer.is-open{transform: translateX(0);}
.kmy-mobile-drawer__head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 14px;
  border-bottom: 1px solid var(--border, rgba(0,0,0,.08));
}
.kmy-mobile-title{font-weight: 800; color: var(--text, #111);}
.kmy-mobile-close{
  width: 40px;
  height: 40px;
  border-radius: 12px;
  border: 1px solid var(--border, rgba(0,0,0,.10));
  background: var(--card, #fff);
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
}
.kmy-menu--mobile{display: flex; flex-direction: column; gap: 4px; padding: 10px 10px 16px;}
.kmy-menu--mobile a{padding: 12px 12px;}
.kmy-menu--mobile .sub-menu{position: static; display: block; box-shadow: none; border: none; padding: 0 0 0 10px;}

/* Footer */
.kmy-site-footer{
  background: var(--bg, #fff7ed);
  border-top: 1px solid var(--border, rgba(0,0,0,.08));
  margin-top: 24px;
}
.kmy-footer-inner{
  max-width: 1200px;
  margin: 0 auto;
  padding: 18px 16px;
}
.kmy-footer-title{font-weight: 800; color: var(--text, #111); margin-bottom: 10px;}
.kmy-menu--footer{flex-wrap: wrap; gap: 10px;}
.kmy-footer-note{margin-top: 10px; color: var(--muted, #6b7280); font-size: 14px;}

/* Responsive */
@media (max-width: 900px){
  .kmy-nav-desktop{display:none}
  .kmy-hamburger{display:flex}
  .kmy-branding{min-width: 0}
}

/* Scroll lock when drawer open */
html.kmy-lock, body.kmy-lock{overflow: hidden}