/* =========================================================
   myGasztro – NAPLÓ / CUSTOM CSS
   Állapot: kommentelt, blokkosított munkaverzió

   FONTOS SZABÁLYOK:
   - Egy funkció = egy aktív blokk
   - Diagnosztikai (DIAG) blokk mindig külön menjen, ne keverjük ide vissza véglegesnek
   - HTML-hez nem nyúlunk, ez tisztán design layer / skin réteg
   - A selectorokhoz csak indokolt esetben nyúlunk, hogy fejlesztői módosítás után
     gyorsan visszakereshető maradjon minden

   GYORS TÉRKÉP:
   01. Havi nézet – mobil + tablet rács és cellák
   02. Havi nézet – summary panel hézagzárás
   03. Havi nézet – fejléc ikoncsere (felső)
   04. Havi nézet – KPI tipó / egységek / desktop finomhangolás
   05. Havi nézet – felső és alsó PNG ikonrendszer
   06. Havi nézet – alsó navigáció (balra / ma / jobbra)
   ========================================================= */

/* =========================================================
   MYG — DIARY MONTHLY — MOBILE + TABLET FINOMHANGOLÁS
   Célok:
   - Hétfő ne legyen keskenyebb (week-num oszlop kezelése)
   - Dátum mindig ugyanott legyen (üres + has-data)
   - Mood emoji ne legyen pötty, legyen egy szintben a dátummal
   - Tablet: magasabb cellák (jöhet böjt)
   - Finomabb, szolidabb tipó (kcal ne félkövér)
   ========================================================= */


/* ---------------------------------------------------------
   1) Mobilon (és csak mobilon) full-width breakout
   --------------------------------------------------------- */
@media (max-width: 768px){
  #myg-diary-app{
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
    box-sizing: border-box !important;
  }

  #myg-diary-app .myg-diary-monthly{
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: #ffffff !important;
  }
}


/* ---------------------------------------------------------
   2) Mobil + Tablet közös: rács + cella layout fix
      (a kritikus rész: WEEK-NUM oszlop következetes kezelése)
   --------------------------------------------------------- */
@media (max-width: 1024px){

  /* === A) WEEK-NUM (#) oszlop: mobil/tablet alatt REJTJÜK ===
     Ha rejtjük, akkor a grid-template is 7 oszlop legyen!
     Ettől szűnik meg a “Hétfő keskenyebb” jelenség. */
  #myg-diary-app .myg-diary-week-num{
    display: none !important;
  }

 #myg-diary-app .myg-diary-weekdays{
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  gap: 0 !important;
  border-radius: 12px 12px 0 0 !important;
  overflow: hidden !important;
}

#myg-diary-app .myg-diary-grid{
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  gap: 0 !important;
  background: transparent !important;
  border: 1px solid rgba(0,0,0,0.10) !important;
  border-top: 0 !important;
  border-radius: 0 0 12px 12px !important;
  overflow: hidden !important;
}

  /* === B) Weekday fejléc cellák (H,K,Sze...) === */
  #myg-diary-app .myg-diary-weekday{
    padding: 8px 4px !important;
    margin: 0 !important;
    border: 1px solid rgba(0,0,0,0.10) !important;
    border-left: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    text-align: center !important;
    font-weight: 600 !important;
    font-size: 12px !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }

  /* === C) Nap cellák: “kártya OFF”, rácsos megjelenés === */
  #myg-diary-app .myg-diary-day{
    position: relative !important;
    margin: 0 !important;
    padding: 6px 4px !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: #fff !important;

    border-left: 0 !important;
    border-top: 0 !important;
    border-right: 1px solid rgba(0,0,0,0.10) !important;
    border-bottom: 1px solid rgba(0,0,0,0.10) !important;

    overflow: hidden !important;
  }

  #myg-diary-app .myg-diary-day--empty{
    background: #fff !important;
  }

 /* === D) Fix magasságok: mobil oké, tablet magasabb (jöhet böjt) === */

/* Mobil alap – FONTOS: üres napok is kapjanak fix magasságot */
#myg-diary-app .myg-diary-day,
#myg-diary-app .myg-diary-day--empty,
#myg-diary-app .myg-diary-day--has-data{
  box-sizing: border-box !important;
  height: 116px !important;      /* FIX mobil magasság + böjt ráhagyás */
  min-height: 116px !important;  /* biztos ami biztos */
}

