@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto/Roboto-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto/Roboto-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto/Roboto-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

html, body
{
	font-family: 'Roboto', sans-serif;
	/*background: linear-gradient(to bottom, #2f3650, #27283d, #221f2a);*/
	background: linear-gradient(to bottom, #27283d, #252434, #221f2a);
	/*background: linear-gradient(to bottom, #12112f, #1d1f41, #221f2a);*/
	min-height: 100vh;
	margin: 0;
	color: #C0C0C0;
}

.btn-close:active, .btn-close:focus
{
    box-shadow: none;
}

a.nav-link:hover
{
	color: #b668ff;
}

a.nav-link.active
{
	color: #b668ff!important;
}

.btn-register {
	display: inline-block;
	cursor: pointer;
	font-size: 18px;
    padding: 10px 30px;
    border: none;
    border-radius: 100px;
    background: linear-gradient(135deg, #8a2be2, #4b0082);
    color: #fff;
    box-shadow: 0px 4px 12px rgba(75, 0, 130, 0.5);
    position: relative;
    overflow: hidden;
    transition: background 0.4s ease-in-out, box-shadow 0.4s ease-in-out;
}

.btn-register::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 300%;
    height: 300%;
    background: radial-gradient(circle, #ffffff33, transparent);
    transform: translate(-50%, -50%) scale(0);
    transition: transform 0.5s ease-out;
    z-index: 0;
}

.btn-register:hover::before {
    transform: translate(-50%, -50%) scale(1);
}

.btn-register:hover {
    background: linear-gradient(135deg, #6c88eb, #4b0082); /* Zmiana gradientu */
    color: #fff;
    box-shadow: 0px 0px 16px rgba(108, 136, 235, 0.7);
}

.btn-register span {
    position: relative;
    z-index: 1; /* Tekst nad efektem */
}

.btn-register:hover span {
    animation: neonText 1s ease-in-out infinite alternate;
}

@keyframes neonText {
    from {
        text-shadow: 0 0 5px #ffffff, 0 0 10px #6c88eb, 0 0 15px #6c88eb;
    }
    to {
        text-shadow: 0 0 10px #ffffff, 0 0 20px #6c88eb, 0 0 30px #6c88eb;
    }
}

.btn-login {
	display: inline-block;
	cursor: pointer;
	font-size: 18px;
    padding: 10px 30px;
    border-radius: 100px;
    border: 0;
    background: none;
    color: #fff;
    position: relative;
    transition: background 0.3s ease-in-out, box-shadow 0.3s ease-in-out, color 0.3s ease-in-out;
    overflow: hidden;
}

.btn-login::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 200%;
    height: 100%;
    background: linear-gradient(120deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
    transform: skewX(-30deg);
    transition: all 0.5s ease;
    z-index: 0;
}

.btn-login:hover::before {
    left: 95%;
}

.btn-login span {
    position: relative;
    z-index: 1;
}

.btn-login:hover span {
    animation: textGlow 1.5s ease-in-out infinite alternate;
}

.btn-login:hover {
    background: linear-gradient(135deg, #ff6a5d, #ff3535); /* Lekko ciemniejszy gradient na hover */
    color: #fff; /* Kolor tekstu */
}

@keyframes textGlow {
    from {
        text-shadow: 0 0 5px #ffffff, 0 0 10px #e69c3f, 0 0 15px #e69c3f;
    }
    to {
        text-shadow: 0 0 10px #ffffff, 0 0 20px #e69c3f, 0 0 30px #e69c3f;
    }
}


.register .input-group-text
{
	border-radius: 100px 0px 0px 100px;
	padding: 20px 25px;
	background: linear-gradient(135deg, #8a2be2, #4b0082);
	border: 0;
	box-shadow: 0px 0px 2px rgba(108, 136, 235, 0.7);
	color: #fff;
	max-width: 60px;
}

.login .input-group-text
{
	border-radius: 100px 0px 0px 100px;
	padding: 20px 25px;
	background: linear-gradient(135deg, #ff6a5d, #ff3535);
	border: 0;
	box-shadow: 0px 0px 2px rgba(108, 136, 235, 0.7);
	color: #fff;
	max-width: 60px;
}

.form-control, .form-control:focus
{
	border-radius: 0px 100px 100px 0px;
	box-shadow: inset 25px 0px 20px -30px #fff!important;
	border: 0;
	background: #00000010;
	color: #C0C0C0;
}

.form-control::placeholder
{
	color: #C0C0C0;
}

.form-check-input, .form-check-label
{
	cursor: pointer;
}

.form-check-input
{
	box-shadow: none!important;
}

.register .form-check-input:checked
{
    background-color: #8a2be2!important;
    border-color: #8a2be2!important;
}

.main-title
{
	font-size: 32px;
	text-align: center;
	margin-top: 60px;
	margin-bottom: 60px;
}

.underline-purple {
    display: block;
    position: relative;
	width: max-content;
}

.underline-purple::after {
    content: '';
    position: absolute;
    width: 50px; /* Długość kreski */
    height: 3px; /* Grubość kreski */
    background-color: #8a2be2; /* Kolor kreski */
    bottom: -10px; /* Odległość kreski od tekstu */
    left: 50%;
    transform: translateX(-50%); /* Wycentrowanie kreski */
}

.underline-purple-left {
    display: block;
    position: relative;
	width: max-content;
}

.underline-purple-left::after {
    content: '';
    position: absolute;
    width: 50px; /* Długość kreski */
    height: 3px; /* Grubość kreski */
    background-color: #8a2be2; /* Kolor kreski */
    bottom: -10px; /* Odległość kreski od tekstu */
    left: 0;
}

.underline-peach {
    display: block;
    position: relative;
	width: max-content;
}

.underline-peach::after {
    content: '';
    position: absolute;
    width: 50px; /* Długość kreski */
    height: 3px; /* Grubość kreski */
    background-color: #ff6a5d; /* Kolor kreski */
    bottom: -10px; /* Odległość kreski od tekstu */
    left: 50%;
    transform: translateX(-50%); /* Wycentrowanie kreski */
}

a
{
	text-decoration: none;
	color: #ff6a5d;
}

a:hover
{
	color: #ff9289;
}

.text-purple
{
	color: #b668ff!important;
}

.text-peach
{
	color: #ff6a5d!important;
}

.text-green
{
	color: #00c20c;
}

.bg-purple
{
	background: linear-gradient(135deg, #8a2be2, #4b0082)!important;
}

.bg-peach
{
	/*background: linear-gradient(135deg, #ff6a5d, #ff3535)!important;*/
	background: linear-gradient(135deg, #ff411e, #e69c3f)!important;
}

.bg-green
{
	background: linear-gradient(135deg, #009C00, #005c0a)!important;
}

.bg-red
{
	background: linear-gradient(135deg, #FF0000, #660000)!important;
}

.bg-red-alert
{
	background: linear-gradient(135deg, #ff6a5d, #ff3535)!important
}

.shadow-inset-black-light
{
	box-shadow: inset 0px 0px 100px -60px #000!important;
}

.shadow-inset-black
{
	box-shadow: inset 0px 0px 100px 0px #000!important;
}

.rounded-8px
{
	border-radius: 8px;
}

.border-red
{
	border-color: #FF0000!important;
}

.border-peach
{
	border-color: #ff6a5d!important;
}

.text-red
{
	color: #FF0000!important;
}

.text-transparent
{
	color: transparent!important;
}

.bg-redlight-gradient
{
	background: linear-gradient(135deg, #ff4c4c, #ff0000, #c11c1c)!important;
}

.tooltip-purple
{
	background: linear-gradient(135deg, #8a2be2, #4b0082);
	color: #fff;
	border-radius: 100px;
	font-weight: 500;
	padding: 5px;
}

.tooltip-inner, .tooltip.bottom .tooltip-arrow
{
    background: none!important;
}

.bs-tooltip-bottom .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow::before
{
  border-bottom-color: #8a2be2!important;
}

.fw-500
{
	font-weight: 500;
}

.btn-choose-option {
	display: inline-block;
	cursor: pointer;
	font-size: 18px;
    padding: 10px 20px;
    border: 0;
    background: none;
    color: #fff;
    position: relative;
    transition: background 0.3s ease-in-out, box-shadow 0.3s ease-in-out, color 0.3s ease-in-out;
    overflow: hidden;
}

.btn-choose-option::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 200%;
    height: 100%;
    background: linear-gradient(120deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
    transform: skewX(-30deg);
    transition: all 0.5s ease;
    z-index: 0;
}

.btn-choose-option:not(.active):not(.disabled):hover::before {
    left: 130%;
}

.btn-choose-option span {
    position: relative;
    z-index: 1;
}

.btn-choose-option:not(.active):not(.disabled):hover span {
    animation: textGlow 1.5s ease-in-out infinite alternate;
}

.btn-choose-option:not(.btn-peach):not(.active):not(.disabled):hover {
    background: linear-gradient(135deg, #6c88eb, #4b0082); /* Lekko ciemniejszy gradient na hover */
    color: #fff; /* Kolor tekstu */
}

.btn-choose-option.btn-peach:not(.active):not(.disabled):hover {
    background: linear-gradient(135deg, #ff6a5d, #ff3535); /* Lekko ciemniejszy gradient na hover */
    color: #fff; /* Kolor tekstu */
}

@keyframes textGlow {
    from {
        text-shadow: 0 0 5px #ffffff, 0 0 10px #e69c3f, 0 0 15px #e69c3f;
    }
    to {
        text-shadow: 0 0 10px #ffffff, 0 0 20px #e69c3f, 0 0 30px #e69c3f;
    }
}

.btn-choose-option.active {
	display: inline-block;
	cursor: default;
	font-size: 18px;
    padding: 10px 20px;
    border: 0;
    background: linear-gradient(135deg, #6c88eb, #4b0082);
    color: #fff;
    position: relative;
    transition: background 0.3s ease-in-out, box-shadow 0.3s ease-in-out, color 0.3s ease-in-out;
    overflow: hidden;
}

.btn-choose-option.btn-peach.active {
	display: inline-block;
	width: max-content;
	cursor: default;
	font-size: 18px;
    padding: 10px 20px;
    border: 0;
    background: linear-gradient(135deg, #ff6a5d, #ff3535);
    color: #fff;
    position: relative;
    transition: background 0.3s ease-in-out, box-shadow 0.3s ease-in-out, color 0.3s ease-in-out;
    overflow: hidden;
}

.btn-choose-option.disabled {
	cursor: default;
}

.text-main-grey
{
	color: #C0C0C0;
}

.special
{
	font-weight: 700;
	color: #FFF;
	letter-spacing: 0.5px;
}

.ls-05
{
	letter-spacing: 0.5px;
}

.text-justify
{
	text-align: justify;
}

.fs-7
{
	font-size: 14px!important;
}

.fs-8
{
	font-size: 12px!important;
}

.fs-9
{
	font-size: 10px!important;
}

/* Styl dla paska przewijania w Chrome/Safari */
.table-responsive::-webkit-scrollbar {
    width: 4px; /* Szerokość paska przewijania */
    height: 4px; /* Szerokość paska przewijania */
}

.table-responsive::-webkit-scrollbar-track {
    background: #221f2a; /* Kolor tła paska przewijania */
}

.table-responsive::-webkit-scrollbar-thumb {
    background: #b668ff; /* Kolor kciuka */
    border-radius: 10px; /* Zaokrąglenie kciuka */
}

.table-responsive::-webkit-scrollbar-thumb:hover {
	cursor: pointer;
    background: #ff6a5d; /* Kolor kciuka po najechaniu */
}

footer
{
	padding: 50px 0px 0px 0px;
}

.table th
{
	padding: .6rem;
	min-width: max-content;
	vertical-align: middle;
	text-wrap: nowrap;
}

.table td
{
	padding: .3rem;
	min-width: max-content;
	vertical-align: middle;
	text-wrap: nowrap;
}

.table thead
{
	background: #221f2a!important;
}

.table tbody tr
{
	border-bottom: 1px solid #494949;
}

.table tbody tr:not(.non-clickable):hover
{
	cursor: pointer;
	background: linear-gradient(to bottom, #2f3650, #27283d);
}

.ico-text-center
{
	display: flex!important;
    align-items: center;
    gap: 5px;
}

.d-flex-centered
{
	display: flex;
    align-items: center;
    justify-content: center;
}

.table-pricelist th:first-child
{
	background: linear-gradient(135deg, #8a2be2, #24003f);
    border: 1px solid #24003f;
    color: #FFF;
}

.table-pricelist th:not(:first-child)
{
	border: 1px solid #24003f;
}

.table-pricelist td:first-child
{
	background: linear-gradient(135deg, #8a2be2, #24003f);
    border: 1px solid #24003f;
    color: #FFF;
}

.table-pricelist td:not(:first-child)
{
	border: 1px solid #24003f;
}