/* SWAP OS 43.05.1 — FINAL RESPONSIVE SHELL CONTRACT
 * This file is intentionally loaded LAST.
 * It resolves earlier shell generations that override the same sidebar/taskbar rules.
 */

.swap-os-app,
.swap-os-main,
.swap-os-content,
.swap-os-topbar,
.swap-os-sidebar {
  box-sizing: border-box;
}

.swap-os-app,
.swap-os-main,
.swap-os-content {
  min-width: 0;
}

/* =========================================================
   DESKTOP >= 1200px
   Full sidebar + desktop floating taskbar.
   ========================================================= */
@media (min-width: 1200px) {
  body.swap-os-body .swap-os-sidebar {
    display: flex !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: fixed !important;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 228px !important;
    min-width: 228px !important;
    transform: none !important;
    z-index: 1400 !important;
  }

  body.swap-os-body .swap-os-main,
  body.swap-os-body.sidebar-collapsed .swap-os-main {
    margin-left: 228px !important;
    width: calc(100% - 228px) !important;
    max-width: none !important;
  }

  body.swap-os-body.sidebar-collapsed .swap-os-sidebar {
    width: 72px !important;
    min-width: 72px !important;
  }

  body.swap-os-body.sidebar-collapsed .swap-os-main {
    margin-left: 72px !important;
    width: calc(100% - 72px) !important;
  }

  body.swap-os-body .swap-mobile-nav {
    display: none !important;
  }

  body.swap-os-body .swap-desktop-taskbar {
    display: flex !important;
    position: fixed !important;
    left: 50% !important;
    bottom: 12px !important;
    transform: translateX(-50%) !important;
    z-index: 1150 !important;
  }

  body.swap-os-body .swap-os-content {
    padding-bottom: 112px !important;
  }
}

/* =========================================================
   LAPTOP 981–1199px
   Full sidebar, slightly narrower.
   ========================================================= */
@media (min-width: 981px) and (max-width: 1199px) {
  body.swap-os-body .swap-os-sidebar {
    display: flex !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: fixed !important;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 216px !important;
    min-width: 216px !important;
    transform: none !important;
    z-index: 1400 !important;
  }

  body.swap-os-body .swap-os-main,
  body.swap-os-body.sidebar-collapsed .swap-os-main {
    margin-left: 216px !important;
    width: calc(100% - 216px) !important;
    max-width: none !important;
  }

  body.swap-os-body .swap-mobile-nav {
    display: none !important;
  }

  body.swap-os-body .swap-desktop-taskbar {
    display: flex !important;
    position: fixed !important;
    left: 50% !important;
    bottom: 12px !important;
    transform: translateX(-50%) !important;
    z-index: 1150 !important;
  }

  body.swap-os-body .swap-os-content {
    padding-bottom: 112px !important;
  }
}

/* =========================================================
   TABLET 761–980px
   Compact icon rail + desktop taskbar.
   ========================================================= */
@media (min-width: 761px) and (max-width: 980px) {
  body.swap-os-body .swap-os-sidebar {
    display: flex !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: fixed !important;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 72px !important;
    min-width: 72px !important;
    transform: none !important;
    z-index: 1400 !important;
  }

  body.swap-os-body .swap-os-main,
  body.swap-os-body.sidebar-collapsed .swap-os-main {
    margin-left: 72px !important;
    width: calc(100% - 72px) !important;
    max-width: none !important;
  }

  body.swap-os-body .swap-os-sidebar .nav-label,
  body.swap-os-body .swap-os-sidebar .swap-nav-group-label,
  body.swap-os-body .swap-os-sidebar .nav-group-label,
  body.swap-os-body .swap-os-sidebar .swap-os-mini-user span,
  body.swap-os-body .swap-os-sidebar .swap-os-logout {
    display: none !important;
  }

  body.swap-os-body .swap-mobile-nav {
    display: none !important;
  }

  body.swap-os-body .swap-desktop-taskbar {
    display: flex !important;
  }

  body.swap-os-body .swap-os-content {
    padding-bottom: 112px !important;
  }
}

/* =========================================================
   MOBILE <= 760px
   Off-canvas sidebar + mobile bottom navigation.
   ========================================================= */
