@charset "UTF-8";
:root {
  --font-family: Roboto, "Open Sans", "Helvetica Neue", sans-serif;
  --logo-url:url("https://www.filtersun.com/i/logo.svg");
  --background-image:url("https://www.filtersun.com/i/accueil/1.jpg");
  --securite-enfant-image:url("https://www.filtersun.com/plato/various/securite-enfant.svg");
  --primary-color: #4a4a49;
  --secondary-color: #6e727c;
  --tertiary-color: #bab6ba;
  --alert-color: #f2535b;
  --primary-background: #ffffff;
  --secondary-background: #f8f8f8;
  --dark-background: #333333;
  --login-background: #e8e3e9;
  --border-radius-button: 3px;
  --border-radius-table: var(--border-radius-button);
  --border-radius-cards: 15px;
  --icon-button-color: #080808;
  --icon-button-background: #e1e1e1;
  --primary-button-background: var(--primary-color);
  --primary-button-color: #ffffff;
  --secondary-button-background: transparent;
  --secondary-button-color: #000000;
  --secondary-button-border: 1px solid var(--secondary-button-color);
  --tertiary-button-background: #8ccbc4;
  --tertiary-button-color: #ffffff;
  --modal-separator: 2px solid var(--tertiary-color);
  --table-header-background: #ebebeb;
  --table-row-background: #f1f1f1;
  --table-row-hover-background: #d8d8d8;
  --status-background-1: #f7dec1;
  --status-color-1: #a49079;
  --status-background-2: #f7e8c1;
  --status-color-2: #a49879;
  --status-background-3: #8a8dab;
  --status-color-3: #575a71;
  --status-background-4: #7c929c;
  --status-color-4: #b7d6e5;
  --status-background-5: #fffeeb;
  --status-color-5: #4e4d44;
  --status-background-6: #0a4b67;
  --status-color-6: #fff;
  --status-background-7: #978ea0;
  --status-color-7: #685978;
  --status-background-8: #4e4d44;
  --status-color-8: #fffeeb;
  --status-background-9: #a49079;
  --status-color-9: #f7dec1;
  --status-background-10: #a49879;
  --status-color-10: #f7e8c1;
  --status-background-11: #575a71;
  --status-color-11: #8a8dab;
  --status-background-12: #b7d6e5;
  --status-color-12: #7c929c;
  --status-background-13: #d2d4d4;
  --status-color-13: #818989;
  --configurator-bg-color: #4a4a49;
  --configurator-color: #ffffff;
  --description-size: 20%;
  --focus-color:#2196f3;
}

/*--------------------------------------------------------------------------*/
/* #region material design -------------------------------------------------*/
.mat-checkbox-checked.mat-accent .mat-checkbox-background {
  background: var(--primary-color) !important;
}

.mat-checkbox-layout {
  white-space: inherit !important;
}
.mat-checkbox-layout .mat-checkbox-label {
  max-width: 100% !important;
}

.mat-select-panel {
  max-height: 336px !important;
}

.mat-form-field-appearance-legacy {
  /* Majuscule sur les textes des menus déroulant à coche avec image (ex : couleur toile) */
}
.mat-form-field-appearance-legacy .mat-form-field-flex {
  background: #eee !important;
}
.mat-form-field-appearance-legacy .mat-form-field-wrapper {
  padding-bottom: 0.5rem !important;
  padding-top: 0.25rem !important;
}
.mat-form-field-appearance-legacy .mat-form-field-infix {
  padding: 8px !important;
  width: auto !important;
  margin: 0 !important;
  border: 0 !important;
}
.mat-form-field-appearance-legacy .mat-form-field-infix:not(.option-single-value-label) {
  background: #eee !important;
}
.mat-form-field-appearance-legacy .mat-form-field-infix .mat-select {
  padding: 8px;
}
.mat-form-field-appearance-legacy .mat-form-field-label {
  top: 28px;
  left: 8px;
}
.mat-form-field-appearance-legacy .mat-form-field-underline {
  bottom: 0.5rem !important;
}
.mat-form-field-appearance-legacy .value-container:first-letter {
  text-transform: uppercase !important;
}

.mat-table {
  margin-top: 1.5em;
}

.mat-paginator .mat-form-field-infix {
  padding: 0 !important;
}

.mat-row:nth-child(even) {
  background-color: var(--table-row-background);
}
.mat-row:nth-child(odd) {
  background-color: var(--primary-background);
}

tr[mat-header-row].mat-header-row {
  background-color: var(--table-header-background);
}
tr[mat-header-row] td:nth-child(1) {
  font-weight: 700;
}

.mat-header-cell {
  color: var(--primary-color);
}

