/*
 * Send Listy Core 0.708 — Canonical Currency Window
 * Parent: Core 0.707
 * Scope: header currency dialog only. No Settings, language popover, generic modal,
 * Homepage Control, Content Hub, Video Tutorials or bottom-nav styling is changed.
 */

.sl-header-choice-portal.is-currency-open .sl-header-choice-scrim{
  top:var(--sl-currency-scrim-top,0px);
  bottom:var(--sl-currency-scrim-bottom,0px);
  left:var(--sl-currency-app-left,0px);
  width:var(--sl-currency-app-width,100vw);
  right:auto;
  background:rgba(4,10,15,.34);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.sl-header-choice-portal.is-currency-open .sl-header-currency-sheet{
  left:var(--sl-currency-window-left,12px);
  top:var(--sl-currency-window-top,72px);
  bottom:var(--sl-currency-window-bottom,94px);
  width:var(--sl-currency-window-width,calc(100vw - 24px));
  max-height:none;
  transform:none;
  border-radius:22px;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:0;
  overflow:hidden;
}

.sl-header-choice-portal.is-currency-open .sl-header-currency-window-head{
  direction:ltr;
  flex:0 0 58px;
  min-height:58px;
  display:grid;
  grid-template-columns:52px minmax(0,1fr) 52px;
  align-items:center;
  gap:0;
  padding:0 4px;
  border-bottom:1px solid #e2e8e4;
  background:#fff;
}

.sl-header-choice-portal.is-currency-open .sl-header-currency-window-head>[data-sl-currency-back]{grid-column:1}
.sl-header-choice-portal.is-currency-open .sl-header-currency-heading{grid-column:2;min-width:0;display:grid;gap:1px;text-align:center}
.sl-header-choice-portal.is-currency-open .sl-header-currency-window-head>[data-sl-currency-close]{grid-column:3}
.sl-header-choice-portal.is-currency-open .sl-header-currency-heading strong{font-size:18px;line-height:1.18;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sl-header-choice-portal.is-currency-open .sl-header-currency-heading small{font-size:11px;line-height:1.2;color:#748078;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.sl-header-choice-portal.is-currency-open .sl-header-currency-window-head>button{
  margin:0;
  width:44px;
  height:44px;
  justify-self:center;
  border:0;
  border-radius:12px;
  background:transparent;
  color:#2d3932;
  font:inherit;
  font-size:26px;
  line-height:1;
  display:grid;
  place-items:center;
  cursor:pointer;
}
.sl-header-choice-portal.is-currency-open .sl-header-currency-window-head>button:hover,
.sl-header-choice-portal.is-currency-open .sl-header-currency-window-head>button:focus-visible{
  background:#f1f6f2;
  outline:none;
}

.sl-header-choice-portal.is-currency-open .sl-header-currency-search{
  flex:0 0 48px;
  margin:12px 14px 0;
}
.sl-header-choice-portal.is-currency-open .sl-header-currency-popular-wrap{
  flex:0 0 auto;
  margin:10px 14px 0;
}
.sl-header-choice-portal.is-currency-open .sl-header-currency-all-head{
  flex:0 0 auto;
  margin:10px 14px 7px;
}
.sl-header-choice-portal.is-currency-open .sl-header-currency-list{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  padding:0 14px 14px;
  align-content:start;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}

.sl-header-choice-portal.is-dark.is-currency-open .sl-header-currency-window-head{
  background:#18222e;
  border-bottom-color:#334352;
}
.sl-header-choice-portal.is-dark.is-currency-open .sl-header-currency-heading small{color:#a7b3bf}
.sl-header-choice-portal.is-dark.is-currency-open .sl-header-currency-window-head>button{
  background:transparent;
  color:#edf2f7;
  border:0;
}
.sl-header-choice-portal.is-dark.is-currency-open .sl-header-currency-window-head>button:hover,
.sl-header-choice-portal.is-dark.is-currency-open .sl-header-currency-window-head>button:focus-visible{
  background:#253441;
}

@media(max-width:560px){
  .sl-header-choice-portal.is-currency-open .sl-header-currency-sheet{
    border-radius:20px;
  }
  .sl-header-choice-portal.is-currency-open .sl-header-currency-window-head{
    grid-template-columns:48px minmax(0,1fr) 48px;
    min-height:56px;
    flex-basis:56px;
  }
  .sl-header-choice-portal.is-currency-open .sl-header-currency-window-head>button{
    width:42px;
    height:42px;
  }
  .sl-header-choice-portal.is-currency-open .sl-header-currency-search{
    margin-inline:12px;
  }
  .sl-header-choice-portal.is-currency-open .sl-header-currency-popular-wrap,
  .sl-header-choice-portal.is-currency-open .sl-header-currency-all-head{
    margin-inline:12px;
  }
  .sl-header-choice-portal.is-currency-open .sl-header-currency-list{
    padding-inline:12px;
    padding-bottom:12px;
  }
}
