/* ==========================================================================
   Content Table — uniwersalna tabela do treści artykułów (na klasie)
   Wgraj do: wp-content/themes/generatepress_child/content-table.css

   UŻYCIE: dodaj klasę "cp-table" do tabeli w edytorze Gutenberg
   (blok Tabela → panel ustawień z prawej → "Zaawansowane" →
   "Dodatkowe klasy CSS" → wpisz: cp-table)

   Działa bez dodatkowego opakowania w <div> — przewijanie jest na samej
   tabeli (overflow-x wprost na elemencie <table>).
   ========================================================================== */

.cp-table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font-family: "Raleway", sans-serif;
    font-size: 14px;
    margin: 24px 0;
    border: 1px solid #e0ddd2;
    border-radius: 4px;
}

/* Wewnątrz display:block tabeli, thead/tbody/tr muszą zostać "tabelowe",
   inaczej kolumny by się rozjechały */
.cp-table thead {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.cp-table tbody {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.cp-table tr {
    display: table-row;
}

/* Nagłówek — zawsze pogrubiony, ciemna zieleń marki, biały tekst */
.cp-table th {
    display: table-cell;
    background-color: #1E5B41;
    color: #ffffff !important;
    font-weight: 700 !important;
    text-align: left;
    padding: 12px 16px;
    word-break: break-word;
    word-wrap: break-word;
    overflow-wrap: break-word;
    border-bottom: 1px solid #164A34;
    min-width: 120px;
}

/* Wiersze — ciemniejsze wypełnienie niż białe, naprzemienne cieniowanie (zebra) */
.cp-table td {
    display: table-cell;
    padding: 11px 16px;
    color: #2B2B28;
    background-color: #F7F5F0;
    border-bottom: 1px solid #e8e4d8;
    word-break: break-word;
    word-wrap: break-word;
    overflow-wrap: break-word;
    min-width: 120px;
}

.cp-table tr:nth-child(even) td {
    background-color: #EFEBDF;
}

.cp-table tr:last-child td {
    border-bottom: none;
}

/* Linki wewnątrz komórek */
.cp-table td a {
    color: #1E5B41;
    text-decoration: underline;
}

.cp-table td a:hover {
    color: #A32D2D;
}

/* Delikatny cień na krawędziach podczas przewijania, sygnalizujący że
   jest więcej treści w bok (subtelna podpowiedź UX) */
.cp-table {
    background-image:
        linear-gradient(to right, #ffffff, #ffffff),
        linear-gradient(to right, #ffffff, #ffffff),
        linear-gradient(to right, rgba(0,0,0,0.08), rgba(255,255,255,0)),
        linear-gradient(to left, rgba(0,0,0,0.08), rgba(255,255,255,0));
    background-position: left center, right center, left center, right center;
    background-repeat: no-repeat;
    background-color: #ffffff;
    background-size: 20px 100%, 20px 100%, 10px 100%, 10px 100%;
    background-attachment: local, local, scroll, scroll;
}

@media (max-width: 600px) {
    .cp-table th {
        padding: 10px 12px;
        font-size: 13px;
        min-width: 100px;
    }
    .cp-table td {
        padding: 9px 12px;
        font-size: 13px;
        min-width: 100px;
    }
}