/* colors */
:root {
    /* Timmer gradient */
    --primary-light: #94c12e !important; /*holcim*/
    --primary-dark: #1d4370 !important; /*holcim*/
    --greenDark: #00965f !important;
    --blueLight: #04bbf1 !important; /*holcim*/
    --grayDark: #736e6e; /*holcim*/

    --pink: #e60075; /*holcim*/
    --yellow: #ffd200; /*holcim*/

    --grayHolcim-1: #beb9b4;

    --backgroundColor: #f4f6f8;
    --darkHolcim: #444445;
}

body {
    color: var(--darkHolcim);
}

.login-box-logo {
    height: 100px;
    width: 160px;
}

.login-box-logo img {
    content: url(../img/images/logoHolcim.png);
}

.login-box-logo.pl img,
.login-box-logo.en img {
    content: url(../img/images/logoHolcimLogin.png);
}

header .logo.pl,
header .logo.en {
    background-image: url(../img/images/logoHolcim.png);
}

header .logo {
    height: 64px;
}

.platform-name {
    background-image: url(../img/holcim/platform-name.svg);
    height: 72px;
    width: 461px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-bottom: 32px;
}

/* .platform-name span:nth-child(odd) {
    color: var(--primary-light);
}

.platform-name span:nth-child(2) {
    color: var(--blueLight);
} */

.platform-name span:last-child,
.login-box-title {
    color: var(--primary-dark);
}

.login-box-title {
    border-bottom: 3px solid var(--primary-dark);
}

.date-time:not(:empty)::before {
    border-top: 3px solid var(--primary-dark);
}

.about-event {
    height: 260px;
}

@media (max-width: 992px) {
    .platform-name {
        visibility: hidden;
    }
}

footer.footer-add .copy::before {
    top: -20px;
    left: -100px;
    width: 100px;
    height: 70px;
    background-image: url(../img/images/lafargeLogo.svg);
}

header.dashboard::after {
    content: "";
    position: absolute;
    top: 0;
    left: -50%;
    height: 100%;
    width: 100%;
    background-color: var(--backgroundColor);
    transform: skew(0deg);
    box-shadow: none;
    z-index: 2;

    background-image: none;
}

header.dashboard {
    background-image: url(../img/holcim/backgroundDash.png);
    background-size: cover;
}

header.dashboard::before {
    content: "";
    position: absolute;
    top: 96.8%;
    left: -207px;
    transform: translateX(118%);
    width: 51%;
    height: 19.6px;
    background: linear-gradient(
        90deg,
        var(--primary-light) 15%,
        var(--blueLight) 50%,
        var(--primary-dark) 100%
    );
}

.lecturer .nav-el.nav1 .photo {
    background-image: url(../img/holcim/elementIntroLecturer.png);
}

.lecturer .nav-el.nav2 .photo {
    background-image: url(../img/holcim/elementLessonsLecturer.png);
}

.lecturer .nav-el.nav3 .photo {
    background-image: url(../img/holcim/elementExercisesLecturer.png);
}

.lecturer .nav-el.nav4 .photo {
    background-image: url(../img/holcim/elementStudents.png);
}

header.panel {
    background-image: url(../img/holcim/backgroundPanel.png);
}

.collection-background {
    background-image: url("../img/holcim/backgroundCollection.png");
}

.card-photo.entrance {
    background-image: url(../img/holcim/elementEntranceClasses.png);
}

.card-photo.lesson {
    background-image: url(../img/holcim/elementLessonClasses.png);
}

.card-photo.homework {
    background-image: url(../img/holcim/elementHomeworkClasses.png);
}

#classes-exercise-section {
    font-size: 14px;
}

.classes-popup .select-students .group-content .group-element {
    width: 120px;
}

/* strona główna */

.profile .buttons > a > button,
.daily-calendar-box .add-classes > a {
    background-color: var(--primary-dark);
    color: #fff;
    width: 100%;
}

.profile .buttons > a > button:hover,
.daily-calendar-box .add-classes > a:hover,
.collection-add-button:hover,
.classes-invitation button:hover,
.finish-exercise-popup .btn-box button:hover,
#exercise-finish:hover,
#test-finish:hover {
    background: linear-gradient(
        90deg,
        var(--primary-light) 15%,
        var(--blueLight) 50%,
        var(--primary-dark) 100%
    );
}

.title-events span {
    font-weight: bold;
}

.popup-elements > * > .title,
.title-events,
.title-events span {
    color: var(--primary-dark);
}

.popup-elements > * > .title:hover {
    color: var(--primary-light);
}
.nav-el button {
    position: absolute;
    bottom: -5px;
    right: -5px;
    font-size: 40px;
    font-weight: normal;
    /* padding-bottom: 5px; */
    color: var(--primary-dark);
}

.title-events::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 60%;
    height: 5px;
    background: linear-gradient(
        90deg,
        var(--primary-light) 15%,
        var(--blueLight) 50%,
        var(--primary-dark) 100%
    );
    box-shadow: 0px 0px 0px #fff;
}

/* użytkownik */

