/* Sekcja: price_list - pełny CSS sekcji (zapis zagnieżdżony). */

.price-list {
    .container {
        overflow-x: auto;
    }

    .table-responsive {
        .table {
            margin-bottom: 0;

            tr {
                border-color: var(--element1-content-border);
                border-width: var(--element1-content-border-width);

                th {
                    color: var(--element1-title);
                }

                td {
                    background-color: var(--element1-content-bg);

                    &:hover {
                        background-color: var(--element1-content-bg-hover);
                    }
                }

                &:hover {
                    border-color: var(--element1-content-border-hover);
                }
            }
        }

        .price {
            font-size: 1.6875rem;
            font-weight: 600;
            color: var(--element1-highlighted-title);
            text-align: end;
            white-space: nowrap;
        }

        .price-first {
            border-right: var(--content-border-width) solid var(--element1-content-border);
        }

        .name-second {
            border-left: var(--content-border-width) solid var(--element1-content-border);
            color: var(--element1-text);
        }
    }
}

@media (max-width: 575.5px) {
    .price-list {
        .table-responsive {
            .price {
                font-size: 1.1875rem;
            }
        }
    }
}

@media (min-width: 576px) and (max-width: 767.5px) {
    .price-list {
        .table-responsive {
            .price {
                font-size: 1.25rem;
            }
        }
    }
}

@media (min-width: 768px) and (max-width: 991.5px) {
    .price-list {
        .table-responsive {
            .price {
                font-size: 1.375rem;
            }
        }
    }
}
