@font-face {
  font-family: "Montserrat";
  src: url("../font/Montserrat-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: Montserrat-Bold;
  src: url(../font/Montserrat-Bold.ttf);
}

@font-face {
  font-family: Montserrat-ExtraBold;
  src: url(../font/Montserrat-ExtraBold.ttf);
}

@font-face {
  font-family: Montserrat-Regular;
  src: url(../font/Montserrat-Regular.ttf);
}

@font-face {
  font-family: Montserrat-Medium;
  src: url(../font/Montserrat-Medium.ttf);
}

@font-face {
  font-family: Montserrat-MediumItalic;
  src: url(../font/Montserrat-MediumItalic.ttf);
}

@font-face {
  font-family: Montserrat-SemiBold;
  src: url(../font/Montserrat-SemiBold.ttf);
}

@font-face {
  font-family: Montserrat-SemiBoldItalic;
  src: url(../font/Montserrat-SemiBoldItalic.ttf);
}

@font-face {
  font-family: Montserrat-SemiBold-Italic;
  src: url(../font/Montserrat-SemiBoldItalic.ttf);
}

@font-face {
  font-family: Montserrat-Black;
  src: url(../font/Montserrat-Black.ttf);
}

@font-face {
  font-family: Montserrat-Light;
  src: url(../font/Montserrat-Light.ttf);
}


@font-face {
  font-family: Montserrat-ExtraLight;
  src: url(../font/Montserrat-ExtraLight.ttf);
}

@font-face {
  font-family: Montserrat-Thin;
  src: url(../font/Montserrat-Thin.ttf);
}

@font-face {
  font-family: Roboto-Regular;
  src: url(../font/Roboto-Regular.ttf);
}


html,
body {
	margin:0;
	padding:0;
	height:100%;
	width:100%; 
	overflow: hidden;
	min-height: 100svh;		
}


.login-container {
	display: flex;
	flex-direction: row;
	height: 100vh;
}

.login-left-panel {		
    height: auto;  
    width: 60%;
    padding: 0; /* Elimină padding-ul, dacă există */
    overflow: hidden; /* Asigură că imaginile care depășesc containerul sunt tăiate */
    position: relative;
    aspect-ratio: 16 / 9; /* Optional: stabilește un raport de aspect fix pentru div */
}


.login-left-panel img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Imaginea umple complet containerul */
    object-position: center; /* Centrează imaginea în container */
}



.login-right-panel {
	width: 40%;
	min-width: 500px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	
}



.login-form {
	width: 400px;
	text-align: center;
	mergin:auto;
	overflow: visible;
		
}

.login-form .login-logo {
	display: block;
	margin: 0 auto 20px auto;
	border: 0px solid red;
}

.login-logo  
{
	width: 220px;
	border: 0px solid red;
	text-align:center;
	padding: 20px 0px;	
}

.login-title  
{
	padding: 15px 0px 0px 0px;
	border: 0px solid red;
	font-size: 25px;
	font-family: Montserrat-Medium;	
	align-items: center;
	color: #4B4DDE;
}


.login-logo  img 
{
	width: 200px;
}
		
.login-input-group {
	position: relative;
	margin-bottom: 20px;
	 /* overflow: hidden; Eliminat */
}



.login-input-group .icon {
	position: absolute;
	padding: 15px;
	top: 50%;
	transform: translateY(-50%);
	color: #777;
	font-size: 16px;
}

.login-input-group .separator {
	position: absolute;
	left: 45px;
	top: 50%;
	transform: translateY(-50%);
	height: 25px;
	width: 1px;
	background-color: #ddd;
}
	

.login-input-group input {
	width: 100%;
	padding: 10px 10px 10px 55px;
	border: 2px solid #ddd;
	border-radius: 10px;
	outline: none;
	font-size: 14px;
	color: #555;
	font-family: Montserrat-Medium;	
    font-size: 16px;
	box-sizing: border-box;
}



.login-form .login-input-submit {
	width: 100%;
	padding: 10px;
	background-image: linear-gradient(#4B4DDE, #6567F8);
	color: white;
	border: none;
	border-radius: 10px;
	font-family: Montserrat-Medium;	
    font-size: 16px;	
	cursor: pointer;
	margin: 10px auto;
	transition: transform .2s;
    position: relative;
    z-index: 1;	
}





.login-parola-group {
	display:flex;
    transition: transform .2s;		
	text-decoration: none;
	width: 160px;
	align-items: center;
	justify-content: center;
	padding:  15px 0;
	margin:auto;
}

.login-parola-group:hover {
	transform: scale(1.1);
    cursor: pointer;	
}



.login-parola-icon {
	padding:  0px 5px 2px 0;
}


.login-parola-text {
	font-family: Montserrat-Medium; 
    font-size: 17px;
	color: #4B4DDE;
    transition: transform .2s; 	
}






@media screen and (max-width: 1024px) {
	.login-container {
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.login-left-panel {
		display: none;
	}

	.login-right-panel {
		width: 100%;
		justify-content: center;
	}

	.login-form {
		margin: 0 auto;
	}
}

@media screen and (max-width: 768px) {
	.login-right-panel {
		align-items: center;
	}

	.login-form {
		width: 90%;
	}
}

@media screen and (max-width: 480px) {
	.login-container {
		justify-content: center;
		align-items: center;
	}

	.login-form {
		width: 90%;
		max-width: 350px;
		margin: 0 auto;
	}
	
	.login-logo  
	{
		width: 180px;
	}

	.login-logo  img 
	{
		width: 180px;
	}	
}



	* {
		margin: 0;
		padding: 0;
		box-sizing: border-box;	
		font-family: Montserrat-Regular;	
	}

	body {
		display: flex;
		flex-direction: column;
		overflow: hidden;           
		min-height: 100svh;  			
	}


	/* Page Layout */
	.main-layout {
		display: flex;
		flex: 1;
		overflow-y: auto;
		padding: 15px 15px 15px 15px;
		min-height: 100svh;        
		background-color: #f5f5f5 ;
		
	}
	
	
	/* Left Layout */
	.left-layout {
		display: flex;
		flex-direction: column;
		position: relative;
		overflow: hidden; /* Prevenim depășirea */
		border: 0px solid red;
		width: auto;
	}

	.left-header {
		display: flex;
		flex-direction: row;	
		align-items: center;			
		border: 0px solid red;
		padding: 8px 0 ;
		flex-shrink: 0;
	}


	.logo-app 
	{
		width: auto;
		border: 0px solid red;
		text-align:center;
		padding: 5px;
		cursor: pointer;
	}

	.logo-app-img-nomral
	{
		height: 25px;
		padding: 0;
	}
	
	.logo-app-img-mic
	{
		height: 30px;
		padding-left: 6px;
	}
	
		
	

  /*right-layout */
	.right-layout {
		flex: 1;		
		background-color: #ffffff;
		border-radius: 8px;
		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
		margin: 0px 0px 0px 10px;
		z-index: 8;	
		width:100%;
		overflow-y: auto;
		overflow-x: hidden;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain; 
		z-index: 1;		
	}


	.right-header {
		position: sticky; 
		top: 0;		
		display: flex;
		justify-content: space-between;	
		align-items: center;	
		padding: 10px 20px;
		border: 0px solid red;
		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); 
		z-index: 9;
		background-color: #ffffff;
	}
	

	
	.right-content {
		width: 100%;
		padding: 20px;
		position: relative;
	}
				


	.box-centrat {
		display: flex;
		justify-content: center; 
		align-items: center; 
		width: 100%;
		position: relative;
		padding: 0 0 20px 0;
	}
	
		
	
	/* Content */
	
	.title {
		font-family: Montserrat-Semibold;	
		font-size: 20px;
		border: 0px solid red;
		display: flex; 
		align-items: center;
		color: #333;
	}


	.title-icon{
		border: 0px solid red;
		padding: 5px 10px 5px 0px;
		display: flex; 
		align-items: center; 	
		font-size: 16px;			
	}

	.inapoi-btn {
		width: auto;
		padding: 7px 15px;
		background-color: #F58D0C;
		border: 1px solid #F58D0C;
		color: white;
		border-radius: 6px;
		font-family: Montserrat-Medium;	
		font-size: 14px;
		cursor: pointer;
		display: inline-flex; 
		align-items: center; 
		transition: transform .1s; /* Animation */	
		margin-right: 10px; /* Adaugă spațiu între 'Înapoi' și 'Șabloane' */
		text-decoration: none;
	}
	
	.inapoi-box {
		padding: 20px 5px;
		border: 0px solid red;
		text-decoration: none;
	}
	
	.inapoi-btn-mic {		
		padding: 6px 8px;
		background-color: #F58D0C;
		color: white;
		border-radius: 6px;
		font-family: Montserrat-Medium;	
		font-size: 16px;
		cursor: pointer;
		display: inline-flex; 
		align-items: center; 
		transition: transform .1s; 
		margin-right: 10px; 
		text-decoration: none;
		display: flex; /* Activează un container flex */
		align-items: center; /* Centrează vertical */
		justify-content: center; /* Centrează orizontal */
		text-align: center; /* Opțional, pentru text */
	}
	
	.inapoi-box-mic {
		padding: 3;
		border: 0px solid red;
		text-decoration: none;
	}


	.back-to-top {
		width: 60px;
		height: 60px;	
		padding: 10px;
		background-color: #7274DF;
		color: white;
		border-radius: 6px;
		font-family: Montserrat-Medium;
		font-size: 20px;
		align-items: center;
		text-align: center;
		text-decoration: none;
		box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
		position: fixed;
		bottom: 120px;
		right: 50px;
		display: flex;
		justify-content: center;
		transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		z-index: 10;
		cursor: pointer;
	}

	.back-to-top.show {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
	}

	.back-to-top.fade {
		opacity: 0.3;
		visibility: visible;
		pointer-events: auto;
	}


	/*BUTOANEEEE +B*/
	.btn-grup{
		align-items: center;	
		display: flex;
		flex-direction: row;
		gap: 15px;
		border: 0px solid red;	
		border-radius: 6px; 
		position: relative; 
		overflow: visible;
	}	
	
	.btn {
		width: auto;
		padding: 5px 10px;
		background-color: #EB2323;
		border: 1px solid #EB2323;
		color: white;
		border-radius: 6px;
		font-family: Montserrat-Medium;	
		font-size: 14px;
		cursor: pointer;
		align-items: center; 
		gap: 4px; 
		transition: transform 0.2s ease, box-shadow 0.2s ease;
		text-decoration: none;
		position: relative; 
		text-align:center;	
		margin: 4px 0;
	}	
	
	.btn-mic {
		width: auto;
		padding: 2px 5px;
		background-color: #EB2323;
		border: 1px solid #EB2323;
		color: white;
		border-radius: 6px;
		font-family: Montserrat-Medium;	
		font-size: 12px;
		cursor: pointer;
		align-items: center; 
		gap: 4px; 
		transition: transform .1s , box-shadow 0.3s; 
		text-decoration: none;
		position: relative; 
		text-align:center;	
		margin: 5px 0;
	}		
	
	
	.btn:hover, .btn-mic, .inapoi-box-mic:hover {
		transform: scale(0.9);
		z-index: 10;
		box-shadow: 0 8px 10px rgba(0, 0, 0, 0.12);
	}

	.btn-disabled {
		color: #fff;
		background-color: #888888 !important;
		border: 1px solid #888888 !important;
	}

	.btn-rosu 
	{
		background-color: #EB2323;
		border: 1px solid #EB2323;
		color: white;		
	}	
	
	.btn-rosu-alb 
	{
		background-color: white;
		border: 1px solid #EB2323;
		color: #EB2323;	
	}	
	
	.btn-albastru 
	{
		border: 1px solid #7274DF;
		background-color: white;
		color: #7274DF;
	}	
	
	.btn-verde 
	{
		border: 1px solid #529214;
		background-color: white;
		color: #529214;
	}		
	
	.btn-purple 
	{
		border: 1px solid #C7A6FF;
		background-color: white;
		color: #C7A6FF;
	}	
	
	.btn-mov 
	{
		border: 1px solid #B44CFF;
		background-color: white;
		color: #B44CFF;
	}
	
	.btn-albastru-secundar
	{
		border: 1px solid #f3f1ff !important;
		background-color:  #6f6ce8 !important;
		color:  white !important;
	}	
	
	.btn-verde-all 
	{
		border: 1px solid #27AE60 !important;
		background-color: #27AE60 !important;
		color: white !important;
	}	

	.btn-verde-deschis {
		background-color: rgb(240, 255, 244) !important;
		color: rgb(39, 174, 96) !important;
		border-width: 2px !important;
		border-style: solid !important;
		border-color: rgb(221, 221, 221) !important;
		border-image: initial !important;
	}

	.btn-verde-all-selected {
		background-color: #9ea8a1 !important;
		border: 2px solid #b4b8b5 !important;
		color: #ffffff !important;
		box-shadow: 0 0 10px rgba(31, 143, 76, 0.35);
		transform: scale(1.02);
	}
	
	.btn-portocaliu 
	{
		border: 1px solid #F58D0C;
		background-color: #F58D0C;
		color: white;
	}		
	
	.btn-portocaliu-alb 
	{
		border: 1px solid #F58D0C;
		background-color: white;
		color: #F58D0C;
	}	
		
	
	.btn-portocaliu-alb 
	{
		border: 1px solid #F58D0C;
		background-color: white;
		color: #F58D0C;
	}	
	

	.btn-negru 
	{
		border: 1px solid #4b5563;
		background-color: white;
		color: #374151;
	}

	.btn-big 
	{
		min-width: 350px;
		heignt: 50px;
		padding: 10px 15px;
		font-family: Montserrat-Medium;	
		font-size: 18px !important;
		border-radius: 10px;
		margin: 10px 0 0px 0;
	}


	.btn-big-acasa 
	{
		min-width: 330px !IMPORTANT;
	}
	
	
	.btn-big-list 
	{
		width: 300px;
		heignt: 50px;
		padding: 10px 15px;
		font-family: Montserrat-Medium;	
		font-size: 18px !important;
		border-radius: 10px;
		margin: 10px 0 0px 0;
	}


	.btn-big-count 
	{
		width: 60px;
		heignt: 60px;
		padding: 10px 10px;
		font-family: Montserrat-Medium;	
		font-size: 18px !important;
		border-radius: 10px;
		margin: 10px 0 0px 10px;
	}
	
		
	.btn-adauga {
		width: 60px;
		height: 60px;	
		padding: 10px;
		background-color: #EB2323;
		color: white;
		border-radius: 6px;
		font-family: Montserrat-Medium;
		font-size: 20px;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		text-decoration: none;
		box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
		position: fixed; 
		bottom: 50px;
		right: 50px;
		transition: opacity 0.3s ease, visibility 0.3s ease;
		z-index: 1000; 
		animation: pulseGlow 6s infinite ease-in-out;
	}	
	
	.btn-adauga-top {
		bottom: 50px;
		right: 120px;
	}
	
	

	@keyframes pulseGlow {
	  0% {
		box-shadow:
		  0 4px 6px rgba(0,0,0,.2),         
		  0 0 0 0 rgba(235,35,35,0);      
	  }


	  5% {
		box-shadow:
		  0 4px 6px rgba(0,0,0,.2),
		  0 0 0 0 rgba(235,35,35,.45);  /* inel rosu (glow) */
	  }
	  
	  30% {
		box-shadow:
		  0 4px 6px rgba(0,0,0,.2),
		  0 0 0 14px rgba(235,35,35,0);     /* inel disipat */
	  }

	  50% {
		box-shadow:
		  0 4px 6px rgba(0,0,0,.2),
		  0 0 0 0 rgba(235,35,35,0);
	  }

	  100% {
		box-shadow:
		  0 4px 6px rgba(0,0,0,.2),
		  0 0 0 0 rgba(235,35,35,0);
	  }
	}
	



	.btn:hover, .btn-adauga:hover, .back-to-top:hover, .inapoi-btn:hover, .inapoi-btn-mic:hover {
		transform: scale(1.04); 
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.10);
		z-index: 11;				
		opacity: 1;
	}

	.btn:disabled {
		color: #fff;
		background-color: #888888 !important;
		border: 1px solid #888888 !important;
		pointer-events: none;
	}
	
	

	hr.despartitor {
		height: 2px; 
		border: 0;
		background-color: #7274DF;
		margin: 10 10;
	}




        @media (max-width: 1024px) {
	
			.btn {
				width: auto;
				padding: 2px 8px;
				font-family: Montserrat-Medium;	
				font-size: 14px;	
			}
	
			.btn-big, .btn-big-list, btn-big-count  
			{
				width: 100% !important;
				padding: 8px 15px;
				font-size: 16px !important;
				min-width: unset;
			}
		
  
			.btn-adauga {
				bottom: 30px; 
				right: 40px;
				font-size: 20px;
				width: 40px;
				height: 40px;	
				box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
				opacity: 0.8;
	
			}

			.btn-adauga-top {
				bottom: 30px;
				right: 100px;
			}
	
			hr.despartitor {
				height: 2px; 
				border: 0;
				background-color: #7274DF;
				margin: 10 0;
			}			

		
        }



        @media (max-width: 720px) {
	
	
			.btn-big, .btn-big-acasa 
			{
				width: 100% !important;
				min-width: 30px !important;;
			}
		
        }
		

	/**************************************************************/


		
		@media (max-width: 820px){
			.right-layout {
				width:100%;
				box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
				border: 0px solid red;
				position: static !important;
				top: 0; /* Asigură-te că rămâne fixat în partea de sus */
				overscroll-behavior: none; /* Dezactivează efectul elastic pe scroll */				
			}		
			
			.right-header {
				padding: 10px 20px;
				border: 0px solid red;
				flex-direction: column;
				text-align: left;
				align-items: start;
				overflow: visible !important;
			} 
						
			.right-content {
				height: auto;
				overflow-x: auto; /* Activăm scroll-ul pe orizontală */				
				text-align:left;
			}
			
			.view {
				overflow-x: auto;
			}			
			
			
			.box-centrat {
				display: block;
				max-width: 100%; /* Pe mobile, ocupă toată lățimea */
				width: 100%; /* Asigură că nu se depășește ecranul */
				padding: 0 0 5px 0;
			}			
			
			.table-max {
				min-width: 1050px; /* Setăm tabelul să păstreze dimensiunea */
			}
	

			.logo-app 
			{
				border: 0px solid red;
				text-align:center;
			}
			
			.logo-app-img-nomral
			{
				height: 22px;
				padding: 0;
			}
			
			.logo-app-img-mic
			{
				height: 27px;
				padding-left: 10px;
			}			
		
			.right-layout::-webkit-scrollbar-track, .right-content::-webkit-scrollbar-track {
				margin-top: 80px; 
			}
			
			.title {
				font-size: 20px;
			}	
			
			.btn-actiune {
				width: auto;
				padding: 3px 6px;
				font-size: 12px;
				gap: 2px;
			}
		


			.inapoi-box-mic {
				width: auto;				
				position: fixed; 
				bottom: 30px; 
				left: 40px;
				opacity: 0.8;
				padding: 5px;
				font-size: 24px; 
			}
			
		
			.inapoi-btn-mic {
				box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
				font-size: 30px;
				width: 60px;
				height: 60px;				
			}		

			.back-to-top {
				bottom: 110px; 
				right: 40px;
			}

			.btn-adauga {
				bottom: 30px; 
				right: 40px;
				font-size: 30px;
				width: 60px;
				height: 60px;	
				box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
	
			}			
		
	


		  .btn-grup {
			display: flex;
			width: 100%;
			overflow-x: auto;
			white-space: nowrap;
			-webkit-overflow-scrolling: touch;
			padding: 2px 0;
			border: 0px solid red; 	
		  }
		  .btn-grup .btn {
			flex-shrink: 0;
			
			}	

	

			/* Scrollbar btn-grup */
			.btn-grup::-webkit-scrollbar {
				height: 8px; 
			}

			.btn-grup::-webkit-scrollbar-track {
				background: #d9d7d7; 
				border-radius: 4px; 
				margin: 5px; 
			}

			.btn-grup::-webkit-scrollbar-thumb {
				background: #edebeb; 
				border-radius: 4px; 
				border: 2px solid #d1cfcf; 			
			}			
		}
		
		
	


		
        @media (max-width: 768px) {
            .main-layout {
                flex-direction: column;
				padding:  10px;
            }

			.right-layout {
				margin: 0px 0px 0px 0px;
			}

			.title {
				font-size: 17px;
			}	
			
			.right-content {
				padding: 10px;	
				overflowY: auto;
				
			}	
			
			.right-content table {
				min-width: auto; /* Setăm tabelul să păstreze dimensiunea */
			}
			
		
            .left-layout {
                width: 100%;
                height: auto;
            }
			
            .left-header {
                width: 100%;
                justify-content: space-between;
				padding: 0px 5px 10px 5px;
				border: 0px solid red;		
            }


			.logo-app 
			{
				border: 0px solid red;
				text-align: left;
				
			}
			
			.logo-app-img-nomral
			{
				height: 20px;
				padding: 0;
			}
			
			.logo-app-img-mic
			{
				height: 20px;
				padding-left: 0px;
			}
			

			.inapoi-btn-mic {
				box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
				font-size: 20px;
				width: 40px;
				height: 40px;		
				opacity: 0.8;				
			}		

			.back-to-top {
				bottom: 90px; 
				right: 30px;
				font-size: 20px;
				width: 40px;
				height: 40px;
				box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
				opacity: 0.8;
			}

			.btn-adauga {
				bottom: 30px; 
				right: 30px;
				font-size: 20px;
				width: 40px;
				height: 40px;	
				box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
				opacity: 0.8;
	
			}

			.btn-adauga-top {
				bottom: 30px;
				right: 100px;
			}
			
			
			.inapoi-box-mic {
				width: auto;				
				position: fixed; 
				bottom: 30px; 
				left: 30px;
				opacity: 0.8;
				padding: 0px;
				font-size: 24px; 
			}	
			
        }

