/*
 * notion-enhancer
 * (c) 2020 dragonwocky <thedragonring.bod@gmail.com>
 * (c) 2020 TarasokUA
 * (c) 2020 Arecsu
 * (https://dragonwocky.me/) under the MIT license
 */

@import 'buttons.css';

.frameless .notion-topbar {
  height: calc(var(--configured-dragarea_height, 10px) + 45px) !important;
}
.frameless .window-dragarea {
  height: var(--configured-dragarea_height, 10px);
  width: 100%;
}
.frameless .notion-dark-theme .window-dragarea {
  background: var(--theme_dark--dragarea);
}
.frameless .notion-light-theme .window-dragarea {
  background: var(--theme_light--dragarea);
}

@media (max-width: 760px) {
  .frameless .notion-topbar {
    height: calc(var(--configured-dragarea_height, 10px) + 80px) !important;
  }
  .frameless .notion-topbar > :nth-child(2) {
    height: 80px !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  }
  .window-buttons-area {
    grid-row: 1;
    grid-column: 9 / span end;
    justify-content: flex-end;
  }
  .notion-topbar-breadcrumb {
    grid-row: 2;
    grid-column: 1 / span 8;
  }
  .notion-topbar-actions {
    grid-row: 2;
    grid-column: 9 / span end;
    justify-content: flex-end;
  }
}

/* hide topbar when sidebar is hidden */
.notion-sidebar-container[style*='width: 0px;'] + .notion-frame {
  height: calc(
    100% - (var(--configured-dragarea_height, 10px) + 45px)
  ) !important;
}
.notion-sidebar-container[style*='width: 0px;'] + .notion-frame .notion-topbar {
  opacity: 0 !important;
  transition: opacity 200ms ease-in-out !important;
}
.notion-sidebar-container[style*='width: 0px;']
  + .notion-frame
  .notion-topbar:hover {
  opacity: 1 !important;
}