@charset "UTF-8";
/* Dialog header style */
:root {
  --chips-primary-1: #DC2626;
  --chips-secondary-1: #FECCCF;
  --chips-primary-2: #EA580C;
  --chips-secondary-2: #FFEDD5;
  --chips-primary-3: #BE9000;
  --chips-secondary-3: #FEF6C6;
  --chips-primary-4: #5D9A06;
  --chips-secondary-4: #ecfccc;
  --chips-primary-5: #16A34A;
  --chips-secondary-5: #DCFCE7;
  --chips-primary-6: #0D9488;
  --chips-secondary-6: #CCFBF1;
  --chips-primary-7: #0991B2;
  --chips-secondary-7: #CFFAFE;
  --chips-primary-8: #2563EB;
  --chips-secondary-8: #DBEAFE;
  --chips-primary-9: #8C46E5;
  --chips-secondary-9: #EBE1FF;
  --chips-primary-10: #C027D3;
  --chips-secondary-10: #F8EAFD;
  --chips-primary-11: #FF099C;
  --chips-secondary-11: #FBDBFE;
  --chips-primary-12: #676767;
  --chips-secondary-12: #D8D8D8;
  --highlight-background-color: #fff499;
  --layout-gap: 30px;
  --menu-width: 250px;
  --header-height: 60px;
  --table-pager-height: 48px;
  --table-toolbar-height: 40px;
  --table-toolbar-margin: 10px;
  --highliter-color: var(--mud-palette-primary);
  --datagrid-header-height: 32px;
  --form-spacing: 15px;
  --star-color: #FFC414FF;
  --favorite-color: #fd4081;
  --settled: #cdcdcd;
}

/* Dialog header colors */
.dialog-header-color-default .mud-dialog-title {
  background-color: var(--mud-palette-default);
  color: var(--mud-palette-default-text);
}

.dialog-header-color-primary .mud-dialog-title {
  background-color: var(--mud-palette-primary);
  color: var(--mud-palette-primary-text);
}

.dialog-header-color-secondary .mud-dialog-title {
  background-color: var(--mud-palette-secondary);
  color: var(--mud-palette-secondary-text);
}

.dialog-header-color-tertiary .mud-dialog-title {
  background-color: var(--mud-palette-tertiary);
  color: var(--mud-palette-tertiary-text);
}

.dialog-header-color-info .mud-dialog-title {
  background-color: var(--mud-palette-info);
  color: var(--mud-palette-info-text);
}

.dialog-header-color-success .mud-dialog-title {
  background-color: var(--mud-palette-success);
  color: var(--mud-palette-success-text);
}

.dialog-header-color-warning .mud-dialog-title {
  background-color: var(--mud-palette-warning);
  color: var(--mud-palette-warning-text);
}

.dialog-header-color-error .mud-dialog-title {
  background-color: var(--mud-palette-error);
  color: var(--mud-palette-error-text);
}

.dialog-header-color-dark .mud-dialog-title {
  background-color: var(--mud-palette-dark);
  color: var(--mud-palette-dark-text);
}

.dialog-header-color-transparent .mud-dialog-title {
  background-color: var(--mud-palette-transparent);
  color: var(--mud-palette-transparent-text);
}

.dialog-header-color-inherit .mud-dialog-title {
  background-color: var(--mud-palette-inherit);
  color: var(--mud-palette-inherit-text);
}

.dialog-header-color-surface .mud-dialog-title {
  background-color: var(--mud-palette-surface);
  color: var(--mud-palette-surface-text);
}

/* Button border taking no place */
.mud-button-outlined {
  border: none;
  outline: 1px solid var(--mud-palette-text-primary);
}

.mud-button-outlined.mud-button-outlined-primary {
  border: none;
  outline: 1px solid var(--mud-palette-primary);
}

.mud-button-outlined.mud-button-outlined-primary:hover {
  border: none;
}

