/* Variables */

:root {
  --primary-color0: #92A7BC;
  --primary-color1: #627D9A;
  --primary-color2: #3E5E7F;
  --primary-color3: #234365;
  --primary-color4: #0D2A48;

  --secondary-color0: #FFF1C2;
  --secondary-color1: #ECD78F;
  --secondary-color2: #C3AA57;
  --secondary-color3: #9C822D;
  --secondary-color4: #6F580D;

  --tertiary-color0: #FFD6C2;
  --tertiary-color1: #ECAF8F;
  --tertiary-color2: #C37B57;
  --tertiary-color3: #9C522D;
  --tertiary-color4: #6F2E0D;
}


/*
 Color classes
 You can see the Color Pallet in the view "http://localhost:8000/colors/"
*/

.primary-color0 {
  color: var(--primary-color0, #92A7BC);
}
.primary-color1 {
  color: var(--primary-color1, #627D9A);
}
.primary-color2 {
  color: var(--primary-color2, #3E5E7F);
}
.primary-color3 {
  color: var(--primary-color3, #234365);
}
.primary-color4 {
  color: var(--primary-color4, #0D2A48);
}
.secondary-color0 {
  color: var(--secondary-color0, #FFF1C2);
}
.secondary-color1 {
  color: var(--secondary-color1, #ECD78F);
}
.secondary-color2 {
  color: var(--secondary-color2, #C3AA57);
}
.secondary-color3 {
  color: var(--secondary-color3, #9C822D);
}
.secondary-color4 {
  color: var(--secondary-color4, #6F580D);
}
.tertiary-color0 {
  color: var(--tertiary-color0, #FFD6C2);
}
.tertiary-color1 {
  color: var(--tertiary-color1, #ECAF8F);
}
.tertiary-color2 {
  color: var(--tertiary-color2, #C37B57);
}
.tertiary-color3 {
  color: var(--tertiary-color3, #9C522D);
}
.tertiary-color4 {
  color: var(--tertiary-color4, #6F2E0D);
}


/* Elements style */

h1, h2, h3, h4, h5 {
  color: var(--primary-color4) !important;
}

.button.primary-color1 {
  background-color: var(--primary-color1) !important;
  color: #fff !important;
}
.button.primary-color1:hover {
  background-color: var(--primary-color0) !important;
}
.button.primary-color2 {
  background-color: var(--primary-color2) !important;
  color: #fff !important;
}
.button.primary-color2:hover {
  background-color: var(--primary-color1) !important;
}
.button.primary-color3 {
  background-color: var(--primary-color3) !important;
  color: #fff !important;
}
.button.primary-color3:hover {
  background-color: var(--primary-color2) !important;
}
.button.primary-color4 {
  background-color: var(--primary-color4) !important;
  color: #fff !important;
}
.button.primary-color4:hover {
  background-color: var(--primary-color3) !important;
}
.button.secondary-color2 {
  background-color: var(--secondary-color2) !important;
  color: #fff !important;
}
.button.secondary-color2:hover {
  background-color: var(--secondary-color1) !important;
}
.button.secondary-color3 {
  background-color: var(--secondary-color3) !important;
  color: #fff !important;
}
.button.secondary-color3:hover {
  background-color: var(--secondary-color2) !important;
}
.button.secondary-color4 {
  background-color: var(--secondary-color4) !important;
  color: #fff !important;
}
.button.secondary-color4:hover {
  background-color: var(--secondary-color3) !important;
}
.button.tertiary-color1 {
  background-color: var(--tertiary-color1) !important;
  color: #fff !important;
}
.button.tertiary-color1:hover {
  background-color: var(--tertiary-color0) !important;
}
.button.tertiary-color2 {
  background-color: var(--tertiary-color2) !important;
  color: #fff !important;
}
.button.tertiary-color2:hover {
  background-color: var(--tertiary-color1) !important;
}
.button.tertiary-color3 {
  background-color: var(--tertiary-color3) !important;
  color: #fff !important;
}
.button.tertiary-color3:hover {
  background-color: var(--tertiary-color2) !important;
}
.button.tertiary-color4 {
  background-color: var(--tertiary-color4) !important;
  color: #fff !important;
}
.button.tertiary-color4:hover {
  background-color: var(--tertiary-color3) !important;
}


/* Global css style */

body {
  padding: 0 0.7rem;
}

.base-content h2.ui.header {
  margin-bottom: 2rem;
  margin-top: 0;
}

.fluid.main.container {
  margin-top: 4.7em;
}

.vertical.fixed.left.menu {
  top: 6.5em;
}

.sub-header .eight.wide.column:last-child {
  padding-top: 0.6rem
}

.sub-header button.add {
  float: right;
  padding: 0.785714em 1.5em 0.885714em;
  margin-left: 1rem;
}

.sub-header form.search {
  float: right;
}

.ui.divider.header {
  margin-bottom: 2.5rem;
}

.message-container {
  position: fixed;
  right: 1rem;
  top: 3.7rem;
  z-index: 10;
}

.message-container .ui.message {
  padding: 1em 2.3em 1em 1.5em;
}

.message-container .ui.message .close.icon {
  top: 1.18575em;
}

.message-container .ui.floating.message {
  -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, .22) inset, 0 2px 4px 0 rgba(34, 36, 38, .12), 0 2px 10px 0 rgba(34, 36, 38, .15);
  box-shadow: 0 0 0 1px rgba(34, 36, 38, .22) inset, 0 2px 4px 0 rgba(34, 36, 38, .12), 0 2px 10px 0 rgba(34, 36, 38, .15);
}

.mb-0 {
  margin-bottom: 0px !important;
}

.mt-0 {
  margin-top: 0px !important;
}

.mb-10 {
  margin-bottom: 10px !important;
}

.mt-10 {
  margin-top: 10px !important;
}

.mt-15 {
  margin-top: 10px !important;
}

.mt-20 {
  margin-top: 20px !important;
}

.mb-15 {
  margin-bottom: 15px !important;
}

.mr-10 {
  margin-right: 10px !important;
}

div.ui.search.selection.dropdown div.text{
  width: 100%;
}

div.ui.basic.modal div.content p.message,
div.ui.basic.modal div.actions{
  text-align: center;
}

.popup-elem, .cursor-pointer {
  cursor: pointer;
}

.p-15 {
  padding: 15px !important;
}

.hidden {
  display: none;
}

.text-align-right {
  text-align: right;
}

.ui.fullscreen.modal, 
.ui.fullscreen.scrolling.modal {
  left: unset !important;
}

.formset_elem,
.formset_list_label {
  padding-left: 0px !important;
}
.formset_list {
  padding-top: 0px !important;
}

#left-menu {
  top: 3.9em;
  width: 11.6%;
  padding-bottom: 150px;
}

input[name="purchase_observation"] {
  font-size: .80rem !important;
}
form.form-display-unset { display: unset; }
tr.disapproved td,
tr.disapproved a {
  color: rgb(160, 160, 160);
}
td.text-align-center {
  text-align: center !important;
}
.ui.breadcrumb {
  margin-top: 0.5rem !important;
  margin-bottom: 2rem;
}

.working-in-progress {
  margin-top: 14rem;
  text-align: center;
}
.working-in-progress img {
  width: 30%;
}

.file-field {
  margin-bottom: 1rem;
  font-size: .92857143em;
  text-transform: none;
}
.file-field input[type=checkbox] {
  margin-left: 2rem;
  vertical-align: inherit !important;
}
.file-field .label {
  font-weight: 700;
}

.menu img.logo {
  width: 6em !important;
}
