/* hz-catalogue.css — ιδιοκτησία agent catalogue (κατηγορίες, φίλτρα, αναζήτηση).
   Φορτώνεται από το common/header.twig αμέσως μετά το hz-commerce.css. */

/* «Καθαρισμός» κάτω από το «Εφαρμογή» στο πλαίσιο φίλτρων: χωρίς αυτό, για
   να βγει από τα φίλτρα ο πελάτης έπρεπε να ξετσεκάρει ένα-ένα και να πατήσει
   ξανά εφαρμογή. Σύνδεσμος (όχι δεύτερο κουμπί), ώστε να μη μοιάζει με την
   κύρια ενέργεια· 44px ύψος για το δάχτυλο. */
.hz-filter-clear{
  display:flex; align-items:center; justify-content:center; min-height:44px; margin-top:6px;
  font-size:13.5px; font-weight:700; color:var(--ink-soft); text-decoration:underline;
  text-underline-offset:3px }
.hz-filter-clear:hover,.hz-filter-clear:focus{ color:var(--flame) }

/* Το .btn του Bootstrap είναι nowrap· στη στενή στήλη του tablet/οριζόντιου
   κινητού (768–991px, στήλη ~124px) το «Περιορισμός αναζήτησης» κοβόταν. */
.hz-filter-apply{ white-space:normal; line-height:1.25; padding-top:10px; padding-bottom:10px }

/* ── Υποκατηγορίες στο κινητό: ΜΙΑ σειρά με πλάγια κύλιση ─────────────────
   Σε γονική κατηγορία («Συσκευασία Φαγητού», «Ανά επιχείρηση») τα κουμπιά
   τυλίγονταν σε 4–6 σειρές (200–300px) και το πρώτο προϊόν έπεφτε κάτω από
   την πρώτη οθόνη. Τώρα μία σειρά, από άκρη σε άκρη της οθόνης, χωρίς ορατή
   μπάρα· το ξεθώριασμα δεξιά δείχνει ότι συνεχίζει. Οι κανόνες βάσης
   (κουμπάκια 44px, display:contents στα ul) είναι στο hz-pages.css. */
@media (max-width:767px){
  #product-category .hz-refine{
    flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden;
    margin:0 -15px 14px; padding:0 0 0 15px;
    -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain; scrollbar-width:none;
    -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 36px), transparent);
            mask-image:linear-gradient(to right, #000 calc(100% - 36px), transparent) }
  #product-category .hz-refine::-webkit-scrollbar{ display:none }
  #product-category .hz-refine li{ flex:0 0 auto }
  #product-category .hz-refine li a{ white-space:nowrap }
  /* Κενό στο τέλος της σειράς: όταν κυλήσει ως το τέλος, το τελευταίο κουμπί
     βγαίνει έξω από το ξεθώριασμα (το padding-right σε flex με κύλιση το
     αγνοεί το Safari). */
  #product-category .hz-refine::after{ content:''; display:block; flex:0 0 36px; height:1px }

  /* Ο τίτλος ως μικρή ετικέτα (όπως οι ομάδες φίλτρων), όχι επικεφαλίδα 17px */
  #product-category .hz-refine-title{
    margin:0 0 8px; font-size:11px; font-weight:800; letter-spacing:.07em;
    text-transform:uppercase; color:var(--mut) }
}

/* ── Μακριά περιγραφή κατηγορίας στο κινητό: 2 γραμμές + «περισσότερα» ────
   Χωρίς JS: κρυφό κουτάκι που το ανοίγει η ετικέτα. Το αν θα κοπεί το
   αποφασίζει ο ελεγκτής (hz_intro_long), ώστε να μη βγαίνει «περισσότερα»
   κάτω από κείμενο που ήδη χωράει. Σε desktop: πάντα ολόκληρη. */
.hz-more-cb{ position:absolute; width:1px; height:1px; opacity:0; pointer-events:none }
.hz-more{ display:none }
@media (max-width:767px){
  .hz-clamp{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden }
  .hz-clamp > :last-child{ margin-bottom:0 }
  /* 44px στόχος αφής, αλλά με αρνητικά περιθώρια πιάνει ~24px οπτικά */
  .hz-more{
    display:inline-flex; align-items:center; min-height:44px; margin:-6px 0 -10px; padding:0;
    font-size:14px; font-weight:700; color:var(--flame); cursor:pointer;
    text-decoration:underline; text-underline-offset:3px }
  .hz-more-close{ display:none }
  .hz-more-cb:checked ~ .hz-intro-text .hz-clamp{ display:block; -webkit-line-clamp:unset; line-clamp:none; overflow:visible }
  .hz-more-cb:checked ~ .hz-intro-text .hz-more-open{ display:none }
  .hz-more-cb:checked ~ .hz-intro-text .hz-more-close{ display:inline }
  .hz-more-cb:focus-visible ~ .hz-intro-text .hz-more{ outline:2px solid var(--flame); outline-offset:2px }
}
