@use '../../style/themes/default.scss' as *;
@use '../../style/util.scss' as *;

/* 移动端 */
.ele-admin-mobile {
  .ele-admin-logo,
  .ele-admin-sidebar {
    position: fixed !important;
    left: 0 !important;
    width: eleVar('sidebar', 'width') !important;
    z-index: calc(eleVar('layout', 'mask-index') + 1) !important;
  }

  .ele-admin-sidebar {
    top: eleVar('header', 'height') !important;
    height: calc(100vh - #{eleVar('header', 'height')}) !important;
  }

  .ele-admin-logo > img + h1 {
    display: block !important;
  }

  &:not(.ele-admin-collapse) .ele-admin-header {
    z-index: auto !important;
  }

  .ele-admin-body,
  .ele-admin-header {
    padding-left: 0 !important;
    width: 100% !important;
  }

  .ele-admin-body > .ele-admin-tabs {
    left: 0 !important;
  }

  .ele-admin-breadcrumb,
  .ele-admin-sidebox {
    display: none;
  }

  &:not(.ele-admin-collapse) .ele-admin-mask {
    left: eleVar('sidebar', 'width');
    background: elVar('overlay-color', 'lighter');
    visibility: visible;
  }

  &.ele-admin-collapse .ele-admin-sidebar,
  &.ele-admin-collapse .ele-admin-logo {
    left: calc(0px - eleVar('sidebar', 'width')) !important;
    box-shadow: none !important;
  }

  &.ele-admin-open-tab:not(.ele-admin-tab-card) .ele-admin-header {
    box-shadow: 0 -0.8px 0 eleVar('header', 'line-color') inset !important;

    &.is-dark,
    &.is-primary {
      box-shadow: eleVar('header', 'dark-shadow');
    }
  }
}