/* ==========================================================================
   1. STYLE PODSTAWOWE I POLA TEKSTOWE
   ========================================================================== */
/* Zaokrąglone narożniki dla wszystkich pól tekstowych */
input.form-control {
    border-radius: 6px !important;
}

/* Nowe dedykowane style dla inputów w górnej sekcji parametrów */
input.form-control.custom-input {
    border-radius: 6px !important;    /* Zaokrąglone narożniki */
    text-align: center;                /* Wyśrodkowanie zawartości (liczb) w poziomie */
    height: 42px !important;           /* Zwiększona wysokość w pionie o ok. 20% */
    width: 100% !important;            /* Wypełnia kolumnę Bootstrapa */
    max-width: 60px !important;        /* Blokuje szerokość w poziomie na sztywno */
    display: inline-block;
    padding: 6px 2px;                  /* Bezpieczny padding wewnętrzny dla smartfonów */
    
    /* Ukrycie domyślnych strzałek góra/dół dla pól typu number */
    -moz-appearance: textfield;
}

/* Ukrycie strzałek w przeglądarkach Chrome/Safari/Edge */
input.custom-input::-webkit-outer-spin-button,
input.custom-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* ==========================================================================
   2. UKŁAD GÓRNY (OBRAZEK + PARAMETRY OBOK SIEBIE)
   ========================================================================== */
/* Centrowanie obrazka i formularza w pionie i poziomie */
.v-center-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;     /* Środkuje obrazek i formularz w pionie względem siebie */
    justify-content: center; /* Środkuje cały układ na ekranie w poziomie */
}

