/* =======================================================================
   ITHAGENEIA FLASHCARDS — Κεντρικό CSS
   -----------------------------------------------------------------------
   ΠΟΥ ΜΠΑΙΝΕΙ: σερβίρεται από το plugin local_ithassets ως
   /local/ithassets/assets/ithf-flashcards.css
   ΔΕΝ χρειάζεται πλέον στο Boost -> Raw SCSS. Αν έχει μείνει εκεί,
   ΑΦΑΙΡΕΣΕ ΤΟ (διπλοί κανόνες = δύσκολο debugging αργότερα).

   • Full-card 3D flip (γυρίζει ΟΛΗ η κάρτα: header + σώμα), καθαρό CSS.
   • Παλέτα ανά μάθημα — βάλε class στο .ithf-deck:
       ithf-geo=μπλε · ithf-ist=ώχρα · ithf-pol=πράσινο · ithf-thes=κόκκινο
   • Ο τίτλος μαθήματος γράφεται στο HTML (.ithf-subj) — όχι μέσω CSS.
   • Namespace: ithf-  (οι Οπτικές Σημειώσεις χρησιμοποιούν ithn- — δεν
     υπάρχει καμία επικάλυψη μεταξύ των δύο εργαλείων).
======================================================================= */
/* ---- Χρώμα ανά μάθημα (CSS variables) ---- */
.ithf-geo  {--ithf-head:#1B4F8C; --ithf-accent:#2E6FB7; --ithf-panel:#eef4fb;}
.ithf-ist  {--ithf-head:#8a5a08; --ithf-accent:#b07d12; --ithf-panel:#fbf3df;}
.ithf-pol  {--ithf-head:#1f7a44; --ithf-accent:#2e9d5b; --ithf-panel:#e9f6ee;}
.ithf-thes {--ithf-head:#b1303a; --ithf-accent:#c85059; --ithf-panel:#fdeef0;}
/* =======================  Η ΚΑΡΤΑ (γυρίζει ΟΛΟΚΛΗΡΗ)  =======================
   Auto-height: το ΥΨΟΣ το ορίζει η ΜΠΡΟΣΤΙΝΗ όψη (in-flow) — έτσι κάρτες με
   4 επιλογές μεγαλώνουν μόνες τους, ενώ απλές ερωτο-απαντήσεις μένουν μικρές.
   Η πίσω όψη είναι absolute και «κουμπώνει» στο ίδιο ύψος.
============================================================================= */
.ithf-card{
  display:inline-block;
  width:330px;
  margin:16px;
  perspective:1400px;
  cursor:pointer;
  vertical-align:top;
  font-family:Arial,Helvetica,sans-serif;
  -webkit-tap-highlight-color:transparent;
}
/* Κρυφό checkbox που κρατάει το state (γυρισμένη / όχι) */
.ithf-card .ithf-toggle{position:absolute;opacity:0;width:0;height:0;pointer-events:none;}
/* Ο κορμός που περιστρέφεται = ΟΛΗ η κάρτα */
.ithf-card .ithf-inner{
  display:block;
  position:relative;
  width:100%;
  transition:transform .6s;
  transform-style:preserve-3d;
}
.ithf-card .ithf-toggle:checked ~ .ithf-inner{transform:rotateY(180deg);}
/* Οι δύο όψεις = ολόκληρες κάρτες (header + σώμα).
   Σκιά ΣΤΙΣ όψεις (όχι border) ώστε να γυρίζει & να σβήνει φυσικά —
   χωρίς "τρίγωνο" στην κορυφή και χωρίς "φάντασμα" στη μέση του γυρίσματος. */
.ithf-card .ithf-face{
  display:flex;
  flex-direction:column;
  border-radius:16px;
  overflow:hidden;
  background:#fff;
  box-sizing:border-box;
  box-shadow:0 3px 12px rgba(0,0,0,.12);
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
}
/* Μπροστά = in-flow (ορίζει το ύψος). Το JS βάζει min-height = max(μπρος,πίσω)
   στην ενεργή κάρτα, ώστε η πίσω (absolute) όψη να μην κόβεται όταν έχει
   μεγαλύτερο κείμενο — χωρίς να αλλάζει η θέση της κάρτας στο flip. */
.ithf-card .ithf-front{position:relative;min-height:180px;}
.ithf-card .ithf-back{position:absolute;top:0;left:0;width:100%;height:100%;transform:rotateY(180deg);}
/* Header (ίδιος σε μπρος & πίσω): αριστερά ΘΕΜΑ x, δεξιά το μάθημα */
.ithf-card .ithf-head{
  flex:0 0 auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:11px 16px;
  color:#fff;
  background:var(--ithf-head,#1B4F8C);
}
.ithf-card .ithf-theme{font-size:15px;font-weight:bold;letter-spacing:.5px;}
.ithf-card .ithf-subj{font-size:12px;font-weight:bold;opacity:.92;letter-spacing:1px;}
/* Σώμα (γεμίζει το υπόλοιπο ύψος) */
.ithf-card .ithf-body{
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:16px;
  line-height:1.35;
}
/* Μπροστά = ΕΡΩΤΗΣΗ (λευκό, ουδέτερο) */
.ithf-card .ithf-front .ithf-body{background:#fff;color:#2c3e50;}
/* Πίσω = ΑΠΑΝΤΗΣΗ (απαλή απόχρωση μαθήματος) */
.ithf-card .ithf-back  .ithf-body{background:var(--ithf-panel,#eef4fb);color:var(--ithf-head,#1B4F8C);}
.ithf-card .ithf-hint{margin-top:12px;font-size:12px;font-weight:normal;color:#6b7a89;opacity:.9;}
/* ---- Τυπογραφία περιεχομένου ---- */
/* Εκφώνηση — aligned left (φαίνεται καλύτερα στις μεγάλες εκφωνήσεις) */
.ithf-card .ithf-stem{display:block;width:100%;text-align:left;font-size:16px;font-weight:bold;}
/* Σημείωση/alert (π.χ. "κληρώθηκε στην εξέταση") — μικρό κείμενο */
.ithf-card .ithf-note{display:block;width:100%;margin-top:12px;font-size:11px;line-height:1.35;background:#fff8e1;color:#8a6d3b;border:1px solid #f0e0a8;border-radius:6px;padding:6px 9px;text-align:left;box-sizing:border-box;}
/* ΣΩΣΤΟ = πράσινο, ΛΑΘΟΣ = κόκκινο (σταθερά σημασιολογικά) */
.ithf-card .ithf-true{color:#1f9d57;font-weight:bold;}
.ithf-card .ithf-false{color:#c0392b;font-weight:bold;}
/* Απλή ερώτηση/απάντηση (χωρίς επιλογές) */
.ithf-card .ithf-front .ithf-simple{font-size:18px;font-weight:bold;}
.ithf-card .ithf-back  .ithf-simple{font-size:21px;font-weight:bold;}
/* Λίστα επιλογών (πολλαπλής επιλογής / αντιστοίχισης) — FLEXBOX από spans.
   ΟΧΙ <table>: το Moodle (HTML purifier) βγάζει τα <table> έξω από τα <span>.
   1η στήλη = γράμμα/αριθμός σταθερού πλάτους, 2η στήλη = κείμενο με σωστό wrap. */
.ithf-card .ithf-opts{display:block;width:100%;margin-top:12px;text-align:left;}
.ithf-card .ithf-opt{display:flex;align-items:flex-start;font-size:14px;font-weight:normal;color:#2c3e50;padding:5px 0;}
.ithf-card .ithf-ol{flex:0 0 22px;font-weight:bold;}
.ithf-card .ithf-otext{flex:1 1 auto;}
/* Κείμενο ερωτήσεων συμπλήρωσης (cloze) */
.ithf-card .ithf-clozetext{display:block;width:100%;margin-top:12px;text-align:left;font-size:14px;font-weight:normal;color:#2c3e50;}
.ithf-card .ithf-back .ithf-clozetext{font-size:15px;}
/* Σωστή απάντηση (πίσω όψη) */
.ithf-card .ithf-correct{font-size:19px;font-weight:bold;}
.ithf-card .ithf-correct .ithf-letter{color:#1f9d57;}
/* Κενό σε ερωτήσεις συμπλήρωσης */
.ithf-card .ithf-blank{color:#b07d12;font-weight:bold;letter-spacing:1px;}
.ithf-card .ithf-fill{color:var(--ithf-head,#1B4F8C);font-weight:bold;}
/* Αντιστοίχιση (πίσω όψη) */
.ithf-card .ithf-pair{display:block;font-size:15px;font-weight:bold;padding:4px 0;}
.ithf-card .ithf-pair .ithf-arrow{color:#1f9d57;font-weight:bold;margin:0 6px;}
/* Ταξινόμηση σε στήλες (classify): κεφαλίδα κατηγορίας */
.ithf-card .ithf-pair .ithf-colh{color:#1f9d57;font-weight:bold;}
.ithf-card .ithf-back .ithf-pair{font-size:14px;line-height:1.4;}
/* Εικόνα κάρτας (ερωτήσεις με φωτογραφία/χάρτη). ΜΟΝΟ <span>+<img> — span-safe.
   max-height ώστε η κάρτα να μη γιγαντώνεται· object-fit:contain κρατά αναλογίες. */
.ithf-card .ithf-imgwrap{display:block;width:100%;margin:10px 0;text-align:center;}
.ithf-card .ithf-img{display:inline-block;max-width:100%;max-height:230px;
  border-radius:8px;border:1px solid #e0e6ee;object-fit:contain;
  background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.08);}
.ithf-card .ithf-back .ithf-img{max-height:180px;}
/* Εικόνες ως ΑΠΑΝΤΗΣΕΙΣ (multichoice με φωτο-επιλογές) & matching-εικόνων.
   Grid 2 στηλών από spans (span-safe). Σωστή = πράσινο περίγραμμα. */
.ithf-card .ithf-optimgs{display:flex;flex-wrap:wrap;gap:8px;width:100%;margin-top:12px;justify-content:center;}
.ithf-card .ithf-optimg{flex:0 0 46%;display:flex;flex-direction:column;align-items:center;
  font-size:13px;font-weight:bold;color:#2c3e50;}
.ithf-card .ithf-optimg img{max-width:100%;max-height:120px;margin-top:3px;border-radius:6px;
  border:1px solid #e0e6ee;object-fit:contain;background:#fff;}
.ithf-card .ithf-optimg.ithf-ok{color:#1f9d57;}
.ithf-card .ithf-optimg.ithf-ok img{border:2px solid #1f9d57;}
/* Τράπεζα λέξεων (ddwtos / gapselect) */
.ithf-card .ithf-bank{display:block;width:100%;margin:0 0 10px;font-size:12px;line-height:1.4;
  background:#eef4fb;color:#2c3e50;border:1px dashed #c5d6ea;border-radius:6px;padding:6px 9px;
  text-align:left;box-sizing:border-box;}
/* =======================================================================
   DECK — πολλές κάρτες με πλοήγηση (1 κάρτα τη φορά + prev/next + χάρτης)
   Χρειάζεται το ithf-flashcards.js (φορτώνεται κι αυτό από το plugin).
   Χωρίς JS: δείχνει όλες τις κάρτες στη σειρά.
======================================================================= */
.ithf-deck.ithf-js{
  display:flex;
  flex-wrap:wrap;
  gap:24px;
  align-items:flex-start;
  font-family:Arial,Helvetica,sans-serif;
}
.ithf-deck.ithf-js .ithf-stage{
  flex:1 1 320px;
  min-width:300px;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.ithf-deck.ithf-js .ithf-card{display:none;}
.ithf-deck.ithf-js .ithf-card.ithf-active{display:inline-block;}
/* Controls ΠΑΝΩ από την κάρτα (σταθερά — δεν ανεβοκατεβαίνουν με το ύψος) */
.ithf-controls{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 14px;
  flex-wrap:wrap;
  justify-content:center;
}
.ithf-btn{
  border:1px solid var(--ithf-head,#1B4F8C);
  background:#fff;
  color:var(--ithf-head,#1B4F8C);
  font-size:15px;
  font-weight:bold;
  border-radius:8px;
  padding:8px 14px;
  cursor:pointer;
  line-height:1;
  font-family:inherit;
}
.ithf-btn:hover{background:var(--ithf-panel,#eef4fb);}
.ithf-btn:disabled{opacity:.4;cursor:default;}
.ithf-counter{font-size:14px;color:var(--ithf-head,#1B4F8C);min-width:56px;text-align:center;}
/* Το flag μένει πορτοκαλί παντού (σταθερό σημασιολογικό χρώμα) */
.ithf-flag-btn.on{background:#e67e22;border-color:#e67e22;color:#fff;}
/* Map / χάρτης καρτών (στυλ σαν το Quiz navigation του Moodle) */
.ithf-map{
  flex:0 0 auto;
  width:186px;
  border:1px solid #d9e2ec;
  border-radius:10px;
  padding:12px;
  box-sizing:border-box;
}
.ithf-map-title{font-size:14px;font-weight:bold;color:var(--ithf-head,#1B4F8C);margin-bottom:9px;}
/* 5 τετραγωνάκια ανά γραμμή, μικρότερα, στενά margins */
.ithf-map-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;}
.ithf-map-btn{
  position:relative;
  width:100%;
  height:30px;
  border:1px solid var(--ithf-head,#1B4F8C);
  background:#fff;
  color:var(--ithf-head,#1B4F8C);
  border-radius:5px;
  font-size:12px;
  font-weight:bold;
  cursor:pointer;
  font-family:inherit;
  padding:0;
}
.ithf-map-btn:hover{background:var(--ithf-panel,#eef4fb);}
.ithf-map-btn.current{border-width:2px;background:var(--ithf-panel,#eef4fb);}
.ithf-map-btn.flagged::after{
  content:"";
  position:absolute;
  top:-3px;
  right:-3px;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#e67e22;
  border:2px solid #fff;
}
/* MOBILE: ο χάρτης πέφτει κάτω -> πλήρες πλάτος, κεντραρισμένος & στοιχισμένος
   με την κάρτα. Μεταβλητά τετραγωνάκια ανά γραμμή με βάση το πλάτος (auto-fit). */
@media (max-width: 640px){
  .ithf-deck.ithf-js{justify-content:center;}
  .ithf-map{width:100%;max-width:340px;}
  .ithf-map-title{text-align:center;}
  .ithf-map-grid{grid-template-columns:repeat(auto-fit,minmax(40px,1fr));gap:5px;}
}
/* ---- Κάρτες ΕΡΩΤΗΣΕΩΝ ΑΝΑΠΤΥΞΗΣ (open-ended / κείμενο ~50 λέξεις) ---- */
.ithf-essaycard .ithf-body{justify-content:flex-start;}
.ithf-essaycard .ithf-front{min-height:300px;}
.ithf-card .ithf-essaytag{display:inline-block;align-self:flex-start;margin-bottom:10px;
  font-size:10.5px;font-weight:bold;letter-spacing:.5px;text-transform:uppercase;
  background:var(--ithf-panel,#eef4fb);color:var(--ithf-head,#1B4F8C);
  border:1px solid var(--ithf-head,#1B4F8C);border-radius:6px;padding:3px 8px;}
.ithf-card .ithf-essayq{display:block;width:100%;text-align:left;font-size:15px;font-weight:bold;color:#2c3e50;}
.ithf-card .ithf-essay{display:block;width:100%;text-align:left;font-size:13.5px;font-weight:normal;
  line-height:1.5;max-height:100%;overflow:auto;}
/* ---- Κάρτες ΧΑΡΤΩΝ (ddimageortext): κενός χάρτης μπροστά, λύση πίσω ---- */
.ithf-mapcard{width:min(460px,92vw);}
.ithf-mapcard .ithf-front{min-height:560px;}
.ithf-mapcard .ithf-body{justify-content:flex-start;}
.ithf-mapcard .ithf-img.ithf-mapimg{max-height:430px;margin-top:8px;}
.ithf-mapcard .ithf-clozetext{font-size:14px;font-weight:bold;}