/* Reset i główny kontener */
.download { 
    list-style: none !important; 
    padding: 0 !important; 
    margin: 0 0 20px 0;
}

/* Wygląd pojedynczego kafelka (Flexbox) */
.download li {
    border: 1px solid #ccc;
    width: 100%;
    padding: 15px;
    margin-bottom: 10px;
    box-sizing: border-box;
    /* Kluczowe właściwości Flexbox: */
    display: flex;
    justify-content: space-between; /* Rozsuwa elementy na boki, gdy są w jednej linii */
    align-items: center;
    flex-wrap: wrap; /* Pozwala na zawijanie wierszy */
    gap: 10px 20px;
}



/* Wygląd linku */
.download a {
    padding-left: 35px; /* Miejsce na ikonkę */
    min-height: 24px; /* Zapewnia miejsce na ikonkę nawet przy krótkim tekście */
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    color: #0056b3; /* Upewnij się, że kontrast koloru linku do białego tła to min. 4.5:1 (WCAG) */
    font-weight: 500;
    line-height: 1.4;
    background-position: left center !important; /* Środkowanie ikony w pionie */
}

/* Stany najechania i fokusu (WCAG) */
.download a:hover, 
.download span:hover, 
.download a:hover span { 
    text-decoration: underline; 
}

/* Wyraźny fokus dla nawigacji klawiaturą */
.download a:focus-visible {
    outline: 3px solid #ffcc00; /* Kolor fokusu - dostosuj do kolorystyki urzędu */
    outline-offset: 4px;
    border-radius: 2px;
}

/* Metadane (rozmiar, data) */
.download .size {
    font-size: 0.9em;
    color: #555;
    /* Usunięto margin-left: auto oraz text-align: right! */
    /* Dzięki temu po zawinięciu element naturalnie ustawi się po lewej stronie */
}

/* --- Sekcja z Ikonami (Twoje ikony bez zmian) --- */
.download .doc  { background:url(/tpls/Noe/img/download-light/doc.png) no-repeat; }
.download .docx { background:url(/tpls/Noe/img/download-light/docx.png) no-repeat; }
.download .pdf  { background: url(/files/pdf.svg) no-repeat; } /* Pamiętaj, żeby wybrać jedno źródło dla PDF */
.download .doc  { background:url(/tpls/Noe/img/download-light/doc.png) no-repeat; }
.download .docx   { background:url(/tpls/Noe/img/download-light/docx.png) no-repeat; }
.download .file   { background:url(/tpls/Noe/img/download-light/file.png) no-repeat; }
.download .flv  { background:url(//tpls/Noe/img/download-light/flv.png) no-repeat; }
.download .mov  { background:url(/tpls/Noe/img/download-light/mov.png) no-repeat; }
.download .mp3  { background:url(/tpls/Noe/img/download-light/mp3.png) no-repeat; }
.download .mp4  { background:url(/tpls/Noe/img/download-light/mp4.png) no-repeat; }
.download .odp  { background:url(/tpls/Noe/img/download-light/odp.png) no-repeat; }
.download .ods  { background:url(/tpls/Noe/img/download-light/ods.png) no-repeat; }
.download .odt  { background:url(/tpls/Noe/img/download-light/odt.png) no-repeat; }
.download .ppt  { background:url(/tpls/Noe/img/download-light/ppt.png) no-repeat; }
.download .pptx   { background:url(/tpls/Noe/img/download-light/pptx.png) no-repeat; }
.download .rar  { background:url(/tpls/Noe/img/download-light/rar.png) no-repeat; }
.download .rtf  { background:url(/tpls/Noe/img/download-light/rtf.png) no-repeat; }
.download .swf  { background:url(/tpls/Noe/img/download-light/swf.png) no-repeat; }
.download .xls  { background:url(/tpls/Noe/img/download-light/xls.png) no-repeat; }
.download .xlsx   { background:url(/tpls/Noe/img/download-light/xlsx.png) no-repeat; }
.download .zip  { background:url(/tpls/Noe/img/download-light/zip.png) no-repeat; }
.download .jpg   { background:url(/tpls/Noe/img/download-light/jpg.png) no-repeat; }
.download .jpeg   { background:url(/tpls/Noe/img/download-light/jpg.png) no-repeat; }
.download .png  { background:url(/tpls/Noe/img/download-light/png.png) no-repeat; }
.download .html   { background:url(/tpls/Noe/img/download-light/html.png) no-repeat; }

/* --- RWD: Dostosowanie do urządzeń mobilnych --- */
@media only screen and (max-width: 768px) {
    .download li {
        flex-direction: column;
        align-items: flex-start;
        padding: 12px;
    }
    
    .download a {
        font-size: 15px;
        width: 100%;
    }

    .download .size {
        font-size: 13px;
        text-align: left;
        width: 100%;
        margin-left: 0;
        padding-left: 35px; /* Wyrównanie tekstu rozmiaru do tekstu linku (pominięcie ikony) */
        color: #666;
    }
}



.fix_img img { display:none; }
