/*
 Css file for Pirate Toy Fund Toy Tracking System Webpage
 */


 .col-1  {width: 8.33%;}
 .col-2  {width: 16.66%;}
 .col-3  {width: 25%;}
 .col-4  {width: 33.33%;}
 .col-5  {width: 41.66%;}
 .col-6  {width: 50%;}
 .col-7  {width: 58.33%;}
 .col-8  {width: 66.66%;}
 .col-9  {width: 75%;}
 .col-10 {width: 83.33%;}
 .col-11 {width: 91.66%;}
 .col-12 {width: 100%;}
 
 [class*="col-"] {
     float: left;
 }


/*
General Settings
 */

body {
  overflow-x: hidden;
  overflow-y: hidden;
}

.container-fluid {
    padding: 5% !important;
    overflow-y: auto;
    height: 90vh;
}

.removeBackgroundAndBorder {
    background: white;
    border: none;
}

.searchSortFilterIcons {
    color: #9997ad;
}

.tableHeadings {
    color: #9997ad;
}

.tableOptions {
  min-width: 900px;
}

.tableHeaderRow {
    border-bottom: 1px solid #9997ad;
    padding: 1%;
    min-width: 900px;
}

.tableDataRow {
    padding: 1%;
    border-top: 1px solid #9997ad;
    min-width: 900px;
}

.tableDataText {
    color: #282730;
    font-weight: bold;
}

.representative_contact_number {
  color: #9997ad;
}

.tableDataSelect {
  padding: 0;
  height: calc(1.5em + .75rem + 2px);
  width: 100%;
}

.tableDataTextInput {
  background: transparent;
  border: none;
}

.tableDataInput {
    border: 1px solid #9997ad;
}

.topMarginButon {
  margin-top: 3vh;
}

.exportButton {
    background-color: #383642!important;
    color: #f8f8ff!important;
    border: 1px solid #383642!important;
    border-radius: .25rem!important;
}

/*
General Settings
 */

/*
Sidebar
 */

#sidebar-wrapper {
  min-height: 100vh;
  margin-left: -16rem;
  -webkit-transition: margin 0.25s ease-out;
  -moz-transition: margin 0.25s ease-out;
  -o-transition: margin 0.25s ease-out;
  transition: margin 0.25s ease-out;
  background-color: #282730 !important;
  color: #dcdcdc;
}

#sidebar-wrapper .sidebar-heading {
  padding: 0.875rem 1.25rem;
  font-size: 1.2rem;
}

#sidebar-wrapper .list-group {
  width: 16rem;
  padding-top: 20%;
}

#page-content-wrapper {
  min-width: 100vw;
}

#wrapper.toggled #sidebar-wrapper {
  margin-left: 0;
}

.sidebar-heading {
  display: table;
  width: 100%;
}

.sidebarHeadingElement {
  display: table-cell;
  vertical-align: middle;
  font-size: 1.3em;
  padding-left: 3%;
}

.sidebarHeadingImage {
  display: table-cell;
  vertical-align: middle;
  width: 10vh;
  height: 10vh;
  background-image: url("../media/logoTransparent.png");
  background-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.navigationItem {
  text-decoration: none !important;
  font-size: 1.1em;
  background-color: #282730 !important;
  color: #dcdcdc;
  border: none;
  border-left: 5px solid transparent !important;
}

.navigationItem.childItem {
  padding-left: 25%;
}

.navigationItem.active {
  border-color:#dcdcdc !important;
  background-color: #383642 !important;
  color: #f8f8ff;
}

.navigationItem:hover {
  border-color:#dcdcdc !important;
  background-color: #383642 !important;
  color: #f8f8ff;
}

.icon {
  padding-right: 10%;
}

/*
Sidebar
 */

/*
Navigation
 */

.navbar {
  background-color: white !important;
  border: none !important;
}

#menu-toggle {
  background-color: #383642 !important;
  color: #f8f8ff;
  border: 1px solid #383642;
}

#menu-toggle:hover {
  background-color: #f8f8ff !important;
  color: #383642;
  border: 1px solid #383642;
}

.navbar-toggler {
  background-color: #383642 !important;
  color: #f8f8ff!important;
  border: 1px solid #383642!important;
  padding: .375rem .75rem!important;
  font-size: 1rem!important;
  line-height: 1.5!important;
}

.navbar-toggler:hover {
  background-color: #f8f8ff !important;
  color: #383642!important;
  border: 1px solid #383642!important;
}

#menuHeading {
  font-size: 1.7em;
  padding-left: 3%;
  color: #282730;
  width: 50%;
  margin-bottom: 0.25rem !important;
}

