/* ============================================================
   ΓΕΦΥΡΑ Elementor -> static CSS  (φορτώνει ΠΡΙΝ από το site.css)

   Το Elementor JSON του site «καθρεφτίζει» το DOM του static:
     .yg-m   container που αντιστοιχεί σε πραγματικό στοιχείο του static
             (ίδιες κλάσεις, ίδιο id, ίδιο tag)
     .yg-t   περιτύλιγμα widget — στο static ΔΕΝ υπάρχει

   Σειρά ισχύος (specificity), από το πιο αδύναμο:
     1. Elementor        .e-con.e-flex { … }              (0,2,0)
     2. αυτό το αρχείο   body .e-con.yg-m { … }           (0,2,1)   <- μηδενίζει το 1
     3. site.css         body.yg .hcs { … }               (0,2,1)+  <- μετά στη σειρά, κερδίζει το 2
     4. ρυθμίσεις που κάνει κάποιος στο panel του Elementor   (0,3,0)+  <- κερδίζουν όλα

   Γι' αυτό το site.css έχει μπροστά από ΚΑΘΕ επιλογέα το «body.yg» (το βάζει το build).
   ============================================================ */

/* Ένα container του Elementor έρχεται με flex, padding 10px, gap 20px, width 100%,
   position relative κ.ά. Ένα <div>/<section> του static δεν έχει τίποτα από αυτά:
   τα γυρνάμε στις αρχικές τιμές της CSS και το site.css βάζει μόνο ό,τι θέλει. */
body .e-con.yg-m {
  display: block;
  position: static;
  width: auto; max-width: none; min-width: auto;
  height: auto; min-height: 0;
  margin: 0; padding: 0;
  gap: normal;
  flex: 0 1 auto; flex-direction: row; flex-wrap: nowrap;
  align-items: normal; align-content: normal; justify-content: normal; align-self: auto; order: 0;
  border-radius: 0; z-index: auto; overflow: visible;
  text-align: inherit;
  transition: none;
}
body .e-con.yg-m:where(a) { display: inline; }         /* το <a> είναι inline από τη φύση του· το :where κρατά την ισχύ
                                                           στο (0,2,1), ώστε το site.css (.dcard__img { display: grid }) να κερδίζει */
/* Το ::before του container είναι η «επικάλυψη φόντου» του Elementor. Δεν τη χρησιμοποιούμε·
   αν το site.css θέλει ::before σε κάποιο κουτί, πρέπει να το βρει καθαρό. */
body .e-con.yg-m::before { all: unset; }

/* Το περιτύλιγμα κάθε widget «δεν υπάρχει» για το layout: τα παιδιά του συμπεριφέρονται
   σαν παιδιά του γονέα του (κελιά grid, στοιχεία flex), όπως στο static. */
body .elementor-widget.yg-t,
body .yg-t > .elementor-widget-container,
body .yg-t > .elementor-shortcode,
body .yg-t > .elementor-widget-container > .elementor-shortcode { display: contents; }

/* Το περιτύλιγμα δεν έχει κουτί, αλλά ό,τι ΚΛΗΡΟΝΟΜΕΙΤΑΙ περνά στα παιδιά του.
   Το image widget βάζει text-align:center· το static δεν έχει τέτοιο πράγμα. */
body .elementor-widget.yg-t { text-align: inherit; }
/* Ο Elementor δίνει σε κάθε iframe/video line-height:1 και width:100%. */
/* (0,1,2): πάνω από το «.elementor video» του Elementor, κάτω από το «body.yg .hx__video» του site.css */
html body .elementor :where(.yg-t iframe, .yg-t video) { line-height: inherit; max-width: none; width: auto; }

/* ΜΕΣΑ ΣΤΟΝ EDITOR το περιτύλιγμα μένει διάφανο — αλλιώς ο editor θα έδειχνε άλλη διάταξη από το site
   (με κουτί, οι διαφάνειες του hero μαζεύονταν σε 12px και οι κάρτες έχαναν το ύψος τους).
   Το τίμημα: ο Elementor δεν έχει κουτί για να ζωγραφίσει το πλαίσιο επιλογής και τη λαβή.
   Το πλαίσιο το ζωγραφίζουμε εδώ, πάνω στο ίδιο το περιεχόμενο· η επιλογή γίνεται με κλικ στο
   περιεχόμενο ή από το Structure (Navigator). */
body.elementor-editor-active .yg-t .elementor-text-editor,
body.elementor-editor-active .yg-t .elementor-inline-editing { display: contents; white-space: normal; }
body.elementor-editor-active .yg-t .elementor-text-editor::after { content: none; }
body.elementor-editor-active .yg-t > .elementor-element-overlay { display: none; }
body.elementor-editor-active:not(.elementor-editor-preview) .yg-t:hover > :not(.elementor-element-overlay),
body.elementor-editor-active:not(.elementor-editor-preview) .yg-t:hover > .elementor-text-editor > * { outline: 1px dashed #c26bd6; outline-offset: 2px; }
body.elementor-editor-active:not(.elementor-editor-preview) .yg-t.elementor-element-editable > :not(.elementor-element-overlay),
body.elementor-editor-active:not(.elementor-editor-preview) .yg-t.elementor-element-editable > .elementor-text-editor > * { outline: 2px solid #c26bd6; outline-offset: 2px; }