/* =========================================================
   eContracte – Mesaje (CSS curat, unificat)
   - mesajele normale: curate
   - msg-center: aplica stil toast pe ORICE div copil (doar mesaje)
   ========================================================= */

/* ===== Baza comuna pentru TOATE mesajele (normal + msg-center) ===== */
.mesaj_confirmare,
.mesaj_eroare,
.mesaj_avertizare,
.mesaj_informare,
.mesaj_info,
.mesaj_neutru,
.mesaj_neutru_alt{
  font-family: Montserrat-Medium;
  font-size: 14px;
  line-height: 1.55;

  padding: 7px 10px;
  border-radius: 10px;

  text-align: left;
  width: auto;
  box-sizing: border-box;

  margin: 10px 0;
  box-shadow: 0 1px 6px rgba(16,24,40,.06);

  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;

  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ===== Culori rafinate (aproape de nuantele tale, mai “soft premium”) ===== */
.mesaj_confirmare{
  border-left: 4px solid #4f8f16;
  color: #2f5f10;
  background-color: #f1f9dc;
}

.mesaj_eroare{
  border-left: 4px solid #df241d;
  color: #b91c1c;
  background-color: #fff6f6;
}

.mesaj_avertizare{
  border-left: 4px solid #f0a24c;
  color: #b56512;
  background-color: #fff1de;
}

.mesaj_informare{
  border-left: 4px solid #9ed9e6;
  color: #2b6e86;
  background-color: #e7f4fb;
}

.mesaj_info{
  width: 100%;
  border-left: 4px solid #7475f3;
  color: #4f51c9;
  background-color: #f1f1ff;
}

/* ===== Neutre (raman pe stilul tau, doar umbre aliniate) ===== */
.mesaj_neutru{
  background: #f4f5f9;
  border-left: 4px solid #d4d7e6;
  padding: 10px 14px;
  border-radius: 10px;
  margin-bottom: 8px;
  color: #3b3b45;
  box-shadow: 0 1px 6px rgba(16,24,40,.06);
}

.mesaj_neutru_alt{
  background: #eceef5;
  border-left: 4px solid #c7cae2;
  padding: 10px 14px;
  border-radius: 10px;
  margin-bottom: 8px;
  color: #3b3b45;
  box-shadow: 0 1px 4px rgba(16,24,40,.05);
}

/* opțional, pentru „îl pot muta în listă” */
.mesaj_neutru:hover,
.mesaj_neutru_alt:hover{
  background: #eef0ff;
  cursor: grab;
}

/* =========================================================
   Regim special: Mesaje centrate sus (msg-center)
   - centrate, cu card look, dispar cu JS dupa 7s (ramane in JS)
   ========================================================= */
.msg-center{
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 50px;
  z-index: 8;

  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;

  min-width: 295px;
  pointer-events: none;
  text-align: center;
}

/* TOATE div-urile din msg-center sunt mesaje -> stil toast */
.msg-center > div{
  /* pastreaza accentul din stanga (border-left) */
  border-top: 0;
  border-right: 0;
  border-bottom: 0;

  /* toast look */
  padding: 10px 18px;
  border-radius: 10px;

  /* in msg-center folosim gap, nu margin */
  margin: 0;

  /* umbra mai puternica, premium */
  box-shadow: 0 10px 26px rgba(16,24,40,.12), 0 2px 8px rgba(16,24,40,.06);

  pointer-events: auto;
  cursor: pointer;

  /* IMPORTANT: fara animatii CSS care se bat cu jQuery */
  opacity: 1;
  transform: none;
  transition: none;
}

/* Hover premium (discret) */
.msg-center > div:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 32px rgba(16,24,40,.14), 0 4px 12px rgba(16,24,40,.08);
  filter: none;
}

/* responsive */
@media (max-width: 768px){
  .msg-center{
    top: 10px;
    gap: 10px;
    width: 85vw;
  }

  .msg-center > div{
    padding: 10px 14px;
    border-radius: 10px;
    user-select: text;
  }
}

/* =========================================================
   Accente text (stilul tau)
   ========================================================= */
.text_ok{
  color:#4B4DDE;
  font-style: italic;
  font-weight: bold;
}

.text_nok{
  color:#4f8f16;
  font-style: italic;
  font-weight: bold;
}

.text_avertizare{
  color:#b56512;
  font-style: italic;
  font-weight: bold;
}


/* 404 */
.default {
    width: 100%;
    height: 100%; 
    display: flex;
    justify-content: center;
    align-items: center;
	border: 0px solid red; 
}

.default img {
    max-width: 90%; 
    max-height: 100%; 
}

/* Responsivitate */
@media (max-width: 768px) {	
    .default img {
        width: 80%; /* Ajustare suplimentară pentru mobil */
    }
}



/* EROR*/
.error {
    background-color: #fff2f2;
	border: 2px solid #EB2323 !important;
}


.error-checkbox {
    background-color: #fff2f2;
	border: 2px solid #EB2323 !important;
}

.ms-parent.error-checkbox .ms-choice {
    border: 2px solid #e3342f !important; /* roșu aprins */
    background-color: #fcebea !important; /* roz deschis */
    border-radius: 10px;
}

.around-box
{
    display: flex;
    align-items: center;
	width: auto;
	padding: 5px;
	gap: 6px; /* Adaugă un spațiu între input și text */
	border-radius: 6px; 
}

.select2-container.error .select2-selection {
    background-color: #fff2f2;
}




/* Stilizare pentru <select> invalid */
select.error {
    background-color: #fff2f2 !important; /* Fundal roșu pal */
    border: 2px solid #EB2323 !important; /* Bordura roșie */
}

/* Resetarea culorii textului pentru alte opțiuni valide */
select.error option {
    color: #000; /* Text negru pentru opțiunile valide */
}

/* Opțiunea implicită cu valoare "" */
select.error option[value=""] {
    color: #EB2323; /* Text roșu */
    font-weight: bold;
}


.errorContainer {
    position: fixed; /* Fixat în partea de sus a ferestrei */
    top: 150px; /* La 20px de la partea superioară */
    left: 55%; /* Centrat pe orizontală */
    transform: translateX(-50%); /* Corectează poziționarea pentru centrul exact */
    z-index: 998 !important;/* Afișat deasupra tuturor elementelor */
    background-color: #f8d7da; /* Fundal roșu pal pentru eroare */
    color: #721c24; /* Text roșu închis */
    padding: 10px 20px; /* Spațiere interioară */
    border: 1px solid #f5c6cb; /* Bordură */
    border-radius: 10px; /* Colțuri rotunjite */
    display: none; /* Ascuns implicit */
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Umbră pentru vizibilitate */
    font-family: Arial, sans-serif;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
	cursor: pointer;
}

/* General styling for the form on mobile */
@media (max-width: 768px) {
    /* Checkbox styling */
    .around-box {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 5px;
        margin-bottom: 10px; /* Spațiu între elemente */
    }
	
	
	.errorContainer {
		top: 110px; /* La 20px de la partea superioară */
		left: 50%; /* Centrat pe orizontală */
	}	
}




/* TABLE*/
         table {
            width: 100%;
            border-collapse: collapse;
            background-color: #ffffff;
            border: 1px solid #ddd;
            border-radius: 8px;
            overflow: hidden;
			font-family: Montserrat-Regular;
        }
        thead th {                 
			font-family: Montserrat-Regular;
			font-size: 16px;
			font-weight: bold;	
			background-color: #edebeb;	
			color: #333;		
			padding: 15px 15px;
        }
		
		.nocolor:hover {
			background-color: inherit; /* Păstrează culoarea implicită */
		}
				
        th, td {
            padding: 15px 15px;
            text-align: left;
            border-bottom: 1px solid #eee;
			font-family: Montserrat-Regular;
		
			white-space: normal; /* Permite textului să se spargă pe linii multiple */
			word-wrap: break-word; /* Sparge cuvintele prea lungi */
			overflow: visible; /* Asigură afișarea completă a textului */
			height: auto; /* Înălțimea se ajustează automat */	
			color: #333;		
        }
        th {
            font-weight: bold;
            color: #495057;
        }
		
        th {
            
            position: relative;
			user-select: none;
        }

		th a {
			display: inline-flex;
			align-items: center;
			gap: 5px; /* Spațiu între text și icon */
			text-decoration: none;
			color: #333;
			cursor: pointer;
		}

		th i {
			margin-left: 5px;
			font-size: 14px;
			color: #777;
		}

		th.ExcludereSortare {
			cursor: default; /* Cursor normal */
		}	
	
		.wrap {
		  overflow-wrap: anywhere;
		  word-break: break-word;
		  white-space: normal;
		  max-width: 150px;
		}	
		
        tr:last-child td {
            border-bottom: none;
        }
        tr:nth-child(even) {
            background-color: #fdfdfd;
        }
        tr:hover {
            background-color:#f1f1f1 !important;
        }
        th:first-child, td:first-child {
            border-top-left-radius: 8px;
            border-bottom-left-radius: 8px;
        }
        th:last-child, td:last-child {
            border-top-right-radius: 8px;
            border-bottom-right-radius: 8px;
        }

        /* Butoane de acțiune */
        .action-buttons {
            display: flex;
			justify-content: flex-start;
			gap: 10px; /* Distanța între copii */
			padding: 3px 0;
        }
		
        .action-buttons span {
            cursor: pointer;
            font-size: 18px;
			margin-left: 0;
			margin-right: auto;
        }

		.wrap {
			white-space: normal !important;
			overflow-wrap: anywhere !important;
			word-break: break-word;
		}



        /* Responsivitate */
        @media (max-width: 768px)
		{
            table, thead, tbody, th, td, tr {
                display: block;
				table-layout: fixed; /* Forțează tabelul să respecte dimensiunile specificate */
            }
            th, td {
                padding: 6px;			
            }
            thead tr {
                display: none; /* Ascundem capul tabelului */
            }
            tr {
                margin: 0;
                border-bottom: 2px solid #ddd;
            }
			
			/* Suprascrie stilurile pentru clasa not-found */
			tr.not-found {
				padding-left: 0 !important; /* Elimină padding-ul la stânga */
				text-align: center; /* Centrează textul */
			}

			/* Centrarea textului în interiorul celulei */
			tr.not-found td {
				padding: 10px 0; /* Adaugă padding egal */
				text-align: center; /* Centrează textul în celulă */
			}

			/* Elimină efectele de padding pentru coloana implicită */
			tr.not-found td::before {
				content: none; /* Ascunde pseudo-elementul */
			}		
			
			/* Adaugă efect de hover pe tr și td */
			tr:hover, td:hover {
				border-bottom: 2px solid white; /* Linie albă sub rând */
				background-color: #f1f1f1; /* Păstrează culoarea hover */
			}

			/* Pentru a menține consistența stilurilor în mod mobil */
			tr:hover td {
				background-color: inherit; /* Menține culoarea de hover */
				border-bottom: 2px solid white; /* Linie albă doar la hover */
			}	

			th:first-child, td:first-child {
				border-top-left-radius: 0px;
				border-bottom-left-radius: 0px;
			}
	
			td {
				display: flex;
				align-items: center;      /* 👈 centru vertical */
				justify-content: flex-end; /* păstrează conținutul la dreapta */

				text-align: right;
				position: relative;
				padding-left: 30%;
				min-height: 25px; /* puțin mai mare ca să arate aerisit */
				font-size: 14px;
			}

			td::before {
				content: attr(data-label);
				position: absolute;
				left: 15px;
				text-align: left;
				font-weight: bold;
				color: #888;
			}

			/* Stil pentru butoanele din coloana Acțiuni */
			.action-buttons {
				display: flex;
				justify-content: flex-end; /* Poziționează butoanele în dreapta */
				gap: 30px; /* Spațiu între butoane */
				align-items: center; /* Aliniere pe verticală */
				width: auto; /* Asigură că ocupă toată lățimea celulei */
				margin: 0; /* Elimină marginile */
				padding: 0; /* Elimină padding-ul */
				border: 0px solid blue;
			}			
		
			.action-buttons span {
				cursor: pointer;
				font-size: 20px;
				margin: 0;
				border: 0px solid blue;
			}
			
        }
	




	

