/* ==========================================================
   Event Country Header Logo + Bigger Download Badges Fix
   Header-only CSS. Images are controlled with CSS only.
   ========================================================== */

:root{
  --ecx-h-orange:#ff6a00;
  --ecx-h-orange-2:#ff8a1f;
  --ecx-h-orange-soft:#fff4ea;
  --ecx-h-ink:#101828;
  --ecx-h-muted:#667085;
  --ecx-h-line:#e6eaf0;
  --ecx-h-radius:6px;
  --ecx-h-shadow:0 18px 45px rgba(16,24,40,.10);
}

.ecx-system-header{
  position:sticky !important;
  top:0 !important;
  z-index:99999 !important;
  background:rgba(255,255,255,.97) !important;
  backdrop-filter:blur(18px) !important;
  -webkit-backdrop-filter:blur(18px) !important;
  border-bottom:1px solid rgba(230,234,240,.94) !important;
}

.ecx-system-header.ecx-header-scrolled{
  box-shadow:0 10px 30px rgba(16,24,40,.075) !important;
}

.ecx-system-header-inner{
  width:min(1320px,calc(100% - 34px)) !important;
  min-height:72px !important;
  margin:0 auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;
}

.ecx-system-brand{
  min-width:max-content !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  color:var(--ecx-h-ink) !important;
  text-decoration:none !important;
  font-weight:950 !important;
  letter-spacing:-.035em !important;
}

.ecx-system-brand-logo{
  width:42px !important;
  height:42px !important;
  display:block !important;
  object-fit:contain !important;
  border-radius:var(--ecx-h-radius) !important;
  background:#fff !important;
  box-shadow:0 10px 22px rgba(16,24,40,.08) !important;
}

.ecx-system-brand-text{
  font-size:1rem !important;
  line-height:1 !important;
}

.ecx-system-nav{
  flex:1 1 auto !important;
  min-width:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:2px !important;
}

.ecx-system-nav > a,
.ecx-system-dropbtn{
  height:34px !important;
  min-height:34px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  padding:0 7px !important;
  border:0 !important;
  border-radius:var(--ecx-h-radius) !important;
  background:transparent !important;
  color:#334155 !important;
  font-family:inherit !important;
  font-size:.78rem !important;
  line-height:1 !important;
  font-weight:850 !important;
  letter-spacing:-.01em !important;
  text-decoration:none !important;
  cursor:pointer !important;
  white-space:nowrap !important;
}

.ecx-system-nav > a:hover,
.ecx-system-dropdown:hover .ecx-system-dropbtn,
.ecx-system-dropdown.is-open .ecx-system-dropbtn,
.ecx-system-dropbtn:hover{
  background:var(--ecx-h-orange-soft) !important;
  color:#c75200 !important;
}

.ecx-system-dropdown{
  position:relative !important;
  display:inline-flex !important;
  align-items:center !important;
}

.ecx-system-dropdown-menu{
  position:absolute !important;
  top:calc(100% + 10px) !important;
  left:50% !important;
  transform:translateX(-50%) translateY(8px) !important;
  min-width:218px !important;
  padding:8px !important;
  display:grid !important;
  gap:2px !important;
  background:#fff !important;
  border:1px solid var(--ecx-h-line) !important;
  border-radius:var(--ecx-h-radius) !important;
  box-shadow:var(--ecx-h-shadow) !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transition:opacity .16s ease, transform .16s ease, visibility .16s ease !important;
}

.ecx-system-dropdown-menu::before{
  content:"" !important;
  position:absolute !important;
  top:-12px !important;
  left:0 !important;
  right:0 !important;
  height:12px !important;
}

.ecx-system-dropdown:hover .ecx-system-dropdown-menu,
.ecx-system-dropdown.is-open .ecx-system-dropdown-menu{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transform:translateX(-50%) translateY(0) !important;
}

.ecx-system-dropdown-menu a{
  min-height:36px !important;
  display:flex !important;
  align-items:center !important;
  padding:0 10px !important;
  border-radius:var(--ecx-h-radius) !important;
  color:#344054 !important;
  text-decoration:none !important;
  font-size:.82rem !important;
  font-weight:800 !important;
  white-space:nowrap !important;
}

.ecx-system-dropdown-menu a:hover{
  background:var(--ecx-h-orange-soft) !important;
  color:#c75200 !important;
}

/* RIGHT SIDE: social icons are intentionally smaller than app download badges */
.ecx-system-actions{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:10px !important;
  min-width:max-content !important;
}

.ecx-system-socials{
  display:flex !important;
  align-items:center !important;
  gap:5px !important;
  order:1 !important;
}

.ecx-system-store-badges{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  order:2 !important;
}

/* Small social icons */
.ecx-system-socials a,
.ecx-mobile-socials a{
  width:29px !important;
  height:29px !important;
  border-radius:var(--ecx-h-radius) !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#fff !important;
  border:1px solid var(--ecx-h-line) !important;
  text-decoration:none !important;
  overflow:hidden !important;
  box-shadow:0 7px 15px rgba(16,24,40,.045) !important;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}

.ecx-system-socials a:hover,
.ecx-mobile-socials a:hover{
  transform:translateY(-1px) !important;
  border-color:#ffd4b8 !important;
  box-shadow:0 12px 22px rgba(16,24,40,.08) !important;
}