/* Tablet – ugyanígy az üreseket is */
@media (min-width: 769px) and (max-width: 1024px){
  #myg-diary-app .myg-diary-day,
  #myg-diary-app .myg-diary-day--empty,
  #myg-diary-app .myg-diary-day--has-data{
    height: 136px !important;      /* FIX tablet magasság + böjt ráhagyás */
    min-height: 136px !important;
  }

  /* Tablet: nap szám + mood picit nagyobb */
  #myg-diary-app .myg-diary-day__number{
    font-size: 18px !important;
    line-height: 18px !important;
  }

  #myg-diary-app .myg-diary-day__mood{
    width: 20px !important;
    height: 20px !important;
  }

  #myg-diary-app .myg-diary-day__mood img.emoji{
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    max-width: 20px !important;
    max-height: 20px !important;
    display: block !important;
  }
}


    /* ---------------------------------------------------------
     3) Dátum + Mood: ugyanazon a “felső sávon”, mindig ugyanott
        - Dátum bal-fent absolute
        - Mood jobb-fent absolute
        - A tartalom kap “top padding”-et, hogy ne másszon fel
     --------------------------------------------------------- */

  /* felső sáv magassága */
  #myg-diary-app .myg-diary-day{
    padding-top: 26px !important; /* korábban 22px – több levegő a smiley és a KPI-k között */
  }

  /* Dátum mindig ugyanoda */
  #myg-diary-app .myg-diary-day__number{
    position: absolute !important;
    top: 6px !important;
    left: 6px !important;
    margin: 0 !important;

    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 600 !important;
    opacity: 0.92 !important;
  }

  /* Mood mindig ugyanoda (NE pötty) */
  #myg-diary-app .myg-diary-day__mood{
    position: absolute !important;
    top: 6px !important;
    right: 6px !important;

    width: 13px !important;
    height: 13px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    line-height: 1 !important;
    margin: 0 !important;
  }

  #myg-diary-app .myg-diary-day__mood img.emoji{
    width: 13px !important;
    height: 13px !important;
    min-width: 13px !important;
    min-height: 13px !important;
    max-width: 13px !important;
    max-height: 13px !important;

    display: block !important;
    vertical-align: top !important;
  }


  /* ---------------------------------------------------------
     4) Kcal / súly (és később böjt): szolid, kisebb, ne félkövér
     --------------------------------------------------------- */

  #myg-diary-app .myg-diary-day__kcal,
  #myg-diary-app .myg-diary-day__weight,
  #myg-diary-app .myg-diary-day__fast{
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 2px !important;
    margin-top: 4px !important;
    line-height: 1 !important;
  }

  #myg-diary-app .myg-diary-day__icon img.emoji{
    width: 14px !important;
    height: 14px !important;
    display: block !important;
  }

  /* értékek finomabbak, kcal se legyen félkövér */
  #myg-diary-app .myg-diary-day__value{
    font-size: 11px !important;
    line-height: 1.05 !important;
    font-weight: 500 !important; /* <-- szolidabb */
    text-align: center !important;
    white-space: nowrap !important;
    opacity: 0.92 !important;
  }

  /* Mai nap: maradjon a keret, de kulturált */
  #myg-diary-app .myg-diary-day--today{
    outline: 2px solid rgba(255,140,0,0.70) !important;
    outline-offset: -2px !important;
  }

  /* Summary szélesség */
  #myg-diary-app .myg-diary-summary{
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* ===== END MYG DIARY MONTHLY MOBILE+TABLET ===== */

/* =========================================================
   MYG — DIARY MONTHLY — SUMMARY PANEL HÉZAGZÁRÁS
   Cél:
   - a naptár alja és az átlagértékek panel között ne maradjon “tapéta”
   - kizárólag spacinget húzunk össze, működéshez nem nyúlunk

   Itt tudsz később játszani:
   - .myg-diary-grid margin-bottom
   - .myg-diary-summary margin-top / padding-top
   ========================================================= */

#myg-diary-app .myg-diary-grid{
  margin-bottom: 0 !important;
}

#myg-diary-app .myg-diary-summary{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

#myg-diary-app .myg-diary-monthly{
  gap: 0 !important;
  row-gap: 0 !important;
}



/* =========================================================
   myGasztro – Napló fejléc ikoncsere (MINDEN eszközön)
   Quick add: "Gyors étkezés" PNG
   Stats: "Statisztikák" PNG
   ========================================================= */

/* Biztonság: csak a napló appon belül */
#myg-diary-app .myg-diary-header__quick-add,
#myg-diary-app .myg-diary-header__stats-btn{
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1 !important;
}

/* A belső fejlesztői ikon span (myg-icon) ne szóljon bele */
#myg-diary-app .myg-diary-header__quick-add .myg-icon,
#myg-diary-app .myg-diary-header__stats-btn .myg-icon{
  display: none !important;
}

/* A "Hozzáadás" felirat eltüntetése (de a gomb marad kattintható) */
#myg-diary-app .myg-diary-header__quick-add{
  font-size: 0 !important;          /* elrejti a szöveget */
  color: transparent !important;
}

/* Közös ikon-gomb méret (minden eszközön) */
#myg-diary-app .myg-diary-header__quick-add,
#myg-diary-app .myg-diary-header__stats-btn{
  width: 44px !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 12px !important;   /* ha kell “kártyás” */
}

/* Quick add = gyors étkezés ikon */
#myg-diary-app .myg-diary-header__quick-add{
  background-image: url("/wp-content/uploads/gyors-etkezes.png") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 28px 28px !important;
}

/* Stats = statisztikák ikon */
#myg-diary-app .myg-diary-header__stats-btn{
  background-image: url("/wp-content/uploads/statisztikak.png") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 28px 28px !important;
}

/* Hover/active finomság gépen (nem kötelező, de kulturált) */
@media (hover: hover){
  #myg-diary-app .myg-diary-header__quick-add:hover,
  #myg-diary-app .myg-diary-header__stats-btn:hover{
    transform: translateY(-1px) !important;
  }
  #myg-diary-app .myg-diary-header__quick-add:active,
  #myg-diary-app .myg-diary-header__stats-btn:active{
    transform: translateY(0) !important;
  }
}

/************************************************************
 * MYG HEADER ICON SWAP (balra / jobbra / ma) – PNG + NO BOX
 * Cél:
 * - csak ikoncsere (balra/jobbra/ma)
 * - a gomb doboza ne látszódjon (nincs fehér háttér, nincs shadow)
 * - NEM nyúlunk a gomb méretéhez/paddingjához/pozíciójához
 ************************************************************/

/* 1) NAV gombok (balra / jobbra) – belső emoji/img elrejtése */
#myg-diary-app .myg-diary-header__nav-btn img.emoji,
#myg-diary-app .myg-diary-header__nav-btn svg{
  display: none !important;
}

