
/* PAPA multilingual floating language control */
#papa-language-switcher,
#papa-language-switcher * {
  box-sizing: border-box;
}

#papa-language-switcher {
  --papa-lang-bg: rgba(12, 15, 20, .88);
  --papa-lang-bg-strong: rgba(9, 12, 17, .97);
  --papa-lang-border: rgba(255, 255, 255, .14);
  --papa-lang-text: #f7f9fc;
  --papa-lang-muted: rgba(238, 243, 250, .58);
  --papa-lang-soft: rgba(255, 255, 255, .07);
  position: fixed;
  right: max(18px, env(safe-area-inset-right));
  bottom: max(18px, env(safe-area-inset-bottom));
  z-index: 10050;
  font-family: inherit;
  color: var(--papa-lang-text);
  -webkit-font-smoothing: antialiased;
}

.papa-lang-trigger {
  position: relative;
  display: grid;
  grid-template-columns: 38px auto 18px;
  align-items: center;
  gap: 9px;
  min-width: 116px;
  height: 58px;
  padding: 8px 13px 8px 8px;
  border: 1px solid var(--papa-lang-border);
  border-radius: 18px;
  color: var(--papa-lang-text);
  background:
    linear-gradient(145deg, rgba(31, 36, 45, .92), rgba(8, 11, 16, .90)) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.22), rgba(255,255,255,.035)) border-box;
  box-shadow:
    0 18px 46px rgba(0, 0, 0, .34),
    inset 0 1px 0 rgba(255, 255, 255, .08);
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
  cursor: pointer;
  overflow: hidden;
  isolation: isolate;
  transition:
    transform .28s cubic-bezier(.2,.8,.2,1),
    box-shadow .28s ease,
    border-color .28s ease,
    background .28s ease;
}

.papa-lang-trigger::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(112deg, transparent 20%, rgba(255,255,255,.12) 47%, transparent 72%);
  transform: translateX(-140%);
  transition: transform .72s cubic-bezier(.16,.84,.24,1);
}

.papa-lang-trigger::after {
  content: "";
  position: absolute;
  right: 8px;
  top: 8px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(255,255,255,.72);
  box-shadow: 0 0 14px rgba(255,255,255,.55);
  opacity: .35;
  transition: opacity .25s ease, transform .25s ease;
}

.papa-lang-trigger:hover {
  transform: translateY(-3px);
  border-color: rgba(255,255,255,.25);
  box-shadow:
    0 23px 54px rgba(0, 0, 0, .42),
    inset 0 1px 0 rgba(255, 255, 255, .11);
}

.papa-lang-trigger:hover::before {
  transform: translateX(140%);
}

.papa-lang-trigger:hover::after,
#papa-language-switcher.is-open .papa-lang-trigger::after {
  opacity: .8;
  transform: scale(1.15);
}

.papa-lang-trigger:active {
  transform: translateY(-1px) scale(.975);
}

#papa-language-switcher.is-open .papa-lang-trigger {
  border-color: rgba(255,255,255,.30);
  background:
    linear-gradient(145deg, rgba(35, 41, 52, .97), rgba(10, 13, 19, .96)) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.30), rgba(255,255,255,.05)) border-box;
}

.papa-lang-current-flag,
.papa-lang-option-flag {
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.24);
  background: #fff;
  box-shadow:
    0 5px 14px rgba(0,0,0,.27),
    inset 0 0 0 1px rgba(0,0,0,.04);
}

.papa-lang-current-flag {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  transform: translateZ(0);
}

.papa-lang-option-flag {
  width: 44px;
  height: 44px;
  border-radius: 12px;
}

.papa-lang-current-flag::after,
.papa-lang-option-flag::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
}

.papa-lang-current-flag .papa-lang-flag-image,
.papa-lang-option-flag .papa-lang-flag-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: inherit;
  user-select: none;
  -webkit-user-drag: none;
  image-rendering: auto;
}

#papa-language-switcher.is-changing .papa-lang-current-flag {
  animation: papaLangFlagChange .48s cubic-bezier(.2,.9,.28,1.32);
}

.papa-lang-code {
  min-width: 25px;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .14em;
  line-height: 1;
}

.papa-lang-chevron {
  width: 17px;
  height: 17px;
  opacity: .65;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), opacity .22s ease;
}

#papa-language-switcher.is-open .papa-lang-chevron {
  transform: rotate(180deg);
  opacity: 1;
}