.user-role-table-container .mat-row {
  height: auto !important;
}
.user-role-table-container .mat-row td.mat-cell {
  height: auto !important;
}
.user-role-table-container .mat-row td.mat-cell .cell-container {
  max-height: inherit !important;
  overflow: visible !important;
}
.user-role-table-container .mat-row td.mat-cell .cell-container .cell {
  -webkit-line-clamp: inherit !important;
  max-height: inherit !important;
  overflow: visible !important;
}

.configurator-filter-dropdown-container .mat-form-field-wrapper {
  padding: 0 !important;
}
.configurator-filter-dropdown-container .mat-form-field-wrapper .mat-form-field {
  margin: 17px 0;
}
.configurator-filter-dropdown-container .mat-form-field-wrapper .mat-form-field-underline {
  bottom: 0 !important;
}

.vat-dropdown .mat-select-trigger {
  height: 1.5em !important;
}
.vat-dropdown .vat-label {
  top: 12px !important;
  right: -8px !important;
}

.bms-message-snack {
  background: var(--tertiary-button-background) !important;
  color: var(--tertiary-button-color) !important;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3) !important;
  border: 0 !important;
}
.bms-message-snack .message-success {
  color: var(--tertiary-button-color) !important;
}

/*--------------------------------------------------------------------------*/
/* Buttons -----------------------------------------------------------------*/
a:hover {
  color: var(--secondary-color);
}

.btn-default,
.text-default {
  color: var(--primary-color) !important;
}

button,
.btn {
  border-color: transparent !important;
}

.btn-primary, .btn-primary > * {
  background-color: var(--primary-button-background) !important;
  color: var(--primary-button-color) !important;
}
.btn-primary:disabled, .btn-primary:disabled > * {
  background-color: #ccc !important;
  color: var(--primary-button-color) !important;
}
.show > .btn-primary.dropdown-toggle {
  background-color: var(--dark-background) !important;
}

.btn-secondary {
  border: var(--secondary-button-border) !important;
  background-color: var(--secondary-button-background) !important;
  color: var(--secondary-button-color) !important;
}

.btn-icon {
  background-color: transparent;
  border: none;
}
.btn-icon:hover {
  background-color: var(--icon-button-background);
}

.btn-tertiary {
  background-color: var(--tertiary-button-background) !important;
  color: var(--tertiary-button-color) !important;
}

.expand-button {
  background: #eee;
  cursor: pointer;
}

/* #region grid item */
.gridOption {
  width: 12rem !important;
}

bms-catalog {
  /* Tags mot clé filtre produits */
  /* Filtres produits : colonne gauche checkbox */
}
bms-catalog.tag-presets {
  height: calc(100vh - 109px) !important;
}
bms-catalog .result-token {
  font-size: 15px;
}
bms-catalog .tag-wrapper .mat-checkbox-layout {
  display: block;
}
bms-catalog .tag-wrapper .mat-checkbox-layout .mat-checkbox-inner-container {
  top: -2px;
}
bms-catalog .items-wrapper {
  padding-top: 2em;
}
bms-catalog .grid-container {
  -moz-column-gap: 2px;
       column-gap: 2px;
}
bms-catalog .grid-container .grid-item {
  border-radius: 0 !important;
  border: 0 !important;
  background: #f6f6f6 !important;
  height: 333px;
}
bms-catalog .grid-container .grid-item .image-wrapper {
  /* Articles -----------------------*/
  /*& > div{
    display:none !important;
  }*/
}
bms-catalog .grid-container .grid-item .image-wrapper .catalog-img {
  border-radius: 0 !important;
  height: 240px;
  position: relative !important;
  /* Articles -----------------------*/
}
bms-catalog .grid-container .grid-item .image-wrapper .catalog-img.inner-image {
  width: 30px !important;
  height: 30px !important;
  position: absolute !important;
  top: auto !important;
  left: auto !important;
  right: 10px !important;
  bottom: 10px !important;
  box-shadow: 0px 0px 10px 0px #ccc;
}
bms-catalog .grid-container .grid-item .bottom-wrapper {
  height: 25%;
}
bms-catalog .grid-container .grid-item .bottom-wrapper .details {
  width: calc(100% - 80px) !important;
}
bms-catalog .grid-container .grid-item .bottom-wrapper .details .name {
  font-size: 15px !important;
}
bms-catalog .grid-container .grid-item .bottom-wrapper .details .id {
  /*display:none !important;*/
  margin-top: 5px !important;
}
bms-catalog .grid-container .grid-item .bottom-wrapper .price-container {
  bottom: 0 !important;
}
bms-catalog app-search .mat-input-element {
  line-height: 2em !important;
}
bms-catalog app-search .mat-form-field-suffix {
  top: -4px;
  padding: 0 8px;
}

