/* UWEA News Enhance — subtle polish on the theme's STANDARD news cards + filter bar.
   (1rem = 10px theme base.) Scoped to .page-body--news-enhanced so nothing leaks. */

/* ============ Header — /events/ style: H1 left, description right (PC) ====== */
.page-body--news-enhanced .page-header .row { align-items: center; }
.page-body--news-enhanced .page-header .uw-h1.p-b-6 { padding-bottom: 0 !important; }
.page-body--news-enhanced .page-header .col-md-6.editable p {
  font-size: 2.1rem;
  line-height: 1.5;
  color: #5b6470;
  margin: 0;
}
/* Description is a PC-only subtitle — hide it on mobile (no value there). */
@media (max-width: 768px) {
  .page-body--news-enhanced .page-header .col-md-6.editable { display: none; }
  /* Tighten vertical rhythm around the title on mobile (header is only ~90px of
     visible content but theme reserves 160px; trim the empty space above + below). */
  .page-body--news-enhanced.page-body--archive { padding-top: 12rem; }
  .page-body--news-enhanced .page-header { padding-bottom: 2.4rem !important; }
  /* Tighter inner card padding on mobile (scoped to our pages only). */
  .page-body--news-enhanced .card__content { padding: 0 2.5rem 1.5rem 1.5rem; }
}

/* ============ Filter bar — single row, e-commerce style ====================
   One line: result count (left) · search (focal, grows) · sort + year selects
   (right). No heavy box — just a thin divider underneath. */
.page-body--news-enhanced .news-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.2rem 1.6rem;
  margin: 0 0 2.8rem;
}
.page-body--news-enhanced .news-filter__input,
.page-body--news-enhanced .news-filter__select {
  height: 4.8rem;
  border: 1px solid #d9d9d9;
  border-radius: 5rem;
  background-color: #fff;
  font-family: inherit;
  font-size: 1.6rem;
  color: #323232;
  box-sizing: border-box;
}