/* PAGINATIE */
	.paginatie {
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 9px 0;
		margin: 5px 0 0 0;
		gap: 10px; 
		overflow: visible; /* Permite afișarea completă */		
		background-color: #edebeb;
		border-radius: 6px;
		
	}	

		
	.paginatie-nr{	
		width:auto;
		background-color: white;
		padding: 6px 10px;
		font-size: 14px;
		text-align: center;
		border: 1px solid #e8e8e8;
		font-weight: bold;	
		border-radius: 6px;
		text-decoration: none;
		color: #333;		
		transition: transform .2s;
	}

	.paginatie-nr-curent{
		background-color: #7274DF;
		border: 1px solid #e8e8e8;
		color: #FFF;	
		transition: transform .2s;	
		min-width: 14px;
		padding: 6px 10px;
		font-size: 14px;
		text-align: center;
		font-weight: bold;	
		border-radius: 6px;
		text-decoration: none;
		transition: transform .2s;		
	}


	.paginatie-nr:hover, .paginatie-nr-curent:hover {
		transform: scale(1.1); /* Opțional: efect subtil de mărire */
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
	}
	.paginatie-nr:active, .paginatie-nr-curent:active {
		background-color: #EB2323;
		color: white;
	}
		
        @media (max-width: 768px)
		{
			.paginatie{
				gap: 5px; 
			}			
		
			.paginatie-nr{		
				font-size: 14px;
			}

			.paginatie-nr-curent{
				min-width: 14px;
			}
		}
	


			
	.stare
	{
		display: inline-block;
		padding: 5px 10px;
		font-size: 14px;
		white-space: nowrap;	
		color: #fff;
		text-align: center;
		vertical-align: middle;
		border-radius: 6px;
		font-family: Montserrat-Medium;
	}		



        @media (max-width: 768px)
		{
			.stare
			{
				padding: 3px 7px;
				font-size: 14px;
			}
		}
		

/* =========================
   Overlay inactivitate — CSS complet
   ========================= */

/* Overlay (implicit = avertizare) */
#Overlay{
  display:none; position:fixed; inset:0; z-index:999999;
  background:#000000C7;              /* ~ rgba(0,0,0,.78) */
  color:#FFFFFF;
  transition: background-color .25s ease;
}

/* Overlay FINAL (deconectare) – activează cu .is-final pe #Overlay din JS */
#Overlay.is-final{
  background:#000000F0;              /* ~ rgba(0,0,0,.94) */
}

/* Centrare card */
#Overlay .idle-center{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:min(92vw,520px);
}

/* Card semi-transparent */
#Overlay .idle-card{
  backdrop-filter: blur(4px);
  background:#1E1E23DB;              /* ~ rgba(30,30,35,.86) */
  border:1px solid #FFFFFF14;        /* ~ rgba(255,255,255,.08) */
  border-radius:16px;
  padding:24px;
  text-align:center;
  box-shadow:0 12px 34px #00000047;  /* ~ rgba(0,0,0,.28) */
}

/* Claritate text (fără halo) */
#Overlay .idle-card, 
#Overlay .idle-card *{
  text-shadow:none !important;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* Tipografie */
#Overlay h2{
  margin:0 0 14px 0;                 /* spațiu sub titlu */
  font-size:clamp(18px,2.6vw,26px);
  font-weight:700;
  letter-spacing:.2px;
}
#Overlay p{
  margin:0 0 12px 0;
  font-size:clamp(14px,2.1vw,16px);
  line-height:1.5;
}

/* Rândul cu countdown – flexibil, nu iese din card */
#Overlay .count-row{
  margin:26px 0 12px 0;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:6px;
}
#Overlay .cr-text{ display:inline; }

/* Insignă pentru contor (calm, alb translucid) */
#Overlay .count-badge{
  display:inline-flex; align-items:center; gap:6px;   /* <- spațiu controlat între număr și unitate */
  padding:2px 8px; border-radius:8px;
  background:#FFFFFF1E; border:1px solid #FFFFFF2E;
  font-weight:700; font-variant-numeric: tabular-nums;
}
#Overlay .count-badge #Countdown{ display:inline; }   /* fără min-width ca să nu rămână gol la 1 cifră */
#Overlay .count-badge .count-unit{ display:inline; }  /* poți stiliza separat unitatea dacă vrei */



/* Butoane */
#Overlay .btn, 
#Overlay .btn-link{
  display:inline-block; padding:10px 18px; font-size:15px;
  border-radius:10px; border:none; cursor:pointer;
  background:#FFFFFF; color:#222222; text-decoration:none;
  box-shadow:0 2px 12px #00000040;   /* ~ rgba(0,0,0,.25) */
  transition:transform .05s ease, opacity .15s ease;
}
#Overlay .btn:hover, 
/*#Overlay .btn-link:hover{ transform:translateY(-1px); }*/
#Overlay .btn:active, 
#Overlay .btn-link:active{ transform:none; opacity:.9; }

#Overlay .actions{ margin-top:18px; }

/* Mobile tweaks */
@media (max-width:480px){
  #Overlay .idle-card{ padding:20px; border-radius:14px; }
  #Overlay .btn, #Overlay .btn-link{ width:100%; }
}

/* Secțiunea finală (ascunsă inițial; JS o afișează la nevoie) */
#MesajDeconectare{ display:none; }





/* INPUT SI FORMS*/


			
		
	.formular {
		
		border: 0px solid red;
		padding: 10px; /* Opțional pentru spațiu */
		box-sizing: border-box; /* Include padding și border */	
		overflow: visible;
	}
		
	.grup-formular {
		max-width: 390px;
		margin: auto;
		border: 0px solid red;
		padding: 10px 20px ;
		margin: 0; 
		align-self: flex-start;
	}


	/* full width (ai pus deja) */
	.grup-formular.full {
	  width: 100%;
	  max-width: 800px;
	  min-width: 400px;
	  flex: 0 0 100%;
	}
	
	.grup-formular ul {
	  list-style-type: disc;
	  padding-left: 20px;
	}	
		
	.grup-auto {
		max-width: unset;
	}

	.grup-text {
		flex: 1;
		width: 100%;
		text-align:left;
		border: 0px solid red;
		padding: 0px 0px 10px 0px ;
		font-family: Montserrat-Semibold;
		font-size: 12px;	
		color: #333;
		text-transform: uppercase;
		display: flex;
		align-items: center; /* Aliniază elementele pe verticală */
		gap: 5px; /* Distanță între text și icon */	
	}



	.grup-optiune {
		flex: 0 0 auto;
		padding: 0 0 0px 0;
		border: 0px solid pink;
		margin: 0 0 0 0px;
		width: 100%;
		min-width: 350px;	

	}

	.checkbox-container {
		display: flex;
		flex-direction: row;
		align-items: left; /* Centrează checkbox-urile și textele */
		gap: 5px; /* Distanță între fiecare rând */
		padding: 4px 0px;
	}



	.grup-optiune input[type="text"], .grup-optiune input[type="password"], .grup-optiune input[type="number"], .grup-optiune input[type="tel"]{
		width: 100%;
		min-width: 300px;
		height: 50px;
		padding: 10px;
		border: 2px solid #ddd;
		border-radius: 10px;
		font-family: Montserrat-Regular;
		font-size: 14px;	
		box-sizing: border-box; /* Include padding și border */
		color: #333;		
		margin-bottom: 8px;
	}
	
	.input-data
	{
		min-width: 173px !important;		
		width: 173px !important;		
	}

	.grup-optiune select {
		width: 100%;
		min-width: 350px;
		height: 50px;
		padding: 10px 35px 10px 10px;
		border: 2px solid #ddd;
		border-radius: 10px;
		font-family: Montserrat-Regular;
		font-size: 14px;	
		color: #333;
		background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath d='M0 0l5 5 5-5z' fill='%23333'/%3E%3C/svg%3E") no-repeat right 15px center;
		background-size: 12px; /* Ajustează dimensiunea săgeții */
		margin-bottom: 8px;
		appearance: none; /* Elimină stilurile native */
		-moz-appearance: none;
		-webkit-appearance: none;	
	}


	.grup-optiune input[type="file"] {
		width: 100%;
		min-width: 350px;
		padding: 10px;
		border: 2px solid #ddd;
		border-radius: 10px;
		font-size: 14px;
		color: #333;	
		margin-bottom: 8px;
		display: flex;
		align-items: center; /* Centrează vertical */
		justify-content: center; /* Centrează orizontal */
		text-align: center;	
	}


	.grup-optiune textarea {
		width: 100%;
		min-width: 350px;
		height: 80px;	
		border: 2px solid #ccc;
		font-size: 14px;
		padding: 10px;
		border-radius: 10px;
		resize: none;
		color: #333;
		margin-bottom: 8px;
	}
	
	.MesajCatreClient {
		height: 150px !important;	
	}



	input[type=checkbox] {
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;	
		position: relative;
		width: 20px;
		height: 20px;
		border: 1px solid #ccc;
		border-radius: 6px;
		background-color: white;
		cursor: pointer;
		transition: all 0.3s ease;
		color: #333;
		flex-shrink: 0;
		box-sizing: border-box;
		background-clip: content-box;
	}

	input[type="checkbox"]:checked::after {
		content: '\f00c'; /* Codul Font Awesome pentru check */
		font-family: 'Font Awesome 6 Free'; /* Asigură-te că folosești familia corectă */
		font-weight: 900; /* Pentru a afișa corect simbolul */
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		color: white;
		font-size: 14px;
	color: white !important; /* Face simbolul ✔ alb */
	}

	input[type="checkbox"]:checked {
		position: relative;
		background-color: #7274DF;
		border: 1px solid #CCC;
		box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.05);
		color: black;
		cursor: pointer;	
	}


	input[type="checkbox"]:hover {
		box-shadow: 0 0 5px rgba(75, 77, 222, 0.);
		border-color: #4B4DDE;
	}


	input[type=radio] {
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;	
		position: relative;
		width: 20px;
		height: 20px;
		border-radius: 50%;
		border: 1px solid #ccc;
		background-color: white;
		cursor: pointer;
		transition: all 0.3s ease;	
		padding: 3px;
		background-clip: content-box;
		flex-shrink: 0;
		box-sizing: border-box;
		background-clip: content-box;		
		
	}

	input[type="radio"]:checked {
		background-color: #7274DF;
		border: 1px solid #7274DF;
	}

	input[type="radio"]:hover {
		border-color: #4B4DDE;
	}

	input[type="text"]:focus, 
	input[type="password"]:focus, 
	input[type="number"]:focus, 
	input[type="tel"]:focus, 
	select:focus, 
	textarea:focus {
		border: 2px solid #4B4DDE; 
		outline: none; 
	}


	.dreapta {
		justify-content: flex-end; /* Mută conținutul la dreapta */
	}


		/* General styling for the form on mobile */
		@media (max-width: 1024px) {
			input, select, textarea {
				font-size: 16px !important;
			}	
			

			.formular {
				width: 100%;
			}
			.grup-formular {
				width: 100%;
				max-width: 100%;
				padding: 0px 10px 10px 10px;
			}


			.grup-text {
				width: 100%; /* Lățime completă pentru etichete */
				min-width: 100px;
				margin-bottom: 5px; /* Spațiu între label și input */
				padding: 0px 0px 4px 2px ;
				font-family: Montserrat-Bold;
				font-size: 13px;	
			}

			.grup-optiune {
				width: 100%; /* Lățime completă pentru input-uri */
				margin: 0;
				min-width: auto;
			}


			.grup-optiune input[type="text"],
			.grup-optiune input[type="password"],
			.grup-optiune input[type="number"],
			.grup-optiune input[type="tel"] {
			  
				width: 100%; /* Lățime completă pe ecrane mici */
				min-width: auto;
				height: 40px;
				font-size: 14px; /* Dimensiune font ajustată */
				padding: 8px;
				box-sizing: border-box;
				color: #333;
				margin-bottom: 4px;
			}

			.input-data
			{
				min-width: 100px;		
				width: 100% !important;		
			}
	
			.grup-optiune select{
			  
				width: 100%; /* Lățime completă pe ecrane mici */
				min-width: auto;
				height: 40px;
				font-size: 14px; /* Dimensiune font ajustată */
				padding: 8px 30px 8px 8px;	
				box-sizing: border-box;
				color: #333;
				margin-bottom: 4px;
			}
			


			.grup-optiune input[type="file"] {
				min-width: 100px;
				height: 40px;
			display: flex;
			align-items: center; /* Centrează vertical */
			justify-content: center; /* Centrează orizontal */
			text-align: center;			
			}
			.grup-optiune textarea {
				min-width: 100px;
				width: 100%; /* Lățime completă pe ecrane mici */
				height: 100px;
				resize: none;
				padding: 7px;
				color: #333;
			}



			input[type="checkbox"],
			input[type="radio"] {
				width: 18px;
				height: 18px; /* Ajustăm dimensiunile pentru mobile */
			}

			

		}