/* #region light-mode */
.navbar.navbar-dark {
  background-color: var(--primary-background);
}
.navbar.navbar-dark .navbar-brand {
  max-width: 100px !important;
  max-height: 45px !important;
  width: 100% !important;
}
.navbar.navbar-dark .navbar-brand::after {
  background-image: var(--logo-url);
  width: 100px;
}
.navbar.navbar-dark .navbar-brand .logo {
  max-width: 100px !important;
  max-height: 45px !important;
}
.navbar.navbar-dark .navbar-nav .nav-link {
  color: inherit !important;
}
.navbar.navbar-dark .dropdown-desktop.order-3 {
  flex-grow: 1 !important;
  justify-content: center !important;
}
@media (min-width: 992px) {
  .navbar.navbar-dark .dropdown-desktop.order-3 .navbar-nav {
    justify-content: center;
  }
}
.navbar.navbar-dark .dropdown-desktop.order-3 .navbar-nav .nav-item .nav-link {
  color: var(--primary-color);
  font-weight: 400;
}
.navbar.navbar-dark .dropdown-desktop.order-3 .navbar-nav .nav-item .nav-link:hover {
  background-color: var(--secondary-background);
  color: var(--primary-color);
}
.navbar.navbar-dark .dropdown-desktop.order-3 .navbar-nav .nav-item.active .nav-link, .navbar.navbar-dark .dropdown-desktop.order-3 .navbar-nav .nav-item.active > .nav-link:hover {
  background-color: var(--secondary-background);
  color: var(--primary-color);
}
.navbar.navbar-dark .dropdown-desktop.order-3 .navbar-nav .text-light {
  color: var(--primary-color) !important;
}
.navbar.navbar-dark .navbar-toggler {
  color: var(--primary-color) !important;
}
/* Boutons switch mode en haut à droite */
#user-menu-management,
#user-menu-sales {
  margin-right: 30px;
  color: var(--primary-color) !important;
}
#user-menu-management:before,
#user-menu-sales:before {
  content: "Basculer vers ";
  color: var(--tertiary-color);
  font-weight: 400;
}

#user-menu-account,
.additional-info {
  color: var(--primary-color) !important;
}

#user-initials {
  color: var(--primary-color) !important;
}
#user-initials:after {
  color: var(--primary-color) !important;
}

.top-navigation-bar,
footer.page-footer {
  background: var(--primary-background) !important;
}

#nav-to-documents {
  display: none !important;
}

/* Liste rubriques */
.catalog-tag-prestes-container {
  max-width: 1400px;
  margin: 60px auto !important;
}
.catalog-tag-prestes-container .grid-item {
  background: #fff !important;
  border-radius: 0 !important;
  border: 0 !important;
  /* Spécial 'Tous les produits' */
}
.catalog-tag-prestes-container .grid-item .image-wrapper {
  height: 230px !important;
}
.catalog-tag-prestes-container .grid-item .image-wrapper .image {
  height: 230px !important;
}
.catalog-tag-prestes-container .grid-item .bottom-wrapper {
  background: #fff !important;
  height: auto !important;
}
.catalog-tag-prestes-container .grid-item .bottom-wrapper .details {
  height: 70px !important;
  width: calc(100% - 60px) !important;
}
.catalog-tag-prestes-container .grid-item .bottom-wrapper .details .name {
  font-weight: 400 !important;
  font-size: 17px !important;
  padding-top: 10px !important;
  color: var(--primary-color) !important;
}
.catalog-tag-prestes-container .grid-item .bottom-wrapper .details .description {
  display: none !important;
}
.catalog-tag-prestes-container .grid-item.no-preset-box {
  display: none !important;
}

.has-project-specification-icon.fa-product-hunt:before {
  content: var(--securite-enfant-image) !important;
  width: 40px;
  display: block;
  margin: 0 auto;
}
.has-project-specification-icon.fa-product-hunt:after {
  content: "Sans sécurité enfant";
  font-family: var(--font-family) !important;
  font-size: 11px !important;
  width: 60px;
  display: block;
  text-align: center;
}

app-filters-view {
  padding: 0 !important;
}
app-filters-view .filters-view-wrapper {
  overflow-y: auto;
  padding: 25px;
}
app-filters-view .filters-view-wrapper .filters-tag-groups-wrapper {
  overflow-y: visible !important;
}

.fabric_spec_table {
  width: 100%;
  table-layout: fixed;
}
.fabric_spec_table th, .fabric_spec_table td {
  text-align: center;
  padding: 5px;
  padding: 5px;
  font-size: 14px;
  vertical-align: top;
}
.fabric_spec_table th img, .fabric_spec_table td img {
  max-width: 65px;
  height: auto;
}
.fabric_spec_table .fabric_spec_table_icons {
  background: #484847;
  color: #fff;
}

