/* Badgers Claw SaaS - v2.2.0-beta.36 sidebar restore/layout lock
   Restores the left Claw SaaS Nav/sidebar after later theme/text fixes changed page layout behavior. */
:root {
  --bc-sidebar-width: 220px;
}

/* Main layout shell must always reserve/display the sidebar on desktop. */
.app-shell,
.bc-shell,
body > .container-fluid > .row.g-0,
body > .container-fluid > .row {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

.app-sidebar-col,
.sidebar,
.bc-restored-sidebar,
body > .container-fluid > .row > .col-md-2 {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  flex: 0 0 var(--bc-sidebar-width) !important;
  width: var(--bc-sidebar-width) !important;
  min-width: var(--bc-sidebar-width) !important;
  max-width: var(--bc-sidebar-width) !important;
  min-height: calc(100vh - 72px) !important;
  position: relative !important;
  z-index: 4000 !important;
  overflow: visible !important;
  padding: 1rem .85rem !important;
  box-sizing: border-box !important;
  border-right: 2px solid var(--accent-color, #00e5ff) !important;
  background: linear-gradient(rgba(0,0,0,.28), rgba(0,0,0,.28)), url('/img/rock-texture.jpg?v=2.2.0-beta.36') center/cover no-repeat !important;
  color: #f7fdff !important;
}

.app-main,
.main-container,
body > .container-fluid > .row > .col-md-10 {
  flex: 1 1 auto !important;
  width: calc(100% - var(--bc-sidebar-width)) !important;
  max-width: none !important;
  min-width: 0 !important;
  margin-left: 0 !important;
}

.content-wrapper {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

.sidebar h1,
.sidebar h2,
.sidebar h3,
.sidebar h4,
.sidebar h5,
.sidebar h6,
.sidebar .nav-title,
.sidebar .sidebar-title,
.bc-restored-sidebar h1,
.bc-restored-sidebar h2,
.bc-restored-sidebar h3,
.bc-restored-sidebar h4,
.bc-restored-sidebar h5,
.bc-restored-sidebar h6 {
  color: #f7fdff !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.95), 0 0 8px rgba(0,229,255,.28) !important;
}

.sidebar a,
.sidebar button,
.sidebar .nav-link,
.sidebar .dropdown-toggle,
.sidebar .module-toggle,
.bc-restored-sidebar a,
.bc-restored-sidebar button {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.95) !important;
}

/* Flyout/dropdowns from sidebar must stay above the page, not behind cards. */
.sidebar .dropdown-menu,
.sidebar .collapse,
.sidebar .submenu,
.sidebar .side-submenu,
.sidebar [data-sidebar-flyout],
.bc-restored-sidebar .dropdown-menu,
.bc-restored-sidebar .collapse,
.bc-restored-sidebar .submenu,
.bc-restored-sidebar .side-submenu {
  z-index: 9999 !important;
  overflow: visible !important;
}

/* Kill accidental full-width admin dashboard mode caused by later CSS overrides. */
body.bc-sidebar-restored .app-main,
body.bc-sidebar-restored .admin-content,
body.bc-sidebar-restored main {
  max-width: none !important;
}

@media (max-width: 767.98px) {
  :root { --bc-sidebar-width: min(82vw, 280px); }
  .app-shell,
  .bc-shell,
  body > .container-fluid > .row.g-0,
  body > .container-fluid > .row {
    display: block !important;
  }
  .app-sidebar-col,
  .sidebar,
  .bc-restored-sidebar,
  body > .container-fluid > .row > .col-md-2 {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: auto !important;
    border-right: 0 !important;
    border-bottom: 2px solid var(--accent-color, #00e5ff) !important;
  }
  .app-main,
  .main-container,
  body > .container-fluid > .row > .col-md-10 {
    width: 100% !important;
  }
}
