/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/

  .table-bordered > thead > tr > th {
    border: 1px solid #dadada;
  }
  .table-bordered > thead > tr > td {
    border: 1px solid #dadada;
  }
  
/* An empty css file for global usage */


@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,700;1,400;1,700&subset=latin,latin-ext&display=swap');

/* Zmienna dla wysokości górnej belki */
:root {
    --top-bar-height: 90px;
    --question-container-max-width: 800px;
    /* Kolory PW */
    --color-pw-sloneczny: rgb(254, 213, 66);
    --color-pw-morelowy: rgb(234, 124, 90);
    --color-pw-sliwkowy: rgb(150, 95, 119);
    --color-pw-mietowy: rgb(105, 186, 156);
    --color-pw-szafirowy: rgb(120, 150, 207);
    --color-pw-wrzosowy: rgb(180, 160, 170);
    --color-pw-grafitowy: rgb(60, 60, 76);
    --color-pw-mokka: rgb(100, 90, 90);
    /* Kolory w motywie */
    --primary: var(--color-pw-szafirowy);
    --secondary: var(--color-pw-mietowy);
    --background: var(--color-pw-grafitowy);
    --warning: var(--color-pw-morelowy);
}

/* Globalnie istotne style START */

/*
    Potrzebne, żeby elementy ::before i ::after nie  były pozycjonowane 
    jako elementy flex
*/

.navbar .container::before, .navbar .container::after,
.question-title-container::before, .question-title-container::after {
    display: none;
}

/* Ogólne ostylowanie elementów kafeterii (radio lub checkbox) po najechaniu */

.radio-item label, .checkbox-item label {
    font-weight: normal;
}

.radio-item:hover label, .checkbox-item:hover label {
	/* font-weight: bold; */
	box-shadow: 0px 2px 0px 0px #0086fa;
}

/*  Żeby tabele nie wypadały poza ramy parenta */

table {
    table-layout: fixed;
}

/* Ostylowanie górnej belki START */

.navbar {
    max-height: var(--top-bar-height);
}

.navbar .container {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	flex-wrap: nowrap;
}

.navbar-header:only-child {
    margin-left: auto;
    margin-right:auto;
}

/*  Wymuszamy 0 paddingu, bo logo ma już pole ochronne */

.navbar-brand {
    padding: 0;
}

/*  Maks tak wysokie logo plus proporcjonalnie szerokość */
.logo {
    max-height: var(--top-bar-height);
    width: 100%;
}

/* Ostylowanie górnej belki KONIEC */

/*  Ostylowanie "ekranu" powitalnego START */

h1.container {
    visibility: hidden;
}

#welcome-container {
    max-width: var(--question-container-max-width);
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5rem;
}

.survey-welcome p {
    margin-bottom: 0;
    margin-block: 0;
    line-height: 1.7;
    text-align: justify;
}

.survey-welcome > p + p {
	margin-top: 1em !important;
}

/*  Ostylowanie ekranu powitalnego KONIEC */

/* Ostylowanie grup pytań i pytań START */

/*  Kontener grupy */
.group-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3rem;
}

/*  Kontener pytania */
.question-container {
    width: 100%;
    max-width: var(--question-container-max-width);
    border: none;
    border-radius: 8px;
    padding: 1.5rem;
    
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    gap: 1rem;
    
    overflow: hidden;
}

/*  Kontener treści pytania */
.question-title-container {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	gap: 1rem;
}


/*  Tekst treści pytania */
.ls-label-question {
    font-size: 1.25rem;
}


/*  Kontener pomocy i walidacji */
/*  Nie ustawiamy paddingu, ponieważ wtedy jest widoczny nawet, gdy to jest puste
    Dlatego ustawimy go z poziomu elelemntów

.question-valid-container {
    
}


/*  Kontener pomocnicznych tekstów */
/*  NOTE: Gdzie jest używany  .ls-questionhelp ? */
.ls-question-help {
	margin-bottom: 0;
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

/*  Kontener odpowiedzi */

/* 
    Żeby wyrównały sie w lewo w nadrzędnym flexie
    oraz pola rozciągały maksymalnie w prawo
*/
.answer-container.container-fluid {
    margin-left: 0;
    margin-right: 0;
}


/* Ostylowanie grup pytań i pytań KONIEC */

/* Ostylowanie konkretnych typów pytań START */

/* Jednokrotnego wyboru (radio) START */

.ls-answers.answers-list.radio-list ul {
	display: flex;
	flex-direction: column;
	gap: 0.5em;
	flex-wrap: nowrap;
}

/* Wielokrotnego wyboru (checkbox) KONIEC */

/* Wielokrotnego wyboru (checkbox) START */

/* W ramach jednej odpowiedzi (checkbox + tekst): flex */
.multiple-opt li {
	display: flex;
	flex-direction: row;
	gap: 0.5em;
	align-content: start;
	align-items: start;
	flex-wrap: nowrap;
}

/* Wielokrotnego wyboru (checkbox) KONIEC */

/* Wielokrotnego wyboru (checkbox) z komentarzem START */

/* W ramach jednej odpowiedzi (checkbox + tekst): flex */

.multiple-opt-comments .checkbox-item {
    display: flex;
	flex-direction: row;
	gap: 0.5em;
	align-content: start;
	align-items: baseline;
	flex-wrap: nowrap;
}

.multiple-opt-comments .checkbox-item label {
    text-align: left;
}

.group-description {
    
    background-color: transparent;
}

.logo-container>img {
    max-height: 100px;
    max-width: 384px;
}

body .top-container {
    margin-bottom: 0px;
    margin-top: 0px;
}

.top-container {
    margin-bottom: 0px;
    margin-top: 0px;
}

/*
tbody .ls-label-xs-visibility {
    margin-left: 0px;
    overflow-x: visible;
    overflow-y: visible;
}
*/

/* Specjalna klasa dla pytania maski TEKST - granatowy tekst na białym tle */

.white-text-19 .question-valid-container {
	display: none;
}

.white-text-19 .question-text,
.white-text-19 .question-title-container,
.white-text-19 .question-title-container p {
    font-size: 19px;
    background-color: transparent; /*#ffff*/
    color: #2c3e50;
}
/* Wielokrotnego wyboru (checkbox) z komentarzem KONIEC */