/*PLANNER*/

:root {
  --event-color-light: #faebd7;
  --event-color-dark: #373d59;
  --custom-bg-color-light: #faebd7;
}


.modal .btn-close{
	z-index: 100;
}

.iti {
  display: block !important;
}



/*.ec
{
  height: 100px;
}*/

.border-transparent {
  box-shadow: none;
}

.custom-border-radius {
  border-radius: 10px !important;
}

.custom-background-color {
  background-color: #cfc5b1;
  border-color: #cfc5b1;
  color: #ffffff;
}

#appointmentsListModal
{
  z-index: 2000;
}

#detailsAppModal {
  z-index: 2001;
}

#messageOpenModal {
  z-index: 2001;
  opacity: 1;
}

#deactivationProductModal {
  z-index: 2001;
}

.custom-border {
  --bs-list-group-border-color: #ffff; /* Colore personalizzato */
  --bs-border-width: 0px;
}

.non-clickable {
  pointer-events: none;
}

.outline-red {
  border: 2px solid #ea5455;
}

.square-button {
  width: 50px;
  height: 50px;
  padding: 0;
  transition: background-color 0.3s ease;
}

.modal-backdrop.modal-opacity-second {
  background-color: rgba(0, 0, 0, 0.75);
  opacity: 1;
}

.square-button:hover {
  background-color: gray;
  color: #ffff;
}

.custom {
  padding-right: 0;
}

.fixed-bottom {
  position: fixed;
}

.btn-icon, .btn {
  box-shadow: none !important;
}

.full-width-button {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  border: none;
  background: none;
}

/*ICONE*/

.custom-bg {
  background-color: #2b2b2b;
}

html:not(.dark-style) .custom-bg {
  background-color: var(--event-color-light);
}

.fa-solid {
  margin-right: 10px;
}

.custom-margin-left {
  margin-left: 5px;
}

.card-body.overflow-auto {
  height: 200px;
}

.custom-margin-bottom {
  margin-bottom: 10px;
}

.big-margin-bottom {
  margin-bottom: 20px;
}

.custom-margin-right {
  margin-right: 5px;
}

.custom-margin-top {
  margin-top: 10px;
}

.custom-button {
  width: 100%;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
}

.custom-button .d-flex {
  flex: 1;
  align-items: center;
  justify-content: start;
}

.custom_button_border {
  border: none;
  background: none;
}

#doughnutChart {
  width: 250px !important;
  height: 250px !important;
  display: block;
}

.custom-card {
  border: none;
  box-shadow: none;
  border-radius: 0;
  background: transparent;
  padding: 0;
}

.custom-card .card-body {
  padding: 0;
}


.firstAppointment {
	background-color: rgb(232, 62, 140);
	border: none;
}

.secondAppointment {
	background-color: rgb(111, 66, 193);
	border: none;
}

.regularCustomer {
	background-color: rgb(52, 152, 219);
	border: none;
}

html.dark-style .ec-event {
	background-color: var(--event-color-dark);
}

html:not(.dark-style) .ec-event {
	background-color: var(--event-color-light);
}

#calendar-title{
	text-transform: capitalize;
}



/*.slot::after{
	cursor: pointer;
	content: "";
	display: block;
	position: absolute;
	top: 2px;
	bottom: 2px;
	left: 2px;
	right: 2px;
	border-radius: .25rem;
	background-color: #eeeeee;
}*/



.shake {
	animation: shake 0.5s ease;
}

@keyframes shake {
	0% { transform: translateX(0); }
	25% { transform: translateX(-10px); }
	50% { transform: translateX(10px); }
	75% { transform: translateX(-10px); }
	100% { transform: translateX(0); }
}
#loadingSpinner {
  background-color: rgba(31, 31, 31, 0.356) !important;  /* Sfondo semi-trasparente */
}

#spinner {
  width: 3rem !important;
  height: 3rem !important;
}

.min-h-650{
	min-height: 650px;
}


#div-timeline{
	max-height: 550px;
	overflow-y: auto;
	padding: 10px;
}

.form-group{
	margin-bottom: 1.5em;
}

.form-group-header{
	margin-bottom: 0.25rem;
}

#detailsAppModal .tab-content{
	max-height: 450px;
	overflow-y: auto
}



