:root {
	--themecolor: /*#d50000*/#ffc420;
	--themecolordark: /*#9b0000*/#b38300;
	--themecolorlight: #ff5131;
	--themecoloractive: #216d18;
	--buttonActive: #66BB6A;
	--buttonActiveOver:#2E7D32;
	--buttoInactive: #78909C;
	--buttonInactiveOver:#37474F;

	--text-color: #0035d1;
    --field-bg-color: #fff;
    --field-border-color: #202938; /* rgba(245, 166, 35, 0.77); */
    --label-color: #7f7f7f;
    --primary-color: #ffc420; /* rgba(245, 166, 35, 0.77); */
    --secondary-color: #130272; /* #BD10E0; */
    --secondary-border: #a41a21; /* #BD10E0; */
    --secondary-color-2: #e1a500; /* #da64f540; */

}

html {font-size: .8rem;}

table td { padding: .05rem !important; max-width: 100% !important; vertical-align: middle !important; text-align: center; }
table th { padding: .05rem !important; max-width: 100% !important; text-align: center; white-space: nowrap; overflow: hidden;}
table th div {  cursor: col-resize;}

@media print {
    #printableArea {
        background-color: white;
        height: 100%;
        width: 100%;
        position: fixed;
        top: 0;
        left: 0;
        margin: 0;
        padding: 4rem;
        font-size: 14px;
        line-height: 18px;
    }
}

label{
	font-size:15px;
}

.btn-success{
	font-size:15px;
}

.inline-flex {
	display: inline-flex;
}

#taleteButton {
	cursor: pointer;
}

.logo {
	max-width: 100%;
	/*max-height: 1.5rem;*/
	max-height: 10rem;
}

.logo-login {
	/*max-height: 10rem;
	max-width: 10rem;
	margin:auto;*/
	max-height: 20rem;
	max-width: 20rem;
	padding-top: 1rem;
	margin:auto;
	background-color: transparent;
}

.welcome .nav-item a {
	text-transform: capitalize;
	font-size: 1.1rem;
	font-weight: bold;
}

.welcome .nav-link.active{
	background-color: #cdd5e0/* #CFE0F3*/;
	border-top: solid/* red*/#ffc420 .5rem;
	border-bottom: none;
	color:black;
}

.welcome .nav-tabs {
	border-bottom: none;
}

.welcome .col {
	padding: 0rem;
}

.welcome .nav-link {
	border-bottom: solid #D23700 .5rem;
}

.welcome .tab-pane.active {
	background:#ddecff/* #CFE0F3*/;
	padding: 1rem;
}

@media (min-width: 768px) {
	.welcome .tab-pane.active {
		min-height: 40vh;
	}
	.h-custom{
		height: 60vh;
		max-width: 1200px;
		justify-self: center;
	}

}

.welcome .tab-pane a {
	padding: 1rem;
}

/*
.welcome .tab-pane a div {
	background: white;
	text-align: center;
	color: black;
	font-weight: bolder;
	font-size: 1.1rem;
	border-left: 1px solid grey;
	border-bottom: 1px solid grey;
	padding: .5rem;
}
*/

.container {
	max-width: 95%;
}

.ribbon {
	text-align: center;
	margin-bottom: .25rem;
}

.ribbon .tasto {
	background:  #e9c28b;
	/*color:white;*/
	padding: .1rem;
	border:solid white 1px;
	border-radius: 12px
}

.ribbon .tasto:hover {
	/*color:white;*/
	background-color:  #f9c984;
	text-decoration: none;
	color: #FFFFFF;
    transition: 0.5s;
}

.ribbon a {
	/*color: white;*/
	color: black;
}

.tasto p {
	padding:.1rem;
	margin: 0rem;
/*	margin-top: -.5rem;*/
}

.btn-secondary {
	background-color: white;
	color:#5a6268;
}

.buttons-csv, #navbarDropdown{
	background-color: white;
	color:#8790a8;
}

.buttons-csv:hover{
	background-color: #8790a8 ;
	color:white;
}

