/*
  Contents
  1. Login Styling
  2. Global Styling
  3. Template Styling
  4. Homepage Styling
  4. DataTable Styling
  5. Modal Styling
  6. User Styling
  7. Client Styling
  8. Order Styling
  9. Specification Styling
  10. Stock Styling
  11. Product Styling
  12. PDF Styling
*/

/****************************************
*****************************************
          Login Styling
*****************************************
****************************************/

.login-sidebar {
  background-color: #8F1017;
  box-shadow: 10px 2px 20px -2px rgba(0,0,0,0.25);
}

.login-button {
  background-color: #8F1017 !important;
}

.login-button:hover {
  background-color: #c0353c !important;
}

.login-text-sidebar {
  color: rgb(165, 16, 24) !important;
}

.login-text {
  color: white;
}

.error-messages div:nth-child(1) {
  margin-top: -20px !important;
}

/****************************************
*****************************************
            Global Styling
*****************************************
****************************************/

.hidden-post-field {
  display: none !important;
}

.custom-container {
  width: 100%;
}

.cursor-hover-link:hover {
  cursor: pointer !important;
}

#kt_wrapper {
  padding-top: 85px !important;
}

.container {
  margin-bottom: 50px !important;
}

.blue-colour {
  color: #2197B6 !important;
}

.edit-button {
  background-color: rgb(64, 197, 64) !important;
  color: white !important;
  padding: 5px 1px 5px 9px !important;
  border-radius: 3px !important;
}

.edit-button span i {
  color: white !important;
}

.edit-button:hover {
  background-color: darkgreen !important;
}

.undo-button {
  background-color: #f5b942 !important;
  color: white !important;
  padding: 5px 5px 5px 8px !important;
  border-radius: 3px !important;
  margin-left: 5px;
}

.undo-button span i {
  color: white !important;
}

.undo-button:hover {
  background-color: darkorange !important;
}

.use-button {
  background-color: rgb(0, 183, 255) !important;
  color: white !important;
  padding: 5px 5px 5px 9px !important;
  border-radius: 3px !important;
  margin-right: 10px;
}

.use-button span i {
  color: white;
}

.use-button:hover {
  background-color: rgb(96, 208, 252) !important;
}

.delete-button {
  background-color: red !important;
  color: white !important;
  padding: 5px 6px 5px 8.5px !important;
  border-radius: 3px !important;
  margin-left: 10px !important;
}

.delete-button span i {
  color: white !important;
}

.delete-button:hover {
  background-color: darkred !important;
}

.duplicate-button {
  background-color: orange !important;
  color: white !important;
  padding: 5px 6px 5px 9px !important;
  border-radius: 3px !important;
  margin-left: 10px !important;
}

.duplicate-button span i {
  color: white !important;
}

.duplicate-button:hover {
  background-color:darkorange !important;
}

.task-button {
  background-color: rgb(0, 174, 255) !important;
  color: white !important;
  padding: 5px 6px 5px 7px !important;
  border-radius: 3px !important;
  margin-left: 10px !important;
}

.task-button span i {
  color: white !important;
}

.add-button {
  background-color: #8F1017 !important;
  color: white !important;
  padding: 11px 15px 11px 15px !important;
  border-radius: 4px !important;
  height: 46px !important;
}

.add-button:hover {
  background-color: #c0353c !important;
  color: white !important;
}

.duplicate-button {
  background-color: #F5F8FA !important;
  border: 2px solid #8F1017 !important;
  color: #8F1017 !important;
  padding: 9px 15px 9px 15px !important;
  border-radius: 4px !important;
  /* height: 42px !important; */
}

.duplicate-button:hover {
  background-color: #8F1017 !important;
  color: white !important;
}

.archive-button {
  background-color: #d92e2e !important;
  color: white !important;
  padding: 11px 15px 11px 15px !important;
  border-radius: 4px !important;
  height: 46px !important;
}

.archive-button:hover {
  background-color: #b32525 !important;
  color: white !important;
}

.submit-button {
  background-color: #8F1017 !important;
  color: white !important;
  border-radius: 5px !important;
  height: 45px !important;
}

.submit-button:hover {
  background-color: #c0353c !important;
}

input {
  background-color: white !important;
  border: 1px solid lightgrey !important;
}

.invisible-label span {
  color: #F5F8FA !important;
}