/* TAB */
	.tab {
		min-width: auto;
		max-width: 850px;
		margin: 0px auto 0px auto;
		border-radius: 10px !important;
		box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
		background-color: #ffffff;
		position: relative; /* Asigură stratificarea corectă */
		transition: width 0.3s ease;
		border: 0px solid red;
		align-self: flex-start;
	}



	.tab-header {
		display: flex;
		justify-content: space-between; /* Plasează elementele la capete */
		align-items: center;
		background-color: #7274DF;
		padding: 14px 16px;
		font-size: 18px;
		font-weight: bold;
		color: white;
		position: relative;
		margin-top: 0;
		border-radius: 8px  8px 0 0 !important;
	}



	.tab-content {
		padding: 10px;
		font-size: 14px;
		color: #555555;
	}


	.tab:hover {
		box-shadow:
	  0 8px 10px rgba(15,23,42,.10),
      0 4px 10px rgba(15,23,42,.06);
	}

		/* Responsive Design */
		@media (max-width: 1024px) {
			.tab {
				width: 100%;
				margin: 0px auto 10px auto;
				min-width: auto !important;
			}

			.tab-header {
				padding: 10px 10px;
				font-size: 16px;
				border: 0px solid red;	
			}

			.tab-content {
				border: 0px solid red;
			}

		}


		#tab-avizier {
		  max-height: 80vh;
		  overflow-y: auto;
		}

		#tab-avizier .tab-header {
		  position: sticky;
		  top: 0;
		  z-index: 2;
		  border-radius: 8px 8px 0 0 !important;
		}


		.box-flex {
			display: inline-flex; /* Permite containerului să aibă lățimea conținutului */
			justify-content: center; /* Centrează taburile pe orizontală */
			align-items: flex-start; /* Centrează taburile pe verticală */
			gap: 20px; /* Spațiere între taburi */
			width: auto; /* Se mulează pe dimensiunea taburilor */
			margin: 0 auto; /* Centrează containerul pe orizontală */
		}
			
		.flex {
			display: flex;
			justify-content: center; /* Centrează pe orizontală */
			align-items: center; /* Centrează pe verticală */
			text-align: center; /* Opțional, pentru text */
			border: 0px solid red;
		}
			
		.flex-stange-dreapta{
			display: flex;
			justify-content: space-between; /* Un element în stânga, altul în dreapta */
			align-items: center; /* Opțional: aliniere verticală */
			border: 0px solid red;
		}
		

		


		


	
		@media (max-width: 1024px) 
		{
			.box-flex {
				flex-direction: column; /* Elemente poziționate unul sub altul */
				gap: 10px; /* Adaugă un spațiu între elemente (opțional) */
				width: 100%;
			}
			
			.box-flex-reverse {
				flex-direction: column-reverse; /* Inversează ordinea elementelor */

			}	
	
		}


	#LogoPreview{
		border: 0px solid red;
		max-width: 300px;
		margin: auto;
		text-ali:center;
		display: flex;
		align-items: center;
	}
	
	
		
	/*  CAUTAREEEEEE */
	.overlay-cautare, .overlay-cautare_rapid {
		display: none;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.5);
		z-index: 9999 !important;
	}

	/* Containerul de căutare - inițial ascuns */
	.cautare, .cautare_rapid {
		display: none;
		position: fixed;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		z-index: 10000;
		border-radius: 8px;
		box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
		border: 0px solid red;
		width: 100% important!;
		max-height: 600px;
		height: auto;
		overflow-x: hidden; /* Ascunde scroll-ul orizontal */
		overflow-y: auto; /* Permite scroll doar vertical */
		max-height: 90vh; /* Evită ca fereastra să fie prea mare */

		
	}


	.ui-autocomplete {
		z-index: 10001 !important; 
		max-width: 350px  !important;
		position: absolute; 
		border: 1px solid #ccc; 
		max-height: 200px; 
		border-radius: 10px;
	}
	
	/* Stil pentru fiecare element din lista de sugestii */
	.ui-menu-item-wrapper {
		padding: 8px 12px;
		font-size: 14px;
		color: black; /* Culoare text */
		cursor: pointer;
		border-radius: 10px; /* Rotunjire */
	}

	/* Efect de hover */
	.ui-menu-item-wrapper:hover {
		background: #7274DF !important; /* Fundal mov-albăstrui */
		color: white !important;;
	}


	.cautare-cap {
    position: sticky;
    top: 0;
    left: 0;
    width: 100%; /* Acoperă întreaga lățime */
    background-color: #7274DF; /* Culoare identică cu headerul */
    z-index: 1050; /* Se asigură că rămâne deasupra */
    padding: 16px;
    color: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	}	
	
	

		@media (max-width: 1024px) 
		{
			.cautare {
				border-radius: 8px;
				width: 90%;
				height: auto;
				max-height: 60%;
			}			
		}
		
		
	/*  MESAJE / INFORMARI */	
	.mesaje {
		width: 100%;
		max-width: 350px;
		border: 0px solid red;
	}
	
		@media (max-width: 1024px) 
		{
			.mesaje {
				max-width:  100%;
			}			
		}	
		
		
		
		
	/* TITLE _ INFO */	
	.tooltip-container {
		position: relative;
		display: inline-flex; /* Asigură alinierea corectă */
		align-items: center;
		cursor: pointer;
	}

	.tooltip-text {
		visibility: hidden;
		background-color: #333;
		color: white;
		text-align: left;
		padding: 6px 10px;
		border-radius: 6px;
		position: fixed; /* Îl scoatem din orice container */
		left: 0; /* Se va seta dinamic prin JavaScript */
		top: 0; /* Se va seta dinamic prin JavaScript */
		transform: translate(-50%, 5px); /* Ajustează poziția */
		white-space: normal;
		font-size: 12px;
		opacity: 0;
		transition: opacity 0.3s, transform 0.3s;
		text-transform: none;
		border: 1px solid #ddd;
		cursor: pointer;
		z-index: 99999 !important; /* Se asigură că este deasupra altor elemente */
		max-width: 250px;
		box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
	}

	.tooltip-container:hover .tooltip-text {
		visibility: visible;
		opacity: 1;
		transform: translateX(-50%) translateY(3px);
	}		



	 /* Sabloane */
	.etichete-container_2 {
		width: 400px;
		background: #ffffff; /* fundal alb curat */
		padding: 20px 15px;
		border-radius: 8px;
		max-height: 75vh;
		overflow-y: auto;
		z-index: 10;
		
	}	 
	 
	 
	.etichete-container {
		position: fixed;
		right: 15px;
		top: 75px;
		width: 400px;
		background: #ffffff; /* fundal alb curat */
		padding: 20px 15px;
		border-left: 3px solid #3c72e2; /* doar margine stânga colorată */
		border-radius: 8px;
		box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
		max-height: 90vh;
		overflow-y: auto;
		z-index: 10;
		
	}

	.sablaone-eticheta {
		margin-bottom: 6px;
		display: flex;
		align-items: center;
		gap: 4px;
		line-height: 1.4;
		flex-wrap: wrap; /* Permite trecerea pe rând nou */	
		padding: 2px 0px 2px 5px;
		font-size: 14px;
	}
	

	.eticheta-item {
		background: #3c72e2;
		color: white;
		padding: 6px 10px;
		border-radius: 4px;
		cursor: grab;		
		transition: background 0.2s ease;
	}


	/* Evidentiere clara (verde) cand eticheta a fost folosita */
	.eticheta-item.activata,
	.sablaone-eticheta-text.activata{
		background: #529214 !important;
		border-color: #529214;
		color: white !important;
		opacity: 0.8;
	}


	

	.sablaone-editare-title {
		width: auto;
		padding: 6px 10px 2px 6px;
		font-family: Montserrat-SemiBold;	
		font-size: 16px;
		position: relative; 
		text-align:left;	
		border-bottom: 0px solid #888;
		color: #777;
	}
	
	.sablaone-editare-subtitle {
		width: auto;
		padding: 10px 6px 2px 6px;
		font-family: Montserrat-Regular;	
		font-size: 16px;
		position: relative; 
		text-align:left;	
		border: 0px solid #888;
	}


	.sablaone-editare-categorie {
		color:#888;
		font-family: Montserrat-Bold;
		font-size: 16px;
		margin: 16px 0 6px 0;
		border: 0px solid #8586ff;
	}	
	
	.sablaone-eticheta-text {
		font-family: Montserrat-SemiBold;	
		font-size: 14px;		
		color: #4B4DDE;
		border: 1px solid #7274DF;
		background-color: white;
		padding: 6px 8px; /* Ușor mai mare pentru aliniere corectă */
		border-radius: 4px;
		transition: transform .1s, box-shadow 0.3s;
		cursor: pointer;
		display: inline-flex; /* Se adaptează la conținut */
		align-items: center; /* Aliniază textul în mijloc vertical */
		justify-content: center; /* Centrare pe orizontală */
		max-width: 500px;
	}	 
 
	.sablaone-eticheta-text:hover {
		transform: scale(1.1); /* Opțional: efect subtil de mărire */
		z-index: 11;
	}
	
	
	.eticheta-btn.activ {
		background-color: #7274DF; /* sau orice albastru mai intens */
		color: white;
	}	

	.sablaone-optine-text{
		font-family: Montserrat-SemiBold;	
		font-size: 14px;		
		padding: 10px 0px 6px 0px; /* Ușor mai mare pentru aliniere corectă */
		text-align: left; /* Asigură textul centrat în interior */
		border: 0px solid #8586ff;
	}
		
	.aranjare {
		opacity: 0.5;
		border: 2px dashed #007bff;
		background-color: #e6f0ff;
		cursor: grabbing;
		box-shadow: 0 0 10px rgba(0, 123, 255, 0.4);
		transition: all 0.2s ease;
	} 
	
	.container-scroll {
		max-height:60vh;            /* înălțimea maximă = înălțimea viewportului */
		overflow-y: auto;             /* activează scroll vertical */
		padding-right: 10px;          /* mic spațiu pentru scroll-bar */
		scroll-behavior: smooth;      /* scroll lin */
		border: 0px solid red;
	}		
	
	.container-scroll-full {
		max-height:75vh;            /* înălțimea maximă = înălțimea viewportului */
		overflow-y: auto;             /* activează scroll vertical */
		padding-right: 10px;          /* mic spațiu pentru scroll-bar */
		scroll-behavior: smooth;      /* scroll lin */
		border: 0px solid red;
	}	
	
		@media (max-width: 1024px) 
		{
			.sablaone-eticheta {
				flex-direction: column; /* Elemente unul sub altul */
				align-items: flex-start; /* Aliniere la stânga */
			}		
		}		




	.drop-zone {
		min-height: 100px;
		background-color: #f0f3ff;
		border: 2px dashed #7274DF;
		border-radius: 8px;
		padding: 10px;
		margin-bottom: 15px;
		font-family: Montserrat-Medium;
		font-size: 14px;
		color: #4B4DDE;
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
		align-items: center;
		justify-content: flex-start;
	}
	.drop-zone .eticheta-item {
		cursor: default;
	}


	.verificare-numar {
		display: flex;
		align-items: center;
		text-align: left;
		gap: 14px;
	}

	@media (max-width: 720px) 
	{
		.verificare-numar {
			flex-direction: column;
			align-items: start;
			text-align: left;
			gap:4px; 
			margin-bottom: 8px;
		}
	}


/* ----------------------------------- */




/* pastrezi rezerva pe desktop */
.tab-offset-dreapta .tab {
  margin-right: 420px; /* rezervă spațiu pentru etichete */
}



/* 2) Sub 1200px: ascundem din layout si folosim drawer */
@media (max-width: 1500px) {
  .etichete-container {
    display: none; /* o mutam in drawer */
  }
  .tab-offset-dreapta .tab {
    margin-right: 0 !important;
  }
  #btnEticheteFab {
    display: inline-flex !important;
  }
}

/* ===== Drawer Etichete (premium) ===== */
#btnEticheteFab{
  display:none;              /* ramane controlat de media query */
  position: fixed;
  right: 25px;
  top: 55%;
  transform: translateY(-50%);
  z-index: 12;

  gap: 10px;
  align-items:center;
  padding: 10px 14px;
  border-radius: 10px;

  border: 1px solid #529214;
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(0,0,0,.16);

  font-family: Montserrat-SemiBold;
  font-size: 15px;
  color: #529214;
  cursor:pointer;
}



/* pe mobile foarte ingust -> jos, DAR mai mare */
@media (max-width: 520px) {
  #btnEticheteFab{
    transform: none;
    padding: 10px 14px;
    font-size: 16px;
    box-shadow: 0 14px 34px rgba(0,0,0,.20);
  }
}

#eticheteDrawerOverlay{
  display:none;
  position:fixed;
  inset:0;
  background: rgba(0,0,0,.45);
  z-index: 9998;
}

#eticheteDrawer{
  position:fixed;
  top:0;
  right:0;
  height:100vh;
  width: 420px;
  max-width: 92vw;
  background:#fff;
  z-index: 9999;
  transform: translateX(102%);
  transition: transform .18s ease;
  box-shadow: -18px 0 40px rgba(0,0,0,.18);
  display:flex;
  flex-direction:column;
}

#eticheteDrawer.open{
  transform: translateX(0);
}

#eticheteDrawerHeader{
  position: sticky;
  top:0;
  background:#fff;
  padding: 14px 16px;
  border-bottom: 1px solid #eef0ff;
  display:flex;
  align-items:center;
  justify-content: space-between;
}

#eticheteDrawerHeader .ttl{
  font-family: Montserrat-SemiBold;
  font-size: 16px;
  color:#333;
}

#eticheteDrawerClose{
  border:0;
  background:#f6f6ff;
  color:#4B4DDE;
  border-radius:10px;
  padding:8px 10px;
  cursor:pointer;
}

#eticheteDrawerBody{
  padding: 12px 14px;
  overflow:auto;
}

/* cand .etichete-container e in drawer, o facem normala (nu fixed) */
#eticheteDrawerBody .etichete-container{
  display:block !important;
  position: static !important;
  width: auto !important;
  max-height: none !important;
  right:auto !important;
  top:auto !important;
  box-shadow:none !important;
  border-left: 0 !important;
  padding: 0 !important;
}