.papa-lang-panel {
  position: absolute;
  right: 0;
  bottom: calc(100% + 12px);
  width: min(304px, calc(100vw - 28px));
  padding: 10px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 22px;
  background:
    radial-gradient(circle at 92% 0%, rgba(255,255,255,.085), transparent 36%),
    linear-gradient(150deg, rgba(26,31,39,.975), rgba(8,11,16,.975));
  box-shadow:
    0 28px 75px rgba(0,0,0,.48),
    inset 0 1px 0 rgba(255,255,255,.07);
  backdrop-filter: blur(28px) saturate(150%);
  -webkit-backdrop-filter: blur(28px) saturate(150%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(10px) scale(.965);
  transform-origin: bottom right;
  transition:
    opacity .22s ease,
    visibility .22s ease,
    transform .32s cubic-bezier(.16,.84,.24,1);
}

#papa-language-switcher.is-open .papa-lang-panel {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

.papa-lang-panel-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  padding: 7px 10px 10px;
}

.papa-lang-panel-title {
  margin: 0;
  font-size: 14px;
  font-weight: 820;
  letter-spacing: -.01em;
  color: rgba(255,255,255,.96);
}

.papa-lang-panel-subtitle {
  margin: 0;
  max-width: 150px;
  text-align: right;
  font-size: 10px;
  line-height: 1.25;
  color: var(--papa-lang-muted);
}

.papa-lang-options {
  display: grid;
  gap: 5px;
}

.papa-lang-option {
  position: relative;
  width: 100%;
  display: grid;
  grid-template-columns: 44px minmax(0,1fr) 28px;
  align-items: center;
  gap: 12px;
  min-height: 66px;
  padding: 9px 10px;
  border: 1px solid transparent;
  border-radius: 15px;
  color: var(--papa-lang-text);
  background: transparent;
  text-align: left;
  cursor: pointer;
  opacity: 0;
  transform: translateY(7px);
  transition:
    opacity .22s ease,
    transform .28s cubic-bezier(.2,.8,.2,1),
    background .22s ease,
    border-color .22s ease;
}

#papa-language-switcher.is-open .papa-lang-option {
  opacity: 1;
  transform: translateY(0);
}

#papa-language-switcher.is-open .papa-lang-option:nth-child(1) { transition-delay: .035s; }
#papa-language-switcher.is-open .papa-lang-option:nth-child(2) { transition-delay: .07s; }
#papa-language-switcher.is-open .papa-lang-option:nth-child(3) { transition-delay: .105s; }

.papa-lang-option:hover,
.papa-lang-option:focus-visible {
  outline: none;
  background: rgba(255,255,255,.075);
  border-color: rgba(255,255,255,.09);
}

.papa-lang-option[aria-checked="true"] {
  background: rgba(255,255,255,.105);
  border-color: rgba(255,255,255,.13);
}

.papa-lang-option-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.papa-lang-option-copy strong {
  font-size: 14px;
  line-height: 1;
  font-weight: 780;
  letter-spacing: -.01em;
}

.papa-lang-option-copy small {
  font-size: 10px;
  line-height: 1.2;
  color: var(--papa-lang-muted);
}

.papa-lang-check {
  display: grid;
  place-items: center;
  width: 23px;
  height: 23px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 50%;
  background: rgba(255,255,255,.035);
  opacity: .45;
  transform: scale(.92);
  transition: opacity .22s ease, transform .22s ease, background .22s ease;
}

.papa-lang-check svg {
  width: 13px;
  height: 13px;
  opacity: 0;
  transform: scale(.75);
  transition: opacity .2s ease, transform .22s ease;
}

.papa-lang-option[aria-checked="true"] .papa-lang-check {
  opacity: 1;
  transform: scale(1);
  background: rgba(255,255,255,.12);
}

.papa-lang-option[aria-checked="true"] .papa-lang-check svg {
  opacity: 1;
  transform: scale(1);
}

.papa-lang-trigger:focus-visible {
  outline: 2px solid rgba(255,255,255,.80);
  outline-offset: 3px;
}

@keyframes papaLangFlagChange {
  0% { transform: scale(1) rotate(0); }
  35% { transform: scale(.82) rotate(-5deg); opacity: .65; }
  72% { transform: scale(1.11) rotate(3deg); opacity: 1; }
  100% { transform: scale(1) rotate(0); }
}

@media (max-width: 640px) {
  #papa-language-switcher {
    right: max(12px, env(safe-area-inset-right));
    bottom: max(12px, env(safe-area-inset-bottom));
  }

  .papa-lang-trigger {
    min-width: 102px;
    height: 52px;
    border-radius: 17px;
  }

  .papa-lang-panel {
    width: min(290px, calc(100vw - 24px));
  }
}

@media (prefers-reduced-motion: reduce) {
  #papa-language-switcher *,
  #papa-language-switcher *::before,
  #papa-language-switcher *::after {
    animation: none !important;
    transition-duration: .01ms !important;
  }
}