select,
.input-dropdown {
  width: 100% !important;
  height: 46px !important;
  background-color: white !important;
  border: 1px solid lightgrey !important;
  border-radius: 5px !important;
  -webkit-appearance: menulist !important;
  padding-left: 15px !important;
  font-size: 14px !important;
  color: #5E6278 !important;
  font-weight: 500;
}

.red-label {
  color: #8F1017 !important;
}

.disabled-dropdown {
  opacity: 0.6 !important;
  pointer-events: none !important;
}

.input-textarea {
  width: 100% !important;
  background-color: white !important;
  border: 1px solid lightgrey !important;
  border-radius: 5px !important;
  padding-left: 15px !important;
  padding-top: 10px !important;
  margin-bottom: -5px !important;
  font-size: 14px !important;
  color: #5E6278 !important;
  font-weight: 500 !important;
}

.input-textarea-one-line {
  width: 100% !important;
  background-color: white !important;
  border: 1px solid lightgrey !important;
  border-radius: 5px !important;
  padding-left: 15px !important;
  padding-top: 11px !important;
  padding-bottom: 11px !important;
  margin-bottom: -5px !important;
  font-size: 14px !important;
  color: #5E6278 !important;
  font-weight: 500 !important;
}

table tbody tr td {
  vertical-align: top;
}

table thead tr th {
  vertical-align: top !important;
}

.cursor-change-class {
  cursor: pointer !important;
}

.file-input {
  width: 100%;
  height: 45px;
  padding-top: 9px;
  padding-left: 17.5px;
  border-radius: 5px;
}

.empty-datatable-th {
  display: none !important;
}

table thead tr th:first-child {
  padding-left: 0px !important;
}

table thead tr th {
  padding-left: 10px !important;
}

.pricing-div {
  height: 40px;
  width: 40px;
  padding-top: 7px;
  margin-left: 28.5px;
  margin-top: 2.5px;
  text-align: center;
  border-radius: 100%;
  border: 1px solid #8F1018;
  background-color: #8F1018;
}

.pricing-div:hover {
  background-color: transparent;
}

.pricing-div:hover .pricing-icon {
  color: #8F1018;
}

.pricing-div .pricing-icon {
  font-size: 24px;
  color: white;
}

/****************************************
*****************************************
             Template Styling
*****************************************
****************************************/

#kd_post .content {
  background: white !important;
}

.initials-area {
  /* background-color: #8F1017 !important; */
  background: #8F1017 !important;
  color: white !important;
  font-weight: 700 !important;
  padding: 10px !important;
}

.initials-area:hover {
  /* background-color: #C0353C !important; */
  background-color: #c0353c !important;
}

.sidemenu-header,
.sidemenu-area {
  background-color: #8F1017 !important;
  color: white !important;
}

.menu-item-proshim {
  display: block;
  padding: 0;
}

.menu-item-proshim .menu-link {
  cursor: pointer;
  display: flex;
  align-items: center;
  padding: 0;
  flex: 0 0 100%;
  padding: .65rem 1rem;
  transition: none;
  outline: 0 !important;
  padding-left: 25px;
  height: 40px;
}

.menu-item-proshim .menu-link:hover span {
  color: white !important;
}

.menu-item-proshim:hover {
  background-color: #8F1017 !important;
}

/* Style the buttons that are used to open and close the accordion panel */
.custom-accordion {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s;
}

.menu-item.menu-accordion.show:not(.hiding):not(.menu-dropdown)>.menu-link .menu-arrow:after,.menu-item.menu-accordion.showing:not(.menu-dropdown)>.menu-link .menu-arrow:after {
  transform: rotateZ(90deg);
  transition: transform .3s ease;
}

[direction=rtl] .menu-item.menu-accordion.show:not(.hiding):not(.menu-dropdown)>.menu-link .menu-arrow:after,[direction=rtl] .menu-item.menu-accordion.showing:not(.menu-dropdown)>.menu-link .menu-arrow:after {
  transform: rotateZ(-90deg);
}

.menu-sub-dropdown {
  display: none;
  border-radius: .475rem;
}

.aside-dark .menu .menu-item .menu-link:hover:not(.disabled):not(.active), .aside-dark .menu .menu-item.hover>.menu-link:not(.disabled):not(.active) {
  background-color: #8F1017 !important;
}

