/*
 * V15: lighter rug relief and compact, always-legible rug controls.
 */

#configurateur-tresse-root.is-rug-active .panelBody > .opt-rug:not([hidden]),
#configurateur-tresse-root.is-rug-active .opt-rug,
#configurateur-tresse-root.is-rug-active .opt-rug-main{
  height:auto !important;
  min-height:0 !important;
}

#configurateur-tresse-root.is-rug-active[data-mobile-step="1"] #mainPanel:not(.is-closed){
  height:auto !important;
  max-height:calc(100dvh - 196px) !important;
}

#configurateur-tresse-root.is-rug-active[data-mobile-step="1"] .panelBody{
  flex:0 1 auto !important;
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
}

#configurateur-tresse-root.is-rug-active #rugTypeChips,
#configurateur-tresse-root.is-rug-active #rugTypeChips .btn,
#configurateur-tresse-root.is-rug-active #rugTypeChips .chip,
#configurateur-tresse-root.is-rug-active #rugChips,
#configurateur-tresse-root.is-rug-active #rugChips button,
#configurateur-tresse-root.is-rug-active .rug-layer-card button{
  opacity:1 !important;
  visibility:visible !important;
}

#configurateur-tresse-root.is-rug-active .rug-type-grid{
  position:relative !important;
  z-index:2 !important;
}

#configurateur-tresse-root.is-rug-active #mainPanel .rug-layer-picker{
  border-color:var(--v14-line) !important;
  background:rgba(255, 255, 255, .58) !important;
}

#configurateur-tresse-root.is-rug-active #mainPanel .rug-layer-picker.is-open{
  border-color:rgba(201, 135, 95, .40) !important;
  background:#fff !important;
}

#configurateur-tresse-root.is-rug-active #mainPanel .rug-layer-header{
  background:transparent !important;
  color:var(--v14-ink) !important;
}

#configurateur-tresse-root.is-rug-active #mainPanel .rug-layer-index{
  background:var(--v14-accent-soft) !important;
  color:#75482f !important;
}

#configurateur-tresse-root.is-rug-active #mainPanel .rug-layer-header strong,
#configurateur-tresse-root.is-rug-active #mainPanel .rug-layer-chevron{
  color:var(--v14-muted) !important;
}

#configurateur-tresse-root.is-rug-active #mainPanel .rug-layer-body{
  border-top-color:var(--v14-line) !important;
}

#configurateur-tresse-root.is-rug-active #mainPanel .rug-fabric-type-grid .rug-fabric-type-chip{
  border-color:var(--v14-line) !important;
  background:rgba(255, 255, 255, .76) !important;
  color:#4f4640 !important;
}

#configurateur-tresse-root.is-rug-active #mainPanel .rug-fabric-type-grid .rug-fabric-type-chip:hover{
  border-color:rgba(201, 135, 95, .42) !important;
  background:#fff !important;
  color:var(--v14-ink) !important;
}

#configurateur-tresse-root.is-rug-active #mainPanel .rug-fabric-type-grid .rug-fabric-type-chip.active,
#configurateur-tresse-root.is-rug-active #mainPanel .rug-fabric-type-grid .rug-fabric-type-chip[aria-pressed="true"]{
  border-color:rgba(201, 135, 95, .48) !important;
  background:var(--v14-accent-soft) !important;
  color:#6e432d !important;
  box-shadow:0 7px 18px rgba(128, 77, 47, .11) !important;
}

@media (max-width:980px){
  #configurateur-tresse-root.is-rug-active[data-mobile-step="1"] #mainPanel:not(.is-closed){
    inset:auto 8px 82px 8px !important;
    max-height:calc(100dvh - 150px) !important;
  }

  #configurateur-tresse-root.is-rug-active[data-mobile-step="1"] .opt-rug-main{
    padding-bottom:16px !important;
  }
}
