/* TWO – Style Polish v4 */

/* ====== BACKGROUND IMAGE (full-bleed, fixed) ====== */
html, body { height: 100%; }
body.two-style-polish-v4-active {
  background: url('https://trainwithokey.com/wp-content/uploads/2025/08/IMG_3043.png') center 20% / cover no-repeat fixed;
}

/* Dark gradient overlay to improve readability */
body.two-style-polish-v4-active::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  /* left focus lighter so hero headline remains readable */
  background:
    linear-gradient(90deg, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0.40) 35%, rgba(0,0,0,0.55) 70%, rgba(0,0,0,0.70) 100%),
    radial-gradient(100% 120% at 25% 25%, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.45) 60%, rgba(0,0,0,0.65) 100%);
  pointer-events: none;
}

/* Ensure site content appears above overlay */
.wp-site-blocks, #page, .site { position: relative; z-index: 1; }

/* ====== TYPOGRAPHY/CONTRAST ====== */
.two-style-polish-v4-active h1, 
.two-style-polish-v4-active h2, 
.two-style-polish-v4-active h3 {
  color: #fff !important;
  text-shadow: 0 2px 6px rgba(0,0,0,.6);
}
.two-style-polish-v4-active p, 
.two-style-polish-v4-active li, 
.two-style-polish-v4-active .has-text-color { 
  color: #e9edf1 !important; 
  text-shadow: 0 1px 3px rgba(0,0,0,.55);
}
/* Cards stay readable */
.two-style-polish-v4-active .wp-block-group, 
.two-style-polish-v4-active .wp-block-columns, 
.two-style-polish-v4-active .wp-block-column {
  background: transparent !important;
}
.two-style-polish-v4-active .cardish, 
.two-style-polish-v4-active .wp-block-group.is-style-card, 
.two-style-polish-v4-active .wp-block-group.has-background { 
  background: rgba(22,22,25,0.35) !important;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  backdrop-filter: blur(2px) saturate(110%);
}

/* Buttons pop */
.two-style-polish-v4-active .wp-element-button, 
.two-style-polish-v4-active .wp-block-button__link {
  box-shadow: 0 8px 24px rgba(255,60,0,.28);
  border-radius: 12px;
}

/* ====== HEADER/MENU ====== */
.two-style-polish-v4-active .wp-block-navigation__container a {
  padding: 10px 14px;
  font-weight: 600;
  letter-spacing: .2px;
}
/* Subtle translucent bar behind the header for readability */
.two-style-polish-v4-active header, 
.two-style-polish-v4-active .wp-block-group.alignfull:first-child { 
  background: rgba(0,0,0,0.45);
  backdrop-filter: blur(4px);
}

/* ====== HIDE DUPLICATE HERO IMAGE on Home ====== */
/* Many setups use columns: left text, right image. Hide 1st columns block's last column image */
.home.two-style-polish-v4-active .wp-block-columns:first-of-type .wp-block-column:last-child .wp-block-image {
  display: none !important;
}
/* Fallback: hide the first large image near the top */
.home.two-style-polish-v4-active .wp-site-blocks > .wp-block-image:first-of-type {
  display: none !important;
}

/* ====== LANGUAGE SWITCH (flags only) ====== */
/* Try common Polylang classes and navigation item classes */
.two-style-polish-v4-active .lang-item a span,
.two-style-polish-v4-active .menu-item-language-switcher a span {
  display:none !important;
}
/* Add emoji flags before links that contain EN or DE */
.two-style-polish-v4-active .lang-item a[href*="/en/"]::before,
.two-style-polish-v4-active a[href$="/en/"]::before {
  content: "🇬🇧";
  margin-right: 6px;
  font-size: 1rem;
}
.two-style-polish-v4-active .lang-item a[href*="/de/"]::before,
.two-style-polish-v4-active a[href$="/de/"]::before {
  content: "🇩🇪";
  margin-right: 6px;
  font-size: 1rem;
}

/* ====== RESPONSIVE TUNING ====== */
@media (max-width: 782px) {
  body.two-style-polish-v4-active {
    background-position: center 10%;
  }
  .two-style-polish-v4-active .wp-block-navigation__container a {
    padding: 8px 10px;
  }
}