.aside-dark .menu .menu-item .menu-link:hover:not(.disabled):not(.active), .aside-dark .menu .menu-item.hover>.menu-link:not(.disabled):not(.active) span {
  color: white !important;
}

.users-menu-item:hover .users-menu-title,
.stock-menu-item:hover .stock-menu-title,
.admin-menu-item:hover .admin-menu-title {
  color: white !important;
}

.view-admin-item:hover .view-admin-span,
.view-users-item:hover .view-users-span,
.view-stock-item:hover .view-stock-span,
.add-stock-item:hover .add-stock-span,
.archived-orders-item:hover .archived-orders-span {
  color: white !important;
}


.menu-item span {
  color: #043251 !important;
}

.menu-arrow {
  color: black !important;
}

.side-menu-item span {
  color: white !important;
  font-weight: bold !important;
}

.header-logo {
  width: 65% !important;
  margin-top: 17% !important;
  margin-left: 17.5% !important;
}

.menu-area-title span {
  color: black !important;
  font-weight: bold !important;
}

.menu-accordion:clicked {
  background-color: orange !important;
}

.top-level-search {
  height: 38px !important;
  border-radius: 5px !important;
  margin-top: 12.5px !important;
  margin-left: 10px !important;
  width: 400px !important;
  padding-left: 10px;
}

.template-submit-button {
  color: rgb(114, 114, 114) !important;
  background-color: lightgrey !important;
  border-radius: 5px !important;
  height: 38px !important;
  border: 1px solid lightgrey !important;
  margin-top: 15px !important;
}

.template-submit-button:hover {
  background-color: transparent !important;
  border: 1px solid lightgrey !important;
  color: rgb(114, 114, 114) !important;
}

.sign-out-button {
  /* background: #8F1017 !important; */
  background: white !important;
  border: 1px solid white !important;
}

.sign-out-button:hover {
  /* background: #c0353c !important; */
  background: transparent !important;
  border: 1px solid white !important;
  color: white !important;
}

.sign-out-button span {
  color: #8F1017 !important;
}

.sign-out-button:hover span {
  color: white !important;
}

.sign-out-link span {
  color: #8F1017 !important;
}

.sign-out-label {
  color: white !important;
}

.primary-link {
  color: black;
}

.primary-link:hover {
  color: #8F1017;
}

/****************************************
*****************************************
             Homepage Styling
*****************************************
****************************************/

.homepage-order-col,
.homepage-cost-col,
.homepage-update-col {
  width: 12.5%;
}

.homepage-specs-col {
  width: 14%;
}

.homepage-name-col,
.homepage-client-col {
  width: 24.25%;
}

.homepage-name-col,
.homepage-cost-col,
.homepage-update-col,
.homepage-specs-col,
.homepage-client-col {
  padding-left: 0px !important;
}

.homepage-orders-table .inner-row {
  border-bottom: 1px solid lightgrey;
  height: 60px !important;
  padding-top: 15px !important;
  vertical-align: middle !important;
}

.homepage-orders-table .inner-row td {
  vertical-align: middle !important;
}

.homepage-orders thead {
  padding-bottom: 115px !important;
}

.spec-count-list-icon,
.dashboard-eye-icon {
  color: white !important;
  background-color: #8F1018 !important;
  padding: 3.5px 3.5px 3.5px 4px !important;
  border-radius: 5px !important;
  margin-right: 5px !important;
  font-size: 16px !important;
}

.dashboard-link {
  text-decoration: none !important;
  color: #181c32 !important;
}

/* Dashboard Specification Progress Bar */

progress,
progress::-webkit-progress-bar {
  background-color: lightgrey !important;
  height: 10px !important;
  width: 300px !important;
  border-radius: 10px !important;
}

progress::-webkit-progress-value {
  border-radius: 10px !important;
  background-color: #8F1018 !important;
}

.progress-bar-label {
  min-width: 300px !important;
  font-size: 18px !important;
  font-weight: 600 !important;
}

/****************************************
*****************************************
           Datatable Styling
*****************************************
****************************************/

#activateDataTable_length {
  width: 30% !important;
  margin-bottom: 20px !important;
  margin-top: 10px !important;
}

#activateDataTable_length label {
  width: 50% !important;
}