.fabric_img {
  aspect-ratio: 1/1;
  position: relative;
  width: 100%;
}
.fabric_img .fabric_img_recto,
.fabric_img .fabric_img_verso {
  position: absolute;
  width: 50%;
  height: 100%;
  overflow: hidden;
  top: 0;
  z-index: 1;
  transition: all 0.3s;
}
.fabric_img .fabric_img_recto:hover,
.fabric_img .fabric_img_verso:hover {
  width: 80%;
  z-index: 2;
}
.fabric_img .fabric_img_recto img,
.fabric_img .fabric_img_verso img {
  position: relative;
  z-index: 1;
  max-height: 100%;
}
.fabric_img .fabric_img_recto .fabric_btn,
.fabric_img .fabric_img_verso .fabric_btn {
  position: absolute;
  display: block;
  z-index: 2;
  top: 15px;
  background: var(--primary-color);
  color: #fff;
  padding: 3px 5px;
  border-radius: 3px;
}
.fabric_img .fabric_img_recto {
  left: 0;
}
.fabric_img .fabric_img_recto .fabric_btn {
  left: 15px;
}
.fabric_img .fabric_img_verso {
  right: 0;
}
.fabric_img .fabric_img_verso .fabric_btn {
  right: 15px;
}

.fabric_table {
  width: 100%;
  font-size: 15px;
}
.fabric_table tr {
  border-bottom: 1px solid #ddd;
}
.fabric_table td, .fabric_table th {
  text-align: left;
  padding: 5px;
}

.fabric_img {
  text-align: center;
}

/* #region configurator FSN */
form[name=formConfigurator] {
  max-width: 1650px;
  margin-left: auto;
  margin-right: auto;
}

