#container_productAdditions {
    margin-top: 10px;
    overflow-y: auto;
    width: 100%;
}

.chk_container_product_additions {
    display: flex;
    align-items: center;
    padding: 0px 6px;    
    margin-top: 5px; 
}

.chk_container_product_additions input {
    display: none;
}

.chk_container_product_additions .deselected {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    width: auto;
    height: auto;
    background-color: #ffffff;
    color: #257D77;
    border: 1.5px solid #257D77;
    border-radius: 20px;
    padding: 5px 13px;
    margin: 8px;
    font-size: 0.82rem;
    font-style: normal;
    float: none;
    white-space: nowrap;
    font-family: inherit;
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s;
}

.chk_container_product_additions .deselected::before {
    content: '\f07a'; /* fa-shopping-cart */
    font-family: 'FontAwesome';
    font-size: 0.85rem;
    font-style: normal;
}

.chk_container_product_additions .deselected::after {
    content: '';
}

.chk_container_product_additions .chk_selected {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    width: auto;
    height: auto;
    background-color: #ffffff;
    color: #257D77;
    border: 1.5px solid #257D77;
    border-radius: 20px;
    padding: 5px 13px;
    margin: 8px;
    font-size: 0.82rem;
    font-style: normal;
    float: none;
    white-space: nowrap;
    font-family: inherit;
    cursor: pointer;
}

.chk_container_product_additions .chk_selected::before {
    content: '\f00c'; /* fa-check */
    font-family: 'FontAwesome';
    font-size: 0.85rem;
    font-style: normal;
}

.chk_container_product_additions .chk_selected::after {
    content: '';
}

.chk_container_product_additions:hover .deselected {
    border-color: #1a5a55;
    color: #1a5a55;
    transition: border-color 0.2s, color 0.2s;
}

.chk_container_product_additions .span_container {
    display: flex;
    align-items: center; /* Centruje elementy w pionie */
    font-size: 0.9em;
    font-weight: 200;
    line-height: 1;
    padding-left: 0.7em;
    text-align: left;
    user-select: none;
    cursor: pointer;
    width: 100%;
}

.chk_container_product_additions .span_text_wrapper {
    display: flex;
    flex-direction: column; /* teraz view product będzie pod nazwą */
}

.chk_container_product_additions .span_container .span_name {
    display: -webkit-box;        /* konieczne do line-clamp */
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;       /* maksymalnie 2 linie */
    overflow: hidden;            /* ukrywa nadmiar tekstu */
    text-overflow: ellipsis;     /* dodaje "..." jeśli przycięte */    
}

.chk_container_product_additions .span_container .view_product {
    display: block;      /* wymusza nową linię */
    margin-top: 0.5em;  /* odległość od nazwy */
    text-decoration: underline;
}

.chk_container_product_additions .price_and_btn {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin-left: auto;
    gap: 6px;
}

.chk_container_product_additions .price {
    padding-left: 10px;
    font-size: .88889rem;
    font-weight: bold;
    color: #000000;
    min-width: 100px;
    text-align: right;
}

.chk_container_product_additions .price_and_btn .deselected,
.chk_container_product_additions .price_and_btn .chk_selected {
    margin: 0;
}

.chk_container_product_additions_label {
    font-size: .88889rem;
    font-weight: bold;
    color: #257D77;
}

.chk_container_product_additions_label img {
    width: 30px;
    margin-bottom: 0.2em;
    margin-right: 0.2em;
}

a.productAdditionsDescription {
    cursor: pointer;
}
span.productAdditionsDescription {
    cursor: pointer;
}

.btn_close{
    display: none;
    width: 100%;
    background-color: #257D77;
    color: white;
    border: 0;
    cursor: pointer;
}

.additions_products_group.multi_group_wrapper {
  border: 1px solid #eeeeee;
  margin-bottom: 10px;
  border-radius: 6px;
  overflow: hidden;
  background: #ffffff;
}