#activateDataTable_filter {
  margin-top: 10px !important;
}

#activateDataTable_length select {
  width: 35% !important;
  height: 30px !important;
  padding-left: 2.5px !important;
  font-size: 14px !important;
  margin-right: 5px !important;
  margin-left: 5px !important;
}

#activateDataTable_wrapper td {
  background-color: #F5F8FA !important;
}

#activateDataTable {
  margin-bottom: 15px !important;
  padding-top: 15px !important;
  padding-bottom: 25px !important;
  border-top: 1px solid #BFC2C8 !important;
  border-bottom: 1px solid #BFC2C8 !important;
}

#activateDataTable_info {
  margin-top: 7.5px !important;
}

/****************************************
*****************************************
           Modal Styling
*****************************************
****************************************/

.modal {
  display: none;
  margin: 0 auto !important;
  position: fixed;
  z-index: 1;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0,0.4);;
}

.modal-content {
  background-color: #fefefe;
  padding: 40px 20px 20px 0px;
  border: 1px solid #888;
  width: 50% !important;
  margin: 0 auto;
  margin-top: 2%;
  margin-bottom: 2%;
  display: table-cell;
  vertical-align: middle;
}

.close {
  color: #aaa;
  margin-left: 99%;
  margin-top: -35px !important;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

.change-log-modal-content {
  max-height: 92vh;
  overflow: scroll;
  overflow-x: hidden;
  margin-bottom: 1%;
  padding-bottom: 10px;
}

.change-log-modal-content::-webkit-scrollbar {
  width: 12px;
  border-radius: 0px 5px 5px 0px;
}

.change-log-modal-content::-webkit-scrollbar-thumb {
  border-radius: 0px 5px 5px 0px;
}

.change-modal-view-container {
  margin-bottom: 0px !important;
}

.change-modal-view-container hr:last-child {
  display: none;
}

/* === Second Modal / Generate PDF Options === */

.modal2 {
  display: none;
  margin: 0 auto !important;
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0,0.4);;
}

.modal-content2 {
  background-color: #fefefe;
  padding: 10px 20px 20px 30px;
  border: none;
  width: 50vw !important;
  margin-top: 2%;
  margin-bottom: 2%;
  margin-left: 25%;
  border-radius: 5px;
}

.close2 {
  color: #aaa;
  margin-left: 99%;
  margin-top: -35px !important;
  font-size: 28px;
  font-weight: bold;
}

.close2:hover,
.close2:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

.change-log-modal-content2 {
  max-height: 92vh;
  overflow: scroll;
  overflow-x: hidden;
  margin-bottom: 1%;
  padding-bottom: 10px;
}

.change-log-modal-content2::-webkit-scrollbar {
  width: 12px;
  border-radius: 0px 5px 5px 0px;
}

.change-log-modal-content2::-webkit-scrollbar-thumb {
  border-radius: 0px 5px 5px 0px;
}

.change-modal-view-container2 {
  margin-bottom: 0px !important;
}

.change-modal-view-container2 hr:last-child {
  display: none;
}

/****************************************
*****************************************
             Users Styling
*****************************************
****************************************/

.users-view-table .users-view-empty-th {
  width: 10% !important;
}

.users-view-table .users-view-populated-th {
  width: 45% !important;
}

.users-view-table .users-td {
  text-align: right;
}

.users-view-table .users-td span {
  padding-right: 3px;
}

.access-level-row {
  margin-top: -10px !important;
}

/****************************************
*****************************************
             Clients Styling
*****************************************
****************************************/

.clients-view-table .clients-view-empty-th {
  width: 10% !important;
}

.clients-view-table .clients-view-populated-th {
  width: 45% !important;
}

.clients-view-table .clients-td {
  text-align: right;
}

.clients-view-table .clients-td span {
  padding-right: 3px;
}

.add-new-client-button,
.client-list-button {
  color: #8F1017;
}

.add-new-client-button:hover,
.client-list-button:hover {
  color: #8F1017;
  cursor: pointer;
}

.clients-orders .client-order-col {
  width: 16.66%;
  padding-left: 0px !important;
}

.clients-orders tr {
  height: 7vh;
}

/****************************************
*****************************************
             Orders Styling
*****************************************
****************************************/


.orders-view-table .orders-view-empty-th {
  width: 15% !important;
  text-align: right !important;
}

