/* LUMIERE 15.7 — equal, centered morning/evening routine panels */
.lm-routines::before {
  display: none !important;
}

/* Keep the skin-type selector compact and identical in both panels. */
.lm-routines .lm-skin-switcher {
  width: 206px !important;
  max-width: 100% !important;
  align-self: center !important;
  flex: 0 0 auto !important;
  display: inline-flex !important;
  justify-content: center !important;
  padding: 4px !important;
}

.lm-routines .lm-skin-switcher button {
  width: 98px !important;
  min-width: 0 !important;
  flex: 0 0 98px !important;
}

.lm-routines .lm-routine h2 {
  width: 100% !important;
  text-align: center !important;
}

.lm-routines .lm-routine--evening h2 {
  color: #fff !important;
}

/* One button language for morning and evening. */
.lm-routines .lm-routine .lm-btn,
.lm-routines .lm-routine .lm-btn:link,
.lm-routines .lm-routine .lm-btn:visited {
  min-width: 210px !important;
  min-height: 48px !important;
  padding: 0 25px !important;
  border: 1px solid rgba(183, 138, 74, .55) !important;
  border-radius: 999px !important;
  background: #292520 !important;
  color: #fff !important;
  box-shadow: 0 12px 28px rgba(23, 20, 17, .2) !important;
}

.lm-routines .lm-routine .lm-btn:hover {
  background: #171411 !important;
  border-color: #b78a4a !important;
  color: #fff !important;
  transform: translateY(-2px) !important;
}

@media (min-width: 651px) {
  .lm-routines .lm-routine {
    min-height: 650px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .lm-routines .lm-routine > div {
    width: min(58%, 470px) !important;
    height: 540px !important;
    min-height: 540px !important;
    margin: 0 auto !important;
    padding: 36px 38px 32px !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
    border: 1px solid rgba(183, 138, 74, .5) !important;
    box-shadow: 0 22px 58px rgba(23, 20, 17, .16), inset 0 0 0 1px rgba(255, 255, 255, .18) !important;
    backdrop-filter: blur(16px) !important;
  }

  .lm-routines .lm-routine--morning > div {
    background: rgba(250, 246, 241, .84) !important;
  }

  .lm-routines .lm-routine--evening > div {
    background: rgba(25, 19, 15, .84) !important;
  }

  .lm-routines .lm-routine h2 {
    margin-bottom: 24px !important;
  }

  .lm-routines .lm-routine ol {
    margin-bottom: 18px !important;
  }

  .lm-routines .lm-routine .lm-btn {
    margin-top: auto !important;
    align-self: center !important;
  }
}

@media (max-width: 650px) {
  .lm-routines .lm-skin-switcher {
    width: 194px !important;
  }

  .lm-routines .lm-skin-switcher button {
    width: 92px !important;
    flex-basis: 92px !important;
  }

  .lm-routines .lm-routine > div {
    width: calc(100% - 24px) !important;
    min-height: 540px !important;
    margin: 0 auto !important;
    padding: 30px 25px !important;
    display: flex !important;
    flex-direction: column !important;
    border: 1px solid rgba(183, 138, 74, .5) !important;
    box-shadow: 0 18px 45px rgba(23, 20, 17, .16), inset 0 0 0 1px rgba(255, 255, 255, .18) !important;
  }

  .lm-routines .lm-routine .lm-btn {
    margin-top: auto !important;
    align-self: center !important;
    min-width: 205px !important;
  }
}
