* {
    margin: 0;
    padding: 0;
	outline: none;
}

body {
	color: #333;
	font-size: 15px;
	background-color: #eaeef6;
	line-height: 26px;
	font-weight: 400;
	font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
}

a:active, a:focus {
	outline: 0 !important;
	border: none !important;
	-moz-outline-style: none !important;
}
img {
    max-width: 100% !important;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	padding: 0;
	line-height: normal;
}
.userSelect {
	background-color: #fafafa;  
	border-bottom: 1px solid #0745a7;
	border-radius: 5px;
	padding: 10px;
	margin: 0 10px;
	min-width: max-content;
}
.modal-dialog {
	max-width: 700px !important;
	margin: 1.75rem auto;
}
.tab-content {
	display: none;
}
ul.tabs {
	display: flex;
	gap: 24px;
	padding: 20px;
	background: #eaeaea;
	margin: 20px auto;
}
ul.tabs li.active {
	border-bottom: 2px solid #333;
}
label {
	display: inline-block;
	min-width: 120px;
	margin-bottom: 12px;
}
.tab-content.active {
	display: block;
}
a,
a:hover,
a:focus,
a:active {
	outline: none;
	text-decoration: none;
}

button,
button:focus,
button:active,
button:hover {
	outline: none;
}

p, ul {
	margin: 0;
}

ul { list-style: none; }
strong { font-weight: 600; }

.container-fluid {
	max-width: 100%;
    width: 1280px;
    margin-right: auto;
    margin-left: auto;
}

.container-wrapper {
	padding-left: 30px;
	padding-right: 30px;
}

.auth {
	height: 100vh;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}

.auth .auth-form {
	width: 460px;
	background: #fff;
	padding: 50px;
	border: 1px solid #eee;
	-webkit-box-shadow: 0 22px 24px 0 rgb(0 0 0 / 5%);
    box-shadow: 0 22px 24px 0 rgb(0 0 0 / 5%);
}

/* HEADER */

.header {
	position: absolute;
	background-color: #fff;
	left: 0;
	top: 0;
	right: 0;
}

/* SIDEBAR */

.sidebar {
	position: fixed;
	background-color: #fff;
	left: 0;
	top: 0;
	bottom: 0;
	width: 220px;
	padding: 20px;
	max-height: 100vh;
	overflow-y: auto;
}

.sidebar::-webkit-scrollbar {
	width: 1px;
}

.sidebar::-webkit-scrollbar-track {
	background-color: transparent;
}

.sidebar::-webkit-scrollbar-thumb {
	background-color: #b8b8b8;
	border-radius: 1px;
	background-clip: content-box;
}

.sidebar::-webkit-scrollbar-thumb:hover {
	background-color: #aaa;
}

.sidebar .logo {
	text-align: center;
	max-width: 100%;
	margin: 0 auto;
	margin-bottom: 20px;
}

.sidebar .logo img {
	max-width: 100%;
}

.sidebar ul {
	margin: 0;
	padding: 0;
}

.sidebar ul li {
	text-align: center;
}

.sidebar ul li a {
	display: block;
	color: #000;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: 11px;
	border-bottom: 1px solid #ebebeb;
	padding: 15px 0 10px 0;
}

.sidebar ul li a i {
	display: block;
	color: #9dc4ff;
}

.sidebar ul li:first-child a {
	border-top: 1px solid #ebebeb;
}

.sidebar ul li a.active,
.sidebar ul li a:hover {
	background-color: #f4f9fc;
	color: #9dc4ff;
}

/* CONTENT */

.content {
	position: relative;
	margin: 30px;
	margin-top: 60px;
	margin-left: 240px;
}

.content .content-body {
	padding: 20px;
	background-color: #fff;
	-webkit-box-shadow: 0 22px 24px 0 rgb(0 0 0 / 5%);
	box-shadow: 0 22px 24px 0 rgb(0 0 0 / 5%);
} 