@media (max-width: 760px) {
  body.swap-os-body .swap-os-sidebar {
    display: flex !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: fixed !important;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: min(86vw, 300px) !important;
    min-width: 0 !important;
    transform: translateX(-105%) !important;
    z-index: 1500 !important;
  }

  body.swap-os-body.sidebar-open-mobile .swap-os-sidebar,
  body.swap-os-body.sidebar-open .swap-os-sidebar,
  body.swap-os-body .swap-os-sidebar.is-open,
  body.swap-os-body .swap-os-sidebar.open {
    transform: translateX(0) !important;
  }

  body.swap-os-body .swap-os-main,
  body.swap-os-body.sidebar-collapsed .swap-os-main {
    margin-left: 0 !important;
    width: 100% !important;
    max-width: none !important;
  }

  body.swap-os-body .swap-desktop-taskbar {
    display: none !important;
  }

  body.swap-os-body .swap-mobile-nav {
    display: grid !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 1600 !important;
  }

  body.swap-os-body .swap-os-content {
    padding-bottom: 104px !important;
  }
}

/* =========================================================
   SIDEBAR TEXT VISIBILITY HOTFIX
   ui-v2-final.css contains an older compact/icon-only sidebar
   rule at high specificity. Restore the full navigation labels
   on desktop and whenever the mobile drawer is open.
   ========================================================= */
@media (min-width: 981px) {
  body.swap-os-body .swap-os-sidebar .swap-nav-group-label,
  body.swap-os-body .swap-os-sidebar .nav-label,
  body.swap-os-body .swap-os-sidebar .swap-os-mini-user span,
  body.swap-os-body .swap-os-sidebar .swap-os-logout {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body.swap-os-body .swap-os-sidebar .swap-nav-group-label {
    padding: 12px 12px 6px !important;
    font-size: 10px !important;
    line-height: 1.2 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
  }

  body.swap-os-body .swap-os-sidebar .swap-os-nav-item,
  body.swap-os-body .swap-os-sidebar .swap-os-nav-utility {
    width: auto !important;
    min-width: 0 !important;
    justify-content: flex-start !important;
    gap: 11px !important;
  }

  body.swap-os-body .swap-os-sidebar .nav-label {
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
  }

  body.swap-os-body .swap-os-sidebar .swap-os-mini-user {
    justify-content: flex-start !important;
  }

  body.swap-os-body .swap-os-sidebar .swap-os-logout {
    text-align: center !important;
  }

  /* A collapsed sidebar intentionally remains icon-only. */
  body.swap-os-body.sidebar-collapsed .swap-os-sidebar .swap-nav-group-label,
  body.swap-os-body.sidebar-collapsed .swap-os-sidebar .nav-label,
  body.swap-os-body.sidebar-collapsed .swap-os-sidebar .swap-os-mini-user span,
  body.swap-os-body.sidebar-collapsed .swap-os-sidebar .swap-os-logout {
    display: none !important;
  }

  body.swap-os-body.sidebar-collapsed .swap-os-sidebar .swap-os-nav-item,
  body.swap-os-body.sidebar-collapsed .swap-os-sidebar .swap-os-nav-utility {
    width: 56px !important;
    justify-content: center !important;
    gap: 3px !important;
  }
}

@media (max-width: 760px) {
  body.swap-os-body .swap-os-sidebar .swap-nav-group-label,
  body.swap-os-body .swap-os-sidebar .nav-label,
  body.swap-os-body .swap-os-sidebar .swap-os-mini-user span,
  body.swap-os-body .swap-os-sidebar .swap-os-logout {
    visibility: visible !important;
    opacity: 1 !important;
  }

  body.swap-os-body .swap-os-sidebar .nav-label {
    display: inline !important;
  }

  body.swap-os-body .swap-os-sidebar .swap-nav-group-label {
    display: block !important;
  }

  body.swap-os-body .swap-os-sidebar .swap-os-nav-item,
  body.swap-os-body .swap-os-sidebar .swap-os-nav-utility {
    width: auto !important;
    justify-content: flex-start !important;
  }
}
