/* MEF 20.11.09 - single authoritative control style for Benefits and Four Mechanisms.
   Both viewers load this exact file and use the same markup classes. */
.mef-carousel-controls {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
}
.mef-carousel-controls .mef-carousel-button {
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 40px;
  width:40px;
  height:40px;
  min-width:40px;
  min-height:40px;
  padding:0!important;
  margin:0;
  border:1px solid #5c7987;
  border-radius:5px;
  background:transparent;
  color:#edf6f8;
  box-shadow:none;
  transform:none;
  font-size:16px;
  line-height:1;
  cursor:pointer;
  -webkit-appearance:none;
  appearance:none;
}
.mef-carousel-controls .mef-carousel-button--forward {
  border-color:#63caee;
  background:#63caee;
  color:#071218;
}
.mef-carousel-controls .mef-carousel-button svg {
  display:block;
  flex:none;
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.3;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.mef-carousel-controls .mef-carousel-button:hover { border-color:#63caee; }
.mef-carousel-controls .mef-carousel-button--forward:hover {
  border-color:#63caee;
  background:#63caee;
  color:#071218;
}
.mef-carousel-controls .mef-carousel-button:focus-visible {
  outline:2px solid #63caee;
  outline-offset:3px;
}
.mef-carousel-controls .mef-carousel-button:disabled {
  opacity:.45;
  cursor:not-allowed;
}
/* Override inherited controls without changing other template buttons. */
.mef-product-page .mef-slide-navigation.mef-carousel-controls .mef-carousel-button,
.foot .buttons.mef-carousel-controls .mef-carousel-button {
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  min-height:40px!important;
  padding:0!important;
  border-radius:5px!important;
  border:1px solid #5c7987!important;
  background:transparent!important;
  color:#edf6f8!important;
  box-shadow:none!important;
  transform:none!important;
}
.mef-product-page .mef-slide-navigation.mef-carousel-controls .mef-carousel-button--forward,
.foot .buttons.mef-carousel-controls .mef-carousel-button--forward {
  border-color:#63caee!important;
  background:#63caee!important;
  color:#071218!important;
}
.mef-product-page .mef-slide-navigation.mef-carousel-controls .mef-carousel-button svg,
.foot .buttons.mef-carousel-controls .mef-carousel-button svg {
  width:19px!important;
  height:19px!important;
}