/* ============================================================
   ΥΓΕΙΑ — μέθοδος «native» (θέμα 2.0, 06-Νοε-2026)

   Οι σελίδες είναι Elementor με κανονικά widgets και ΟΛΕΣ τις τιμές εμφάνισης στα πεδία τους.
   Εδώ ΜΟΝΟ ό,τι χρειάζεται το WordPress/Elementor για να βγαίνουν ίδιες με το static:
     1. μηδενισμοί (ο Elementor και ο browser βάζουν δικά τους περιθώρια)
     2. κινήσεις (εμφάνιση στο scroll, είσοδος του hero, βίντεο, παύση)
     3. ό,τι υπάρχει μόνο στο WordPress (φόρμα, μπάρα διαχείρισης)
   ΔΕΝ μπαίνει εδώ εμφάνιση στοιχείων σελίδας. Ό,τι δεν έχει πεδίο στον Elementor είναι στο residue.css
   (παράγεται από το build), πάνω σε κλάσεις yg-… των widgets.
   ============================================================ */

/* ── 1. Μηδενισμοί ─────────────────────────────────────────── */

/* Text Editor: η απόσταση ανάμεσα σε παραγράφους είναι το πεδίο «Paragraph spacing». Ο Elementor όμως το
   εφαρμόζει και στην ΤΕΛΕΥΤΑΙΑ παράγραφο (κενό κάτω από το κείμενο) — και ο browser βάζει δικό του margin. */
.elementor .elementor-widget-text-editor p { margin: 0; }
.elementor .elementor-widget-text-editor.elementor-element p:last-child { margin-block-end: 0; }

/* Heading με ετικέτα <span> (eyebrow, ετικέτες, ώρες): ο Elementor τον τυπώνει inline μέσα στο widget, άρα κάθεται σε
   «γραμμή κειμένου» με το ύψος γραμμής του σώματος (17px × 1.65) και αφήνει ~5px κενό από πάνω που δεν φαίνεται
   στα πεδία. Ως block, το widget έχει ακριβώς το ύψος του κειμένου του — και οι αποστάσεις είναι όσες λένε τα πεδία. */
.elementor-widget-heading .elementor-heading-title { display: block; }
/* Το ίδιο για την εικόνα (inline-block μέσα στο widget): χωρίς κενό γραμμής κάτω από μικρές εικόνες */
.elementor-widget-image { line-height: 0; }

/* Icon List: ο Elementor κάνει flex + πλάτος 100% ΚΑΘΕ σύνδεσμο μέσα σε γραμμή — σωστό όταν όλη η γραμμή είναι
   σύνδεσμος, λάθος για σύνδεσμο μέσα στο κείμενο («26510 21000 · 26510 21700» έσπαγε σε τρεις γραμμές). */
.elementor-widget .elementor-icon-list-item .elementor-icon-list-text a { display: inline; width: auto; }
/* …και αφήνει το εικονίδιο να ΣΥΡΡΙΚΝΩΘΕΙ όταν το κείμενο δίπλα είναι μεγάλο (η τελεία 6px έβγαινε 3.8px και το
   κείμενο 3–4px πιο αριστερά). Το εικονίδιο μένει στο μέγεθος του πεδίου «Size». */
.elementor-widget-icon-list .elementor-icon-list-icon { flex-shrink: 0; }

/* Το <main> του θέματος τυλίγει το περιεχόμενο του Elementor */
#main > .elementor { display: block; }

/* Κρυφό κείμενο για Google και αναγνώστες οθόνης (π.χ. «ΥΓΕΙΑ» στο H1 της αρχικής, δίπλα στο λογότυπο) */
.yg-sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* ── 2. Κινήσεις ───────────────────────────────────────────── */

/* Στον editor του Elementor δεν τρέχει το app.js: ό,τι μπαίνει με κίνηση φαίνεται από την αρχή */
html:not(.js) .rv, .elementor-editor-active .rv { opacity: 1 !important; transform: none !important; }
html:not(.js) .hx__fade, .elementor-editor-active .hx__fade { opacity: 1 !important; transform: none !important; animation: none !important; }

/* Hero της αρχικής: τα κείμενα μπαίνουν μετά το intro (το app.js βάζει «is-in» στο container) — όπως στο static.
   Failsafe: αν το JS δεν τρέξει, εμφανίζονται στα 4". Η καθυστέρηση κάθε κομματιού (--d) είναι στο residue.css. */
.js .yg-hx:not(.is-in) .hx__fade { opacity: 0; transform: translateY(14px); animation: hxShow 0s 4s forwards; }
.yg-hx.is-in .hx__fade { transition: opacity .9s ease var(--d, .3s), transform .9s cubic-bezier(.16, 1, .3, 1) var(--d, .3s); }
@keyframes hxShow { to { opacity: 1; transform: none; } }
/* Στο κινητό η μπάρα μπαίνει μόνο με opacity, όπως στο static: με transform θα γινόταν containing block και η παύση
   (absolute πάνω δεξιά στο hero) θα εμφανιζόταν πάνω στις καρτέλες μέχρι να τελειώσει η είσοδος */
@media (max-width: 760px) { .js .yg-hx:not(.is-in) .hx__bar { transform: none; } }
@keyframes hxNudge { 0%, 100% { transform: translateY(-2px); } 50% { transform: translateY(3px); } }

/* Hero με βίντεο (αρχική + σελίδες κέντρων): το βίντεο εμφανίζεται μόλις αρχίσει να παίζει· ως τότε φαίνεται η
   εικόνα «fallback» του container (= το πρώτο καρέ του βίντεο). Το φορτώνει το assets/js/hero.js. */
[data-yg-video] .elementor-background-video-hosted { opacity: 0; transition: opacity .7s ease; }
[data-yg-video].is-playing .elementor-background-video-hosted { opacity: 1; }

/* Παύση / συνέχεια: το εικονίδιο του κουμπιού έχει και τα δύο σχήματα */
.is-paused #hx-pause .i-play, .is-paused #phero-pause .i-play { display: inline; }
.is-paused #hx-pause .i-pause, .is-paused #phero-pause .i-pause { display: none; }

@media (prefers-reduced-motion: reduce) {
  .yg-hx.is-in .hx__fade { transition: none; }
  #hx-down .elementor-button-icon svg { animation: none; }
  [data-yg-video] .elementor-background-video-hosted { transition: none; }
}

/* ── 3. Μόνο στο WordPress ─────────────────────────────────── */

/* Φόρμα «Αίτημα ραντεβού» ([ygeia_contact_form]) */
.yg-hp { display: none; }      /* παγίδα για bots — έχει και το attribute «hidden» */
.form__status { margin: 1rem 0 0; padding: .8rem 1rem; border-radius: var(--r-sm); font-size: .95rem; font-weight: 500; }
.form__status--ok { background: var(--blue-050); border: 1px solid var(--blue-100); color: var(--blue-900); }
.form__status--err { background: #fdf1f0; border: 1px solid #f1c9c5; color: var(--red-600); }
.yg-form.is-sending button[type="submit"] { opacity: .6; pointer-events: none; }
/* το shortcode δεν προσθέτει δικό του κουτί */
.elementor-widget-shortcode .elementor-shortcode > .yg-form { margin: 0; }

/* Δίχτυ ασφαλείας: αν το Astra τυπώσει το κουμπί «πάνω» παρά το φίλτρο στο functions.php */
#ast-scroll-top { display: none !important; }

/* Η μπάρα διαχείρισης του WordPress (μόνο για συνδεδεμένους) σπρώχνει το κολλημένο header. */
body.admin-bar .header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .header { top: 46px; } }