.orders-view-table .orders-view-populated-th {
  width: 14.16% !important;
}

.quotations-view-table .quotations-view-empty-th {
  width: 10% !important;
  text-align: right !important;
}

.quotations-view-table .quotations-view-populated-th {
  width: 12.85% !important;
}

.orders-view-table .order-td {
  text-align: right !important;
}

.orders-view-table .order-td span {
  padding-right: 3px;
}

.orders-edit-button {
  background-color: rgb(64, 197, 64) !important;
  color: white !important;
  padding: 5px 3.5px 5px 8px !important;
  border-radius: 3px !important;
}

.orders-edit-button span i {
  color: white !important;
}

.orders-edit-button:hover {
  background-color: darkgreen !important;
}

.orders-view-button {
  background-color: rgb(0, 119, 255) !important;
  color: white !important;
  padding: 5px 2.5px 5px 7px !important;
  margin-right: 5px;
  border-radius: 3px !important;
}

.orders-view-button:hover {
  background-color: rgb(0, 47, 255) !important;
}

.orders-view-button i {
  color: white;
}

.orders-download-button {
  background-color: rgb(179, 179, 179) !important;
  color: white !important;
  padding: 5px 8.5px 5px 8.5px !important;
  border-radius: 3px !important;
  margin-left: 10px !important;
}

.orders-download-button:hover {
  background-color: rgb(146, 146, 146) !important;
}

.orders-download-button i {
  color: white;
}

.order-notes-populated-th-large,
.order-notes-populated-th-small {
  width: 47.5%;
}

.order-notes-empty-th {
  width: 5%;
}

.order-note-delete-button {
  background-color: red !important;
  color: white !important;
  padding: 5px 8.5px 5px 8.5px !important;
  border-radius: 3px !important;
  margin-left: 10px !important;
}

.order-note-delete-button span i {
  color: white !important;
}

.order-note-delete-button:hover {
  background-color: darkred !important;
}

.change-log-icon i {
  font-size: 15px;
}

.dispatch-icon {
  color: white !important;
  background-color: #8F1018 !important;
  padding: 5px !important;
  border-radius: 5px !important;
  font-size: 16px !important;
  margin-top: -10px !important;
}



/****************************************
*****************************************
          Specification Styling
*****************************************
****************************************/

.back-button {
  background-color: #8F1017 !important;
  height: 35px !important;
  margin-left: 15px !important;
  padding-bottom: 30px !important;
  color: white !important;
}

.back-button:hover {
  background-color: #c0353c !important;
}

.back-button i {
  color: white !important;
}

.specification-view-form label {
  margin-top: 12.5px;
}

.specification-view-form .two-lines {
  margin-top: 4px;
}

.specification-view-form .specification-price-div {
  margin-left: 12.5px;
  margin-top: 0px;
  background-color: rgb(243, 243, 64);
  border: 1px solid grey;
  width: 40%;
  height: 45px;
  text-align: center;
  padding-top: 12.5px;
  border-radius: 5px;
}

.labour-percentage-divider {
  width: 89%;
}

.specification-view-table .specification-view-empty-th {
  width: 17.5% !important;
}

.specification-view-table .specification-icon-td {
  text-align: right !important;
}

.specification-view-table .specification-view-populated-th {
  width: 40% !important;
}

.duplicate-submission-button {
  width: 40%;
  padding-left: 8.5px !important;
  background-color: #8F1017 !important;
  color: white !important;
  border-radius: 5px !important;
  height: 45px !important;
  margin-left: 12.5px;
  text-align: center !important;
  font-size: 12.5px !important;
}

@media only screen and (max-width: 1500px) {
  .duplicate-submission-button {
    font-size: 12px !important;
    padding-left: 3px !important;
  }
}

.duplicate-submission-button:hover {
  background-color: #c0353c !important;
}

.specification-submission-button {
  width: 40%;
  padding-left: 13.5px !important;
  background-color: #8F1017 !important;
  color: white !important;
  border-radius: 5px !important;
  height: 45px !important;
  margin-left: 12.5px;
  text-align: center !important;
  font-size: 14px !important;
}

@media only screen and (max-width: 1500px) {
  .specification-submission-button {
    padding-left: 6px !important;
  }
}

.specification-submission-button:hover {
  background-color: #c0353c !important;
}

