/**
* Theme Name: Pressville Child
* Theme URI: http://preview.lsvr.sk/pressville
* Description: Pressville child theme — Δήμος Ιεροκηπίας redesign 2026 (per municipality email 2026-04-17; visual reference: /mockup/)
* Author: Internetivo
* Author URI: https://internetivo.com
* Template: pressville
* Version: 3.9.2
*/

:root {
    --ikp-accent: #3ca0ab;
    --ikp-accent-dark: #2b8a93;
    --ikp-accent-light: #e8f6f7;
    --ikp-accent-text: #1c757f; /* AA-compliant teal for TEXT/ICONS (5.38:1 on white); bright accent stays for bg/borders */
    --ikp-text: #2d3748;
    --ikp-text-light: #64748b; /* darkened from #718096 for WCAG AA (4.76:1) */
    --ikp-border: #e2e8f0;
    --ikp-radius: 12px;
    --ikp-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
    --ikp-shadow-md: 0 4px 6px rgba(0,0,0,0.05), 0 2px 4px rgba(0,0,0,0.03);
    --ikp-shadow-lg: 0 10px 25px rgba(0,0,0,0.08);
    --ikp-font: 'Inter', 'Noto Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --ikp-topbar-bg: #1a7d8a; /* deeper teal so white top-bar text passes WCAG AA (4.83:1); bright #3ca0ab was 3.08:1 */
    --ikp-accent-aa: #1a7d8a; /* teal dark enough to carry WHITE text at AA (4.83:1) — for badges/tags/date pills; bright #3ca0ab (3.08:1) stays for borders/fills without text */
}

/* ═══ TYPOGRAPHY — Inter (self-hosted, assets/fonts/inter), matching the mockup.
   Pressville ships Open Sans. Set on body (cascades to inheriting text) + the
   elements Pressville hard-sets a font on. Icon fonts (<i>, FontAwesome, glyph
   pseudo-elements) are deliberately NOT listed, so they keep their own family. */
body,
h1, h2, h3, h4, h5, h6, p, a, li, blockquote, label, input, select, textarea, button,
.header-menu-primary__item-link, .header-menu-secondary__item-link,
.header-titlebar__title, .header-titlebar__description, .page__title,
.ikp-card-title, .ikp-hero-content h2, .ikp-section-title {
  font-family: var(--ikp-font) !important;
}
/* Plugin/archive pages (directory, listings, etc.) — force Inter on their title
   + text classes so nothing falls back to Pressville's Open Sans (unified UX).
   Scoped to #core (page content) + text classes only, so icon fonts stay intact. */
#core .main__title, #core .main__subtitle,
#core [class*="__title"], #core [class*="__subtitle"], #core [class*="__meta"],
#core [class*="__excerpt"], #core [class*="__description"], #core [class*="__text"],
#core [class*="__name"], #core [class*="__label"], #core [class*="__link"],
#core dt, #core dd, #core figcaption, #core time, #core small, #core strong, #core em, #core b {
  font-family: var(--ikp-font) !important;
}

/* ═══ HEADER CHROME — synced to the mockup (municipality request 2026-07-16) ═══
   The mockup's bespoke .topbar/.header/.nav classes do not exist in Pressville's
   output, so these overrides target Pressville's real selectors. Uses !important
   to beat the copied Customizer theme-mods (which default to the teal accent + a
   header background photo). Final visual check must be done via Customizer Live
   Preview on jan before any theme activate. */

/* (2) Topbar -> white, dark text (was teal theme-mod).
   Also neutralise Pressville's margin-top:-50px / height:50px / overflow:hidden
   (general.css) — that negative margin overlapped the topbar onto the old hero
   photo; with the topbar relocated to the very top (child header.php) it would
   pull it off-screen. Let it sit as a normal compact strip at the top. */
