/* ┌───────────────────────────────────────────────────────────────────────
 * │ dot-menou-2026-08-18a.css
 * └───────────────────────────────────────────────────────────────────────
 * ΚΑΤΕΧΕΙ: το αναδυόμενο υπομενού της κεφαλίδας όταν έχει ΠΟΛΛΑ παιδιά
 *
 * ── ΤΙ ΒΡΕΘΗΚΕ (18/08/2026, μέτρηση σε πραγματικό browser) ────────────────
 * Οι «Εκτυπώσεις» στο κύριο μενού έδειχναν 11 από τις 17 υποκατηγορίες.
 * Οι υπόλοιπες 6 ζούσαν μόνο στο υποσέλιδο («ΑΝΑΚΑΛΥΨΤΕ») και στη σελίδα
 * της κατηγορίας. Μπήκαν και οι 6 στο μενού — και τότε φάνηκε το πρόβλημα:
 *
 *     ύψος υπομενού ........ 787 px   (ξεκινά στο y=211, τελειώνει στο 998)
 *     overflow-y ........... visible  (ΔΕΝ κυλάει — δεν υπάρχει μπάρα)
 *     κρυμμένα στοιχεία .... 2 στα 1440×900 · 4 στα 1366×768 · 5 στα 1280×720
 *
 * Και η κεφαλίδα είναι κολλητή: η κύλιση της σελίδας ΔΕΝ φέρνει τα κάτω
 * στοιχεία μέσα στην οθόνη — μετακινείται μαζί. Δηλαδή «Εκτύπωση σε ξύλινο
 * κύβο / σουβέρ / μολυβοθήκη» ήταν **απρόσιτα** σε κάθε φορητό υπολογιστή.
 *
 * ── Η ΔΙΟΡΘΩΣΗ: ΔΕΥΤΕΡΗ ΣΤΗΛΗ, ΟΧΙ ΜΠΑΡΑ ΚΥΛΙΣΗΣ ─────────────────────────
 * Τα <li> του θέματος είναι ήδη `display:inline-block; width:200px`. Άρα δεν
 * χρειάζεται `columns` ούτε flex: **αρκεί να πλατύνει το <ul>** και τα
 * στοιχεία αναδιπλώνονται μόνα τους σε δύο στήλες.
 *     232 px (μία στήλη) → 462 px = 30 padding + 2×200 + ανάσα
 * Ύψος μετά: ~450 px — χωράει και στα 1280×720.
 *
 * Μπάρα κύλισης μέσα σε μενού που ανοίγει με hover απορρίφθηκε: η ρόδα
 * κυλάει τη σελίδα από κάτω και το μενού κλείνει στο πρώτο κούνημα.
 *
 * ── 🔑 Ο ΚΑΝΟΝΑΣ ΑΥΤΟΑΚΥΡΩΝΕΤΑΙ ───────────────────────────────────────────
 * Η συνθήκη είναι «υπομενού με 13ο παιδί». Αν αύριο οι κατηγορίες πέσουν
 * κάτω από 13, το `:has(> li:nth-child(13))` ΠΑΥΕΙ να ταιριάζει και το μενού
 * γυρίζει μόνο του σε μία στήλη. Δεν χρειάζεται να το θυμηθεί κανείς.
 * Και δεν δένεται σε ID κατηγορίας: αν αύριο πληθύνουν οι «Κούπες», παίρνουν
 * την ίδια συμπεριφορά χωρίς νέα γραμμή.
 *
 * ⚠️ Σε φυλλομετρητή χωρίς `:has()` ο κανόνας αγνοείται και το μενού
 * ξαναγίνεται μονόστηλο — δηλαδή η χθεσινή κατάσταση, ποτέ κάτι χειρότερο.
 *
 * ⚠️ ΔΕΝ χρειάζεται media query, και ΔΕΝ αγγίζει το κινητό: το συρτάρι του κινητού
 * είναι **άλλο δέντρο**, `#mobile-navigation` (μετρήθηκε 18/08: το ίδιο υπομενού εκεί
 * βγαίνει 320 px πλάτος, δεξιά άκρη 330 σε οθόνη 412, `scrollWidth` = 412 — καμία
 * οριζόντια υπερχείλιση). Ο περιοριστής `#site-navigation` κάνει ήδη τη δουλειά ενός
 * `@media`: αν αύριο μπει media query με λάθος όριο, θα χαλάσει· η αγκύρωση στο
 * σωστό δέντρο δεν χαλάει.
 */

#site-navigation ul.sub-menu:has(> li:nth-child(13)) {
  width: 462px;
}

#site-navigation ul.sub-menu:has(> li:nth-child(13)) > li {
  vertical-align: top;
}