/* 2) NAV gombok – doboz OFF + háttér ikon */
#myg-diary-app .myg-diary-header__nav-btn{
  background-color: transparent !important;
  box-shadow: none !important;
  border: 0 !important;

  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
}

/* Előző (balra) */
#myg-diary-app .myg-diary-header__nav-btn[data-action="prev-month"]{
  background-image: url("https://mygasztro.hu/wp-content/uploads/balra.png") !important;
}

/* Következő (jobbra) */
#myg-diary-app .myg-diary-header__nav-btn[data-action="next-month"]{
  background-image: url("https://mygasztro.hu/wp-content/uploads/jobbra.png") !important;
}

/* 3) MA gomb – felirat OFF + doboz OFF + háttér ikon */
#myg-diary-app .myg-diary-header__today-btn{
  /* doboz OFF */
  background-color: transparent !important;
  box-shadow: none !important;
  border: 0 !important;

  /* ikon */
  background-image: url("https://mygasztro.hu/wp-content/uploads/ma.png") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;

  /* felirat ne látszódjon, de gomb marad */
  color: transparent !important;
  text-shadow: none !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
  line-height: 0 !important;
}

/* ha van belső span a MA gombban, az se látszódjon */
#myg-diary-app .myg-diary-header__today-btn span{
  display: none !important;
}


/************************************************************
 * MYG DAY CELL – ICON OFF + UNIT LABELS (kcal / kg / böjt)
 * FIX:
 * - kg "g" ne vágódjon le
 * - kcal/weight/fasting számok tipója/színe egységes legyen
 * - KPI-k ne csússzanak fel, ha nincs kcal
 ************************************************************/

/* 1) Ikonok teljes kikapcsolása (ne maradjon üres hely) */
#myg-diary-app .myg-diary-day__kcal .myg-diary-day__icon,
#myg-diary-app .myg-diary-day__weight .myg-diary-day__icon,
#myg-diary-app .myg-diary-day__fasting .myg-diary-day__icon{
  display: none !important;
}

/* Biztonság: ha emoji/img/pseudo maradna, az is OFF */
#myg-diary-app .myg-diary-day__kcal .myg-diary-day__icon img.emoji,
#myg-diary-app .myg-diary-day__weight .myg-diary-day__icon img.emoji,
#myg-diary-app .myg-diary-day__fasting .myg-diary-day__icon img.emoji{
  display: none !important;
}

#myg-diary-app .myg-diary-day__kcal .myg-diary-day__icon::before,
#myg-diary-app .myg-diary-day__weight .myg-diary-day__icon::before,
#myg-diary-app .myg-diary-day__fasting .myg-diary-day__icon::before{
  content: none !important;
  display: none !important;
}

/* EXTRA: ha bármi okból az emoji nem a .myg-diary-day__icon alá esne */
#myg-diary-app .myg-diary-day__fasting img.emoji,
#myg-diary-app .myg-diary-day__fasting .emoji{
  display: none !important;
}

/* 2) KPI blokkok: FIX pozíció (ne csússzon fel a súly, ha nincs kcal) */
#myg-diary-app .myg-diary-day{
  /* KPI „rács” pozíciók – EZEK ADJÁK A LEVEGŐT / TÁVOLSÁGOT */
  --myg-kpi-top-kcal: 26px;     /* smiley alatt */
  --myg-kpi-top-weight: 56px;   /* kcal -> súly köz */
  --myg-kpi-top-fasting: 86px;  /* súly -> böjt köz */
}

/* A 3 KPI blokk ABSZOLÚT helyre kerül */
#myg-diary-app .myg-diary-day__kcal,
#myg-diary-app .myg-diary-day__weight,
#myg-diary-app .myg-diary-day__fasting{
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;

  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;

  gap: 0px !important;
  margin-top: 0 !important;
  line-height: 1 !important;

  width: 100% !important;
  pointer-events: none !important;
}

/* Konkrét függőleges pozíciók */
#myg-diary-app .myg-diary-day__kcal{ top: var(--myg-kpi-top-kcal) !important; }
#myg-diary-app .myg-diary-day__weight{ top: var(--myg-kpi-top-weight) !important; }
#myg-diary-app .myg-diary-day__fasting{ top: var(--myg-kpi-top-fasting) !important; }

/* 3) ÉRTÉK tipó – EGYSÉGES (ettől lesz a kcal is ugyanolyan “levegős”) */
#myg-diary-app .myg-diary-day__kcal .myg-diary-day__value,
#myg-diary-app .myg-diary-day__weight .myg-diary-day__value,
#myg-diary-app .myg-diary-day__fasting .myg-diary-day__value{
  font-size: 12px !important;
  line-height: 1.05 !important;
  font-weight: 600 !important;
  text-align: center !important;
  white-space: nowrap !important;

  /* EGYSÉGES szín mindháromnál */
  color: rgba(0,0,0,0.55) !important;

  /* az “eltérő számkép” érzést ez szokta megoldani */
  font-variant-numeric: tabular-nums !important;
  font-feature-settings: "tnum" 1 !important;

  font-family: inherit !important;
  letter-spacing: 0 !important;

  position: relative !important;

  /* hely az egységnek – szoros, de biztonságos */
  padding-bottom: 3px !important;

  overflow: visible !important;
}

/* 4) Mértékegység az érték alá – CSS-ből generálva (FONTOS: content kell!) */
#myg-diary-app .myg-diary-day__kcal .myg-diary-day__value::after{
  content: "kcal" !important;
}
#myg-diary-app .myg-diary-day__weight .myg-diary-day__value::after{
  content: "kg" !important;
}
#myg-diary-app .myg-diary-day__fasting .myg-diary-day__value::after{
  content: "böjt" !important;
}

