/* Styl dla format-item - kontenera głównego */
.format-item {
    display: block;
    margin-bottom: 15px;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    clear: both;
    overflow: hidden;
}

/* Wspólne style dla wszystkich dodawanych elementów */
.addClix, .addImps, .addScripts, .addURL {
    display: block !important;  /* Każdy element w nowej linii */
   /* width: 100%;                 Pełna szerokość */
    clear: both;                /* Czyści poprzednie elementy */
    float: none;                /* Zapobiega pływaniu */
    margin: 5px 0;              /* Marginesy góra/dół */
}

/* Style dla spanów (etykiet) */
span.addClix, span.addImps, span.addScripts, span.addURL {
    display: block !important;
    font-weight: bold;
    margin-bottom: 2px;
    color: #333;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Specjalny styl dla span-addURL jeśli potrzebuje innego formatowania */
span.span-addURL {
    color: #0066cc;  /* Niebieski kolor dla URL */
}

/* Style dla inputów */
input.addClix, input.addImps, input.addScripts, input.addURL {
    display: block !important;
   /* width: 100%; */
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;     /* Wlicza padding w szerokość */
    font-size: 14px;
    margin-bottom: 10px;        /* Odstęp po inputcie */
}

/* Styl dla inputów z sufiksami (np. addURLL1, addURLL12, addClixL1 itp) */
input[class*="addClix"], 
input[class*="addImps"], 
input[class*="addScripts"], 
input[class*="addURL"] {
    display: block !important;
   /* width: 100%; */
    margin: 5px 0;
}

/* Specjalne style dla drugiego inputa (jeśli potrzebuje innego wyglądu) */
input.addURL2, input[class*="addURL2"] {
    margin-top: 0;
}

/* Style dla br - zapewniają odstępy */
.format-item br {
    display: block;
    content: "";
    margin: 5px 0;
}

/* Dodatkowe style dla lepszego wyglądu gdy wiele linii */
.format-item > br + span {
    margin-top: 10px;  /* Większy odstęp po br */
}

/* Styl dla kontenera gdy wiele elementów */
.format-item > span + input + br {
    margin-bottom: 10px;
}

/* Responsywność - na małych ekranach też blokowo */
@media screen and (max-width: 768px) {
    .addClix, .addImps, .addScripts, .addURL {
        display: block !important;
        /*width: 100% !important;*/
    }
}