.content a.history-back {
	display: inline-block;
	color: #000;
	margin-bottom: 20px;
	position: relative;
	padding-left: 40px;
	font-weight: 500;
}

.content a.history-back i {
	position: absolute;
	left: 0;
	top: -5px;
	transform: rotate(180deg);
}

.content .section-title {
	margin-bottom: 30px;
}

.content .section-title.in-flex {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: center;
}

.content h1 {
	font-size: 20px;
	margin-bottom: 30px;
}

.content .section-title h1 {
	margin-bottom: 0px;
}

.content h1 i {
	padding-right: 5px;
	position: relative;
	top: 5px;
}

.content h1 [class^="flaticon-"]:before,
.content h1 [class*=" flaticon-"]:before,
.content h1 [class^="flaticon-"]:after,
.content h1 [class*=" flaticon-"]:after { 
	font-size: 24px;
}

/* PAGE MENU */

.page-menu {
}

.page-menu ul {
	margin: 0;
	padding: 0;
}

.page-menu ul li {
	float: left;
}

.page-menu ul li a {
	display: block;
	background: #9dc4ff;
	padding: 7px 20px;
	color: #000;
	font-weight: 600;
}

.page-menu ul li a.active {
	background: #fff;
}

.average span {
	background-color: #eee;
	font-size: 11px;
	text-transform: uppercase;
	line-height: 11px;
	display: inline-block;
	padding: 5px 10px;
	border-radius: 6px;
}

.average span strong {
	color: #0d6efd;
}

/* STATS */

.stats {
	display: flex;
	flex-direction: column;
}

.stats .item {
	display: flex;
	align-items: center;
	margin-bottom: 30px;
	border: 1px solid #ddd;
	-webkit-box-shadow: 0 22px 24px 0 rgb(0 0 0 / 5%);
    box-shadow: 0 22px 24px 0 rgb(0 0 0 / 5%);
	border-radius: 5px;
}

.stats .item:last-child {
	margin-bottom: 0px;
}

.stats .item .stat-value {
	width: 180px;
	padding: 20px 0;
	text-align: right;
	border-right: 6px solid #44b1c9;
	position: relative;
}

.stats .item .stat-value span {
	font-size: 18px;
	font-weight: 700;
	padding: 0 20px;
}

.stats .item .stat-info {
	padding: 0 20px;
	width: 100%;
	position: relative;
}

.stats .item .stat-info span {
	position: absolute;
	right: 20px;
	top: 50%;
	transform: translateY(-50%);
	text-transform: uppercase;
	font-weight: 600;
	letter-spacing: 2px;
	font-size: 11px;
	cursor: pointer;
	color: #007bff;
}

.stats .item .stat-info.full-flex {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.stats .item .stat-info.full-flex .buttons {
	margin-left: auto;
}

.stats .item .stat-info.full-flex .buttons a {
	display: block;
	padding: 5px 20px;
	background: #9dc4ff;
	color: #fff;
	border-radius: 24px;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 12px;
}

/* BOOKS */

.books {
}

.books .item {
	background: #fff;
	border: 1px solid #ddd;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 10px;
	margin-bottom: 20px;
	border-left: 3px solid #000;
}

.books .item.level1 {
	border-color: #9dc4ff;
}

.books .item a {
	
}

.books .item .item-details {
	padding-top: 5px;
	margin-top: 10px;
	border-top: 1px solid #ddd;
	font-size: 11px;
	font-weight: 500;
}

.books .item a h5 {
	display: block;
	color: #000;
	font-size: 16px;
    font-weight: 400;
}

.books .item a h5 small {
	font-size: 14px;
    font-weight: 400;
}

.books .item.level1 a h5 {
	color: #9dc4ff;
    font-weight: 700;
}

.books .item a h5 i {
	position: relative;
	top: 4px;
	padding-right: 3px;
}

.books .item a h5 [class^="flaticon-"]:before,
.books .item a h5 [class*=" flaticon-"]:before,
.books .item a h5 [class^="flaticon-"]:after,
.books .item a h5 [class*=" flaticon-"]:after { 
	font-size: 18px;
}

.books .item a h5.new {
    font-weight: 600;
}

.books .item:hover a {
	color: #9dc4ff;
}

.rating {
	background-color: #e7e7e7;
	font-size: 11px;
	letter-spacing: 2px;
	font-weight: 600;
	border-radius: 6px;
	line-height: 11px;
	padding: 5px 10px;
	color: #000;
	text-transform: uppercase;
}

.rating.rating-1 {
	background-color: #cff3f8;
	color: #000;
}

.rating.rating-2 {
	background-color: #b1e5d3;
	color: #000;
}

.rating.rating-3 {
	background-color: #d1532c;
	color: #fff;
}

/* PRESENTS */

.presents {
	display: flex;
	flex-direction: column;
}

.presents .item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;
}

