/* ===================================================================
   Collapsible sidebar ("icons only" mode) - desktop only (>= 1200px)

   html.sidebar-mini   sidebar collapsed to an icon strip
   html.sidebar-peek   collapsed sidebar temporarily expanded on hover,
                       floating over the page instead of pushing it

   Toggled by #sidebar-mini-toggle (navbar); state is kept in
   localStorage by assets/js/sidebar-mini.js.
   =================================================================== */

.app-brand-mini {
  display: none;
}

@media (min-width: 1200px) {
  html.sidebar-mini {
    --sidebar-mini-width: 4.75rem;
  }

  html.sidebar-mini #layout-menu {
    transition: width 0.2s ease, box-shadow 0.2s ease;
  }

  html.sidebar-mini.layout-menu-fixed .layout-page {
    padding-left: var(--sidebar-mini-width);
  }

  /* ---------- Collapsed: icon strip ---------- */
  html.sidebar-mini:not(.sidebar-peek) #layout-menu,
  html.sidebar-mini:not(.sidebar-peek) #layout-menu .menu-inner > .menu-item,
  html.sidebar-mini:not(.sidebar-peek) #layout-menu .menu-inner > .menu-header {
    width: var(--sidebar-mini-width) !important;
  }

  html.sidebar-mini:not(.sidebar-peek) #layout-menu {
    overflow: hidden;
  }

  html.sidebar-mini:not(.sidebar-peek) #layout-menu .app-brand {
    padding: 0;
    justify-content: center;
  }

  html.sidebar-mini:not(.sidebar-peek) #layout-menu .app-brand-logo {
    display: none;
  }

  html.sidebar-mini:not(.sidebar-peek) #layout-menu .app-brand-mini {
    display: block;
    width: 2.25rem;
    height: 2.25rem;
    object-fit: contain;
  }

  html.sidebar-mini:not(.sidebar-peek) #layout-menu .sidebar-mini-hide {
    display: none !important;
  }

  /* Category headers become a short divider line */
  html.sidebar-mini:not(.sidebar-peek) #layout-menu .menu-header {
    padding: 0.6rem 0 !important;
    margin: 0 !important;
  }

  html.sidebar-mini:not(.sidebar-peek) #layout-menu .menu-header-text {
    display: none;
  }

  html.sidebar-mini:not(.sidebar-peek) #layout-menu .menu-header::before {
    content: "";
    display: block;
    width: 1.5rem;
    height: 1px;
    margin: 0 auto;
    background: currentColor;
    opacity: 0.25;
  }

  html.sidebar-mini:not(.sidebar-peek) #layout-menu .menu-inner > .menu-item > .menu-link {
    justify-content: center;
    margin: 0 0.75rem;
    padding-left: 0;
    padding-right: 0;
  }

  html.sidebar-mini:not(.sidebar-peek) #layout-menu .menu-inner > .menu-item > .menu-link > .menu-icon {
    margin-right: 0;
    font-size: 1.3rem;
  }

  html.sidebar-mini:not(.sidebar-peek) #layout-menu .menu-inner > .menu-item > .menu-link > div,
  html.sidebar-mini:not(.sidebar-peek) #layout-menu .menu-toggle::after,
  html.sidebar-mini:not(.sidebar-peek) #layout-menu .menu-sub,
  html.sidebar-mini:not(.sidebar-peek) #layout-menu .menu-inner-shadow {
    display: none !important;
  }

  /* Keep labels on one line while the width animates */
  html.sidebar-mini #layout-menu .menu-link > div {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* ---------- Expanded on hover: float over the page ---------- */
  /* Above the navbar and page (1075-1080) but below modals (backdrop 1089, modal 1090) */
  html.sidebar-mini.sidebar-peek #layout-menu {
    z-index: 1085;
    box-shadow: 0 0.5rem 2.5rem rgba(67, 89, 113, 0.25);
  }

  /* ---------- Navbar toggle button ---------- */
  #sidebar-mini-toggle {
    cursor: pointer;
  }

  #sidebar-mini-toggle i {
    transition: transform 0.2s ease;
  }

  html.sidebar-mini #sidebar-mini-toggle i {
    transform: rotate(180deg);
  }
}