.appuntamento > .icon{
  color: white !important;
}



.appuntamento-1{
  background-color: #CB9895 !important;
  color: white !important;
}

.appuntamento-1 > .service-title{
  color: #3C3C3B !important;
}

.appuntamento-servizio-1{
  color: #3C3C3B !important;
}

.appuntamento-icone-1{
  color: white !important;
}




.appuntamento-2{
  background-color: #818181 !important;
  color: white !important;
}

.appuntamento-2 > .service-title{
  color: #CFC5B1 !important;
}

.appuntamento-servizio-2{
  color: #CFC5B1 !important;
}

.appuntamento-icone-2{
  color: white !important;
}







.appuntamento-3{
  background-color: #6B231F !important;
  color: white !important;
}

.appuntamento-3 > .service-title{
  color: #CFC5B1 !important;
}

.appuntamento-servizio-3{
  color: #CFC5B1 !important;
}

.appuntamento-icone-3{
  color: white !important;
}




.appuntamento-altro{
  background-color: #3C3C3B !important;
  color: white !important;
}

.appuntamento-altro > .service-title{
  color: #d0c3ad !important;
}

.appuntamento-servizio-altro{
  color: #d0c3ad !important;
}

.appuntamento-icone-altro{
  color: white !important;
}

.appuntamento-2.appuntamento-altro{
	background-color: #000 !important;
	color: white !important;
}


.service-title{
  text-transform: uppercase;
}

.avatar-lg.rounded-circle {
background:#202020;
}

.btn, .nav-link {
	border-radius: 0%!important;
}

.bg-beige{
	background-color: #d0c3ad !important;
}

.bg-primary{
	color: white !important;
}

.btn-primary{
	color: white !important;
}


.btn .btn-icon {
	color: white !important;
}

.preview-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	height: 300px;
	width: 250px;
	padding: 10px;
	border: 1px solid #ddd;
	/*border-radius: 8px;*/
}

.preview-container img,
.preview-container video {
	width: 200px;
	height: 150px;
	object-fit: contain;
	margin-bottom: 15px;
	background: #f9f9f9;
}

input[readonly], input[readonly]:focus {
	background-color: #e0e0e0;
	cursor: not-allowed;
}

.important-warning{
	padding: 10px;
	background-color: #fff3cd;
	border-left: 6px solid #ffa500;
	color: #856404;
	font-weight: bold;
	font-size: 14px;
	margin: 10px 0;
}

.card-wrapper input[type="radio"]:checked + .card {
	border: 2px solid #0d6efd;
	background-color: #e7f1ff;
	box-shadow: 0 0 0 2px #0d6efd33;
}

.card-wrapper .card {
	cursor: pointer;
	transition: all 0.2s ease-in-out;
}

.modal *:not(.badge){
	border-radius: unset !important;
}


/* NEW CUSTOMER*/
.customer-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 1rem;
}

@media (max-width: 1400px) { .customer-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 992px)  { .customer-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px)  { .customer-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 576px)  { .customer-grid { grid-template-columns: 1fr; } }

.customer-card__media img {
	object-fit: cover;
	width: 100%;
	height: 100%;
	display: block;
}

.customer-card:hover {
	transform: translateY(-5px);
}

.customer-sidebar__section{
	border: 1px solid #AEAEAE;
	padding: 16px 20px;
}

.r-0, .r-0 > *{
	border-radius: 0;
}

.pagination .page-item.disabled:first-child {
	display: none;
}

.nav-tabs.nav-header {
	border: none;
	background: none;
	gap: 12px;
}

.nav-tabs.nav-header .nav-link{
	text-transform: uppercase;
	border: 1px solid #AEAEAE;
}

.nav-tabs.nav-header .nav-link.active{
	color: white;
	background-color: var(--bs-primary);
}

.container-fluid .tab-content{
	padding: 0;
}
.table.table-striped thead{
	background-color: var(--bs-primary);
	border: 1px solid #AEAEAE;
	height: 58px;
}
.table.table-striped thead th{
	color: white!important;
}