.additions_products_group_header.multi_group {
  display: flex;
  justify-content: space-between; /* label po lewej, button po prawej */
  align-items: center;
  background: #fffefe;
  padding: 6px;
  cursor: pointer; 
}

.additions_products_group.expanded.multi_group_wrapper .additions_products_group_header.multi_group{
    border-bottom: 1px solid #fafafa;
}

.additions_products_group_header .toggle_btn {
  background: #257D77;
  border: none;
  color: #ffffff;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  width: 25px;
  height: 25px;
  text-align: center;
  border-radius: 6px; /* lekko zaokrąglone rogi */
  padding: 0px;
}

.additions_products_group_header .toggle_btn .material-icons{
    font-size: 24px;
}

.additions_products_group_header .toggle_btn:focus {
  outline: none;
  box-shadow: 0 0 0 2px #4CC9C8;
}

#productAdditionsDescription .modal-content{
    width: 600px;
    max-width: 100%;
    max-height: 100%;
    display: flex;
    flex-direction: column;
    background-color: white;
}

#productAdditionsDescription .modal-header{
    display: flex;
    flex-shrink: 0;
    padding: 0!important;
}

#productAdditionsDescription .modal-body{
    display: flex;
    overflow-y: auto;
    flex-grow: 1;
    flex-direction: column;
}

#productAdditionsDescription .modal-footer{
    display: flex;
    flex-shrink: 0;
    height: 70px;
    justify-content: center;
    align-items: center;
}

    #productAdditionsDescription .modal-footer .close{
        width: 70%;
    }

/* Kontener galerii */
.gallery-container {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    max-width: 100%;
    flex-direction: row; /* Domyślnie na desktopie w układzie poziomym */
}

.main-image img {
    width: 330px;
    height: 330px;
    object-fit: cover; /* Obraz wypełnia wymiary */
}

/* Wrapper miniatur z przyciskami */
.thumbnails-wrapper {
    display: flex;
    flex-direction: column;
    max-height: 330px;
}

.thumbnails {
    display: flex;
    flex-direction: column; /* Ustawienie miniatur w pionie */
    overflow-y: auto;
    max-height: 260px; /* 3 miniatury po 80px + marginesy */
    width: 100px; /* Szerokość miniatur */
    scrollbar-width: none;
}

.thumbnails::-webkit-scrollbar {
    display: none;
}

.thumbnails img {
    width: 80px;
    height: 80px;
    margin-bottom: 10px;
    cursor: pointer;
    transition: transform 0.2s ease-in-out;
    object-fit: cover;
}

.thumbnails img:hover {
    transform: scale(1.1);
}

/* Przyciski nawigacyjne */
.nav-btn {
    background-color: #f0f0f0;
    border: none;
    padding: 0;
    cursor: pointer;
    height: 25px;
    font-size: 12px;    
    width: 80px; /* Pełna szerokość miniatury */
}

.thumbnails-wrapper .prev {
    margin:  0 0 9px 0;
}

.thumbnails-wrapper .next {
    margin: 9px 0 0 0;
}

.nav-btn:hover {
    background-color: #005E58;
    color: #FFFFFF;
}

/* Tylko elementy wewnątrz additions_products_row (koszyk)*/
.additions_products_row {
  display: flex;
  flex-wrap: nowrap;           /* jeden rząd */
  overflow-x: auto;            /* poziomy scroll jeśli za szeroko */
  gap: 1rem;
  scroll-behavior: smooth;
  padding: 0.5rem 0.5rem 1rem 0.5rem;
}

/* scrollbar tylko w tym elemencie */
.additions_products_row::-webkit-scrollbar {
  height: 8px;
}
.additions_products_row::-webkit-scrollbar-thumb {
  background-color: rgba(0,0,0,0.2);
  border-radius: 4px;
}

