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

/* ══ 1. Ειδοποίηση καλαθιού (js/hz.js) ════════════════════════════════════
   Αντί για το μήνυμα του common.js στην κορυφή της σελίδας — που για να φανεί
   ανέβαζε τη σελίδα στο 0 και ο πελάτης έχανε τη θέση του στη λίστα. Fixed στο
   κάτω μέρος: δεν σπρώχνει περιεχόμενο. Κανένα άλλο fixed στοιχείο δεν κάθεται
   εκεί (μετρημένο με το mshot σε κατηγορία, αναζήτηση, προϊόν, καλάθι). */
.hz-toast-wrap{
  position:fixed; left:12px; right:12px; bottom:calc(12px + env(safe-area-inset-bottom, 0px));
  z-index:1070; display:flex; justify-content:center; pointer-events:none }
.hz-toast{
  pointer-events:auto; position:relative; width:100%; max-width:440px;
  display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:10px;
  padding:14px 46px 14px 14px; background:var(--raise); color:var(--ink);
  border:1px solid var(--line); border-left:4px solid #2E7D32; border-radius:var(--radius);
  box-shadow:0 18px 40px -12px rgba(26,20,15,.45), 0 2px 6px rgba(26,20,15,.12);
  animation:hz-toast-in .18s ease-out }
.hz-toast.is-err{ border-left-color:var(--flame) }
.hz-toast-ic{ font-size:20px; line-height:21px; color:#2E7D32 }
.hz-toast.is-err .hz-toast-ic{ color:var(--flame) }
.hz-toast-msg{ margin:0; font-size:15px; line-height:1.4; overflow-wrap:anywhere }
.hz-toast-msg a{ color:inherit; text-decoration:underline }
/* τα κουμπιά πιάνουν και τη ζώνη του ✕ (το padding-right του κουτιού είναι γι' αυτό) */
.hz-toast-acts{ grid-column:1 / 3; display:flex; flex-wrap:wrap; gap:8px; margin:12px -32px 0 0 }
.hz-toast-acts .btn{
  flex:1 1 auto; min-height:44px; display:inline-flex; align-items:center; justify-content:center;
  padding:6px 14px; font-weight:700; white-space:normal; line-height:1.2 }
.hz-toast-x{
  position:absolute; top:2px; right:2px; width:44px; height:44px; padding:0;
  border:0; background:none; font-size:26px; line-height:1; color:var(--mut) }
.hz-toast-x:hover,.hz-toast-x:focus{ color:var(--ink) }
@keyframes hz-toast-in{ from{ transform:translateY(12px); opacity:0 } to{ transform:none; opacity:1 } }
@media (prefers-reduced-motion:reduce){ .hz-toast{ animation:none } }
@media (min-width:768px){
  .hz-toast-wrap{ left:auto; right:24px; bottom:24px; width:420px } }

/* ══ 2. Κουμπί καλαθιού στην κεφαλίδα (≥768px) ═══════════════════════════
   «3 προϊόντα» από πάνω, «97.50€ χωρίς ΦΠΑ» από κάτω (common/cart/hzLabel).
   Σε μία γραμμή, το «12 προϊόντα - 430.78€» ήδη κοβόταν στα 820px, και τώρα
   το κείμενο είναι μακρύτερο. Η τελεία ανάμεσα μένει για αναγνώστες οθόνης. */
@media (min-width:768px){
  #cart > .btn{
    height:auto; min-height:44px; display:flex; align-items:center; justify-content:center; gap:10px;
    padding:4px 12px; white-space:normal; text-align:left; line-height:1.15 }
  #cart-total{ display:flex; flex-direction:column; min-width:0 }
  #cart-total .hz-ct-sep{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0) }
  #cart-total .hz-ct-n{ font-size:14px; font-weight:800 }
  #cart-total .hz-ct-sum{ font-size:13px; font-weight:700; white-space:nowrap }
  #cart-total .hz-ct-sum small{ font-size:11px; font-weight:600; opacity:.75 }
}
#cart.is-busy > .btn{ opacity:.7 }

/* ══ 3. Καλάθι: γραμμές πάνω από το απόθεμα ══════════════════════════════
   Η σημείωση κάτω από την ποσότητα λέει πόσα υπάρχουν και έχει κουμπί
   «Αλλαγή σε N». Πριν: ένα «***» δίπλα στο όνομα. */
.hz-line-note{
  margin-top:8px; padding:8px 10px; border-radius:8px; background:#FDECE8; color:#8A2414;
  font-size:13.5px; line-height:1.4; white-space:normal; text-align:left }
.hz-line-note a{ color:inherit; font-weight:700; text-decoration:underline }
.hz-line-note .hz-line-fix{
  display:flex; width:100%; margin-top:8px; min-height:44px; align-items:center; justify-content:center;
  font-weight:700; white-space:normal }
/* Ολοκλήρωση μπλοκαρισμένη: εξήγηση πάνω από τα κουμπιά, και το κουμπί σε
   ουδέτερο χρώμα — δεν οδηγεί στο ταμείο αλλά στην πρώτη γραμμή προς διόρθωση. */
.hz-co-block{
  margin:0 0 14px; padding:12px 14px; border:1px solid #F0BDB3; border-radius:var(--radius);
  background:#FDF3F1; color:#8A2414; font-weight:600; line-height:1.45 }
.hz-co-block a{ color:inherit; text-decoration:underline }
.btn-primary.hz-co-blocked,.btn-primary.hz-co-blocked:hover,.btn-primary.hz-co-blocked:focus{
  background:var(--cream); border-color:var(--line); color:var(--ink-soft) }
@media (max-width:767px){
  /* η γραμμή με σημείωση ψηλώνει· το σύνολο μένει δίπλα στην ποσότητα, όχι στη μέση */
  .hz-cart tr.is-short .hz-c-total{ align-self:start }
}

/* ══ 4. Καλάθι σε tablet και υπολογιστή (≥768px) ═════════════════════════
   Ποσότητα + ↻ + ✕ ήταν input-group του Bootstrap (display:table, πεδίο 100%,
   max-width 200px inline). Στα 768–991 η στήλη είναι ~150px: η ομάδα ξεχείλιζε
   32px πάνω στην «Τιμή μονάδας» και την έκρυβε. Με flex το πεδίο στενεύει και τα
   κουμπιά μένουν 44px. */
@media (min-width:768px){
  .hz-cart .hz-c-qty .input-group{ display:flex; width:100%; max-width:220px !important }
  .hz-cart .hz-c-qty .input-group .form-control{
    flex:1 1 auto; width:auto; min-width:48px; float:none; text-align:center; font-weight:700 }
  .hz-cart .hz-c-qty .input-group-btn{ display:flex; width:auto; flex:none }
  .hz-cart .hz-c-qty .input-group-btn .btn{ width:44px; min-width:44px; padding:0; margin:0 }
  .hz-cart .hz-c-qty .input-group-btn .btn:last-child{ border-radius:0 8px 8px 0 }
  /* η σημείωση να μη φουσκώνει τη στήλη της ποσότητας σε όλο το πλάτος */
  .hz-cart .hz-line-note{ max-width:260px }
}