header.panel {
    background-image: url("../img/holcim/backgroundPanel.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    color: #fff;
    font-size: 30px;
    border: 0;
    border-radius: 0;
    height: 300px;
    position: relative;
}

header.panel::before,
.collection-background::before {
    content: "";
    position: absolute;
    bottom: 0;
    /* left: 50%; */
    transform: translateX(-5%);
    width: 105%;
    height: 16px;
    background: linear-gradient(
        90deg,
        var(--primary-light) 15%,
        var(--blueLight) 50%,
        var(--primary-dark) 100%
    );
}

.panell .list-of-subjects-box .final-grade,
.list-of-subjects-box .final-grade .grade-box .grade,
.finish-exercise-popup .btn-box button,
#exercise-finish,
#test-finish {
    background-color: var(--primary-dark);
    color: #fff;
}

.panell .list-of-subjects-box .final-grade .add-final-grade {
    background-color: var(--primary-dark);
}

.subject-name,
.mail-box .long,
.lesson-subject,
/* .switch-type-of-structures .switch-exam, */
.long {
    color: var(--darkHolcim);
}

.collection-subject-element::after,
.slide::after {
    background: linear-gradient(
        90deg,
        var(--primary-light) 15%,
        var(--blueLight) 50%,
        var(--primary-dark) 100%
    );
}

/* Kalendarz */

.calendar-header {
    padding: 0;
}

.calendar-header::before {
    content: "";
    bottom: 0;
    /* left: 50%; */
    transform: translateX(0%);
    width: 105%;
    height: 16px;
    background: linear-gradient(
        90deg,
        var(--primary-light) 15%,
        var(--blueLight) 50%,
        var(--primary-dark) 100%
    );
}

.select-month .active {
    color: var(--pink);
}

.classes-invitation button {
    background: var(--primary-dark);
}

footer.footer-add .copy.pl::before {
    background-image: url("../img/images/logoHolcim.png");
}

footer.footer-add .copy.en::before {
    background-image: url("..img/images/logoHolcim.png");
}

.orbit-elements-box .long::before,
.presence.not-checked,
.add-users .status {
    background-color: var(--grayHolcim-1);
}

#switch-type-curriculum:checked + label .switch-knowledge {
    color: var(--grayShadow);
}

#switch-type-curriculum:checked + label .switch-skills {
    /* color: var(--granat); */
    color: var(--primary-light);
}

.status.done,
.presence.present {
    background-color: var(--primary-light);
}

.orbit-circle:hover,
.card:not(.active):hover,
.steps > *.active,
.collection-filters .orbit-elements-box .long.active.el3:hover,
.panel-filters .orbit-elements-box .long.active.el3:hover,
.orbit-circle:hover::after,
.switch-type-of-classes .switch-classes,
.activity-box
    + .activity-grade-box
    .activity-stars-box
    .stars-box
    > input:checked
    ~ label,
.activity-box
    + .activity-grade-box
    .group-work-stars-box
    .stars-box
    > input:checked
    ~ label {
    color: var(--primary-light);
}

.select-month,
.main-popup .classes-popup .card,
.orbit-circle,
.login-form-btn-box button,
.switch-type-of-classes .icon-exam,
.exampleImportFile,
#imporStudentsToClassFile,
.user-name,
.remote-box-btn,
.mail-box-btn,
.note-icon-bold::before,
.note-icon-italic::before,
.note-icon-underline::before,
.note-icon-unorderedlist::before,
.btn-text,
.classes .top-box .finish-class,
.classes .top-box .report-class,
a {
    color: var(--primary-dark);
}

/* Moduły */

.collection-background::before {
    transform: translateX(0%);
    width: 100%;
}

.close-popup > div,
.close-math-popup > div {
    background-image: url("../img/holcim/icons/undo.png");
}

.year-prev,
.year-next,
.classes-card-prev::after,
.classes-card-next::after {
    background-image: url("../img/holcim/icons/arrActive.png");
}

.datepicker .prev,
.datepicker .next,
.datepicker .prev:hover,
.datepicker .next:hover {
    background-image: url("../img/holcim/icons/arrowCalendar.png");
}

.daily-calendar-box .more-daily-calendar.active .arrow-icon,
.to-do .arrow-icon,
.list-of-subjects-box .show-more.active .arrow-icon,
.exercise-table .arrow-icon {
    background-image: url(../img/holcim/icons/arrowNav.png);
}

.popup.exercise-add .types-of-questions > * > .title {
    color: var(--primary-dark);
}

.home {
    background-image: url(../img/holcim/icons/menu.png);
}

.datepicker table tr td.active.active,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active.disabled.active,
.datepicker table tr td.active.disabled.disabled,
.datepicker table tr td.active.disabled:active,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active.disabled:hover.active,
.datepicker table tr td.active.disabled:hover.disabled,
.datepicker table tr td.active.disabled:hover:active,
.datepicker table tr td.active.disabled:hover:hover,
.datepicker table tr td.active.disabled:hover[disabled],
.datepicker table tr td.active.disabled[disabled],
.datepicker table tr td.active:active,
.datepicker table tr td.active:hover,
.datepicker table tr td.active:hover.active,
.datepicker table tr td.active:hover.disabled,
.datepicker table tr td.active:hover:active,
.datepicker table tr td.active:hover:hover,
.datepicker table tr td.active:hover[disabled],
.datepicker table tr td.active[disabled],
.datepicker .day.active {
    background-color: var(--primary-light);
    background-image: none;
}