#myg-diary-app .myg-diary-day__kcal .myg-diary-day__value::after,
#myg-diary-app .myg-diary-day__weight .myg-diary-day__value::after,
#myg-diary-app .myg-diary-day__fasting .myg-diary-day__value::after{
  display: block !important;

  /* picit “feljebb zár” a számhoz (ahogy kérted), de csak icipicit */
  margin-top: -1px !important;

  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: 0.2px !important;

  /* világosabb szürke a feliratokhoz */
  color: rgba(0,0,0,0.42) !important;

  /* kg "g" alja ne vágódjon le */
  line-height: 1.22 !important;
  padding-bottom: 2px !important;

  text-align: center !important;
  overflow: visible !important;
}

/* 5) Tablet finomhangolás */
@media (min-width: 769px) and (max-width: 1024px){
  #myg-diary-app .myg-diary-day{
    --myg-kpi-top-kcal: 30px;
    --myg-kpi-top-weight: 64px;
    --myg-kpi-top-fasting: 98px;
  }

  #myg-diary-app .myg-diary-day__kcal .myg-diary-day__value,
  #myg-diary-app .myg-diary-day__weight .myg-diary-day__value,
  #myg-diary-app .myg-diary-day__fasting .myg-diary-day__value{
    font-size: 13px !important;
    padding-bottom: 7px !important;
  }

  #myg-diary-app .myg-diary-day__kcal .myg-diary-day__value::after,
  #myg-diary-app .myg-diary-day__weight .myg-diary-day__value::after,
  #myg-diary-app .myg-diary-day__fasting .myg-diary-day__value::after{
    font-size: 11px !important;
    margin-top: 2px !important;
    line-height: 1.2 !important;
    padding-bottom: 1px !important;
  }
}


/* =========================================================
   04) HAVI NÉZET — DESKTOP LAYOUT ÉS KPI FINOMHANGOLÁS
   ========================================================= */

/* =========================================================
   MYG — DIARY MONTHLY — DESKTOP (1025px+)
   Cél:
   - naptár szélesebb, kényelmesebb
   - PC-n is grid, fix cellamagasság
   - böjt ne lógjon le
   - mobil/tablet érintetlen
   ========================================================= */
@media (min-width: 1025px){

  /* 1) Konténer: szélesebb naptár a nagy hely kihasználására */
  #myg-diary-app{
    max-width: 1280px !important;     /* ha kell: 1200–1440 között játszhatsz */
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
    box-sizing: border-box !important;
  }

    /* 2) Hónap blokk: desktop oldalsó belső keret
     Cél:
     - a felső havi ikonok (profil / stat / menü)
     - és az alsó havi ikonok (gyors étkezés / recept)
       ne csússzanak ki a képernyő sarkaiba
     - úgy üljenek beljebb, mint a napi nézetben
  */
 #myg-diary-app .myg-diary-monthly{
  width: 100% !important;
  max-width: 100% !important;
}

  /* 3) Week-num (#) oszlop PC-n maradhat – fix szélesség, hogy ne nyomja össze a hétfőt */
  #myg-diary-app .myg-diary-week-num{
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 52px !important;
    min-width: 52px !important;
    font-size: 12px !important;
    opacity: 0.55 !important;
    background: #fff !important;
    border-right: 1px solid rgba(0,0,0,0.10) !important;
  }

  /* 4) Weekdays + rács: PC-n is grid, 8 oszlop (# + 7 nap) */
  #myg-diary-app .myg-diary-weekdays{
    display: grid !important;
    grid-template-columns: 52px repeat(7, minmax(0, 1fr)) !important;
    gap: 0 !important;
  }

  #myg-diary-app .myg-diary-grid{
    display: grid !important;
    grid-template-columns: 52px repeat(7, minmax(0, 1fr)) !important;
    gap: 0 !important;
    background: transparent !important;
    border: 1px solid rgba(0,0,0,0.10) !important;
    border-top: 0 !important;
  }

  /* 5) Weekday fejléc cellák: picit nagyobb PC-n */
  #myg-diary-app .myg-diary-weekday{
    padding: 10px 6px !important;
    margin: 0 !important;
    border: 1px solid rgba(0,0,0,0.10) !important;
    border-left: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    text-align: center !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }

  /* 6) Nap cellák: PC-n magasabb, hogy a KPI-k fixen elférjenek (böjt se lógjon) */
  #myg-diary-app .myg-diary-day,
  #myg-diary-app .myg-diary-day--empty,
  #myg-diary-app .myg-diary-day--has-data{
    height: 160px !important;       /* ha kell: 150–180 */
    min-height: 160px !important;
    padding: 10px 8px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  /* 7) Felső sáv (dátum+mood) – PC-n picit kényelmesebb */
  #myg-diary-app .myg-diary-day{
    padding-top: 30px !important; /* több levegő a smiley és KPI között */
  }

  #myg-diary-app .myg-diary-day__number{
    top: 8px !important;
    left: 8px !important;
    font-size: 14px !important;
  }

  #myg-diary-app .myg-diary-day__mood{
    top: 8px !important;
    right: 8px !important;
    width: 14px !important;
    height: 14px !important;
  }

  #myg-diary-app .myg-diary-day__mood img.emoji{
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    min-height: 14px !important;
    max-width: 14px !important;
    max-height: 14px !important;
  }

  /* 8) KPI pozíciók PC-n: lejjebb + nagyobb cellához igazítva */
  #myg-diary-app .myg-diary-day{
    --myg-kpi-top-kcal: 34px;
    --myg-kpi-top-weight: 76px;
    --myg-kpi-top-fasting: 118px;
  }

  /* 9) KPI tipó PC-n: picit nagyobb, de ugyanaz a stíl */
  #myg-diary-app .myg-diary-day__kcal .myg-diary-day__value,
  #myg-diary-app .myg-diary-day__weight .myg-diary-day__value,
  #myg-diary-app .myg-diary-day__fasting .myg-diary-day__value{
    font-size: 13px !important;
    line-height: 1.08 !important;
    padding-bottom: 4px !important;
  }

  #myg-diary-app .myg-diary-day__kcal .myg-diary-day__value::after,
  #myg-diary-app .myg-diary-day__weight .myg-diary-day__value::after,
  #myg-diary-app .myg-diary-day__fasting .myg-diary-day__value::after{
    font-size: 11px !important;
    line-height: 1.22 !important;
    padding-bottom: 2px !important;
  }
}

