/* Indiagram theme override for the Next.js (Shadcn/Linkdsys) tool pages.
   Loaded after their compiled chunks so these custom-property redeclarations win the cascade.
   Version: v6 - 2026-10-18 */

:root, .dark {
  --background: #ffffff;
  --foreground: #18181b;
  --card: #ffffff;
  --card-foreground: #18181b;
  --popover: #ffffff;
  --popover-foreground: #18181b;
  --primary: #c82573;
  --primary-foreground: #ffffff;
  --secondary: #fff1f6;
  --secondary-foreground: #a91f5f;
  --muted: #f4f4f5;
  --muted-foreground: #71717a;
  --accent: #fff1f6;
  --accent-foreground: #a91f5f;
  --destructive: #dc2626;
  --destructive-foreground: #ffffff;
  --border: #e4e4e7;
  --input: #d4d4d8;
  --ring: #c82573;
  --sidebar: #ffffff;
  --sidebar-foreground: #18181b;
  --sidebar-primary: #c82573;
  --sidebar-primary-foreground: #ffffff;
  --sidebar-accent: #fff1f6;
  --sidebar-accent-foreground: #a91f5f;
  --sidebar-border: #e4e4e7;
  --sidebar-ring: #c82573;
}

/* =====================================================================
   NEXT.JS INNER SIDEBAR + HEADER SUPPRESSION
   The Next.js app renders its own sidebar-wrapper layout. We completely
   suppress it so only the Indiagram ig-shell sidebar (aside.ig-shell-sidebar)
   is shown. The tool content area expands to fill the full ig-shell-main.
   ===================================================================== */

/* Hide the Next.js inner sidebar and all its sub-components */
[data-slot="sidebar"],
[data-slot="sidebar-gap"],
[data-slot="sidebar-container"],
[data-slot="sidebar-inner"],
[data-slot="sidebar-rail"],
[data-slot="sidebar-header"],
[data-slot="sidebar-content"],
[data-slot="sidebar-footer"] {
  display: none !important;
}

/* The sidebar-wrapper: block display */
[data-slot="sidebar-wrapper"] {
  display: block !important;
  min-height: 0 !important;
  width: 100% !important;
}

/* sidebar-inset is the actual tool content - expand it to fill */
[data-slot="sidebar-inset"] {
  display: block !important;
  width: 100% !important;
  min-height: 0 !important;
  overflow: visible !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Hide the sticky top header bar ("Toggle Sidebar") emitted by Next.js */
[data-slot="sidebar-wrapper"] > header,
[data-slot="sidebar-inset"] > header,
[data-slot="sidebar-wrapper"] header,
header.sticky.top-0,
header[class*="sticky"][class*="top-0"],
[data-sidebar="trigger"],
[data-slot="sidebar-trigger"] {
  display: none !important;
}

/* Suppress Tailwind's min-h-svh that inflates height on the wrapper */
[data-slot="sidebar-wrapper"].min-h-svh,
.min-h-svh[data-slot="sidebar-wrapper"] {
  min-height: 0 !important;
}

/* =====================================================================
   FONT / BODY OVERRIDES
   Next.js pages add .font-mono .antialiased on body - reset to Inter
   so the ig-shell sidebar and Indiagram branding render correctly.
   ===================================================================== */
body.font-mono,
body.antialiased {
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif !important;
}

/* But keep monospace where it belongs (code, pre) */
body.font-mono code,
body.font-mono pre,
body.font-mono kbd {
  font-family: ui-monospace, SFMono-Regular, 'Fira Code', Consolas, monospace !important;
}