/* Wyrównanie elementów (label, input, mm) wewnątrz jednego wiersza formularza */
.row-flex {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

/* Wyrównanie etykiet tekstowych (np. "a"=) do prawej strony, bliżej inputów */
.text-right-custom {
    text-align: right;
    padding-right: 10px;
}

/* Usuwa domyślną ramkę oraz wewnętrzne marginesy z bocznego formularza */
.sidebar-parameters fieldset {
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.form-main-heading {
    text-align: center;
}

/* ==========================================================================
   3. LINIA ROZDZIELAJĄCA (HR)
   ========================================================================== */
hr.red-dashed {
    border: none;                  /* Usuwa domyślną ramkę przeglądarki */
    border-top: 2px dashed red;    /* Przerywana, czerwona linia */
    opacity: 1;                    /* Zabezpieczenie przed przezroczystością Bootstrapa */
    max-width: 950px !important;   /* Dokładnie ta sama szerokość co kontenery */
    width: 100% !important;        /* Elastyczność na mniejszych ekranach */
    margin: 30px auto !important;  /* Centrowanie w poziomie na środku strony */
}

/* ==========================================================================
   4. SEKCJA TABELI ORAZ KONTENERY (USTAWIENIA RAMKI I SZEROKOŚCI)
   ========================================================================== */
/* Kontener tworzący ramkę wokół tabeli oraz sekcji kontaktowej */
.table-box-container, 
.final-contact-section {
    max-width: 950px !important;       /* Identyczna szerokość dla obu sekcji */
    width: 100% !important;
    margin: 30px auto !important;      /* Jednakowe wyśrodkowanie w poziomie */
    padding: 20px !important;          /* Identyczny wewnętrzny odstęp */
    background-color: #fff !important; /* To samo czyste, białe tło */
    border: 1px solid #ccc !important; /* Klasyczna, systemowa szara ramka */
    border-radius: 8px !important;     /* Identyczne zaokrąglenie narożników */
}

/* Wyrównanie i centrowanie elementów wewnątrz tabeli */
.custom-flex-table {
    width: 100%;
    margin-bottom: 0 !important;
}

.custom-flex-table th, 
.custom-flex-table td {
    text-align: center;                /* Środkowanie tekstów i nagłówków */
    vertical-align: middle !important; /* Środkowanie w pionie */
    padding: 8px !important;
    border: none !important;           /* Ukrycie standardowych linii tabeli */
}

.header-row th {
    font-size: 13px;
    padding-bottom: 12px !important;
}

.data-row td {
    padding-top: 0 !important;
}

.static-val {
    font-weight: bold;
    font-size: 15px;
    color: #333;
}

.type-cell {
    font-weight: bold;
    font-size: 16px;
}

.table-cell-group {
    margin-bottom: 0 !important;
}

/* dopasowanie dla pola długości pasa i jednostki obok siebie */
.measurement-flex-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

/* ==========================================================================
   8. RESPONSYWNOŚĆ - CZĘŚĆ 1
   ========================================================================== */
@media (max-width: 767px) {
    .v-center-row {
        flex-direction: column;
    }
    /* Bezpieczne skalowanie obrazka również na tabletach */
    .v-center-row img {
        max-width: 100% !important;
        height: auto !important;
        margin-bottom: 20px;
    }
}

@media (max-width: 575.98px) {
    /* skalowanie obrazka na smartfonach */
    .v-center-row img {
        max-width: 100% !important;   /* Obrazek nigdy nie będzie szerszy niż ekran */
        height: auto !important;      /* Zachowanie proporcji */
        display: block;
        margin: 0 auto 15px auto;     /* Wyśrodkowanie i odstęp od elementów poniżej */
    }
    
    .v-center-row {
        align-items: center;
    }
    .row-flex {
        flex-direction: row;    
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;               
    }
    .text-right-custom {
        text-align: center;     
        padding-right: 0;
        width: 100%;            
        margin-bottom: 4px;
    }
    .table-box-container, 
    .final-contact-section {
        margin: 15px auto !important; 
        padding: 12px !important;     
        border-radius: 6px !important;
    }
    .table-box-container {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .custom-flex-table th, 
    .custom-flex-table td {
        padding: 6px 4px !important; 
        font-size: 14px;             
    }
    .header-row th {
        font-size: 11px;             
        padding-bottom: 6px !important;
    }
    .type-cell {
        font-size: 14px;
    }
    .static-val {
        font-size: 13px;
    }
    hr.red-dashed {
        margin: 20px auto !important;
    }
}
  /* ==========================================================================
   5. MENU ROZWIJANE (DROPDOWN)
   ========================================================================== */
.custom-dropdown {
    position: relative;
    display: inline-block;
    width: 100%;
    max-width: 85px;
}

.dropdown-trigger {
    background-color: #fff;
    color: #333;
    padding: 6px 10px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    height: 42px;                  /* Zrównane do 42px z wysokością inputa dla spójności układu */
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #ffffff;
    min-width: 85px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 99;
    border-radius: 6px;
    border: 1px solid #ddd;
    top: 100%;                     /* Przykleja listę do dolnej krawędzi przycisku */
    left: 0;                       /* Wyrównuje do lewej krawędzi przycisku */
    margin-top: 0px;               /* Usuwa przerwę wywołującą znikanie */
}

.dropdown-content a {
    color: #333;
    padding: 8px 12px;
    text-decoration: none;
    display: block;
    text-align: center;
    font-size: 13px;
}

.dropdown-content a:hover {
    background-color: #f1f1f1;
    border-radius: 5px;
}

/* Automatyczne wysunięcie po najechaniu myszką */
.custom-dropdown:hover .dropdown-content {
    display: block;
}

/* Niewidzialny przezroczysty mostek eliminujący miganie/znikanie menu */
.dropdown-content::before {
    content: "";
    position: absolute;
    top: -6px;
    left: 0;
    right: 0;
    height: 6px;
    background: transparent;
}

.unit-dropdown { max-width: 60px; }
.unit-dropdown .dropdown-content { min-width: 60px; }

/* ==========================================================================
   6. SEKCJA KONTAKTOWA NA DOLE (PEŁNA SZEROKOŚĆ)
   ========================================================================== */
/* Styl dla pól tekstowych i textarea w sekcji kontaktowej */
.custom-contact-input,
.custom-contact-textarea {
    border-radius: 6px !important;    /* Zaokrąglone narożniki */
    width: 100% !important;
    max-width: 100% !important;       /* Rozciągnięcie na pełną szerokość ramki */
    box-sizing: border-box !important;
}

.custom-contact-input {
    height: 42px !important;           /* Wysokość spójna z górnymi inputami */
}

.custom-contact-textarea {
    resize: none;                      /* Zablokowanie ręcznego rozciągania */
}

/* przycisk wysyłania zapytania na samym środku */
.custom-final-submit {
    padding: 12px 40px !important;
    font-size: 16px !important;
    font-weight: bold !important;
    border-radius: 6px !important;    /* Zaokrąglone narożniki przycisku */
    background-color: #5cb85c !important; /* Spójny zielony kolor */
    border-color: #4cae4c !important;
    transition: all 0.2s ease-in-out;
    display: inline-block;
}

.custom-final-submit:hover {
    background-color: #449d44 !important;
    transform: scale(1.03);            /* Efekt mikro-powiększenia po najechaniu */
}

/* ==========================================================================
   8. RESPONSYWNOŚĆ - CZĘŚĆ 2
   ========================================================================== */
@media (max-width: 575.98px) {
    .dropdown-content a {
        padding: 12px 14px;            /* Większa strefa dotykowa na telefonie */
        font-size: 14px;               
    }
    .custom-contact-input,
    .custom-contact-textarea {
        font-size: 16px !important;    /* Zapobiega wymuszonemu zoomowi ekranu na iOS */
    }
    .custom-contact-textarea {
        height: 120px;                 /* Dobrze dobrana wysokość pola na smartfonie */
    }
    .custom-final-submit {
        width: 100% !important;        /* Przycisk wysyłania na pełną szerokość ekranu telefonu */
        padding: 14px 20px !important; 
        font-size: 17px !important;
    }
    .custom-final-submit:hover {
        transform: none !important;    /* Wyłączenie mikro-skalowania na ekranach dotykowych */
    }
}
/* ==========================================================================
   7. WYMCENTROWANIE OKNA MODALNEGO (SUKCES WYSYŁKI)
   ========================================================================== */
.custom-modal-backdrop {
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5) !important; /* Przyciemnienie strony w tle */
    z-index: 99999 !important; /* Wymuszenie wyświetlania na samym wierzchu */
    display: none !important; /* Domyślnie całkowicie ukryty */
}

/* Włączenie wyświetlania po otwarciu okna */
.custom-modal-backdrop.in, 
.custom-modal-backdrop.show,
.custom-modal-backdrop[style*="display: block"] {
    display: flex !important;
    align-items: center !important; /* Wyśrodkowanie w pionie na PC i smartfonie */
    justify-content: center !important; /* Wyśrodkowanie w poziomie na PC i smartfonie */
}

/* Kontener samego okna */
.modal-dialog-fixed {
    width: 100%;
    max-width: 400px; /* Szerokość okienka */
    padding: 20px;
    box-sizing: border-box;
    margin: 0 auto;
}

/* wygląd białego okienka */
.custom-modal-content {
    background: #ffffff !important;
    border-radius: 12px !important;
    border: none !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25) !important;
    overflow: hidden;
    font-family: Arial, sans-serif;
}

.modal-header {
    border-bottom: 1px solid #f2f2f2;
    padding: 15px 20px;
    position: relative;
}

.modal-title {
    font-weight: 600;
    color: #333;
    margin: 0;
    font-size: 18px;
}

/* Przycisk X w prawym górnym rogu */
.close {
    position: absolute;
    right: 20px;
    top: 12px;
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #aaa;
}
.close:hover {
    color: #333;
}

/* Zielona ikona sukcesu */
.success-icon {
    font-size: 40px;
    color: #2ecc71;
    background: #e8f8f0;
    width: 70px;
    height: 70px;
    line-height: 70px;
    border-radius: 50%;
    margin: 20px auto 15px auto;
    text-align: center;
}

.modal-success-text {
    font-size: 18px;
    font-weight: bold;
    color: #2ecc71;
    margin: 0 0 20px 0;
    text-align: center;
}

.modal-footer {
    border-top: none;
    text-align: center !important;
    padding: 0 20px 25px 20px;
}

/* przycisk zamknięcia */
.btn-custom-close {
    background-color: #2ecc71;
    color: white;
    border: none;
    padding: 12px 40px;
    font-size: 15px;
    font-weight: 600;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.2s ease;
    width: 100%; /* Przycisk na całą szerokość */
}

.btn-custom-close:hover {
    background-color: #27ae60;
}

/* ==========================================================================
   8. RESPONSYWNOŚĆ - CZĘŚĆ 3
   ========================================================================== */
@media (max-width: 575.98px) {
    .modal-dialog-fixed {
        max-width: 92%;                /* Dopasowanie szerokości modala z lekkim marginesem */
        padding: 10px;                 
    }
    .custom-modal-content {
        border-radius: 8px !important; 
    }
    .modal-header {
        padding: 12px 15px;            
    }
    .modal-title {
        font-size: 16px;               
    }
    .close {
        right: 15px;                   /* Lepsze pozycjonowanie krzyżyka na smartfonie */
        top: 10px;
        font-size: 28px;               /* Powiększenie dla łatwiejszego klikania palcem */
    }
    .success-icon {
        width: 60px;                   /* Lekkie skompaktowanie grafiki sukcesu */
        height: 60px;
        line-height: 60px;
        font-size: 32px;
        margin: 15px auto 10px auto;
    }
    .modal-success-text {
        font-size: 16px;
        margin-bottom: 15px;
    }
    .modal-footer {
        padding: 0 15px 20px 15px;
    }
    .btn-custom-close {
        padding: 12px 20px;
        font-size: 16px;
    }
}

/* --- KOMPLETNY MODUŁ TABELI --- */

/* KLUCZOWY FIX UCINANIA
.custom-flex-table td, 
.custom-flex-table th {
    overflow: visible !important;
    position: relative;
}

/* 1. Resetujemy kontener - brak jakichkolwiek blokad i ucinania */
.table-box-container {
    overflow: visible !important;
    position: relative;
}

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

/* 2. Standardowe pozycjonowanie dropdownów */
.custom-dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    z-index: 99999 !important; /* Wymuszamy najwyższą warstwę */
    background-color: #ffffff;
    box-shadow: 0px 8px 16px rgba(0,0,0,0.2);
    min-width: 110px;
    border: 1px solid #ccc;
    border-radius: 4px;
    top: 100%;
    left: 0;
}