/* === E) DESKTOP: nap szám + mood fix felül (mobil/tablet érintetlen) === */
@media (min-width: 1025px){

  /* biztos alap: a cellán belüli abszolút elemek ehhez igazodjanak */
  #myg-diary-app .myg-diary-day{
    position: relative !important;

    /* picit több levegő a smiley alatt */
    --myg-kpi-top-kcal: 38px;
    --myg-kpi-top-weight: 80px;
    --myg-kpi-top-fasting: 122px;
  }

  /* nap szám: legyen nagyobb, de NE legyen vaskos */
  #myg-diary-app .myg-diary-day__number{
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;

    font-size: 20px !important;
    line-height: 22px !important;

    font-weight: 500 !important;

    font-variant-numeric: tabular-nums !important;
    font-feature-settings: "tnum" 1 !important;

    margin: 0 !important;
    padding: 0 !important;
    z-index: 5 !important;
  }

  /* mood: fix jobb felső sarok */
  #myg-diary-app .myg-diary-day__mood{
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;

    width: 22px !important;
    height: 22px !important;

    margin: 0 !important;
    padding: 0 !important;
    z-index: 5 !important;
  }

  #myg-diary-app .myg-diary-day__mood img.emoji{
    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;
    min-height: 22px !important;
    max-width: 22px !important;
    max-height: 22px !important;

    display: block !important;
  }

  /* KPI értékek (kcal / súly / böjt) picit nagyobb desktopon */
  #myg-diary-app .myg-diary-day__kcal .myg-diary-day__value,
  #myg-diary-app .myg-diary-day__weight .myg-diary-day__value,
  #myg-diary-app .myg-diary-day__fasting .myg-diary-day__value{
    font-size: 15px !important;
    line-height: 1.1 !important;
  }

  /* KPI feliratok (kcal / kg / böjt) picit nagyobb */
  #myg-diary-app .myg-diary-day__kcal .myg-diary-day__value::after,
  #myg-diary-app .myg-diary-day__weight .myg-diary-day__value::after,
  #myg-diary-app .myg-diary-day__fasting .myg-diary-day__value::after{
    font-size: 12px !important;
    margin-top: 2px !important;
    line-height: 1.2 !important;
  }

}



/* =========================================================
   05) HAVI NÉZET — SAJÁT PNG IKONOK (FELSŐ / ALSÓ IKONCSALÁD)
   ========================================================= */

/* =========================================================
   MYG — DIARY MONTHLY — TOP ICONS (PNG ICONS)
   Cél:
   - A havi nézet felső/alsó ikon-gombjai a saját PNG ikonokat kapják
     (profil / statisztika / gyors-étkezés / recept feltöltés / navi)
   - Az eredeti inline SVG / emoji / icon-layer ne látszódjon
   - Ne legyen kék “fátyol”/focus highlight
   - Legyen finom kattintás-animáció (ne ragadjon fent)
   ========================================================= */

#myg-diary-app .myg-diary-monthly__icon-btn{
  background-color: transparent !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;

  /* saját ikon a gomb hátterén */
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;

  /* ne legyen “doboz” hatás */
  border-radius: 0 !important;

  /* kék tap/focus jelzés OFF */
  outline: none !important;
  -webkit-tap-highlight-color: transparent !important;

  /* anim */
  transition: transform 120ms ease, filter 120ms ease !important;
  transform: translateZ(0) !important;
}

/* kattintáskor mozduljon, de azonnal vissza is álljon */
#myg-diary-app .myg-diary-monthly__icon-btn:active{
  transform: translateY(2px) scale(0.96) !important;
  filter: brightness(0.98) !important;
}

/* fókusz/active overlayk OFF (kék fátyol jellegű cuccok) */
#myg-diary-app .myg-diary-monthly__icon-btn:focus,
#myg-diary-app .myg-diary-monthly__icon-btn:focus-visible{
  outline: none !important;
  box-shadow: none !important;
}

/* A gombban lévő bármilyen SVG/emoji/img ne látszódjon */
#myg-diary-app .myg-diary-monthly__icon-btn svg,
#myg-diary-app .myg-diary-monthly__icon-btn img,
#myg-diary-app .myg-diary-monthly__icon-btn img.emoji{
  display: none !important;
}

/* Plugin pseudo-elemmel is rajzolhat ikont -> OFF */
#myg-diary-app .myg-diary-monthly__icon-btn::before,
#myg-diary-app .myg-diary-monthly__icon-btn::after{
  content: none !important;
  display: none !important;
  background: none !important;
}

/* --- PROFIL --- */
#myg-diary-app .myg-diary-monthly__icon-btn[aria-label*="Profil"],
#myg-diary-app .myg-diary-monthly__icon-btn[title*="Profil"],
#myg-diary-app .myg-diary-monthly__icon-btn[data-action="profile"],
#myg-diary-app .myg-diary-monthly__icon-btn--profile{
  background-image: url("https://mygasztro.hu/wp-content/uploads/profil.png") !important;
}