.table-striped.subscriptions > tbody > tr > *{
	background-color: white!important;
	box-shadow: none!important;
}
.table-striped.subscriptions > tbody > tr.even > *{
	background-color: #F1EEE8!important;
}
.table-striped.subscriptions > tbody > tr.odd > *{
	background-color: white!important;
}
.table-striped .bg-dark, .table-striped .btn-dark{
	background-color: #818181 !important; /*temp*/
	border: 1px solid #AEAEAE;
}
.table-striped tbody {
	font-family: "Nobel-Book", sans-serif !important;
}


	/*REMINDER*/
.reminders .card:nth-child(even), .customer-appointments button:nth-child(even), .customer-giftcards > div:nth-child(even), .staff-giustificativi> div:nth-child(even){
	background-color: color-mix(in srgb, var(--bs-beige) 25%, transparent);
}

.bg-0{
	background-color: #000;
}

/* EVENTS*/
.nav-link.outline.active, .nav-link.outline:hover, .nav-link.outline.active:hover,.nav-link.outline:focus, .nav-link.outline.active:focus{
	box-shadow: none;
	border: 1px solid var(--bs-primary) !important;
}

.staff-list .nav-link:not(.active) {
	opacity: .5;
}

.dt-m-0 *{
	margin: 0!important;
}

.staff-name {
	position: absolute;
	bottom: 0;
	left: 0;
	color: #fff;
	text-transform: uppercase;
	background-color: #6B231F99;
	width: 100%;
	backdrop-filter: blur(9.05px);
	font-family: Nobel, sans-serif;
	font-size: 20px;
	letter-spacing: 0.32px;
}

#ec2 .ec-header{
	background-color: var(--bs-primary);
	color: white;
}

#ec2 .ec-title{
	font-size: 20px;
}

#ec2 .ec-event-title{
	font-size: 16px;
}

#ec2 .bg-dark *{
	color: white !important;
}

.subs-btn .chevron {
	transition: transform 0.3s ease;
}

.subs-btn[aria-expanded="true"] .chevron {
	transform: rotate(180deg);
}

.action-300{
	color: #F1EEE8 !important;
}

.bg-action-300{
	background-color: #F1EEE8!important;
}

ul.pagination:has(> li:nth-child(5):last-child) {
	display: none;
}

.btn-secondary, .btn-secondary:hover{
	color:black!important;
	background-color: #EBEBEB!important;
}

body{
	background-color: white !important;
}

table.dataTable td.dt-control:before, table.dataTable tr.dt-hasChild td.dt-control:before{
	background-color: white;
	color: black;
}


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

.form-check-input[type=checkbox] {
	border-radius: 0;
}

hr{
	border-color:#AEAEAE;
}

.bg-neutral-300, .btn-neutral-300{
	background-color: #AEAEAE;
}

.bg-neutral-300, .btn-neutral-300, .bg-neutral-300:hover, .btn-neutral-300:hover{
	background-color: #AEAEAE;
}

.bg-black{
	background-color: #000!important;
}

.nb{
	font-family: "Nobel-Book", sans-serif !important;
}
.n{
	font-family: "Nobel", sans-serif !important;
}

.menu-item.active .menu-link{
	background-color: white!important;
}
.menu-item.active .menu-link i{
	color: #3C3C3B!important;
}

body{
	font-family: "Nobel", sans-serif !important;
}

.page-header .filters-left h5, .page-header .filters-left h4, .dataTables_info{
	font-family: Nobel, sans-serif;
	font-weight: 400;
	font-size: 20px;
	line-height: 24px;
	letter-spacing: 0.32px;
	color: #AEAEAE;
}

.table-striped .badge{
	font-size: 16px;
	line-height: 20px;
	letter-spacing: 0.32px;
}

.btn-dark{
	background-color: #3C3C3B!important;
}

.f24{
	font-family: Nobel, sans-serif;
	font-size: 24px;
	font-weight: 400;
	line-height: 28px;
	letter-spacing: 0.32px;
	color: #3C3C3B;
}

.f16{
	font-family: Nobel, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 20px;
	letter-spacing: 0.32px;
	color: #3C3C3B;
}

.bg-warning{
	background-color: #FFB800!important;
}
/**
primary: #6B231F
neutral/400 : #818181
neutral/300: #AEAEAE borders
beige: #CFC5B1
neutral/500: #3C3C3B testo

 */