.specification-edit-button {
  width: 40%;
  padding-left: 12.5px !important;
  background-color: #8F1017 !important;
  color: white !important;
  border-radius: 5px !important;
  height: 45px !important;
  margin-left: 12.5px;
  text-align: center !important;
  font-size: 14px !important;
}

.specification-edit-button:hover {
  background-color: #c0353c !important;
}

@media only screen and (max-width: 1500px) {
  .specification-edit-button {
    padding-left: 6px !important;
  }
}

.specification-filter-button {
  background-color: #2197B6 !important;
  color: white !important;
  border-radius: 5px !important;
  font-size: 14px;
  height: 46px !important;
  width: 100%;
  border: none !important;
  margin-top: 0px !important;
}

.specification-filter-button:hover {
  background-color: #41cbf0 !important;
}

.specification-reset-button {
  border: 2px solid #2197B6 !important;
  background-color: #F5F8FA !important;
  color: #2197B6 !important;
  border-radius: 5px !important;
  font-size: 14px;
  height: 46px !important;
  width: 100%;
}

.specification-reset-button:hover {
  border: 2px solid #2197B6 !important;
  background-color: #2197B6 !important;
  color: white !important;
  border-radius: 5px !important;
  font-size: 14px;
  height: 46px !important;
  width: 100%;
}

.specification-filter-list {
  margin-top: 28px;
  margin-bottom: -5px;
}

.specification-filter-search {
  height: 46px !important;
  border-radius: 5px !important;
  width: 100% !important;
  padding-left: 10px;
  border: 2px;
  font-size: 14px;
}

/** Order View Specification Styling **/

.orders-specifications-populated-th {
  width: 37.5% !important;
}

.orders-specifications-empty-th {
  width: 25% !important;
}

.specification-blank-table-heading {
  text-align: right !important;
}

.orders-specifications-edit-button {
  background-color: rgb(64, 197, 64) !important;
  color: white !important;
  padding: 5px 3px 5px 8px !important;
  border-radius: 3px !important;
}

.orders-specifications-edit-button span i {
  color: white !important;
}

.orders-specifications-edit-button:hover {
  background-color: darkgreen !important;
}

.orders-specifications-print-button {
  background-color: grey !important;
  color: white !important;
  padding: 5px 5px 5px 8.5px !important;
  border-radius: 3px !important;
  margin-left: 10px !important;
}

.orders-specifications-print-button span i {
  color: white !important;
}

.orders-specifications-print-button:hover {
  background-color: darkgrey !important;
}

.orders-specifications-delete-button {
  background-color: red !important;
  color: white !important;
  padding: 5px 8.5px 5px 8.5px !important;
  border-radius: 3px !important;
  margin-left: 10px !important;
}

.orders-specifications-delete-button span i {
  color: white !important;
}

.orders-specifications-delete-button:hover {
  background-color: darkred !important;
}

.orders-specifications-duplicate-button {
  background-color: orange !important;
  color: white !important;
  padding: 5px 5px 5px 8px !important;
  border-radius: 3px !important;
  margin-left: 10px !important;
}

.orders-specifications-duplicate-button:hover {
  background-color:darkorange !important;
}

.orders-specifications-duplicate-button span i {
  color: white !important;
}

.orders-specifications-task-button {
  background-color: rgb(0, 174, 255) !important;
  color: white !important;
  padding: 5px 5px 5px 7px !important;
  border-radius: 3px !important;
  margin-left: 10px !important;
}

.orders-specifications-task-button:hover {
  background: rgb(0, 153, 255) !important;
}

.orders-specifications-task-button span i {
  color: white !important;
}

/* Specification Tasks */

.specification-task-container .sub-hr {
  color: rgb(190, 190, 190) !important;
}

.specification-completed-button {
  background-color: #8F1017 !important;
  color: white !important;
  padding: 13px 15px 13px 15px !important;
  border-radius: 4px !important;
  height: 48px !important;
}

.specification-completed-button:hover {
  background-color: #c0353c !important;
  color: white !important;
}

/* .specification-undo-button {
  background-color: transparent !important;
  color: #8F1017 !important;
  border: 2px solid #8F1017 !important;
  padding: 11px 15px 11px 15px !important;
  border-radius: 4px !important;
  margin-left: 15px;
} */