.ecx-system-socials img,
.ecx-mobile-socials img{
  width:16px !important;
  height:16px !important;
  display:block !important;
  object-fit:contain !important;
}

/* Bigger download badges */
.ecx-system-store-badges a,
.ecx-mobile-store-badges a{
  height:42px !important;
  min-height:42px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-decoration:none !important;
  border-radius:var(--ecx-h-radius) !important;
  transition:transform .18s ease, box-shadow .18s ease !important;
}

.ecx-system-store-badges a:hover,
.ecx-mobile-store-badges a:hover{
  transform:translateY(-1px) !important;
}

.ecx-system-store-badges img,
.ecx-mobile-store-badges img{
  height:42px !important;
  width:auto !important;
  max-width:150px !important;
  display:block !important;
  object-fit:contain !important;
  border-radius:var(--ecx-h-radius) !important;
  box-shadow:0 10px 22px rgba(16,24,40,.08) !important;
}

.ecx-store-google img{
  max-width:154px !important;
}

.ecx-store-app img{
  max-width:146px !important;
}

.ecx-system-menu-btn{
  width:38px !important;
  height:38px !important;
  border-radius:var(--ecx-h-radius) !important;
  border:1px solid var(--ecx-h-line) !important;
  background:#fff !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  flex-direction:column !important;
  gap:4px !important;
  cursor:pointer !important;
  box-shadow:0 8px 18px rgba(16,24,40,.045) !important;
  order:3 !important;
}

.ecx-system-menu-btn span{
  width:17px !important;
  height:2px !important;
  border-radius:20px !important;
  background:var(--ecx-h-ink) !important;
  display:block !important;
  transition:transform .18s ease, opacity .18s ease !important;
}

body.ecx-system-menu-open .ecx-system-menu-btn span:nth-child(1){
  transform:translateY(6px) rotate(45deg) !important;
}

body.ecx-system-menu-open .ecx-system-menu-btn span:nth-child(2){
  opacity:0 !important;
}

body.ecx-system-menu-open .ecx-system-menu-btn span:nth-child(3){
  transform:translateY(-6px) rotate(-45deg) !important;
}

.ecx-system-mobile-menu{
  width:min(1120px,calc(100% - 34px)) !important;
  margin:0 auto 12px !important;
  padding:10px !important;
  display:none !important;
  background:#fff !important;
  border:1px solid var(--ecx-h-line) !important;
  border-radius:var(--ecx-h-radius) !important;
  box-shadow:var(--ecx-h-shadow) !important;
}

body.ecx-system-menu-open .ecx-system-mobile-menu,
.ecx-system-mobile-menu.is-open{
  display:grid !important;
  gap:6px !important;
}

.ecx-system-mobile-menu a,
.ecx-system-mobile-menu summary{
  min-height:40px !important;
  display:flex !important;
  align-items:center !important;
  padding:0 10px !important;
  border-radius:var(--ecx-h-radius) !important;
  color:#263242 !important;
  text-decoration:none !important;
  font-size:.88rem !important;
  font-weight:850 !important;
  cursor:pointer !important;
  list-style:none !important;
}

.ecx-system-mobile-menu summary::-webkit-details-marker{
  display:none !important;
}

.ecx-system-mobile-menu summary{
  justify-content:space-between !important;
  background:#f9fafb !important;
}

.ecx-system-mobile-menu summary::after{
  content:"▾" !important;
  font-size:.75rem !important;
}

.ecx-system-mobile-menu details{
  display:grid !important;
  gap:4px !important;
  border:1px solid #eef1f5 !important;
  border-radius:var(--ecx-h-radius) !important;
  padding:4px !important;
}

.ecx-system-mobile-menu details a{
  margin-left:8px !important;
  color:#475467 !important;
}

.ecx-mobile-socials,
.ecx-mobile-store-badges{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  padding:8px 0 0 !important;
}

@media (max-width:1320px){
  .ecx-system-header-inner{
    width:min(1240px,calc(100% - 28px)) !important;
  }

  .ecx-system-nav > a,
  .ecx-system-dropbtn{
    font-size:.74rem !important;
    padding:0 5px !important;
  }

  .ecx-system-socials a{
    width:27px !important;
    height:27px !important;
  }

  .ecx-system-socials img{
    width:15px !important;
    height:15px !important;
  }

  .ecx-system-store-badges img{
    height:38px !important;
    max-width:138px !important;
  }
}

@media (max-width:1180px){
  .ecx-system-store-badges img{
    height:35px !important;
    max-width:124px !important;
  }

  .ecx-system-socials{
    display:none !important;
  }
}

@media (max-width:1040px){
  .ecx-system-nav{
    display:none !important;
  }

  .ecx-system-menu-btn{
    display:inline-flex !important;
  }
}

@media (max-width:760px){
  .ecx-system-socials,
  .ecx-system-store-badges{
    display:none !important;
  }

  .ecx-system-header-inner{
    min-height:62px !important;
    width:calc(100% - 22px) !important;
  }

  .ecx-system-brand-logo{
    width:38px !important;
    height:38px !important;
  }

  .ecx-system-mobile-menu{
    width:calc(100% - 22px) !important;
  }
}