.left-content {
  /* Options avec des images ---------------------------------------------------*/
  /* Masquer le filtre de recherche texte */
  /* Exceptions toiles */
}
@media (min-width: 900px) {
  .left-content {
    /*max-width:1600px;
    margin-left:auto;
    margin-right:auto;*/
  }
}
.left-content .gridOption {
  vertical-align: top;
}
.left-content .gridOption .gridCardImageHolder {
  width: 160px;
  height: 160px;
  background: #fff;
}
.left-content .gridOption .gridOptionLabel {
  white-space: normal;
}
.left-content app-list-property-grid-filters,
.left-content .filter-input {
  display: none !important;
}
.left-content [data-name=Colour] {
  /* Filtres */
  /* Taille vignettes */
}
.left-content [data-name=Colour] app-list-property-grid-filters {
  display: block !important;
}
.left-content [data-name=Colour] .gridOptions .gridOptionsContainer .gridOption {
  width: 8rem !important;
  margin: 0 1em 1em 0;
}
.left-content [data-name=Colour] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder {
  width: auto;
  height: auto;
}
.left-content [data-name=Colour] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder .gridCardImage .gridOptionImage {
  -o-object-fit: cover !important;
     object-fit: cover !important;
  width: 100% !important;
}
.left-content [data-name=Colours1] {
  /* Filtres */
  /* Taille vignettes */
}
.left-content [data-name=Colours1] app-list-property-grid-filters {
  display: block !important;
}
.left-content [data-name=Colours1] .gridOptions .gridOptionsContainer .gridOption {
  width: 8rem !important;
  margin: 0 1em 1em 0;
}
.left-content [data-name=Colours1] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder {
  width: auto;
  height: auto;
}
.left-content [data-name=Colours1] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder .gridCardImage .gridOptionImage {
  -o-object-fit: cover !important;
     object-fit: cover !important;
  width: 100% !important;
}
.left-content [data-name=ProductColour] {
  /* Filtres */
  /* Taille vignettes */
}
.left-content [data-name=ProductColour] app-list-property-grid-filters {
  display: block !important;
}
.left-content [data-name=ProductColour] .gridOptions .gridOptionsContainer .gridOption {
  width: 8rem !important;
  margin: 0 1em 1em 0;
}
.left-content [data-name=ProductColour] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder {
  width: auto;
  height: auto;
}
.left-content [data-name=ProductColour] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder .gridCardImage .gridOptionImage {
  -o-object-fit: cover !important;
     object-fit: cover !important;
  width: 100% !important;
}
.left-content [data-name=RAL] {
  /* Filtres */
  /* Taille vignettes */
}
.left-content [data-name=RAL] app-list-property-grid-filters {
  display: block !important;
}
.left-content [data-name=RAL] .gridOptions .gridOptionsContainer .gridOption {
  width: 8rem !important;
  margin: 0 1em 1em 0;
}
.left-content [data-name=RAL] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder {
  width: auto;
  height: auto;
}
.left-content [data-name=RAL] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder .gridCardImage .gridOptionImage {
  -o-object-fit: cover !important;
     object-fit: cover !important;
  width: 100% !important;
}
.left-content [data-name=ProfileColour] {
  /* Filtres */
  /* Taille vignettes */
}
.left-content [data-name=ProfileColour] app-list-property-grid-filters {
  display: block !important;
}
.left-content [data-name=ProfileColour] .gridOptions .gridOptionsContainer .gridOption {
  width: 8rem !important;
  margin: 0 1em 1em 0;
}
.left-content [data-name=ProfileColour] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder {
  width: auto;
  height: auto;
}
.left-content [data-name=ProfileColour] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder .gridCardImage .gridOptionImage {
  -o-object-fit: cover !important;
     object-fit: cover !important;
  width: 100% !important;
}
.left-content [data-name="Multi Colour 2"] {
  /* Filtres */
  /* Taille vignettes */
}
.left-content [data-name="Multi Colour 2"] app-list-property-grid-filters {
  display: block !important;
}
.left-content [data-name="Multi Colour 2"] .gridOptions .gridOptionsContainer .gridOption {
  width: 8rem !important;
  margin: 0 1em 1em 0;
}
.left-content [data-name="Multi Colour 2"] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder {
  width: auto;
  height: auto;
}
.left-content [data-name="Multi Colour 2"] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder .gridCardImage .gridOptionImage {
  -o-object-fit: cover !important;
     object-fit: cover !important;
  width: 100% !important;
}
.left-content [data-name="Multi Colour 3"] {
  /* Filtres */
  /* Taille vignettes */
}
.left-content [data-name="Multi Colour 3"] app-list-property-grid-filters {
  display: block !important;
}
.left-content [data-name="Multi Colour 3"] .gridOptions .gridOptionsContainer .gridOption {
  width: 8rem !important;
  margin: 0 1em 1em 0;
}
.left-content [data-name="Multi Colour 3"] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder {
  width: auto;
  height: auto;
}
.left-content [data-name="Multi Colour 3"] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder .gridCardImage .gridOptionImage {
  -o-object-fit: cover !important;
     object-fit: cover !important;
  width: 100% !important;
}
.left-content [data-name="Multi Colour 4"] {
  /* Filtres */
  /* Taille vignettes */
}
.left-content [data-name="Multi Colour 4"] app-list-property-grid-filters {
  display: block !important;
}
.left-content [data-name="Multi Colour 4"] .gridOptions .gridOptionsContainer .gridOption {
  width: 8rem !important;
  margin: 0 1em 1em 0;
}
.left-content [data-name="Multi Colour 4"] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder {
  width: auto;
  height: auto;
}
.left-content [data-name="Multi Colour 4"] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder .gridCardImage .gridOptionImage {
  -o-object-fit: cover !important;
     object-fit: cover !important;
  width: 100% !important;
}
.left-content [data-name="Multi Colour 5"] {
  /* Filtres */
  /* Taille vignettes */
}
.left-content [data-name="Multi Colour 5"] app-list-property-grid-filters {
  display: block !important;
}
.left-content [data-name="Multi Colour 5"] .gridOptions .gridOptionsContainer .gridOption {
  width: 8rem !important;
  margin: 0 1em 1em 0;
}
.left-content [data-name="Multi Colour 5"] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder {
  width: auto;
  height: auto;
}
.left-content [data-name="Multi Colour 5"] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder .gridCardImage .gridOptionImage {
  -o-object-fit: cover !important;
     object-fit: cover !important;
  width: 100% !important;
}
.left-content [data-name=Multicolour2] {
  /* Filtres */
  /* Taille vignettes */
}
.left-content [data-name=Multicolour2] app-list-property-grid-filters {
  display: block !important;
}
.left-content [data-name=Multicolour2] .gridOptions .gridOptionsContainer .gridOption {
  width: 8rem !important;
  margin: 0 1em 1em 0;
}
.left-content [data-name=Multicolour2] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder {
  width: auto;
  height: auto;
}
.left-content [data-name=Multicolour2] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder .gridCardImage .gridOptionImage {
  -o-object-fit: cover !important;
     object-fit: cover !important;
  width: 100% !important;
}
.left-content [data-name=Multicolour3] {
  /* Filtres */
  /* Taille vignettes */
}
.left-content [data-name=Multicolour3] app-list-property-grid-filters {
  display: block !important;
}
.left-content [data-name=Multicolour3] .gridOptions .gridOptionsContainer .gridOption {
  width: 8rem !important;
  margin: 0 1em 1em 0;
}
.left-content [data-name=Multicolour3] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder {
  width: auto;
  height: auto;
}
.left-content [data-name=Multicolour3] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder .gridCardImage .gridOptionImage {
  -o-object-fit: cover !important;
     object-fit: cover !important;
  width: 100% !important;
}
.left-content [data-name=Multicolour4] {
  /* Filtres */
  /* Taille vignettes */
}
.left-content [data-name=Multicolour4] app-list-property-grid-filters {
  display: block !important;
}
.left-content [data-name=Multicolour4] .gridOptions .gridOptionsContainer .gridOption {
  width: 8rem !important;
  margin: 0 1em 1em 0;
}
.left-content [data-name=Multicolour4] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder {
  width: auto;
  height: auto;
}
.left-content [data-name=Multicolour4] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder .gridCardImage .gridOptionImage {
  -o-object-fit: cover !important;
     object-fit: cover !important;
  width: 100% !important;
}
.left-content [data-name=Multicolour5] {
  /* Filtres */
  /* Taille vignettes */
}
.left-content [data-name=Multicolour5] app-list-property-grid-filters {
  display: block !important;
}
.left-content [data-name=Multicolour5] .gridOptions .gridOptionsContainer .gridOption {
  width: 8rem !important;
  margin: 0 1em 1em 0;
}
.left-content [data-name=Multicolour5] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder {
  width: auto;
  height: auto;
}
.left-content [data-name=Multicolour5] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder .gridCardImage .gridOptionImage {
  -o-object-fit: cover !important;
     object-fit: cover !important;
  width: 100% !important;
}
.left-content [data-name=RalSpecialColour] {
  /* Filtres */
  /* Taille vignettes */
}
.left-content [data-name=RalSpecialColour] app-list-property-grid-filters {
  display: block !important;
}
.left-content [data-name=RalSpecialColour] .gridOptions .gridOptionsContainer .gridOption {
  width: 8rem !important;
  margin: 0 1em 1em 0;
}
.left-content [data-name=RalSpecialColour] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder {
  width: auto;
  height: auto;
}
.left-content [data-name=RalSpecialColour] .gridOptions .gridOptionsContainer .gridOption .gridCardImageHolder .gridCardImage .gridOptionImage {
  -o-object-fit: cover !important;
     object-fit: cover !important;
  width: 100% !important;
}
.left-content [id^=Fabric] [id^=hde-conf-] {
  /*display:flex;*/
  margin-bottom: 10px;
}
.left-content [id^=Fabric] [id^=hde-conf-] label {
  margin: 0 1em 0 0;
  min-width: 18em;
}
.left-content [id^=Fabric] [id^=hde-conf-] .mat-form-field-infix {
  margin: 0;
  width: 50%;
}