.specification-undo-button {
  background-color: transparent !important;
  color: #8F1017 !important;
  border: 2px solid #8F1017 !important;
  border-radius: 4px !important;
  border-radius: 50px !important;
  padding: 0px 9px 7px 9px;
  margin-left: 15px;
}

.specification-undo-button i {
  color: #8F1017;
  font-size: 18px;
}

.specification-undo-button:hover {
  background-color: #8F1017 !important;
}

.specification-undo-button:hover i {
  color: white !important;
}

.specification-checked-button {
  background-color: rgb(1, 207, 80) !important;
  border: 2px solid rgb(1, 207, 80) !important;
  color: white !important;
  border-radius: 50px !important;
  padding: 0px 9px 7px 9px;
}

.specification-checked-button i {
  color: white;
  font-size: 18px;
}

.spec-task-row-align {
  display: flex !important;
  align-items: center !important;
  align-content: middle !important;
}

/* Specification List Styling */

.specification-list-edit-button {
  background-color: rgb(64, 197, 64) !important;
  color: white !important;
  padding: 4px 2px 4px 8px !important;
  border-radius: 3px !important;
}

.specification-list-edit-button span i {
  color: white !important;
}

.specification-list-edit-button:hover {
  background-color: darkgreen !important;
}

.specification-list-duplicate-button {
  background-color: orange !important;
  color: white !important;
  padding: 4px 4px 4px 8px !important;
  border-radius: 3px !important;
  margin-left: 10px !important;
}

.specification-list-duplicate-button span i {
  color: white !important;
}

.specification-list-duplicate-button:hover {
  background-color:darkorange !important;
}

.specification-list-delete-button {
  background-color: red !important;
  color: white !important;
  padding: 4px 7px 4px 7px !important;
  border-radius: 3px !important;
  margin-left: 10px !important;
}

.specification-list-delete-button span i {
  color: white !important;
}

.specification-list-delete-button:hover {
  background-color: darkred !important;
}

/** Safari Only Styling **/

_::-webkit-full-page-media, _:future, :root .safari-textarea {
  -webkit-appearance: textarea !important;
  padding-left: 10px !important;
}

_::-webkit-full-page-media, _:future, :root .safari-dropdown {
  -webkit-appearance: none !important;
  background: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0Ljk1IDEwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9LmNscy0ye2ZpbGw6IzQ0NDt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmFycm93czwvdGl0bGU+PHJlY3QgY2xhc3M9ImNscy0xIiB3aWR0aD0iNC45NSIgaGVpZ2h0PSIxMCIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIxLjQxIDQuNjcgMi40OCAzLjE4IDMuNTQgNC42NyAxLjQxIDQuNjciLz48cG9seWdvbiBjbGFzcz0iY2xzLTIiIHBvaW50cz0iMy41NCA1LjMzIDIuNDggNi44MiAxLjQxIDUuMzMgMy41NCA1LjMzIi8+PC9zdmc+) no-repeat 99.5% 35% !important;
  background-color: white !important;
}

_::-webkit-full-page-media, _:future, :root .safari-update-button {
  font-size: 13px !important;
  padding-left: 8.5px !important;
}

/** Firefox Only **/

@-moz-document url-prefix() {
  .safari-update-button {
    padding-left: 8.5px !important;
  }
}

/****************************************
*****************************************
             Stock Styling
*****************************************
****************************************/

.stock-view-populated-th {
  width: 30% !important;
}

.stock-view-empty-th {
  width: 10% !important;
}

.stock-table .stock-empty-td {
  text-align: right !important;
}

.stock-edit-button {
  background-color: rgb(64, 197, 64) !important;
  color: white !important;
  padding: 5px 4px 5px 8px !important;
  border-radius: 3px !important;
}

.stock-edit-button span i {
  color: white !important;
}

.stock-edit-button:hover {
  background-color: darkgreen !important;
}

.stock-add-form {
  outline: none; 
}

.stock-delete-button {
  background-color: red !important;
  color: white !important;
  padding: 5px 7.5px 5px 8.5px !important;
  border-radius: 3px !important;
  margin-left: 10px !important;
}

.stock-delete-button span i {
  color: white !important;
}

.stock-delete-button:hover {
  background-color: darkred !important;
}

/****************************************
*****************************************
            Product Styling
*****************************************
****************************************/

