/* ============================================================
   killer-tools custom overrides
   ============================================================ */

/* --- hide social links, buy me coffee, info button, toolbar circle buttons --- */
.support-button,
a[href*="buymeacoffee"],
a[href*="github.com/CorentinTh"],
a[href*="twitter.com"],
.c-button.round.support-button,
.i-mdi-github,
.i-mdi-twitter,
.i-mdi-information-outline,
.i-mdi-information,
a.c-button.circle:not([aria-label="Toggle menu"]),
.c-button.circle:not([aria-label="Toggle menu"]) {
  display: none !important;
}

/* --- hide sidebar hero elements --- */
.hero-wrapper svg,
.hero-wrapper .title,
.hero-wrapper .subtitle,
.hero-wrapper .divider,
.hero-wrapper .text-wrapper,
.sider-content::before,
.n-layout-sider .n-scrollbar-rail {
  display: none !important;
}

/* --- sidebar layout --- */
.sider-content {
  margin-top: -170px !important;
  position: relative;
  padding-top: -10 !important;
}

.sider-content > div > div:first-child {
  margin-top: 20px !important;
}

.logo-click-target {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 240px;
  height: 72px;
  z-index: 100;
  cursor: pointer;
}

.sider-logo {
  display: block;
  height: 38px;
  padding-left: 0px;
  cursor: pointer;
  margin-top: 30px;
  margin-bottom: 30px;
}

.sider-logo img {
  height: 38px;
  object-fit: contain;
  object-position: top;
}

.pt-50px {
  padding-top: 0 !important;
}

.menu-wrapper {
  margin-bottom: 0 !important;
}

div:first-child > .menu-wrapper .n-menu-item-content {
  padding-left: 32px !important;
}

.n-layout-sider,
.sider-content {
  overflow-x: hidden !important;
}

body {
  overflow-x: hidden !important;
}

/* --- code output wrap --- */
.n-code pre,
.n-code code {
  white-space: pre-wrap !important;
  word-break: break-all;
}

/* --- restore wysiwyg editor toolbar buttons --- */
.editor-header .c-button.circle {
  display: inline-flex !important;
}

/* --- mobile fixes --- */
@media (max-width: 768px) {
  pre {
    max-width: 100%;
    overflow-x: auto !important;
    box-sizing: border-box;
  }

  .n-card,
  .c-card {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
  }

  .n-input__textarea-el,
  .n-input__input-el {
    word-break: break-all;
    overflow-wrap: break-word;
  }

  .editor-header {
    flex-wrap: wrap;
  }
}

/* --- Global Scrollbar Overrides --- */

/* 1. Target the root and all elements */
* {
  /* Firefox support */
  scrollbar-width: thin;
  scrollbar-color: #1ea54c55 transparent;
}

/* 2. Webkit (Chrome, Edge, Safari, Brave) */
::-webkit-scrollbar {
  width: 4px;
  height: 4px; /* For horizontal scrolling */
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: #1ea54c55;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #1ea54c;
}

/* 3. Force-apply to Naive UI Textareas & Inputs */
/* Sometimes component libraries stop propagation of styles, this forces it */
.n-input .n-input__textarea-el::-webkit-scrollbar,
.n-input .n-input__input-el::-webkit-scrollbar,
.n-scrollbar-rail::-webkit-scrollbar {
  width: 4px;
}

.n-input .n-input__textarea-el::-webkit-scrollbar-thumb,
.n-scrollbar-rail::-webkit-scrollbar-thumb {
  background: #1ea54c55;
  border-radius: 4px;
}

.custom-sidebar-scroll {
  scrollbar-width: thin;
  scrollbar-color: #1ea54c55 transparent;
  /* Ensure it has its own scroll context */
  display: block; 
  position: relative;
}

.custom-sidebar-scroll::-webkit-scrollbar {
  width: 4px;
}

.custom-sidebar-scroll::-webkit-scrollbar-track {
  background: transparent;
}

.custom-sidebar-scroll::-webkit-scrollbar-thumb {
  background: #1ea54c55;
  border-radius: 4px;
}

.custom-sidebar-scroll::-webkit-scrollbar-thumb:hover {
  background: #1ea54c;
}
/* --- tool header: unconstrain on desktop --- */
@media (min-width: 769px) {
  .tool-layout {
    max-width: none !important;
    padding: 0 32px;
  }
}

/* --- powershell builder compact header: fix visibility --- */
.tool-header-compact {
  opacity: 1 !important;
}

.tool-title-compact {
  opacity: 0.7 !important;
  font-size: 0.9rem !important;
}