.dropdown img {
	max-width: 1rem;
}

.dropdown button {
	width: 100%;
}

.logout-dropdown {
	padding-left: 0rem !important;
	padding-right: 0rem !important;
}

.dropdown {
	padding-left: 0px !important;
	padding-right: 0px !important;
}

.align-center {
	width: 95%;
	margin: 0px auto;
	float: none;
}

.large-button {
	width: 100%;
}

.large-max {
	width: 100%;
}

.card-header {
	background: var(--themecolor);
	/*color:white;*/
	padding: .5rem;
}

.managePictures {
	position: absolute;
	top: .25rem;
	left: .5rem;
}

.btn.btn-primary {
	background: var(--themecolor);
	/*color:white;*/
	color:black;
	border: none;
}
.btn.btn-primary:hover {
	background: var(--themecolordark);
}

.btn.btn-link {
	color:var(--themecolor);
}

.btn.btn-link:hover {
	color:var(--themecolordark);
}

.money {
	max-height:2.5rem;
}

.tab-contanti .table {
	padding:.5rem;
}

/* Customize the label (the container) */
.radioContainer {
    display: block;
    position: relative;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin: 0rem;
}

/* Hide the browser's default radio button */
.radioContainer input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Create a custom radio button */
.checkmark {
    position: absolute;
    top: -.4rem;
    left: -.2rem;
    height: 1rem;
    width: 1rem;
    background-color: #CCCCCC;
    border-radius: 25%;
}

/* On mouse-over, add a grey background color */
.radioContainer:hover input~.checkmark {
    background-color: #A3A3A3;
}

/* When the radio button is checked, add a blue background */
.radioContainer input:checked~.checkmark {
    background-color: var(--themecolor);
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
    z-index: 0;
}

/* Show the indicator (dot/circle) when checked */
.radioContainer input:checked~.checkmark:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.radioContainer .checkmark:after {
    top: .25rem;
    left: .25rem;
    width: .5rem;
    height: .5rem;
    border-radius: 50%;
    background: white;
}

/*.table-striped {
	text-align: center !important;
}*/

#example th {
	z-index: 50;
}

#example th, #example td, #cassa th, #cassa td {
	border-left: 1px #e0e0e0 solid;
}

td.colPulsanti {
	display: table-cell;;
}

.scontrino-header p {
	font-weight: bold;
	margin-bottom: 0rem;
	text-transform: uppercase;
}

.scontrino-header .telefono {
	margin-bottom: 2rem;
}

.scontrino-body .name {
	text-align: left;
}

.scontrino-body .quantity {
	text-align: right;
}

.scontrino-body .price {
	text-align: right;
}

.scontrino-body .total {
	font-weight: bold;
}

.scontrino-body tfoot {
	border-top: solid black 2px;
}

.border-dark {
	border: 1px gray solid;
	height: 14rem;
}

.scontrino-footer p {
	font-weight: bold;
	margin-bottom: 0rem;
	text-transform: uppercase;
	font-size: 0.8rem;
}

.scontrino-footer .cassiere {
	margin-top:2rem;
}

.printableTable thead, .printableTable tfoot {
	background-color: #EBEDEF;
	border: solid black 1px;
}

.printableTable tbody tr {
	border: solid black 1px;
}

.azioni {
	min-width: 5rem;
}

.none {
	display: none;
}

.bnone {
	border: none;
}

.brnone {
	border-radius: 0rem;
}

.buttons-columnVisibility.active{
	background-color: var(--buttonActive);
}

.buttons-columnVisibility.active:hover{
	background-color: var(--buttonActiveOver);
}

.buttons-columnVisibility{
	background-color: var(--buttoInactive);
	color: white;
}

.buttons-columnVisibility:hover{
	background-color: var(--buttonInactiveOver);
	color: white;
}

#custombuttons {
	margin-bottom: .25rem;
}

#custombuttons .col-1{
	padding: 0rem;
}

#custombuttons a {
	padding-top: 0rem;
	padding-bottom: 0rem;
}