/* Stretchy MudInputControl */
.mud-input-control-height-stretch {
  height: 100%;
}

.mud-input-control-height-stretch .mud-input-control-input-container {
  height: 100%;
}

.mud-input-control-height-stretch .mud-input-text {
  height: 100%;
}

.mud-input-control-height-stretch .mud-input-root {
  height: 100% !important;
}

/* Animation rotation */
/** https://stackoverflow.com/questions/6410730/css-endless-rotation-animation **/
@-webkit-keyframes rotating-clockwise /* Safari and Chrome */ {
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotating-clockwise {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.rotating-clockwise {
  -webkit-animation: rotating-clockwise 2s linear infinite;
  -moz-animation: rotating-clockwise 2s linear infinite;
  -ms-animation: rotating-clockwise 2s linear infinite;
  -o-animation: rotating-clockwise 2s linear infinite;
  animation: rotating-clockwise 2s linear infinite;
}

@-webkit-keyframes rotating-counterclockwise /* Safari and Chrome */ {
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(-360deg);
    -o-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}
@keyframes rotating-counterclockwise {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(-360deg);
    -moz-transform: rotate(-360deg);
    -webkit-transform: rotate(-360deg);
    -o-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}
.rotating-counterclockwise {
  -webkit-animation: rotating-counterclockwise 2s linear infinite;
  -moz-animation: rotating-counterclockwise 2s linear infinite;
  -ms-animation: rotating-counterclockwise 2s linear infinite;
  -o-animation: rotating-counterclockwise 2s linear infinite;
  animation: rotating-counterclockwise 2s linear infinite;
}

/* Rotating Icon */
.rotating-icon-clockwise .mud-icon-root {
  -webkit-animation: rotating-clockwise 2s linear infinite;
  -moz-animation: rotating-clockwise 2s linear infinite;
  -ms-animation: rotating-clockwise 2s linear infinite;
  -o-animation: rotating-clockwise 2s linear infinite;
  animation: rotating-clockwise 2s linear infinite;
}

.rotating-icon-counterclockwise .mud-icon-root {
  -webkit-animation: rotating-counterclockwise 2s linear infinite;
  -moz-animation: rotating-counterclockwise 2s linear infinite;
  -ms-animation: rotating-counterclockwise 2s linear infinite;
  -o-animation: rotating-counterclockwise 2s linear infinite;
  animation: rotating-counterclockwise 2s linear infinite;
}

/* Workaround pour forcer le remplissage d'une popup par son contenu */
div.mud-dialog div:has(.mud-dialog-content) {
  display: flex;
  flex-grow: 1;
}

div:has(> .mud-dialog-content) {
  flex-direction: column;
}

/* Dialog content remove padding */
.custom-popover {
  padding: 0px;
}

.mud-dialog.dialog-content-not-padded .mud-dialog-content {
  padding: 0px;
}

/* Dialog prevent scroll */
/** https://stackoverflow.com/questions/36230944/prevent-flex-items-from-overflowing-a-container **/
.mud-dialog.dialog-not-scrollable {
  min-height: 0;
  min-width: 0;
}

.mud-dialog.dialog-not-scrollable div:has(.mud-dialog-content) {
  min-height: 0;
  min-width: 0;
}

.mud-dialog.dialog-not-scrollable .mud-dialog-content {
  min-height: 0;
  min-width: 0;
}

/* Stretch MudTabs */
.mud-tab-stretched .mud-tabs-toolbar-wrapper {
  width: 100%;
  height: 100%;
}

.mud-tab-stretched .mud-tabs-toolbar-wrapper > *:has(.mud-tab) {
  flex-grow: 1;
}

/* Mud tab pannels full height */
.mud-height-full > .mud-tabs-panels {
  height: 100%;
  min-height: 0;
}

/* MudTab panel padded */
.mud-tab-panel-padded .mud-tabs-panels {
  padding: 0 24px 8px 24px;
}

/*MudExpandPanel Expanded*/
.mud-expand-panel.mud-panel-expanded {
  margin: 0 !important;
}

/* Form div style */
.bk-gray {
  background-color: var(--mud-palette-background-grey);
}

/* Workaround flexbox qui overflow */
.flex-overflow-fix > * {
  min-height: 0;
  min-width: 0;
}

/* Mud file upload height fill fix */
.mud-height-full > .mud-input-control-input-container {
  height: 100%;
}

.full-width-tabs .mud-tooltip-root {
  flex: 1;
}

.full-width-tabs .mud-tabs-toolbar-wrapper {
  width: 99.99%;
}

.mud-tabs:not(.mud-dialog .mud-tabs) {
  box-shadow: var(--mud-elevation-1);
  border-radius: 15px;
  background: white;
}

.datagrid-with-toolbar {
  padding-top: 8px;
  height: calc(100% - var(--table-toolbar-height) - var(--table-toolbar-margin));
  border-radius: 8px;
  box-shadow: var(--mud-elevation-1);
}

.simple-datagrid {
  background-color: var(--mud-palette-background-grey);
  border-radius: 8px;
  box-shadow: none;
}

.no-header .mud-table-head {
  display: none;
}

.toolbar {
  margin-bottom: var(--table-toolbar-margin);
  height: var(--table-toolbar-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.pager {
  display: flex;
  height: var(--table-pager-height);
  background: inherit;
  border-bottom-right-radius: 8px !important;
  border-bottom-left-radius: 8px !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center;
}

/*Reduis l'espace entre les titres et les filtres sur les datagrids*/
.datagrid-with-toolbar .filter-header-cell {
  padding-top: 0 !important;
  width: 0px !important;
}

.datagrid-with-toolbar .mud-table-head > :first-child .mud-table-cell {
  padding-bottom: 0 !important;
}

.text-cell {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 0;
}

.not-underlined .mud-input.mud-input-underline:after, .not-underlined .mud-input.mud-input-underline:before {
  display: none !important;
}

.simple-datagrid .mud-table-container {
  overflow: hidden;
}

:is(.datagrid-with-toolbar) .mud-drop-container {
  width: fit-content;
}

:is(.datagrid) .mud-drop-container {
  width: fit-content;
}

:is(.simple-datagrid) .mud-drop-container {
  overflow-x: auto;
}

.ellipsed-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sortable-column-header {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.background-block {
  background-color: var(--mud-palette-background-grey);
  border-radius: 8px;
  padding: 10px 16px 10px 16px;
  flex-grow: 1;
  gap: 10px;
  display: flex;
  flex: 1;
}

.form-block-row {
  display: flex;
  gap: 10px;
  flex: 1;
}

.form-block-column {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.simple-block {
  padding: 16px;
  display: flex;
  flex-grow: 0;
  width: fit-content;
  align-self: center;
}

.form-tab-panel {
  height: 100%;
}

.form-panel {
  overflow: auto;
}

.form-row {
  display: flex;
  flex-grow: 1;
  gap: var(--form-spacing);
  height: fit-content;
  flex: 1;
  max-height: 100%;
}

.form-column {
  display: flex;
  flex: 1;
  gap: var(--form-spacing);
  flex-direction: column;
  align-items: stretch;
}

.form-container {
  display: flex;
  background: transparent;
  padding: var(--form-spacing);
  gap: var(--form-spacing);
  flex-direction: column;
  border-bottom-right-radius: 24px !important;
  border-bottom-left-radius: 24px !important;
}

.form-container *.mud-grid-item {
  padding: 8px !important;
}

.mud-menu-activator *.mud-grid-item {
  padding: 4px !important;
}

.mud-input-label {
  transform: translate(0, 1.5px) scale(0.75);
  transform-origin: top left;
}

.no-label {
  padding: 0 !important;
}
.no-label .mud-input {
  margin: 0 !important;
}

/* DenseDocumentList specifics */
*:has(.densedocumentlist-listitem) {
  width: 100%;
}

.densedocumentlist-listitem .mud-button-label {
  justify-content: left;
}

/*Chips entièrement visible dans l'input*/
.mud-select .mud-select-input .mud-input-slot {
  height: fit-content;
}

.mud-form {
  margin-top: 0 !important;
}

.mud-navmenu.mud-navmenu-rounded .mud-nav-link {
  border-radius: 8px;
}

.selected {
  color: var(--mud-palette-primary) !important;
  background-color: var(--mud-palette-table-hover) !important;
}

.no-underline {
  border-bottom: 0;
}

.roadmap-header-1 {
  background-color: #EEECE1;
  background-color: #EEECE1;
}

.roadmap-header-2 {
  background-color: #E2DFCC;
}

.roadmap-header-3 {
  background-color: #CCC6A4;
}

.roadmap-header-4 {
  background-color: #B5AD7D;
}

.align-right-content,
.align-right-content * {
  text-align: right;
}

.align-center-content,
.align-center-content * {
  text-align: center;
}

/*underline de l'input en rouge*/
.red-underline .mud-input.mud-input-underline:after {
  transform: scaleX(1);
  border-bottom-color: var(--mud-palette-error) !important;
}

/*label de l'input en rouge*/
.red-underline .mud-input-label-inputcontrol {
  color: var(--mud-palette-error) !important;
}

.inline-edit-background {
  background: var(--mud-palette-background-grey);
  border-radius: 8px;
  padding: 5px 10px 5px 10px;
}

.simple-datagrid .mud-table-body .mud-table-row:nth-of-type(odd) {
  background-color: var(--mud-palette-table-striped) !important;
}

.simple-datagrid .mud-table-body .mud-table-row:nth-of-type(even) {
  background-color: white !important;
}

.datagrid-no-padding .mud-table-body .mud-table-cell {
  padding: 0 !important;
}

.dialog-button {
  border-radius: 8px;
}

.dialog-button .mud-icon {
  color: white;
  margin-inline-start: 4px;
  margin-inline-end: 8px;
}

.drop-zone {
  background-image: repeating-linear-gradient(0deg, var(--mud-palette-primary), var(--mud-palette-primary) 18px, transparent 18px, transparent 36px, var(--mud-palette-primary) 36px), repeating-linear-gradient(90deg, var(--mud-palette-primary), var(--mud-palette-primary) 18px, transparent 18px, transparent 36px, var(--mud-palette-primary) 36px), repeating-linear-gradient(180deg, var(--mud-palette-primary), var(--mud-palette-primary) 18px, transparent 18px, transparent 36px, var(--mud-palette-primary) 36px), repeating-linear-gradient(270deg, var(--mud-palette-primary), var(--mud-palette-primary) 18px, transparent 18px, transparent 36px, var(--mud-palette-primary) 36px);
  background-repeat: no-repeat;
  background-size: 7px 100%, 100% 7px, 7px 100%, 100% 7px;
  background-position: 0 0, 0 0, 100% 0, 0 100%;
}

.form-column {
  flex-wrap: wrap;
}

.form-row {
  flex-wrap: wrap;
}

/*Chips*/
.icon-chips {
  width: 16px !important;
}
.icon-chips .mud-icon-root {
  margin: 0 !important;
}

.mud-chip.mud-chip-content {
  font-family: var(--mud-typography-button-family) !important;
  font-weight: var(--mud-typography-button-weight) !important;
  line-height: var(--mud-typography-button-lineheight) !important;
  letter-spacing: var(--mud-typography-button-letterspacing) !important;
  text-transform: var(--mud-typography-button-text-transform) !important;
  font-size: 12px !important;
}

.mud-chip .mud-icon-root {
  font-size: 0.8rem !important;
}

.design-grid {
  background: var(--chips-secondary-2);
}
.design-grid .mud-table-pagination .mud-icon-size-medium {
  fill: var(--chips-primary-2);
}

.purchase-grid {
  background: var(--chips-secondary-4);
}
.purchase-grid .mud-table-pagination .mud-icon-size-medium {
  fill: var(--chips-primary-4);
}

.large-strikethrough {
  position: relative;
  overflow: hidden;
}

.large-strikethrough::before {
  content: "";
  position: absolute;
  top: 13px;
  left: 0;
  width: 90%;
  height: 3px;
  transform: rotate(350deg);
  background-color: #000;
  opacity: 0.5;
  z-index: 1;
  margin: 0 5% 0 5%;
  border-radius: 100px;
}

.small-strikethrough {
  position: relative;
  overflow: hidden;
}

.small-strikethrough::before {
  content: "";
  position: absolute;
  top: 13px;
  left: 0;
  width: 90%;
  height: 3px;
  transform: rotate(-45deg);
  background-color: #000;
  opacity: 0.5;
  z-index: 1;
  margin: 0 5% 0 5%;
  border-radius: 100px;
}

.draggable:hover {
  border: 4px dashed var(--mud-palette-primary);
  -webkit-border-radius: 5px;
  border-radius: 5px;
  margin: -4px;
}

.fake-hidden {
  opacity: 0;
  height: 0 !important;
  flex-grow: 0 !important;
}

.popover-no-offset {
  position: absolute !important;
  top: 0px !important;
  left: 0px !important;
}

.white-file-library {
  border: 1px;
  border-style: solid;
  border-color: lightgrey;
  padding: 10px 16px 10px 16px;
  border-radius: 8px;
  width: 100%;
  height: 100%;
  background: #fefefe;
}

.white-datagrid {
  border-style: solid;
  border-width: 1px;
  border-color: lightgrey;
  background-color: #fefefe;
}

.white-rich-text-editor {
  background-color: #fefefe;
  border-radius: 20px;
  padding-bottom: 43px !important;
}

.menu-button-no-padding button {
  padding: 0;
}

.ql-tooltip {
  z-index: 1000;
}

.rich-text-editor-container {
  padding-bottom: 50px;
}

.ql-toolbar {
  border-radius: 16px 16px 0 0;
}

.ql-container {
  border-radius: 0 0 16px 16px;
}

.m--4 {
  margin: -4px;
}

.z-100 {
  z-index: 100 !important;
}

.layout_header_left .mud-typography-h1 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex-shrink: 1;
  min-width: 0;
  font-size: x-large;
  font-weight: revert;
}

.rich-toolbar-button-selected {
  background: var(--mud-palette-primary-lighten) !important;
}

.ql-editor {
  padding: 4px 8px !important;
}

.ql-container {
  font-family: var(--mud-typography-body1-family) !important;
  font-size: var(--mud-typography-body1-size) !important;
}

.quill-editor-placeholder {
  padding: 4px 8px !important;
}

.ql-editor.ql-blank::before {
  position: relative !important;
  left: 0px !important;
  right: 0px !important;
}

.rich-toolbar-color-picker .mud-picker-color-content {
  width: 570px;
}
.rich-toolbar-color-picker .mud-picker-color-content .mud-picker-color-controls {
  height: 0;
}

.rich-toolbar-color-picker-menu .mud-icon-button {
  color: inherit !important;
}
.rich-toolbar-color-picker-menu .mud-button-root {
  width: 64px;
  height: 32px;
}

.mud-button-group-root.mud-button-group-outlined-size-small .mud-button-root.mud-icon-button {
  height: 100%;
}

.small-button {
  padding: 0;
}

.progress-red .mud-progress-linear-bar {
  background-color: var(--mud-palette-error) !important;
}

.progress-orange .mud-progress-linear-bar {
  background-color: var(--mud-palette-warning-darken) !important;
}

.progress-yellow .mud-progress-linear-bar {
  background-color: #ffe066 !important;
}

.progress-green .mud-progress-linear-bar {
  background-color: var(--mud-palette-success) !important;
}