.presents .item:last-child {
	margin-bottom: 0px;
}

.presents .item > span {
	width: 50%;
	padding: 10px;
}

.presents .item > span button {
	margin-left: 10px;
	font-size: 11px;
	text-transform: uppercase;
	font-weight: 500;
	line-height: 11px;
	display: inline-block;
	padding: 3px 5px;
	border: 0;
}

.presents .item > span:last-child {
	background: #f4f9fc;
	text-transform: uppercase;
	font-weight: 500;
}

/* WORKS LIST */

.works-list .item {
	padding: 15px;
	border-radius: 5px;
	border: 1px solid #ddd;
	margin-bottom: 15px;
}

.works-list .item:last-child {
	margin-bottom: 0px;
}

.works-list .item .item-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	border-bottom: 1px solid #ddd;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

.works-list .item .item-header span {
	color: #000;
}

.works-list .item .item-header span small {
	color: #999;
}

.works-list .item .item-header i {
	padding-right: 5px;
	position: relative;
	top: 2px;
}

.works-list .item .item-header span i {
	color: #9dc4ff;
}

.works-list .item .item-header [class^="flaticon-"]:before,
.works-list .item .item-header [class*=" flaticon-"]:before,
.works-list .item .item-header [class^="flaticon-"]:after,
.works-list .item .item-header [class*=" flaticon-"]:after { 
	font-size: 16px;
}

/* DISCUSSIONS */

.latest-discussions .item {
	display: flex;
	align-items: center;
	border: 1px solid #ddd;
	margin-bottom: 15px;
	padding: 0 15px;
	border-radius: 5px;
}

.latest-discussions .item:last-child {
	border-bottom: 0px;
}

.latest-discussions .item span {
	color: #999;
}

.latest-discussions .item a {
	padding-left: 15px;
	padding-right: 15px;
}

.latest-discussions .item p {
	border-left: 6px solid #9dc4ff;
	padding: 15px 0;
	padding-left: 15px;
}

.latest-discussions .item p img {
	max-height: 100%;
}

.latest-discussions .item i {
	position: relative;
	top: 3px;
	padding-right: 3px;
}

.latest-discussions .item [class^="flaticon-"]:before,
.latest-discussions .item [class*=" flaticon-"]:before,
.latest-discussions .item [class^="flaticon-"]:after,
.latest-discussions .item [class*=" flaticon-"]:after { 
	font-size: 16px;
}

.discussions {
	
}

.discussions .item {
	border: 1px solid #ddd;
	border-radius: 5px;
	padding: 20px;
	margin-bottom: 30px;
	border-left: 6px solid #9dc4ff;
	-webkit-box-shadow: 0 22px 24px 0 rgb(0 0 0 / 5%);
    box-shadow: 0 22px 24px 0 rgb(0 0 0 / 5%);
}

.discussions .item:last-child {
	margin-bottom: 0px;
}

.discussions .item span {
	display: block;
	font-size: 11px;
	text-transform: uppercase;
	color: #999;
	margin-bottom: 10px;
}

.discussions .item img {
	max-width: 100%;
}