.ordini-parcheggiati ul {
	padding-left: 0rem;
}
.ordini-parcheggiati li {
	list-style: none;
	display: inline-flex;
	background-color: #38C172;
	border-radius: 50%;
	width: 1.5rem;
	line-height: 1.5rem;}

.ordini-parcheggiati li span {
	margin-left: auto;
	margin-right: auto;
}

.checkout-buttons button,
.checkout-buttons input {
	padding: .1rem .5rem;
	height: 3rem;
}

.checkout-buttons button,
.checkout-buttons h5,
.checkout-buttons h6 {
	font-size: .8rem;
}

.checkout-buttons h5 {
	background-color: gray;
	color: white;
	height: 1.5rem;
	border-radius: .5rem .5rem 0rem 0rem;
	text-align: center;
	padding-top: .3rem;
	margin-bottom: 0rem;
}

.checkout-buttons h6 {
	background-color: white;
	border: 1px solid gray;
	height: 1.5rem;
	border-radius: 0rem 0rem .5rem .5rem;
	text-align: center;
	padding-top: .3rem;
	width: 100%;
}

#selectColumns .dt-button-collection {
	padding: 0rem;
	top: .25rem !important;
}

#selectColumns .btn-group {
	width: 100%;
	height: 0rem;
	display: flex;
}

#selectColumns button {
	padding-bottom: 0rem;
	display: none;
}

#selectColumns button::after {
	content: none;
}
.uiScaledImageContainer {
    width: 300px;
    height: 300px;
    position: relative;
    overflow: hidden;
}

.uiScaledImageContainer .scaledImageFitHeight {
    height: 100%;
    min-height: initial;
    width: auto;
}

.uiScaledImageContainer .scaledImageFitWidth {
    height: auto;
    min-height: initial;
    width: 100%;
}

/* PREVIEW UPLOAD */
#previewUpload {
	padding-bottom: .5rem;
	text-align: center;
}

#cancelUpload {
	color: white;
	position: absolute;
	z-index: 9;
}

#cancelUpload:hover {
	color: red;
	text-decoration: none;
}

.underlined:hover {
	text-decoration: underline;
	cursor:pointer;
}

.underlined:hover .mdi {
	color: darkred;
}

.logoPreview {
	max-height:10rem;
	max-width:100%;
}

/*NOT WORKING*/
.notworking {
	background-color: var(--themecolor) !important;
	color:white !important;
}
.notworking:hover {
	background-color: var(--themecolordark) !important;
	color:white !important;
}

/*STEP 2*/
.step2 {
	background-color:#9EDBF5 !important;
}

/*Colori*/
.blu {
	background-color: #45579C;
	color: white;
}
.verde {
	background-color: #43942B;
	color: white;
}
.arancio {
	background-color: #E7631A;
	color: white;
}
.giallo {
	background-color: #F9F528;
	color: black;
}

.outlined {
	border: 1px solid #ced4da;
	background-color: white;
	color: black;
}

#ordiniparcheggiati {
	padding: .1rem;
	margin-bottom: 0rem;
}

#ordiniparcheggiati a {
	color:white;
}

#ordiniparcheggiati li {
	font-size: .8rem;
	list-style: none;
	display: inline;
	background-color: #77E754;
    padding: .1rem .4rem;
    border-radius: 50%;
    color: black;
	margin-right: .2rem;
}

#ordiniparcheggiati li.corrente {
	background-color: #43942B;
	color: white;
}

.pagina-collaboratore th,
.pagina-collaboratore td,
.pagina-cliente th,
.pagina-cliente td,
.pagina-fornitore th,
.pagina-fornitore td {
	padding:.2rem;
}

.pagina-candidato table,
.pagina-cliente table,
.pagina-fornitore table {
	margin-bottom: .1rem;
}

.pagina-candidato label,
.pagina-collaboratore label,
.pagina-articolo label,
.pagina-cliente label,
.pagina-fornitore label {
    margin-bottom: .1rem;
    margin-top: .3rem;
}