.header-topbar { background: #fff !important; border-bottom: 1px solid var(--ikp-border) !important; color: var(--ikp-text) !important; margin-top: 0 !important; height: auto !important; overflow: visible !important; }
.header-topbar a, .header-topbar__inner, .header-topbar__wrapper { color: var(--ikp-text) !important; }
.header-topbar a:hover { color: var(--ikp-accent-text) !important; }

/* (2)(3) Header titlebar -> white, hero photo removed, dark text.
   Kill the huge 170/130px padding Pressville reserved for the (now hidden) hero
   background photo — that padding left a ~300px empty white band. The mockup
   header is compact, so collapse to the __inner's own 26/22px padding. */
.header-titlebar { background: #fff !important; padding-top: 0 !important; padding-bottom: 0 !important; min-height: 0 !important; }
.header-titlebar__background,
.header-titlebar__background-image,
.header-titlebar__overlay { display: none !important; }
.header-titlebar__inner { padding-top: 26px !important; padding-bottom: 22px !important; }
.header-titlebar__title,
.header-titlebar__title-link { color: var(--ikp-text) !important; text-shadow: none !important; }
/* Title size: mockup is 26px (Pressville renders it ~48px). Match the mockup. */
.header-titlebar__title { font-size: 26px !important; line-height: 1.2 !important; font-weight: 700 !important; }
.header-titlebar__description { color: var(--ikp-text-light) !important; text-shadow: none !important; }

/* (4) Navbar -> dark blue, white top-level links. Dropdown flyouts (level-1+)
   stay dark-on-white, so ONLY level-0 links are whitened. */
.header-navbar { background: #042D44 !important; border-bottom: 1px solid rgba(255,255,255,0.08) !important; }
/* Nav links: mockup is normal-case 14px (Pressville forces UPPERCASE + letter-spacing). */
.header-menu-primary__item-link--level-0 { color: #fff !important; text-transform: none !important; letter-spacing: normal !important; font-size: 14px !important; }
.header-menu-primary__item-link--level-0:hover,
.header-menu-primary__item--hover > .header-menu-primary__item-link--level-0 { color: #fff !important; background: rgba(255,255,255,0.12) !important; }
/* Navbar height: mockup is a SLIM 51px bar. Pressville stacks min-height:80px
   (__content) + padding-top:22px (list) + padding-bottom:25px (li) = ~88px thick
   bar. Strip those and pin to 51px so the dark bar matches the mockup. */
.header-navbar__content { min-height: 51px !important; }
.header-menu-primary__list { padding-top: 0 !important; padding-bottom: 0 !important; }
.header-menu-primary__list > li { padding-top: 0 !important; padding-bottom: 0 !important; }
.header-navbar .header-menu-primary__item-link--level-0 { padding-top: 15px !important; padding-bottom: 15px !important; }
/* Logo: mockup is 72x72; Pressville renders it ~89px. */
.header-titlebar__logo-image { width: 72px !important; height: 72px !important; }
/* search toggle (in the navbar) -> white on the dark bar */
.header-navbar .header-search__toggle { color: #fff !important; }
/* full-width mobile menu button (icon-font glyph, colored via `color`) -> dark blue bar, white icon */
.header-mobile-toggle { background: #042D44 !important; color: #fff !important; }
.header-mobile-toggle__icon1, .header-mobile-toggle__icon2 { color: #fff !important; }

/* ═══ QUICK LINKS BAR (inner pages) ═══ */
.ikp-quicklinks { background: #f7fafa; border-bottom: 1px solid var(--ikp-border); padding: 12px 0; }
.ikp-quicklinks .lsvr-container { display: flex; justify-content: center; align-items: center; gap: 24px; flex-wrap: wrap; }
.ikp-quicklink { display: flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: 8px; font-size: 14px; font-weight: 500; color: var(--ikp-text); text-decoration: none; transition: all 0.2s; }
.ikp-quicklink:hover { background: #fff; box-shadow: var(--ikp-shadow-md); color: var(--ikp-accent-text); transform: translateY(-1px); }
.ikp-quicklink i { color: var(--ikp-accent-text); font-size: 16px; width: 20px; text-align: center; }
.ikp-beta { background: #c2410c; color: #fff; font-size: 10px; border-radius: 4px; padding: 1px 5px; vertical-align: middle; font-weight: 700; } /* was #f0ad4e (white text 1.95:1 FAIL); #c2410c gives white ~7:1 AA */

/* ═══ HERO (front page) ═══ */
.ikp-front .main__inner { padding: 0; max-width: none; }
.ikp-hero { position: relative; height: min(56vh, 500px); min-height: 340px; overflow: hidden; background: #1a6e7a; }
.ikp-hero-slides { position: absolute; inset: 0; }
.ikp-hero-slide { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0; transition: opacity 1.2s ease; }
.ikp-hero-slide.is-active { opacity: 1; }
.ikp-hero-overlay { position: absolute; inset: 0; background: linear-gradient(rgba(10,40,45,0.15) 40%, rgba(10,40,45,0.55)); }
.ikp-hero-content { position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-60%); color: #fff; z-index: 2; text-align: center; }
.ikp-hero-content h2 { font-size: clamp(26px, 4vw, 42px); font-weight: 700; letter-spacing: -0.5px; color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,0.45); margin: 0; }
.ikp-hero-content p { font-size: clamp(16px, 2.2vw, 22px); opacity: 0.95; margin: 8px 0 0; color: #fff; text-shadow: 0 1px 8px rgba(0,0,0,0.45); }
.ikp-hero-search { max-width: 520px; margin: 22px auto 0; position: relative; }
.ikp-hero-search input { width: 100%; padding: 14px 54px 14px 22px; border: none; border-radius: 50px; font-size: 15px; background: rgba(255,255,255,0.95); box-shadow: 0 6px 24px rgba(0,0,0,0.25); }
.ikp-hero-search input:focus { outline: none; background: #fff; box-shadow: 0 6px 24px rgba(0,0,0,0.3), 0 0 0 4px rgba(60,160,171,0.35); }
.ikp-hero-search button { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); background: var(--ikp-accent); border: none; color: #fff; width: 40px; height: 40px; border-radius: 50%; cursor: pointer; font-size: 16px; transition: background 0.2s; }
.ikp-hero-search button:hover { background: var(--ikp-accent-dark); }
.ikp-hero-dots { position: absolute; bottom: 66px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; z-index: 3; }
.ikp-hero-dots button { width: 10px; height: 10px; border-radius: 50%; border: none; background: rgba(255,255,255,0.5); cursor: pointer; padding: 0; transition: background 0.2s, transform 0.2s; }
.ikp-hero-dots button.is-active { background: #fff; transform: scale(1.25); }

/* ═══ HERO QUICK LINK CARDS ═══ */
.ikp-hero-quicklinks { position: relative; z-index: 5; margin-top: -56px; margin-bottom: 8px; }
.ikp-hero-quicklinks .lsvr-container { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.ikp-hq-item { display: flex; align-items: center; gap: 14px; background: #fff; border-radius: var(--ikp-radius); box-shadow: 0 8px 28px rgba(0,0,0,0.14); padding: 16px 20px; font-size: 16px; font-weight: 600; color: var(--ikp-text); text-decoration: none; line-height: 1.3; transition: transform 0.2s, box-shadow 0.2s; border-bottom: 3px solid var(--ikp-accent); }
.ikp-hq-item:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(0,0,0,0.18); color: var(--ikp-accent-text); }
.ikp-hq-icon { width: 46px; height: 46px; border-radius: 12px; background: var(--ikp-accent-light); color: var(--ikp-accent-text); display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; transition: all 0.2s; }
.ikp-hq-item:hover .ikp-hq-icon { background: var(--ikp-accent); color: #fff; }

/* ═══ SECTIONS ═══ */
.ikp-section { padding: 48px 0; }
.ikp-section-alt { background: #f7fafa; }
.ikp-section-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; gap: 12px; flex-wrap: wrap; }
.ikp-section-title { font-size: 22px; font-weight: 700; color: var(--ikp-text); display: flex; align-items: center; gap: 10px; margin: 0; }
.ikp-section-title::before { content: ''; width: 4px; height: 24px; background: var(--ikp-accent); border-radius: 2px; }
.ikp-section-title.ikp-center { justify-content: center; }
.ikp-section-title.ikp-center::before { display: none; }
.ikp-section-subtitle { font-size: 14px; color: var(--ikp-text-light); margin: 4px 0 0 14px; }
.ikp-section-more { font-size: 14px; font-weight: 600; color: var(--ikp-accent-text); display: flex; align-items: center; gap: 4px; text-decoration: none; transition: gap 0.2s; }
.ikp-section-more:hover { gap: 8px; }

/* ═══ CARDS (news + events) ═══ */
.ikp-cards-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.ikp-card { display: block; border-radius: var(--ikp-radius); overflow: hidden; background: #fff; border: 1px solid var(--ikp-border); box-shadow: var(--ikp-shadow); text-decoration: none; transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s; }
.ikp-card:hover { transform: translateY(-4px); box-shadow: var(--ikp-shadow-lg); border-color: var(--ikp-accent); }
.ikp-card-img { display: block; height: 170px; background-size: cover; background-position: center; position: relative; }
.ikp-card-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(transparent 40%, rgba(0,0,0,0.5)); }
.ikp-card-body { display: block; padding: 14px 16px; }
.ikp-card-date { display: block; font-size: 12px; color: var(--ikp-text-light); margin-bottom: 6px; }
.ikp-card-title { display: -webkit-box; font-size: 14px; font-weight: 600; line-height: 1.4; color: var(--ikp-text); -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ikp-card-tag { position: absolute; bottom: 8px; left: 8px; z-index: 1; background: var(--ikp-accent-aa); color: #fff; font-size: 11px; font-weight: 600; padding: 3px 10px; border-radius: 20px; } /* AA teal: white 11px on #1a7d8a = 4.83:1 (was #3ca0ab 3.08:1) */
.ikp-date-badge { position: absolute; top: 12px; right: 12px; z-index: 1; background: var(--ikp-accent); color: #fff; border-radius: 8px; padding: 6px 12px; text-align: center; line-height: 1.1; }
.ikp-date-badge .ikp-day { font-size: 22px; font-weight: 700; display: block; }
.ikp-date-badge .ikp-month { font-size: 11px; font-weight: 600; text-transform: uppercase; }

/* ═══ PLACES GRID ═══ */
.ikp-places-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; max-width: 900px; margin: 0 auto; }
.ikp-place-card { display: flex; align-items: center; gap: 14px; padding: 16px 20px; background: #fff; border: 1px solid var(--ikp-border); border-radius: var(--ikp-radius); text-decoration: none; transition: all 0.2s; }
.ikp-place-card:hover { border-color: var(--ikp-accent-text); box-shadow: var(--ikp-shadow-md); transform: translateY(-2px); }
.ikp-place-card:hover .ikp-place-icon { background: var(--ikp-accent); color: #fff; }
.ikp-place-icon { width: 44px; height: 44px; border-radius: 10px; background: var(--ikp-accent-light); color: var(--ikp-accent-text); display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; transition: all 0.2s; }
.ikp-place-name { display: block; font-size: 16px; font-weight: 600; color: var(--ikp-text); }
.ikp-place-count { display: block; font-size: 13px; color: var(--ikp-text-light); }

/* ═══ VIRTUAL TOUR ═══ */
.ikp-tour { text-align: center; }
.ikp-tour-sub { color: var(--ikp-text-light); margin: 8px 0 24px; }
/* (5) Virtual-tour frame -> white border + discreet shadow (municipality request 2026-07-16) */
.ikp-tour-wrap { max-width: 940px; margin: 0 auto; padding: 18px; border-radius: var(--ikp-radius); background: #fff; border: 1px solid var(--ikp-border); box-shadow: 0 12px 34px rgba(0,0,0,0.10); position: relative; }
.ikp-tour-wrap::before { content: ''; position: absolute; inset: 8px; border: 1px solid rgba(0,0,0,0.05); border-radius: 10px; pointer-events: none; }
.ikp-tour-frame { border-radius: 8px; overflow: hidden; box-shadow: var(--ikp-shadow-lg); }
.ikp-tour-frame iframe { display: block; }

/* ═══ FOOTER 17500 ═══ */
.ikp-footer-17500 { margin-top: 10px; font-weight: 600; }
.ikp-footer-17500 i { color: var(--ikp-accent-text); margin-right: 6px; }

/* ═══ COMING SOON (EN fallback) ═══ */
.ikp-coming-soon-icon { font-size: 44px; color: var(--ikp-accent-text); margin-bottom: 8px; }
.ikp-coming-soon-el { color: var(--ikp-text-light); font-size: 0.9em; }

/* ═══ COMPLAINT CONFIRMATION POP-UP (Everest Forms) ═══ */
.ikp-modal-overlay { position: fixed; inset: 0; background: rgba(15,30,35,0.6); z-index: 100000; display: none; align-items: center; justify-content: center; padding: 20px; }
.ikp-modal-overlay.is-open { display: flex; }
.ikp-modal-box { background: #fff; border-radius: var(--ikp-radius); box-shadow: 0 24px 64px rgba(0,0,0,0.3); max-width: 560px; width: 100%; max-height: 90vh; overflow-y: auto; padding: 32px; text-align: center; }
.ikp-modal-icon { width: 64px; height: 64px; border-radius: 50%; background: var(--ikp-accent-light); color: var(--ikp-accent-text); font-size: 28px; display: flex; align-items: center; justify-content: center; margin: 0 auto 16px; }
.ikp-modal-box h3 { font-size: 20px; font-weight: 700; margin: 0 0 10px; }
.ikp-modal-ref { display: inline-block; background: var(--ikp-accent-light); color: var(--ikp-accent-dark); font-weight: 700; font-size: 15px; border-radius: 8px; padding: 6px 16px; margin: 4px 0 10px; }
.ikp-modal-summary { text-align: left; margin-top: 16px; border: 1px solid var(--ikp-border); border-radius: 8px; overflow: hidden; }
.ikp-modal-summary table { width: 100%; border-collapse: collapse; font-size: 13px; margin: 0; }
.ikp-modal-summary th { background: #f7fafa; text-align: left; padding: 8px 12px; width: 40%; color: var(--ikp-text-light); font-weight: 600; border-bottom: 1px solid var(--ikp-border); vertical-align: top; }
.ikp-modal-summary td { padding: 8px 12px; border-bottom: 1px solid var(--ikp-border); word-break: break-word; }
.ikp-modal-actions { display: flex; gap: 10px; justify-content: center; margin-top: 20px; flex-wrap: wrap; }

@media print {
    body.ikp-print-modal > *:not(.ikp-modal-overlay) { display: none !important; }
    body.ikp-print-modal .ikp-modal-overlay { position: static; display: block; background: none; padding: 0; }
    body.ikp-print-modal .ikp-modal-box { box-shadow: none; max-width: 100%; max-height: none; overflow: visible; }
    body.ikp-print-modal .ikp-modal-actions { display: none; }
}

/* ═══ RESPONSIVE ═══ */
@media ( max-width: 991px ) {
    .ikp-hero { height: 48vh; min-height: 320px; }
    .ikp-hero-quicklinks .lsvr-container { grid-template-columns: repeat(2, 1fr); }
    .ikp-cards-grid { grid-template-columns: repeat(2, 1fr); }
    .ikp-places-grid { grid-template-columns: repeat(2, 1fr); }
}

@media ( max-width: 640px ) {
    .ikp-hero { height: 44vh; min-height: 300px; }
    .ikp-hero-search { max-width: 90%; }
    .ikp-hero-dots { bottom: 46px; }
    .ikp-hero-quicklinks { margin-top: -40px; }
    .ikp-hero-quicklinks .lsvr-container { grid-template-columns: 1fr 1fr; gap: 10px; padding-left: 16px !important; padding-right: 16px !important; box-sizing: border-box; max-width: 100% !important; }
    .ikp-hq-item { padding: 12px 14px; font-size: 15px; gap: 10px; min-width: 0; }
    .ikp-hq-item span { min-width: 0; overflow-wrap: anywhere; }
    .ikp-hq-icon { width: 38px; height: 38px; font-size: 16px; }
    .ikp-cards-grid { grid-template-columns: 1fr; }
    .ikp-places-grid { grid-template-columns: 1fr; }
    .ikp-section { padding: 32px 0; }
    .ikp-section-header { flex-direction: column; align-items: flex-start; gap: 8px; }
    .ikp-quicklinks .lsvr-container { gap: 8px; }
    .ikp-quicklink { font-size: 13px; padding: 6px 12px; }
}

/* ═══ TOPBAR SOCIAL ICONS + CLEAN ROW (mockup parity, municipality 2026-07-16) ═══
   Lay the topbar out as one right-aligned flex row so the (trimmed) menu, social
   icons and language switcher sit side by side and never overlap/stack. */
.header-topbar__inner { display: flex !important; align-items: center; justify-content: flex-end; gap: 16px; flex-wrap: wrap; }
.ikp-topbar-social { display: inline-flex; align-items: center; gap: 6px; }
.ikp-topbar-follow { font-size: 12px; font-weight: 600; color: var(--ikp-text-light); margin-right: 2px; }
.ikp-topbar-social a { width: 26px; height: 26px; border-radius: 50%; background: var(--ikp-accent); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; text-decoration: none; transition: background .2s; }
.ikp-topbar-social a:hover { background: var(--ikp-accent-dark); color: #fff; }

/* ═══ NAV FIT (mockup parity) ═══
   Hide the redundant nav search (search lives in the hero, as in the mockup) and
   widen the navbar's inner container so the 7 long Greek labels sit on ONE line on
   desktops >=1180px (the dark bar is already full-width; only its content was capped
   at ~948px). Narrower screens wrap gracefully. Final width confirmed at flip. */
.header-navbar .header-search__wrapper { display: none !important; }
.header-navbar .lsvr-container { max-width: 1260px !important; }
.header-menu-primary__item-link--level-0 { padding-left: 11px !important; padding-right: 11px !important; font-size: 14px !important; }

/* ═══ ACCESSIBILITY (WCAG 2.1 AA — EU Web Accessibility Directive) ═══ */
/* 2.4.7 Focus Visible: a clear keyboard-focus ring on every interactive element. */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, [tabindex]:focus-visible,
.ikp-hq-item:focus-visible, .ikp-place-card:focus-visible {
  outline: 3px solid var(--ikp-accent-text) !important;
  outline-offset: 2px !important;
  border-radius: 4px;
}
/* On the dark-blue nav + hero photo, a white ring keeps contrast. */
.header-navbar a:focus-visible, .header-navbar button:focus-visible,
.ikp-hero a:focus-visible, .ikp-hero button:focus-visible, .ikp-hero input:focus-visible {
  outline-color: #fff !important;
}

/* 2.3.3 / 2.2.2 Reduced motion: kill animation + the hero auto-slide transition. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  .ikp-hero-slide { transition: none !important; }
}

/* ═══ HEADER/NAVBAR — full mockup parity (municipality 2026-07-16) ═══ */
/* Cluster the secondary menu (post-trim = Πληρωμές pill) with the social + EL/EN
   group on the right, matching the mockup. Pressville absolutely-positions this
   nav at left:0 (general.css), so it must be returned to the flex flow — then the
   __inner's justify-content:flex-end packs it beside the social block. */
.header-topbar .header-menu-secondary {
  position: static !important; left: auto !important; top: auto !important;
  margin: 0 !important; max-width: none !important; padding-left: 0 !important;
}
/* Topbar Πληρωμές as a bordered pill with a card icon (post-trim = only Πληρωμές). */
.header-topbar .header-menu-secondary__item-link,
.header-topbar .header-menu-secondary__list > li > a {
  border: 1px solid var(--ikp-border); border-radius: 20px; padding: 5px 14px !important;
  color: var(--ikp-accent-text) !important; font-weight: 600; display: inline-flex; align-items: center; gap: 6px;
  transition: background .2s, border-color .2s;
}
.header-topbar .header-menu-secondary__item-link:hover,
.header-topbar .header-menu-secondary__list > li > a:hover { background: var(--ikp-accent-light); border-color: var(--ikp-accent); }
.header-topbar .header-menu-secondary__item-link::before,
.header-topbar .header-menu-secondary__list > li > a::before {
  font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f09d"; font-size: 12px; /* fa-credit-card */
}

/* EL/EN language toggle (mockup parity). */
.ikp-lang-switch { display: inline-flex; border: 1px solid var(--ikp-border); border-radius: 20px; overflow: hidden; }
.ikp-lang-btn { font-size: 11px; font-weight: 700; padding: 4px 12px; color: var(--ikp-text-light); background: transparent; line-height: 1.6; user-select: none; }
.ikp-lang-btn.is-active { background: var(--ikp-accent); color: #fff; }

/* Nav items centered, matching the mockup (Pressville left-aligns; __content is block, so justify needs flex). */
.header-navbar__content { display: flex !important; justify-content: center !important; align-items: center; }
.header-menu-primary__list { display: flex !important; flex-wrap: wrap; justify-content: center; }

/* ═══ INNER-PAGE CHROME — breadcrumb + teal page-hero (mockup parity) ═══
   Rendered full-width by ikp_child_page_hero() (functions.php) right after the
   header. Mirrors the mockup's .breadcrumb + .page-hero exactly. */
.ikp-breadcrumb { background: #f6f7f8; border-bottom: 1px solid var(--ikp-border); padding: 12px 0; }
.ikp-breadcrumb .lsvr-container { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ikp-text-light); }
.ikp-breadcrumb a { color: var(--ikp-text-light); font-weight: 500; text-decoration: none; }
.ikp-breadcrumb a:hover { color: var(--ikp-accent-text); }
.ikp-breadcrumb i { font-size: 10px; color: #b8c2cf; }
.ikp-breadcrumb span { color: var(--ikp-text); font-weight: 600; }

.ikp-page-hero { position: relative; overflow: hidden; padding: 40px 0; color: #fff;
  background: linear-gradient(135deg, #1a6e7a 0%, #2d9aa5 50%, #3cb5c0 100%); }
.ikp-page-hero::before { content: ""; position: absolute; inset: 0;
  background: url('https://ierokipia.org.cy/wp-content/uploads/2021/10/DJI_0382-2.jpg') center/cover; background-image: image-set(url('https://ierokipia.org.cy/wp-content/uploads/2021/10/DJI_0382-2.webp') type('image/webp'), url('https://ierokipia.org.cy/wp-content/uploads/2021/10/DJI_0382-2.jpg') type('image/jpeg')); opacity: 0.15; }
.ikp-page-hero .lsvr-container { position: relative; z-index: 1; }
.ikp-page-hero__title { font-size: 28px; font-weight: 700; margin: 0 0 6px; color: #fff; line-height: 1.2; }
.ikp-page-hero__sub { font-size: 15px; opacity: 0.92; margin: 0; color: #fff; }

/* Hide Pressville's plain in-content page title — the hero above now carries it.
   Scoped to real pages (type-page) so single posts/archives keep their own. */
.type-page > .page__header { display: none; }
/* Archive/listing/directory pages: hide the theme's own title (.main__header) +
   breadcrumb (.breadcrumbs) — the teal page-hero already shows both, so this
   removes the duplicate title + "HOME › DIRECTORY" breadcrumb. The category
   filter row is a separate element and is untouched. */
#core .main__header,
#core [class*="breadcrumbs"] { display: none !important; }

/* ═══ INNER-PAGE CONTENT COMPONENTS — ported from the mockup, scoped to
   migrated page content (wrapped in .ikp-content). Mockup CSS vars remapped to
   the child's. AA (EU Web Accessibility Directive): teal TEXT uses the darker
   --ikp-accent-text (5.38:1); bright --ikp-accent stays for bg/borders/large icons. */
.ikp-content { font-size: 15px; color: var(--ikp-text); line-height: 1.7; }
.ikp-content > * + * { margin-top: 18px; }
.ikp-content h2, .ikp-content h3 { color: var(--ikp-text); }
.ikp-content a { color: var(--ikp-accent-text); }
.ikp-content .section-title { font-size: 22px; font-weight: 700; color: var(--ikp-text); display: flex; align-items: center; gap: 10px; }
.ikp-content .section-title::before { content: ''; width: 4px; height: 24px; background: var(--ikp-accent); border-radius: 2px; flex-shrink: 0; }

.ikp-content .card { background: #fff; border-radius: var(--ikp-radius); box-shadow: var(--ikp-shadow); overflow: hidden; }
.ikp-content .card-body { padding: 20px 24px; }

.ikp-content .timeline { position: relative; padding-left: 32px; list-style: none; }
.ikp-content .timeline::before { content: ''; position: absolute; left: 12px; top: 0; bottom: 0; width: 3px; background: var(--ikp-accent-light); border-radius: 2px; }
.ikp-content .timeline-item { position: relative; margin-bottom: 28px; }
.ikp-content .timeline-item::before { content: ''; position: absolute; left: -26px; top: 4px; width: 14px; height: 14px; border-radius: 50%; background: var(--ikp-accent); border: 3px solid var(--ikp-accent-light); }
.ikp-content .timeline-year { font-size: 14px; font-weight: 700; color: var(--ikp-accent-text); margin-bottom: 4px; }
.ikp-content .timeline-text { font-size: 14px; color: var(--ikp-text); line-height: 1.6; }

.ikp-content .doc-list { list-style: none; padding: 0; }
.ikp-content .doc-item { display: flex; align-items: center; gap: 14px; padding: 14px 18px; background: #fff; border: 1px solid var(--ikp-border); border-radius: var(--ikp-radius); margin-bottom: 10px; transition: all 0.2s; text-decoration: none; }
.ikp-content .doc-item:hover { border-color: var(--ikp-accent); box-shadow: var(--ikp-shadow-md); transform: translateX(4px); }
.ikp-content .doc-icon { width: 44px; height: 44px; border-radius: 8px; background: #fee2e2; color: #dc2626; display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; }
.ikp-content .doc-icon.doc { background: #dbeafe; color: #2563eb; }
.ikp-content .doc-icon.xls { background: #d1fae5; color: #047857; }
.ikp-content .doc-info { flex: 1; }
.ikp-content .doc-info h4 { font-size: 14px; font-weight: 600; color: var(--ikp-text); margin-bottom: 2px; }
.ikp-content .doc-info span { font-size: 12px; color: var(--ikp-text-light); }
.ikp-content .doc-download { color: var(--ikp-accent-text); font-size: 18px; padding: 8px; }

.ikp-content .staff-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ikp-content .staff-card { background: #fff; border-radius: var(--ikp-radius); box-shadow: var(--ikp-shadow); text-align: center; padding: 24px 20px; }
.ikp-content .staff-photo { width: 90px; height: 90px; border-radius: 50%; background: var(--ikp-accent-light); margin: 0 auto 14px; display: flex; align-items: center; justify-content: center; font-size: 36px; color: var(--ikp-accent); overflow: hidden; }
.ikp-content .staff-photo img { width: 100%; height: 100%; object-fit: cover; }
.ikp-content .staff-name { font-size: 15px; font-weight: 600; color: var(--ikp-text); margin-bottom: 2px; }
.ikp-content .staff-role { font-size: 13px; color: var(--ikp-text-light); margin-bottom: 10px; }
.ikp-content .staff-contact { font-size: 13px; color: var(--ikp-accent-text); }

.ikp-content .info-box { background: var(--ikp-accent-light); border-left: 4px solid var(--ikp-accent); border-radius: 0 var(--ikp-radius) var(--ikp-radius) 0; padding: 16px 20px; margin-bottom: 20px; }
.ikp-content .info-box h4 { font-size: 15px; font-weight: 600; color: var(--ikp-accent-dark); margin-bottom: 4px; }
.ikp-content .info-box p { font-size: 14px; color: var(--ikp-text); }

.ikp-content .contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.ikp-content .contact-info-block { display: flex; gap: 14px; margin-bottom: 20px; }
.ikp-content .contact-icon { width: 48px; height: 48px; border-radius: 10px; background: var(--ikp-accent-light); color: var(--ikp-accent); display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; }
.ikp-content .contact-detail h4 { font-size: 14px; font-weight: 600; margin-bottom: 2px; color: var(--ikp-text); }
.ikp-content .contact-detail p { font-size: 14px; color: var(--ikp-text-light); margin: 0; }

.ikp-content .resp-list { list-style: none; padding: 0; }
.ikp-content .resp-list li { padding: 10px 0; border-bottom: 1px solid var(--ikp-border); font-size: 14px; display: flex; align-items: flex-start; gap: 10px; }
.ikp-content .resp-list li:last-child { border-bottom: none; }
.ikp-content .resp-list li i { color: var(--ikp-accent); margin-top: 3px; flex-shrink: 0; }

.ikp-content .online-links { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.ikp-content .online-link { display: flex; align-items: center; gap: 12px; padding: 16px 20px; background: #fff; border: 1px solid var(--ikp-border); border-radius: var(--ikp-radius); font-size: 14px; font-weight: 600; color: var(--ikp-text); transition: all 0.2s; text-decoration: none; }
.ikp-content .online-link:hover { border-color: var(--ikp-accent); background: var(--ikp-accent-light); color: var(--ikp-accent-text); }
.ikp-content .online-link i { font-size: 20px; color: var(--ikp-accent); }

.ikp-content .form-group { margin-bottom: 20px; }
.ikp-content .form-group label { display: block; font-size: 14px; font-weight: 600; color: var(--ikp-text); margin-bottom: 6px; }
.ikp-content .form-group label .required { color: #dc2626; }
.ikp-content .form-control { width: 100%; padding: 10px 14px; border: 2px solid var(--ikp-border); border-radius: 8px; font-size: 14px; color: var(--ikp-text); background: #fff; }
.ikp-content .form-control:focus { outline: none; border-color: var(--ikp-accent); box-shadow: 0 0 0 4px rgba(60,160,171,0.1); }
.ikp-content .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

@media (max-width: 782px) {
  .ikp-content .staff-grid { grid-template-columns: repeat(2, 1fr); }
  .ikp-content .contact-grid, .ikp-content .online-links, .ikp-content .form-row { grid-template-columns: 1fr; }
}
@media (max-width: 520px) { .ikp-content .staff-grid { grid-template-columns: 1fr; } }

/* ═══ FOOTER — mockup parity (4-column, dark) ═══ ported from the mockup .footer.
   Own ikp-foot- classes (no clash with Pressville #footer). Bright teal is AA-safe
   on the dark #1a2332 ground, so no accent-text swap needed here. */
.ikp-footer { background: #1a2332; color: rgba(255,255,255,0.72); padding: 48px 0 24px; position: relative; }
.ikp-footer::before { content: ''; position: absolute; inset: 0; background: url('https://ierokipia.org.cy/wp-content/uploads/2018/05/footer-bg.jpg') center/cover; opacity: 0.08; }
.ikp-footer .lsvr-container { position: relative; z-index: 1; }
.ikp-foot-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 32px; margin-bottom: 32px; }
.ikp-footer h3 { color: #fff; font-size: 16px; margin: 0 0 16px; }
.ikp-foot-about p { font-size: 14px; line-height: 1.7; color: rgba(255,255,255,0.72); margin: 0; }
.ikp-foot-follow { margin-top: 20px !important; margin-bottom: 10px !important; font-size: 14px !important; }
.ikp-foot-links { list-style: none; padding: 0; margin: 0; }
.ikp-foot-links li { margin-bottom: 8px; }
.ikp-foot-links a { color: rgba(255,255,255,0.72); font-size: 14px; text-decoration: none; transition: color 0.2s; }
.ikp-foot-links a:hover { color: var(--ikp-accent); }
.ikp-foot-contact p { font-size: 14px; margin: 0 0 6px; display: flex; align-items: flex-start; gap: 8px; color: rgba(255,255,255,0.72); }
.ikp-foot-contact i { color: var(--ikp-accent); margin-top: 3px; width: 16px; flex-shrink: 0; }
.ikp-foot-contact a { color: rgba(255,255,255,0.72); text-decoration: none; }
.ikp-foot-contact a:hover { color: var(--ikp-accent); }
.ikp-foot-social { display: flex; gap: 10px; margin-top: 16px; }
.ikp-foot-social a { width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.1); color: #fff; display: flex; align-items: center; justify-content: center; text-decoration: none; transition: background 0.2s; }
.ikp-foot-social a:hover { background: var(--ikp-accent); color: #fff; }
.ikp-foot-bottom { border-top: 1px solid rgba(255,255,255,0.1); padding-top: 20px; text-align: center; font-size: 13px; color: rgba(255,255,255,0.62); line-height: 1.9; }
.ikp-foot-bottom a { color: var(--ikp-accent); text-decoration: none; }
.ikp-foot-bottom a:hover { text-decoration: underline; }
@media (max-width: 782px) { .ikp-foot-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .ikp-foot-grid { grid-template-columns: 1fr; } }

/* ═══════════════════════════════════════════════════════════════════════
   TEAL MOCKUP OVERRIDE (2026-07-16) — live site now matches the TEAL /mockup/:
   teal topbar + teal-gradient header + WHITE nav. Last in the file so it beats
   the earlier white-topbar/dark-blue-nav rules. Revert = delete this block.
   ═══════════════════════════════════════════════════════════════════════ */

/* --- FULL-WIDTH teal bars + 1140px content container (mockup: bars span edge to
   edge, content in a max-width:1140 .container). Pressville paints on the inner
   container (leaving white gutters) and uses a wider container, so: paint the
   full-width __wrapper teal, and pin all three header containers to 1140px. --- */
.header-topbar__wrapper { background: var(--ikp-topbar-bg) !important; }
.header-topbar__wrapper > .lsvr-container,
.header-titlebar .lsvr-container,
.header-navbar .lsvr-container { max-width: 1140px !important; }

/* --- TOPBAR: teal bg, white text; left = plain links, right = pill+social+lang --- */
.header-topbar { background: var(--ikp-topbar-bg) !important; border-bottom: none !important; color: #fff !important; padding: 6px 0 !important; }
.header-topbar a, .header-topbar__inner, .header-topbar__wrapper { color: #fff !important; }
.header-topbar__inner { justify-content: flex-start !important; gap: 12px !important; flex-wrap: wrap; }
/* Owner request: remove the top-bar secondary links (Αιτήσεις/Προσφορές/Θέσεις
   Εργασίας/Παράπονα/Επικοινωνία) on all viewports; they remain reachable from the
   main nav. Πληρωμές moves to the LEFT (see .ikp-topbar-pay below). */
.header-topbar .header-menu-secondary { display: none !important; }
.header-topbar .header-menu-secondary__list { display: flex !important; gap: 16px !important; }
.header-topbar .header-menu-secondary__list > li { margin: 0 !important; padding: 0 !important; }
.header-topbar .header-menu-secondary__item-link,
.header-topbar .header-menu-secondary__list > li > a { border: none !important; border-radius: 0 !important; padding: 0 !important; background: none !important; color: #fff !important; font-weight: 500 !important; }
.header-topbar .header-menu-secondary__item-link:hover,
.header-topbar .header-menu-secondary__list > li > a:hover { background: none !important; border-color: transparent !important; color: #fff !important; }
.header-topbar .header-menu-secondary__item-link::before,
.header-topbar .header-menu-secondary__list > li > a::before { content: none !important; }
.ikp-topbar-pay { margin-right: auto !important; margin-left: 0 !important; background: rgba(255,255,255,0.2) !important; color: #fff !important; padding: 4px 14px !important; border-radius: 20px !important; font-weight: 600 !important; display: inline-flex !important; align-items: center; gap: 6px; text-decoration: none; transition: background .2s; }
.ikp-topbar-pay:hover { background: rgba(255,255,255,0.3) !important; color: #fff !important; }
.ikp-topbar-follow { color: #fff !important; }
.ikp-topbar-social a { background: rgba(255,255,255,0.15) !important; color: #fff !important; width: 24px !important; height: 24px !important; }
.ikp-topbar-social a:hover { background: rgba(255,255,255,0.35) !important; color: #fff !important; }
.ikp-lang-switch { border: 1px solid rgba(255,255,255,0.4) !important; }
.ikp-lang-btn { color: #fff !important; } /* full white on teal topbar = AA 4.83:1 (was 0.85 alpha ~3.9:1) */
.ikp-lang-btn.is-active { background: #fff !important; color: var(--ikp-accent-text) !important; } /* teal TEXT on white pill: #1c757f = 5.38:1 (was #3ca0ab 3.08:1 FAIL) */

/* --- HEADER BAND: teal gradient + faded photo, white text, white-circle logo --- */
.header-titlebar { background: linear-gradient(135deg, #1a6e7a 0%, #2d9aa5 50%, #3cb5c0 100%) !important; position: relative !important; overflow: hidden !important; padding-top: 0 !important; padding-bottom: 0 !important; }
/* display:block is REQUIRED — Pressville sets .header-titlebar::before{display:none}. */
.header-titlebar::before { content: '' !important; display: block !important; position: absolute !important; inset: 0 !important; background: url('https://ierokipia.org.cy/wp-content/uploads/2021/10/DJI_0382-2.jpg') center/cover !important; background-image: image-set(url('https://ierokipia.org.cy/wp-content/uploads/2021/10/DJI_0382-2.webp') type('image/webp'), url('https://ierokipia.org.cy/wp-content/uploads/2021/10/DJI_0382-2.jpg') type('image/jpeg')) !important; opacity: 0.3 !important; z-index: 0 !important; }
.header-titlebar__inner { position: relative !important; z-index: 1 !important; padding-top: 30px !important; padding-bottom: 28px !important; }
.header-titlebar__title, .header-titlebar__title-link { color: #fff !important; text-shadow: 0 1px 3px rgba(0,0,0,0.25) !important; }
.header-titlebar__description { color: rgba(255,255,255,0.9) !important; text-shadow: 0 1px 3px rgba(0,0,0,0.25) !important; }
.header-titlebar__logo-image { width: 72px !important; height: 72px !important; border-radius: 50% !important; background: #fff !important; padding: 4px !important; box-shadow: 0 2px 12px rgba(0,0,0,0.2) !important; }

/* --- NAVBAR: white bg, dark links, teal hover --- */
.header-navbar { background: #fff !important; border-bottom: 1px solid var(--ikp-border) !important; box-shadow: var(--ikp-shadow) !important; }
.header-navbar .header-menu-primary__item-link--level-0 { color: var(--ikp-text) !important; }
.header-navbar .header-menu-primary__item-link--level-0:hover,
.header-navbar .header-menu-primary__item--hover > .header-menu-primary__item-link--level-0 { color: var(--ikp-accent-text) !important; background: var(--ikp-accent-light) !important; }
/* active/current page = teal + underline (mockup .nav-link.active) */
.header-navbar .current-menu-item > .header-menu-primary__item-link--level-0,
.header-navbar .current-menu-ancestor > .header-menu-primary__item-link--level-0,
.header-navbar .current_page_item > .header-menu-primary__item-link--level-0 { color: var(--ikp-accent-text) !important; box-shadow: inset 0 -2px 0 var(--ikp-accent) !important; }
.header-navbar .header-search__toggle { color: var(--ikp-text) !important; }
.header-mobile-toggle { background: var(--ikp-accent) !important; color: #fff !important; }

/* --- DROPDOWN MENUS: match the mockup .nav-dropdown exactly (white, 2px teal top
   border, rounded bottom, big shadow, min-width 220, items 10/18px @13px). --- */
.header-navbar .header-menu-primary__submenu {
  background: #fff !important;
  min-width: 220px !important;
  border: 1px solid var(--ikp-border) !important;
  border-top: 2px solid var(--ikp-accent) !important;
  border-radius: 0 0 var(--ikp-radius) var(--ikp-radius) !important;
  box-shadow: var(--ikp-shadow-lg) !important;
  padding: 0 !important;
}
/* nested (level-2+) submenus open to the side — round the outer corners */
.header-navbar .header-menu-primary__submenu--level-1,
.header-navbar .header-menu-primary__submenu--level-2 { border-radius: 0 var(--ikp-radius) var(--ikp-radius) var(--ikp-radius) !important; }
.header-navbar .header-menu-primary__submenu .header-menu-primary__item-link {
  padding: 10px 18px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--ikp-text) !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  background: none !important;
}
.header-navbar .header-menu-primary__submenu .header-menu-primary__item-link:hover,
.header-navbar .header-menu-primary__submenu .header-menu-primary__item--hover > .header-menu-primary__item-link {
  background: var(--ikp-accent-light) !important;
  color: var(--ikp-accent-text) !important;
}
/* Remove the nested-submenu chevron/arrow from dropdown items (owner request).
   The arrow is an icon-font glyph on .header-menu-primary__item::after (font
   pressville-icons), NOT the toggle element. DESKTOP ONLY — on mobile the toggle
   is the tap-to-expand control, so it must stay. */
@media (min-width: 992px) {
  .header-navbar .header-menu-primary__submenu-toggle,
  .header-navbar .header-menu-primary__submenu-toggle-icon { display: none !important; }
  .header-navbar .header-menu-primary__item::after,
  .header-navbar .header-menu-primary__item::before { content: none !important; display: none !important; }
}
/* Keep the dropdown open while moving the mouse from the nav item into it:
   make the flyout flush with the bar (no dead gap) + a transparent bridge over
   any residual gap. Slimming the navbar removed the li padding that bridged it. */
.header-navbar .header-menu-primary__item--level-0 > .header-menu-primary__submenu { top: 100% !important; margin-top: 0 !important; }
.header-navbar .header-menu-primary__submenu::before {
  content: '' !important; display: block !important; position: absolute !important;
  left: 0 !important; right: 0 !important; top: -10px !important; height: 10px !important; background: transparent !important;
}
/* nested (side-opening) submenus: bridge the horizontal gap too */
.header-navbar .header-menu-primary__submenu .header-menu-primary__submenu::before {
  top: 0 !important; bottom: 0 !important; left: -10px !important; right: auto !important; width: 10px !important; height: auto !important;
}

/* ═══ RESPONSIVE — teal header on mobile/tablet (body grids already responsive) ═══ */
@media (max-width: 991px) {
  /* The 5 topbar left links overflow on phones — hide them (they're also reachable
     from the main hamburger nav). Mobile layout (owner): Πληρωμές LEFT · social
     CENTER (bigger) · EL/EN RIGHT (bigger). */
  .header-topbar .header-menu-secondary { display: none !important; }
  .header-topbar__inner { justify-content: space-between !important; align-items: center; gap: 8px !important; flex-wrap: nowrap !important; }
  .ikp-topbar-pay { margin-left: 0 !important; margin-right: 0 !important; order: 0 !important; }
  .ikp-topbar-social { order: 1 !important; }
  .ikp-lang-switch { order: 2 !important; }
  /* bigger, centred social */
  .ikp-topbar-social a { width: 32px !important; height: 32px !important; }
  .ikp-topbar-social a svg { width: 17px !important; height: 17px !important; }
  /* bigger EL/EN */
  .ikp-lang-btn { font-size: 14px !important; padding: 6px 14px !important; }
  .header-topbar__wrapper > .lsvr-container,
  .header-titlebar .lsvr-container,
  .header-navbar .lsvr-container { padding-left: 16px !important; padding-right: 16px !important; }
  /* mobile menu panel: readable dark links on white (Pressville collapses nav here) */
  .header-navbar .header-menu-primary__item-link { color: var(--ikp-text) !important; }
  /* Mobile header: logo on the LEFT, title + subtitle stacked right next to it
     (owner request). Float the logo so the two text blocks flow to its right. */
  .header-titlebar__inner { text-align: left !important; display: block !important; }
  .header-titlebar__inner::after { content: '' !important; display: block !important; clear: both !important; }
  .header-titlebar__logo { float: left !important; margin: 0 14px 0 0 !important; }
  .header-titlebar__title,
  .header-titlebar__title--frontpage,
  .header-titlebar__description { text-align: left !important; margin-left: 0 !important; }
  .header-titlebar__title { margin-bottom: 2px !important; }
}
@media (max-width: 600px) {
  .ikp-topbar-follow { display: none !important; }               /* drop "Ακολουθήστε μας" label */
  .header-titlebar__logo-image { width: 58px !important; height: 58px !important; }
  .header-titlebar__title { font-size: 22px !important; }
  .header-titlebar__inner { padding-top: 20px !important; padding-bottom: 20px !important; }
}

/* ═══ WCAG AA CONTRAST — white text on teal ═══════════════════════════════
   LSVR/Pressville paint date pills & badges with the bright accent #3ca0ab
   (rgba 60,160,171). White text on that is 3.08:1 (fails AA for the small,
   bold pill text). Repaint just those white-text-on-teal surfaces with the
   AA teal (#1a7d8a = 4.83:1). Bright teal stays for borders/links/fills that
   carry no text. EU Web Accessibility Directive (Law 205(I)/2019). */
.lsvr_event-post-archive--grid .post__date,
.lsvr-pressville-post-grid__post-event-date,
.lsvr-pressville-post-grid__post-badge,
.lsvr_event-post-archive--grid .post__date > *,
.lsvr_event-list-widget__item-date-month,
.lsvr_listing-post-archive--grid .post__meta {
  background-color: var(--ikp-accent-aa) !important;
}

/* ═══ MOCKUP NAVBAR (ported 1:1 from /mockup/ header.js + style.css) ═══════
   Replaces Pressville's menu-driven navbar (child template-parts/header/navbar.php).
   Prefixed .ikp-nav* classes so nothing collides with Pressville's .header-navbar.
   White sticky bar, teal-bordered dropdowns, 3rd-level flyouts, mobile accordion.
   Reverts by deleting the child navbar.php (Pressville's navbar returns). */
.ikp-nav { background: #fff; border-bottom: 1px solid var(--ikp-border); position: sticky; top: 0; z-index: 100; box-shadow: var(--ikp-shadow); }
.ikp-nav .lsvr-container { display: flex; align-items: center; justify-content: center; max-width: 1140px !important; }
.ikp-nav-list { display: flex; list-style: none; gap: 0; margin: 0; padding: 0; }
.ikp-nav-item { position: relative; }
.ikp-nav-link { display: block; padding: 14px 18px; font-size: 14px; font-weight: 600; color: var(--ikp-text); text-decoration: none; transition: color 0.2s, background 0.2s; font-family: var(--ikp-font); }
.ikp-nav-link:hover { color: var(--ikp-accent-text); background: var(--ikp-accent-light); }
.ikp-nav-link.is-active { color: var(--ikp-accent-text); border-bottom: 2px solid var(--ikp-accent); }
.ikp-nav-item:hover > .ikp-nav-dropdown, .ikp-nav-item:focus-within > .ikp-nav-dropdown { display: block; }
.ikp-nav-dropdown { display: none; position: absolute; top: 100%; left: 0; background: #fff; min-width: 240px; border-radius: 0 0 var(--ikp-radius) var(--ikp-radius); box-shadow: var(--ikp-shadow-lg); border: 1px solid var(--ikp-border); border-top: 2px solid var(--ikp-accent); z-index: 200; padding: 4px 0; }
.ikp-nav-dropdown > a, .ikp-has-sub > a { display: block; padding: 10px 18px; font-size: 13px; color: var(--ikp-text); font-weight: 500; text-decoration: none; transition: background 0.15s, color 0.15s; }
.ikp-nav-dropdown > a:hover, .ikp-has-sub > a:hover { background: var(--ikp-accent-light); color: var(--ikp-accent-text); }
.ikp-nav-dropdown-right { left: auto; right: 0; }
.ikp-has-sub { position: relative; }
.ikp-has-sub > a { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.sub-arrow { font-size: 9px; color: var(--ikp-text-light); }
.ikp-nav-sub { display: none; position: absolute; left: 100%; top: -4px; background: #fff; min-width: 260px; border-radius: 0 var(--ikp-radius) var(--ikp-radius) var(--ikp-radius); box-shadow: var(--ikp-shadow-lg); border: 1px solid var(--ikp-border); border-top: 2px solid var(--ikp-accent); z-index: 300; padding: 4px 0; }
.ikp-has-sub:hover > .ikp-nav-sub, .ikp-has-sub:focus-within > .ikp-nav-sub { display: block; }
.ikp-nav-sub a { display: block; padding: 9px 18px; font-size: 13px; color: var(--ikp-text); font-weight: 500; text-decoration: none; }
.ikp-nav-sub a:hover { background: var(--ikp-accent-light); color: var(--ikp-accent-text); }
.ikp-nav-sub-scroll { max-height: 360px; overflow-y: auto; }
.ikp-badge-17500 { background: var(--ikp-accent-aa); color: #fff; font-size: 10px; font-weight: 700; border-radius: 10px; padding: 1px 7px; margin-left: 6px; vertical-align: middle; white-space: nowrap; }
.ikp-nav-hamburger { display: none; background: none; border: none; font-size: 22px; color: var(--ikp-text); cursor: pointer; padding: 12px 18px; }
/* Pressville's own mobile toggle + mobile languages are redundant now (this nav
   has its own hamburger, and the top bar carries the EL/EN switch). Hide them. */
.header-mobile-toggle, .header-languages-mobile { display: none !important; }

@media (max-width: 991px) {
	/* Pressville hides #header__navgroup on mobile and reveals it via its own
	   mobile toggle (which we hide, since our nav has its own hamburger). Force the
	   navgroup visible so our nav bar + hamburger show on mobile. */
	#header__navgroup { display: block !important; height: auto !important; max-height: none !important; overflow: visible !important; }
	.ikp-nav .lsvr-container { justify-content: flex-start; }
	/* Full-width toggle: burger icon on the LEFT edge, "MENU" on the RIGHT edge;
	   the whole button opens the dropdown (owner request). */
	.ikp-nav-hamburger { display: flex; width: 100%; justify-content: space-between; align-items: center; padding: 12px 16px; }
	.ikp-nav-hamburger-label { font-size: 15px; font-weight: 700; letter-spacing: 0.5px; color: var(--ikp-text); }
	.ikp-nav-list { display: none; flex-direction: column; position: absolute; top: 100%; left: 0; right: 0; background: #fff; box-shadow: var(--ikp-shadow-lg); border-top: 1px solid var(--ikp-border); z-index: 300; max-height: 80vh; overflow-y: auto; }
	.ikp-nav-list.is-open { display: flex; }
	.ikp-nav-item { position: static; }
	.ikp-nav-link { padding: 14px 20px; border-bottom: 1px solid var(--ikp-border); font-size: 16px !important; }
	.ikp-nav-dropdown > a, .ikp-has-sub > a, .ikp-nav-sub a { font-size: 15px !important; }
	.ikp-nav-item.ikp-has-dd > .ikp-nav-link { display: flex; align-items: center; justify-content: space-between; }
	.ikp-nav-item.ikp-has-dd > .ikp-nav-link::after { content: '\f078'; font-family: 'Font Awesome 6 Free'; font-weight: 900; font-size: 10px; color: var(--ikp-text-light); transition: transform 0.2s; }
	.ikp-nav-item.is-expanded > .ikp-nav-link::after { transform: rotate(180deg); color: var(--ikp-accent); }
	.ikp-nav-dropdown { position: static; display: none; box-shadow: none; border: none; border-radius: 0; background: var(--ikp-accent-light); padding: 0; min-width: 0; }
	.ikp-nav-item:hover > .ikp-nav-dropdown, .ikp-nav-item:focus-within > .ikp-nav-dropdown { display: none; }
	.ikp-nav-item.is-expanded > .ikp-nav-dropdown { display: block; }
	.ikp-nav-dropdown > a, .ikp-has-sub > a { padding-left: 34px; }
	.ikp-nav-sub { position: static; display: none; box-shadow: none; border: none; border-radius: 0; min-width: 0; background: #e6f1f2; }
	.ikp-nav-sub a { padding-left: 48px; }
	.ikp-nav-sub-scroll { max-height: none; overflow-y: visible; }
	.ikp-has-sub:hover > .ikp-nav-sub, .ikp-has-sub:focus-within > .ikp-nav-sub { display: none; }
	.ikp-has-sub.is-expanded > .ikp-nav-sub { display: block; }
	.ikp-has-sub > a .sub-arrow { transition: transform 0.2s; }
	.ikp-has-sub.is-expanded > a .sub-arrow { transform: rotate(90deg); }
}

/* ═══ CLIENT EMAIL CHANGES 2026-07-16 (Χ. Στυλιανίδης, Δήμος Ιεροκηπίας) ═══════
   Ref: image006.jpg / image007.png. Reverts the teal top to a white top + dark-blue
   nav: (3) header + topbar WHITE, hero photo removed from the header; (4) navbar
   background #042D44 with white links; (5) virtual-tour frame white + subtle shadow.
   ROLLBACK = delete this whole block (or git revert this commit). */

/* (3) Topbar -> white, dark text, teal accents (like the reference) */
.header-topbar, .header-topbar__wrapper { background: #fff !important; }
.header-topbar__wrapper { border-bottom: 1px solid var(--ikp-border) !important; }
.header-topbar, .header-topbar a, .header-topbar__inner, .header-topbar__wrapper { color: var(--ikp-text) !important; }
.ikp-topbar-pay { background: transparent !important; color: var(--ikp-accent-text) !important; border: 1px solid var(--ikp-border) !important; }
.ikp-topbar-pay:hover { background: var(--ikp-accent-light) !important; color: var(--ikp-accent-text) !important; }
.ikp-topbar-follow { color: var(--ikp-text-light) !important; }
.ikp-topbar-social a { background: var(--ikp-accent-aa) !important; color: #fff !important; }
.ikp-topbar-social a:hover { background: var(--ikp-accent-text) !important; }
.ikp-lang-switch { border-color: var(--ikp-border) !important; }
.ikp-lang-btn { color: var(--ikp-text-light) !important; }
.ikp-lang-btn.is-active { background: var(--ikp-accent-aa) !important; color: #fff !important; }

/* (3) Header titlebar -> white, no photo, dark text, plain logo (no white circle) */
.header-titlebar { background: #fff !important; }
.header-titlebar::before { display: none !important; content: none !important; }
.header-titlebar__title, .header-titlebar__title-link { color: var(--ikp-accent-text) !important; text-shadow: none !important; }
.header-titlebar__description { color: var(--ikp-text-light) !important; text-shadow: none !important; }
.header-titlebar__logo-image { background: transparent !important; box-shadow: none !important; padding: 0 !important; border-radius: 0 !important; }

/* (4) Navbar -> dark blue #042D44, white top-level links (dropdown flyouts stay white) */
.ikp-nav { background: #042D44 !important; border-bottom: none !important; box-shadow: 0 2px 6px rgba(0,0,0,0.12) !important; }
.ikp-nav-link { color: #fff !important; }
.ikp-nav-link:hover { color: #fff !important; background: rgba(255,255,255,0.10) !important; }
.ikp-nav-link.is-active { color: #fff !important; border-bottom-color: #fff !important; }
.ikp-nav-hamburger, .ikp-nav-hamburger-label, .ikp-nav-hamburger i { color: #fff !important; }

/* (5) Virtual-tour frame -> clean white card, subtle shadow (ref image007) */
.ikp-tour-wrap { border: 1px solid #fff !important; box-shadow: 0 8px 30px rgba(0,0,0,0.08) !important; }
.ikp-tour-wrap::before { display: none !important; }

/* ═══ Virtual-tour click-to-play facade (no autoplay audio until visitor clicks) ═══ */
.ikp-tour-facade { position: relative; display: block; width: 100%; height: 450px; border: 0; padding: 0; cursor: pointer; border-radius: 8px; overflow: hidden; background: #1a6e7a url('https://ierokipia.org.cy/wp-content/uploads/2021/10/DJI_0382-2.webp') center/cover no-repeat; }
.ikp-tour-facade::after { content: ''; position: absolute; inset: 0; background: rgba(4,45,68,0.35); transition: background .2s; }
.ikp-tour-facade:hover::after { background: rgba(4,45,68,0.25); }
.ikp-tour-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 1; width: 78px; height: 78px; border-radius: 50%; background: rgba(255,255,255,0.94); color: var(--ikp-accent-text); display: flex; align-items: center; justify-content: center; font-size: 28px; padding-left: 6px; box-shadow: var(--ikp-shadow-lg); transition: transform .2s, background .2s; }
.ikp-tour-facade:hover .ikp-tour-play { background: #fff; transform: translate(-50%,-50%) scale(1.07); }
.ikp-tour-facade-label { position: absolute; bottom: 18px; left: 0; right: 0; z-index: 1; text-align: center; color: #fff; font-weight: 600; font-size: 15px; text-shadow: 0 1px 4px rgba(0,0,0,0.5); }