.discussions .item .item-buttons {
	border-top: 1px solid #ddd;
	margin-top: 20px;
	padding-top: 20px;
}

/* FILTERS */

.filters {
	border: 1px solid #ddd;
	padding: 20px;
	border-radius: 5px;
}

/* CALENDAR */

.calendar-days .item {
	display: flex;
	align-items: center;
	border: 1px solid #ddd;
	margin-bottom: 10px;
	border-radius: 5px;
}

.calendar-days .item.old {
	opacity: .5;
}

.calendar-days .item i {
	position: relative;
	top: 2px;
	padding-right: 3px;
}

.calendar-days .item [class^="flaticon-"]:before,
.calendar-days .item [class*=" flaticon-"]:before,
.calendar-days .item [class^="flaticon-"]:after,
.calendar-days .item [class*=" flaticon-"]:after { 
	font-size: 16px;
}

.calendar-days .item a {
	display: block;
	color: #000;
	font-weight: 700;
	padding: 10px;
}

.calendar-hours {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
}

.calendar-hours .item {
	text-align: center;
	border: 1px solid #ddd;
	padding: 10px;
	border-radius: 5px;
}

/* STATUS */

.status {
	padding: 7px 10px;
	background: #9dc4ff;
	color: #000;
	border: 0;
	font-weight: 800;
	font-size: 13px;
	text-transform: uppercase;
	border-radius: 5px;
}

