/*
Plugin Name: Burzyński Bull Stats
Description: Custom styles for the Burzyński Bull Stats plugin.
*/

/* General table container styling */
.bull-table-container {
    overflow-x: auto; /* Enable horizontal scrolling on small screens */
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
    background-color: #ffffff;
}

/* Table styling */
.bull-table {
    width: 100%;
    border-collapse: collapse;
    font-family: "Inter", sans-serif;
    font-size: 13px; /* Zwiększono rozmiar czcionki */
    line-height: 1.5;
    table-layout: auto;
}

/* Table header styling */
.bull-table-container .bull-table thead tr th {
    background-color: #2563eb; /* A nice blue */
    color: #ffffff;
    font-weight: 600;
    letter-spacing: 0px; /* Zgodnie z podanym Custom CSS */
    border-bottom: 2px solid #1e40af; /* Darker blue for separation */
    cursor: pointer;
    font-size: 11px; /* Zgodnie z podanym Custom CSS */
    white-space: normal; /* Pozwala na zawijanie tekstu nagłówka */

    /* Usunięto style do obrotu, zastosowano podane wartości */
    transform: none !important; /* Upewnia się, że żadna transformacja nie jest stosowana */
    transform-origin: center center; /* Resetuje punkt obrotu do domyślnego, choć nie jest używany z 'transform: none' */

    width: 140px; /* Zgodnie z podanym Custom CSS */
    height: 20px; /* Zgodnie z podanym Custom CSS */
    text-align: left; /* Zgodnie z podanym Custom CSS */
    vertical-align: bottom; /* Zgodnie z podanym Custom CSS */
    box-sizing: border-box; /* Zapewnia, że padding jest wliczony w width/height */
    padding-left: 15px; /* Zgodnie z podanym Custom CSS */
    padding-top: 5px; /* Dodano, aby tekst nie był przycięty na górze przy małej wysokości */
    padding-right: 5px; /* Dodano, aby tekst nie był przycięty na prawej */
    padding-bottom: 5px; /* Dodano, aby tekst nie był przycięty na dole */
}

.bull-table-container .bull-table thead tr th:hover {
    background-color: #1e40af; /* Slightly darker on hover */
}

/* Table body row styling */
.bull-table-container .bull-table tbody tr {
    border-bottom: 1px solid #e5e7eb; /* Light gray border */
    transition: background-color 0.2s ease-in-out;
}

.bull-table-container .bull-table tbody tr:nth-child(even) {
    background-color: #f9fafb; /* Lighter background for even rows */
}

.bull-table-container .bull-table tbody tr:hover {
    background-color: #f3f4f6; /* Subtle hover effect */
}

/* Table cell styling */
.bull-table-container .bull-table tbody tr td {
    padding: 10px 15px;
    vertical-align: middle; /* Wyśrodkowanie pionowe wszystkich komórek */
    color: #374151; /* Dark gray text */
}

/* Special column styling */
.bull-table-container .bull-table tbody tr td[data-label="RODOWÓD:"] {
    white-space: normal;
    word-break: break-word;
    max-width: 150px; /* Ogranicza maksymalną szerokość dla kolumny rodowodu, ale pozwala na zawijanie */
}

/* Numeric columns - prevent wrapping */
.bull-table-container .bull-table tbody tr td[data-label="PF:"],
.bull-table-container .bull-table tbody tr td[data-label="Produkcja:"],
.bull-table-container .bull-table tbody tr td[data-label="Pokrój:"],
.bull-table-container .bull-table tbody tr td[data-label="Rama ciała:"],
.bull-table-container .bull-table tbody tr td[data-label="Nogi i racice:"],
.bull-table-container .bull-table tbody tr td[data-label="Wymię:"],
.bull-table-container .bull-table tbody tr td[data-label="Płodność:"],
.bull-table-container .bull-table tbody tr td[data-label="Mleko KG:"],
.bull-table-container .bull-table tbody tr td[data-label="Tłuszcz KG:"],
.bull-table-container .bull-table tbody tr td[data-label="Tłuszcz %:"],
.bull-table-container .bull-table tbody tr td[data-label="Białko KG:"],
.bull-table-container .bull-table tbody tr td[data-label="Białko %:"],
.bull-table-container .bull-table tbody tr td[data-label="Somatyka:"] {
    white-space: nowrap;
}

/* Styling for flag icons */
.bull-table-container .bull-table tbody tr td .flag-icon {
    width: 20px; /* Adjust flag size as needed */
    height: auto;
    vertical-align: middle;
    margin-right: 5px; /* Space between flags */
}

/* Wyśrodkowanie flag tylko w kolumnie Wycena */
.bull-table-container .bull-table td[data-label^="Wycena"] {
    text-align: center;
    vertical-align: middle;
}
.bull-table-container .bull-table td[data-label^="Wycena"] .flag-icon {
    display: inline-block;
    vertical-align: middle;
    margin: 0 2px;
}

/* Controls (search, filters, sort) styling */
.bull-table-controls {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
    padding: 15px;
    background-color: #f0f4f8;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.bull-table-controls .filter-container,
.bull-table-controls .sort-container {
    display: contents; /* Usuwamy osobne kontenery, wszystko w jednej linii */
}

.bull-table-controls .filter-group {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
    margin: 0;
}

.bull-table-controls label {
    font-weight: 500;
    color: #4a5568;
    font-size: 13px;
    margin-right: 5px;
    margin-bottom: 0;
}

.bull-table-controls .bull-search-input,
.bull-table-controls .bull-filter,
.bull-table-controls .bull-sort-select,
.bull-table-controls .bull-sort-order-select {
    min-width: 120px;
    width: auto;
    margin-bottom: 0;
}

.bull-table-controls .bull-search-input:focus,
.bull-table-controls .bull-filter:focus,
.bull-table-controls .bull-sort-select:focus,
.bull-table-controls .bull-sort-order-select:focus {
    outline: none;
    border-color: #3b82f6; /* Blue focus border */
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25); /* Light blue shadow */
}

/* Responsive adjustments */
@media (max-width: 900px) {
    .bull-table-controls {
        flex-wrap: wrap;
        gap: 10px;
    }
}

@media (max-width: 768px) {
    .bull-table-controls {
        flex-direction: column;
        align-items: stretch;
        flex-wrap: wrap;
    }

    .bull-table-controls .filter-group {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }

    .bull-table thead {
        display: none; /* Hide table header on small screens */
    }

    .bull-table,
    .bull-table tbody,
    .bull-table tr,
    .bull-table td {
        display: block; /* Make table elements behave like blocks */
        width: 100%;
    }

    .bull-table tr {
        margin-bottom: 15px;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        overflow: hidden;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    }

    .bull-table td {
        text-align: right;
        padding-left: 50%; /* Make space for pseudo-element label */
        position: relative;
        border: none;
        border-bottom: 1px solid #e5e7eb; /* Add border between cells */
        white-space: normal; /* Allow text wrapping in responsive mode */
    }

    .bull-table td:last-child {
        border-bottom: none; /* No border for the last cell */
    }

    .bull-table td::before {
        content: attr(data-label); /* Use data-label for content */
        position: absolute;
        left: 0;
        width: 45%;
        padding-left: 15px;
        font-weight: bold;
        text-align: left;
        color: #1f2937; /* Darker text for label */
    }
}

.bull-table-container .bull-table td[data-label^="Nazwa"] {
    font-weight: 700;
}
