/* ============================================================
   Child Matters — Εργαλείο Προσβασιμότητας (Accessibility widget)
   Floating κουμπί + πάνελ με πλέγμα εικονιδίων. Οι κλάσεις μπαίνουν
   στο <html> από το js/accessibility.js· η προτίμηση του επισκέπτη
   αποθηκεύεται στο browser του (localStorage) και παραμένει ενεργή
   σε κάθε σελίδα. Δεν αλλάζει τίποτα στο υπάρχον style.css.
   ============================================================ */

/* ---- Floating toggle button ---- */
.cm-a11y-toggle{
  position:fixed; left:16px; bottom:16px; z-index:300;
  width:52px; height:52px; border-radius:50%;
  background:var(--teal-deep); color:#fff; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 24px -8px rgba(46,61,58,0.45);
  transition:transform .2s, background .2s;
}
.cm-a11y-toggle:hover{ background:var(--coral-deep); transform:translateY(-2px); }
.cm-a11y-toggle svg{ width:28px; height:28px; }
@media (max-width:760px){
  /* να μην κρύβεται πίσω από το sticky "Καλέστε μας τώρα" στο κινητό */
  .cm-a11y-toggle{ bottom:74px; transition:transform .2s, background .2s, bottom .25s ease; }
  /* όσο είναι ορατό το cookie banner, ανεβαίνει πιο ψηλά ώστε να μην επικαλύπτονται */
  html.cm-cookie-banner-visible .cm-a11y-toggle{ bottom:168px; }
}

/* ---- Panel ---- */
.cm-a11y-panel{
  position:fixed; left:16px; bottom:78px; z-index:300;
  width:min(336px, calc(100vw - 32px));
  background:#fff; border-radius:18px; padding:18px;
  box-shadow:0 20px 44px -16px rgba(46,61,58,0.4); border:1px solid var(--border-soft);
  font-family:'Mulish', sans-serif;
  max-height:min(70vh, calc(100vh - 110px)); overflow-y:auto;
}
@media (max-width:760px){ .cm-a11y-panel{ bottom:136px; } }
.cm-a11y-panel[hidden]{ display:none; }
.cm-a11y-panel-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.cm-a11y-panel-head .cm-a11y-panel-title{ font-size:16px; font-weight:800; margin:0; color:var(--teal-deep); font-family:'Varela Round', sans-serif; }
.cm-a11y-close{ background:none; border:none; cursor:pointer; font-size:22px; line-height:1; color:var(--ink-soft); padding:4px 8px; }
.cm-a11y-close:hover{ color:var(--coral-deep); }

/* ---- Μέγεθος γραμμάτων (stepper row) ---- */
.cm-a11y-row{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:4px 2px 14px; margin-bottom:10px; border-bottom:1px solid var(--border-soft);
}
.cm-a11y-row span{ font-size:13.5px; font-weight:800; color:var(--ink); }
.cm-a11y-btns{ display:flex; gap:4px; }
.cm-a11y-btns button{
  width:32px; height:32px; border-radius:8px; border:1.5px solid var(--border-soft);
  background:var(--cream); color:var(--ink); font-weight:800; font-size:13px; cursor:pointer;
}
.cm-a11y-btns button:hover{ background:var(--blush); }

/* ---- Πλέγμα επιλογών (icon tiles) ---- */
.cm-a11y-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:8px;
}
.cm-a11y-tile{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  padding:13px 6px; border-radius:14px; border:1.5px solid var(--border-soft);
  background:var(--cream); color:var(--ink); cursor:pointer; text-align:center;
  font-family:'Mulish', sans-serif; font-size:11.5px; font-weight:800; line-height:1.25;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.cm-a11y-tile:hover{ border-color:var(--teal); }
.cm-a11y-tile svg{ width:24px; height:24px; color:var(--teal-deep); }
.cm-a11y-tile .cm-a11y-tile-badge{
  width:24px; height:24px; display:flex; align-items:center; justify-content:center;
  font-family:'Varela Round', sans-serif; font-size:15px; font-weight:800; color:var(--teal-deep);
}
.cm-a11y-tile[aria-pressed="true"]{ background:var(--teal); border-color:var(--teal); color:#fff; }
.cm-a11y-tile[aria-pressed="true"] svg,
.cm-a11y-tile[aria-pressed="true"] .cm-a11y-tile-badge{ color:#fff; }

.cm-a11y-reset{
  margin-top:14px; width:100%; padding:10px; border-radius:999px; border:1.5px solid var(--border-soft);
  background:transparent; color:var(--ink-soft); font-weight:800; font-size:13px; cursor:pointer;
}
.cm-a11y-reset:hover{ background:var(--cream); }

/* ---- Λειτουργίες (toggle modes) ---- */
html.cm-a11y-contrast body,
html.cm-a11y-contrast *{ background-color:#000 !important; color:#fff !important; border-color:#fff !important; }
html.cm-a11y-contrast a,
html.cm-a11y-contrast a *{ color:#ffe066 !important; text-decoration:underline !important; }
html.cm-a11y-contrast img{ filter:grayscale(1) contrast(1.1); }
html.cm-a11y-contrast .cm-a11y-toggle,
html.cm-a11y-contrast .cm-a11y-panel{ background:#000 !important; border:2px solid #fff !important; }
html.cm-a11y-contrast .cm-a11y-btns button,
html.cm-a11y-contrast .cm-a11y-tile{ background:#111 !important; border-color:#fff !important; }

/* Ασπρόμαυρη λειτουργία + Κορεσμός εφαρμόζονται μαζί σε ένα combined
   filter μέσω JS (applyAll), όχι εδώ, ώστε να μη "σβήνουν" το ένα το
   άλλο όταν είναι ενεργά ταυτόχρονα (και τα δύο θα έγραφαν filter). */

html.cm-a11y-underline a{ text-decoration:underline !important; }

html.cm-a11y-pause-anim *,
html.cm-a11y-pause-anim *::before,
html.cm-a11y-pause-anim *::after{ animation:none !important; transition:none !important; }

html.cm-a11y-hide-images img{ display:none !important; }

html.cm-a11y-letter-spacing body,
html.cm-a11y-letter-spacing *{ letter-spacing:0.08em !important; word-spacing:0.12em !important; }

html.cm-a11y-line-height body,
html.cm-a11y-line-height p,
html.cm-a11y-line-height li,
html.cm-a11y-line-height h1,
html.cm-a11y-line-height h2,
html.cm-a11y-line-height h3,
html.cm-a11y-line-height h4{ line-height:2 !important; }

html.cm-a11y-dyslexia body,
html.cm-a11y-dyslexia *{ font-family:'Comic Sans MS','Comic Sans',sans-serif !important; }

html.cm-a11y-left-align body,
html.cm-a11y-left-align p,
html.cm-a11y-left-align li,
html.cm-a11y-left-align h1,
html.cm-a11y-left-align h2,
html.cm-a11y-left-align h3,
html.cm-a11y-left-align .section-head{ text-align:left !important; }

/* ---- Οδηγός ανάγνωσης (reading guide) ---- */
.cm-a11y-guide{
  position:fixed; left:0; right:0; height:40px; z-index:250;
  background:rgba(240,184,94,0.28); border-top:2px solid var(--gold); border-bottom:2px solid var(--gold);
  pointer-events:none; display:none;
}
html.cm-a11y-reading-guide .cm-a11y-guide{ display:block; }