#userName {
  width: 15vw;
  text-align: right;
  color: #3b3a47;
  font-size: 1.3em;
  display: table-cell;
  vertical-align: middle;
}

#userImage {
  border-radius: 50%;
  width: 60px;
  height: 60px;
  display: table-cell;
  vertical-align: middle;
  margin-left: 2vw;
}

.navbar-nav {
  display: table;
}

#notificationButton {
  margin-left: .5rem;
}

#notificationIcon {
  font-size: 2em;
  color: #282730;
}

#notificationBadge {
  top: -2vh!important;
  display: none;
  border-radius: 50%;
}

/*
Navigation
 */

 /*
Dashboard
 */
.orderToysDiv {
  overflow-y: auto;
  border-radius: 10px;
  border: 1px solid #282730;
  padding: 3%;
}

#selectProgramPartner {
    border: none;
    width: auto;
    color: #282730;
}

#dashboardSearch {
    border: none;
    color: #282730;
}

.dashboardTextArea {
    color: #282730;
    margin-top: 5%;
    border-radius: 10px;
    border: 1px solid #282730;
}

.dashboardButtonsRow {
    margin-top: 5%;
}

.dashboardButton {
    border-radius: 20px;
    width: 100%;
    background: #9997ad;
    color: #282730;
    font-weight: bold;
    border: none;
}

.dashboardButton:hover {
    background: #282730;
    color: #9997ad;
}

 /*
Dashboard
 */

 /*
Program Partners
 */

 .activePartnersDiv {
  overflow-y: auto;
  border-radius: 10px;
  border: 1px solid #282730;
  padding: 3%;
}

.disabledPartnersDiv {
  margin-top: 5vh;
  overflow-y: auto;
  border-radius: 10px;
  border: 1px solid #282730;
  padding: 3%;
}

.programPartnerTableName {
  border: none;
  color: #282730;
  font-size: 1.3em;
  font-weight: bold;
}

.programPartnersButton {
  border: none;
}

.programPartnersDataTextButton {
  color: #282730;
  font-size: 1.5em;
}

.dataTextButton {
  color: #282730;
  font-size: 1.5em;
  width: 100%;
}

 /*
Program Partners
 */

 /*
Reports
 */

.inProgressReportsDiv {
  overflow-y: auto;
  border-radius: 10px;
  border: 1px solid #282730;
  padding: 3%;
  margin-bottom: 5vh;
  margin-top: 5vh;
}

.readyForPickupReportsDiv {
  overflow-y: auto;
  border-radius: 10px;
  border: 1px solid #282730;
  padding: 3%;
}
 
 /*
Reports
 */

/*
Inventory
 */

.inventoryDiv {
  margin-top: 5vh;
  margin-bottom: 5vh;
  overflow-y: auto;
  border-radius: 10px;
  border: 1px solid #282730;
  padding: 3%;
}

.categoryDiv {
  margin-top: 5vh;
  overflow-y: auto;
  border-radius: 10px;
  border: 1px solid #282730;
  padding: 3%;
}

/*
Inventory
 */

/*
Partnership Requests
 */

.partnershipRequestsInProgressDiv {
  border-radius: 10px;
  border: 1px solid #282730;
  padding: 3%;
  margin-bottom: 5vh;
}

.partnershipRequestsAcceptedDiv {
  border-radius: 10px;
  border: 1px solid #282730;
  padding: 3%;
  margin-bottom: 5vh;
}

.partnershipRequestsRejectedDiv {
  border-radius: 10px;
  border: 1px solid #282730;
  padding: 3%;
  margin-bottom: 5vh;
}

/*
Partnership Requests
 */

 /*
Account & Settings
 */

#editUserImage {
  border-radius: 50%;
  width: 100px;
  height: 100px;
}

.editImageUserName {
  padding: .375rem .75rem;
  font-size: 1.3em;
  color: #282730;
}

.editImageButton {
  border: none;
  font-size: 0.9em;
  color: #9997ad;
}

.informationAndPasswordSettingsDiv {
  margin-top: 5vh;
}

.accountAndSettingsButtonButton {
  margin-left: 5%;
  border-radius: 20px;
  width: 100%;
  background: #9997ad;
  color: #282730;
  font-weight: bold;
  border: none;
  float: right;
}

.accountAndSettingsButtonButton:hover {
  background: #282730;
  color: #9997ad;
}

.accountAndSettingsHeading {
  font-size: 1.5em;
  color: #9997ad;
  margin-bottom: 5vh;
  font-weight: normal;
  margin-top: 5vh;
}

.accountAndSettingsInputAndLabel {
  font-size: 1.2em;
  color: #282730;
}
 
 /*
Account & Settings
 */

  /*
History Modal
 */