/* --- STATISZTIKA --- */
#myg-diary-app .myg-diary-monthly__icon-btn[aria-label*="Statis"],
#myg-diary-app .myg-diary-monthly__icon-btn[title*="Statis"],
#myg-diary-app .myg-diary-monthly__icon-btn[data-action="stats"],
#myg-diary-app .myg-diary-monthly__icon-btn--stats{
  background-image: url("https://mygasztro.hu/wp-content/uploads/statisztikak.png") !important;
}

/* --- GYORS ÉTKEZÉS --- */
#myg-diary-app .myg-diary-monthly__icon-btn[aria-label*="Gyors"],
#myg-diary-app .myg-diary-monthly__icon-btn[title*="Gyors"],
#myg-diary-app .myg-diary-monthly__icon-btn[data-action="quick-add"],
#myg-diary-app .myg-diary-monthly__icon-btn--quick-add{
  background-image: url("https://mygasztro.hu/wp-content/uploads/gyors-etkezes.png") !important;
}

/* --- RECEPT FELTÖLTÉS --- */
#myg-diary-app .myg-diary-monthly__icon-btn[aria-label*="Recept"],
#myg-diary-app .myg-diary-monthly__icon-btn[aria-label*="Feltölt"],
#myg-diary-app .myg-diary-monthly__icon-btn[title*="Recept"],
#myg-diary-app .myg-diary-monthly__icon-btn[title*="Feltölt"],
#myg-diary-app .myg-diary-monthly__icon-btn[data-action="upload-recipe"],
#myg-diary-app .myg-diary-monthly__icon-btn--upload-recipe{
  background-image: url("https://mygasztro.hu/wp-content/uploads/recept-feltoltes.png") !important;
}

/* --- NAVI / MENÜ (majd lesz navi.png) --- */
#myg-diary-app .myg-diary-monthly__icon-btn[aria-label*="Menü"],
#myg-diary-app .myg-diary-monthly__icon-btn[aria-label*="Navi"],
#myg-diary-app .myg-diary-monthly__icon-btn[aria-label*="Navig"],
#myg-diary-app .myg-diary-monthly__icon-btn[title*="Menü"],
#myg-diary-app .myg-diary-monthly__icon-btn[title*="Navi"],
#myg-diary-app .myg-diary-monthly__icon-btn[title*="Navig"],
#myg-diary-app .myg-diary-monthly__icon-btn[data-action="menu"],
#myg-diary-app .myg-diary-monthly__icon-btn--menu{
  background-image: url("https://mygasztro.hu/wp-content/uploads/navi.png") !important;
}


/* =========================================================
   06) HAVI NÉZET — ALSÓ NAVIGÁCIÓ (BALRA / MA / JOBBRA)
   ========================================================= */

/* =========================================================
   MYG — DIARY MONTHLY — BOTTOM NAV (prev / today / next) – PNG + NO BOX
   + SPACING (ne legyenek túl közel)
   + NO BLUE TAP HIGHLIGHT / FOCUS FLASH
   Cél:
   - havi nézet alsó sáv: bal/jobb nyíl + MA saját PNG
   - doboz ne látszódjon
   - gombok legyenek távolabb egymástól (desktop + mobil)
   - kattintáskor ne villanjon kék fátyol
   ========================================================= */

/* --- alap: doboz OFF + ikon háttér + tap-highlight OFF --- */
#myg-diary-app .myg-diary-monthly__nav-btn,
#myg-diary-app .myg-diary-monthly__today-btn,
#myg-diary-app .myg-diary-monthly__today,
#myg-diary-app button[data-action="today"]{
  background-color: transparent !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;

  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;

  /* kék villanás ellen (mobil + desktop fókusz) */
  -webkit-tap-highlight-color: transparent !important;
  outline: none !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  touch-action: manipulation !important;
}

/* kattintás/fókusz alatt se kapjon kék hátteret / keretet */
#myg-diary-app .myg-diary-monthly__nav-btn:focus,
#myg-diary-app .myg-diary-monthly__nav-btn:active,
#myg-diary-app .myg-diary-monthly__today-btn:focus,
#myg-diary-app .myg-diary-monthly__today-btn:active,
#myg-diary-app .myg-diary-monthly__today:focus,
#myg-diary-app .myg-diary-monthly__today:active,
#myg-diary-app button[data-action="today"]:focus,
#myg-diary-app button[data-action="today"]:active{
  outline: none !important;
  box-shadow: none !important;
  background-color: transparent !important;
}

/* --- belső ikonrétegek OFF (hogy a plugin kék ne üljön rá) --- */
#myg-diary-app .myg-diary-monthly__nav-btn img.emoji,
#myg-diary-app .myg-diary-monthly__nav-btn svg{
  display: none !important;
}

#myg-diary-app .myg-diary-monthly__nav-btn::before,
#myg-diary-app .myg-diary-monthly__nav-btn::after{
  content: none !important;
  display: none !important;
  background: none !important;
}

/* --- PREV / NEXT PNG --- */
#myg-diary-app .myg-diary-monthly__nav-btn[aria-label*="Előző"],
#myg-diary-app .myg-diary-monthly__nav-btn[aria-label*="Previous"],
#myg-diary-app .myg-diary-monthly__nav-btn[title*="Előző"],
#myg-diary-app .myg-diary-monthly__nav-btn[data-action="prev-month"]{
  background-image: url("https://mygasztro.hu/wp-content/uploads/balra.png") !important;
}