/* Produkt w kolumnie */
.additions_products_row .chk_container_product_additions {
  flex: 0 0 auto;
  width: 180px;               /* większa szerokość na desktop */
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 0.5rem;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

.additions_products_row .span_container {
    display: flex;
    flex-direction: column;  /* ustaw kolumnę, aby dzieci były jedno pod drugim */
    align-items: center;     /* wyśrodkowanie w poziomie */
    text-align: center;
    gap: 0.25rem;            /* odstęp między nazwą a ceną */
    padding: 0;                 /* usuń padding */
    margin-top: 0.5rem;        /* odstęp od góry */
}

.additions_products_row .span_text_wrapper {
    display: flex;
    flex-direction: column;  /* nazwa i "View product" też jedno pod drugim */
    align-items: center;
}

/* Tekst produktu: ograniczenie szerokości, aby nie rozciągał */
.additions_products_row .chk_container_product_additions .span_name {
  font-weight: normal;            /* lżejsza czcionka */
  font-size: 0.9rem;           /* mniejsza czcionka, mieści się lepiej */
  margin-bottom: 0.25rem;
  display: -webkit-box;
  -webkit-line-clamp: 4;       /* maks 3 linie tekstu */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;      /* zapobiega wychodzeniu poza box */
}

/* View product */
.additions_products_row .chk_container_product_additions .view_product {
  font-size: 0.85rem;
  cursor: pointer;
  margin-bottom: 0.25rem;
}

/* Cena */
.additions_products_row .chk_container_product_additions .price {
  font-weight: 600;
  font-size: 0.95rem;          /* nieco mniejsza czcionka */
  margin-bottom: 0.5rem;
  word-break: break-word;  
}

/* Przycisk dodaj do koszyka */
.additions_products_row .chk_container_product_additions form {
  width: 100%;
}
.additions_products_row .chk_container_product_additions form button {
  width: 100%;
}

/* Obraz produktu */
.additions_products_row .chk_container_product_additions img {
    width: 150px;
}

.additions_products_row .btn {
    font-weight: 400;
}
#close-offer {
    font-weight: 400;
}

/* Układ na mobilnych */
@media (max-width: 1024px) {
  .additions_products_row .chk_container_product_additions {
    width: 160px;              /* tablet/mniejsze ekrany */
  }
  .additions_products_row .chk_container_product_additions img {
        width: 140px;
    }
}

@media (max-width: 768px) {

    .additions_products_row .chk_container_product_additions {
        width: 140px;
    }

    .additions_products_row .chk_container_product_additions img {
        width: 120px;
    }
    .additions_products_row .btn {
        font-size: 0.7rem!important;
        padding: 5px 2px 5px 2px;
    }
    
    .gallery-container {
        flex-direction: column; /* Układ w pionie na mobilnych */
        align-items: center;
    }

    .thumbnails-wrapper {
        flex-direction: row;
        max-height: none;
        max-width: 330px;
        width: 100%;
    }

    .thumbnails {
        flex-direction: row; /* Miniatury w poziomie */
        max-width: 260px;
        overflow-x: auto; /* Możliwość przewijania poziomego */
        scrollbar-width: none; /* Firefox: ukrywamy pasek przewijania */
        width: 100%;
    }

    .thumbnails::-webkit-scrollbar {
        display: none; /* Chrome, Safari: ukrywamy pasek przewijania */
    }

    .thumbnails img {
        width: 80px;
        height: 80px;
        margin-right: 10px;
        margin-bottom: 0;
    }

    .nav-btn {
        height: auto;
        width: 25px;
        padding: 0;
    }

    .thumbnails-wrapper .prev {
        margin: 0 9px 0 0;
    }
    
    .thumbnails-wrapper .next {
        margin: 0 0 0 9px ;
    }

    .btn_close{
        display: block;
    }
}

@media (max-width: 400px) {
    .main-image img {
        width: 280px;
        height: 280px;
        object-fit: cover; /* Obraz wypełnia wymiary */
    }

    .thumbnails img {
        width: 70px;
        height: 70px;
        margin-right: 5px;
        margin-bottom: 0;
    }

    .thumbnails-wrapper {
        max-width: 280px;
        width: 100%;
    }

    .thumbnails {
        max-width: 225px;
    }
}