/* Pokazywanie menu */
.dropdown-content.show,
.custom-dropdown:focus-within .dropdown-content {
    display: block !important;
}

/* 3. CSS NA TELEFONY (ekrany poniżej 768px) */
@media screen and (max-width: 768px) {
    /* Ukrywamy standardowy rząd nagłówków, bo nie pasuje do pionowego układu */
    .custom-flex-table .header-row {
        display: none !important;
    }
    
    /* Zamieniamy wiersz danych w pionowy kontener (kartę) */
    .custom-flex-table .data-row {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px;
        padding: 15px;
        border: 1px solid #e0e0e0;
        border-radius: 8px;
        background: #fff;
    }
    
    /* Każda komórka dostaje pełną szerokość */
    .custom-flex-table td {
        display: flex !important;
        align-items: center;
        justify-content: space-between; /* Przycisk po prawej, tekst po lewej */
        width: 100% !important;
        padding: 5px 0 !important;
        border: none !important;
    }
    
    /* Dodajemy automatyczne podpisy przed polami na telefonie */
    .custom-flex-table td::before {
        font-weight: bold;
        color: #333;
        font-size: 14px;
    }
    /* ==========================================================================
       WIELOJĘZYCZNE MAPOWANIE PODPISÓW OD ATRIBUTU LANG W HTML
       ========================================================================== */

    /* --- 1. ANGIELSKI (html lang="en") --- */
    html:lang(en) .custom-flex-table td:nth-child(1)::before { content: "Type:"; }
    html:lang(en) .custom-flex-table td:nth-child(2)::before { content: "Parameter a (mm):"; }
    html:lang(en) .custom-flex-table td:nth-child(3)::before { content: "Parameter b (mm):"; }
    html:lang(en) .custom-flex-table td:nth-child(4)::before { content: "Parameter c (mm):"; }
    html:lang(en) .custom-flex-table td:nth-child(5)::before { content: "Parameter d (mm):"; }
    html:lang(en) .custom-flex-table td:nth-child(6)::before { content: "Parameter e (mm):"; }
    html:lang(en) .custom-flex-table td:nth-child(7)::before { content: "Parameter f (mm):"; }
    html:lang(en) .custom-flex-table td:nth-child(8)::before { content: "Parameter g (mm):"; }
    html:lang(en) .custom-flex-table td:nth-child(9)::before { content: "Belt length:"; }
    html:lang(en) .custom-flex-table td:nth-child(10)::before { content: "Belts quantity:"; }

    /* --- 2. POLSKI (html lang="pl") --- */
    html:lang(pl) .custom-flex-table td:nth-child(1)::before { content: "Typ:"; }
    html:lang(pl) .custom-flex-table td:nth-child(2)::before { content: "Parametr a (mm):"; }
    html:lang(pl) .custom-flex-table td:nth-child(3)::before { content: "Parametr b (mm):"; }
    html:lang(pl) .custom-flex-table td:nth-child(4)::before { content: "Parametr c (mm):"; }
    html:lang(pl) .custom-flex-table td:nth-child(5)::before { content: "Parametr d (mm):"; }
    html:lang(pl) .custom-flex-table td:nth-child(6)::before { content: "Parametr e (mm):"; }
    html:lang(pl) .custom-flex-table td:nth-child(7)::before { content: "Parametr f (mm):"; }
    html:lang(pl) .custom-flex-table td:nth-child(8)::before { content: "Parametr g (mm):"; }
    html:lang(pl) .custom-flex-table td:nth-child(9)::before { content: "Długość pasa:"; }
    html:lang(pl) .custom-flex-table td:nth-child(10)::before { content: "Ilość sztuk:"; }

    /* --- 3. NIEMIECKI (html lang="de") --- */
    html:lang(de) .custom-flex-table td:nth-child(1)::before { content: "Typ:"; }
    html:lang(de) .custom-flex-table td:nth-child(2)::before { content: "Parameter a (mm):"; }
    html:lang(de) .custom-flex-table td:nth-child(3)::before { content: "Parameter b (mm):"; }
    html:lang(de) .custom-flex-table td:nth-child(4)::before { content: "Parameter c (mm):"; }
    html:lang(de) .custom-flex-table td:nth-child(5)::before { content: "Parameter d (mm):"; }
    html:lang(de) .custom-flex-table td:nth-child(6)::before { content: "Parameter e (mm):"; }
    html:lang(de) .custom-flex-table td:nth-child(7)::before { content: "Parameter f (mm):"; }
    html:lang(de) .custom-flex-table td:nth-child(8)::before { content: "Parameter g (mm):"; }
    html:lang(de) .custom-flex-table td:nth-child(9)::before { content: "Riemenlänge:"; }
    html:lang(de) .custom-flex-table td:nth-child(10)::before { content: "Stückzahl:"; }

    /* --- 4. HISZPAŃSKI (html lang="es") --- */
    html:lang(es) .custom-flex-table td:nth-child(1)::before { content: "Tipo:"; }
    html:lang(es) .custom-flex-table td:nth-child(2)::before { content: "Parámetro a (mm):"; }
    html:lang(es) .custom-flex-table td:nth-child(3)::before { content: "Parámetro b (mm):"; }
    html:lang(es) .custom-flex-table td:nth-child(4)::before { content: "Parámetro c (mm):"; }
    html:lang(es) .custom-flex-table td:nth-child(5)::before { content: "Parámetro d (mm):"; }
    html:lang(es) .custom-flex-table td:nth-child(6)::before { content: "Parámetro e (mm):"; }
    html:lang(es) .custom-flex-table td:nth-child(7)::before { content: "Parámetro f (mm):"; }
    html:lang(es) .custom-flex-table td:nth-child(8)::before { content: "Parámetro g (mm):"; }
    html:lang(es) .custom-flex-table td:nth-child(9)::before { content: "Longitud de la correa:"; }
    html:lang(es) .custom-flex-table td:nth-child(10)::before { content: "Cantidad de unidades:"; }

    /* --- 5. FRANCUSKI (html lang="fr") --- */
    html:lang(fr) .custom-flex-table td:nth-child(1)::before { content: "Type:"; }
    html:lang(fr) .custom-flex-table td:nth-child(2)::before { content: "Paramètre a (mm):"; }
    html:lang(fr) .custom-flex-table td:nth-child(3)::before { content: "Paramètre b (mm):"; }
    html:lang(fr) .custom-flex-table td:nth-child(4)::before { content: "Paramètre c (mm):"; }
    html:lang(fr) .custom-flex-table td:nth-child(5)::before { content: "Paramètre d (mm):"; }
    html:lang(fr) .custom-flex-table td:nth-child(6)::before { content: "Paramètre e (mm):"; }
    html:lang(fr) .custom-flex-table td:nth-child(7)::before { content: "Paramètre f (mm):"; }
    html:lang(fr) .custom-flex-table td:nth-child(8)::before { content: "Paramètre g (mm):"; }
    html:lang(fr) .custom-flex-table td:nth-child(9)::before { content: "Longueur de la courroie:"; }
    html:lang(fr) .custom-flex-table td:nth-child(10)::before { content: "Quantité:"; }

    /* --- 6. WŁOSKI (html lang="it") --- */
    html:lang(it) .custom-flex-table td:nth-child(1)::before { content: "Tipo:"; }
    html:lang(it) .custom-flex-table td:nth-child(2)::before { content: "Parametro a (mm):"; }
    html:lang(it) .custom-flex-table td:nth-child(3)::before { content: "Parametro b (mm):"; }
    html:lang(it) .custom-flex-table td:nth-child(4)::before { content: "Parametro c (mm):"; }
    html:lang(it) .custom-flex-table td:nth-child(5)::before { content: "Parametro d (mm):"; }
    html:lang(it) .custom-flex-table td:nth-child(6)::before { content: "Parametro e (mm):"; }
    html:lang(it) .custom-flex-table td:nth-child(7)::before { content: "Parametro f (mm):"; }
    html:lang(it) .custom-flex-table td:nth-child(8)::before { content: "Parametro g (mm):"; }
    html:lang(it) .custom-flex-table td:nth-child(9)::before { content: "Lunghezza della cinghia:"; }
    html:lang(it) .custom-flex-table td:nth-child(10)::before { content: "Quantità:"; }

    /* --- 7. HOLENDERSKI (html lang="nl") --- */
    html:lang(nl) .custom-flex-table td:nth-child(1)::before { content: "Type:"; }
    html:lang(nl) .custom-flex-table td:nth-child(2)::before { content: "Parameter a (mm):"; }
    html:lang(nl) .custom-flex-table td:nth-child(3)::before { content: "Parameter b (mm):"; }
    html:lang(nl) .custom-flex-table td:nth-child(4)::before { content: "Parameter c (mm):"; }
    html:lang(nl) .custom-flex-table td:nth-child(5)::before { content: "Parameter d (mm):"; }
    html:lang(nl) .custom-flex-table td:nth-child(6)::before { content: "Parameter e (mm):"; }
    html:lang(nl) .custom-flex-table td:nth-child(7)::before { content: "Parameter f (mm):"; }
    html:lang(nl) .custom-flex-table td:nth-child(8)::before { content: "Parameter g (mm):"; }
    html:lang(nl) .custom-flex-table td:nth-child(9)::before { content: "Riemlengte:"; }
    html:lang(nl) .custom-flex-table td:nth-child(10)::before { content: "Aantal stuks:"; }

    /* kontener z jednostką miary (mm/m) */
    .measurement-flex-container {
        justify-content: flex-end !important;
    }
} /* <--- Zamknięcie klamry @media screen and (max-width: 768px) */

/* Wymuszenie ukrycia listy po kliknięciu opcji */
.custom-dropdown .dropdown-content.dropdown-hidden {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}