html, body {
      margin: 0;
      padding: 0;
      width: 100%;
      height: 100%;
      box-sizing: border-box;
      overflow-x: hidden;
    }

    body {
      background-color: #4b5320;
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
      color: #333333;
    }
    
    .card {
      border-radius: 12px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.15);
      border: none;
      background-color: #ffffff;
    }
    .loading-overlay {
      position: fixed;
      top: 0; left: 0; width: 100%; height: 100%;
      background: rgba(255,255,255,0.8);
      display: flex;
      justify-content: center;
      align-items: center;
      z-index: 9999;
    }
    #adminView {
      background-color: #eaf4ec !important;
      padding: 20px;
      border-radius: 12px;
      box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    }
    #adminView .card {
      background-color: #f2f8f3 !important; 
      border: 1px solid #d0e2d4;
    }
    #adminView .card.border-danger {
      background-color: #ffffff !important;
      border: 1px solid #dc3545 !important;
    }

    .weekend-col, tr.weekend-col td, td.weekend-col {
      background-color: #888888 !important;
      color: #ffffff !important;
      -webkit-print-color-adjust: exact !important;
      print-color-adjust: exact !important;
    }

    .row-inaktiv, tr.row-inaktiv td {
      background-color: #c2d0c2 !important;
    }

    .row-aktiv, tr.row-aktiv td {
      background-color: #d1e7dd !important;
    }
    
    .row-tiltott, tr.row-tiltott td {
      background-color: #c2d0c2 !important;
      color: #333333 !important;
    }

    .table-danger, tr.table-danger td {
      background-color: #f8d7da !important;
      color: #721c24 !important;
    }

    .table-warning, tr.table-warning td {
      background-color: #fff3cd !important;
      color: #664d03 !important;
    }

    #adminTabs .nav-link, #diakTabs .nav-link {
      background-color: #a3c1ad !important;
      color: #2f3e46 !important;
      border: 1px solid #90b09d !important;
      margin-right: 4px;
      font-weight: 600;
      margin-bottom: 4px;
    }
    #adminTabs .nav-link.active, #diakTabs .nav-link.active {
      background-color: #d1e7dd !important;
      color: #0f5132 !important;
      border-color: #badbcc !important;
    }

    .day-scroll-wrapper {
      position: relative;
      margin-bottom: 15px;
      padding: 0 35px;
    }
    .day-scroll-container {
      display: flex;
      overflow-x: auto;
      scroll-behavior: smooth;
      -webkit-overflow-scrolling: touch;
      padding: 6px 2px 10px 2px;
      gap: 10px;
      scrollbar-width: thin;
      scrollbar-color: #198754 #e9ecef;
    }
    .day-scroll-container::-webkit-scrollbar {
      height: 5px;
    }
    .day-scroll-container::-webkit-scrollbar-track {
      background: #e9ecef;
      border-radius: 4px;
    }
    .day-scroll-container::-webkit-scrollbar-thumb {
      background: #198754;
      border-radius: 4px;
    }

    .scroll-btn {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      z-index: 10;
      width: 32px;
      height: 32px;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.95);
      border: 1px solid #ced4da;
      box-shadow: 0 2px 6px rgba(0,0,0,0.15);
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      color: #198754;
      transition: all 0.2s ease;
    }
    .scroll-btn:hover {
      background: #198754;
      color: #ffffff;
    }
    .scroll-btn-left { left: 0; }
    .scroll-btn-right { right: 0; }

    .day-pill {
      flex: 0 0 auto;
      min-width: 90px;
      padding: 8px 10px;
      border-radius: 12px;
      background-color: #ffffff;
      border: 2px solid #ced4da;
      text-align: center;
      cursor: pointer;
      transition: all 0.2s ease-in-out;
      user-select: none;
      position: relative;
    }
    
    .day-pill.pill-szunet {
      background-color: #ffc107 !important;
      border-color: #d39e00 !important;
      color: #212529 !important;
    }
    .day-pill.pill-unnep {
      background-color: #dc3545 !important;
      border-color: #b02a37 !important;
      color: #ffffff !important;
    }
    .day-pill.pill-weekend {
      background-color: #6c757d !important;
      border-color: #565e64 !important;
      color: #ffffff !important;
    }
    .day-pill.pill-normal {
      background-color: #ffffff;
      color: #212529;
    }
    .day-pill.pill-lezart {
      background-color: #c2d0c2 !important;
      border-color: #9db39d !important;
      color: #333333 !important;
    }
    .day-pill.pill-lezart.active {
      background-color: #5a7d61 !important;
      color: #ffffff !important;
    }

    .day-pill.active {
      border-color: #146c43 !important;
      border-width: 3px !important;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.35);
      transform: translateY(-2px);
    }
    .day-pill.pill-normal.active {
      background-color: #198754 !important;
      color: #ffffff !important;
    }

    .day-pill .day-name {
      font-weight: 700;
      font-size: 0.85rem;
      display: block;
    }
    .day-pill .day-date {
      font-size: 0.75rem;
      display: block;
      margin-top: 2px;
      opacity: 0.9;
    }

    .day-card-item {
      display: none;
    }
    .day-card-item.active-day-card {
      display: block;
      animation: fadeIn 0.25s ease-in-out;
    }
    @keyframes fadeIn {
      from { opacity: 0; transform: translateY(4px); }
      to { opacity: 1; transform: translateY(0); }
    }

    .vertical-header, .vertical-header-osszesen {
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      text-align: center;
      white-space: nowrap;
      height: 120px;
      vertical-align: middle !important;
      font-size: 11px;
      padding: 4px !important;
    }

    .mobile-item-box {
      background-color: #ffffff;
      border: 1px solid #e0e0e0;
      border-radius: 10px;
      padding: 12px;
      margin-top: 10px;
      box-shadow: 0 1px 3px rgba(0,0,0,0.03);
    }
    .mobile-item-title {
      font-weight: 700;
      font-size: 0.82rem;
      color: #198754;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      margin-bottom: 6px;
    }
    .touch-friendly-select {
      min-height: 48px;
      font-size: 1rem;
      border-radius: 8px;
    }
    .touch-friendly-check-box {
      width: 24px;
      height: 24px;
      cursor: pointer;
    }

    /* Excel-szerű kompakt táblázat stílusok */
    .excel-table th {
      background-color: #e9ecef !important;
      font-size: 0.85rem;
      font-weight: 700;
      text-align: center;
      vertical-align: middle;
      border: 1px solid #dee2e6;
    }
    .excel-table td {
      padding: 4px !important;
      vertical-align: middle;
      border: 1px solid #dee2e6;
    }
    .excel-table .form-select-sm, .excel-table .form-control-sm {
      font-size: 0.8rem;
      padding: 2px 6px;
      height: 30px;
      border-radius: 4px;
    }

    /* Dolgozói havi összesítő: blokkok és összesen sorok */
    #dolgozoPrintTable tr.blokk-elso > td { border-top: 2px solid #495057; }
    #dolgozoPrintTable tr.osszesen-sor > td { font-weight: 600; background-color: #e9ecef; }

    /* Diák havi nézet */
    #nezetHaviTable th, #nezetHaviTable td { padding: 2px 4px; }
    #nezetHaviTable td.hv-van { background-color: #d1e7dd; font-weight: 700; }
    #nezetHaviTable td.hv-nincs { background-color: #f8d7da; }
    #nezetHaviTable td.hv-hideg { background-color: #88B7FF; font-weight: 700; }
    #nezetHaviTable td.hv-szunetnap, #nezetHaviTable th.hv-szunetnap { background-color: #ffc107 !important; }
    #nezetHaviTable td.hv-unnep, #nezetHaviTable th.hv-unnep { background-color: #dc3545 !important; color: #fff; }
    #nezetHaviTable th.hv-nap, #nezetHaviTable td.hv-van, #nezetHaviTable td.hv-hideg, #nezetHaviTable td.hv-nincs, #nezetHaviTable td.hv-szunetnap, #nezetHaviTable td.hv-unnep, #nezetHaviTable td.weekend-col { min-width: 24px; }
    #nezetHaviTable th.hv-th-sz { width: 72px; }
    #nezetHaviTable td.hv-nev { min-width: 130px; }
    #nezetHaviTable td, #nezetHaviTable th { overflow: hidden; }
    #nezetHaviTable tr.blokk-elso > td { border-top: 2px solid #495057; }

   @media print {
      /* 1. Margók beállítása */
      @page { 
        margin: 8mm; 
      }

      /* Többoldalas nyomtatás: blokk elrendezés (a flex doboz egyes böngészőkben nem tördelhető), a táblafejléc ismétlődik */
      #dolgozoPrintCard, #diakNezetPrintCard, #diakHaviStatPrintCard { display: block !important; }

      /* 2. Minden elem elrejtése alapból */
      body * { 
        visibility: hidden !important; 
      }

      /* 3. A nyomtatandó kártyák és elemeik láthatóvá tétele */
      #dolgozoPrintCard, #dolgozoPrintCard *, 
      #diakHaviStatPrintCard, #diakHaviStatPrintCard *, 
      #diakNezetPrintCard, #diakNezetPrintCard * { 
        visibility: visible !important; 
      }

      /* 4. A nyomtatandó kártyák pozicionálása */
      #dolgozoPrintCard, #diakHaviStatPrintCard, #diakNezetPrintCard {
        position: absolute !important; 
        left: 0 !important; 
        top: 0 !important; 
        width: 100% !important; 
        margin: 0 !important; 
        padding: 0 !important;
        box-shadow: none !important;
        border: none !important;
        background: transparent !important;
      }

      .table-responsive {
        max-height: none !important;
        overflow: visible !important;
        border: none !important;
      }

      /* 5. DINAMIKUS PAPÍRTÁJOLÁSOK */
      body:has(#dolgozoPrintCard:not(.d-none):not([style*="display: none"])) @page { size: A4 landscape; }
      body:has(#diakNezetPrintCard:not(.d-none):not([style*="display: none"])) @page { size: A4 landscape; }
      body:has(#diakHaviStatPrintCard:not(.d-none):not([style*="display: none"])) @page { size: A4 portrait; }

      /* 6. Vezérlőgombok elrejtése */
      .no-print, .btn, .nav-tabs, header, p.text-muted { 
        display: none !important; 
      }

      #printCimke {
        display: block !important;
        visibility: visible !important;
        margin-bottom: 10px !important;
        text-align: center !important;
      }

      #printCimkeSzoveg {
        visibility: visible !important;
        font-size: 13pt !important;
        font-weight: bold !important;
        color: #000000 !important;
      }

      /* 7. PERFEKT, EGYENLETES TÁBLÁZATRÁCS MÓDSZER */
      table {
        width: 100% !important;
        border-collapse: collapse !important;
        margin-top: 5px !important;
        border: 1px solid #000000 !important;
      }

      /* Egységes 1px fekete rács minden oldalra */
      table th, 
      table td {
        border: 1px solid #000000 !important;
        color: #000000 !important;
        background-color: #ffffff !important;
        padding: 2px 3px !important;
        font-size: 8pt !important;
        text-align: center !important;
        vertical-align: middle !important;
        box-sizing: border-box !important;
      }

      /* Elforgatott feliratok cellamérete és igazítása */
      .vertical-header, 
      .vertical-header-osszesen {
        height: 55px !important;
        vertical-align: bottom !important;
        padding-bottom: 3px !important;
      }

      /* A cella (th) maga NE legyen elforgatva: az elforgatott cella hátterével elfedi a
         összevont (collapse) szegélyeket nyomtatáskor. Csak a belső szöveg forog. */
      .vertical-header,
      .vertical-header-osszesen {
        transform: none !important;
        writing-mode: horizontal-tb !important;
      }

      /* LENTRŐL FEL OLVASHATÓ SZÖVEG (a belső div forog, nem a cella) */
      .vertical-header div,
      .vertical-header-osszesen div {
        writing-mode: vertical-rl !important;
        transform: rotate(180deg) !important;
        display: inline-block !important;
        margin: 0 auto !important;
        white-space: nowrap !important;
        line-height: 1 !important;
      }

      /* A ragadós (sticky) fejléc nyomtatáskor elveszti a cellaszegélyeket (Chrome hiba),
         ezért nyomtatásban sima pozicionálás kell; a fejléc minden oldalon ismétlődik. */
      .sticky-top, thead, thead tr, thead th {
        position: static !important;
        top: auto !important;
        z-index: auto !important;
        box-shadow: none !important;
      }
      thead { display: table-header-group !important; }
      tbody { display: table-row-group !important; }
      table { break-inside: auto !important; page-break-inside: auto !important; }
      tr { page-break-inside: avoid !important; break-inside: avoid !important; }
      table.table > :not(caption) > * > * { box-shadow: none !important; }

      /* Dolgozói összesítő: egy dolgozó sorai együtt maradnak, a blokkok vastagabb vonallal válnak el */
      tr.blokk-folyt { break-after: avoid !important; page-break-after: avoid !important; }
      #dolgozoPrintTable tr.blokk-elso > td { border-top: 2px solid #000000 !important; }
      #dolgozoPrintTable tr.osszesen-sor > td { background-color: #e6e6e6 !important; font-weight: bold !important;
        -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }

      /* Diák havi nézet nyomtatásban: csak a szürke (hétvége / üres nap) marad, minden más cella fehér */
      #nezetHaviTable td.hv-van, #nezetHaviTable td.hv-nincs, #nezetHaviTable td.hv-hideg,
      #nezetHaviTable td.hv-szunetnap, #nezetHaviTable td.hv-unnep,
      #nezetHaviTable th.hv-szunetnap, #nezetHaviTable th.hv-unnep { background-color: #ffffff !important; color: #000000 !important; }
      #nezetHaviTable td.hv-van, #nezetHaviTable td.hv-hideg { font-weight: bold !important; }
      #nezetHaviTable td.weekend-col, #nezetHaviTable th.weekend-col {
        -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
      #nezetHaviTable tr.blokk-elso > td { border-top: 2px solid #000000 !important; }
      #nezetHaviTable td.hv-nev { text-align: left !important; }
      /* Hosszú időszaknál is férjen el egy lapon szélességben: fix kiosztás, nincs minimális oszlopszélesség */
      #nezetHaviTable { table-layout: fixed !important; }
      #nezetHaviTable th, #nezetHaviTable td { font-size: 6.5pt !important; padding: 1px 0 !important; min-width: 0 !important; overflow: hidden; }
      #nezetHaviTable th.hv-th-sz { width: 15mm !important; }
      #nezetHaviTable th.hv-th-nev { width: 36mm !important; }
      #nezetHaviTable td.hv-nev { padding-left: 2px !important; white-space: normal; }

      /* Fejlécek szürke háttere */
      thead th {
        background-color: #f0f0f0 !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
      }

      /* Szünetes napok sötétebb kiemelése */
      .weekend-col, 
      th.weekend-col, 
      td.weekend-col, 
      tr td.weekend-col,
      thead th.weekend-col {
        background-color: #c0c0c0 !important;
        color: #000000 !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
      }
    }

/* Lezárt rendelésnél a teljes ételnév látszik, több sorban (mobilon is) */
.mobile-item-box .form-check-label,
.mobile-item-box .etel-szoveg,
.mobile-item-box span {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.etel-szoveg { display: inline-block; line-height: 1.35; }