/* highlight scurt cand adaugi eticheta prin tap pe mobil */
.pdf-field.just-added{
  outline: 2px solid #529214;
  box-shadow: 0 0 0 6px rgba(82,146,20,.18);
  transition: box-shadow .25s ease, outline-color .25s ease;
}







	/* Scrollbar General */ 
	.right-layout::-webkit-scrollbar, .right-content::-webkit-scrollbar, .cautare::-webkit-scrollbar, .view::-webkit-scrollbar  {
		width: 8px; /* Grosimea scrollbar-ului vertical */
		height: 8px; /* Grosimea scrollbar-ului orizontal */
	}

	.right-layout::-webkit-scrollbar-track, .right-content::-webkit-scrollbar-track, .cautare::-webkit-scrollbar-track, .view::-webkit-scrollbar-track {
		border-radius: 4px; 
		margin-top: 60px; 
	}
	
	.cautare::-webkit-scrollbar-track {
		border-radius: 4px; 
		margin-top: 0px; 
	}

	.right-layout::-webkit-scrollbar-thumb, .right-content::-webkit-scrollbar-thumb , .cautare::-webkit-scrollbar-thumb , .view::-webkit-scrollbar-thumb  {
		background: #d9d7d7 !important; /* Culoarea thumb-ului scrollbar */
		border-radius: 4px  !important; /* Rotunjirea marginilor thumb-ului */
		border: 1px solid #d1cfcf  !important; /* Spațiu între thumb și track */
	}

	.right-layout::-webkit-scrollbar-thumb:hover, .right-content::-webkit-scrollbar-thumb:hover, .cautare::-webkit-scrollbar-thumb:hover, .view::-webkit-scrollbar-thumb:hover {
		background: #c2c0c0; /* Culoarea thumb-ului la hover */
	}
	

	
	/* SEMNARE */
	.signature-pad {
		border: 2px solid #184799; /* Bordură albastru închis */
		border-radius: 12px; /* Colțuri rotunjite mai elegante */
		max-width: 350px !important;
		min-width: 200px !important;
		height: 200px;
		background-color: #f8f9fa; /* Gri deschis pentru un contrast plăcut */
		cursor: crosshair; /* Cursor mai intuitiv pentru semnătură */
		box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); /* Umbră subtilă pentru efect 3D */
		transition: all 0.1s ease-in-out;
	}

	/* Efect la hover */
	.signature-pad:hover {
		box-shadow: 0px 6px 14px rgba(0, 0, 0, 0.15);
		border-color: #0a2a66; /* Bordură puțin mai închisă la hover */
	}

	/* Opțional: efect de focus activ */
	.signature-pad:active {
		background-color: #eef1f7; /* Ușor mai deschis la click */
	}

	.btn-disabled {
		color: #fff;
		background-color: #888888 !important;
		border: 1px solid #888888 !important;
		pointer-events: none;
	}	
	

	
	.semnatura-eroare{ border:2px solid #ff3b30 !important; border-radius:12px; }




		
	.obligatoriu
	{
		font-weight: bold;	
		color: #f25252;
	}	
	
	.lat {
		max-width: 100% !important;
		border: 0px solid red;
	}
	
	.lat0{
		max-width: auto !important;
		min-width: 100px !important;
	}	
	

		@media (max-width: 1024px) 
		{
			.lat {
				width: 100% !important;;
			}
			
			.lat0{
				width: 100% !important;
				max-width: auto !important;
				min-width: auto !important;				
			}			
		}	
	
	.trimite
	{
		width: 1100px; 
		margin: auto;		
	}
	
	.PrevizualizareDocument
	{
		width: 800px;
		height: 690px;
	}	

	.PrevizualizareActiuni
	{
		height: 690px;
		overflow: visible; 
		overflow-y: auto;
	}


	
		@media (max-width: 1370px) 
		{
			.PrevizualizareDocument
			{
				width: 650px;
				height: 620px;
			}
			
			.PrevizualizareActiuni
			{
				height: 620px;
			}			
		}

		@media (max-width: 1180px) 
		{
			.PrevizualizareDocument
			{
				width: 500px;
				height: 620px;
			}
			
			.PrevizualizareActiuni
			{
				height: 620px;
			}			
		}
		
		@media (max-width: 1024px) 
		{
			.PrevizualizareDocument
			{
				width: 100%;
				height: 550px;
			}
			.PrevizualizareActiuni
			{
				height: auto;
				max-height: none;
				overflow-y: visible;
				overflow-x: visible;				
			}			
		}	
		
		/* corectie pentru laptopuri / ecrane joase */
		@media (min-width: 1025px) and (max-height: 920px)
		{
			.PrevizualizareDocument
			{
				height: calc(100vh - 40px);
				max-height: 690px;
			}
			
		}


		
	.loading {
		text-align: center;
		font-weight: bold;
		color: #555;
		padding: 10px;
	}
	
	
	

/* OPERATII OPTIUNI */



	/* Stil pentru containerul dropdown */
	.dropdown {
		position: relative;
		display: inline-block;
		z-index: 1000;
			
	}


	/* Stil pentru meniul dropdown */
	.dropdown-menu {
		display: none;
		position: absolute;
		background-color: white;
		min-width: 155px;
		box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
		border: 1px solid #ddd;
		z-index: 1000;
		border-radius: 5px;
		margin-top: 5px;
	}

	/* Fiecare opțiune din meniu */
	.dropdown-menu a {
		color: black;
		padding: 7px 15px;
		text-decoration: none;
		display: block;
		font-size: 14px;
		display: flex;
		align-items: center;
		gap: 7px;			
	}

	.dropdown-menu a:hover {
		background-color: #f1f1f1;
		
	}

	/* Stil opțional pentru afișarea meniului */
	.dropdown.show, .dropdown-menu.show  {
		display: block;
	}




	.dropdown button:hover {
		transform: scale(1.1);
		color: #fff;
		background-color: #FB2222;	
	}

	.dropdown button.active {
	transform: scale(1.1);
	color: #fff;
	background-color: #FB2222;	
	}	







/*TIME LINE*/
	.timeline {
		display: flex;
		justify-content: space-between;
		align-items: center;
		list-style: none;
		padding: 20px;
		position: relative;
		width: 100%;
		max-width: 800px;
		margin: auto auto 5px auto;
		z-index: 7;
		text-decoration: none;
	}
	.timeline li {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		text-align: center;
		position: relative;
		flex: 1;
		
	}
	.timeline li:not(:first-child)::before {
		content: "";
		position: absolute;
		top: 25px; /* Ajustare pentru a fi la mijlocul icon-ului */
		left: -50%;
		width: 100%;
		height: 3px;
		background: #ccc;
		z-index: -1;
	}
	.timeline li.completed:not(:first-child)::before {
		background: #7274DF;
	}
	.timeline li .icon {
		width: 50px;
		height: 50px;
		border-radius: 20%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 22px;
		position: relative;
		z-index: 1;

	}
	.timeline li.completed .icon {
		background: #7274DF;
		color: #fff;
	}
	.timeline li.completed .text {
		color: #7274DF;
		font-family: Montserrat-SemiBold;
		font-size: 14px;			
	}
	.timeline li.pending .icon {
		background: #ddd;
		color: #fff;
	}
	
	.timeline li.pending .text {
		color: #888;
		font-family: Montserrat-Medium;
		font-size: 14px;			
	}	

	.timeline li .text {
		font-size: 14px;
		margin-top: 10px;
		white-space: nowrap;
		color: #888;
	}
	
	.timeline li a {
		text-decoration: none; /* Elimină sublinierea link-ului */
	}



	/* Stilizare pentru tablete (max-width: 820px) */
	@media (max-width: 1024px) {
		.timeline {
			flex-wrap: wrap;
			justify-content: center;
			gap: 15px;
		}
		.timeline li {
			flex: 0 0 45%; /* Elemente pe două coloane */
			text-align: center;
			position: relative;
		}

	  
		/* Ascundem linia dintre al doilea și al treilea pas */
		.timeline li:nth-child(3)::before {
			display: none;
		}
	}

	/* Stilizare pentru mobil (max-width: 720px) */
	@media (max-width: 720px) {

		.timeline li {
			flex: none;
			width: auto;
			text-align: center;
		}

		.timeline li .icon {
			width: 40px;
			height: 40px;
			font-size: 18px;
		}
		
		.timeline li.completed .text,.timeline li.pending .text {
			font-size: 12.5px;			
		}
		
	}

















	
	/*Pasul urmator*/	
		
	.PasulUrmator {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		margin: 10px 20px;
	}

	@media (max-width: 1024px) {
		.PasulUrmator {
			flex-wrap: wrap;
		}
	}		

	@media (max-width: 768px) {
		.PasulUrmator {
			flex-direction: column;
			align-items: stretch;
			gap: 14px !important;
		}

		.PasulUrmator .pas-final-btn {
			width: 100%;
			min-width: 0 !important;
		}
	}	

	#Inapoi, #Inainte {
		display: none;
	}
	
	

	 /* Scadentar */
	.scadentar-formular {
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 400px;
		margin: 10px auto 5px auto;
		border: 0px solid red;
		padding: 0px 20px;
	}

	.scadentar-title {
		width: auto;
		padding: 0 20px 0 0;
		font-family: Montserrat-Medium;	
		font-size: 18px;
		text-align:left;	
		border: 0px solid #888;
	}	
	
	
	.scadentar-count {
		width: 60px;
		heignt: 60px;
		padding: 10px 2px;
		font-family: Montserrat-Medium;
		font-size: 18px; 
		border-radius: 10px;
		
	}	

	
	@media (max-width: 1024px) {

		.scadentar-formular {
			width: auto;
		}
	
		.scadentar-title {
			font-size: 16px;
		}	
		
		.scadentar-count {
			font-size: 16px 
		}	
		
	}	
	
	
	
	
	 /* Actualizari */
	.actualizari-title {
		width: auto;
		font-family: Montserrat-Medium;	
		font-size: 16px;
		text-align:left;	
		border: 0px solid #888;
	}
	
	.actualizari-detalii {
		width: auto;
		font-family: Montserrat-Medium;	
		font-size: 16px;
		text-align:left;	
		border: 0px solid #888;
	}	

	@media (max-width: 1024px) {
		
		.actualizari-title {
			font-size: 16px;
		}	
		.actualizari-detaii {
			font-size: 16px;
		}	
		
	
		
	}

	
	
	/* Page Layou - profil client t */
	.main-layout-profil {
		display: flex;
		flex: 1;
		overflow-y: auto;
		padding: 35px;
		height: 100%;
		background-color: #f5f5f5 ;	
	}
	
  /*right-layout - profil client  */
	.right-layout-profil {
		flex: 1;		
		background-color: #ffffff;
		border-radius: 8px;
		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
		z-index: 8;	
		width:100%;
		overflow-y: auto;
		overflow-x: hidden; 
		position: relative;
		z-index: 1;		
	}	
	
	
	@media (max-width: 1024px) 
	{		
		.main-layout-profil {
			padding: 15px;
		}	
		
	}	
	
	
/* .cautare-etichete*/

	.cautare-etichete-wrapper {
		position: sticky;
		top: 0;
		background: white;
		z-index: 12;
		padding-top: 10px;
		padding-bottom: 10px;
		margin: 20px 0px 20px 0px;
		
	}

	.pozitie-etichete {
		width: 100%;
		padding: 6px 10px;
		border: 1px solid #ccc;
		border-radius: 6px;
		font-size: 14px;
	}	


	.cautare-etichete {
		width: 100%;
		padding: 6px 10px;
		border: 1px solid #ccc;
		border-radius: 6px;
		font-size: 14px;
	}
		
		
.UltimaActivitate {
	padding: 2px 0px  !important; 
	font-family: Montserrat-Regularr  !important; 
	font-size: 8 px !important; 
	color: #bdbbbb  !important; 	
}		

		



/* .mesaj de asteptare*/
#formOverlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(50, 50, 50, 0.5);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.overlay-content {
  text-align: center;
  color: white;
  font-size: 20px;
}

.spinner {
  margin: 0 auto 20px;
  width: 40px;
  height: 40px;
  border: 5px solid white;
  border-top: 5px solid #007DBA;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}



.text-break {
  word-break: break-all;
  overflow-wrap: anywhere;
  white-space: normal;
  overflow-x: hidden;
}


.notificare {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  top: 0; /* ajustează la nevoie */
  margin-left: 4px; /* distanța față de textul Aprobări */
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background-color: red;
  color: white;
  font-size: 12px;
  font-weight: bold;
  line-height: 1;
  text-align: center;
}

/* badge inline, dupa text (NU absolute) */
.badge-notif{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  margin-left:4px;
  vertical-align: middle;

  width: 19px;
  height: 19px;
  border-radius: 50%;

  background: linear-gradient(to bottom, #ff5a52, #ff3b30);
  color: #fff;

  font-size: 10px;
  font-weight: 800;
  line-height: 1;

  border: 1px solid rgba(255,255,255,.85);
  box-shadow:
    0 1px 2px rgba(0,0,0,.18),
    0 4px 10px rgba(0,0,0,.12);
}


/* 9+ ramane CERC, doar textul devine mai mic ca sa incapa */
.badge-notif.badge-big{
  width: 21px;     /* doar un pic mai mare */
  height: 21px;
  font-size: 10px;
  letter-spacing: -0.6px;
}




.padding-box
{
    display: flex;
    align-items: center;
	width: auto;
	padding: 5px;
	gap: 6px; 
	border-radius: 6px; 
}



/* Butoane actiuni document sursa */
.document-butoane-actiuni {
  display: flex;
  gap: 15px;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 6px;
}

.document-butoane-actiuni div {
  display: flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s ease;
  user-select: none;
}

.btn-editeaza-document {
  background-color: #eef4ff;
  color: #3c64ff;
  border: 1px solid #3c64ff;
}

.btn-editeaza-document:hover {
  background-color: #d7e4ff;
  transform: scale(1.1);	
}

.btn-sterge-document-sursa {
  background-color: #ffebeb;
  color: #EB2323;
  border: 1px solid #EB2323;
}

.btn-sterge-document-sursa:hover {
  background-color: #ffd6d6;
  transform: scale(1.1);	
}


/* Responsive pe mobile */
@media screen and (max-width: 600px) {

  .document-butoane-actiuni div {
    font-size: 13px;
    padding: 4px 8px;
  }
}


.document-ids {
  word-break: break-word;        /* rupe cuvintele prea lungi */
  overflow-wrap: anywhere;       /* forțează spargerea și fără spații */
  white-space: normal;           /* permite wrap normal */
  display: block;                /* în linie separată */
  max-width: 100%;               /* se încadrează în container */
}


.document-sursa-date {
  background-color: #f0fff4;           
  border: 2px solid #ddd;
  border-radius: 10px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); 
  
}


/* ====== Pagina de descărcare (vizualizare.php?opt=DescarcaDocument) ====== */

.download-page {
  min-height: 100vh;
  display: flex;
  background-color: #f5f5f5;
}

.download-wrap {
  margin: auto;                 /* centrează vertical + orizontal */
  width: 100%;
  max-width: 720px;             /* desktop card mai îngust */
  padding: 20px;
}

.download-card {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 6px 24px rgba(0,0,0,.08);
  padding: 28px 24px 34px 24px;  /* un pic mai mult spatiu decat inainte */
  text-align: center;
}

.download-logo {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 20px;          /* mai mult spatiu sub logo */
}

.download-logo img {
  width: 180px;                 /* desktop */
  height: auto;
}

.download-title {
  margin: 0 0 16px 0;           /* spatiu mai mare sub titlu */
  font-family: Montserrat-SemiBold;
  font-size: 24px;
  color: #333;
  line-height: 1.4;
}

.download-muted {
  margin: 12px 0;               /* aerisit intre paragrafe */
  font-family: Montserrat-Regular;
  font-size: 15px;
  color: #555;
  line-height: 1.55;
}

.download-muted a {
  color: #4B4DDE;               /* nuanță din sistemul tău */
  text-decoration: none;
  font-weight: 500;
  border-bottom: 1px dashed #4B4DDE;
}

.download-muted a:hover {
  opacity: .9;
}

.download-iframe {
  display: none;                 /* invizibil, doar pentru declanșarea descărcării */
}



/* --- Responsive --- */
@media (max-width: 1024px) {
  .download-wrap { max-width: 640px; padding: 16px; }
  .download-card { padding: 24px; }
  .download-logo img { width: 160px; }
  .download-title { font-size: 22px; }
  .download-muted { font-size: 14px; }
}

@media (max-width: 768px) {
  .download-wrap { max-width: 520px; padding: 14px; }
  .download-card { padding: 22px; border-radius: 10px; }
  .download-logo img { width: 150px; }
  .download-title { font-size: 21px; }
}

@media (max-width: 480px) {
  .download-wrap { max-width: 420px; padding: 12px; }
  .download-card { padding: 20px; border-radius: 10px; }
  .download-logo img { width: 140px; }
  .download-title { font-size: 20px; }
  .download-muted { font-size: 13px; }
}

@media (max-width: 360px) {
  .download-wrap { max-width: 320px; padding: 10px; }
  .download-card { padding: 16px; }
  .download-logo img { width: 120px; }
  .download-title { font-size: 18px; }
  .download-muted { font-size: 12.5px; }
}


/* ====== ACASA: layout nou, doar completări ====== */
.acasa-container { width: 100%; margin: 0 auto; }


.acasa-tab {		  
  max-height: 490px;
  overflow-y: auto;
  overflow-x: hidden;
}

	@media (max-width: 1024px) 
	{
		.acasa-tab {		  
			max-height: none;   
			overflow-y: visible; 
			overflow-x: visible; 
		}			
	}
		

/* TABURI MARI pe un rând, centrate */
.acasa-row-mare {
  display: flex;
  justify-content: center;
  align-items: stretch;
  width: 100%;
  margin: 0 0 16px 0;
}

/* Tab mare: 100% din .right-content, max 1300px, înălțime fixă */
.tab--mare {
  width: 100%;
  max-width: 95%;
  margin: 0 auto;
}

/* Conținutul tabului mare: scroll în interior când e cazul */
.tab--mare .tab-content {
  height: calc(415px - 58px); /* ~ înălțimea headerului tău */
  overflow: auto;
}

/* Grilă pentru taburile mici (2-3 pe rând, auto) */
.acasa-grid-mici {
  display: grid;
  grid-template-columns: repeat(3, minmax(280px, 1fr));
  gap: 16px;
  width: 100%;
  max-width: 95%; /* aliniat cu cele mari */
  margin: 0 auto 16px;
}

/* Tab mic – nu schimb .tab-urile tale, doar stabilitate vizuală */
.tab--mic { width: 100%; min-height: 160px; }

/* Util: ascundere rapidă */
.is-hidden { display: none !important; }

/* ====== Breakpoints ====== */
@media (max-width: 1600px) {
  .acasa-grid-mici { grid-template-columns: repeat(2, minmax(260px, 1fr)); }
}
@media (max-width: 1024px) {
  /* Pe tabletă/mobil la tine oricum sunt una sub alta — consolidăm */
  .acasa-grid-mici { grid-template-columns: 1fr; max-width: 800px; }
  .tab--mare { max-width: 100%; height: auto; }
  .tab--mare .tab-content { height: auto; }
}

/* === ACASA – aerisire desktop intre taburi mari/mici si intre cele mici === */
@media (min-width: 1025px) {
  /* spatiu mai mare sub fiecare tab MARE (grafic, taskuri) */
  .acasa-row-mare {
    margin-bottom: 24px;   /* era 16px */
  }

  /* spatiu mai mare intre taburile MICI + sub randul de mici */
  .acasa-grid-mici {
    gap: 24px;             /* era 16px intre cardurile mici */
    margin: 12px auto 24px;/* +12px sus, +24px jos fata de celelalte blocuri */
  }

  /* optional: un strop de spatiu sub fiecare mic (cand sunt pe ultimul rand) */
  .acasa-grid-mici .tab--mic {
    padding-bottom: 2px;   /* aproape insesizabil, dar ajuta la respiratie */
  }
}

@media (min-width: 1400px) {
  .acasa-row-mare { margin-bottom: 28px; }
  .acasa-grid-mici { gap: 28px; margin: 14px auto 28px; }
}


/* randul de KPI-uri afisat sub header, deasupra graficului */
.kpi-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 8px 12px 0 12px; 

}

