/*
  Copyright 2020 Roland Corporation. All rights reserved.
*/
/*
  Librarian
*/
/* page style */
.librarianPage {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: var(--color-black);
}
/* main frame */
.librarian_mainFrame__basic,
.librarian_mainFrame__tall {
  position: absolute;
  right: 0;
  left: 0;
  overflow: auto;
  background-color: var(--color-black);
}
.librarian_mainFrame__basic {
  top: 44px;
  height: calc(100% - 44px);
}
.librarian_mainFrame__tall {
  top: 0px;
  height: calc(100%);
}
/* header frame, footer frame */
.librarian_headerFrame {
  position: absolute;
  right: 0;
  left: 0;
  background-color: var(--color-secondary);
  height: 44px;
  top: 0;
}
.librarian_footerFrame {
  bottom: 0;
}

.librarian_headerLbl__withBackBtn {
  position: absolute;
  height: 44px;
  color: var(--color-white);
  font-size: 14px;
  line-height: 44px;
  letter-spacing: -0.34px;
  white-space: pre;
  left: 44px;
  font-family: RobotoItalic;
  width: 207px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/*
 Tab
*/
.librarianTab {
  position: absolute;
  overflow: hidden;
  top: 0;
  right: 0;
  left: 0;
  height: 44px;
  background-color: var(--color-black);
  box-shadow: inset 0 -1px 0 0 var(--color-green-darken-1);
}

.librarianTab label {
  float: left;
  height: 44px;
  color: var(--color-primary);
  font-size: 13px;
  line-height: 44px !important; /* ebuilder側でheightを指定しないと、style属性で0が指定されるため、importantにする。 */
  text-align: center;
}

.librarianTab label[checked] {
  box-shadow: inset 0 -5px 0 0 var(--color-primary);
}

.librarianHeaderBackBtn {
  position: absolute;
  top: 0;
  left: 0;
  width: 44px;
  height: 44px;
  background-image: url(../images/btn_back@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
}

/* Add */
.libraryAddBtn {
  position: absolute;
  top: 0;
  left: 0;
  width: 44px;
  height: 44px;
  background-image: url(../images/btn_add@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
}

/* Import, Export */
.libraryImportBtn {
  position: absolute;
  top: 0;
  right: 109px;
  width: 44px;
  height: 44px;
  background-image: url(../images/btn_dl@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
}

.libraryExportBtn {
  position: absolute;
  top: 0;
  right: 65px;
  width: 44px;
  height: 44px;
  background-image: url(../images/btn_ul@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
}

.librarianHeaderRightBtn {
  position: absolute;
  top: 10px;
  width: 57px;
  height: 22px;
  border: 1px solid var(--color-white);
  border-radius: 3px;
  color: var(--color-white);
  font-size: 14px;
  font-family: RobotoCondensedRegular;
  line-height: 22px;
  letter-spacing: -0.34px;
  text-align: center;
  right: 4px;
}
.librarianHeaderRightBtn {
  background-color: rgba(0,0,0,0);
}
.librarianHeaderRightBtn.pushing {
  background-color: var(--color-highlight);
}