.historyModalGroupDiv {
  overflow-y: auto;
  border-radius: 10px;
  border: 1px solid #282730;
  padding: 3%;
  margin-top: 2%;
  margin-bottom: 2%;
}

.historyModalTableInfo {
  border: none;
  color: #282730;
  font-size: 1rem;
  font-weight: bold;
}

.historyModalTab {
  text-decoration: none!important;
  font-size: 1.1em!important;
  background-color: #282730!important;
  color: #dcdcdc!important;
  border: none!important;
  text-align: center!important;
  border-radius: 0px!important;
  margin: 0!important;
  border-bottom: 5px solid #282730!important;
}

.historyModalTab:hover {
  background-color: #383642!important;
  color: #f8f8ff!important;
  border-color: #dcdcdc!important;
}

.historyModalTab.active {
  background-color: #383642!important;
  color: #f8f8ff!important;
  border-color: #dcdcdc!important;
}

.requestInformationTableHeading {
  text-align: center;
  font-size: 1.2em;
  font-weight: bold;
  margin-bottom: 3%;
}

.requestInformationTableData {
  text-align: center;
  font-size: 1.1em;
}

  /*
History Modal
 */

#editProgramPartnerModalBodyAnnualToysAndNotes table {
  width: 100%; 
  color: #282730; 
  border: 1px solid #282730; 
  margin-bottom: 5%;
}

#editProgramPartnerModalBodyAnnualToysAndNotes table td {
  padding: 2%;
}

#editProgramPartnerModalBodyAnnualToysAndNotes table tr {
  border: 1px solid #282730; 
}

#editProgramPartnerModalBodyAnnualToysAndNotes td:first-child {
  width: 55%;
}

.cursorPointer{
  cursor: pointer;
}

/* Small red error indicators */
.validationErrorDiv{
  color: #721c24!important;
  background-color: #f8d7da;
  border-color: #f5c6cb;
  margin: 0;
  display: none;
  transition: visibility 0s, opacity 0.5s linear;
}

#editPartnershipRequestModal table {
  width: 100%;
  margin-bottom: 2%;
}

#editPartnershipRequestModal th, td {
  border: 1px solid black;
  padding: 2%;
  text-align: center;
}

#editPartnershipRequestModal th {
  background-color: #efefef;
}

#partnershipRequestInformationModal table {
  width: 100%;
  margin-bottom: 2%;
}

#partnershipRequestInformationModal th, td {
  border: 1px solid black;
  padding: 2%;
  text-align: center;
}

#partnershipRequestInformationModal th {
  background-color: #efefef;
}

.tab-content table td, th {
  text-align: left;
}

/*
Media Queries
 */

@media (min-width: 768px) {
  #sidebar-wrapper {
    margin-left: 0;
  }

  #page-content-wrapper {
    min-width: 0;
    width: 100%;
  }

  #wrapper.toggled #sidebar-wrapper {
    margin-left: -16rem;
  }
}

#editPartnershipRequestModalHeading {
  justify-content: flex-end;
}

#partnershipRequestInformationModalHeading {
  justify-content: flex-end;
}

#partnershipRequestInformationModalHeading button {
  margin-right: .25rem;
  margin-left: .25rem;
}

.todo {
color: red!important;
}

.disableUser {
background-color: orange;
border-color: orange;
}

#makeRequestModal .col-2 {
  max-width: 11%;
}

#activeProgramPartnersTable th:not(:first-child):not(:nth-child(2)) {
  text-align: center;
}

#inProgressPartnershipRequestsTable th:not(:first-child):not(:nth-child(2)) {
  text-align: center;
}

#inProgressPartnershipRequestsTable td:not(:first-child):not(:nth-child(2)) {
  text-align: center;
}

#rejectedPartnershipRequestsTable th:not(:first-child):not(:nth-child(2)) {
  text-align: center;
}

#disabledProgramPartnersTable th:not(:first-child):not(:nth-child(2)) {
  text-align: center;
}

#disabledProgramPartnersTable td:not(:first-child):not(:nth-child(2)) {
  text-align: center;
}

.modal-header-buttons button {
  margin-right: .25rem;
  margin-left: .25rem;
}

.modal-header-buttons button:last-child {
  margin-right: 0;
}

.purple {
  background-color: purple;
  border-color: purple;
}

#inProgressRequestsTable th:not(:first-child):not(:nth-child(2)) {
  text-align: center;
}

#inProgressRequestsTable td:not(:first-child):not(:nth-child(2)) {
  text-align: center;
}

#readyRequestsTable th:not(:first-child):not(:nth-child(2)) {
  text-align: center;
}

#readyRequestsTable td:not(:first-child):not(:nth-child(2)) {
  text-align: center;
}