/* Dodaj grubszą kreskę na prawo dla kolumny Zełebiant */
th.col-celebrant, td.col-celebrant {
    border-right: 2px solid #666 !important;
}

thead th.col-celebrant,
thead th.col-organist,
thead th.col-mesner,
thead th.col-lektor,
thead th.col-komunia {
    background-color: #88ffc9 !important;
}

/* Nagłówek tabeli powinien być przylegający */

	th {
    position: sticky;
    top: 0;
    background-color: #f4f4f4;
    z-index: 100;
    box-shadow: 0 2px 0 #000;
}

/* Opcjonalnie, aby zapobiec problemom z przekrywaniem się */
table {
    width: 100%;
    border-collapse: collapse;
}

th, td {
    padding: 8px;
    text-align: left;
    border-bottom: 1px solid #ddd;
}



/* --- 1. PODSTAWY --- */
body { font-family: Arial, sans-serif; margin: 10px; color: #333; }
table { border-collapse: collapse; width: 100%; table-layout: fixed; }

th, td {
    border: 1px solid #ccc;
    padding: 4px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: clip;
    font-weight: normal;
    /* Tekst płynnie maleje od 13px do 9px */
    font-size: clamp(9px, 1vw, 13px);
}

th { background: #f4f4f4; position: sticky; top: 0; z-index: 10; font-weight: bold; box-shadow: 0 2px 0 #000; }

.editable { cursor: pointer; }
.filled { background: #e0e0e0; }
.tag-sonntag { background-color: #ffdddd; }
.tag-samstag { background-color: #fff5cc; }
.tag-werktag { background-color: #ddffdd; }

/* --- 2. WEB (KOMPUTER) --- */
@media (min-width: 901px) {
    .col-date      { width: 5%; }
    .col-tag       { width: 6%; }
    .col-place     { width: 10%; text-align: left; }
    .col-time      { width: 5%; }
    .col-x10       { width: 3%; }
    .col-title     { width: 20%; text-align: left; } /* zmniejszony */
    .col-celebrant,
    .col-organist,
    .col-mesner,
    .col-lektor,
    .col-komunia {
    width: 9%; /* wszystkie równe */
}
    .col-del       { width: 3%; padding: 0 !important; }
}

/* --- 3. HANDY (TELEFON) --- */
@media (max-width: 900px) {
    body { margin: 2px; }

	.table-wrapper {
    width: 100%;
    overflow: auto;
    max-height: 80vh;
	}

th, td {
    padding: 3px 1px !important;
    font-size: clamp(8px, 2.5vw, 10px) !important;
}

/* Procenty na komórkę (Suma ok. 100% bez kolumny DEL) */
.col-date  { width: 9% !important; }
.col-tag   { width: 9% !important; }
.col-place { width: 13% !important; text-align: left !important; }
.col-time  { width: 11% !important; }
.col-x10   { width: 6% !important; }
.col-title { width: 18% !important; text-align: left !important; }

/* Pozostałe kolumny dzielą resztę miejsca automatycznie */
.col-celebrant, .col-organist, .col-mesner, .col-lektor, .col-komunia {
    width: auto !important;
}

/* Całkowite wycięcie kolumny DEL z widoku, jeśli jakimś cudem admin wejdzie z telefonu */
.col-del { display: none !important; }

.noadmin-edit {
    background-color: #88ffc9; /* lekko zielony */
}



/* Styling dla nagłówka tabeli */
.sticky-header {
    position: sticky;
    top: 0; /* Możesz dostosować wartość, jeśli masz inne elementy na górze strony */
    z-index: 1; /* Upewnij się, że nagłówek jest powyżej innych elementów */
    background: #a3afff; /* Kolor tła nagłówka, zachowaj zgodność z istniejącym stylem */
    font-weight: bold;
    text-align: center;
}