.pagina-candidato .form-control,
.pagina-ticket .form-control,
.pagina-collaboratore .form-control,
.pagina-progetto .form-control,
.pagina-articolo .form-control,
.pagina-cliente .form-control,
.pagina-fornitore .form-control {
    padding: .2rem;
    height: 25px;
}

.pagina-articolo .form-group {
	margin-bottom: .2px;
}

.pagina-candidato .centerColumn,
.pagina-collaboratore .centerColumn,
.pagina-progetto .centerColumn,
.pagina-cliente .centerColumn,
.pagina-fornitore .centerColumn {
    border-left: solid 1px gray;
    border-right: solid 1px gray;
    padding-left: .5rem;
    padding-right: .5rem;
}

.pagina-candidato .leftColumn,
.pagina-collaboratore .leftColumn,
.pagina-progetto .leftColumn,
.pagina-cliente .leftColumn,
.pagina-fornitore .leftColumn {
    padding-right: .5rem;
}

.pagina-candidato .rightColumn,
.pagina-collaboratore .rightColumn,
.pagina-progetto .rightColumn,
.pagina-cliente .rightColumn,
.pagina-fornitore .rightColumn {
    padding-left: .5rem;
}

/*Chat*/
.chat-window {
	height: 80vh;
}
.chat-current {
	position: relative;
	background-color: red;
}

.chat-current-thread {
	background-color: lightgray;
}
.chat-current-thread, .chat-not-current-thread {
	padding: .25rem;
	margin: 0rem;
	border-radius: .5rem;
}

.chat-user {
	/*height: 5vh;*/
	padding: .1rem 0rem;
	text-transform: capitalize;
	border-bottom: solid red 1px;
}
.chat-header {
	position: absolute;
	top: 0px;
	width: 100%;
	/*background-color: #182533;*/
	background-color: #D50000;
	border-bottom: 1px solid white;
}

.chat-header h2 {
	padding: .5rem;
	text-transform: capitalize;
	color: white;
	margin: 0rem;
}

.chat-message {
	width: fit-content;
	max-width: 37vh;
	word-break: break-all;
}
.chat-received-message p,
.chat-sent-message p {
	margin: 0rem;
}

.chat-received-message,
.chat-sent-message {
	padding: .5rem;
	border-radius: .5rem;
	margin-top: .25rem;
	color: white;
}

.chat-sent-message {
	margin-left: auto;
	margin-right: .5rem;
	background-color: #D50000;
	/*background-color: #2B5278*/;
}
.chat-received-message {
	margin-right: auto;
	margin-left: .5rem;
	/*background-color: #182533*/;
	background-color: #9B0000;
}

.chat-body {
	width: 100%;
	/*background-color: #0E1621;*/
	position: absolute;
	top:7vh;
	height: 68vh;
	max-height: 68vh;
	overflow-y: scroll;
	display: flex;
	align-content: flex-start;
}

.chat-input {
	position: absolute;
	top: 75vh;
	width: 100%;
}

.chat-unseen {
	background-color: rgb(224, 64, 64);
}

.chat-unseen h4 {
	color: #FFFFFF;
}

.currentPage {
	background-color: var(--themecoloractive);
}


/* NEW STYLE */
.styled-form-background::before {
	background-image: url(../img/background.jpg);
	background-size: cover !important;
	position: fixed !important;
	filter: brightness(95%) !important;
	background-position: center !important;
	content: '';
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
}

.card.login {
	box-shadow: 0px 0px 26px rgba(67, 67, 67, 0.5);
}
.btn.next_prev {
	padding: 5px 10px;
}
.next_prev {
	background-color: #e9c28b;
	padding: 2px 8px;
	font-size: 18px;
	letter-spacing: .2rem;
	color: #000000;
	border-radius: 10px;
	border: solid 2px transparent;
	transition: 0.4s;
	overflow: hidden;
	position: relative;
	font-weight: 500;
}

.next_prev:hover {
	background-color: #f9c984;
	color: #FFFFFF;
	transition: 0.5s;
	border: solid 2px #e9c28b;
}

