body {
    #background-color: #d1d1d1; /* Szare tło */
}

html, body {
    height: 100%; /* Ustawia wysokość na 100% okna przeglądarki */
    margin: 0;
}
h2 {
    background-color: #fff; /* Białe tło dla lepszej widoczności */
    padding: 15px 20px; /* Wewnętrzne odstępy */
    border-radius: 8px; /* Zaokrąglenie rogów */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Delikatny cień dla trójwymiarowości */
    border: 1px solid #ddd; /* Cienkie, jasne obramowanie */
    font-size: 1.3rem; /* Większy rozmiar czcionki */
    font-weight: bold; /* Pogrubiona czcionka */
    text-align: left; /* Wyśrodkowanie tekstu */
    margin: 20px auto; /* Odstęp i wyrównanie na środku */
    font-variant: small-caps;
}
h3 {
    background-color: #fff; /* Białe tło dla lepszej widoczności */
    padding: 15px 20px; /* Wewnętrzne odstępy */
    border-radius: 8px; /* Zaokrąglenie rogów */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Delikatny cień dla trójwymiarowości */
    border: 1px solid #ddd; /* Cienkie, jasne obramowanie */
    font-size: 1.0rem; /* Większy rozmiar czcionki */
    font-weight: bold; /* Pogrubiona czcionka */
    text-align: left; /* Wyśrodkowanie tekstu */
    margin: 20px auto; /* Odstęp i wyrównanie na środku */
    font-variant: small-caps;
}
h4 {
	font-size: 1.3rem; /* Większy rozmiar czcionki */
	font-variant: small-caps;
}
.fc-bg-event {
    opacity: 0.5 !important; /* Ustawienie przezroczystości */
}
.content-wrapper {
    min-height: 100vh; /* Ustawia minimalną wysokość na 100% widoku */
    display: flex;
    flex-direction: column;
}

.main-content {
    flex: 1; /* Wypełnia pozostałą przestrzeń */
}

/* Styl stopki */
.footer-info {
    text-align: center;
    background-color: #f8f9fa; /* Kolor tła stopki, możesz dostosować */
    padding: 20px 0;
    position: relative;
    width: 100%;
}


.login-container {
    margin-top: 50px;
}
.login-card {
    border: none;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden; /* Aby górna i dolna część były równo połączone */
}
.login-card-top {
    background-color: #f8f9fa; /* Ciemna górna część */
    padding: 20px;
    text-align: center;
}
.login-card-top img {
    width: 200px;
    margin-bottom: 10px;
}
.login-title {
    font-size: 20px;
    font-weight: bold;
    color: #121212; /* Jasny tekst */
}
.login-card-bottom {
    background-color: #fffefe; /* Jasna dolna część */
    padding: 20px;
}
.form-label {
    font-weight: bold;
    color: #121212; /* Kolor tekstu etykiety */
	font-variant: small-caps;
	font-size: 0.9rem;
}
.form-control{
	
	font-size: 0.8rem;
}
.login-info {
    font-size: 14px;
    color: #8d8d8d; /* Kolor tekstu pomocniczego */
    text-align: center;
    margin-bottom: 20px;
}
.footer-info {
    text-align: center;
    margin-top: 30px;
    color: #121212; /* Ciemny kolor tekstu */
}

.btn-secondary {
    background-color: #e71c19; /* Kolor przycisku */
    border-color: #cb1212; /* Kolor ramki przycisku */
}
.btn-secondary:hover {
    background-color: #cb1212; /* Kolor po najechaniu */
    border-color: #cb1212;
}
.alert-danger {
    background-color: #cb1212; /* Kolor ostrzeżenia o błędzie */
    border-color: #cb1212;
    color: #fffefe; /* Kolor tekstu w ostrzeżeniu */
}

/* Stylizacja tabeli */
    .custom-table {
        border-radius: 10px; /* Zaokrąglone rogi */
        overflow: hidden; /* Usuwa problemy z zaokrąglonymi rogami w tabelach */
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Delikatny cień */
    }

    /* Stylizacja komórek tabeli */
    .custom-table th, .custom-table td {
        #padding: 15px; /* Większe odstępy w komórkach */
		font-size: 0.8em;
        vertical-align: middle; /* Wyśrodkowanie pionowe */
        background-color: #f9f9f9; /* Jasne tło */
        border: 1px solid #ddd; /* Delikatne obramowanie */
    }

/* Dodanie cienia do wszystkich elementów input, textarea oraz select */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="date"],
input[type="number"],
input[type="tel"],
input[type="submit"],
input[type="datetime-local"],
textarea,
select {
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); /* Delikatny cień */
    border-radius: 5px; /* Zaokrąglone rogi dla lepszego efektu */
    border: 1px solid #ccc; /* Delikatna ramka */
    padding: 10px; /* Odstęp wewnętrzny */
    transition: box-shadow 0.3s ease; /* Płynne przejście cienia */
}

/* Efekt hover dla inputów */
input[type="text"]:hover,
input[type="email"]:hover,
input[type="password"]:hover,
input[type="date"]:hover,
input[type="number"]:hover,
input[type="tel"]:hover,
input[type="datetime-local"]:hover,
textarea:hover,
select:hover {
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2); /* Większy cień przy najechaniu myszką */
}

/* Dodatkowy efekt focus */
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="date"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="datetime-local"]:focus,
textarea:focus,
select:focus {
    box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.3); /* Jeszcze mocniejszy cień przy aktywnym polu */
    outline: none; /* Usunięcie domyślnego obramowania */
    border-color: #e71c19; /* Kolor obramowania po aktywacji */
}
.ms-alert {
	background-color: #e71c19;
	color: white;
}
.progress {
    background-color: #848484; /* tło dla pustego paska */
    position: relative; /* Pozycjonowanie dla tekstu */
}

.progress-bar {
    background-color: #00008b; /* Ciemnoniebieski kolor wypełnienia */
    color: white; /* Biały tekst */
    #font-weight: bold;
}

.progress-text {
    position: absolute;
    width: 100%;
    left: 0;
    top: -2px;
    text-align: center;
    #font-weight: bold;
    color: white; /* Biały tekst */
    z-index: 2; /* Nad tłem paska */
}

@media (max-width: 768px) {
    .progress-container {
        display: none; /* Ukryj pasek postępu w wersji mobilnej */
    }

    .progress-icon {
        font-size: 1.5rem; /* Ikona postępu, aby była dobrze widoczna */
        text-align: center;
    }
}
.legend {
    font-size: 0.9rem; /* Możesz dostosować wielkość czcionki */
    background-color: #f8f9fa;
    padding: 10px;
    border-radius: 5px;
}


.changed {
        background-color: #ffdddd; /* Jasnoczerwony kolor dla zmienionych wartości */
    }
	
.delete-icon {
    color: white;  /* Ustawia kolor tekstu na biały */
}


.rodzic { /* edycja studenta */
	
}


	
        /* Dodajemy przewijanie poziome dla tabeli */
        .table-responsive {
            overflow-x: auto;
        }

        .clickable-day {
            cursor: pointer;
        }


		.new-menu-icon {
    background-color: #dc3545; /* Czerwone tło */
}

.calendar-table {
            table-layout: fixed;
            width: 100%;
        }
        .calendar-table th, .calendar-table td {
            text-align: center;
            vertical-align: middle;
            #height: 100px;
            #cursor: pointer;
        }
        .calendar-table td.clickable-day:hover {
            background-color: #e9ecef;
        }
        @media (max-width: 768px) {
            .calendar-table th, .calendar-table td {
                height: 80px;
                font-size: 12px;
            }
        }