#myg-diary-app .myg-diary-monthly__nav-btn[aria-label*="Következő"],
#myg-diary-app .myg-diary-monthly__nav-btn[aria-label*="Next"],
#myg-diary-app .myg-diary-monthly__nav-btn[title*="Következő"],
#myg-diary-app .myg-diary-monthly__nav-btn[data-action="next-month"]{
  background-image: url("https://mygasztro.hu/wp-content/uploads/jobbra.png") !important;
}

/* --- MA PNG --- */
#myg-diary-app .myg-diary-monthly__today-btn,
#myg-diary-app .myg-diary-monthly__today,
#myg-diary-app button[data-action="today"],
#myg-diary-app button[aria-label="Ma"],
#myg-diary-app button[title="Ma"]{
  background-image: url("https://mygasztro.hu/wp-content/uploads/ma.png") !important;

  /* felirat ne látszódjon, de gomb marad */
  color: transparent !important;
  text-shadow: none !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
  line-height: 0 !important;
}

#myg-diary-app .myg-diary-monthly__today-btn span,
#myg-diary-app button[data-action="today"] span{
  display: none !important;
}

/* =========================================================
   SPACING: húzzuk szét a három gombot (desktop + mobil)
   Nem nyúlunk a layout-hoz, csak margót adunk a nyilaknak.
   ========================================================= */
#myg-diary-app .myg-diary-monthly__nav-btn{
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* prev menjen picit balra (távolodjon a MA-tól) */
#myg-diary-app .myg-diary-monthly__nav-btn[aria-label*="Előző"],
#myg-diary-app .myg-diary-monthly__nav-btn[aria-label*="Previous"],
#myg-diary-app .myg-diary-monthly__nav-btn[title*="Előző"],
#myg-diary-app .myg-diary-monthly__nav-btn[data-action="prev-month"]{
  margin-right: clamp(10px, 2.2vw, 22px) !important;
}

/* next menjen picit jobbra (távolodjon a MA-tól) */
#myg-diary-app .myg-diary-monthly__nav-btn[aria-label*="Következő"],
#myg-diary-app .myg-diary-monthly__nav-btn[aria-label*="Next"],
#myg-diary-app .myg-diary-monthly__nav-btn[title*="Következő"],
#myg-diary-app .myg-diary-monthly__nav-btn[data-action="next-month"]{
  margin-left: clamp(10px, 2.2vw, 22px) !important;
}

/* =========================================================
   MYG — DIARY MONTHLY — SUMMARY PANEL (TELJES ÚJRAÍRT VERZIÓ)
   Cél:
   - kompaktabb, prémiumabb havi összegző panel
   - középre igazított, finom fejléc: "Havi átlagértékek:"
   - 2 sor / 3 oszlop
   - minden cellában külön felirat + érték
   - fehér háttér
   - finom belső elválasztók
   - HTML módosítás nélkül, csak CSS-sel

   FONTOS:
   - az előző summary panel blokkot érdemes kivenni / kikommentelni
   - ez a blokk menjen a fájl legvégére
   ========================================================= */


/* --- 1) Külső panel --- */
#myg-diary-app .myg-diary-summary{
  position: relative;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(2, auto);
  gap: 0 !important;

  margin-top: 0 !important;
  padding: 44px 0 0 !important;   /* felül hely a fejlécnek */
  background: #fdfdfc !important; /* közel fehér, a naptárhoz igazodva */
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 12px;
  box-sizing: border-box;
  overflow: hidden;
}


/* --- 2) Fejléc: Havi átlagértékek: --- */
#myg-diary-app .myg-diary-summary::before{
  content: "Havi átlagértékek:";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 40px;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 15px;
  font-weight: 500;
  color: #8f8f8f;
  letter-spacing: 0;

  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  box-sizing: border-box;
  pointer-events: none;
  background: transparent;
}


/* --- 3) Egy cella --- */
#myg-diary-app .myg-diary-summary__item{
  position: relative;
  min-width: 0;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  text-align: center;
  box-sizing: border-box;

  padding: 12px 8px 10px;
  min-height: 82px;
}


/* --- 4) Belső elválasztók ---
   Függőleges vonalak: csak az 1. és 2. oszlop után
   Vízszintes vonal: az első sor alatt
   --------------------------------------------------------- */
#myg-diary-app .myg-diary-summary__item:nth-child(1),
#myg-diary-app .myg-diary-summary__item:nth-child(2),
#myg-diary-app .myg-diary-summary__item:nth-child(4),
#myg-diary-app .myg-diary-summary__item:nth-child(5){
  border-right: 1px solid rgba(0, 0, 0, 0.08);
}

#myg-diary-app .myg-diary-summary__item:nth-child(1),
#myg-diary-app .myg-diary-summary__item:nth-child(6),
#myg-diary-app .myg-diary-summary__item:nth-child(5){
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}


/* --- 5) Alap label / value viselkedés --- */
#myg-diary-app .myg-diary-summary__label,
#myg-diary-app .myg-diary-summary__value{
  display: block;
  width: 100%;
  text-align: center;
  box-sizing: border-box;
}


/* --- 6) A VALÓDI feliratok visszahozása
   Nem áttetszős trükközés, hanem normál módon ráírjuk a kívánt szöveget.
   Az eredeti HTML feliratot vizuálisan elrejtjük, és stabil pszeudo-elemmel
   kirajzoljuk a helyes feliratot.
   --------------------------------------------------------- */
#myg-diary-app .myg-diary-summary__label{
  position: relative;
  visibility: hidden;
  min-height: 1.25em;
  margin-bottom: 6px;
}

#myg-diary-app .myg-diary-summary__label::after{
  position: absolute;
  inset: 0;
  visibility: visible;
  color: #9a9a9a;
  font: inherit;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