hde-summary-details .summary-field-name,
hde-summary-details .summary-field-value {
  font-size: 14px !important;
}

.login-page::before,
.dashboard-home {
  background-image: var(--background-image);
  background-position: 50% 50% !important;
  background-size: cover;
  background-repeat: no-repeat;
}

.login-page .spacious-element {
  margin-bottom: 2em !important;
}

.dashboard-home .container {
  margin-top: 70px;
}

.login-box {
  background: var(--primary-background);
  padding-left: 40px !important;
  padding-right: 40px !important;
}
.login-box .md-form label {
  z-index: 1;
}
.login-box .md-form input[type=password] {
  z-index: 2;
  position: relative;
}
.login-box .showPasswordImg {
  margin-top: -34px;
  z-index: 3;
  position: relative;
  cursor: pointer;
}
.login-box .recovery-button {
  text-transform: none;
  color: var(--primary-color) !important;
  text-decoration: underline;
  font-weight: bold;
  font-size: 15px;
}
.login-box .recovery-button:before {
  content: "›";
  margin-right: 5px;
  display: inline-block;
}
.login-box .panel-heading .sub-title {
  font-size: 1.4em !important;
}
.login-box .login-button,
.login-box .login-button:active,
.login-box .btn-primary.login-button:active {
  background-color: transparent !important;
  border: 2px solid var(--primary-color) !important;
  box-shadow: none;
  color: var(--primary-color) !important;
  border: 1px solid var(--primary-color);
  border-radius: var(--border-radius-button);
  margin-top: 30px !important;
}

sales-item-lines .lines-header-section .lines-action-buttons {
  flex: 1 1 auto;
  justify-content: center;
}
sales-item-lines .item-line-total-price {
  height: 88px !important;
}