.button-send {
    margin: 10px;
    padding: 15px 30px;
    text-align: center;
    text-transform: uppercase;
    transition: 0.5s;
    background-size: 200% auto;
    color: white;
    border-radius: 10px;
    display: inline-block;
    border: 0px;
    font-weight: 700;
    box-shadow: 0px 0px 10px -2px #2f2b2b;
    background-image: linear-gradient(45deg, #FFABAB 0%, #d58354 51%, #FFABAB 100%);
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    font-size: 18px;
    letter-spacing: .2rem;
    min-width: 150px;
}

.button-send:hover {
    background-position: right center;
    color: #fff;
    text-decoration: none;
    box-shadow: 0px 0px 20px -5px #FFABAB;
}

.button-send:active {
    transform: scale(0.95);
}

.button-send-small {
    margin: 5px;
    padding: 8px 16px;
    text-align: center;
    text-transform: uppercase;
    transition: 0.5s;
    background-size: 200% auto;
    color: white;
    border-radius: 8px;
    display: inline-block;
    border: 0px;
    font-weight: 700;
	box-shadow: 0px 0px 10px -2px #2f2b2b;
    background-image: linear-gradient(45deg, #FFABAB 0%, #d58354 51%, #FFABAB 100%);
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    font-size: 14px;
    letter-spacing: .1rem;
    min-width: 100px;
}

.button-send-small:hover {
    background-position: right center;
    color: #fff;
    text-decoration: none;
    box-shadow: 0px 0px 15px -4px #FFABAB;
}

.button-send-small:active {
    transform: scale(0.95);
}

.button-send-regular {
    margin: 10px;
    padding: 12px 24px;
    text-align: center;
    text-transform: uppercase;
    transition: 0.5s;
    background-size: 200% auto;
    color: white;
    border-radius: 10px;
    display: inline-block;
    border: 0px;
    font-weight: 700;
    box-shadow: 0px 0px 10px -2px #2f2b2b;
    background-image: linear-gradient(45deg, #FFABAB 0%, #d58354 51%, #FFABAB 100%);
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    font-size: 16px;
    letter-spacing: .15rem;
    min-width: 120px;
}

.button-send-regular:hover {
    background-position: right center;
    color: #fff;
    text-decoration: none;
    box-shadow: 0px 0px 18px -5px #FFABAB;
}

.button-send-regular:active {
    transform: scale(0.95);
}

.card.custom {
	border-radius: 10px;
	min-height: 220px;
}

.card.custom .card-header {
	border-radius: 10px 10px 0px 0px;
	background-color: #FCE2DB;
	font-size: 21px;
	padding: 10px 20px;
	text-align: center;
}

.card.custom a {
	color: #5A5A5A;
}

.card-title {
	margin-top: 30px;
	font-size: 21px;
	font-weight: 900;
}

.switch-img {
	width: 12%;
}

/* -------- INPUT -------- */
.form-control:focus {
	border: none !important;
	box-shadow: none !important;
}

.text-input input {
	font-size: 14px;
	width: 100%;
	height: 100%;
	border: 0;
	margin-left: 0px 5px;
	background-color: #F4F1DE;
}

.text-input input:focus-visible {
	outline: none;
}

.text-input label {
	width: 100%;
}

.text-input {
	border: solid 2px #FFABAB;
	border-radius: 10px;
	background-color: #F4F1DE;
	padding: 6px 3px;
	transition: 0.4s all ease;
	display: flex;
	align-items: center;
	height: 45px;
}

.text-input:focus-within {
	border-color: #FFDDC1;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

input[type="number"] {
	-moz-appearance: textfield;
}

/* Personalizzazione della freccia interna (solo WebKit) */
input[type="number"]::-webkit-inner-spin-button {
	background-image: url(../img/up-down.png);
	background-size: cover;
	background-position: center;
	border-radius: 10px;
	height: 32px;
	width: 15px;
	margin: 0px 10px;
}

/* SELECT STYLE */
.select-input {
	border: solid 2px #FFABAB;
	border-radius: 10px;
	background-color: #F4F1DE;
	padding: 2px 0px 2px 0px;
	transition: 0.4s all ease;
	display: flex;
	align-items: center;
	position: relative;
	cursor: pointer;
	height: 45px;
}

.select-input select{
	background-color: #F4F1DE;
}

.select-input:focus-within {
	border-color: #FFDDC1;
}

.select-input i {
	font-size: 23px;
	margin-left: 20px;
	position: absolute;
	right: 10px;
	pointer-events: none;
}

.select-input .selected {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	margin-left: 30px;
}

.select-input .options-container {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	border: solid 2px #FFABAB;
	border-radius: 0 0 20px 20px;
	background-color: #F4F1DE;
	z-index: 100;
}

.select-input .options-container ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.select-input .option {
	padding: 10px 20px;
	cursor: pointer;
	transition: 0.3s;
	font-size: 16px;
}

.select-input .option:hover {
	background-color: #FFDDC1;
	color: #fff;
}

.select-input.open .options-container {
	display: block;
	border-color: #FFDDC1;
}

.select-input.open {
	border-color: #FFDDC1;
	border-radius: 20px 20px 0 0;
}

.select-input .options-container ul .option:last-child {
	border-radius: 0 0 20px 20px;
}

.form-control,
.select2-container--default .select2-selection--single {
	background-color: #F4F1DE !important;
	border: none !important;
}

.form-label,
.form-control-label {
	font-weight: 600 !important;
	font-size: 14px;
	color: #5A5A5A;
	padding: 0px 5px;
	text-transform: uppercase;
}

/* TEXTAREA STYLE */
.text-area textarea {
	width: 100%;
	border: 0;
	margin: 0px;
	font-size: 14px;
	background-color: #F4F1DE;
}

.text-area textarea:focus-visible {
	outline: none;
}

.text-area {
	border: solid 2px #FFABAB;
	border-radius: 10px;
	background-color: #F4F1DE;
	padding: 3px;
	transition: 0.4s all ease;
	display: flex;
	align-items: start;
}

.text-area:focus-within {
	border-color: #FFDDC1;
}

.text-area i {
	font-size: 13px;
}

/* RADIO STYLE */
.radiofield {
	height: 65px;
	width: 100%;
	margin-bottom: 7px;
	line-height: 70px;
	padding-left: 90px;
	position: relative;
	margin: 0px 4px;
}

.radiofield input[type=radio] {
	-webkit-appearance: none;
	position: absolute;
	width: 100%;
	height: 100%;
	border: solid 2px #FFABAB;
	border-radius: 20px;
	top: 0;
	left: 0;
	cursor: pointer;
	background-color: transparent;
}

.radiofield input[type=radio]::before {
	content: "";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 15px;
	color: #F4F1DE;
	border: solid 2px #FFABAB;
	border-radius: 50%;
	background-color: #F4F1DE;
	width: 35px;
	height: 35px;
	line-height: 33px;
	text-align: center;
	position: absolute;
	top: 25%;
	left: 30px;
}

.radiofield input[type=radio]:checked::before {
	content: "\f00c";
	background-color: #FFDDC1;
	border-color: #FFDDC1;
}

.radiofield input[type=radio]:checked {
	border-color: #FFDDC1;
	background-color: #FFF1E6;
}

.radiofield label {
	font-size: 24px;
	color: #5A5A5A;
	font-weight: 500;
}

/* Dropdown Menu */
.dropdown-menu.boxinput {
	border: solid 2px #FFABAB;
	border-radius: 10px;
	background-color: #F4F1DE;
	padding: 20px 0px;
	top: 16px !important;
	transition: 0.4s all ease;
}

/* Main Logo */
.main-logo {
	width: 80%;
}

@media screen and (max-width: 512px) {
	.container.welcome {
		max-width: 100%;
	}

	.main-logo {
		width: 100%;
	}

	.t-file>thead>tr>th {
		font-size: 12px;
	}

	#table>tbody>tr>td:nth-child(3) {
		min-width: 200px;
	}
}