:root { --c-primary: #000; --c-accent: #FF6B6B; --c-price: #000; --c-background: #FDFDF9; --c-surface: #FFF; --c-text: #000; --c-text-light: #000; --c-border: #EAEAEA; --font-heading: 'Poppins', sans-serif; --font-body: 'Lato', sans-serif; --shadow: 0 16px 40px rgba(0,0,0,0.1); --radius: 12px; --c-star-yellow: #FFC107; }
    *,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-body);margin:0;background-color:var(--c-background);color:var(--c-text);line-height:1.65;-webkit-font-smoothing:antialiased}
    .page-header{display:flex;flex-direction:column;align-items:center;gap:25px;padding:15px 20px;background-color:var(--c-surface);border-bottom:1px solid var(--c-border);margin-bottom:40px;text-align:center}
    .header-logo-contact{display:flex;flex-direction:column;align-items:center;gap:5px}
    .logo-container img{height:120px;width:auto}
    .contact-info{display:flex;flex-wrap:wrap;justify-content:center;gap:5px 30px}
    .contact-item{display:flex;align-items:center;gap:10px 0px}
    .contact-item a{color:var(--c-text-light);text-decoration:none;font-weight:700;font-size:1rem;transition:color .3s ease}
    .contact-item a:hover{color:var(--c-primary);text-decoration:underline}
    .contact-item i{color:var(--c-text);font-size:1.1rem}
    .header-title-block h1{font-family:var(--font-heading);font-size:2.5rem;color:var(--c-primary);letter-spacing:-1px;margin:0;line-height:1.2}
    .header-title-block p{font-size:1.1rem;color:var(--c-text-light);margin:5px 0 0;max-width:600px}
    .dynamic-pricing-notice{margin-top:15px;padding:15px 20px;background-color:#f5f5f5;border-left:5px solid var(--c-primary);font-size:.85rem;color:var(--c-text-light);text-align:left;max-width:800px;margin-left:auto;margin-right:auto;border-radius:0 var(--radius) var(--radius) 0}
    .dynamic-pricing-notice p{margin:0 0 10px 0}
    .dynamic-pricing-notice p:last-child{margin-bottom:0}
    .feedback-notice{margin-top:15px;padding:15px 20px;background-color:#E2EFDA;border-left:5px solid #70AD47;font-size:.85rem;color:var(--c-text-light);text-align:left;max-width:800px;margin-left:auto;margin-right:auto;border-radius:0 var(--radius) var(--radius) 0}
    .feedback-notice p{margin:0 0 10px 0}
    .feedback-notice p:last-child{margin-bottom:0}
    .offer-section{background-color:var(--c-surface);box-shadow:var(--shadow);margin:0 auto 80px;max-width:1200px}
    .hotel-header{padding:20px 40px;border-bottom:1px solid var(--c-border)}
    .hotel-name{font-family:var(--font-heading);font-size:2.2rem;margin:0 0 5px 0;color:var(--c-text);display:flex;align-items:center;flex-wrap:wrap;gap:0px 15px;line-height:1.2;}
    .hotel-stars{font-size:1.1rem;line-height:1}
    .hotel-stars .fa-star{color:var(--c-star-yellow)}
    .hotel-location{margin:0;color:var(--c-text-light);font-weight:700;display:flex;align-items:center}
    .hotel-location i{color:var(--c-text)}
    .hero-container{position:relative}
    .hero-image-wrapper{width:100%;height:100%;overflow:hidden}
    .hero-image{width:100%;height:100%;object-fit:cover;background-position:center;transition:opacity .3s ease-in-out}
    .hero-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;background:linear-gradient(to bottom,rgba(0,0,0,0.2) 0%,rgba(0,0,0,0) 20%)}
    .gallery-arrow{position:absolute;top:50%;transform:translateY(-50%);background-color:rgba(255,255,255,0.2);color:white;border:1px solid rgba(255,255,255,0.3);border-radius:50%;width:50px;height:50px;font-size:1.4rem;cursor:pointer;transition:all .3s;z-index:10;opacity:0;backdrop-filter:blur(8px)}
    .hero-container:hover .gallery-arrow{opacity:1}
    .gallery-arrow.prev{left:20px}
    .gallery-arrow.next{right:20px}
    .thumbnail-bar-container{background:#111;padding:10px 0}
    .thumbnail-bar{display:flex;gap:8px;max-width:1200px;margin:auto;padding:0 20px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
    .thumbnail-bar::-webkit-scrollbar{display:none}
    .thumbnail-image{height:70px;width:100px;object-fit:cover;border-radius:6px;cursor:pointer;transition:all .3s;opacity:.5;border:2px solid transparent}
    .thumbnail-image:hover,.thumbnail-image.active{opacity:1;border-color:var(--c-accent);transform:scale(1.05)}
    .content-container{padding:20px}
    .main-content{margin-bottom:40px}
/*    .sidebar-content{border-top:1px solid var(--c-border); padding-top:40px}*/
    .block-title{font-family:var(--font-heading);font-size:1.6rem;color:var(--c-text);margin:0 0 25px 0;padding-bottom:10px;border-bottom:3px solid var(--c-accent);display:inline-block;line-height:1.2;}
    .offers-container{display:flex;flex-direction:column;gap:20px}
    .offer-item{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);padding:20px;display:grid;grid-template-columns:1fr auto;gap:20px;transition:all .3s ease}
    .offer-item:hover{transform:translateY(-5px);box-shadow:0 8px 25px rgba(0,0,0,.07)}
    .offer-details{display:flex;flex-direction:column;gap:10px;font-size:.95rem;color:var(--c-text-light)}
    .offer-details span{display:flex;align-items:center}
    .offer-room{font-weight:700;color:var(--c-text);font-size:1.1rem}
    .offer-pricing{text-align:right;display:flex;flex-direction:column;justify-content:center;align-items:flex-end}
    .offer-price{font-size:2rem;font-weight:800;color:var(--c-price);margin-bottom:15px}
    .action-button{background-color:var(--c-accent);color:white;padding:8px 8px;border-radius:4px;text-decoration:none;font-weight:700;transition:all .3s ease;display:inline-block;text-align:center;border:none;font-size:1rem;cursor:pointer}
    .action-button:hover{transform:translateY(-2px);box-shadow:0 4px 15px rgba(0,0,0,0.2)}
    .action-button:disabled{background-color:#999;color:white;padding:8px 8px;border-radius:4px;text-decoration:none;font-weight:100;transition:all .3s ease;display:inline-block;text-align:center;border:none;font-size:1rem;cursor:pointer}

  .price-block .action-button {
    padding: 6px 10px;
/*    background-color: #0077cc; */
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
  }

  .price-block .action-button:disabled {
    padding: 6px 10px;
/*    background-color: red; */
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
  }

    i.fas{margin-right:10px;color:var(--c-text-light);width:20px;text-align:center}
    .main-content{display:flex;flex-direction:column;gap:15px}
    .modal-open-button{border:1px solid var(--c-border);border-radius:var(--radius);background-color:var(--c-surface);font-size:1.2rem;font-family:var(--font-heading);color:var(--c-text);cursor:pointer;display:flex;justify-content:flex-start;align-items:center;transition:background-color .3s ease;width:100%;padding:20px 25px}
    .modal-open-button:hover{background-color:#f5f5f5}
    .modal-open-button span i{color:var(--c-text)}
    .modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);display:flex;align-items:center;justify-content:center;z-index:1000;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;backdrop-filter:blur(5px)}
    .modal-overlay.active{opacity:1;visibility:visible}
    .modal-content{background:var(--c-surface);max-width:900px;width:95%;max-height:90vh;border-radius:var(--radius);position:relative;overflow:hidden;transform:scale(.95);transition:transform .3s ease;box-shadow:0 10px 50px rgba(0,0,0,0.2)}
    .modal-overlay.active .modal-content{transform:scale(1)}
    .modal-close-btn{position:absolute;top:15px;right:20px;font-size:2rem;color:var(--c-text-light);cursor:pointer;background:none;border:none;line-height:1;z-index:10}
    #descriptionModal .modal-content{display:grid;grid-template-columns:240px 1fr;grid-template-rows:1fr}
    .modal-tabs{background-color:var(--c-background);border-right:1px solid var(--c-border);padding:20px 0;overflow-y:auto;display:flex;flex-direction:column;gap:2px}
    .modal-tab{padding:12px 20px;cursor:pointer;font-weight:600;color:var(--c-text-light);display:flex;align-items:center;gap:12px;transition:all .2s ease;border-right:4px solid transparent;white-space:normal;line-height:1.3;border-radius:0}
    .modal-tab.active{background-color:var(--c-surface);color:var(--c-text);border-right-color:var(--c-accent);font-weight:700}
    .modal-tab i{width:20px;text-align:center;font-size:1.1em;color:var(--c-text)}
    #modalBodyContainer{overflow-y:auto;padding:30px 40px;line-height:1.7}
    .modal-tab-panel{display:none;animation:fadeIn .4s}
    .modal-tab-panel.active{display:block}
    #tabs-scroll-indicator{position:absolute;top:0;right:0;width:40px;height:57px;background:linear-gradient(to right,rgba(253,253,249,0),var(--c-background) 50%);display:flex;align-items:center;justify-content:center;color:var(--c-text);font-size:1.2rem;pointer-events:none;opacity:0;transition:opacity .2s ease-out;z-index:5}
    #bookingModal .modal-content{max-width:800px;display:flex;flex-direction:column}
    .booking-modal-header{padding:20px 30px;border-bottom:1px solid var(--c-border)}
    .booking-modal-header h2{font-family:var(--font-heading);margin:0;font-size:1.5rem}
    .booking-modal-body{padding:30px;overflow-y:auto}
    #bookingForm .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px 20px}
    #bookingForm .form-group{display:flex;flex-direction:column}
    #bookingForm .full-width{grid-column:1/-1}
    #bookingForm label{margin-bottom:0px;font-weight:700;font-size:.9rem}
    #bookingForm input,#bookingForm textarea,#bookingForm select{width:100%;padding:12px;border:1px solid var(--c-border);border-radius:8px;font-size:1rem;font-family:var(--font-body);transition:border-color .2s;background-color:#fff}
    #bookingForm input:focus,#bookingForm textarea:focus,#bookingForm select:focus{border-color:var(--c-accent);outline:none}
    #bookingForm input.invalid, #bookingForm select.invalid { border-color: #e74c3c; }
    #bookingForm textarea{resize:vertical;min-height:100px}
    .booking-modal-footer{padding:20px 30px;border-top:1px solid var(--c-border);background-color:var(--c-background);text-align:right}
    #bookingSubmitBtn{width:auto;min-width:200px}
    #bookingSubmitBtn:disabled{background-color:#ccc;cursor:not-allowed}
    #bookingForm .form-section-title{font-family:var(--font-heading);font-size:1.3rem;margin:30px 0 15px 0;padding-bottom:10px;border-bottom:2px solid var(--c-border);color:var(--c-text)}
    #bookingForm .form-section-title:first-of-type{margin-top:0}
    #bookingForm .form-section-subtitle{font-size:.9rem;color:var(--c-text-light);margin:-10px 0 20px 0}
    .passengers-wrapper{display:flex;flex-direction:column;gap:25px;margin-top:20px}
    .passenger-form-wrapper{border:1px solid #e0e0e0;border-radius:var(--radius);padding:20px;background-color:#fdfdfd}
    .passenger-form-wrapper h4{margin:0 0 20px 0;font-family:var(--font-heading);font-size:1.1rem;color:var(--c-primary)}
    .document-details-wrapper{display:none;grid-template-columns:1fr 1fr;gap:20px;grid-column:1/-1;margin-top:15px}
    .page-main-footer{background-color:var(--c-surface);border-top:1px solid var(--c-border);color:var(--c-text-light);text-align:center;padding:30px 20px;}
    .booking-summary{background-color:#f5f5f5;padding:20px;border-radius:var(--radius);margin-bottom:30px;font-size:.95rem;line-height:1.8;}
    .booking-summary h4{margin:0 0 15px 0;font-family:var(--font-heading);font-size:1.1rem;color:var(--c-text)}
    .booking-summary p{margin:0}
    .booking-summary p strong{font-weight:700;margin-right:8px;color:var(--c-text-light)}
    @media (max-width:992px){.hero-image-wrapper{height:400px}}
    @media (max-width:768px){.logo-container img{height:90px}.page-header{gap:20px}.header-title-block h1{font-size:2.2rem}.hotel-header{padding:15px 20px}.hotel-name{font-size:1.6rem}.modal-content{max-height:85vh;width:98%}#descriptionModal .modal-content{grid-template-columns:1fr;grid-template-rows:auto 1fr}.modal-tabs{flex-direction:row;overflow-x:auto;border-right:none;border-bottom:1px solid var(--c-border);padding:5px;scrollbar-width:none;-ms-overflow-style:none}.modal-tabs::-webkit-scrollbar{display:none}.modal-tab{flex-direction:column;border-bottom:3px solid transparent;border-right:none;padding:8px 12px;font-size:.8rem;white-space:nowrap}.modal-tab.active{border-bottom-color:var(--c-accent);background-color:#f5f5f5}#modalBodyContainer{padding:20px}#bookingModal .modal-content{max-width:100%}.booking-modal-body,.booking-modal-header,.booking-modal-footer{padding-left:15px;padding-right:15px}.offer-item{grid-template-columns:1fr}.offer-pricing{align-items:flex-start;margin-top:10px}#bookingForm .form-grid{grid-template-columns:1fr}.document-details-wrapper{grid-template-columns:1fr}}
    @media (min-width:769px){.modal-close-btn{display:block}}

  .offers-table {
    width: 100%;
    border-collapse: collapse;
  }

  .offers-table th,
  .offers-table td {
    border: 1px solid #ccc;
    padding: 10px;
    vertical-align: top;
    text-align: center;
  }

  .offers-table th {
    background: #f0f0f0;
  }

  .offer-room-name {
    font-weight: bold;
    text-align: left;
  }

  .price-block {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  .price-block .price {
    font-weight: bold;
  }

.modal-section {
    margin-bottom: 20px;
}

.modal-section-title {
    font-weight: bold;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.modal-section-content {
    padding-left: 24px;
}

  .tooltip {
    position: relative;
    cursor: pointer;
    border-bottom: 1px dashed #000;  /* Tooltip aláhúzása */
  }

  .tooltip::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: 100%;  /* A tooltip a szó fölött jelenik meg */
    left: 50%;
    transform: translateX(-50%);
    padding: 5px;
    background-color: rgba(0, 0, 0, 0.7);
    color: white;
    border-radius: 5px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 1000;
    transition: opacity 0.3s ease-in-out;
  }

  .tooltip:hover:after {
    opacity: 1;
    visibility: visible;
  }


  @media (max-width: 768px) {
    .offers-table,
    .offers-table thead,
    .offers-table tbody,
    .offers-table th,
    .offers-table td,
    .offers-table tr {
      display: block;
    }

    .offers-table tr {
      margin-bottom: 15px;
    }

    .offers-table td {
      text-align: left;
      padding-left: 50%;
      position: relative;
    }

    .offers-table td::before {
      content: attr(data-label);
      position: absolute;
      left: 10px;
      top: 10px;
      font-weight: bold;
    }

    .offers-table th {
      display: none;
    }
  }

/* Alap beállítás: a variant relatív pozíciót kap, hogy a vonal a határain belül maradjon */
.variant {
    position: relative;
}

.variant-selected {
  background-color: #FFF9C4; /* világos sárga */
  border: 3px solid #E0A010; /* erősebb kontraszt keret #FBC02D */
  border-left: none;
  border-right: none;
  /* border-radius: 8px; */
  padding: 8px 0px 8px 0px;
  margin: 8px 0px 8px 0px;
}

/* ha közvetlenül előtte van <hr> */
hr + .variant-selected {
  margin-top: 8px;      /* ne legyen dupla rés */
  margin-bottom: 8px;      /* ne legyen dupla rés */
}
hr + .variant-selected::before {
  content: none;      /* biztos ami biztos */
}
hr + .variant-selected {
/*  border-top: none; */  /* ha lenne keret */
}
hr:has(+ .variant-selected) {
  display: none;      /* elrejti a hr-t, ha utána kijelölt van */
}

/* ha közvetlenül utána van <hr> */
.variant-selected + hr {
  display: none;
}


@media (max-width: 768px) {
  .offers-table, .offers-table thead, .offers-table tbody, .offers-table th, .offers-table td, .offers-table tr {
    display: block;
    width: 100%;
  }

  .offers-table thead {
    display: none;
  }

  .offers-table tr {
    margin-bottom: 20px;
    border: 1px solid #ccc;
    border-radius: 6px;
    padding: 10px;
  }

  .offers-table td {
    position: relative;
    padding-left: 50%;
    text-align: left;
    border: none;
    border-bottom: 1px solid #eee;
  }

  .offers-table td::before {
    content: attr(data-label);
    position: absolute;
    top: 10px;
    left: 10px;
    font-weight: bold;
    color: #333;
    white-space: nowrap;
  }
}

.offers-cards-container {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    padding: 10px;
}

.offer-card {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 16px;
    width: 100%;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.room-name {
    font-size: 1.1rem;
    font-weight: bold;
    margin-bottom: 6px;
    margin-top: 6px;
}

.traveler-group {
    font-weight: 500;
    margin-bottom: 10px;
    color: #333;
}

.details {
    font-size: 0.9rem;
    margin-bottom: 12px;
/*    color: #555; */
}

.details div {
    margin-bottom: 4px;
}

.price-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    line-height: 1.25;
    padding-top: 6px;
}

.price {
    font-size: 1.1rem;
    font-weight: bold;
    color: #007700;
    text-align: center;
}

.price-small {
    font-size: 0.9rem;
    font-weight: normal;
    font-style: italic;
    color: #000;
    line-height: 1.25;
}


@media (min-width: 680px) {
    .offer-card {
        width: calc(50% - 10px);
    }
}

@media (min-width: 1000px) {
    .offer-card {
        width: calc(33.333% - 20px);
    }
}

/*
@media (min-width: 1200px) {
    .offer-card {
        width: calc(25% - 20px);
    }
}
*/


/*
.view-selector {
  margin-bottom: 20px;
  display: flex;
  gap: 10px;
  align-items: center;
}

.offers-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.block-title {
  font-size: 1.5rem;
  margin: 0;
}

.view-selector-icons {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  position: relative;
}

.view-icon {
  width: 40px;
  height: 40px;
  font-size: 20px;
  border: 1px solid #ccc;
  border-radius: 6px;
  text-align: center;
  line-height: 40px;
  cursor: pointer;
  position: relative;
  background-color: #f9f9f9;
  transition: background-color 0.2s;
}

.view-icon:hover {
  background-color: #e6f0ff;
}

.view-label {
  font-size: 10px;
  position: absolute;
  bottom: -14px;
  left: 50%;
  transform: translateX(-50%);
  color: #666;
  text-transform: lowercase;
}

.view-hint {
  font-size: 10px;
  color: #999;
  margin-top: 4px;
  margin-left: 10px;
  text-transform: lowercase;
}
*/

.offers-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.block-title {
  font-size: 1.5rem;
  margin: 0;
}

.view-selector-icons {
  display: flex;
  align-items: flex-end;
  gap: 16px;
  flex-wrap: wrap;
}

.view-hint {
/*  font-size: 12px;
  color: #666;*/
  text-align: center;
  line-height: 1.2;
  margin-right: 6px;
}

.view-icon {
  width: 50px;
  height: 50px;
  font-size: 26px; /* nagyobb ikon */
  border: 1px solid #ccc;
  border-radius: 8px;
  text-align: center;
  line-height: 50px;
padding-top: 17px;
  cursor: pointer;
  background-color: #f9f9f9;
  transition: background-color 0.2s;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.view-icon:hover {
  background-color: #e6f0ff;
}

.view-label {
  font-size: 12px; /* nagyobb, de még kompakt */
  font-weight: 500;
  margin-top: 4px;
  line-height: 1;
}



.view-selector-icons {
  display: flex;
  align-items: flex-end;
  gap: 16px;
  flex-wrap: wrap;
  flex-shrink: 0;
}

/* Alap ikon */
.view-icon {
  width: 55px;
  height: 55px;
  font-size: 26px;
  border-radius: 8px;
  background-color: #eee; /* alap szürke háttér */
  border: none;
  text-align: center;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s, transform 0.2s;
}

.view-icon:hover {
  transform: scale(1.15);
}

/* Aktív ikon */
.view-icon.active {
  background-color: #007A99;
/*  color: #fff; */
}

/* Felirat */
.view-label {
  font-size: 12px;
  font-weight: 500;
  margin-top: 4px;
  line-height: 1;
  color: inherit;
}

.view-hint {
/*  font-size: 12px;
  color: #666;*/
  text-align: center;
  line-height: 1.2;
  margin-right: 6px;
}

.view-selector-icons,
.view-icon,
.view-label,
.view-hint {
  user-select: none;
  -webkit-user-select: none; /* Safari */
  -moz-user-select: none;    /* Firefox */
  -ms-user-select: none;     /* IE/Edge legacy */
}


@media (max-width: 768px) {
  .offers-header {
    flex-direction: column;
    align-items: flex-start;
  }

  .view-selector-icons {
    margin-top: 10px;
    gap: 12px;
    justify-content: flex-start;
  }
}


/* ============================================================
   KÉPGALÉRIA + LIGHTBOX — ÁTHELYEZVE (2026-07-19)
   ------------------------------------------------------------
   A korábbi "ÚJ KÉPGALÉRIA (assets/gallery.js)" + LIGHTBOX blokk
   (.gallery / .gallery-* / .lightbox / .lightbox-*) innen ÁTKERÜLT az önálló,
   bármely nézetbe beilleszthető galéria-modul CSS-ébe:
       assets/galleries/csuszkas.css   (a "csuszkas" húzós/snap galéria)
   A "filmes" (filmszalag) galéria stílusa: assets/galleries/filmes.css.
   A megfelelő modul CSS-ét a views/html_head.php tölti be a JSON 'galeria'
   mező / nézet-alapú default szerint (galeriaTipusValaszt). Az osztálynevek
   nem változtak, így a grouped nézet HTML-je változatlanul működik.
   ============================================================ */

/* =====================================================================
 *  KOMBINÁLT NÉZET (mode=kombinalt) — közös szoba-lista + dátum-összegzés
 *  A mockup-kombinalt-v2.html stílusaiból, a grouped arculathoz (#FF6B6B
 *  accent, Poppins/Lato, --radius) igazítva. Külön .kombinalt- prefix, hogy
 *  a többi nézet stílusát ne érintse.
 *  A --c-head a panel-fejléc sötétkékje (a data-2 fejléc-színe).
 * ===================================================================== */
:root { --c-kombi-head: #2b3a67; --c-kombi-ok: #1e9e5a; }

.kombinalt-app { width: 100%; }
.kombinalt-loading { padding: 20px; color: var(--c-text-light); font-style: italic; }
.kombinalt-ures,
.kombinalt-nincs-datum { padding: 16px; color: var(--c-text-light); background: #f7f7f7; border-radius: var(--radius); }
.kombinalt-book-area { padding: 4px 0 8px; }

/* ---- KIEMELT KÖZÖS SZOBA-LISTA ---- */
.kombinalt-roomset { border: 2px solid var(--c-kombi-head); border-radius: var(--radius); overflow: hidden; margin-bottom: 20px; }
.kombinalt-roomset-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 16px; background: var(--c-kombi-head); color: #fff; cursor: pointer; flex-wrap: wrap; }
.kombinalt-roomset-head .t { font-family: var(--font-heading); font-weight: 700; display: flex; align-items: center; gap: 10px; }
.kombinalt-roomset-head .summ { font-size: .85rem; opacity: .9; }
.kombinalt-roomset-head .toggle { transition: transform .2s; }
.kombinalt-roomset.closed .kombinalt-roomset-head .toggle { transform: rotate(-90deg); }
.kombinalt-roomset-body { max-height: 2000px; overflow: hidden; transition: max-height .3s ease; }
.kombinalt-roomset.closed .kombinalt-roomset-body { max-height: 0; }
.kombinalt-roomset-note { font-size: .82rem; color: var(--c-text-light); padding: 10px 16px 0; }

table.kombinalt-rooms { width: 100%; border-collapse: collapse; font-size: .9rem; }
.kombinalt-rooms th, .kombinalt-rooms td { padding: 9px 14px; border-bottom: 1px solid #f0f0f0; text-align: left; vertical-align: middle; }
.kombinalt-rooms th { color: var(--c-text-light); font-size: .72rem; text-transform: uppercase; letter-spacing: .5px; font-family: var(--font-heading); font-weight: 700; }
.kombinalt-rooms td.num, .kombinalt-rooms th.num { text-align: right; white-space: nowrap; }
.kombinalt-rooms tr.picked { background: #f2fbf5; }
.kombinalt-fromprice { color: var(--c-text-light); font-size: .82rem; }
.kombinalt-fromprice b { color: var(--c-text); font-family: var(--font-heading); }
.kombinalt-tol { font-size: .72rem; }
.kombinalt-nincs { font-size: .78rem; color: #b00; }

/* ---- Stepper ---- */
.kombinalt-stepper { display: inline-flex; align-items: center; border: 1px solid var(--c-border); border-radius: 8px; overflow: hidden; background: #fff; }
.kombinalt-stepper button { border: none; background: #f3f3f3; width: 30px; height: 30px; font-size: 1.1rem; line-height: 1; cursor: pointer; font-weight: 700; color: var(--c-text); }
.kombinalt-stepper button:hover { background: #e8e8e8; }
.kombinalt-stepper .qty { width: 32px; text-align: center; font-family: var(--font-heading); font-weight: 700; }
.kombinalt-rooms tr.picked .kombinalt-stepper { border-color: var(--c-kombi-ok); }

.kombinalt-roomset-foot { padding: 10px 16px; background: #fbfbfb; font-size: .85rem; color: var(--c-text-light); display: flex; gap: 18px; flex-wrap: wrap; }
.kombinalt-roomset-foot b { color: var(--c-text); font-family: var(--font-heading); }

/* ---- DÁTUM-SOROK ---- */
.kombinalt-dates-title { font-family: var(--font-heading); font-weight: 700; font-size: 1rem; margin: 0 0 8px; }
.kombinalt-date-row { border: 1px solid var(--c-border); border-radius: var(--radius); margin-bottom: 10px; overflow: hidden; }
.kombinalt-date-row.cheapest { border-color: var(--c-kombi-ok); }
.kombinalt-date-main { display: grid; grid-template-columns: auto 1fr auto auto; gap: 14px; align-items: center; padding: 12px 16px; }
.kombinalt-exp { background: none; border: none; cursor: pointer; font-size: 1rem; color: var(--c-text); display: flex; align-items: center; gap: 8px; font-family: var(--font-heading); font-weight: 700; text-align: left; }
.kombinalt-exp .yr { opacity: .55; font-size: .78rem; font-weight: 400; }
.kombinalt-exp .arrow { font-size: .85rem; transition: transform .2s; }
.kombinalt-date-row.open .kombinalt-exp .arrow { transform: rotate(90deg); }
.kombinalt-pax { font-size: .8rem; color: var(--c-text-light); }
.kombinalt-pax b { color: var(--c-text); }
.kombinalt-price { text-align: right; font-family: var(--font-heading); font-weight: 700; font-size: 1.15rem; color: var(--c-text); }
.kombinalt-price small { display: block; font-weight: 400; font-size: .7rem; color: var(--c-text-light); }
.kombinalt-cheap-badge { font-size: .66rem; background: #eafaf0; color: var(--c-kombi-ok); font-weight: 700; padding: 2px 8px; border-radius: 999px; margin-left: 8px; white-space: nowrap; }
/* A foglalás gomb a közös .action-button-t használja (piros accent). */
.kombinalt-book { white-space: nowrap; padding: 10px 20px; border-radius: 8px; }

.kombinalt-date-detail { max-height: 0; overflow: hidden; transition: max-height .3s ease; background: #fbfbfb; border-top: 1px solid transparent; }
.kombinalt-date-row.open .kombinalt-date-detail { max-height: 900px; border-top-color: var(--c-border); }
.kombinalt-date-detail table { width: 100%; border-collapse: collapse; font-size: .86rem; }
.kombinalt-date-detail td { padding: 7px 16px; border-bottom: 1px solid #f0f0f0; }
.kombinalt-date-detail td.num { text-align: right; white-space: nowrap; font-family: var(--font-heading); font-weight: 700; }
.kombinalt-date-detail tr.grand td { border-top: 2px solid var(--c-text); border-bottom: none; font-family: var(--font-heading); font-weight: 700; }
.kombinalt-date-detail .q { color: var(--c-text-light); }

/* ---- Mobil: kártyásodó szoba-lista + tömör dátum-sor ---- */
@media (max-width: 720px) {
  .kombinalt-date-main { grid-template-columns: 1fr auto; gap: 8px; }
  .kombinalt-pax { grid-column: 1 / 3; order: 3; }
  .kombinalt-book { grid-column: 1 / 3; order: 4; width: 100%; }
  .kombinalt-price { order: 2; }
  /* A dátum-gomb mobilon: a dátum-szöveg ne törjön, a "legkedvezőbb" badge
     kerüljön külön sorba a dátum alá (a gomb tördelhető flex-konténer). */
  .kombinalt-exp { flex-wrap: wrap; }
  .kombinalt-exp > span:not(.arrow):not(.kombinalt-cheap-badge) { white-space: nowrap; }
  .kombinalt-cheap-badge { margin-left: 0; margin-top: 4px; flex-basis: 100%; width: max-content; }
  .kombinalt-rooms thead { display: none; }
  .kombinalt-rooms tr { display: grid; grid-template-columns: auto 1fr; gap: 2px 10px; padding: 10px 14px; }
  .kombinalt-rooms td { border: none; padding: 2px 0; }
  .kombinalt-rooms td.kombinalt-stepcell { grid-row: 1 / 4; align-self: center; }
  .kombinalt-rooms td.num { text-align: left; }
}

/* ---- Foglalás-összesítő: kiválasztott szobák tételes bontása ----
   (kombinalt / kombinaltv2 nézet; a #summaryRoomSelection konténerben). */
.booking-room-selection { margin: 10px 0 4px; }
.booking-room-selection h4 { margin: 0 0 6px; font-family: var(--font-heading); }
table.booking-rs-table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.booking-rs-table td { padding: 6px 8px; border-bottom: 1px solid #eee; vertical-align: top; }
.booking-rs-table .rs-qty { white-space: nowrap; color: var(--c-text-light); font-family: var(--font-heading); font-weight: 700; }
.booking-rs-table .rs-num { text-align: right; white-space: nowrap; }
.booking-rs-table tr.rs-grand td { border-top: 2px solid var(--c-text); border-bottom: none; font-family: var(--font-heading); font-weight: 700; padding-top: 8px; }

/* =====================================================================
 *  KOMBINÁLT v2 NÉZET (mode=kombinaltv2) — data-2 (8098) TÁBLÁZATOS elrendezés
 *  A data-2/ajanlat.css táblázat-stílusaiból, .kombiv2- prefixszel, a grouped
 *  arculathoz igazítva (--c-kombi-head a data-2 sötétkékje helyett; a Foglalás
 *  a közös .action-button). Külön prefix, hogy a többi nézetet ne érintse.
 * ===================================================================== */
.kombiv2-app { width: 100%; }
.kombiv2-loading { padding: 20px; color: var(--c-text-light); font-style: italic; }
.kombiv2-ures,
.kombiv2-nincs-datum { padding: 16px; color: var(--c-text-light); background: #f7f7f7; border-radius: var(--radius); }

/* ---- Stepper ---- */
.kombiv2-stepper { display: inline-flex; align-items: center; border: 1px solid var(--c-border); border-radius: 6px; overflow: hidden; background: #fff; }
.kombiv2-stepper button { border: none; background: #f3f3f3; width: 28px; height: 28px; font-size: 1rem; line-height: 1; cursor: pointer; font-weight: 700; color: var(--c-text); }
.kombiv2-stepper button:hover { background: #e8e8e8; }
.kombiv2-stepper .qty { width: 32px; text-align: center; font-family: var(--font-heading); font-weight: 700; }

/* ---- Közös adatok táblázat ---- */
table.kombiv2-kozos { width: 100%; border-collapse: collapse; margin-bottom: 14px; }
.kombiv2-kozos td { font-size: .9rem; padding: 8px 16px; border-bottom: 1px solid #eef2f7; }
.kombiv2-kozos td.cimke { color: var(--c-text-light); width: 180px; }
.kombiv2-kozos td.ertek { color: var(--c-text); font-weight: 700; }
.kombiv2-kozos tr:nth-child(even) td { background: #f8fafc; }

/* ---- Ár-táblázat ---- */
table.kombiv2-arak { width: 100%; border-collapse: collapse; }
.kombiv2-arak th { font-size: .72rem; text-transform: uppercase; letter-spacing: .5px; color: var(--c-text-light); font-family: var(--font-heading); font-weight: 700; padding: 10px 12px; text-align: left; border-bottom: 2px solid var(--c-border); }
.kombiv2-arak th.jobb { text-align: right; }
.kombiv2-arak th.kozepre { text-align: center; }

.kombiv2-arak td.datum-cella { padding: 12px 16px; vertical-align: top; white-space: nowrap; border-right: 1px solid #eef2f7; min-width: 210px; }
.kombiv2-arak .datum-fejsor { display: block; }
.kombiv2-arak .datum-szoveg { display: block; }
.kombiv2-arak .datum-ev { display: block; color: var(--c-text-light); font-size: .75rem; }
.kombiv2-arak .datum-tartomany { display: block; font-size: 1rem; font-weight: 700; font-family: var(--font-heading); }
.kombiv2-arak .osszeg-fo { display: block; margin-top: 6px; }
.kombiv2-arak .osszeg-cimke { display: block; font-weight: 400; color: var(--c-text-light); font-size: .72rem; }
.kombiv2-arak .osszeg-ertek { display: block; color: var(--c-kombi-head); font-size: 1rem; font-weight: 700; font-family: var(--font-heading); margin-top: 1px; }
.kombiv2-arak .osszeg-reszletek { display: block; margin-top: 8px; font-size: .72rem; color: var(--c-text-light); }
.kombiv2-arak .osszeg-reszletek > span { display: flex; justify-content: space-between; gap: 8px; }
.kombiv2-arak .osszeg-reszletek strong { color: var(--c-text); }
/* A Foglalás gomb a közös .action-button; itt csak elrendezés. */
.kombiv2-arak .kombiv2-book { margin-top: 10px; width: 100%; padding: 9px 14px; }

.kombiv2-arak td.adat { font-size: .9rem; color: #334155; padding: 9px 12px; border-top: 1px solid #eef2f7; vertical-align: middle; }
.kombiv2-arak tr.datum-elso td.adat { border-top: 4px solid #dfe6f5; } /* dátum-csoport: vastag határ */
.kombiv2-arak tr.letszam-elso td.adat { border-top: 2px solid #dfe6f5; }
.kombiv2-arak td.db { text-align: center; white-space: nowrap; }
.kombiv2-arak td.resztvevok .rv-fo { display: block; }
.kombiv2-arak td.resztvevok .rv-plusz { display: block; color: var(--c-text-light); }
.kombiv2-arak td.egysegar { text-align: right; white-space: nowrap; color: var(--c-text-light); }
.kombiv2-arak td.osszesen { text-align: right; white-space: nowrap; font-weight: 700; color: var(--c-text); }
.kombiv2-arak td.osszesen.nulla { color: #cbd5e1; }
.kombiv2-arak td.hiany { color: #b91c1c; font-style: italic; text-align: right; }
.kombiv2-arak tr.csop-paros td.adat { background: #f8fafc; }

/* ---- Mobil: dátum-blokk = kártya (data-2 elrendezés) ---- */
@media (max-width: 620px) {
  .kombiv2-arak, .kombiv2-arak thead, .kombiv2-arak tbody, .kombiv2-arak tr, .kombiv2-arak td { display: block; width: 100%; }
  .kombiv2-arak thead { display: none; }
  .kombiv2-arak tr.datum-elso { margin-top: 14px; }
  .kombiv2-arak td.datum-cella { border-right: none; border-bottom: 1px solid var(--c-border); white-space: normal; width: auto; min-width: 0; }
  .kombiv2-arak .datum-fejsor { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
  .kombiv2-arak .datum-szoveg { display: flex; flex-direction: column; }
  .kombiv2-arak .osszeg-fo { display: flex; flex-direction: column; text-align: right; margin-top: 0; }
  .kombiv2-arak .osszeg-reszletek { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 10px; }
  .kombiv2-arak .osszeg-reszletek > span { display: inline-flex; gap: 5px; align-items: baseline; }
  .kombiv2-arak tr.tetel-sor + .tetel-sor { border-top: 1px solid #eef2f7; }
  .kombiv2-arak tr.tetel-sor + .tetel-sor.letszam-elso { border-top: 3px solid #dfe6f5; }
  .kombiv2-arak td.adat { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 7px 14px 7px 20px; border-top: none; border-bottom: 1px solid #f1f5f9; }
  .kombiv2-arak td.adat::before { content: attr(data-cimke); color: var(--c-text-light); font-size: .8rem; font-weight: 700; }
  .kombiv2-arak tr.datum-elso td.adat, .kombiv2-arak tr.letszam-elso td.adat { border-top: none; }
  .kombiv2-arak td.resztvevok .rv-fo, .kombiv2-arak td.resztvevok .rv-plusz { display: inline; }
  .kombiv2-arak td.resztvevok .rv-plusz { margin-left: 4px; }
}