.dashboard-home-management-background {
  background-image: url(https://www.filtersun.com/plato/various/sales_bg.jpg);
  background-size: cover;
}
.dashboard-home-management-background .widget div {
  border-radius: 0 !important;
}

/* Aperçu upload logo dealer */
.big-logo-holder img {
  max-width: 100%;
  height: auto;
  display: block;
  max-width: 250px;
}

/* Image dynamique dans conditions d'achat */
.item-summary-image {
  max-width: 300px;
  height: auto;
  margin-bottom: 50px;
  margin-left: 0.5rem !important;
  margin-right: 0.5rem !important;
  position: relative !important;
  display: inline-block !important;
  right: initial !important;
  top: initial !important;
}

.charge-item {
  background: #fff;
}

order-header .details-field-name {
  width: 50% !important;
}
order-header .details-field-value {
  /*width:50% !important;*/
}

@media print {
  .overflow-auto {
    overflow: visible !important;
  }
  .expanded-details-row {
    overflow: visible !important;
    height: auto !important;
    min-height: auto !important;
    visibility: visible !important;
  }
}
app-list-property-modal .list-property-modal-container {
  height: auto !important;
  max-height: calc(100vh - 90px) !important;
  max-width: 1260px !important;
}

configurator-list-media-gallery .image-preview {
  display: none !important;
}
configurator-list-media-gallery .description-preview {
  width: 100% !important;
}
configurator-list-media-gallery ng-image-slider {
  display: none !important;
}

@media (min-width: 768px) {
  .blocInfo {
    min-height: 100%;
    display: flex;
  }
  .blocInfo .row {
    min-height: 100%;
    width: 100%;
  }
  .blocInfo .row > div:first-child {
    align-self: stretch !important;
    min-height: 100%;
    margin-top: -24px;
    margin-left: -40px;
    margin-bottom: -24px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .blocInfo .row > div:last-child {
    padding-left: 40px;
  }
}
.bg-image {
  position: relative;
  width: 100%;
  height: 100%;
}
.bg-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  left: 0;
  top: 0;
}

/* Actualités sur sales homepage */
.posts-overview-container .posts-overview-header {
  display: none !important;
}
.posts-overview-container .post-container {
  height: auto !important;
  display: block !important;
}
.posts-overview-container .post-container .post-image {
  width: auto !important;
  height: auto !important;
}
.posts-overview-container .post-container .post-image img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
}
.posts-overview-container .post-container .post-short {
  width: auto !important;
  overflow: visible !important;
  height: auto !important;
  padding: 15px 30px !important;
}
.posts-overview-container .post-container .post-short .post-title {
  font-size: 14px !important;
  font-weight: bold !important;
  overflow: visible !important;
  text-overflow: initial !important;
  white-space: initial !important;
}
.posts-overview-container .post-container .post-short .post-description {
  overflow: visible !important;
  height: auto !important;
  white-space: initial !important;
  font-size: 14px !important;
}
.posts-overview-container .post-container .post-data {
  display: none !important;
}

.post-preview-container {
  height: auto !important;
}
.post-preview-container .post-preview-header {
  display: none !important;
}

/*--------------------------------------------------------------------------*/
/* #region general ---------------------------------------------------------*/
body {
  background-color: var(--secondary-background);
  color: var(--primary-color);
}

body * {
  font-family: var(--font-family);
  font-weight: 300;
}

* ::-webkit-scrollbar-thumb {
  background: #555 !important;
}

* ::-webkit-scrollbar {
  width: 9px !important;
}

.blockHeader {
  margin-bottom: 1em !important;
  color: var(--primary-color) !important;
  font-size: 25px !important;
}

/*--------------------------------------------------------------------------*/
/* #region catalog ---------------------------------------------------------*/
bms-catalog app-filters-view {
  background: #f6f6f6 !important;
}
bms-catalog app-filters-view .checkbox-wrapper:hover {
  background: var(--secondary-background);
}
bms-catalog .items-wrapper {
  padding-left: 50px;
}

/*--------------------------------------------------------------------------*/
/* #region overlay ---------------------------------------------------------*/
.cdk-overlay-backdrop {
  background: rgba(255, 255, 255, 0.85);
  -webkit-backdrop-filter: blur(2px);
          backdrop-filter: blur(2px);
  transition: all 0.2s !important;
}

.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing {
  opacity: 0.7 !important;
}

/* Divers */
#summarystep {
  background: #fff !important;
}
@media (min-width: 992px) {
  #summarystep .summary-contents {
    max-width: 50%;
    flex: 0 0 50%;
  }
  #summarystep .summary-contents .step-name {
    font-size: 17px !important;
    font-weight: 600 !important;
  }
  #summarystep .summary-contents .summary-property {
    font-size: 14px !important;
  }
}
@media (min-width: 1900px) {
  #summarystep .general-error-messages-container {
    flex: 0 0 33% !important;
    max-width: 33% !important;
  }
  #summarystep .summary-contents {
    flex: 0 0 60% !important;
    max-width: 60% !important;
    -moz-column-count: 2;
         column-count: 2;
    -moz-column-gap: 80px;
         column-gap: 80px;
    -moz-column-rule-width: 1px;
         column-rule-width: 1px;
    -moz-column-rule-color: #ddd;
         column-rule-color: #ddd;
  }
  #summarystep .summary-contents hde-summary-element {
    display: block;
    -webkit-column-break-inside: avoid;
  }
}