/* Result count — quiet, left */
.page-body--news-enhanced .news-filter__summary {
  flex: 0 0 auto;
  font-size: 1.4rem;
  color: #8a929c;
  margin: 0;
  white-space: nowrap;
}
.page-body--news-enhanced .news-filter__summary b { color: #323232; }
.page-body--news-enhanced .news-filter__summary a,
.page-body--news-enhanced .news-filter__empty a { color: #0070B9; }

/* Search — focal, fills the row; magnifier sits inside (no separate circle) */
.page-body--news-enhanced .news-filter__search {
  position: relative;
  flex: 1 1 24rem;
}
.page-body--news-enhanced .news-filter__input {
  width: 100%;
  padding: 0 1.8rem 0 4.8rem;
  outline: none;
  transition: border-color .2s ease;
}
.page-body--news-enhanced .news-filter__input:focus { border-color: #0070B9; }
.page-body--news-enhanced .news-filter__input::placeholder { color: #9aa1a9; }
.page-body--news-enhanced .news-filter__go {
  position: absolute;
  left: .6rem;
  top: 50%;
  transform: translateY(-50%);
  width: 3.6rem;
  height: 3.6rem;
  border: none;
  background: transparent;
  color: #0070B9;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 50%;
  transition: color .2s ease;
}
.page-body--news-enhanced .news-filter__go:hover { color: #019AD9; }
.page-body--news-enhanced .news-filter__go:focus-visible { outline: 2px solid #0070B9; outline-offset: 2px; }

/* Sort + Year — matching dropdowns (e-commerce style) */
.page-body--news-enhanced .news-filter__select {
  flex: 0 0 auto;
  padding: 0 4rem 0 1.8rem;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%230070B9' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1.6rem center;
  outline: none;
  transition: border-color .2s ease;
}
.page-body--news-enhanced .news-filter__select:hover { border-color: #b9c0c8; }
.page-body--news-enhanced .news-filter__select:focus { border-color: #0070B9; }

/* Empty state */
.page-body--news-enhanced .news-filter__empty {
  grid-column: 1 / -1;
  font-size: 1.8rem;
  color: #6b7280;
  padding: 2rem 0;
}

/* Mobile: clean stack — search (full) on top, the two selects 50/50 below,
   the count as its own quiet line last. */
@media (max-width: 768px) {
  .page-body--news-enhanced .news-filter { gap: 1rem; }
  .page-body--news-enhanced .news-filter__summary { order: 0; flex: 1 1 100%; }
  .page-body--news-enhanced .news-filter__search { order: 1; flex: 1 1 100%; }
  .page-body--news-enhanced .news-filter__select { order: 2; flex: 1 1 0; min-width: 0; }
}

/* ============ Breathing room ============ */
.page-body--news-enhanced .news-grid--enhanced { gap: 2.4rem; }

/* Card keeps native look (#F6F6F6, smaller radius, no border); clips the zoom. */
.page-body--news-enhanced .news-card {
  border-radius: 1.6rem;
  overflow: hidden;
}

/* ============ Image — fixed, uniform size; zoom stays inside a mask ========
   The zoom is applied to a ::before pseudo INSIDE a fixed, overflow:hidden box,
   so scaling is clipped exactly to the image bounds — nothing creeps onto the
   text below on hover. */
.page-body--news-enhanced .card__image {
  visibility: visible;            /* theme defaults the image to hidden */
  height: auto;
  aspect-ratio: 16 / 9;
  position: relative;
  overflow: hidden;               /* the mask */
  background-size: cover;
  background-position: center;
}
.page-body--news-enhanced .card__image::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: inherit;      /* reuse the card's inline image */
  background-size: cover;
  background-position: center;
  transform-origin: center;
  transition: transform .55s cubic-bezier(.22, .61, .25, 1);
}
.page-body--news-enhanced .card__image--hover { display: none; }
.page-body--news-enhanced .news-card:hover .card__image::before { transform: scale(1.06); }

/* Content sits cleanly below the masked image. */
.page-body--news-enhanced .card__content {
  position: relative;
  z-index: 1;
  background: #F6F6F6;
}
.page-body--news-enhanced .news-card .btn { z-index: 2; }

/* Arrow button: gentle enlarge on hover */
.page-body--news-enhanced .news-card .btn {
  transition: transform .3s cubic-bezier(.22, .61, .25, 1), filter .3s ease;
}
.page-body--news-enhanced .news-card:hover .btn { transform: scale(1.1); }

/* ============ Date — same font as /events/ (PFHandbookPro 16px #323232) ===== */
.page-body--news-enhanced .card__date {
  font-family: 'PFHandbookPro', sans-serif;
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
  color: #323232;
  margin-bottom: 1rem;
}

/* ============ Title — tighter line-height ============ */
.page-body--news-enhanced .news-card .uw-h3 { line-height: 1.2; }

/* ============ Excerpt — muted & secondary, so the title leads ============ */
.page-body--news-enhanced .news-card .uw-text {
  font-size: 1.7rem;
  line-height: 1.55;
  color: #6b7280;
  margin-top: 1rem;
}

/* Keyboard focus (a11y) */
.page-body--news-enhanced .news-card:focus-visible {
  outline: 3px solid #019AD9;
  outline-offset: 3px;
}

/* ============ Reduced motion ============ */
@media (prefers-reduced-motion: reduce) {
  .page-body--news-enhanced .card__image::before,
  .page-body--news-enhanced .news-card .btn { transition: none !important; }
  .page-body--news-enhanced .news-card:hover .card__image::before { transform: none; }
  .page-body--news-enhanced .news-card:hover .btn { transform: none; }
}

/* ============ Single post — readability polish ============ */
/* Title: smaller than the theme's 89px (that's for one-word archive headings;
   an article sentence needs a calmer size). */
.page-body--single-enhanced .uw-h1 { font-size: 6.2rem; line-height: 1.12; }

/* Featured image: show the WHOLE image (theme uses object-fit:cover in a fixed
   600px box, which crops banners that contain text). Let it keep its ratio. */
.page-body--single-enhanced .article-image { height: auto !important; border-radius: 1.2rem; }
.page-body--single-enhanced .article-image img {
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  border-radius: 1.2rem;            /* smaller corners — was 45px, clipped text in corners */
}

/* Left-align body text (theme justifies it -> uneven spacing/rivers at 24px). */
.page-body--single-enhanced .editable,
.page-body--single-enhanced .editable p,
.page-body--single-enhanced .editable li,
.page-body--single-enhanced .editable blockquote { text-align: left; }
/* Quote: keep it left even when WP added .has-text-align-justify (the justify in a
   narrow quote box was the bug — uneven gaps); calmer radius too. */
.page-body--single-enhanced .editable .has-text-align-justify { text-align: left !important; }
/* Blockquote (kept as a box, but fixed for LONG quotes): no italic, smaller quote
   icon + padding, hide the stray 💬 emoji that authors paste at the start. */
.page-body--single-enhanced .editable blockquote {
  border-radius: 1.6rem;
  padding: 5.4rem 3rem 3rem;
}
.page-body--single-enhanced .editable blockquote::before {
  width: 3.4rem !important;
  height: 2.6rem !important;
  top: 2.6rem !important;
  left: 3rem !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
}
.page-body--single-enhanced .editable blockquote em { font-style: normal; }
.page-body--single-enhanced .editable blockquote img.emoji { display: none !important; }
.page-body--single-enhanced .editable p,
.page-body--single-enhanced .editable li { line-height: 1.6; }

/* Header meta: publish date + "News" pill on one aligned row */
.page-body--single-enhanced .uwea-single-meta {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  flex-wrap: wrap;
}
.page-body--single-enhanced .uwea-single-date {
  font-family: 'PFHandbookPro', sans-serif;
  font-size: 1.8rem;
  color: #8a929c;
}
/* The "Новини" pill keeps the theme's OWN native dot (.submit-wrapper::after);
   submit-wrapper is its own element again so that dot positions correctly. */

/* Header row: date + "Новини" tag on the LEFT, share on the RIGHT */
.page-body--single-enhanced .uwea-single-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.6rem 2.4rem;
  flex-wrap: wrap;
}

/* Share buttons (Facebook · X · LinkedIn · Telegram) + mobile native trigger */
.page-body--single-enhanced .uwea-share {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin: 0;
}
.page-body--single-enhanced .uwea-share__label {
  font-size: 1.5rem;
  color: #8a929c;
  margin-right: .4rem;
}
.page-body--single-enhanced .uwea-share__btn,
.page-body--single-enhanced .uwea-share__native {
  width: 4.8rem;
  height: 4.8rem;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #F6F6F6;                /* filled style (reverted from outlined) */
  color: #323232;
  border: 1px solid #e6e9ee;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
/* Copy-link success flash */
.page-body--single-enhanced .uwea-share__copy.is-copied {
  background: #0070B9;
  border-color: #0070B9;
  color: #fff;
}
/* Bigger glyphs inside the circles (CSS wins over the inline SVG width/height) */
.page-body--single-enhanced .uwea-share__btn svg,
.page-body--single-enhanced .uwea-share__native svg {
  width: 2.4rem;
  height: 2.4rem;
}
.page-body--single-enhanced .uwea-share__btn:hover,
.page-body--single-enhanced .uwea-share__native:hover {
  background: #0070B9;
  color: #fff;
  border-color: #0070B9;
}
.page-body--single-enhanced .uwea-share__btn:focus-visible,
.page-body--single-enhanced .uwea-share__native:focus-visible {
  outline: 3px solid #019AD9;
  outline-offset: 2px;
}
/* The single native-share button is mobile-only */
.page-body--single-enhanced .uwea-share__native { display: none; }

/* Bottom share — "Поділитися:" on its own line on top, icons in a row below */
.page-body--single-enhanced .uwea-share--bottom {
  margin-top: 3.2rem;
  flex-wrap: wrap;
}
.page-body--single-enhanced .uwea-share--bottom .uwea-share__label {
  flex: 1 1 100%;
  margin: 0 0 .4rem;
}

/* Copy-link toast popup (shows the copied URL so the user sees it worked) */
.uwea-copy-toast {
  position: fixed;
  left: 50%;
  bottom: 3rem;
  transform: translateX(-50%) translateY(1rem);
  z-index: 9999;
  display: flex;
  align-items: center;
  gap: 1rem;
  max-width: calc(100vw - 4rem);
  padding: 1.4rem 2rem;
  border-radius: 1.2rem;
  background: #1f2430;
  color: #fff;
  font-family: inherit;
  font-size: 1.5rem;
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, .25);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease, transform .25s ease;
}
.uwea-copy-toast.is-visible { opacity: 1; transform: translateX(-50%) translateY(0); }
.uwea-copy-toast svg { width: 2rem; height: 2rem; flex-shrink: 0; color: #019AD9; }
.uwea-copy-toast__text { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.uwea-copy-toast__title { font-weight: 700; }
.uwea-copy-toast__url {
  font-size: 1.3rem;
  color: #A6ADB5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 36rem;
}
@media (prefers-reduced-motion: reduce) {
  .uwea-copy-toast { transition: none; }
}

/* Single — mobile: tighter spacing, calmer title, ONE native share icon */
@media (max-width: 768px) {
  .page-body--single-enhanced.page-body--news-single { padding-top: 12rem; }
  .page-body--single-enhanced .page-header { padding-bottom: 2rem !important; }
  .page-body--single-enhanced .uw-h1 { font-size: 3.2rem; line-height: 1.18; }
  .page-body--single-enhanced .uwea-single-date { font-size: 1.6rem; }
  /* smaller gap under the featured image (theme m-b-6 = 6rem is too much) */
  .page-body--single-enhanced .article-image.m-b-6 { margin-bottom: 2.4rem !important; }
  /* swap the 4 icons + label for a single native-share button */
  .page-body--single-enhanced .uwea-share__btn,
  .page-body--single-enhanced .uwea-share__label { display: none; }
  .page-body--single-enhanced .uwea-share__native { display: inline-flex; }
  /* if native share is unsupported, JS reveals the icon set */
  .page-body--single-enhanced .uwea-share.is-open .uwea-share__btn { display: inline-flex; }
  .page-body--single-enhanced .uwea-share.is-open .uwea-share__native { display: none; }
  /* BOTTOM share keeps the full icon set on mobile too (like desktop) */
  .page-body--single-enhanced .uwea-share--bottom .uwea-share__btn { display: inline-flex; }
  .page-body--single-enhanced .uwea-share--bottom .uwea-share__label { display: inline; }
  .page-body--single-enhanced .uwea-share--bottom .uwea-share__native { display: none; }
}

/* ============ Footer social icons — match the article share buttons ========
   (Loaded site-wide so the footer is consistent everywhere. Scoped to .footer.) */
.footer__social-links {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.footer__social-links a {
  width: 4.4rem;
  height: 4.4rem;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #F6F6F6;                /* filled style (reverted from outlined) */
  border: 1px solid #e6e9ee;
  color: #323232;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.footer__social-links a:hover {
  background: #0070B9;
  border-color: #0070B9;
  color: #fff;
}
.footer__social-links a svg {
  width: 2rem;
  height: 2rem;
  fill: currentColor;
}
.footer__social-links a svg path { fill: currentColor; }

/* Footer social icons: the theme hides their column (.hide-lt-lg) on mobile.
   Bring them back below lg so the icons appear (already restyled above). */
@media (max-width: 991px) {
  /* expose the desktop column only to reveal its social icons... */
  .footer .hide-lt-lg:has(.footer__social-links) { display: block !important; }
  /* ...but hide its contact items — those already show in the mobile block above
     (otherwise the address/phone/email get duplicated). */
  .footer .hide-lt-lg:has(.footer__social-links) > ul > li:not(.footer__social-links) { display: none !important; }
  .footer__social-links { justify-content: flex-start; margin-top: 1.2rem; }
}

/* Footer social icons: use OUR share glyphs (sync with the article share icons).
   Replace the theme's glyphs via CSS mask so they match exactly, site-wide. */
.footer__social-links a svg { display: none; }
.footer__social-links a::before {
  content: '';
  width: 2rem;
  height: 2rem;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-size: contain; mask-size: contain;
}
.footer__social-links a[aria-label="Facebook"]::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M9.101%2023.691v-7.98H6.627v-3.667h2.474v-1.58c0-4.085%201.848-5.978%205.858-5.978.401%200%20.955.042%201.468.103a8.68%208.68%200%200%201%201.141.195v3.325a8.623%208.623%200%200%200-.653-.036%2026.805%2026.805%200%200%200-.733-.009c-.707%200-1.259.096-1.675.309a1.686%201.686%200%200%200-.679.622c-.258.42-.374.995-.374%201.752v1.297h3.919l-.386%202.103-.287%201.564h-3.246v8.245C19.396%2023.238%2024%2018.179%2024%2012.044c0-6.627-5.373-12-12-12s-12%205.373-12%2012c0%205.628%203.874%2010.35%209.101%2011.647Z%27%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M9.101%2023.691v-7.98H6.627v-3.667h2.474v-1.58c0-4.085%201.848-5.978%205.858-5.978.401%200%20.955.042%201.468.103a8.68%208.68%200%200%201%201.141.195v3.325a8.623%208.623%200%200%200-.653-.036%2026.805%2026.805%200%200%200-.733-.009c-.707%200-1.259.096-1.675.309a1.686%201.686%200%200%200-.679.622c-.258.42-.374.995-.374%201.752v1.297h3.919l-.386%202.103-.287%201.564h-3.246v8.245C19.396%2023.238%2024%2018.179%2024%2012.044c0-6.627-5.373-12-12-12s-12%205.373-12%2012c0%205.628%203.874%2010.35%209.101%2011.647Z%27%2F%3E%3C%2Fsvg%3E"); }
.footer__social-links a[aria-label="Linkedin"]::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M20.447%2020.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853%200-2.136%201.445-2.136%202.939v5.667H9.351V9h3.414v1.561h.046c.477-.9%201.637-1.85%203.37-1.85%203.601%200%204.267%202.37%204.267%205.455v6.286zM5.337%207.433a2.062%202.062%200%200%201-2.063-2.065%202.064%202.064%200%201%201%202.063%202.065zm1.782%2013.019H3.555V9h3.564v11.452zM22.225%200H1.771C.792%200%200%20.774%200%201.729v20.542C0%2023.227.792%2024%201.771%2024h20.451C23.2%2024%2024%2023.227%2024%2022.271V1.729C24%20.774%2023.2%200%2022.222%200h.003z%27%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M20.447%2020.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853%200-2.136%201.445-2.136%202.939v5.667H9.351V9h3.414v1.561h.046c.477-.9%201.637-1.85%203.37-1.85%203.601%200%204.267%202.37%204.267%205.455v6.286zM5.337%207.433a2.062%202.062%200%200%201-2.063-2.065%202.064%202.064%200%201%201%202.063%202.065zm1.782%2013.019H3.555V9h3.564v11.452zM22.225%200H1.771C.792%200%200%20.774%200%201.729v20.542C0%2023.227.792%2024%201.771%2024h20.451C23.2%2024%2024%2023.227%2024%2022.271V1.729C24%20.774%2023.2%200%2022.222%200h.003z%27%2F%3E%3C%2Fsvg%3E"); }
.footer__social-links a[aria-label="Youtube"]::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M23.498%206.186a3.016%203.016%200%200%200-2.122-2.136C19.505%203.545%2012%203.545%2012%203.545s-7.505%200-9.377.505A3.017%203.017%200%200%200%20.502%206.186C0%208.07%200%2012%200%2012s0%203.93.502%205.814a3.016%203.016%200%200%200%202.122%202.136c1.871.505%209.376.505%209.376.505s7.505%200%209.377-.505a3.015%203.015%200%200%200%202.122-2.136C24%2015.93%2024%2012%2024%2012s0-3.93-.502-5.814zM9.545%2015.568V8.432L15.818%2012l-6.273%203.568z%27%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M23.498%206.186a3.016%203.016%200%200%200-2.122-2.136C19.505%203.545%2012%203.545%2012%203.545s-7.505%200-9.377.505A3.017%203.017%200%200%200%20.502%206.186C0%208.07%200%2012%200%2012s0%203.93.502%205.814a3.016%203.016%200%200%200%202.122%202.136c1.871.505%209.376.505%209.376.505s7.505%200%209.377-.505a3.015%203.015%200%200%200%202.122-2.136C24%2015.93%2024%2012%2024%2012s0-3.93-.502-5.814zM9.545%2015.568V8.432L15.818%2012l-6.273%203.568z%27%2F%3E%3C%2Fsvg%3E"); }