/* Shim styles for the static docs.majorbots.io clone (/products, /docs). */

/* mobile sidebar drawer */
.mbclone-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 49;
}
html.mbclone-drawer-open .mbclone-overlay { display: block; }
@media (max-width: 767px) {
  /* the sidebar's wrapper div is display:none on mobile — un-hide it */
  html.mbclone-drawer-open *:has(> #nd-sidebar) {
    display: block !important;
  }
  html.mbclone-drawer-open #nd-sidebar {
    display: flex !important;
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    width: min(85vw, 320px) !important;
    z-index: 50 !important;
    transform: none !important;
    --fd-sidebar-width: min(85vw, 320px);
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.3);
  }
  html.mbclone-drawer-open #nd-sidebar > * { width: 100% !important; }
}

/* desktop sidebar collapse */
@media (min-width: 768px) {
  html.mbclone-sidebar-collapsed #nd-docs-layout {
    --fd-sidebar-width: 0px !important;
    --fd-sidebar-col: 0px !important;
  }
  html.mbclone-sidebar-collapsed #nd-sidebar { display: none !important; }
}

/* landing mobile dropdown menu */
.mbclone-mobile-menu {
  display: none;
  position: fixed;
  top: 56px;
  left: 0;
  right: 0;
  z-index: 48;
  flex-direction: column;
  padding: 8px 12px 12px;
  background: var(--color-fd-background, #fafaf9);
  border-bottom: 1px solid var(--color-fd-border, #e0dbd4);
  backdrop-filter: blur(12px);
}
.mbclone-mobile-menu.open { display: flex; }
.mbclone-mm-link {
  padding: 10px 8px;
  font-size: 14px;
  color: var(--color-fd-muted-foreground, #6b6560);
  border-radius: 8px;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 6px;
}
.mbclone-mm-link:hover {
  background: var(--color-fd-accent, #c48a001f);
  color: var(--color-fd-accent-foreground, #1a1a1a);
}

/* search dialog (⌘K) */
.mbclone-search { display: none; position: fixed; inset: 0; z-index: 60; }
.mbclone-search.open { display: block; }
html.mbclone-search-open { overflow: hidden; }
.mbclone-search-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  backdrop-filter: blur(2px);
}
.mbclone-search-dialog {
  position: relative;
  margin: 10vh auto 0;
  width: min(640px, calc(100vw - 24px));
  max-height: min(460px, 80vh);
  display: flex;
  flex-direction: column;
  border-radius: 14px;
  border: 1px solid var(--color-fd-border, #e0dbd4);
  background: var(--color-fd-popover, var(--color-fd-background, #fafaf9));
  color: var(--color-fd-popover-foreground, var(--color-fd-foreground, #1a1a1a));
  box-shadow: 0 16px 60px rgba(0, 0, 0, 0.3);
  overflow: hidden;
}
.mbclone-search-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--color-fd-border, #e0dbd4);
  color: var(--color-fd-muted-foreground, #6b6560);
}
.mbclone-search-header input {
  flex: 1;
  border: 0;
  outline: none;
  background: transparent;
  font: inherit;
  font-size: 15px;
  color: var(--color-fd-foreground, #1a1a1a);
}
.mbclone-search-esc {
  font-size: 11px;
  padding: 2px 6px;
  border: 1px solid var(--color-fd-border, #e0dbd4);
  border-radius: 6px;
  background: var(--color-fd-secondary, #f2efe9);
  color: var(--color-fd-muted-foreground, #6b6560);
  cursor: pointer;
}
.mbclone-search-list {
  overflow-y: auto;
  padding: 6px;
  overscroll-behavior: contain;
}
.mbclone-search-empty {
  padding: 24px 12px;
  text-align: center;
  font-size: 14px;
  color: var(--color-fd-muted-foreground, #6b6560);
}
.mbclone-search-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 10px;
  border-radius: 8px;
  font-size: 14px;
  text-decoration: none;
  color: var(--color-fd-popover-foreground, var(--color-fd-foreground, #1a1a1a));
}
.mbclone-search-item svg { flex-shrink: 0; color: var(--color-fd-muted-foreground, #6b6560); }
.mbclone-search-item.is-heading { padding-inline-start: 26px; }
.mbclone-search-item.active {
  background: var(--color-fd-accent, #c48a001f);
  color: var(--color-fd-accent-foreground, #1a1a1a);
}
.mbclone-search-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mbclone-search-page {
  margin-inline-start: auto;
  flex-shrink: 0;
  font-size: 12px;
  color: var(--color-fd-muted-foreground, #6b6560);
}

/* mobile TOC popover ("On this page" bar) */
[data-toc-popover-content][data-state="open"] {
  animation: none !important;
  height: auto !important;
}
.mbclone-toc-popover {
  display: flex;
  flex-direction: column;
  padding: 4px 16px 12px;
  max-height: 50vh;
  overflow-y: auto;
}
.mbclone-toc-popover a {
  padding: 6px 0;
  font-size: 14px;
  color: var(--color-fd-muted-foreground, #6b6560);
  text-decoration: none;
}
.mbclone-toc-popover a:hover,
.mbclone-toc-popover a[data-active="true"] {
  color: var(--color-fd-primary, #c48a00);
}
.mbclone-toc-popover a.ps-6 { padding-inline-start: 16px; }

/* /products: 4 product cards -> 2x2 on tablet, 4-across on wide screens */
@media (min-width: 768px) {
  .mbclone-products-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (min-width: 1280px) {
  .mbclone-products-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}