.kpi-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 8px;
  background: #f4f4ff;
  color: #3f42d9;
  font-weight: 600;
  font-size: 13px;
  box-shadow: 0 1px 0 rgba(0,0,0,.03) inset;
}
.kpi-chip .v { font-weight: 700; }

/* scrollbar discret doar in interiorul taburilor (estetic) */
.tab .tab-content::-webkit-scrollbar { width: 8px; }
.tab .tab-content::-webkit-scrollbar-thumb { background: #e1e1e1; border-radius: 4px; }
.tab .tab-content::-webkit-scrollbar-thumb:hover { background: #cfcfcf; }

/* ===== Optional: egalizeaza inaltimea taburilor mici pe acelasi rand ===== */
.equalize-mici { align-items: stretch; }              /* pui pe .acasa-grid-mici daca vrei efectul */
.equalize-mici .tab--mic { display:flex; flex-direction:column; }
.equalize-mici .tab--mic .tab-content { flex:1; }

/* ===== Varianta B: Split 2/3 + 1/3 (daca vrei sa spargi primul rand) ===== */
.hero-split {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 16px;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 16px;
}
.hero-split .tab--mare { height: clamp(340px, 38vh, 420px); }
@media (max-width: 1024px) {
  .hero-split { grid-template-columns: 1fr; }
}

/* ==== ACASA — fix pe mobil pentru TABURILE MICI (<=480px) ==== */
@media (max-width: 480px) {
.kpi-row {
  display: none;

}	
	
  /* containerul grilei: full width, o singură coloană, fără constrângeri */
  .acasa-grid-mici {
    grid-template-columns: 1fr !important;
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* fiecare card mic trebuie să poată să se micșoreze (no min-width) */
  .acasa-grid-mici .tab,
  .acasa-grid-mici .tab--mic {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /* la fel și copiii direcți din grilă (în caz că ai alte wrap-uri) */
  .acasa-grid-mici > * {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  /* conținutul intern să nu poată depăși lățimea cardului */
  .acasa-grid-mici .tab .tab-header,
  .acasa-grid-mici .tab .tab-content {
    max-width: 100% !important;
  }
  .acasa-grid-mici .tab .tab-content {
    overflow-x: hidden;  /* elimină orice scroll orizontal accidental */
    padding-left: 12px;
    padding-right: 12px;
  }
}


/* ===== AJUTOR ===== */
.grup-text-ajutor {
    flex: 1;
    width: 100%;
    text-align: left;
    border: 0px solid red;
    padding: 0px 0px 8px 0px;
    font-family: Montserrat-Semibold;
    font-size: 14px;
    color: #333;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 5px;
}


	.grup-optiune-ajutor {
		flex: 0 0 auto;
		padding: 0 0 0px 0;
		border: 0px solid pink;
		margin: 0 0 0 0px;
		width: 100%;
		min-width: 350px;	
		 font-size: 16px;
	}
	
	



/* =====RAPOARTE ===== */	
/* === Container responsive (rămâne ca înainte) === */
.rapoarte-summary{
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 20px;
  padding: 0px 0px;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
}
@media (min-width: 600px){ .rapoarte-summary{ grid-template-columns: repeat(2,1fr); gap:14px; padding:14px; } }
@media (min-width: 992px){ .rapoarte-summary{ grid-template-columns: repeat(4,1fr); gap:16px; padding:16px; } }

/* === Card: icon pe stânga într-o insignă, text pe dreapta === */
.rs-card{
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  column-gap: 14px;
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 14px;
  padding: 14px 16px;
  box-shadow: 0 6px 16px rgba(0,0,0,.06), 0 2px 6px rgba(0,0,0,.04);
  transition: box-shadow .15s ease, transform .15s ease;
}

/*
.rs-card:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(0,0,0,.08), 0 4px 10px rgba(0,0,0,.06);
}*/

/* === Insigna icon (mai mare, contrast plăcut) === */
.rs-badge{
  width: 40px; height: 40px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center; justify-content: center;
  background: #eef2ff; /* default light */
}
.rs-badge i{ font-size: 20px; line-height: 1; }

/* culori pe tip */
.rs-add  .rs-badge{ background:#e6efff; }
.rs-add  .rs-badge i{ color:#7274DF; }

.rs-sign .rs-badge{ background:#e6fff4; }
.rs-sign .rs-badge i{ color:#059669; }

.rs-total .rs-badge{ background:#eef2f7; }
.rs-total .rs-badge i{ color:#374151; }

/* === Text: titlu mic, număr mare; aliniere bună === */
.rs-text{
  display: grid;
  align-items: center;
  row-gap: 2px;
}
.rs-text span{
  font-size: 13px;
  color: #6b7280;
}
.rs-text strong{
  font-size: 22px;         /* mai mare decât înainte */
  font-weight: 800;
  color: #0f172a;
  letter-spacing: 0.2px;
}

/* === Mobile tuning === */
@media (max-width: 480px){
  .rs-card{ padding:12px 14px; border-radius:12px; column-gap:12px; }
  .rs-badge{ width:36px; height:36px; border-radius: 9px; }
  .rs-badge i{ font-size:18px; }
  .rs-text span{ font-size:12px; }
  .rs-text strong{ font-size:20px; }
}

/* === Dark mode opțional === */
@media (prefers-color-scheme: dark){
  .rapoarte-summary{ background:#0f172a; border-color:#1f2937; }
  .rs-card{ background:#111827; border-color:#1f2937; box-shadow:0 6px 16px rgba(0,0,0,.3), 0 2px 6px rgba(0,0,0,.2); }
  .rs-text span{ color:#9ca3af; }
  .rs-text strong{ color:#f9fafb; }
  .rs-total .rs-badge{ background:#1f2937; }
}

.rs-sms .rs-badge{ 
  background:#f3e8ff; 
}

.rs-sms .rs-badge i{ 
  color:#9333ea; 
}

/* usureaza comportamentul pe containere scrollabile pe mobil */
.right-layout {
  overscroll-behavior: contain;
}




.overlay-wa {
    position: fixed;
    top:0; left:0;
    width:100%; height:100%;
    background: rgba(0,0,0,0.55);
    display:flex;
    align-items:center;
    justify-content:center;
    padding: 24px;
    z-index:999999;
}

.wa-box {
    background:#fff;
    width: 100%;
    max-width: 430px;
    max-height: 90vh;
    padding: 44px 36px;
    border-radius: 10px;
    box-shadow:0 10px 30px rgba(0,0,0,0.2);
    text-align:center;
    font-family: Montserrat, sans-serif;
    overflow-y: auto;
	border:
}

.wa-header {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 10px;
}

.wa-sub {
    font-size: 17px;
    line-height: 1.6;
    color: #444;
    margin-bottom: 20px;
}

.btn-wa-send {
    margin: 12px auto;
    display: block;
    width: 100%;
}

.btn-wa-close {
    margin-top: 30px !important;
}




/* ============================= */
/* PDF EDITOR – LAYOUT GENERAL   */
/* ============================= */

.pdf-editor-container {
    display: flex;
    gap: 20px;
}

/* zona stanga – PDF */
.pdf-editor-left {
    flex: 1;
}

.pdf-editor-wrapper {
    width: auto !important;
    margin: 0 auto;
}

/* ============================= */
/* PAGINI PDF                    */
/* ============================= */

.pdf-page {
    position: relative;
    margin-bottom: 20px;
}

.pdf-canvas {
    display: block;
    border: 1px solid #dcdcdc;
    border-radius: 6px;
    background: #fff;
}

/* overlay peste canvas */
.pdf-overlay {
    position: absolute;
    inset: 0;
    z-index: 10;
}

/* ============================= */
/* FIELD-URI (ETICHETE PE PDF)   */
/* ============================= */
.pdf-field {
    position: absolute;
    background: rgba(255,255,255,0.9);
    border: 1px dashed #4B4DDE;
    border-radius: 4px;
    padding: 4px 6px;
    font-family: Montserrat-SemiBold;
    font-size: 12px;
    cursor: move;
    white-space: nowrap;

}

.pdf-field .del {
    margin-left: 6px;
    color: #EB2323;
    font-weight: bold;
    cursor: pointer;
}

/* ============================= */
/* LISTA ETICHETE DREAPTA        */
/* ============================= */

.eticheta-item {
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 6px 8px;
    margin-bottom: 6px;
    cursor: grab;
    background: #fff;
}




.eticheta-item.stearsa {
    background: #fff4f4;
    border-color: #EB2323;
    color: #EB2323;
    opacity: 0.8;
}

.eticheta-item.inactiva {
    opacity: 0.4;
    cursor: not-allowed;
    background: #f3f3f3;
    border-color: #ccc;
    color: #888;
}

.eticheta-item.inactiva:hover {
    transform: none;
}


.eticheta-item.disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* ===== PDF EDITOR ===== */

.pdf-editor-wrapper {
    width: 800px;
    margin: 0 auto;
}

.pdf-page {
    position: relative;
    margin-bottom: 20px;
}

.pdf-canvas {
    display: block;
    border: 1px solid #ddd;
    background: #fff;
}



.pdf-field {
	border: 1px dashed #4B4DDE;
	background: rgba(255,255,255,0.7);
}

.pdf-field .resize-handle {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 10px;
	height: 10px;
	cursor: se-resize;
	background: #4B4DDE;
}

.pdf-field .del {
	position: absolute;
	top: -10px;
	right: -10px;
	cursor: pointer;
	background: #EB2323;
	color: #fff;
	border-radius: 50%;
	width: 18px;
	height: 18px;
	text-align: center;
	line-height: 18px;
	font-size: 12px;
}



/* ============================= */
/* TOOLBAR EDITARE FIELD PDF    */
/* ============================= */

.pdf-toolbar {
    position: absolute;
    top: -42px;
    left: 0;
    display: flex;
    gap: 6px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 4px 6px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.08);
    z-index: 50;
    font-family: Montserrat-Regular;
}

.pdf-toolbar select,
.pdf-toolbar input {
    font-size: 12px;
    padding: 2px 4px;
    border-radius: 4px;
    border: 1px solid #ccc;
    height: 26px;
}




/* ============================= */
/* PARTI CONTRACTANTE DINAMIC    */
/* ============================= */

.ModDinamic {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
	gap: 15px !important;
}


@media (max-width: 768px) {
    .ModDinamic {
        flex-direction: column;
        align-items: stretch;
        
        text-align: center;
    }

    .ModDinamic .btn {
        width: 100%;
        margin-left: 0 !important;
    }

    .ModDinamic span {
        margin-left: 0 !important;
    }
}


		
		
.doc-status{
  background:#fff6e8;
  border:1px solid rgba(0,0,0,.08);
  border-left:4px solid #f2a24a;
  border-radius:14px;
  padding:14px;
  margin: 14px 20px 20px 20px;
}

.doc-status-head{
  font-weight:800;
  color:#b35c00;
  margin-bottom:10px;
}

.doc-status-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  border-radius:10px;
  background:rgba(255,255,255,.55);
  margin-bottom:8px;
}

.doc-status-row .label{
  flex:1;
  color:#333;
  font-size:13px;
}

.doc-status-row .value{
  color:#1f2a44;
  font-weight:800;
  font-size:13px;
  white-space:nowrap;
}

.doc-status-row i{ opacity:.85; }

.doc-status-row.ok i{ color:#2e7d32; }
.doc-status-row.warn i{ color:#c77600; }

.doc-status-note{
  margin-top:8px;
  padding:10px;
  border-radius:12px;
  background:rgba(255,255,255,.45);
  color:#7a4a00;
  display:flex;
  gap:10px;
  align-items:flex-start;
  font-size:13px;
  align-items: center;
}

.doc-status-actions{
  margin-top:10px;
}

.btn-mov-soft{
  background:#fff;
  border:1px solid rgba(114,116,223,.35);
  color:#4b4dde;
}

.doc-status-confirm{
  margin-top:10px;
  display:flex;
  justify-content:center;
}


/* ===========================
   Doc status - mobile premium
   =========================== */
@media (max-width: 520px){

  .doc-status{
    padding: 12px;
    border-radius: 14px;
  }

  .doc-status-head{
    margin-bottom: 8px;
  }

  /* randurile devin stack */
  .doc-status-row{
    flex-wrap: wrap;
    gap: 8px;
    padding: 8px 10px;
  }

  .doc-status-row i{
    margin-top: 1px;
  }

  /* label pe latime completa */
  .doc-status-row .label{
    flex: 1 1 calc(100% - 26px);
    font-size: 13px;
    line-height: 1.2;
  }

  /* valoarea trece sub label, aliniata */
  .doc-status-row .value{
    width: 100%;
    margin-left: 26px; /* aliniere sub text dupa icon */
    text-align: left;
    font-size: 13px;
    font-weight: 800;
    white-space: normal; /* sa nu forteze */
  }

  .doc-status-note{
    padding: 10px;
    border-radius: 12px;
    font-size: 13px;
  }

  .doc-status-actions a{
    width: 100%;
    display: inline-flex;
    justify-content: center;
  }

  .doc-status-confirm{
    justify-content: flex-start;
  }

  .doc-status-confirm label{
    font-size: 13px;
    line-height: 1.2;
  }
}



/* ===========================
   TermeniVizualizare
   =========================== */
   
.TermeniVizualizare  { padding:0 15px;; }
.TermeniVizualizare p { margin: 0 0 1em; }
.TermeniVizualizare h1, .TermeniVizualizare h2, .TermeniVizualizare h3 { margin: 0.6em 0 0.4em; }
.TermeniVizualizare ul, .TermeniVizualizare ol { margin: 0 0 1em 1.2em; padding-left: 1.2em; }
.TermeniVizualizare li { margin: 0.25em 0; }		


.mc_confirmare {
    background: linear-gradient(145deg, #f5f6ff, #ffffff);
    border: 1px solid #e6e8ff;
    border-radius: 12px;
    padding: 18px 20px;
    margin: 15px 0;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 14px;
    line-height: 22px;
    color: #333;
    box-shadow: 0 4px 12px rgba(75, 77, 222, 0.06);
}



.mc_header {
    align-items: center;
    font-weight: 600;
    font-size: 15px;
    color: #4B4DDE;
    margin-bottom: 10px;
	text-align:center;
}

.mc_icon {
    margin-right: 8px;
    font-size: 16px;
    color: #4B4DDE;
}

.mc_content {
    margin-bottom: 8px;
    color: #444;
}

.mc_footer {
    color: #666;
    font-size: 13px;
}




/* =========================
   eContracte Onboarding (overlay cu gaura + card premium)
   ========================= */

.ec-onb-layer{
  position: fixed;
  background: rgba(17, 18, 28, .62);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  z-index: 2147482000;
  display: none;
}

.ec-onb-layer.show{ display:block; }

.ec-onb-target{
  position: relative !important;
  z-index: 2147483000 !important;
  border-radius: 10px !important;
  box-shadow:
    0 0 0 6px rgba(75, 77, 222, .20),
    0 10px 26px rgba(12, 14, 30, .28) !important;
}

#ecOnbCard{
  position: fixed;
  z-index: 2147483500;
  max-width: 360px;
  width: min(360px, calc(100vw - 24px));
  border-radius: 12px;
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(21, 23, 45, .10);
  box-shadow: 0 18px 55px rgba(12, 14, 30, .22);
  font-family: Montserrat, Montserrat-Medium, Arial, sans-serif;
  color: #15172D;
  display: none;
  padding: 18px 18px 16px 18px;
}

#ecOnbCard.show{ display:block; }

#ecOnbCard .ec-onb-title{
  font-size: 17px;
  line-height: 22px;
  font-weight: 800;
  margin: 0 0 10px 0;
}

#ecOnbCard .ec-onb-text{
  font-size: 14px;
  line-height: 22px;
  margin: 0 0 16px 0;
  opacity: .95;
}



#ecOnbCard .ec-onb-actions{
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

#ecOnbCard .ec-onb-btn{
  border: 0;
  border-radius: 10px;
  padding: 9px 12px;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  font-family: inherit;
}

#ecOnbCard .ec-onb-btn.primary{
  background: #4B4DDE;
  color: #fff;
}

#ecOnbCard .ec-onb-btn.primary:hover{ filter: brightness(.96); }
#ecOnbCard .ec-onb-btn.primary:active{ transform: translateY(1px); }

/* Sageata ca pseudo-element (NU mai suprapune textul) */
#ecOnbCard[data-arrow="top"]::before,
#ecOnbCard[data-arrow="bottom"]::before{
  content:"";
  position:absolute;
  width: 12px;
  height: 12px;
  background: rgba(255,255,255,.96);
  border-left: 1px solid rgba(21, 23, 45, .10);
  border-top: 1px solid rgba(21, 23, 45, .10);
  transform: rotate(45deg);
  left: var(--arrow-left, 24px);
}

#ecOnbCard[data-arrow="top"]::before{
  top: -6px; /* in afara cardului */
}

#ecOnbCard[data-arrow="bottom"]::before{
  bottom: -6px; /* in afara cardului */
  transform: rotate(225deg);
}

/* Inchide tutorial (discret, dreapta sus) */
/* Asigură spațiu sus în card pentru zona de închidere */
#ecOnbCard{
  padding-top: 35px; /* spațiu pentru linkul din colț */
}

/* Inchide tutorial (discret, premium) */
#ecOnbCard .ec-onb-close{
  position:absolute;
  top: 10px;          /* mai sus */
  right: 14px;

  background: transparent;
  border: 0;
  padding: 4px 6px;

  font-family: inherit;
  font-size: 11px;    /* un pic mai discret */
  font-weight: 600;
  letter-spacing: .25px;

  color: rgba(21,23,45,.40);
  cursor: pointer;
  transition: color .18s ease, opacity .18s ease;
  opacity: .95;
}

#ecOnbCard .ec-onb-close:hover{
  color: rgba(21,23,45,.70);
  opacity: 1;
}

/* X puțin mai fin */
#ecOnbCard .ec-onb-close span{
  font-size: 13px;
  margin-left: 4px;
  opacity: .65;
}


#ecOnbCard .ec-onb-close:hover span{
  opacity: .9;
}



@media (max-width: 520px){
  #ecOnbCard{ max-width: 92vw; }
}


.ico-info {
    margin-right:6px;
    font-size:13px;
    vertical-align:middle;
    color:#0d6efd; /* sau culoarea ta brand */
    opacity:0.85;	
}








/* =========================
   FACTURA – layout premium (peste CSS-ul tau existent)
   ========================= */

.tab-factura{
  max-width: 1150px; /* ca sa incapa 3 coloane fara sa para inghesuit */
}

.factura-grid-3{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 16px;
}

/* Card mic, clean */
.factura-card{
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  padding: 12px 14px;
  background: #fff;
  box-shadow: 0 1px 6px rgba(16,24,40,.06);
}

/* Titlu card */
.factura-card-title{
  display:flex;
  align-items:center;
  gap:8px;
  font-family: Montserrat-SemiBold;
  color:#333;
  padding: 6px 0 10px 0;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  margin-bottom: 10px;
}

.factura-mini{
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 6px 10px;
  margin-top: 6px;
  font-size: 13px;
  color:#444;
}

.factura-mini-label{
  color:#777;
  font-family: Montserrat-Medium;
}

.factura-mini-value{
  color:#333;
  overflow-wrap: anywhere;
}

/* 2 coloane in interior (serie/numar, data/termen) */
.factura-2{
  width:100%;
  gap: 12px;
}
.factura-2 .grup-formular{
  padding: 0 !important;
  max-width: unset;
}
.factura-2 .grup-optiune{
  min-width: 0; /* important: sa nu forteze latimea */
}

/* Linii */
.factura-lines{
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  padding: 12px 14px;
  background:#fff;
  box-shadow: 0 1px 6px rgba(16,24,40,.06);
}

.factura-lines-head{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.factura-lines-title{
  display:flex;
  align-items:center;
  gap:8px;
  font-family: Montserrat-SemiBold;
  color:#333;
}

/* wrapper ca sa nu “sparga” pe ecrane mici */
.table-wrap{
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling: touch;
  border-radius: 10px;
}

/* Totaluri */
.factura-total{
  margin-top: 12px;
  max-width: 360px;
  margin-left: auto;
  border-top: 1px solid rgba(0,0,0,0.08);
  padding-top: 10px;
}

.factura-total-row{
  display:flex;
  justify-content: space-between;
  padding: 6px 0;
  color:#333;
  font-family: Montserrat-Medium;
}

.factura-total-row.total-final{
  font-family: Montserrat-SemiBold;
  font-size: 16px;
}

/* Responsive: sub 1200 -> 2 coloane, sub 820 -> 1 coloana */
@media (max-width: 1200px){
  .factura-grid-3{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px){
  .tab-factura{ max-width: 100%; }
  .factura-grid-3{
    grid-template-columns: 1fr;
  }
  .factura-total{
    max-width: 100%;
    margin-left: 0;
  }
}




/* =========================================================
   FACTURA (CSS minimal, curat, premium)
   - NU foloseste .grup-formular/.grup-text/.grup-optiune
   - foloseste: .f-field + .f-label + .f-control
   ========================================================= */

.tab.tab-factura{
  max-width: 1150px;
  margin: 0 auto;
}

.tab-factura *{ box-sizing: border-box; }

/* -------- Grid sus (3 carduri) -------- */
.factura-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:16px;
  margin-bottom:16px;
}
.factura-grid > *{ min-width:0; }

/* -------- Carduri -------- */
.factura-card{
  background:#fff;
  border:1px solid rgba(0,0,0,0.08);
  border-radius:12px;
  padding:12px 14px;
  box-shadow: 0 1px 6px rgba(16,24,40,.06);
}
.factura-card-title{
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px 0 10px 0;
  margin-bottom:10px;
  border-bottom:1px solid rgba(0,0,0,0.06);
  font-family: Montserrat-SemiBold;
  color:#333;
}

/* -------- Campuri (label + control) -------- */
.f-field{
  margin: 0 0 10px 0; /* aici e “aerul” controlat */
}
.f-label{
  display:block;
  margin: 0 0 4px 0; /* distanta mica label->input */
  font-size:12px;
  color:#666;
  text-transform: uppercase;
  letter-spacing: .25px;
  font-family: Montserrat-Medium;
}
.f-control{ min-width:0; }
.f-control input,
.f-control select,
.f-control textarea{
  width:100%;
  max-width:100%;
  min-width:0;
  display:block;

  height:40px;
  padding:7px 10px;
  font-size:14px;
  border-radius:12px;

  border:1px solid rgba(0,0,0,0.18);
  background:#fff;
  outline:none;
}
.f-control textarea{
  height:auto;
  min-height:80px;
  padding:10px 12px;
  resize:vertical;
}

/* Info mini (denumire/cui/adresa) */
.factura-mini{
  display:grid;
  grid-template-columns: 88px 1fr;
  gap:6px 10px;
  margin-top:6px;
  font-size:13px;
  color:#444;
}
.factura-mini-label{ color:#777; font-family: Montserrat-Medium; }
.factura-mini-value{ color:#333; overflow-wrap:anywhere; }

/* -------- Linii (servicii/produse) -------- */
.factura-lines{
  background:#fff;
  border:1px solid rgba(0,0,0,0.08);
  border-radius:12px;
  padding:12px 12px;
  box-shadow: 0 1px 6px rgba(16,24,40,.06);
}
.factura-lines-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
.factura-lines-title{
  display:flex;
  align-items:center;
  gap:8px;
  font-family: Montserrat-SemiBold;
  color:#333;
}

.table-wrap{
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:10px;
}

/* Tabel: aspect mai “gingas” */
.factura-lines table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
}
.factura-lines thead th{
  text-align:left;
  padding:12px 12px;
  background:#f3f4f6;
  color:#333;
  font-family: Montserrat-SemiBold;
  font-size:14px;
}
.factura-lines tbody td{
  padding:10px 12px;
  border-bottom:1px solid rgba(0,0,0,0.06);
  vertical-align:middle;
}

/* Inputuri in tabel (rotunjite, mai mici) */
.factura-lines table input,
.factura-lines table select{
  width:100%;
  height:36px;
  padding:6px 10px;
  border-radius:10px;
  border:1px solid rgba(0,0,0,0.20);
  font-size:13.5px;
  background:#fff;
}
.factura-lines table input[readonly]{
  background:#fafafa;
}

/* Operatii */
.sterge-linie{
  cursor:pointer;
  color:#444;
  padding:6px 8px;
  border-radius:10px;
}
.sterge-linie:hover{ background: rgba(0,0,0,0.06); }

/* Totaluri */
.factura-total{
  margin-top:12px;
  max-width:360px;
  margin-left:auto;
  border-top:1px solid rgba(0,0,0,0.08);
  padding-top:10px;
}
.factura-total-row{
  display:flex;
  justify-content:space-between;
  padding:6px 0;
  color:#333;
  font-family: Montserrat-Medium;
}
.factura-total-row.total-final{
  font-family: Montserrat-SemiBold;
  font-size:16px;
}

/* -------- Responsive -------- */
@media (max-width: 1200px){
  .factura-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px){
  .tab.tab-factura{ max-width: 100%; }
  .factura-grid{ grid-template-columns: 1fr; }
  .factura-total{ max-width:100%; margin-left:0; }
}


/* ==============================
   Detalii factura – compact premium
   ============================== */

.f-compact .f-field{ margin: 0 0 8px 0; }

.f-compact .f-row{
  display:grid;
  grid-template-columns: 150px 1fr; /* label + control */
  align-items:center;
  column-gap: 12px;
}

.f-compact .f-label-inline{
  margin: 0;                 /* fara spatiu sub label */
  white-space: nowrap;
  text-transform: none;      /* mai premium, mai “uman” */
  font-size: 13px;
  color:#555;
  letter-spacing: 0;
}

/* controale mai “slim” in zona asta */
.f-compact .f-control .f-slim{
  height: 36px;
  padding: 6px 8px;
  border-radius: 12px;
  font-size: 14px;
}

/* textarea ramane aerisita */
.f-compact textarea{
  min-height: 36px;
  margin-top: 5px;
}

/* pe mobil revine 1 coloana (label deasupra) */
@media (max-width: 820px){
  .f-compact .f-row{
    grid-template-columns: 1fr;
    row-gap: 4px;
  }
  .f-compact .f-label-inline{
    text-transform: uppercase;
    font-size: 12px;
    color:#666;
  }
}

.f-control select{
  padding: 6px 6px;  /* era 6px 10px */
}


.factura-lines #TotalGeneral{
  width: 200px;
  height: 36px;
  padding: 6px 10px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,0.20);
  font-size: 13.5px;
  background: #fafafa;
  text-align: right;
}


@media (max-width: 820px){
  /* nu mai afisa data-label peste inputuri (strict in linii factura) */
  .factura-lines td::before{ content: none !important; display:none !important; }

  /* optional: daca ai padding-left mare pentru label, il anulam */
  .factura-lines td{ padding-left: 12px !important; }
}




.act-grid{
  display:grid;
  grid-template-columns:repeat(3, auto);
  justify-content:left;
  gap:20px;
}

.act-grid span{
  display:flex;
  justify-content:center;
}

@media (max-width:600px){
  .act-grid{
    grid-template-columns:repeat(3, auto);
  }
}




			/* =========================================================
			   FACTURA 2026 (doar pagina asta) - curat + premium soft
			========================================================= */

			.pagina-factura{
			  width:100%;
			  min-height:100vh;

			  display:flex;
			  align-items:center;     /* centrare verticală */
			  justify-content:center; /* centrare orizontală */

			  padding:18px 0;

			  /* eContracte premium glow (indigo + accent rosu foarte subtil) */
			  background:
				radial-gradient(1200px 650px at 18% 6%, rgba(77, 93, 222, .16), transparent 62%),
				radial-gradient(900px 520px at 92% 18%, rgba(77, 93, 222, .10), transparent 58%),
				radial-gradient(700px 420px at 28% 92%, rgba(235, 70, 90, .06), transparent 60%),
				linear-gradient(180deg, #fbfbfd 0%, #f3f5fb 55%, #f1f2f7 100%);
			}


			.pagina-factura.factura-embed{
			  min-height:auto;
			  display:block;
			  align-items:initial;
			  justify-content:initial;
			  padding:0;
			  background:none;
			}

			/* FIX scroll pe mobil/tableta */
			@media (max-width: 900px){
			  .pagina-factura{
				min-height: 100vh;
				height: auto;
				overflow-y: auto;          /* permite derulare */
				-webkit-overflow-scrolling: touch;

				align-items: flex-start;   /* NU mai centram vertical */
				justify-content: center;   /* ramane centrat orizontal */
				padding: 12px 0 18px 0;    /* un pic mai ok pe mobil */
			  }
			}

			/* GRID (regula de baza) */
			.pagina-factura .factura-page-grid{
			  display:grid;
			  grid-template-columns: 380px minmax(0, 1fr);
			  gap:20px;
			  align-items:start;

			  width:100%;          /* IMPORTANT: nu auto */
			  flex:1;              /* IMPORTANT: cand .pagina-factura e flex */
			  max-width:1240px;    /* premium pe desktop */
			  margin:0 auto;       /* centrat pe desktop */
			  padding:0 18px;
			}

			@media (max-height: 920px){
			  .pagina-factura{
				align-items:flex-start;
			  }

			  .pagina-factura .factura-viewer{
				height:calc(100vh - 90px);
				min-height:460px;
			  }
			}


			/* stacked sub 1100px: FULL width */
			@media (max-width:1100px){
			  .pagina-factura .factura-page-grid{
				grid-template-columns: 1fr;
				max-width:none;    /* IMPORTANT: full */
				margin:0;          /* IMPORTANT: fara auto */
				padding:0 14px;
			  }
			}

			/* telefon */
			@media (max-width:520px){
			  .pagina-factura .factura-page-grid{
				padding:0 10px;
				gap:14px;
			  }
			}

			/* PANOU (card mare) */
			.pagina-factura .factura-card--panel{
			  border-radius:18px;
			  overflow:hidden;
			  background: rgba(255,255,255,.78);           /* mai lizibil decat .58 */
			  border:1px solid rgba(114,116,223,.14);
			  box-shadow: 0 18px 50px rgba(20,20,60,.10);
			}

			.pagina-factura .factura-card__body{ padding:18px; }

			/* TOP */
			.pagina-factura .factura-card__top{
			  text-align:center;
			  padding:2px 0 8px 0;
			}
			.pagina-factura .factura-ref{
			  font-weight:900;
			  letter-spacing:.8px;
			  color:#5d60d8;
			  font-size:20px;
			  margin:2px 0 16px 0;
			}
			.pagina-factura .factura-client{
			  display:flex;
			  align-items:center;
			  justify-content:center;
			  gap:10px;
			  font-weight:700;
			  font-size:14px;
			  color:#222;
			  margin:0 0 16px 0;
			}
			.pagina-factura .factura-client .badge-icon{
			  width:34px;height:34px;
			  border-radius:10px;
			  display:flex;align-items:center;justify-content:center;
			  background:rgba(114,116,223,.10);
			  border:1px solid rgba(114,116,223,.18);
			}
			.pagina-factura .factura-client .badge-icon i{ color:#7274DF; }
			.pagina-factura .factura-divider{
			  height:1px;
			  background:linear-gradient(to right, transparent, rgba(114,116,223,.22), transparent);
			  margin:12px 0 6px 0;
			}

			/* META + “TABURI” */
			.pagina-factura .factura-meta{
			  display:grid;
			  gap:10px;
			}

			/* TAB: centrat ca grup (nu mai e “lipit” stanga/dreapta) */
			.pagina-factura .factura-row{
			  display:flex;
			  align-items:center;
			  justify-content:center;   /* <-- asta rezolva “nu e centrat” */
			  gap:14px;

			  padding:10px 12px;
			  border-radius:12px;
			  background:#fff;
			  border:1px solid rgba(0,0,0,.06);
			  box-shadow: 0 1px 0 rgba(255,255,255,.75) inset;
			}
			.pagina-factura .factura-row .left{
			  display:inline-flex;
			  align-items:center;
			  gap:10px;
			  color:#2b2b2b;
			  font-weight:650;
			  font-size:13px;
			}
			.pagina-factura .factura-row .left i{ color:#7274DF; }
			.pagina-factura .factura-row .right{
			  display:inline-flex;
			  align-items:center;
			  color:#111;
			  font-size:13px;
			  white-space:nowrap;
			}

			/* Badge status (pastrezi background-color inline din PHP) */
			.pagina-factura .stare{
			  padding:6px 10px;
			  font-weight:800;
			  font-size:12px;
			  color:#fff;
			  line-height:1;
			  box-shadow: 0 6px 18px rgba(20,20,60,.10);
			}

			/* TOTAL */
			.pagina-factura .factura-total{ padding:14px 0 0 0; }
			.pagina-factura .factura-total__box{
			  border-radius:14px;
			  padding:14px 14px;
			  display:flex;
			  align-items:center;
			  justify-content:space-between;
			  gap:10px;
			  background:linear-gradient(180deg, #ffffff 0%, #f7f7fb 100%);
			  border:1px solid rgba(0,0,0,.06);
			  box-shadow: 0 10px 26px rgba(20,20,60,.06);
			}
			.pagina-factura .factura-total__label{ font-size:14px; color:#444; font-weight:800; }
			.pagina-factura .factura-total__value{
			  font-size:18px;
			  font-weight:950;
			  color:#121212;
			  white-space:nowrap;
			}

			/* ACTIUNI */
			.pagina-factura .factura-actions{
			  padding:14px 0 0 0;
			  display:grid;
			  gap:10px;
			}
			.pagina-factura .factura-actions .btn-big-list{
			  width:100%;
			  display:flex;
			  align-items:center;
			  justify-content:center;
			  gap:10px;
			  border-radius:12px !important;
			  padding:12px 14px !important;
			  letter-spacing:.2px;
			  min-height:46px;
			}
			.pagina-factura .factura-actions .btn-disabled{
			  opacity:.55;
			  filter:saturate(.6);
			  cursor:not-allowed;
			  pointer-events:none;
			}
			.pagina-factura .factura-actions .factura-help{
			  text-align:center;
			  font-size:12px;
			  color:#666;
			  margin-top:4px;
			}
			.pagina-factura .factura-actions .factura-help a{
			  color:#7274DF;
			  text-decoration:none;
			  font-weight:800;
			}

			/* PDF viewer */
			.pagina-factura .factura-viewer{
			  width:100%;
			  height:calc(100vh - 210px);
			  min-height:640px;
			  border:0;
			  display:block;
			  border-radius:14px;
			  background:#fff;
			}
			@media (max-width:1100px){
			  .pagina-factura .factura-viewer{
				height:72vh;
				min-height:520px;
			  }
			}			
			
			
			
			
.factura-actiuni-wrap{
	display:flex;
	align-items:left;
	justify-content:flex-end;
	gap:10px;
	position:relative;
}

.factura-actiuni-quick{
	display:flex;
	align-items:left;
	gap:20px;
}

.factura-actiuni-wrap .act{
	width:34px;
	height:34px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	border-radius:10px;
	text-decoration:none;
	background:#fff;
	border:1px solid rgba(114,116,223,.12);
	transition:all .18s ease;
}

.factura-actiuni-wrap .act:hover{
	transform:translateY(-1px);
	box-shadow:0 6px 18px rgba(20,20,60,.08);
	border-color:rgba(114,116,223,.22);
}

.act-pdf i{ color:#529214; }
.act-send i{ color:#7274DF; }
.act-money i{ color:#529214; }
.act-more i{ color:#7274DF; }

.factura-actiuni-more{
	position:relative;
}

.factura-actiuni-dropdown{
	display:none;
	position:absolute;
	top:20px;
	right:0;
	min-width:220px;
	background:#fff;
	border:1px solid rgba(114,116,223,.14);
	border-radius:14px;
	box-shadow:0 18px 40px rgba(30,35,90,.12);
	padding:8px;
	z-index:50;
}

.factura-actiuni-dropdown.open{
	display:block;
}

.factura-actiuni-dropdown a{
	display:flex;
	align-items:center;
	gap:10px;
	padding:9px 10px;
	border-radius:10px;
	text-decoration:none;
	color:#2f3441;
	font-size:14px;
}

.factura-actiuni-dropdown a:hover{
	background:rgba(114,116,223,.06);
}

.factura-actiuni-dropdown a i{
	width:16px;
	text-align:center;
	color:#7274DF;
}			




		.bill-alert{
			margin:0 0 22px 0;
			padding:16px 16px 14px 16px;
			border:1px solid #e8dcc8;
			border-left:4px solid #d98d1f;
			border-radius:18px;
			background:linear-gradient(180deg, #fdfbf7 0%, #faf7f1 100%);
			box-shadow:0 8px 24px rgba(40, 28, 10, .04);
		}

		.bill-alert--ok{
			border-left-color:#72b26b;
			border-color:#dbe9d8;
			background:linear-gradient(180deg, #fbfdfb 0%, #f6faf6 100%);
		}

		.bill-alert-head{
			display:flex;
			align-items:center;
			gap:10px;
			margin-bottom:12px;
			font-size:18px;
			font-weight:700;
			color:#be6f00;
			line-height:1.25;
		}

		.bill-alert--ok .bill-alert-head{
			color:#4f8a4b;
		}

		.bill-alert-head i{
			font-size:16px;
			opacity:.92;
		}

		.bill-alert-summary{
			font-size:13px;
			color:#927c5a;
			margin-bottom:10px;
			line-height:1.45;
		}

		.bill-alert--ok .bill-alert-summary{
			color:#6c8668;
		}

		.bill-alert-section{
			margin-top:14px;
		}

		.bill-alert-section--retro .bill-alert-title{
			color:#9a630e;
		}

		.bill-alert-section--azi .bill-alert-title{
			color:#4f8a4b;
		}

		.bill-alert-section--extra .bill-alert-title{
			color:#8d5a18;
		}

		.bill-alert-row--extra{
			background:linear-gradient(180deg, #fffaf3 0%, #fff5e8 100%);
			border-color:#ecd6b1;
		}

		.bill-alert-row-left .accent-extra{
			color:#9b6118;
		}

		.bill-alert-actions .btn-maro-soft{
			background:linear-gradient(180deg, #fff9f2 0%, #fff2df 100%);
			color:#9b6118;
			border:1px solid #e6c79c;
			border-radius:6px;
			box-shadow:none;
		}

		.bill-alert-actions .btn-maro-soft:hover{
			background:linear-gradient(180deg, #fff3e8 0%, #ffe9d0 100%);
			color:#7f4f12;
			border-color:#ddb37c;
		}
		
		.bill-alert-title{
			display:flex;
			align-items:center;
			gap:8px;
			font-size:15px;
			font-weight:700;
			margin:0 0 10px 0;
			line-height:1.3;
		}

		.bill-alert-title i{
			font-size:14px;
		}

		.bill-alert-list{
			display:flex;
			flex-direction:column;
			gap:10px;
		}

		.bill-alert-list.is-scroll{
			max-height:260px;
			overflow-y:auto;
			padding-right:4px;
		}

		.bill-alert-list.is-scroll::-webkit-scrollbar{
			width:8px;
		}

		.bill-alert-list.is-scroll::-webkit-scrollbar-thumb{
			background:#ddd4c7;
			border-radius:20px;
		}

		.bill-alert-row{
			display:flex;
			align-items:center;
			justify-content:space-between;
			gap:14px;
			padding:11px 13px;
			border-radius:14px;
			border:1px solid #eee1cd;
			background:#fffdfa;
		}

		.bill-alert-row--retro{
			background:#ffffff;
			border-color:#ead8be;
		}

		.bill-alert-row--azi{
			background:#fbfefb;
			border-color:#dbead8;
		}

		.bill-alert-row-left{
			flex:1;
			min-width:0;
			font-size:15px;
			line-height:1.42;
			color:#5f5a50;
		}

		.bill-alert-row-left b{
			color:#35312c;
			font-weight:700;
		}

		.bill-alert-row-left .accent-retro{
			color:#a66a12;
		}

		.bill-alert-row-left .accent-azi{
			color:#4f8a4b;
		}

		.bill-alert-meta{
			display:block;
			margin-top:4px;
			font-size:12.5px;
			color:#9a907f;
			line-height:1.4;
		}

		.bill-alert-actions{
			flex-shrink:0;
			display:flex;
			align-items:center;
		}

		.bill-alert-empty{
			padding:12px 14px;
			border-radius:14px;
			border:1px dashed #e7d8bf;
			background:#fffdfa;
			font-size:14px;
			color:#8a7a61;
			line-height:1.45;
		}

		.bill-alert-okbox{
			padding:12px 14px;
			border-radius:14px;
			border:1px solid #dbe9d8;
			background:#fcfffc;
			font-size:14px;
			color:#5c7758;
			line-height:1.45;
		}

		.bill-alert-actions .btn-rosu-soft{
			background:linear-gradient(180deg, #fff7f7 0%, #fff1f1 100%);
			color:#cf3c3c;
			border:1px solid #efb4b4;
			border-radius:10px;
			box-shadow:none;
		}

		.bill-alert-actions .btn-rosu-soft:hover{
			background:linear-gradient(180deg, #fff1f1 0%, #ffe8e8 100%);
			color:#bf2f2f;
			border-color:#e59b9b;
		}
		.bill-alert-actions .btn{
			white-space:nowrap;
		}

		@media (max-width: 900px){
			.bill-alert{
				padding:14px 12px 12px 12px;
				border-radius:16px;
			}

			.bill-alert-head{
				font-size:16px;
				margin-bottom:10px;
			}

			.bill-alert-summary{
				font-size:12px;
				margin-bottom:8px;
			}

			.bill-alert-title{
				font-size:13px;
				margin-bottom:8px;
			}

			.bill-alert-row{
				flex-direction:column;
				align-items:flex-start;
				padding:11px 11px;
				gap:10px;
			}

			.bill-alert-row-left{
				font-size:13px;
				line-height:1.5;
			}

			.bill-alert-meta{
				font-size:11px;
			}

			.bill-alert-actions{
				width:100%;
			}

			.bill-alert-actions .btn{
				padding:7px 11px;
				font-size:12px;
				line-height:1.2;
			}

			.bill-alert-list.is-scroll{
				max-height:none;
				overflow:visible;
				padding-right:0;
			}
		}
		
		
/* =========================================================
   NOTIFICARI UPDATE 2026 (optimizat, compact, premium)
========================================================= */

.ec-update-card{
	width: auto;
	box-sizing: border-box;
	padding: 14px 16px 12px 16px; /* 🔥 mai compact */
	border-radius: 14px;
	background: #f4f5ff;
	border-left: 4px solid #7475f3;
	box-shadow: 0 6px 20px rgba(16,24,40,.06); /* 🔥 mai soft */
	color: #31324a;
}

.ec-update-main{
	display: flex;
	align-items: flex-start;
	gap: 12px; /* 🔥 mai compact */
}

.ec-update-icon{
	width: 38px;
	height: 38px;
	min-width: 38px;
	border-radius: 10px;
	background: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 3px 10px rgba(16,24,40,.07);
	font-size: 17px;
}

.ec-update-content{
	width: 100%;
}

.ec-update-title{
	font-family: Montserrat-SemiBold, Montserrat-Medium, Arial, sans-serif;
	font-size: 16px;
	color: #3637b5;
	margin-bottom: 2px; /* 🔥 redus */
}

.ec-update-meta{
	font-family: Montserrat-Medium, Arial, sans-serif;
	font-size: 12px;
	color: #77799b;
	margin-bottom: 12px; /* 🔥 redus */
}

.ec-update-text{
	font-family: Montserrat-Medium, Arial, sans-serif;
	font-size: 14px;
	line-height: 1.45;
	color: #3b3b55;
	margin-top: 6px;

	max-height: 200px;
	overflow-y: auto;
	padding-right: 8px;
}

/* 🔥 LISTA FIXATA (important) */
.ec-update-text ul,
.ec-update-text ol{
	margin: 4px 0 0 16px;
	padding: 0;
}

.ec-update-text li{
	margin-bottom: 2px; /* 🔥 foarte important */
	line-height: 1.4;
}

.ec-update-text li::marker {
    color: #8b8dcf;
}

/* 🔥 eliminăm spații aiurea dacă vin <br> din PHP */
.ec-update-text br{
	display: none;
}

.ec-update-actions{
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 10px;
	flex-wrap: wrap;
}

/* mic polish pe hover (subtil, premium) */
.ec-update-card:hover{
	box-shadow: 0 10px 26px rgba(16,24,40,.08);
}

/* responsive */
@media (max-width: 768px){
	.ec-update-card{
		padding: 12px;
		border-radius: 12px;
	}

	.ec-update-main{
		gap: 10px;
	}

	.ec-update-title{
		font-size: 14.5px;
	}

	.ec-update-text{
		font-size: 13px;
		max-height: 160px;
	}
}