.product-view-populated-th-small {
  width: 20%;
}

.product-view-populated-th-large {
  width: 50%;
}

.product-view-empty-th {
  width: 10%;
}

.product-edit-button {
  background-color: rgb(64, 197, 64) !important;
  color: white !important;
  padding: 5px 9px 5px 9px !important;
  border-radius: 3px !important;
}

.product-edit-button span i {
  color: white !important;
}

.product-edit-button:hover {
  background-color: darkgreen !important;
}

.product-delete-button {
  background-color: red !important;
  color: white !important;
  padding: 5px 8.5px 5px 8.5px !important;
  border-radius: 3px !important;
  margin-left: 10px !important;
}

.product-delete-button span i {
  color: white !important;
}

.product-delete-button:hover {
  background-color: darkred !important;
}

.view-file-button {
  width: 100%;
  height: 45px;
  border: 1px solid lightgrey;
  border-radius: 5px;
  background: white;
  text-align: left;
  font-size: 14px;
  padding-left: 17.5px;
  padding-top: 10px;
  color: #50525e;
  font-weight: 500;
}

.view-file-label {
  margin-top: 10px;
  color: #50525e;
  font-size:1.075rem;
}

.product-add-button {
  width: 40%;
  padding-left: 17px !important;
  background-color: #8F1017 !important;
  color: white !important;
  border-radius: 5px !important;
  height: 45px !important;
  margin-left: 12.5px;
  text-align: center !important;
  font-size: 14px !important;
}

.total-cost-label label {
  text-align: right !important;
}

/****************************************
*****************************************
               PDF Styling
*****************************************
****************************************/

.table-header-row {
  padding-left: 1px !important;
}

.inner-table-row td {
  background: orange;
  width: 100%;
}

.pdf-div {
  width: 99%;
  border: 1px solid black;
}

.pdf-div-header {
  width: 100%;
  background-color: lightgrey;
  padding-top: 10px;
  border-bottom: 1px solid black;
  margin-right: 0px !important;
  margin-left: 0px !important;
}

.inner-div {
  width: 50%;
  border: 1px solid black;
  margin-top: 50px !important;
  margin: 0 auto;
  min-height: 300px;
}

.inner-div-header {
  width: 100%;
  background-color: lightgrey;
  padding-top: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid black;
}

.inner-div-footer {
  width: 50%;
  min-height: 25px;
  background-color: lightgrey;
  border-right: 1px solid black;
  border-bottom: 1px solid black;
  border-left: 1px solid black;
  margin-bottom: 50px !important;
  margin: 0 auto;
  position: relative;
  bottom: 0;
}

.inner-div-left {
  width: 50%;
  float: left;
  border-right: 1px solid black;
  height: 100%;
}

.inner-div-right {
  width: 50%;
  float: right;
  height: 100%;
}

.inner-div-left p,
.inner-div-right p {
  margin-bottom: 0px;
  padding-top: 2.5px;
  padding-bottom: 2.5px;
}

.right-side-text {
  width: 1%;
  float: right;
}

.right-side-text p {
  writing-mode: vertical-lr;
  text-orientation: mixed;
  margin-top: -325px;
}

.bottom-pdf-div-footer {
  width: 99%;
  margin-left: 0.8%;
}

.bottom-div-row {
  background-color: lightgrey;
  width: 100%;
  border-right: 1px solid black;
  border-left: 1px solid black;
  border-bottom: 1px solid black;
  padding-top: 10px;
}

.bottom-div-row .col-4 {
  padding-left: 0px;
  padding-right: 0px;
}

.generate-pdf-button {
  background-color: #8F1017;
  border: 2px solid #8F1017;
  color: white;
  height: 44px;
  border-radius: 5px;
  font-weight: 500;
  font-size: 14px;
}

.generate-pdf-button:hover {
  background-color: transparent;
  color: #8F1017;
}

.go-back-pdf-button {
  background-color: transparent;
  border: 2px solid #8F1017;
  color: #8F1017;
  height: 44px;
  border-radius: 5px;
  font-weight: 500;
  font-size: 1px;
}

.go-back-pdf-button:hover {
  background-color: #8F1017;
  color: white;
}

.pdf-options-label {
  font-size: 16px !important;
  padding-bottom: 10px;
}