/* CSS Document */
        /* Základné CSS pre viackrokový formulár */
        body { font-family: Arial, sans-serif; background: #f4f4f4; padding: 20px; }
        .container { max-width: 800px; margin: auto; background: white; padding: 20px; border-radius: 8px; box-shadow: 0 0 10px rgba(0,0,0,0.1); }
        h2 { text-align: center; color: #333; }
        /* Krok 0 - Pokyny */
        .pokyny-box { background-color: #f9f9f9; border: 1px solid #ddd; padding: 15px; border-radius: 5px; margin-bottom: 20px; }
        .pokyny-box ul { padding-left: 20px; }

        /* Vlastnosti viackrokového formulára - skrytie/zobrazenie */
        .form-step { display: none; } /* Krok formulára je štandardne skrytý */
        .form-step.active { display: block; } /* Aktuálny krok je viditeľný */
        .form-row { display: flex; gap: 20px; margin-bottom: 15px; }
        .form-group { flex: 1; margin-bottom: 15px; }
        .form-group label { display: block; margin-bottom: 5px; font-weight: bold; }
        .form-group input, .form-group select, .form-group textarea { width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; }
        .checkbox-group { display: flex; flex-wrap: wrap; gap: 15px; padding-top: 5px; }
        .controls { margin-top: 20px; display: flex; justify-content: space-between; }
        .btn-nav { padding: 10px 20px; background: #007bff; color: white; border: none; border-radius: 4px; cursor: pointer; }
        .btn-nav:disabled { background: #ccc; }
        .message { padding: 10px; margin-bottom: 20px; border-radius: 4px; }
        .message.success { background: #d4edda; color: #155724; }
        .message.error { background: #f8d7da; color: #721c24; }
        
        /* Step progress bar */
        .progress-bar { display: flex; justify-content: space-between; margin-bottom: 30px; }
        .step { flex: 1; text-align: center; border-bottom: 4px solid #ccc; padding-bottom: 5px; cursor: pointer; }
        .step.active { border-bottom-color: #007bff; font-weight: bold; color: #007bff; }
        
        /* === Responzivita pre Mobily (Zobrazenie jedného súvislého formulára) === */
        @media screen and (max-width: 768px) {
            /* 1. Zrušenie viac-krokového zobrazenia (zobrazenie všetkých krokov naraz) */
            .form-step { display: block !important; } /* Všetky kroky sú viditeľné */
            
            /* 2. Vertikálne zobrazenie riadkov */
            .form-row { flex-direction: column; gap: 0; }
            .form-group { flex: none; width: 100%; }

            /* 3. Skrytie progress baru (kroky nie sú potrebné, ak je formulár súvislý) */
            .progress-bar { display: none; } 
            
            /* 4. Skrytie navigačných tlačidiel (Späť/Ďalej) a zobrazenie len Odoslať */
            #prevBtn, #nextBtn { display: none !important; }
            /* Zabezpečenie, že tlačidlo Odoslať je vždy viditeľné a centrované v spodnej časti*/
            .controls { justify-content: center; }
            #submitBtn { 
                display: block !important; 
                width: 100%; /* Rozšírenie na celú šírku pre mobil */
                max-width: 300px; 
            }

            /* Estetické úpravy pre mobil */
            body { padding: 10px; }
            .container { padding: 15px; }
        }
        
.kategoria-row {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
}