/* --- 7) Feliratok szövegei --- */
#myg-diary-app .myg-diary-summary__item:nth-child(1) .myg-diary-summary__label::after{
  content: "Kalória";
}

#myg-diary-app .myg-diary-summary__item:nth-child(6) .myg-diary-summary__label::after{
  content: "Testsúly";
}

#myg-diary-app .myg-diary-summary__item:nth-child(5) .myg-diary-summary__label::after{
  content: "Böjt idő";
}

#myg-diary-app .myg-diary-summary__item:nth-child(3) .myg-diary-summary__label::after{
  content: "Szénhidrát";
}

#myg-diary-app .myg-diary-summary__item:nth-child(2) .myg-diary-summary__label::after{
  content: "Fehérje";
}

#myg-diary-app .myg-diary-summary__item:nth-child(4) .myg-diary-summary__label::after{
  content: "Zsír";
}


/* --- 8) Értékek ---
   Itt nem növeljük túl a tipót, csak kicsit stabilizáljuk.
   --------------------------------------------------------- */
#myg-diary-app .myg-diary-summary__value{
  white-space: nowrap;
  line-height: 1.2;
}


/* --- 9) Új vizuális sorrend ---
   felső sor: Kalória / Testsúly / Böjt idő
   alsó sor: Szénhidrát / Fehérje / Zsír
   --------------------------------------------------------- */
#myg-diary-app .myg-diary-summary__item:nth-child(1){ order: 1; } /* Kalória */
#myg-diary-app .myg-diary-summary__item:nth-child(6){ order: 2; } /* Testsúly */
#myg-diary-app .myg-diary-summary__item:nth-child(5){ order: 3; } /* Böjt idő */

#myg-diary-app .myg-diary-summary__item:nth-child(3){ order: 4; } /* Szénhidrát */
#myg-diary-app .myg-diary-summary__item:nth-child(2){ order: 5; } /* Fehérje */
#myg-diary-app .myg-diary-summary__item:nth-child(4){ order: 6; } /* Zsír */


/* --- 10) Az elválasztókat az ÚJ sorrendhez igazítjuk ---
   Mivel vizuális sorrendet order-rel csinálunk, az nth-child továbbra is az
   eredeti DOM sorrend szerint működik. Ezért itt külön kezeljük a border logikát.
   --------------------------------------------------------- */

/* előző border-ek nullázása biztosra */
#myg-diary-app .myg-diary-summary__item{
  border-right: none;
  border-bottom: none;
}

/* felső sor vizuális 1-2 eleme: Kalória (1), Testsúly (6) */
#myg-diary-app .myg-diary-summary__item:nth-child(1),
#myg-diary-app .myg-diary-summary__item:nth-child(6){
  border-right: 1px solid rgba(0, 0, 0, 0.08);
}

/* alsó sor vizuális 1-2 eleme: Szénhidrát (3), Fehérje (2) */
#myg-diary-app .myg-diary-summary__item:nth-child(3),
#myg-diary-app .myg-diary-summary__item:nth-child(2){
  border-right: 1px solid rgba(0, 0, 0, 0.08);
}

/* felső sor teljes alja: Kalória (1), Testsúly (6), Böjt idő (5) */
#myg-diary-app .myg-diary-summary__item:nth-child(1),
#myg-diary-app .myg-diary-summary__item:nth-child(6),
#myg-diary-app .myg-diary-summary__item:nth-child(5){
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}


/* --- 11) Mobil finomhangolás --- */
@media (max-width: 420px){
  #myg-diary-app .myg-diary-summary{
    padding-top: 40px !important;
  }

  #myg-diary-app .myg-diary-summary__item{
    min-height: 76px;
    padding: 10px 6px 8px;
  }

  #myg-diary-app .myg-diary-summary::before{
    height: 36px;
    font-size: 14px;
  }
}

/* =========================================================
   MYG — DIARY MONTHLY — DESKTOP TOP/BOTTOM A NAPTÁR SZÉLESSÉGÉRE
   + szélső ikonblokkok finom kifelé húzása
   Cél:
   - a havi nézet felső és alsó sora a naptár sávjára üljön
   - a közép maradjon középen
   - a bal/jobb ikonok pontosabban igazodjanak a naptár széléhez
   ========================================================= */

@media (min-width: 1025px){

  #myg-diary-app .myg-diary-monthly__top,
  #myg-diary-app .myg-diary-monthly__bottom{
    width: min(760px, calc(100% - 120px)) !important;
    max-width: min(760px, calc(100% - 120px)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  /* bal és jobb szélső csoportok finom kifelé tolása */
  #myg-diary-app .myg-diary-monthly__top-left,
  #myg-diary-app .myg-diary-monthly__bottom-left{
    transform: translateX(-16px) !important;
  }

  #myg-diary-app .myg-diary-monthly__top-right,
  #myg-diary-app .myg-diary-monthly__bottom-right{
    transform: translateX(60px) !important;
  }

}

/* =========================================================
   MYG — DIARY MONTHLY — HÓNAP CÍM MÉRETE
   Cél:
   - a felső hónapcím (pl. 2026. március) külön szabályt kapjon
   - mobilon kisebb lehessen, mert később még jöhet mellé ikon
   ========================================================= */

/* Alap havi cím */
#myg-diary-app .myg-diary-header__month-title{
  font-size: 24px !important;
  line-height: 1.1 !important;
  margin: 0 !important;
}

/* Mobil: kisebb hónapcím */
@media (max-width: 768px){
  #myg-diary-app .myg-diary-header__month-title{
    font-size: 18px !important;
    line-height: 1.1 !important;
  }
}