/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   LANGUAGE SWITCHER MODAL - Smooth Animations & Style Isolation
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   TEMPORARY HIDE - Production ccTLD rollout (2025-11-24)
   Remove this block when translations are fully published
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.minoar-lang-btn,
.minoar-lang-switcher-standalone,
.minoar-lang-sheet {
  display: none !important;
  visibility: hidden !important;
}
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

:root {
  --ls-font: 12px;
  --ls-pad: 16px;
  --ls-border: #e5e5e5;
  --ls-duration: 300ms;  /* Animation duration */
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   TRIGGER BUTTON (isolated from theme styles)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.minoar-lang-btn {
  /* Reset all theme styles */
  all: revert;

  /* Apply our specific styles */
  font-family: inherit;
  font-size: var(--ls-font);
  background: transparent;
  border: 0;
  padding: .5rem .75rem;
  cursor: pointer;
  color: inherit;
  text-decoration: none;
  line-height: 1;
  display: inline-block;
}

/* Arrow indicator for menu context */
.minoar-lang-btn--menu::after {
  content: ' →';
  margin-left: 0.25rem;
  font-size: 0.9em;
  opacity: 0.7;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   MODAL BACKDROP (with smooth fade-in)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.minoar-lang-sheet {
  position: fixed;
  inset: 0;
  z-index: 999999;

  /* Start transparent, fade to dark */
  background: rgba(0, 0, 0, 0);
  transition: background var(--ls-duration) ease-out;

  /* Block pointer events when closed */
  pointer-events: none;
}

/* Backdrop fade-in when open */
.minoar-lang-sheet[aria-hidden="false"] {
  background: rgba(0, 0, 0, 0.3);
  pointer-events: auto;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   MODAL PANEL (with smooth slide-in from right)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.minoar-lang-sheet__panel {
  /* Reset all theme styles */
  all: revert;

  /* Position */
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(420px, 92vw);

  /* Appearance */
  background: #fff;
  border-left: 1px solid var(--ls-border);
  padding: var(--ls-pad);
  font-size: var(--ls-font);
  line-height: 1.6667;
  overflow-y: auto;
  overflow-x: hidden;
  color: #000;

  /* Smooth slide-in animation */
  transform: translateX(100%);  /* Start hidden off-screen */
  will-change: transform;        /* GPU acceleration hint */
  transition: transform var(--ls-duration) ease-out;

  /* Isolation from parent styles */
  contain: layout style paint;
}

/* Panel slides in when open */
.minoar-lang-sheet[aria-hidden="false"] .minoar-lang-sheet__panel {
  transform: translateX(0);  /* Slide to visible position */
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   MODAL CONTENT (isolated from theme)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Shipping notice (at top of modal) */
.minoar-lang-sheet__panel .ls-shipping-notice {
  all: revert;
  margin: 3em 0 2em 0;  /* 3em top, 2em bottom spacing */
  padding: 0;
}

.minoar-lang-sheet__panel .ls-shipping-text {
  all: revert;
  margin: 0;
  padding: 0;
  font-size: var(--ls-font);
  line-height: 1.6;
  color: #333;
}

.minoar-lang-sheet__panel .ls-shipping-text strong {
  all: revert;
  font-weight: 600;
  color: #000;
}

.minoar-lang-sheet__panel .ls-heading {
  all: revert;
  margin: 0 0 .5rem 0;
  font-weight: 600;
  font-size: var(--ls-font);
  line-height: 1.5;
  color: #000;
}

.minoar-lang-sheet__panel .ls-sub {
  all: revert;
  margin: .25rem 0 1rem 0;
  font-size: var(--ls-font);
  line-height: 1.5;
  color: #666;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   LANGUAGE LIST (isolated from theme)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.minoar-lang-sheet__panel .lang-switch {
  all: revert;
  max-height: calc(100vh - 200px);
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 8px;
}

.minoar-lang-sheet__panel .lang-switch ul {
  all: revert;
  list-style: none;
  margin: 0;
  padding: 0;
}

.minoar-lang-sheet__panel .lang-switch li {
  all: revert;
  margin: 0;
  padding: 0;
  list-style: none;
}

.minoar-lang-sheet__panel .lang-switch a {
  all: revert;
  display: block;
  margin: 0.5em 0;
  padding: 12px 16px;
  background: #f6f6f6;
  border: 1px solid #e0e0e0;
  text-decoration: none;
  color: #000;
  font-size: var(--ls-font);
  line-height: 1.5;
  cursor: pointer;
  transition: all 150ms ease-out;
}

.minoar-lang-sheet__panel .lang-switch a:hover {
  background: #e8e8e8;
  border-color: #c3c3c3;
}

.minoar-lang-sheet__panel .lang-switch a[aria-current="true"] {
  background: #000;
  color: #fff;
  border-color: #000;
  font-weight: 600;
  cursor: default;
  pointer-events: none;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   CURRENCY SECTION (isolated from theme)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.minoar-lang-sheet__panel .ls-currency {
  all: revert;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--ls-border);
}

.minoar-lang-sheet__panel .yay-currency-custom-select-wrapper {
  width: 98% !important;
  font-size: 13px;
}

.minoar-lang-sheet__panel .ls-currency .ls-heading {
  margin-bottom: .25rem;
}

.minoar-lang-sheet__panel .ls-currency-widget {
  all: revert;
  font-size: var(--ls-font);
}

/* Override YayCurrency default center alignment */
.minoar-lang-sheet__panel .yay-currency-single-page-switcher {
  justify-content: flex-start !important;
}

/* Minimal YayCurrency styling - visual only, don't break functionality */
.minoar-lang-sheet__panel .yay-currency-custom-select__trigger {
  background: #f6f6f6 !important;
  border: 1px solid #e0e0e0 !important;
  height: 45px !important;
}

.minoar-lang-sheet__panel .yay-currency-custom-select__trigger:hover {
  background: #e8e8e8 !important;
  border-color: #c3c3c3 !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   CLOSE BUTTONS (isolated from theme)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Close X button (desktop only, top-right corner) */
.minoar-lang-sheet__panel .minoar-lang-close-x {
  all: revert;
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 40px;
  height: 40px;
  padding: 12px;
  background: transparent;
  border: 0;
  cursor: pointer;
  color: #666;
  transition: color 150ms ease-out;
  display: none;  /* Hidden by default (mobile) */
}

.minoar-lang-sheet__panel .minoar-lang-close-x:hover {
  color: #000;
}

.minoar-lang-sheet__panel .minoar-lang-close-x:focus {
  outline: 2px solid #000;
  outline-offset: 2px;
}

.minoar-lang-sheet__panel .minoar-lang-close-x svg {
  width: 16px;
  height: 16px;
  display: block;
  pointer-events: none;
}

/* Show close X only on desktop (≥992px) */
@media (min-width: 992px) {
  .minoar-lang-sheet__panel .minoar-lang-close-x {
    display: block;
  }
}

/* Close button (bottom text button, all devices) */
.minoar-lang-sheet__panel .minoar-lang-close {
  all: revert;
  margin-top: 1.5rem;
  padding: .5rem 1rem;
  background: #f5f5f5;
  border: 1px solid var(--ls-border);
  border-radius: 4px;
  cursor: pointer;
  font-size: var(--ls-font);
  color: #000;
  width: 100%;
  text-align: center;
  transition: background 150ms ease-out;
}

.minoar-lang-sheet__panel .minoar-lang-close:hover {
  background: #e5e5e5;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   ACCESSIBILITY: Reduced Motion Support
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (prefers-reduced-motion: reduce) {
  .minoar-lang-sheet,
  .minoar-lang-sheet__panel,
  .minoar-lang-sheet__panel .lang-switch a,
  .minoar-lang-sheet__panel .minoar-lang-close {
    transition: none;
  }

  .minoar-lang-sheet__panel {
    transform: translateX(0);  /* Appear instantly */
  }

  .minoar-lang-sheet[aria-hidden="true"] .minoar-lang-sheet__panel {
    transform: translateX(100%);
  }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   DESKTOP/MOBILE SPLIT: Standalone vs Menu Positioning (2025-11-18)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Desktop (≥992px): Position standalone lang-switcher to LEFT inside secondary-navigation */
@media (min-width: 992px) {
  /* Make secondary-navigation a flex container */
  .secondary-navigation {
    display: flex !important;
    align-items: center;
    flex-direction: row;
  }
  
  /* Standalone button (sibling of menu-container) - position first */
  .secondary-navigation .minoar-lang-switcher-standalone {
    order: -1;
    margin-right: 1rem;
  }
  
  /* Ensure menu container stays on the right */
  .secondary-navigation .menu-secondary-menu-container {
    order: 1;
  }
}

/* Mobile (<992px): Hide standalone, keep original menu structure */
@media (max-width: 991px) {
  .secondary-navigation .minoar-lang-switcher-standalone {
    display: none !important;
  }
}