/* BUTTONS */
.btn-primary {
	padding: 12px 28px !important;
	justify-content: center !important;
	align-items: center !important;
	gap: 10px !important;
	border-radius: 4px !important;
	background: var(--Color-Blue2-Orange-900, #44B1C5) !important; 
	border-color: #44B1C5  !important;
}

.btn-secondary {
	padding: 12px 28px !important;
	justify-content: center !important;
	align-items: center !important;
	gap: 10px !important;
	border-radius: 4px !important;
	border-color: #44B1C5  !important;
	color: #44B1C5  !important;
	background: var(--Color-Blue2-Orange-900, #fff) !important;
}

.btn-2 {
	padding: 7px 20px;
	background: #000;
	color: #eee;
	border: 0;
	font-weight: 700;
	font-size: 11px;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.btn-2 i {
	position: relative;
	top: 1px;
	padding-right: 3px;
}

.btn-2 [class^="flaticon-"]:before,
.btn-2 [class*=" flaticon-"]:before,
.btn-2 [class^="flaticon-"]:after,
.btn-2 [class*=" flaticon-"]:after { 
	font-size: 13px;
}

.btn-2:hover {
	color: #9dc4ff;
}

/* INPUTS */

.form-space {
	margin-bottom: 20px;
}

.form-space:last-child{
	margin-bottom: 0px;
}

.form-space label {
	display: block;
	font-size: 11px;
	letter-spacing: 2px;
	font-weight: 600;
	text-transform: uppercase;
	margin-bottom: 4px;
}

.form-space input,
.form-space select {
	display: block;
	width: 100%;
	padding: 10px;
	border: 2px solid #eee;
	background-color: #fff;
	border-radius: 5px;
}

.form-space button {
	padding: 7px 20px;
	background: #9dc4ff;
	color: #000;
	border: 0;
	font-weight: 700;
	font-size: 11px;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.form-space span.form-selectus {
    position: relative;
    display: block;
}

.form-space span.form-selectus:after {
    position: absolute;
    top: 50%;
    margin-top: -8px;
    right: 11px;
    z-index: 2;
    display: block;
    line-height: .496em;
    color: #333;
    pointer-events: none;
    content: "";
    width: 16px;
    height: 16px;
    background-image: url(../img/down.svg);
}

.form-space select {
    width: 100%;
    height: 40px;
    border-radius: 8px;
    border: 1px solid #d6dce9;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-size: 14px;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.14;
	font-weight: 600;
    letter-spacing: normal;
    color: #000;
    padding: 11px 22px 11px 8px;
}

.form-space input[type="checkbox"] { display: none; }

.form-space input[type="checkbox"] + label {
	display: block;
	position: relative;
	padding-left: 35px;
	margin-bottom: 20px;
	color: #787f8b;
	line-height: 18px;
	font-size: 13px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}

.form-space input[type="checkbox"] + label:last-child { margin-bottom: 0; }

.form-space input[type="checkbox"] + label:before {
	content: '';
	display: block;
	width: 20px;
	height: 20px;
	border: 1px solid #002678;
	border-radius: 4px;
	position: absolute;
	left: 0;
	top: 0;
	opacity: .6;
	-webkit-transition: all .12s, border-color .08s;
	transition: all .12s, border-color .08s;
}

.form-space input[type="checkbox"]:checked + label:before {
	width: 10px;
	top: -5px;
	border-color: #1acbaa;
	left: 5px;
	border-radius: 0;
	opacity: 1;
	border-top-color: transparent;
	border-left-color: transparent;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

tr.level1 {
	background: red;
	color: #fff;
}

[class^="flaticon-"]:before,
[class*=" flaticon-"]:before,
[class^="flaticon-"]:after,
[class*=" flaticon-"]:after { 
	font-size: 26px;
	margin-left: 0px !important;
	line-height: 1;
}

::-webkit-scrollbar {
	width: 1px;
}

::-webkit-scrollbar-track {
	background-color: transparent;
}

::-webkit-scrollbar-thumb {
	background-color: #b8b8b8;
	border-radius: 1px;
	background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
	background-color: #555;
}

.load-wrap {
	position: absolute;
	left: 50%;
	top: 15px;
	transform: translateX(-50%);
}
/* Stylizowanie paska przewijania w treeContainer */
.content-body {
  overflow-x: auto; /* Zapewnij, że pasek przewijania jest widoczny */
  scrollbar-width: thin; /* Dla przeglądarek Firefox */
}

/* Dla przeglądarek WebKit (Chrome, Safari) */
.content-body::-webkit-scrollbar {
  width: 8px; /* Szerokość paska przewijania */
  height: 8px; /* Wysokość paska przewijania */
}

.content-body::-webkit-scrollbar-thumb {
  background-color: #888; /* Kolor "uchwytu" paska przewijania */
  border-radius: 4px; /* Zaokrąglone rogi uchwytu */
}

.content-body::-webkit-scrollbar-thumb:hover {
  background-color: #555; /* Kolor "uchwytu" po najechaniu */
}

.content-body::-webkit-scrollbar-track {
  background: #f1f1f1; /* Kolor tła paska przewijania */
  border-radius: 4px; /* Zaokrąglone rogi tła */
}
.load-wrap .line {
	display: inline-block;
	width: 15px;
	height: 15px;
	border-radius: 15px;
	background-color: #000;
}
.row { 
	margin-right: 16px !important;
	margin-left: 16px !important;
}
section {
	background-color: #f7f7f7 !important;
}
.load-3 .line:nth-last-child(1) {
  animation: loadingC 0.6s 0.1s linear infinite;
}
.load-3 .line:nth-last-child(2) {
  animation: loadingC 0.6s 0.2s linear infinite;
}
.load-3 .line:nth-last-child(3) {
  animation: loadingC 0.6s 0.3s linear infinite;
}

@keyframes loadingC {
  0 {
    transform: translate(0, 0);
  }
  50% {
    transform: translate(0, 15px);
  }
  100% {
    transform: translate(0, 0);
  }
}

/* WINDOW */

.window {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	z-index: 10002;
	display: none;
	text-shadow: none;
}

.window .window-modal {
	position: fixed;
	width: 70%;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	animation-name: fadeIn;
	animation-duration: .3s;
	z-index: 10004;
	background: #fff;
	padding: 30px;
	border-radius: 5px;
	overflow-y: auto !important;
	max-height: 90%;
}

.window .window-modal * {
	max-width: 100% !important;
}

.window .window-overlay {
	position: absolute;
	content: '';
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 10003;
	background: rgba(24, 25, 28, .75);
}

.window .window-modal h3 {
	font-size: 20px;
	margin-bottom: 30px;
}

.m0 { margin: 0px !important; }
.mt0 { margin-top: 0px !important; }
.mb0 { margin-bottom: 0px !important; }
.mt10 { margin-top: 10px; }
.mt20 { margin-top: 20px !important; }
.mt30 { margin-top: 30px !important; }
.mt40 { margin-top: 40px; }
.mt50 { margin-top: 50px; }
.mt60 { margin-top: 60px; }
.mt70 { margin-top: 70px; }
.mt80 { margin-top: 80px; }
.mt100 { margin-top: 100px; }
.mt130 { margin-top: 130px; }
.mt-50 { margin-top: -50px; }
.mt-60 { margin-top: -60px; }
.mt-100 { margin-top: -100px; }
.mb0 { margin-bottom: 0px; }
.mb5 { margin-bottom: 5px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb20 { margin-bottom: 20px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }
.mb50 { margin-bottom: 50px; }
.mb70 { margin-bottom: 70px; }
.mb80 { margin-bottom: 80px; }
.mb100 { margin-bottom: 100px; }
.mb150 { margin-bottom: 150px; }
.mb200 { margin-bottom: 200px; }
.ml0 { margin-left: 0 !important; }
.ml10 { margin-left: 10px !important; }
.ml20 { margin-left: 20px !important; }
.ml50 { margin-left: 50px !important; }
.mr0 { margin-right: 0 !important; }
.pt0 { padding-top: 0 !important; }
.pt20 { padding-top: 20px; }
.pt30 { padding-top: 30px; }
.pt50 { padding-top: 50px; }
.pt75 { padding-top: 75px; }
.pt80 { padding-top: 80px; }
.pt100 { padding-top: 100px; }
.pt130 { padding-top: 130px; }
.pt150 { padding-top: 150px; }
.pb0 { padding-bottom: 0px; }
.pb20 { padding-bottom: 20px; }
.pb30 { padding-bottom: 30px; }
.pb50 { padding-bottom: 50px; }
.pb75 { padding-bottom: 75px; }
.pb80 { padding-bottom: 80px; }
.pb100 { padding-bottom: 100px; }
.pb130 { padding-bottom: 130px; }
.pb150 { padding-bottom: 150px; }
.pr5 { padding-right: 5px; }
.pr10 { padding-right: 10px; }
.pr15 { padding-right: 15px; }
.pr20 { padding-right: 20px; }
.pl5 { padding-left: 5px; }
.pl10 { padding-left: 10px; }
.p30 { padding: 30px; }
.p20 { padding: 20px; }
.p10 { padding: 10px; }

@media (min-width: 0px) and (max-width: 991px) {
	
	.sidebar {
		/* display: none; */
	}
	
	.content {
		margin: 10px;
	}
	
	.content .content-body {
        padding: 10px;
        align-items: flex-end;
        margin-left: auto;
        margin-right: 0;
        max-width: 600px;
	}
	
	.stats .item {
		margin-bottom: 10px;
	}
	
	.stats .item .stat-value {
		padding: 10px;
		width: 100px;
	}
	
	.stats .item .stat-value span {
		font-size: 1.4rem;
		padding: 0 10px;
	}
	
	.stats .item .stat-info {
		width: calc(100% - 100px);
		padding: 0 10px;
	}
	
	
	
	
}

@media (min-width: 991px) and (max-width: 1288px) {
	
	
	
}

@media (min-width: 1400px) {
	.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
			max-width: 100% !important;
	}
}
 
.selectBox { 
	position: relative; 
} 

.search-box { 
	width: 100%; 
	padding: 10px; 
	border: none; 
	border-bottom: 1px solid #ccc; 
	outline: none; 
	font-size: 16px; 
} 

.center-text { 
	text-align: center; 
	color: green; 
} 


.options { 
	list-style: none; 
	padding: 0; 
	max-height: 250px; 
	overflow-y: auto; 
	border-bottom: 1px solid #ccc; 
} 

.options li { 
	padding: 10px; 
	cursor: pointer; 
} 

.options li:hover { 
	background-color: #f0f0f0; 
} 

.selected-option { 
	padding: 10px; 
	cursor: pointer; 
} 

#clear-button { 
	background-color: #ff6347; 
	color: white; 
	padding: 8px 16px; 
	border: none; 
	border-radius: 4px; 
	cursor: pointer; 
} 

#clear-button:hover { 
	background-color: #ff0000; 
}
/*
  AUTH UI (login/forgot) – styl „system bankowy”
  ------------------------------------------------
  Bezpieczne do wklejenia do assets/css/style.css, bo jest scope'owane przez .bo-auth.
*/

.bo-auth {
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  background: #f1f5f9;
  color: #0f172a;
}

/* Layout */
.bo-auth .auth-layout {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1fr;
}

@media (min-width: 992px) {
  .bo-auth .auth-layout {
    grid-template-columns: 1.15fr 1fr;
  }
}

/* Brand panel */
.bo-auth .auth-brand {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #0b1220 0%, #0b2a4a 45%, #0a4a8a 100%);
  color: #ffffff;
  padding: 56px 28px;
}

@media (min-width: 992px) {
  .bo-auth .auth-brand {
    padding: 64px 56px;
  }
}

.bo-auth .auth-brand::before {
  content: "";
  position: absolute;
  inset: -40%;
  background:
    radial-gradient(circle at 18% 12%, rgba(14, 165, 233, 0.38) 0%, rgba(14, 165, 233, 0) 40%),
    radial-gradient(circle at 78% 26%, rgba(34, 197, 94, 0.22) 0%, rgba(34, 197, 94, 0) 42%),
    radial-gradient(circle at 62% 86%, rgba(59, 130, 246, 0.18) 0%, rgba(59, 130, 246, 0) 45%);
  transform: rotate(10deg);
}

.bo-auth .auth-brand__inner {
  position: relative;
  max-width: 560px;
}

.bo-auth .auth-brand__top {
  display: flex;
  gap: 14px;
  align-items: center;
}

.bo-auth .auth-brand__logo {
  width: 52px;
  height: 52px;
}

.bo-auth .auth-brand__name {
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
  font-size: 18px;
}

.bo-auth .auth-brand__tag {
  opacity: 0.75;
  font-size: 13px;
  margin-top: 2px;
}

.bo-auth .auth-brand__headline {
  margin-top: 34px;
  font-weight: 750;
  letter-spacing: -0.03em;
  line-height: 1.05;
  font-size: 34px;
}

@media (min-width: 992px) {
  .bo-auth .auth-brand__headline {
    font-size: 44px;
  }
}

.bo-auth .auth-brand__copy {
  margin-top: 14px;
  opacity: 0.85;
  font-size: 15px;
  line-height: 1.6;
  max-width: 46ch;
}

.bo-auth .auth-brand__pills {
  margin-top: 26px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.bo-auth .auth-pill {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.08);
  font-size: 13px;
  backdrop-filter: blur(6px);
}

.bo-auth .auth-brand__footer {
  margin-top: 42px;
  opacity: 0.65;
  font-size: 12px;
}

/* Form panel */
.bo-auth .auth-form {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 44px 18px;
  background: #f1f5f9;
}

.bo-auth .auth-card {
  width: 100%;
  max-width: 460px;
  background: #ffffff;
  border: 1px solid rgba(15, 23, 42, 0.10);
  border-radius: 18px;
  box-shadow: 0 18px 46px rgba(15, 23, 42, 0.10);
  padding: 28px;
}

@media (min-width: 768px) {
  .bo-auth .auth-card {
    padding: 40px;
  }
}

.bo-auth .auth-card__title {
  font-weight: 750;
  letter-spacing: -0.02em;
  margin: 0;
  font-size: 26px;
}

.bo-auth .auth-card__subtitle {
  margin: 10px 0 0;
  color: rgba(15, 23, 42, 0.70);
  line-height: 1.5;
  font-size: 14px;
}

.bo-auth .bo-auth__alert {
  border-radius: 14px;
  border: 1px solid rgba(220, 53, 69, 0.25);
  background: rgba(220, 53, 69, 0.06);
  color: #b02a37;
}

/* Inputs */
.bo-auth .form-floating > .form-control {
  border-radius: 14px;
  border-color: rgba(15, 23, 42, 0.14);
}

.bo-auth .form-floating > label {
  color: rgba(15, 23, 42, 0.60);
}

.bo-auth .form-control:focus {
  border-color: #0ea5e9;
  box-shadow: 0 0 0 4px rgba(14, 165, 233, 0.16);
}

/* Password toggle */
.bo-auth .auth-pass {
  position: relative;
}

.bo-auth .auth-pass__toggle {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  border: none;
  background: transparent;
  color: rgba(15, 23, 42, 0.55);
  padding: 8px;
  border-radius: 12px;
  line-height: 0;
}

.bo-auth .auth-pass__toggle:hover {
  background: rgba(15, 23, 42, 0.04);
  color: rgba(15, 23, 42, 0.85);
}

.bo-auth .auth-pass__toggle.is-active {
  color: #0ea5e9;
}

/* Buttons */
.bo-auth .btn.btn-primary {
  border-radius: 14px;
  padding: 0.95rem 1.05rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.bo-auth .btn.btn-lg {
  font-size: 15px;
}

.bo-auth .auth-link {
  color: rgba(15, 23, 42, 0.70);
  text-decoration: none;
  font-size: 13px;
}

.bo-auth .auth-link:hover {
  color: #0ea5e9;
  text-decoration: underline;
}

.bo-auth .auth-card__legal {
  margin-top: 14px;
  font-size: 12px;
  line-height: 1.5;
}

.bo-auth .auth-card__legal a {
  color: rgba(15, 23, 42, 0.80);
  font-weight: 600;
  text-decoration: none;
}

.bo-auth .auth-card__legal a:hover {
  color: #0ea5e9;
  text-decoration: underline;
}

/*
  Modal (akceptacja regulaminu) – działa zarówno na stronie logowania, jak i w panelu.
*/
.bo-modal {
  position: fixed;
  inset: 0;
  z-index: 1055;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 22px;
  background: rgba(15, 23, 42, 0.55);
  backdrop-filter: blur(6px);
}

.bo-modal__dialog {
  width: 100%;
  max-width: 540px;
}

.bo-modal__card {
  background: #ffffff;
  border-radius: 18px;
  border: 1px solid rgba(15, 23, 42, 0.10);
  box-shadow: 0 22px 70px rgba(15, 23, 42, 0.28);
  padding: 26px;
}

@media (min-width: 768px) {
  .bo-modal__card {
    padding: 34px;
  }
}

.bo-modal__title {
  margin: 0 0 8px;
  font-weight: 750;
  letter-spacing: -0.02em;
}

.bo-modal__text {
  margin: 0 0 14px;
  color: rgba(15, 23, 42, 0.75);
  line-height: 1.55;
}

.bo-modal__links {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.bo-modal__link {
  color: rgba(15, 23, 42, 0.85);
  font-weight: 650;
  text-decoration: none;
}

.bo-modal__link:hover {
  color: #0ea5e9;
  text-decoration: underline;
}

.bo-modal__sep {
  color: rgba(15, 23, 42, 0.35);
}

.bo-modal__check {
  margin: 12px 0 18px;
}

@media (prefers-reduced-motion: reduce) {
  .bo-auth * {
    scroll-behavior: auto !important;
    transition: none !important;
    animation: none !important;
  }
}