[class*=-overview] .search-field .mat-form-field-wrapper .mat-form-field-flex:after {
  padding: 0 12px;
}

[aria-label][data-balloon-pos][data-balloon-pos^=down][data-balloon-custom]:after {
  display: none !important;
}

/*
[data-name="ProductDropC"]{
  .blockProperty-label{
    visibility: hidden;

    &:after{
      visibility: visible;
      display: block;
      content: 'C - Hauteur (mm)';
    }
  }
}
*/
/*-----------------------------------------------------------*/
/* Banner ---------------------------------------------------*/
/*
.content-holder{
  &:before{
    display:block;
    background:#ed8b00;
    color:#fff !important;
    padding:10px 25px;
    text-align:center;
    font-size:15px !important;
    content:'Attention, les prix affichés des télécommandes et accessoires de motorisations sont temporairement en prix publics HT (sans votre remise et vos coefficients).';
  }
}
*/
/* Banner 2 */
@media (min-width: 992px) {
  /*
    #order-details-book-order-button{ 
      position: relative;

      &:before{
        -webkit-animation: pulsate 3s ease-out;
        -webkit-animation-iteration-count: infinite;
        position:absolute;
        display: block;
        content: "Cliquez ici pour valider votre commande d'achat";
        position: absolute;
        bottom: calc(100% + 12px);
        width: 100%;
        left: 0;
        font-size: 13px;
        padding: 5px;
        background-color: var(--primary-button-background) !important;
        color:#fff !important;
        border-radius:5px;


      }

      &:after{
        content:'';
        display:block;
        position: absolute;
        border: 0 solid transparent;
        border-right-width: 10px;
        border-left-width: 10px;
        border-top: 10px solid var(--primary-button-background) !important;
        left:calc(50% - 8px);
        bottom:calc(100% + 2px);
        -webkit-animation: pulsate 3s ease-out;
        -webkit-animation-iteration-count: infinite;
      }
    }*/
}
#new-purchase-btn,
.order-details .button-wrapper .btn.btn-tertiary[disabled] {
  display: none !important;
}

/* Masquer btn purchase price */
.mat-header-cell.cdk-header-cell.item-price.cdk-column-PriceCalculations.mat-column-PriceCalculations {
  position: relative !important;
}
.mat-header-cell.cdk-header-cell.item-price.cdk-column-PriceCalculations.mat-column-PriceCalculations:after {
  content: "" !important;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
}
.mat-header-cell.cdk-header-cell.item-price.cdk-column-PriceCalculations.mat-column-PriceCalculations .rfq-asterix {
  font-weight: 500 !important;
  color: var(--primary-color) !important;
}
.mat-header-cell.cdk-header-cell.item-price.cdk-column-PriceCalculations.mat-column-PriceCalculations .rfq-asterix:after {
  content: "" !important;
}

.price-excl-vat-container .mobile-view-label.rfq-asterix {
  display: none !important;
}

#nav-to-dealerportal {
  display: none !important;
}

.popup-tabs {
  display: grid;
  grid-template-columns: 220px 1fr;
  height: 100%;
}

.popup-tabs details {
  display: contents;
}

.popup-tabs summary {
  grid-column: 1;
  padding: 10px 12px;
  cursor: pointer;
  list-style: none;
  border-right: 1px solid #ddd;
  align-self: start;
}

.popup-tabs summary::-webkit-details-marker {
  display: none;
}

/* On cache TOUS les panels par défaut */
.popup-tabs .panel {
  grid-column: 2;
  padding: 16px;
  height: 100%;
  overflow: auto;
  display: none;
  align-self: start;
}

/* ✅ Le panel visible = celui du bloc qui a le focus */
.popup-tabs details:focus-within > .panel {
  display: block;
}

/* ✅ Style onglet actif */
.popup-tabs details:focus-within > summary {
  background: #eee;
  font-weight: 600;
}

/* ✅ Défault: onglet 1 visible tant que rien n’a le focus (au chargement / clic hors zone) */
.popup-tabs:focus-within details:first-child > .panel {
  display: none; /* dès qu'un autre prend le focus, on enlève le défaut */
}

.popup-tabs details:first-child > .panel {
  display: block;
}/*# sourceMappingURL=theme.css.map */