﻿/* ==========================================================================
   FORMS RESHAPE — sandbox, namespace .global-form
   Rollout: find-replace "global-form-r" -> "global-form" + load dupa forms.css.
   CASE 1: Simple input field + toate starile (Figma). Tokens simpli --input--*.
   ========================================================================== */

:root {
	/* geometrie */
	--input--radius: 8px;
	--input--pad: 8px;
	--input--pad-lr: 16px;
	--input--height: 48px;
	--input--gap: 8px;
	--input--bg: #FFF;
	--input--border: #555C5F;
	--input--border-w: 1px;
	--input--font: "PingLCG";

	/* stari border / focus */
	--input--border-active: #163FE8;      /* hover + focus */
	--input--focus-ring: #506FEE;         /* box-shadow focus */

	/* label / placeholder */
	--input--label: #555C5F;              /* jos (placeholder) */
	--input--label-up: #163FE8;           /* sus, la FOCUS */
	--input--label-up-filled: #4E4E4E;    /* sus, completat (fara focus) */
	--input--label-size: 16px;
	--input--label-lh: 24px;
	--input--label-up-size: 12px;
	--input--label-up-lh: 14px;

	/* text tastat */
	--input--text: #0D0D0D;
	--input--text-size: 14px;
	--input--text-lh: 20px;

	/* helper text */
	--input--helper: #4E4E4E;
	--input--helper-size: 12px;
	--input--helper-lh: 14px;

	/* iconite (folosite la case 2+) */
	--input--icon: #555C5F;               /* default / hover */
	--input--icon-active: #0D0D0D;        /* focus / filled */

	/* disabled */
	--input--disabled-bg: rgba(13, 13, 13, 0.10);
	--input--disabled-fg: #555C5F;

	/* eroare */
	--input--error: #CE2500;
}

/* wrapper coloana + gap (compenseaza margin-top negativ de la erori) */
/* .global-form {
	padding:2px; 
	box-sizing:border-box;
} */

.global-form_old_model .input-box input[readonly],
.global-form_old_model .input-box input:disabled {
	color: #6D7275;
	background: #E2E4E8;
}

.global-form_old_model .custom-select-box:has(select:disabled):focus-within>label,
.global-form_old_model .custom-select-box:has(select:disabled):has(select option:checked:not([hidden]))>label {
	
	font-size: 10px;
	left: 16px;
	color: #94989b;
}

.global-form .date-personale-wrapper {
	display: flex;
	flex-direction: column;
	gap: 24px;             
	margin-bottom: 16px;
}
/* grup per camp: input-box + helper + error impreuna, spatiere interna mica (4px) */
.global-form .input-field {
	display: flex;
	flex-direction: column;
	gap: 4px;
	/* flex: 1 0 calc(25% - 24px); */
    width: 100%;
}

/* ========================= BOX ========================= */
.global-form .input-box {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--input--gap, 8px);
	height: var(--input--height, 48px);
	padding: var(--input--pad, 8px) var(--input--pad-lr, 16px);
	border-radius: var(--input--radius, 8px);
	border: var(--input--border-w, 1px) solid var(--input--border, #555C5F);
	background: var(--input--bg, #FFF);
	box-sizing: border-box;
	transition: border-color .15s ease, box-shadow .15s ease;
	flex: 1 0 calc(25% - 24px);
    width: 100%;
	margin:1.5px;
}
.global-form .input-box-no-flex ,
.global-form .input-box-no-flex .input-box {
	flex:none;
}
/* hover */
.global-form .input-box:hover {
	border-color: var(--input--border-active, #163FE8);
}
/* focus */
.global-form .input-box:focus-within {
	border-color: var(--input--border-active, #163FE8);
	box-shadow: 0 0 0 2px var(--input--focus-ring, #506FEE);
}
/* disabled (bg 10% + border gri) */
.global-form .input-box:has(input:disabled),
.global-form .input-box:has(input[readonly]) {
	background: var(--input--disabled-bg, rgba(13,13,13,.10));
	border-color: var(--input--border, #555C5F);
	box-shadow: none;
	pointer-events: none;
}
/* error (border rosu, fara ring) */
.global-form .input-box.has-error {
	border-color: var(--input--error, #CE2500);
	box-shadow: none;
}
/* info (border albastru) */
.global-form .input-box.has-info {
	border-color: #007295;
	box-shadow: none;
}
/* warning (border portocaliu) */
.global-form .input-box.has-warning {
	border-color: #B64600;
	box-shadow: none;
}

/* ========================= STATE SIMULATION CLASSES (for static demo grid) ========================= */
/* .is-default — default state (inherits default styles from .input-box) */

/* .is-hover — hover state */
.global-form .input-box.is-hover {
	border-color: var(--input--border-active, #163FE8);
}

.global-form .input-box.is-hover input::placeholder {
	color: var(--input--label, #555C5F);
}

/* .is-focus — focus state */
.global-form .input-box.is-focus {
	border-color: var(--input--border-active, #163FE8);
	
}

.global-form .input-box.is-focus input::placeholder {
	color: var(--input--label, #555C5F);
}
/* .is-focus — focus state */
.global-form .input-box.is-focus-visible {
	border-color: var(--input--border-active, #163FE8);
	box-shadow: 0 0 0 2px var(--input--focus-ring, #506FEE);
}

.global-form .input-box.is-focus-visible input::placeholder {
	color: var(--input--label, #555C5F);
}

/* .is-filled — filled state (inherits default styles, label raised via :not(:placeholder-shown)) */

/* .is-disabled — disabled state */
.global-form .input-box.is-disabled {
	background: var(--input--disabled-bg, rgba(13,13,13,.10));
	border-color: var(--input--border, #555C5F);
	box-shadow: none;
	pointer-events: none;
	opacity: 0.6;
}

.global-form .input-box.is-disabled input,
.global-form .input-box.is-disabled label {
	color: var(--input--disabled-fg, #555C5F);
	cursor: not-allowed;
}

/* .is-disabled-filled — disabled + filled */
.global-form .input-box.is-disabled-filled {
	background: var(--input--disabled-bg, rgba(13,13,13,.10));
	border-color: var(--input--border, #555C5F);
	box-shadow: none;
	pointer-events: none;
	opacity: 0.6;
}

.global-form .input-box.is-disabled-filled input,
.global-form .input-box.is-disabled-filled label {
	color: var(--input--disabled-fg, #555C5F);
	cursor: not-allowed;
}

/* .is-error — error state */
.global-form .input-box.is-error {
	border-color: var(--input--error, #CE2500);
	box-shadow: none;
}

.global-form .input-box.is-error label {
	color: var(--input--error, #CE2500);
}

/* .is-error-filled — error + filled */
.global-form .input-box.is-error-filled {
	border-color: var(--input--error, #CE2500);
	box-shadow: none;
}

.global-form .input-box.is-error-filled label {
	color: var(--input--label-up-filled, #4E4E4E);
}

/* ========================= INPUT (text) ========================= */
.global-form .input-box input {
	flex: 1 0 0;
	width: 100%;
	height: 100%;
	min-width: 0;
	border: none;
	background: transparent;
	padding: 13px 0 0;      /* top -> textul st jos, sub label-ul urcat; fara icoane L/R=0 */
	box-sizing: border-box;
	outline: none;
	font-family: var(--input--font, "PingLCG"), sans-serif;
	font-size: var(--input--text-size, 14px);
	line-height: var(--input--text-lh, 20px);
	color: var(--input--text, #0D0D0D);
}
.global-form .input-box input:focus { outline: 0; }
/* disabled / disabled-filled: text gri */
.global-form .input-box input:disabled,
.global-form .input-box input[readonly] { color: var(--input--disabled-fg, #555C5F); }

/* placeholder real: ascuns cand label e jos; vizibil DOAR la focus */
.global-form .input-box input::placeholder,
.global-form input::placeholder { color: transparent; }

.global-form .input-box input:focus::placeholder,
.global-form input:focus::placeholder { color: var(--input--label, #555C5F); }

/* ========================= LABEL (floating) ========================= */
.global-form .input-box label {
	position: absolute;
	left: 16px;                 
	top: 50%;
	transform: translateY(-50%);
	pointer-events: none;
	transition: all .18s ease;
	color: var(--input--label, #555C5F);
	font-family: var(--input--font, "PingLCG"), sans-serif;
	font-size: var(--input--label-size, 16px);
	line-height: var(--input--label-lh, 24px);
}
/* SUS — pozitia (focus, hover sau completat) */
.global-form .input-box input:focus + label,
.global-form .input-box input:hover + label,
.global-form .input-box input:not(:placeholder-shown) + label {
	top: 6px;
	transform: translateY(0);
	font-size: var(--input--label-up-size, 12px);
	line-height: var(--input--label-up-lh, 14px);

}
/* culoare cand e completat (fara focus) */
.global-form .input-box input:not(:placeholder-shown) + label {
	color: var(--input--label-up-filled, #4E4E4E);
}
/* culoare la FOCUS (castiga) */
.global-form .input-box input:focus + label {
	color: var(--input--label-up, #163FE8);
}
/* NEW: hover pseudo-selector */
.global-form .input-box input:hover + label {
	color: var(--input--label-up, #163FE8);
}
/* NEW: valid pseudo-selector — doar cand e completat (.has-value, din assets/js/forms-has-value.js);
   un input ne-required gol e tot :valid si ar fi albastru din start */
.global-form .input-box.has-value input:valid + label {
	color: var(--input--label-up, #163FE8);
}
/* NEW: readonly pseudo-selectors */
.global-form .input-box input[readonly] + label {
	color: var(--input--disabled-fg, #555C5F);
	top: 6px;
	transform: translateY(0);
}
.global-form .input-box input[readonly][value]:not([value=""]) + label {
	top: 6px;
	transform: translateY(0);
}
/* NEW: disabled pseudo-selectors */
.global-form .input-box input:disabled + label {
	color: var(--input--disabled-fg, #555C5F);
	top: 6px;
	transform: translateY(0);
}
.global-form .input-box input:disabled:not(:placeholder-shown) + label {
	top: 6px;
	transform: translateY(0);
}
/* NEW: placeholder-shown with pseudo-selectors */
.global-form .input-box input:placeholder-shown:not(:focus):not(:hover):not(:required) + label {
	/* color: var(--input--label, #555C5F);
	top: 50%;
	transform: translateY(-50%); */
}
/* disabled label */
.global-form .input-box:has(input:disabled) label,
.global-form .input-box:has(input[readonly]) label {
	color: var(--input--disabled-fg, #555C5F);
}
/* error label (rosu cand gol; gri cand completat = error-filled) */
.global-form .input-box.has-error label {
	color: var(--input--error, #CE2500);
}
.global-form .input-box.has-error input:not(:placeholder-shown) + label {
	color: var(--input--disabled-fg, #555C5F);
}

/* label.has-placeholder — label urcă sus ca și la focus, placeholder vizibil */
.global-form .input-box label.has-placeholder {
	top: 6px;
	transform: translateY(0);
	font-size: var(--input--label-up-size, 12px);
	line-height: var(--input--label-up-lh, 14px);
	color: var(--input--label-up, #163FE8);
}

/* placeholder vizibil când label-ul sibling are .has-placeholder */
.global-form .input-box:has(label.has-placeholder) input::placeholder {
	color: var(--input--label, #555C5F);
}

/* Phone Input: placeholder vizibil când label are .has-placeholder */
.global-form .input-box.iti-phone-field:has(label.has-placeholder) .main-input-border-box input::placeholder {
	color: var(--input--label, #555C5F);
}
/* .input-field e coloana: orice flex-basis pe caseta devine INALTIME (Firefox o micsora
   fata de Chrome in randurile cu 2-4 campuri). Caseta ramane la inaltimea ei.
   !important: regulile vechi din blocuri (ex. contractare: `.container-input-box-4 .input-box
   { flex: 1 0 calc(33% - 48px); flex-direction: column }`), scrise cand caseta era direct in
   rand, au specificitate mai mare. In structura cu .input-field, latimea se da pe .input-field,
   deci pe caseta din el nu are sens niciun flex-basis / flex-direction: column. */
.global-form .input-field > .input-box,
.global-form .input-field > .custom-select-box,
.global-form .input-field > .textarea-box {
    flex: 0 0 auto !important;
}

.global-form .input-field > .input-box {
    flex-direction: row !important;
}
/* ========================= ICOANE (::before=leading, ::after=trailing pe .input-box) ========================= */
.global-form .input-box.icon-before::before,
.global-form .input-box.icon-after::after {
	content: "";
	width: 24px;
	height: 24px;
	flex-shrink: 0;
	align-self: flex-end;          /* aliniat cu textul (jos), NU pe mijloc */
	margin-bottom: 4px;
	background-color: var(--input--icon, #555C5F);
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
	-webkit-mask-position: center; mask-position: center;
	-webkit-mask-size: contain; mask-size: contain;
}
.global-form .input-box.icon-before::before {
	-webkit-mask-image: var(--input-icon-before);
	        mask-image: var(--input-icon-before);
}
.global-form .input-box.icon-after::after {
	-webkit-mask-image: var(--input-icon-after);
	        mask-image: var(--input-icon-after);
}
/* culoare icon pe stari: focus/filled -> activ; error -> rosu; disabled -> gri */
.global-form .input-box:focus-within.icon-before::before,
.global-form .input-box:focus-within.icon-after::after,
.global-form .input-box:has(input:not(:placeholder-shown)).icon-before::before,
.global-form .input-box:has(input:not(:placeholder-shown)).icon-after::after {
	background-color: var(--input--icon-active, #0D0D0D);
}
.global-form .input-box.has-error.icon-before::before,
.global-form .input-box.has-error.icon-after::after {
	background-color: var(--input--error, #CE2500);
}
.global-form .input-box.has-info.icon-before::before,
.global-form .input-box.has-info.icon-after::after {
	background-color: #007295;
}
.global-form .input-box.has-warning.icon-before::before,
.global-form .input-box.has-warning.icon-after::after {
	background-color: #B64600;
}
.global-form .input-box:has(input:disabled).icon-before::before,
.global-form .input-box:has(input:disabled).icon-after::after {
	background-color: var(--input--disabled-fg, #555C5F);
}
/* label mutat la dreapta cand exista icon leading (8 pad + 24 icon + 8 gap) */
.global-form .input-box.icon-before label { left: 40px; }

/* seturi de iconite (path relativ la assets/css/ -> ../icons/blocks/) */

.input-icon-before-mail      { --input-icon-before: url("../icons/blocks/mail.svg"); }
.input-icon-after-mail       { --input-icon-after:  url("../icons/blocks/mail.svg"); }
.input-icon-before-search    { --input-icon-before: url("../icons/blocks/search.svg"); }
.input-icon-after-search     { --input-icon-after:  url("../icons/blocks/search.svg"); }
.input-icon-before-calendar  { --input-icon-before: url("../icons/blocks/calendar.svg"); }
.input-icon-after-arrow-down { --input-icon-after:  url("../icons/blocks/arrow-down.svg"); }
.input-icon-before-info      { --input-icon-before: url("../icons/blocks/info-ico.svg"); }
.input-icon-before-warning   { --input-icon-before: url("../icons/blocks/info-warning-ico.svg"); }

/* ========================= HELPER TEXT ========================= */
.global-form .input-helper {
	display: flex;
	align-items: center;
	gap: 8px;
	color: var(--input--helper, #4E4E4E);
	font-family: var(--input--font, "PingLCG"), sans-serif;
	font-size: var(--input--helper-size, 12px);
	line-height: var(--input--helper-lh, 14px);
}
/* cand apare eroarea, helper-ul dispare */
.global-form .input-box.has-error ~ .input-helper { display: none; }

/* ========================= ERORI ========================= */
/* varianta 1: .field-error (static in markup) */
.global-form .field-error {
	display: none;
	align-items: center;
	gap: 8px;
	align-self: stretch;
	color: var(--input--error, #CE2500);
	font-family: var(--input--font, "PingLCG"), sans-serif;
	font-size: var(--input--helper-size, 12px);
	line-height: var(--input--helper-lh, 14px);
}
.global-form .field-error:not(:empty),
.global-form .field-error.is-visible {
	display: flex;
	margin-top:0px;
	margin-bottom:0px;
}
.global-form .field-error::before {
	content: "";
	display: inline-block;
	width: 24px;
	height: 24px;
	flex-shrink: 0;
	background-color: var(--input--error, #CE2500);
	-webkit-mask-image: url(../icons/blocks/info-error-ico.svg);
	        mask-image: url(../icons/blocks/info-error-ico.svg);
	-webkit-mask-size: contain; mask-size: contain;
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
	-webkit-mask-position: center; mask-position: center;
}
/* .field-info (info message) */
.global-form .field-info {
	display:none;
	align-items: center;
	gap: 8px;
	align-self: stretch;
	color: #007295;
	font-family: var(--input--font, "PingLCG"), sans-serif;
	font-size: var(--input--helper-size, 12px);
	line-height: var(--input--helper-lh, 14px);
}
.global-form .field-info.active {
	display: flex;
	
}
.global-form .field-info::before {
	content: "";
	display: inline-block;
	width: 24px;
	height: 24px;
	flex-shrink: 0;
	background-color: #007295;
	-webkit-mask-image: url(../icons/blocks/info-ico.svg);
	        mask-image: url(../icons/blocks/info-ico.svg);
	-webkit-mask-size: contain; mask-size: contain;
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
	-webkit-mask-position: center; mask-position: center;
}
/* .field-warning (warning message) */
.global-form .field-warning {
	display: flex;
	align-items: center;
	gap: 8px;
	align-self: stretch;
	color: #B64600;
	font-family: var(--input--font, "PingLCG"), sans-serif;
	font-size: var(--input--helper-size, 12px);
	line-height: var(--input--helper-lh, 14px);
}
.global-form .field-warning::before {
	content: "";
	display: inline-block;
	width: 24px;
	height: 24px;
	flex-shrink: 0;
	background-color: #B64600;
	-webkit-mask-image: url(../icons/blocks/info-warning-ico.svg);
	        mask-image: url(../icons/blocks/info-warning-ico.svg);
	-webkit-mask-size: contain; mask-size: contain;
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
	-webkit-mask-position: center; mask-position: center;
}

/* varianta 2: .input-box-error (inserat din JS, sibling dupa .input-box) */
.global-form .input-box-error {
	display: flex;
	align-items: center;
	gap: 8px;
	align-self: stretch;
	color: var(--input--error, #CE2500);
	font-family: var(--input--font, "PingLCG"), sans-serif;
	font-size: var(--input--helper-size, 12px);
	line-height: var(--input--helper-lh, 14px);
}
.global-form .input-box-error::before {
	content: "";
	display: inline-block;
	width: 24px;
	height: 24px;
	flex-shrink: 0;
	background-color: var(--input--error, #CE2500);
	-webkit-mask-image: url(../icons/blocks/info-error-ico.svg);
	        mask-image: url(../icons/blocks/info-error-ico.svg);
	-webkit-mask-size: contain; mask-size: contain;
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
	-webkit-mask-position: center; mask-position: center;
}



/* ========================= INFO POPOVER — copiată din global-forms.css ========================= */
.global-form .popover-container {
    position: relative;
    max-width: 480px;
}

.global-form .info-popover {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 8px;
    background: #FFF;
    border: 1px solid rgba(13, 13, 13, 0.15);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(13, 13, 13, 0.12);
    z-index: 1000;
    max-width: 300px;
    min-width: 250px;
}

.global-form .info-popover:not([hidden]) {
    z-index: 1001;
}

.global-form .info-popover[hidden] {
    display: none;
}

.global-form .popover-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid rgba(13, 13, 13, 0.08);
}

.global-form .popover-title {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #0D0D0D;
}

.global-form .popover-close {
    background: none;
    border: none;
    font-size: 20px;
    cursor: pointer;
    color: #8A9094;
    padding: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s ease;
}

.global-form .popover-close:hover {
    color: #0D0D0D;
}

.global-form .popover-body {
    padding: 12px 16px;
    font-size: 13px;
    color: #555C5F;
    line-height: 1.5;
}

.global-form .popover-body p {
    margin: 0 0 8px 0;
}

.global-form .popover-body p:last-child {
    margin-bottom: 0;
}

/* ========================= SIDE-PANEL + TEXT CHECKBOX + OVERLAY ========================= */
.global-form_old_model .text-checkbox-module,
.global-form .text-checkbox-module {
	background: #f2f3f5;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 48px;
	border-radius: 16px;
	cursor: pointer;
	transition: background-color ease 0.5s;
	width: 100%;
	box-sizing: border-box;
}
.global-form_old_model .text-checkbox-module:hover,
.global-form .text-checkbox-module:hover {
	background-color: rgb(199, 199, 199);
}
.global-form_old_model .text-checkbox-module * ,
.global-form .text-checkbox-module * {
	cursor: inherit;
}
.global-form_old_model .text-checkbox-module .text ,
.global-form .text-checkbox-module .text {
	font-size: 32px;
}
.global-form_old_model .text-checkbox-module .title ,
.global-form .text-checkbox-module .title {
	font-size: 40px;
	font-weight: 700;
	margin-bottom: 16px;
}
.global-form_old_model .side-panel,
.global-form .side-panel {
	position: fixed;
	top: 0px;
	bottom: 0px;
	right: 0;
	width: 680px;
	height: 100vh;
	background: #FFF;
	padding: 80px 48px 0px;
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	opacity: 0;
	transition:
		transform 0.4s ease,
		opacity 0.4s ease;
	z-index: 1060;
	overflow: hidden;
	box-sizing: border-box;
}

body.navbar-hidden .side-panel {
	top: 0px;
	bottom: 0px;
}

.side-panel.is-open {
	transform: translateX(0);
	opacity: 1;
}

.side-panel .global-title {
	font-size: 48px;
	font-weight: 700;
	flex-shrink: 0;
}

.side-panel .container-terms {
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 0;
	padding-right: 24px;
}

.side-panel .button-wrapper-specific,
.side-panel .button-wrapper {
	width: 100%;
	background: #FAFAFA;
	box-sizing: border-box;
	display: flex;
	gap: 24px;
	padding: 32px 0px;
	flex-shrink: 0;
}

.side-panel .button-wrapper-specific .global-button,
.side-panel .button-wrapper .global-button {
	flex: 1;

}

#overlay {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: 1050;
}

#overlay.active {
	display: block;
}

.side-panel .container-terms::-webkit-scrollbar,
.global-form_old_model .textarea-box textarea::-webkit-scrollbar,
.global-form .textarea-box textarea::-webkit-scrollbar {
	width: 16px;
}

.side-panel .container-terms::-webkit-scrollbar-thumb,
.global-form_old_model .textarea-box textarea::-webkit-scrollbar-thumb,
.global-form .textarea-box textarea::-webkit-scrollbar-thumb {
	background-color: #163fe8;
	border-radius: 98px;
}

.side-panel .container-terms::-webkit-scrollbar-track,
.global-form_old_model .textarea-box textarea::-webkit-scrollbar-track ,
.global-form .textarea-box textarea::-webkit-scrollbar-track {
	background-color: #d3d5d6;
	border-radius: 98px;
}

.terms-and-condition-container {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 32px;
	align-self: stretch;
}
.global-form {
	display: flex;
	flex-direction: column;
	gap: 12px;
}


/**=============================================**/
/**==============TICKED CHECKBOX================**/
/**=============================================**/
.global-form_old_model .ticked-checkbox,
.global-form .ticked-checkbox {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin-bottom:8px;
}
.global-form_old_model .ticked-checkbox .text-details,
.global-form_old_model .ticked-checkbox input~label ,
.global-form .ticked-checkbox .text-details,
.global-form .ticked-checkbox input~label {
	color: #0d0d0d;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
}
.global-form_old_model .ticked-checkbox .text-details,
.global-form .ticked-checkbox .text-details {
	flex: 1 0 0;
}
.global-form_old_model .ticked-checkbox input~label,
.global-form .ticked-checkbox input~label {
	cursor: pointer;
	user-select: none;
}
.global-form_old_model .ticked-checkbox input,
.global-form .ticked-checkbox input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	pointer-events: none;
}
.global-form_old_model .ticked-checkbox input+label,
.global-form .ticked-checkbox input+label {
	width: 20px;
	height: 20px;
	min-width: 20px;
	border: 1px solid #555C5F;
	background: #fff;
	border-radius: 4px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: border-color 0.22s ease, background 0.22s ease, box-shadow 0.22s ease;
	flex-shrink: 0;
	padding: 0;
	position: relative;
}
.global-form_old_model .ticked-checkbox input+label::before,
.global-form .ticked-checkbox input+label::before {
	content: "";
	position: absolute;
	width: 12px;
	height: 12px;
	/* -webkit-mask-image: url(./../../assets/icons/blocks/unchecked.svg);
	mask-image: url(./../../assets/icons/blocks/unchecked.svg); */
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	background-color: transparent;
	transition: -webkit-mask-image 0s, mask-image 0s, background-color 0.2s ease;
}
.global-form_old_model .ticked-checkbox input:checked+label ,
.global-form .ticked-checkbox input:checked+label {
	background: #163FE8;
	border-color: #163FE8;
}
.global-form_old_model .ticked-checkbox input:checked+label::before,
.global-form .ticked-checkbox input:checked+label::before {
	-webkit-mask-image: url(./../../assets/icons/blocks/checked.svg);
	mask-image: url(./../../assets/icons/blocks/checked.svg);
	-webkit-mask-size: 13px;
	mask-size:13px;
	background-color: #FFFFFF;
	transition: background-color 0.2s ease;
}
.global-form_old_model .ticked-checkbox input:focus+label,
.global-form .ticked-checkbox input:focus+label {
	/* box-shadow: 0 0 0 2px #506FEE;
	outline: 0px transparent;
	border-color: #163FE8;
	background-color: #163FE8; */
}
.global-form_old_model .ticked-checkbox input:not(:checked):focus+label::before ,
.global-form .ticked-checkbox input:not(:checked):focus+label::before {
	background-color: #FFFFFF;
	transition: background-color 0.2s ease;
}
.global-form_old_model .ticked-checkbox input:checked:focus+label,
.global-form .ticked-checkbox input:checked:focus+label {
	/* box-shadow: 0 0 0 2px #506FEE; */
	outline: 0px transparent;
	border-color: #163FE8;
	/* background-color: #163FE8; */
}
.global-form_old_model .ticked-checkbox input:checked:focus+label::before,
.global-form .ticked-checkbox input:checked:focus+label::before {
	background-color: #FFFFFF;
}
.global-form_old_model .ticked-checkbox input.has-error+label,
.global-form .ticked-checkbox input.has-error+label {
	border-color: #CE2500;
	background: #fff;
}
.global-form_old_model .ticked-checkbox input.has-error+label::before,
.global-form .ticked-checkbox input.has-error+label::before {
	/* -webkit-mask-image: url(./../../assets/icons/blocks/unchecked.svg); */
	/* mask-image: url(./../../assets/icons/blocks/unchecked.svg); */
	background-color: #fff;
	transition:none !important;
}
.global-form_old_model .ticked-checkbox input.has-error:checked+label,
.global-form .ticked-checkbox input.has-error:checked+label {
	background: #fff;
	border-color: #CE2500;
}
.global-form_old_model .ticked-checkbox input.has-error:checked+label::before ,
.global-form .ticked-checkbox input.has-error:checked+label::before {
	-webkit-mask-image: url(./../../assets/icons/blocks/checked.svg);
	mask-image: url(./../../assets/icons/blocks/checked.svg);
	background-color: #CE2500;
	/* color:#CE2500; */
	transition:none !important;
}
.global-form_old_model .ticked-checkbox input.has-error:focus+label,
.global-form .ticked-checkbox input.has-error:focus+label {
	/* box-shadow: 0 0 0 2px #506FEE; */
	outline: 0px transparent;
	transition:none !important;
}
.global-form_old_model .ticked-checkbox input:disabled+label,
.global-form .ticked-checkbox input:disabled+label {
	border-color: #94989B;
	background: #94989B;
	cursor: not-allowed;
	pointer-events: none;
}
.global-form_old_model .ticked-checkbox input:disabled+label::before,
.global-form .ticked-checkbox input:disabled+label::before {
	/* -webkit-mask-image: url(./../../assets/icons/blocks/unchecked.svg); */
	/* mask-image: url(./../../assets/icons/blocks/unchecked.svg); */
	background-color: transparent;
}
.global-form_old_model .ticked-checkbox input.disabled-neutral+label::before,
.global-form .ticked-checkbox input.disabled-neutral+label::before {
	background-color: transparent;
}
.global-form_old_model .ticked-checkbox input:checked:disabled+label ,
.global-form .ticked-checkbox input:checked:disabled+label {
	background: #94989B;
	border-color: #94989B;
	cursor: not-allowed;
}
.global-form_old_model .ticked-checkbox input:checked:disabled+label::before,
.global-form .ticked-checkbox input:checked:disabled+label::before {
	-webkit-mask-image: url(./../../assets/icons/blocks/checked.svg);
	mask-image: url(./../../assets/icons/blocks/checked.svg);
	background-color: #555C5F;
}
.global-form_old_model .ticked-checkbox input:disabled:focus+label,
.global-form .ticked-checkbox input:disabled:focus+label {
	/* box-shadow: 0 0 0 2px #506FEE; */
	outline: 0px transparent;
	background-color: #94989B;
	border-color: #94989B;
}
.global-form_old_model .ticked-checkbox input:disabled:focus+label::before,
.global-form .ticked-checkbox input:disabled:focus+label::before {
	background-color: #555C5F;
}
.global-form_old_model .ticked-checkbox-field,
.global-form .ticked-checkbox-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 12px;
	max-width:100%;
	width:100%;
}
.global-form_old_model .ticked-checkbox-field .ticked-checkbox ,
.global-form .ticked-checkbox-field .ticked-checkbox {
    margin: 0;
}
.global-form_old_model .ticked-checkbox-field .field-error,
.global-form .ticked-checkbox-field .field-error {
    margin-top: 0;
}





/**=============================================**/
/**=================TICKED RADIO================**/
/**=============================================**/

.global-form .ticked-radio {
	display: flex;
	align-items: center;
	gap: 8px;
    margin-bottom:8px;
}

.global-form .ticked-radio .text-details,
.global-form .ticked-radio input~label {
	color: #0d0d0d;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
}

.global-form .ticked-radio .text-details {
	flex: 1 0 0;
}

.global-form .ticked-radio input~label {
	cursor: pointer;
	user-select: none;
}

.global-form .ticked-radio input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	pointer-events: none;
}

/* === BASE (cercul radio) — default size 24px === */
.global-form .ticked-radio input+label {
	width: 24px;
	height: 24px;
	min-width: 24px;
	border: 1px solid #555C5F;
	background: #fff;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: border-color 0.22s ease, background-color 0.22s ease;
	flex-shrink: 0;
	padding: 0;
	position: relative;
}

.global-form .ticked-radio input+label::before {
	content: "";
	position: absolute;
	width: 10px;
	height: 10px;
	border-radius: 999px;
	background-color: transparent;
	transition: background-color 0.2s ease;
}

/* === SMALL SIZE — 16px, border 1px (aceleasi stari ca default) === */
.global-form .ticked-radio.is-small input+label {
	width: 16px;
	height: 16px;
	min-width: 16px;
	border-width: 1px;
}

.global-form .ticked-radio.is-small input+label::before {
	width: 6px;
	height: 6px;
}

/* === CHECKED === */
.global-form .ticked-radio input:checked+label {
	border-color: #163FE8;
	background: #fff;
}

.global-form .ticked-radio input:checked+label::before {
	background-color: #163FE8;
}

/* === FOCUS (unchecked) === */
.global-form .ticked-radio input:focus+label {
	/* box-shadow: 0 0 0 2px #506FEE; */
	outline: 0px transparent;
	border-color: #555C5F;
}

/* === CHECKED + FOCUS === */
.global-form .ticked-radio input:checked:focus+label {
	/* box-shadow: 0 0 0 2px #506FEE; */
	outline: 0px transparent;
	border-color: #163FE8;
}

/* === ERROR === */
.global-form .ticked-radio input.has-error+label {
	border-color: #CE2500;
	background: #fff;
}

/* === ERROR + FOCUS === */
.global-form .ticked-radio input.has-error:focus+label {
	/* box-shadow: 0 0 0 2px #506FEE; */
	outline: 0px transparent;
	border-color: #CE2500;
}
.global-form .ticked-radio input.has-error:checked+label::before ,
.global-form .ticked-radio input.has-error:focus:checked+label::before {
    background-color: #CE2500;
}
/* === DISABLED === */
.global-form .ticked-radio input:disabled+label {
	background: #94989B;
	border-color: #94989B;
	opacity: 1;
	cursor: not-allowed;
	pointer-events: none;
}

/* === DISABLED + FOCUS === */
.global-form .ticked-radio input:disabled:focus+label {
	/* box-shadow: 0 0 0 2px #506FEE; */
	outline: 0px transparent;
	background-color: #94989B;
	border-color: #94989B;
}

/* === DISABLED + CHECKED === */
.global-form .ticked-radio input:checked:disabled+label {
	background: #94989B;
	border-color: #94989B;
}

.global-form .ticked-radio input:checked:disabled+label::before {
	background-color: #555C5F;
}

/* === DISABLED + CHECKED + FOCUS === */
.global-form .ticked-radio input:checked:disabled:focus+label {
	/* box-shadow: 0 0 0 2px #506FEE; */
	outline: 0px transparent;
	background-color: #94989B;
	border-color: #94989B;
}
.global-form .ticked-radio input+label {
	width: 24px;
	height: 24px;
	min-width: 24px;
}

.global-form .ticked-radio input+label::before {
	width: 10px;
	height: 10px;
}

.global-form .ticked-radio.is-small input+label {
	width: 16px;
	height: 16px;
	min-width: 16px;
}

.global-form .ticked-radio.is-small input+label::before {
	width: 6px;
	height: 6px;
}

.global-form .ticked-radio .text-details,
.global-form .ticked-radio input~label {
	margin-left: 0px;
	font-size: 16px;
}



/**================================================================**/
/**===ACCORDION + RADIO-BUTTONS-TYPE (Privacy Consents Pattern)====**/
/**================================================================**/


.global-form .accordion-wrapp {
	background: #F2F3F5;
	border: 1px solid #D3D5D6;
	border-radius: 8px;
	padding: 16px 20px;
	margin-bottom: 12px;
	cursor: pointer;
	position: relative;
}

.global-form .accordion-title {
	font-size: 14px;
	font-weight: 600;
	padding-right: 40px;
	position: relative;
	margin: 0;
	color: #0D0D0D;
}

.global-form .accordion-title::after {
	content: '';
	position: absolute;
	width: 14px;
	height: 2px;
	background: #0D0D0D;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	transition: transform 0.2s ease;
}

.global-form .accordion-title::before {
	content: '';
	position: absolute;
	width: 2px;
	height: 14px;
	background: #0D0D0D;
	top: 50%;
	right: 6px;
	transform: translateY(-50%);
	transition: transform 0.2s ease;
}

.global-form .accordion-desc {
	font-size: 13px;
	color: #555C5F;
	margin-top: 8px;
	margin-bottom: 0;
	line-height: 18px;
}

.global-form .radio-buttons-type {
	display: flex;
	gap: 12px;
	margin-bottom: 32px;
	margin-top: 12px;
}

.global-form .radio-buttons-type .radio {
	font-size: 14px;
	font-weight: 500;
	color: #0D0D0D;
	position: relative;
	display: flex;
	align-items: center;
}

.global-form .radio-buttons-type .radio input {
	display: none;
}

.global-form .radio-buttons-type .radio input+span {
	display: inline-block;
	padding: 10px 20px;
	border: 1px solid #0D0D0D;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
	transition: border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease;
	background: #FFF;
}

.global-form .radio-buttons-type .radio input+span::before,
.global-form .radio-buttons-type .radio input+span::after {
	display: none;
}

.global-form .radio-buttons-type .radio input:focus+span {
	/* box-shadow: 0 0 0 2px #506FEE; */
	outline: transparent;
	border-color: #163FE8;
}

.global-form .radio-buttons-type .radio input:checked+span {
	border-color: #000000;
	color: #ffffff;
	background: #000000;
}

.global-form .radio-buttons-type .radio input:disabled+span {
	opacity: 0.5;
	cursor: not-allowed;
	background: rgba(13, 13, 13, 0.10);
}










/**================================================================**/
/**===CALENDAR / DATEPICKER — jQuery UI Datepicker=================**/
/**================================================================**/


.global-form .date-filter {
	width: 100%;
	position: relative;
	display: flex;
	background: #FFF;
}

.global-form .date-filter:after {
	content: "";
	display: block;
	background-image: url(../images/calendar.svg);
	min-width: 24px;
	position: absolute;
	top: 12px;
	right: 16px;
	z-index: 0;
	height: 24px;
	pointer-events: none;
}

/* jQuery UI Datepicker — widget container */
.ui-datepicker .ui-state-disabled {
	cursor: default !important;
	pointer-events: none;
	opacity: 0.35;
}

.ui-datepicker {
	border-radius: 8px !important;
	overflow: hidden;
}

.ui-datepicker .ui-datepicker-title {
	display: flex !important;
	justify-content: center;
	align-items: center;
	gap: 8px;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	top: 0 !important;
}

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: 12px 12px !important;
}

.ui-datepicker .ui-datepicker-prev span {
	background-image: url(../images/small-left-arrow.svg) !important;
}

.ui-datepicker .ui-datepicker-next span {
	background-image: url(../images/small-right-arrow.svg) !important;
}

.ui-datepicker-calendar td a,
.ui-datepicker-calendar td span {
	display: block;
	text-align: center;
	border-radius: 8px;
	padding: 8px !important;
	box-sizing: border-box;
	line-height: normal;
	font-size: 13px;
}

.ui-datepicker-calendar td a.ui-state-hover {
	background: #163FE8;
}

.ui-datepicker-calendar td.ui-datepicker-today a:not(.ui-state-active):not(.ui-state-hover) {
	background: transparent;
	border-color: transparent;
	color: #0D0D0D;
}

.ui-datepicker-calendar td a.ui-state-active,
.ui-datepicker-calendar td a.ui-state-active.ui-state-hover {
	background: #163FE8;
	color: #FFF;
	border-color: #163FE8;
}

.ui-datepicker .dp-view-overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 5;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	padding: 1em;
	background: #FFF;
}

.ui-datepicker .dp-view-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1em;
	padding: .2em 0;
}

.ui-datepicker .dp-view-title {
	flex: 1 1 auto;
	text-align: center;
	font-size: 14px;
	font-weight: 700;
	color: #163FE8;
}

.ui-datepicker .dp-view-arrow {
	flex: 0 0 auto;
	width: 24px;
	height: 24px;
	padding: 0;
	border: none;
	cursor: pointer;
	font-size: 0;
	line-height: 0;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 5.732px 11.558px;
}

.ui-datepicker .dp-view-prev {
	background-image: url(../images/small-left-arrow.svg);
}

.ui-datepicker .dp-view-next {
	background-image: url(../images/small-right-arrow.svg);
}

.ui-datepicker .dp-view-grid {
	flex: 1 1 auto;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 6px;
	overflow-y: auto;
}

.ui-datepicker .dp-view-item {
	border: none;
	background: transparent;
	box-sizing: border-box;
	padding: 10px;
	border-radius: 8px;
	font-size: 14px;
	text-align: center;
	color: #0D0D0D;
	cursor: pointer;
	font-weight: 700;
}

.ui-datepicker .dp-view-item:not(:disabled):not(.is-selected):hover {
	background: #F3F5FE;
}

.ui-datepicker .dp-view-item.is-selected {
	background: #163FE8;
	color: #FFF;
}

.ui-datepicker .dp-view-item:disabled {
	color: #94989B;
	cursor: default;
}

.ui-datepicker .ui-datepicker-title .ui-datepicker-month,
.ui-datepicker .ui-datepicker-title .ui-datepicker-year {
	cursor: pointer;
	color: #163FE8;
	font-size: 14px;
	font-style: normal;
	font-weight: 700;
	line-height: 20px;
}

.ui-datepicker .ui-datepicker-title .ui-datepicker-month::after,
.ui-datepicker .ui-datepicker-title .ui-datepicker-year::after {
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	margin-left: 4px;
	vertical-align: middle;
	background: url(../images/arrow-down.svg) no-repeat center;
	background-size: contain;
}














/**================================================================**/
/**===========================CUSTOM SELECT =======================**/
/**================================================================**/

.global-form .custom-select-box:has(> label) {
	position: relative;
	border-radius: 8px;
	border: 1px solid #555C5F;
	background: #fff;
	width: 100%;
	box-sizing: border-box;
	height: 48px;
	transition: border-color 0.22s ease, box-shadow 0.22s ease;
}

.global-form .custom-select-box > label {
	position: absolute;
	left: 8px;
	font-size: 14px;
	pointer-events: none;
	color: #555C5F;
	transition: all 0.22s;
	top: 50%;
	transform: translateY(-50%);
	display: block;
}

.global-form .custom-select-box:has(> label) select {
	width: 100%;
	padding: 8px;
	box-sizing: border-box;
	border-radius: 8px;
	border: none;
	background: transparent;
	font-size: 14px;
	color: #0D0D0D;
	height: 48px;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	outline: none;
	max-width:100%;
}

.global-form .custom-select-box::before {
	content: "";
	position: absolute;
	right: 8px;
	top: 50%;
	transform: translateY(-15%);
	width: 10px;
	height: 10px;
	background-color: #555C5F;
	-webkit-mask-image: url("../icons/blocks/arrow-down.svg");
	mask-image: url("../icons/blocks/arrow-down.svg");
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	pointer-events: none;
	z-index: 1;
}

/* State classes */
.global-form .custom-select-box:has(> label):focus-within {
	border-color: #163FE8;
	box-shadow: 0 0 0 2px #506FEE;
}

.global-form .custom-select-box:has(> label):focus-within > label {
	/* color: #163FE8;
	opacity: 1;
	top: 12px;
    font-size: 12px;
    left: 14px; */
	
}

.global-form .custom-select-box:has(> label):focus-within select,
.global-form .custom-select-box:has(> label):has(select option:checked:not([hidden])) select {
    padding-top: 20px;
}

.global-form .custom-select-box:has(> label):has(select option:checked:not([hidden])) > label {
	/* completat: acelasi albastru ca la .is-focus (fara clase noi, doar din starea select-ului) */
	color: #163FE8;
	opacity: 1;
	top: 12px;
    font-size: 12px;
    left: 8px;
	
}

.global-form .custom-select-box:has(> label):hover {
	border-color: #163FE8;
}

.global-form .custom-select-box:has(> label):hover::before {
	background-color: #163FE8;
}

.global-form .custom-select-box:has(> label):focus-within::before {
	background-color: #163FE8;
}

.global-form .custom-select-box:has(> label):has(select:disabled) {
	background: rgba(13, 13, 13, 0.10);
	border-color: #555C5F;
}

.global-form .custom-select-box:has(> label):has(select:disabled) > label,
.global-form .custom-select-box:has(> label):has(select:disabled) select {
	color: #555C5F !important;
	opacity: 1 !important;
}

.global-form .custom-select-box:has(> label).has-error {
	border-color: #FF2E00;
}

.global-form .custom-select-box:has(> label).has-error > label {
	color: #FF2E00;
}

.global-form .custom-select-box:has(> label).has-error::before {
	background-color: #FF2E00;
}

/* Static state simulation — .is-hover */
.global-form .custom-select-box.is-hover:has(> label) {
	border-color: #163FE8;
}

/* Static state simulation — .is-focus */
.global-form .custom-select-box.is-focus:has(> label) {
	border-color: #163FE8;
}

.global-form .custom-select-box.is-focus:has(> label) > label {
	color: #163FE8 !important;
	top: 12px !important;
	font-size: 12px !important;
	left: 8px !important;
	opacity: 1 !important;
}

/**================================================================**/
/**===========================TEXTAREA ============================**/
/**================================================================**/

.global-form .textarea-box {
    position: relative;
    display: inline-block;
    width: 100%;
    transition: border-color 0.22s ease, box-shadow 0.22s ease, background-color 0.22s ease;
}

/* textarea element — styled as the actual control */
.global-form .textarea-box > textarea {
    width: 100%;
    padding: 20px 8px 32px 8px;
    border: 1px solid #555C5F;
    border-radius: 8px;
    background-color: #FFF;
    outline: none;
    color: #4E4E4E;
    font-family: "PingLCG", sans-serif;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    resize: none;
    box-sizing: border-box;
    min-height: 120px;
    transition: border-color 0.22s ease, box-shadow 0.22s ease;
    display: block;
	
}

.global-form .textarea-box > textarea.with_placeholder {
	padding-top:8px;
}
.global-form .textarea-box > textarea.with_placeholder::placeholder {
	color:inherit;
}
.global-form .textarea-box > textarea::placeholder {
    color: transparent;
}

/* label — floating, positioned absolutely over the textarea */
.global-form .textarea-box > label {
    position: absolute;
    top: 12px;
    left: 8px;
    pointer-events: none;
    transition: all 0.18s ease;
    color: #555C5F;
    font-family: "PingLCG", sans-serif;
    font-size: 16px;
    line-height: 24px;
    white-space: nowrap;
    z-index: 2;
}

/* label floats up on focus */
.global-form .textarea-box:focus-within > label {
    top: 8px;
    font-size: 12px;
    line-height: 14px;
    color: #163FE8;
}

/* label floats up when has content (not empty) */
.global-form .textarea-box:has(textarea:not(:placeholder-shown)) > label {
    top: 8px;
    font-size: 12px;
    line-height: 14px;
    color: #163FE8;
}

/* STATE: HOVER — border color changes */
.global-form .textarea-box.is-hover > textarea {
    border-color: #163FE8;
}

/* STATE: FOCUS — border color + box shadow */
.global-form .textarea-box.is-focus > textarea {
    border-color: #163FE8;
    box-shadow: 0 0 0 2px #506FEE;
}

/* TEXTAREA SIZE VARIANTS */
.global-form .textarea-box.is-default > textarea {
    min-height: 120px;
}

.global-form .textarea-box.is-medium > textarea {
    min-height: 240px;
}

.global-form .textarea-box.is-high > textarea {
    min-height: 300px;
}

/* STATE: DISABLED — background color, label + text = #555C5F */
.global-form .textarea-box.is-disabled > textarea {
    background-color: #94989B;
    border-color: #555C5F;
    color: #555C5F;
}

.global-form .textarea-box.is-disabled > label {
    color: #555C5F;
}

.global-form .textarea-box.is-disabled > textarea::placeholder {
    color: #555C5F;
}

/* STATE: DISABLED + FILLED — label floated + #555C5F (no blue), text + placeholder = #555C5F */
.global-form .textarea-box.is-disabled-filled > textarea {
    background-color: #94989B;
    border-color: #555C5F;
    color: #555C5F;
}

.global-form .textarea-box.is-disabled-filled > textarea::placeholder {
    color: #555C5F;
}

.global-form .textarea-box.is-disabled-filled > label {
    color: #555C5F !important;
    top: 8px;
    font-size: 12px;
    line-height: 14px;
}

/* STATE: ERROR — border color #CE2500, label color #CE2500 */
.global-form .textarea-box.is-error > textarea {
    border-color: #CE2500;
}

.global-form .textarea-box.is-error > label {
    color: #CE2500;
}

/* STATE: ERROR + FILLED — border #CE2500, label #555C5F (not blue), text #CE2500 */
.global-form .textarea-box.is-error-filled > textarea {
    border-color: #CE2500;
    color: #CE2500;
}

.global-form .textarea-box.is-error-filled > label {
    color: #555C5F !important;
    top: 8px;
    font-size: 12px;
    line-height: 14px;
}

/* Character counter — positioned bottom-right relative to textarea */
.global-form .char-counter {
    position: absolute;
    bottom: 8px;
    right: 8px;
    font-size: 11px;
    line-height: 14px;
    color: #555C5F;
    font-family: "PingLCG", sans-serif;
    font-weight: 400;
    pointer-events: none;
    z-index: 10;
}




/* ========================= FIELD WRAPPERS ================================================================================= */
/* ========================= Wrappers for Errors ============================================================================ */
/* ========================= Created a wrapper so that the error/ info / warning comes in this box  ========================= */

/* CUSTOM-SELECT-FIELD: wrapper pentru custom-select-box + error */
.global-form .custom-select-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 0px;
	width:100%;
	max-width:100%;
}
.global-form .custom-select-field.custom-select-width-min,
.global-form .custom-select-field.is-min {
	max-width:auto;
	width:auto;
}
.global-form .custom-select-field.custom-select-width-full,
.global-form .custom-select-field.is-full {
	max-width:100%;
}
.global-form .custom-select-field .custom-select-box {
    margin-bottom: 0;
}

.global-form .custom-select-field .field-error {
    margin-top: 0;
}

/* TEXTAREA-FIELD: wrapper pentru textarea-box + helper + error */
.global-form .textarea-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 20px;
	max-width:100%;
	width:100%;
}


/* TICKED-RADIO: individual radio button component styling */
/* TICKED-RADIO-FIELD: wrapper pentru ticked-radio + error */
.global-form .ticked-radio-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 12px;
}

.global-form .ticked-radio-field .ticked-radio {
    margin: 0;
}

.global-form .ticked-radio-field .field-error {
    margin-top: 0;
}

/* ACCORDION-RADIO-FIELD: wrapper pentru accordion-wrapp + radio-buttons-type grouped */
.global-form .accordion-radio-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 24px;
}

.global-form .accordion-radio-field .accordion-wrapp {
    margin-bottom: 0;
}

.global-form .accordion-radio-field .radio-buttons-type {
    margin-top: 12px;
    margin-bottom: 0;
}

/* DATEPICKER-FIELD: wrapper pentru date-filter + helper + error */
.global-form .datepicker-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 20px;
}

.global-form .datepicker-field .date-filter {
    margin-bottom: 0;
}

.global-form .datepicker-field .field-error {
    margin-top: 0;
}


/* Screen reader only content */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}


/* ========================= INFO POPOVER — TOOLTIP ========================= */

/* Anchor wrapper — positioning context for tooltip */
.info.tooltip .tooltip-anchor,
.global-form .tooltip-anchor {
	position: absolute;
	right: 0;
	top: 0;
	display: inline-flex;
	align-items: center;
	z-index: 1;
}
.info.tooltip .tooltip-anchor[aria-expanded="true"],
.info.tooltip.tooltip-open .tooltip-anchor,
.global-form .tooltip-anchor[aria-expanded="true"],
.global-form .input-box.tooltip-open .tooltip-anchor {
	z-index: 100;
}

/* Button trigger — no positioning, just styling */
.info.tooltip .tooltip-container,
.info.tooltip button.tooltip-container,
.global-form .tooltip-container,
.global-form button.tooltip-container {
	background: none !important;
	border: none !important;
	outline: none;
	padding: 0;
	cursor: pointer;
	width: 48px;
	height: 48px;
	flex-shrink: 0;
	aspect-ratio: 1/1;
	-webkit-appearance: none;
	appearance: none;
	display: flex;
    align-items: center;
    justify-content: center;
}

.info.tooltip .tooltip-container:focus-visible,
.info.tooltip button.tooltip-container:focus-visible {
	outline: 2px solid var(--button--bg-focus, #506FEE);
	outline-offset: 2px;
}
.info.tooltip .tooltip-container::before ,
.global-form .tooltip-container::before {
	content: "";
	display: flex;
	align-items: center;
	width: 48px;
	height: 48px;
	flex-shrink: 0;
	aspect-ratio: 1/1;
	background: url("../icons/blocks/info-tooltip.svg") no-repeat center;
	background-size: contain;
	pointer-events: none;
}

/* Tooltip card — absolute relativ la .tooltip-anchor */
.info.tooltip .tooltip-text ,
.global-form .tooltip-text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	position: absolute;
	width: 320px;
	max-width: calc(100vw - 32px);
	padding: 16px;
	border-radius: 16px;
	background: #f2f3f5;
	color: #0d0d0d;

	white-space: normal;
	word-break: break-word;
	box-sizing: border-box;
	opacity: 0;
	visibility: hidden;
	transition: 0.25s ease;
	z-index: 1;
}
.info.tooltip .tooltip-text::before,
.global-form .tooltip-text::before {
	content: "";
	position: absolute;
	display: block;
	width: 12px;
	height: 12px;
	background: inherit;
}
.info.tooltip .tooltip-close,
.global-form .tooltip-close {
	align-self: flex-start;
	background: url("../images/close-button.svg") no-repeat center;
	background-size: contain;
	border: none;
	cursor: pointer;
	padding: 0;
	width: 32px;
	height: 32px;
	color: transparent;
	-webkit-appearance: none;
	appearance: none;
}
.info.tooltip .tooltip-close.flex-end ,
.global-form .tooltip-close.flex-end {
	align-self: flex-end;
}
.info.tooltip .tooltip-close:hover ,
.global-form .tooltip-close:hover {
	opacity: 0.8;
}
.info.tooltip .tooltip-title,
.global-form .tooltip-title {
	color: #0d0d0d;
	font-size: 14px;
	font-weight: 700;
	line-height: 20px;
	margin-bottom: 4px;
	font-family: "PingLCG", sans-serif;
	margin-bottom:0px;
}
.info.tooltip h3.tooltip-title,
.global-form h3.tooltip-title { 
	margin-bottom:0px;
}
.info.tooltip .tooltip-message ,
.global-form .tooltip-message {
	color: #0d0d0d;
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
	font-family: "PingLCG", sans-serif;
}
.info.tooltip.tooltip-open .tooltip-text,
.global-form .input-box.tooltip.tooltip-open .tooltip-text {
	opacity: 1;
	visibility: visible;
	z-index: 1001;
}
.info.tooltip .tooltip-text.bg-white ,
.global-form .tooltip-text.bg-white {
	background: #FFFFFF;
}
.info.tooltip .tooltip-text.bg-gray ,
.global-form .tooltip-text.bg-gray {
	background: #f2f3f5;
}


/* ========================= TOOLTIP — 12 ARROW VARIANTE ========================= */
/* Notă: .tooltip-text e relativ la .tooltip-anchor (mic), NU la .input-box întreg */

/* top-left */
.global-form .tooltip-text[data-arrow="top-left"],
.info.tooltip .tooltip-text[data-arrow="top-left"] {
    bottom: calc(100% + 12px);
    left: 0;
    right: auto;
}

.global-form .tooltip-text[data-arrow="top-left"]::before,
.info.tooltip .tooltip-text[data-arrow="top-left"]::before {
    top: 100%;
    left: 16px;
    clip-path: polygon(50% 100%, 0% 0%, 100% 0%);
}


/* top-middle */
.global-form .tooltip-text[data-arrow="top-middle"],
.info.tooltip .tooltip-text[data-arrow="top-middle"] {
    bottom: calc(100% + 12px);
    left: 50%;
    transform: translateX(-50%);
    right: auto;
}

.global-form .tooltip-text[data-arrow="top-middle"]::before,
.info.tooltip .tooltip-text[data-arrow="top-middle"]::before {
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    clip-path: polygon(50% 100%, 0% 0%, 100% 0%);
}


/* top-right */
.global-form .tooltip-text[data-arrow="top-right"],
.info.tooltip .tooltip-text[data-arrow="top-right"] {
    bottom: calc(100% + 12px);
    right: 0;
    left: auto;
}

.global-form .tooltip-text[data-arrow="top-right"]::before,
.info.tooltip .tooltip-text[data-arrow="top-right"]::before {
    top: 100%;
    right: 16px;
    left: auto;
    clip-path: polygon(50% 100%, 0% 0%, 100% 0%);
}


/* right-top */
.global-form .tooltip-text[data-arrow="right-top"],
.info.tooltip .tooltip-text[data-arrow="right-top"] {
    left: calc(100% + 20px);
    top: 0;
    right: auto;
}

.global-form .tooltip-text[data-arrow="right-top"]::before,
.info.tooltip .tooltip-text[data-arrow="right-top"]::before {
    right: 100%;
    top: 16px;
    left: auto;
    clip-path: polygon(0% 50%, 100% 0%, 100% 100%);
}


/* right-middle */
.global-form .tooltip-text[data-arrow="right-middle"],
.info.tooltip .tooltip-text[data-arrow="right-middle"] {
    left: calc(100% + 20px);
    top: 50%;
    transform: translateY(-50%);
    right: auto;
}

.global-form .tooltip-text[data-arrow="right-middle"]::before,
.info.tooltip .tooltip-text[data-arrow="right-middle"]::before {
    right: 100%;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    clip-path: polygon(0% 50%, 100% 0%, 100% 100%);
}


/* right-bottom */
.global-form .tooltip-text[data-arrow="right-bottom"],
.info.tooltip .tooltip-text[data-arrow="right-bottom"] {
    left: calc(100% + 20px);
    bottom: 0;
    right: auto;
    top: auto;
}

.global-form .tooltip-text[data-arrow="right-bottom"]::before,
.info.tooltip .tooltip-text[data-arrow="right-bottom"]::before {
    right: 100%;
    bottom: 16px;
    top: auto;
    left: auto;
    clip-path: polygon(0% 50%, 100% 0%, 100% 100%);
}


/* bottom-left */
.global-form .tooltip-text[data-arrow="bottom-left"],
.info.tooltip .tooltip-text[data-arrow="bottom-left"] {
    top: calc(100% + 12px);
    left: 0;
    right: auto;
    bottom: auto;
}

.global-form .tooltip-text[data-arrow="bottom-left"]::before,
.info.tooltip .tooltip-text[data-arrow="bottom-left"]::before {
    bottom: 100%;
    left: 16px;
    top: auto;
    clip-path: polygon(50% 0%, 100% 100%, 0% 100%);
}


/* bottom-middle */
.global-form .tooltip-text[data-arrow="bottom-middle"],
.info.tooltip .tooltip-text[data-arrow="bottom-middle"] {
    top: calc(100% + 12px);
    left: 50%;
    transform: translateX(-50%);
    right: auto;
    bottom: auto;
}

.global-form .tooltip-text[data-arrow="bottom-middle"]::before,
.info.tooltip .tooltip-text[data-arrow="bottom-middle"]::before {
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    top: auto;
    clip-path: polygon(50% 0%, 100% 100%, 0% 100%);
}


/* bottom-right */
.global-form .tooltip-text[data-arrow="bottom-right"],
.info.tooltip .tooltip-text[data-arrow="bottom-right"] {
    top: calc(100% + 12px);
    right: 0;
    left: auto;
    bottom: auto;
}

.global-form .tooltip-text[data-arrow="bottom-right"]::before,
.info.tooltip .tooltip-text[data-arrow="bottom-right"]::before {
    bottom: 100%;
    right: 16px;
    left: auto;
    top: auto;
    clip-path: polygon(50% 0%, 100% 100%, 0% 100%);
}


/* left-top */
.global-form .tooltip-text[data-arrow="left-top"],
.info.tooltip .tooltip-text[data-arrow="left-top"] {
    right: calc(100% + 20px);
    top: 0;
    left: auto;
    bottom: auto;
}

.global-form .tooltip-text[data-arrow="left-top"]::before,
.info.tooltip .tooltip-text[data-arrow="left-top"]::before {
    left: 100%;
    top: 16px;
    right: auto;
    bottom: auto;
    clip-path: polygon(100% 50%, 0% 0%, 0% 100%);
}


/* left-middle */
.global-form .tooltip-text[data-arrow="left-middle"],
.info.tooltip .tooltip-text[data-arrow="left-middle"] {
    right: calc(100% + 20px);
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    bottom: auto;
}

.global-form .tooltip-text[data-arrow="left-middle"]::before,
.info.tooltip .tooltip-text[data-arrow="left-middle"]::before {
    left: 100%;
    top: 50%;
    transform: translateY(-50%);
    right: auto;
    bottom: auto;
    clip-path: polygon(100% 50%, 0% 0%, 0% 100%);
}


/* left-bottom */
.global-form .tooltip-text[data-arrow="left-bottom"],
.info.tooltip .tooltip-text[data-arrow="left-bottom"] {
    right: calc(100% + 20px);
    bottom: 0;
    left: auto;
    top: auto;
}

.global-form .tooltip-text[data-arrow="left-bottom"]::before,
.info.tooltip .tooltip-text[data-arrow="left-bottom"]::before {
    left: 100%;
    bottom: 16px;
    right: auto;
    top: auto;
    clip-path: polygon(100% 50%, 0% 0%, 0% 100%);
}



.global-form .tooltip-text[data-arrow="left-top"]::before,
.info.tooltip .tooltip-text[data-arrow="left-top"]::before,

.global-form .tooltip-text[data-arrow="left-middle"]::before,
.info.tooltip .tooltip-text[data-arrow="left-middle"]::before,

.global-form .tooltip-text[data-arrow="left-bottom"]::before,
.info.tooltip .tooltip-text[data-arrow="left-bottom"]::before,

.global-form .tooltip-text[data-arrow="right-top"]::before,
.info.tooltip .tooltip-text[data-arrow="right-top"]::before,

.global-form .tooltip-text[data-arrow="right-middle"]::before,
.info.tooltip .tooltip-text[data-arrow="right-middle"]::before,

.global-form .tooltip-text[data-arrow="right-bottom"]::before,
.info.tooltip .tooltip-text[data-arrow="right-bottom"]::before{
	width: 6px;
	height: 12px;
}







/**================================================================**/
/**===========================UPLOAD COMPONENT ====================**/
/**================================================================**/
.global-form .upload-wrapper {
    width: 100%;
}

.global-form .upload-title-wrapper {
    margin-bottom: 32px;
}

.global-form .upload-title-wrapper .upload-title {
    font-size: 20px;
    font-weight: 600;
    color: #0D0D0D;
    margin-bottom: 8px;
}

.global-form .upload-title-wrapper .upload-subtitle {
    font-size: 14px;
    color: #555C5F;
    line-height: 1.5;
}

.global-form .upload-documents-wrapper {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 32px;
}

.global-form .upload-doc-label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #0D0D0D;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.global-form .upload-container {
    position: relative;
    width: 100%;
    border: 1px dashed #163FE8;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #0D0D0D;
    font-size: 32px;
    background-color: #F3F5FE;
    margin-bottom: 10px;
    border-radius: 8px;
    padding: 24px 20px;
    box-sizing: border-box;
    cursor: pointer;
    transition: all 0.2s ease;
    min-height:200px;
}
.global-form .upload-container.upload-container_h100 {
    min-height:100px;
}

.global-form .upload-container:hover {
    border-color: #0D52D4;
    background-color: #E8ECFF;
}

.global-form .upload-container.active {
    background-color: rgba(192, 192, 192, 0.2);
    border-color: #0D52D4;
}

.global-form .upload-container strong {
    font-weight: 700;
    margin-bottom: 20px;
    display: block;
    font-size: 64px;
}
.global-form .w600 {
    max-width:600px;
}
.global-form .w400 {
    max-width:400px;
}
.global-form .upload-container span {
    margin-bottom: 0px;
    display: inline;
}

.global-form .upload-inside {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
}

.global-form .upload-content {
    display: flex;
    flex-direction: column;
    /* align-items: flex-start; */
    gap: 16px;
}

.global-form .upload-file {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    cursor: pointer;
    opacity: 0;
}

.global-form .files-container {
    display: block;
    width: 100%;
    margin-top: 32px;
    margin-bottom: 32px;
}

.global-form .file-container {
    display: inline-block;
    width: 24%;
    min-width: 400px;
    height: 400px;
    margin-bottom: 20px;
    position: relative;
}

.global-form .file-container:not(:nth-child(3n)) {
    margin-right: 2%;
}

.global-form .file-container:after {
    content: "✕";
    position: absolute;
    line-height: 400px;
    font-size: 60px;
    margin: auto;
    top: 0;
    right: 0;
    left: 0;
    text-align: center;
    font-weight: bold;
    color: #FAFAFA;
    background-color: rgba(0, 0, 0, 0.4);
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
    cursor: pointer;
}

.global-form .file-container:hover:after {
    opacity: 1;
}

.global-form .file {
    object-fit: contain;
    width: 100%;
    height: 100%;
}

/* Progress container: shown during/after upload */
.global-form .progress-container {
    width: 100%;
    padding: 16px;
    margin-bottom: 26px;
    background-color: #F5F5F5;
    border-radius: 8px;
    border-left: 0px solid #F3F5FE;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding:14px 12px;
    box-sizing:border-box;
}
.global-form .progress-wrapper {
	width:100%;
}
.global-form .progress-status {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
    padding-right:16px;
    box-sizing:border-box;
}

.global-form .progress-percentage {
    font-size: 12px;
    font-weight: 400;
    color: #0D0D0D;
}

.global-form .progress-bar {
    width: 100%;
    height: 4px;
    background-color: #fff;
    border-radius: 45px;
    overflow: hidden;
}

.global-form .progress-bar-fill {
    height: 100%;
    background-color: #163FE8;
    width: 0%;
    transition: width 0.1s ease;
    animation: progressGradient 1.5s ease-in-out infinite;
}

@keyframes progressGradient {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

.global-form .progress-container.is-complete {
    background-color: #F3F5FE;
}

.global-form .progress-container.is-complete .progress-bar-fill {
    background-color: #163FE8;
    width: 100%;
}

.global-form .progress-container.is-error {
    background-color:#FFEAE5;
}

.global-form .progress-container.is-error .progress-bar-fill {
    background-color: #CE2500;
    width: 60%;
}

.global-form .progress-container.is-error .progress-percentage {
    color: #CE2500;
}

.global-form .file-details {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}

.global-form .file-info {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
}

.global-form .file-icon {
    width: 28px;
    height: 28px;
    background-color: #0D0D0D;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

.global-form .file-icon.icon-file-pdf {
    -webkit-mask-image: url(../images/default-file.svg);
    mask-image: url(../images/default-file.svg);
}

.global-form .file-icon.icon-file-png {
    -webkit-mask-image: url(../images/default-file.svg);
    mask-image: url(../images/default-file.svg);
}

.global-form .file-icon.icon-file-jpg {
    -webkit-mask-image: url(../images/default-file.svg);
    mask-image: url(../images/default-file.svg);
}

.global-form .file-icon.icon-file-jpeg {
    -webkit-mask-image: url(../images/default-file.svg);
    mask-image: url(../images/default-file.svg);
}

.global-form .file-icon.icon-file-xls {
    -webkit-mask-image: url(../images/default-file.svg);
    mask-image: url(../images/default-file.svg);
}

.global-form .file-icon.icon-file-xlsx {
    -webkit-mask-image: url(../images/default-file.svg);
    mask-image: url(../images/default-file.svg);
}

.global-form .file-icon.icon-file-default {
    -webkit-mask-image: url(../images/default-file.svg);
    mask-image: url(../images/default-file.svg);
}
.global-form .file-icon.icon-file-docx {
    -webkit-mask-image: url(../images/default-file.svg);
    mask-image: url(../images/default-file.svg);
}
.global-form .file-icon.icon-file-doc {
    -webkit-mask-image: url(../images/default-file.svg);
    mask-image: url(../images/default-file.svg);
}


.global-form .trash-icon {
    width: 30px;
    height: 30px;
    background-color: #0D0D0D;
    -webkit-mask-image: url(../icons/blocks/trash.svg);
    mask-image: url(../icons/blocks/trash.svg);

    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

.global-form .file-info span {
    font-size: 12px;
    color: #0D0D0D;
    font-weight: 400;
    font-family: "PingLCG", sans-serif;
}

.global-form .file-remove-button {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    border: none;
    border:0px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
}



.global-form .icon-upload {
    width: 48px;
    height: 48px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="%23163FE8"><path d="M24 8v20M14 22l10-10 10 10M38 38H10" stroke="%23163FE8" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat center;
    background-size: contain;
}

.global-form .upload-icon-title {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.global-form .upload-icon-title.camera,
.global-form .upload-icon-title.upload {
    align-items:center;
    min-height:44px;
}
.global-form .upload-icon-title.camera .bigger_text ,
.global-form .upload-icon-title.upload .bigger_text {
    margin-bottom:0px;
}

.global-form .upload-form-title {
    font-size: 16px;
    font-weight: 600;
    color: #0D0D0D;
}

.global-form .upload-form-title .bigger_text b {
    font-weight:700;
}
.global-form .upload-form-title .bigger_text {
    font-size:16px;
    font-weight:400;
    line-height:24px;
    color:#0D0D0D;
    margin-bottom:8px;
}
.global-form .upload-form-title.smaller_text_paragraph *:not(.bigger_text),
.global-form .upload-form-title .smaller_text {
    color:#4E4E4E;
    font-size:14px;
    font-weight:400;
    line-height:18px;
	font-style:normal !important;;
}

.global-form .upload-form-text {
    font-size: 13px;
    color: #555C5F;
    line-height: 1.4;
}

/* ==========================================================================
   ERROR MESSAGE — icon with mask
   ========================================================================== */
.global-form .error-message {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px;
    background-color: #FCF0ED;
    border: 1px solid #CE2500;
    border-radius: 8px;
    margin-top: 12px;
}
.global-form .error-message span * {
	font-size:inherit;
}
.global-form .error-message span p:last-child {margin-bottom:0px;}
.global-form .error-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    background-color: #CE2500;
    -webkit-mask-image: url(../icons/blocks/info-error-ico.svg);
    mask-image: url(../icons/blocks/info-error-ico.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

.global-form .error-message span {
    font-size: 13px;
    color: #CE2500;
    padding-top:2px;
    line-height: 1.5;
}

/* Retry button */
.global-form .retry-button {
    flex-shrink: 0;
    padding: 8px 16px;
    background-color: #163FE8;
    color: #FFFFFF;
    border: none;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.global-form .retry-button:hover {
    background-color: #0D52D4;
}

.global-form .retry-button:active {
    background-color: #0D3BA3;
}

.global-form .retry-button:focus {
    outline: 2px solid #163FE8;
    outline-offset: 2px;
}

/* Uploaded files title */
.global-form .upload-files-slot  {
	flex-direction:column;
}
.global-form .upload-files-slot > .files-title {
    display: none;
    font-size: 16px;
    padding-top:16px;
    margin-bottom:4px;
}

.global-form .upload-files-slot > .files-title.has-files {
    display: block;
}
.global-form .upload-slot  {
	max-width:100%;
	width:100%;
}
.global-form .upload-slot h3 {
    font-size:16px;
    color:#0D0D0D;
    font-weight:400;
    line-height:24px;
    font-family: "PingLCG", sans-serif;
    margin-bottom:0px;
}
.global-form .upload-inside:before {
	display:none;
}




/* ========================= FILE UPLOAD B2B — copiată din global-forms.css ========================= */
.global-form .form__container {
    position: relative;
    width: 100%;
    border: 1px dashed #163FE8;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    color: #0D0D0D;
    font-size: 32px;
    background-color: #F3F5FE;
    margin-bottom: 10px;
    border-radius: 8px;
    padding: 16px 12px;
    box-sizing: border-box;
    cursor: pointer;
    transition: all 0.2s ease;
    min-height: 200px;
}

.global-form .form__container.form__container_300w {
    max-width:320px;
}

.global-form .form__container strong {
    font-weight: 700;
    margin-bottom: 20px;
    display: block;
    font-size: 64px;
}

.global-form .form__container span {
    margin-bottom: 0px;
    display: block;
}

.global-form .upload-inside {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.global-form .form__container.active {
    background-color: rgba(192, 192, 192, 0.2);
}

.global-form .form__file {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    cursor: pointer;
    opacity: 0;
}

.global-form .form__files-container {
    display: block;
    width: 100%;
    margin-top: 32px;
    margin-bottom: 22px;
}

.global-form .form__files-container.b2b {
    margin-top: 32px;
}

.global-form .form__files-container.b2b .form__progress-container {
    margin-bottom: 16px;
}

.global-form .form__progress-container {
    display: flex;
    flex-direction: column;
    padding: 32px;
    background: #FAFAFA;
    border-radius: 16px;
    border: 2px solid #D3D5D6;
    gap: 32px;
}

.global-form .form__progress-bar-fill {
    height: 12px;
    border-radius: 20px;
    background-color: #163EE3;
    transition: width 0.3s linear;
}

.global-form .form__file-details {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 2px solid #D3D5D6;
    padding-top: 16px;
}

.global-form .form__file-info {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 32px;
}

.global-form .form__file-icon {
    width: 48px;
    height: 48px;
    object-fit: contain;
    display: block;
}

.global-form .form__file-remove-button {
    background-color: transparent;
    border: none;
    color: #0D0D0D;
    font-size: 32px;
    font-weight: 550;
    cursor: pointer;
    padding: 8px 16px;
    transition: color 0.2s ease;
    font-family: "Ping L";
}

.global-form .form__file-remove-button:hover {
    color: #ff0000;
}

.global-form .form__progress-status {
    font-weight: bold;
    margin-bottom: 10px;
    font-size: 28px;
}




/* ========================= PHONE INPUT (ITI) — UNIFICAT ========================= */
.global-form .input-box.has-iti,
.global-form .input-box:has(.dual-input-wrapper) {
	border: none;
	background: transparent;
	padding: 0;
}

.global-form .dual-input-wrapper {
	display: flex;
	align-items: stretch;
	gap: 0;
	align-self: stretch;
	width: 100%;

	/* BORDER UNIFICAT pe wrapper exterior */
	border: 2px solid #94989B;
	border-radius: 16px;
	background: #fff;
	box-sizing: border-box;
	transition: border-color 0.15s ease;
}

/* Focus-within — border albastru pe ÎNTREG wrapper */
.global-form .dual-input-wrapper:focus-within {
	border-color: #163FE8;
}

/* Error state — border roșu */
.global-form .input-box.has-error .dual-input-wrapper {
	border-color: #ff2e00;
}

/* Disabled state — fundal gri pe tot wrapper-ul */
.global-form .input-box:has(input:disabled) .dual-input-wrapper {
	background-color: #f2f3f5;
	border-color: #D0D4D9;
	opacity: 0.6;
}

.global-form .iti-border-box {
	flex-shrink: 0;
	border: none;
	border-radius: 16px 0 0 16px;
	background: transparent;
	box-sizing: border-box;
	height: 96px;
	display: flex;
	align-items: center;
	padding: 0 9px 0 0;
}

.global-form .iti-border-box .iti {
	display: flex;
	align-items: center;
	height: 100%;
	position: relative;
}

.global-form .iti-border-box .iti__flag-container {
	position: static;
	display: flex;
	align-items: center;
	padding: 0;
	height: 100%;
	cursor: pointer;
}

.global-form .hidden-iti-input {
	position: absolute;
	width: 0;
	height: 0;
	opacity: 0;
	pointer-events: none;
	border: none;
	padding: 0;
}

.global-form .main-input-border-box {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--spacing-4, 4px);
	flex: 1 0 0;
	position: relative;
	border: none;
	border-radius: 0 16px 16px 0;
	background: transparent;
	box-sizing: border-box;
}

.global-form .main-input-border-box input[type="tel"] {
	width: 100%;
	padding: 13px 0 0;
	height: 48px;
	background: transparent;
	border: none;
	border-radius: 0;
	box-sizing: border-box;
}

/* Disabled input text */
.global-form .input-box:has(input:disabled) .main-input-border-box input[type="tel"] {
	color: #8A9094;
	cursor: not-allowed;
}

/* Disabled label */
.global-form .input-box:has(input:disabled) label {
	color: #8A9094;
	opacity: 0.6;
}

/* Phone Input — label positioning (no left padding, sit over .main-input-border-box) */
.global-form .input-box.iti-phone-field label {
	left: 0px;
}


/* ========================= PHONE INPUT STATE SIMULATION CLASSES ========================= */
/* .is-hover — hover state for Phone Input */
.global-form .input-box.iti-phone-field.is-hover .dual-input-wrapper {
	border-color: var(--input--border-active, #163FE8);
}

.global-form .input-box.iti-phone-field.is-hover .main-input-border-box input::placeholder {
	color: var(--input--label, #555C5F);
}

/* .is-focus — focus state for Phone Input */
.global-form .input-box.iti-phone-field.is-focus .dual-input-wrapper {
	border-color: var(--input--border-active, #163FE8);
	box-shadow: 0 0 0 2px var(--input--focus-ring, #506FEE);
}

.global-form .input-box.iti-phone-field.is-focus .main-input-border-box input::placeholder {
	color: var(--input--label, #555C5F);
}

/* .is-filled — filled state for Phone Input (label raised naturally) */
/* (inherits default + label raised via :not(:placeholder-shown)) */

/* .is-disabled — disabled state for Phone Input */
.global-form .input-box.iti-phone-field.is-disabled .dual-input-wrapper {
	background: var(--input--disabled-bg, rgba(13,13,13,.10));
	border-color: var(--input--border, #555C5F);
	box-shadow: none;
	pointer-events: none;
	opacity: 0.6;
}

.global-form .input-box.iti-phone-field.is-disabled label,
.global-form .input-box.iti-phone-field.is-disabled .main-input-border-box input {
	color: var(--input--disabled-fg, #555C5F);
	cursor: not-allowed;
}

/* .is-disabled-filled — disabled + filled for Phone Input */
.global-form .input-box.iti-phone-field.is-disabled-filled .dual-input-wrapper {
	background: var(--input--disabled-bg, rgba(13,13,13,.10));
	border-color: var(--input--border, #555C5F);
	box-shadow: none;
	pointer-events: none;
	opacity: 0.6;
}

.global-form .input-box.iti-phone-field.is-disabled-filled label,
.global-form .input-box.iti-phone-field.is-disabled-filled .main-input-border-box input {
	color: var(--input--disabled-fg, #555C5F);
	cursor: not-allowed;
}

/* .is-error — error state for Phone Input */
.global-form .input-box.iti-phone-field.is-error .dual-input-wrapper {
	border-color: var(--input--error, #CE2500);
	box-shadow: none;
}

.global-form .input-box.iti-phone-field.is-error label {
	color: var(--input--error, #CE2500);
}

/* .is-error-filled — error + filled for Phone Input */
.global-form .input-box.iti-phone-field.is-error-filled .dual-input-wrapper {
	border-color: var(--input--error, #CE2500);
	box-shadow: none;
}

.global-form .input-box.iti-phone-field.is-error-filled label {
	color: var(--input--label-up-filled, #4E4E4E);
}

.global-form .iti-border-box .iti__arrow {
	order: 1;
	margin: 0;
	width: 16px;
	height: 16px;
	border: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8.00099 11.1999C7.53432 11.1999 7.06766 11.0199 6.71432 10.6666L2.36766 6.31993C2.17432 6.12659 2.17432 5.8066 2.36766 5.61326C2.56099 5.41993 2.88099 5.41993 3.07432 5.61326L7.42099 9.95993C7.74099 10.2799 8.26099 10.2799 8.58099 9.95993L12.9277 5.61326C13.121 5.41993 13.441 5.41993 13.6343 5.61326C13.8277 5.8066 13.8277 6.12659 13.6343 6.31993L9.28766 10.6666C8.93432 11.0199 8.46766 11.1999 8.00099 11.1999Z' fill='%23555C5F'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 16px 16px;
}


/* ========================= ITI DROPDOWN CONTAINER (rendered in document.body) ========================= */
.iti--container {
	z-index: 99999;
}

.iti--container .iti__dropdown-content {
	border: 1px solid rgba(13, 13, 13, 0.10);
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 12px 32px rgba(13, 13, 13, 0.14);
	overflow: hidden;
}

.iti--container .iti__search-input {
	box-sizing: border-box;
	margin: 8px;
	width: calc(100% - 16px);
	padding: 10px 14px 10px 38px;
	border: 1px solid rgba(13, 13, 13, 0.15);
	border-radius: 8px;
	font-size: 14px;
	line-height: 20px;
	color: #0D0D0D;
	outline: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M7.333 12.667A5.333 5.333 0 1 0 7.333 2a5.333 5.333 0 0 0 0 10.667ZM14 14l-2.9-2.9' stroke='%23555C5F' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: 14px center;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.iti--container .iti__search-input::placeholder {
	color: #8A9094;
}

.iti--container .iti__search-input:focus {
	border-color: #163FE8;
	box-shadow: 0 0 0 3px rgba(22, 63, 232, 0.12);
}

.iti--container .iti__country {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px;
	font-size: 14px;
	color: #0D0D0D;
	transition: background-color 0.15s ease;
}

.iti--container .iti__country.iti__highlight,
.iti--container .iti__country:hover {
	background-color: rgba(22, 63, 232, 0.08);
}

.iti--container .iti__flag {
	width: var(--iti-flag-width, 16px) !important;
	height: var(--iti-flag-height, 12px) !important;
	background-size: var(--iti-flag-sprite-width, 3904px) var(--iti-flag-sprite-height, 12px) !important;
	background-repeat: no-repeat !important;
	box-sizing: content-box !important;
	flex: none !important;
	min-width: 0 !important;
	max-width: none !important;
}

.iti--container .iti__dial-code {
	color: #8A9094;
}

.iti--container .iti__arrow {
	order: 1;
	margin: 0;
	width: 16px;
	height: 16px;
	border: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8.00099 11.1999C7.53432 11.1999 7.06766 11.0199 6.71432 10.6666L2.36766 6.31993C2.17432 6.12659 2.17432 5.8066 2.36766 5.61326C2.56099 5.41993 2.88099 5.41993 3.07432 5.61326L7.42099 9.95993C7.74099 10.2799 8.26099 10.2799 8.58099 9.95993L12.9277 5.61326C13.121 5.41993 13.441 5.41993 13.6343 5.61326C13.8277 5.8066 13.8277 6.12659 13.6343 6.31993L9.28766 10.6666C8.93432 11.0199 8.46766 11.1999 8.00099 11.1999Z' fill='%23555C5F'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 16px 16px;
}

.iti--container .iti__arrow.iti__arrow--up {
	transform: rotate(180deg);
}

.iti--container .iti__arrow:last-of-type {
	display: none !important;
}


/* ========================= FORM SELECT — accessible native <select> with floating label ========================= */
.global-form .form-select {
    position: relative;
    width: 100%;
    height: var(--input--height, 48px);
    box-sizing: border-box;
    border: var(--input--border-w, 1px) solid var(--input--border, #555C5F);
    border-radius: var(--input--radius, 8px);
    background: var(--input--bg, #FFF);
    padding: var(--input--pad, 8px);
    transition: border-color .15s ease, box-shadow .15s ease;
}

.global-form .form-select:hover {
    border-color: var(--input--border-active, #163FE8);
}

.global-form .form-select:focus-within {
    border-color: var(--input--border-active, #163FE8);
    box-shadow: 0 0 0 2px var(--input--focus-ring, #506FEE);
}

.global-form .form-select.has-error {
    border-color: var(--input--error, #CE2500);
    box-shadow: none;
}

.global-form .form-select:has(> select:disabled) {
    background: var(--input--disabled-bg, rgba(13,13,13,.10));
    border-color: var(--input--border, #555C5F);
    box-shadow: none;
}

.global-form .form-select > label {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: var(--input--pad, 8px);
    pointer-events: none;
    transition: all .18s ease;
    color: var(--input--label, #555C5F);
    font-family: var(--input--font, "PingLCG"), sans-serif;
    font-size: var(--input--label-size, 16px);
    line-height: var(--input--label-lh, 24px);
    white-space: nowrap;
}

.global-form .form-select:focus-within > label {
    top: var(--input--pad, 8px);
    transform: translateY(0);
    font-size: var(--input--label-up-size, 12px);
    line-height: var(--input--label-up-lh, 14px);
    color: var(--input--label-up, #163FE8);
}

.global-form .form-select:has(> select:not([value=""]):not([value=null])) > label {
    top: var(--input--pad, 8px);
    transform: translateY(0);
    font-size: var(--input--label-up-size, 12px);
    line-height: var(--input--label-up-lh, 14px);
}

.global-form .form-select:has(> select:not([value=""]):not([value=null])):not(:focus-within) > label {
    color: var(--input--label-up-filled, #4E4E4E);
}

.global-form .form-select:has(> select:disabled) > label {
    color: var(--input--disabled-fg, #555C5F);
}

.global-form .form-select.has-error > label {
    color: var(--input--error, #CE2500);
}

.global-form .form-select > select {
    position: absolute;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border: none;
    background: transparent;
    padding: 0;
    outline: none;
    color: var(--input--text, #0D0D0D);
    font-family: var(--input--font, "PingLCG"), sans-serif;
    font-size: var(--input--text-size, 14px);
    line-height: var(--input--text-lh, 20px);
    cursor: pointer;
    z-index: 1;
}

.global-form .form-select > select:disabled {
    color: var(--input--disabled-fg, #555C5F);
    cursor: not-allowed;
}

.global-form .form-select > .form-select__arrow {
    position: absolute;
    top: 50%;
    right: var(--input--pad, 8px);
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    pointer-events: none;
    background-color: var(--input--icon, #555C5F);
    -webkit-mask-image: url(../icons/blocks/arrow-down.svg);
    mask-image: url(../icons/blocks/arrow-down.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    z-index: 0;
}

.global-form .form-select:focus-within > .form-select__arrow {
    background-color: var(--input--icon-active, #0D0D0D);
}

.global-form .form-select:has(> select:not([value=""]):not([value=null])) > .form-select__arrow {
    background-color: var(--input--icon-active, #0D0D0D);
}

.global-form .form-select.has-error > .form-select__arrow {
    background-color: var(--input--error, #CE2500);
}

.global-form .form-select:has(> select:disabled) > .form-select__arrow {
    background-color: var(--input--disabled-fg, #555C5F);
}

.global-form .form-select + .form-select__helper {
    display: block;
    margin-top: 6px;
    font-size: var(--input--helper-size, 12px);
    line-height: var(--input--helper-lh, 14px);
    color: var(--input--helper, #4E4E4E);
}

.global-form .form-select + .form-select__error {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
    font-size: var(--input--helper-size, 12px);
    line-height: var(--input--helper-lh, 14px);
    color: var(--input--error, #CE2500);
}

.global-form .form-select + .form-select__error::before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    background-color: var(--input--error, #CE2500);
    -webkit-mask-image: url(../icons/blocks/info-error-ico.svg);
    mask-image: url(../icons/blocks/info-error-ico.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

.global-form .form-select.has-error + .form-select__helper {
    display: none;
}

.global-form .form-select.is-hover {
    border-color: var(--input--border-active, #163FE8);
}

.global-form .form-select.is-focus {
    border-color: var(--input--border-active, #163FE8);
    box-shadow: 0 0 0 2px var(--input--focus-ring, #506FEE);
}

.global-form .form-select.is-focus > label {
    top: var(--input--pad, 8px);
    transform: translateY(0);
    font-size: var(--input--label-up-size, 12px);
    line-height: var(--input--label-up-lh, 14px);
    color: var(--input--label-up, #163FE8);
}

.global-form .form-select.is-disabled {
    background: var(--input--disabled-bg, rgba(13,13,13,.10));
    border-color: var(--input--border, #555C5F);
    box-shadow: none;
}

.global-form .form-select.is-disabled > select,
.global-form .form-select.is-disabled > label {
    color: var(--input--disabled-fg, #555C5F);
    cursor: not-allowed;
}





/**================================================================**/
/**===================SIGNATURE CANVAS ============================**/
/**================================================================**/


.global-form .signature .sig-canvas {
    border-radius: 8px;
    border: 1px dashed #163FE8;
    background: #F3F5FE;
    cursor: crosshair;
    display: block;
    width: 100%;
    max-width: 100%;
    height: 300px;
    box-sizing: border-box;
    touch-action: none;
}

.global-form .signature p {
    margin: 0;
}

.global-form .signature-edit {
    position: relative;
}

.global-form .buttons-signature {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 40px;
    gap: 16px;
}

.global-form .buttons-signature .btn-confirm {
    width: 189px;
    font-weight:700;
}

.global-form .buttons-signature .btn-clear {
    min-width: auto;
    color: #FF2E00;
    font-weight:700;
}

.global-form .buttons-signature .btn-clear:hover {
    color: #FFFFFF;
    background-color: #FF2E00 !important;
    border-color: #FF2E00 !important;
}

.global-form .signature-noedit {
    display: none;
}

.global-form .signature-noedit.active {
    display: flex;
    border-radius: 8px;
    /* border: 1px dashed #163FE8; */
    /* background: #F3F5FE; */
    padding: 16px;
    box-sizing: border-box;
    height: 300px;
    align-items: center;
    justify-content: center;
}

.global-form .signature-noedit .sig-image {
    display: none;
    width: 100%;
    height: auto;
    max-width: 100%;
}

.global-form .signature-noedit.active .sig-image {
    display: block;
}













/* ========================= 4K / ultra-wide (min-width: 3001px) ========================= */
@media only screen and (min-width: 3001px) {
	/* :root {
		--input--radius: 16px;
		--input--pad: 16px;
		--input--height: 96px;
		--input--gap: 16px;
		--input--border-w: 2px;
		--input--label-size: 32px;
		--input--label-lh: 48px;
		--input--label-up-size: 24px;
		--input--label-up-lh: 28px;
		--input--text-size: 28px;
		--input--text-lh: 40px;
		--input--helper-size: 24px;
		--input--helper-lh: 28px;
	}
	.global-form_old_model .side-panel,
	.global-form .side-panel {
		width:1020px;
	}
	.global-form .input-box input { padding: 26px 0 0; }
	.global-form .input-box label { left: 16px; }

	.global-form .input-box.icon-before::before,
	.global-form .input-box.icon-after::after { width: 48px; height: 48px; }

	.global-form .input-box.icon-before label { left: 80px; }

	.global-form .input-box input:focus + label,
	.global-form .input-box input:not(:placeholder-shown) + label { top: 12px; }

	.global-form .field-error::before,
	.global-form .input-box-error::before { width: 48px; height: 48px; }

	.global-form .date-personale-wrapper { gap: 48px; margin-bottom: 32px; }
	.info.tooltip .tooltip-close.flex-end ,
	.global-form .tooltip-close.flex-end {
		align-self: flex-end;
	}

	.global-form .textarea-box.is-default > textarea,
	.global-form .textarea-box > textarea {
		padding: 16px;
		font-size: 28px;
		line-height: 40px;
		min-height: 240px;
	}

	.global-form .textarea-box > label {
		top: 32px;
		left: 16px;
		font-size: 32px;
		line-height: 48px;
	}

	.global-form .textarea-box:focus-within > label,
	.global-form .textarea-box:has(textarea:not(:placeholder-shown)) > label {
		top: 16px;
		left: 16px;
		font-size: 24px;
		line-height: 28px;
	}

	.global-form .textarea-box:focus-within > textarea,
	.global-form .textarea-box:has(textarea:not(:placeholder-shown)) > textarea {
		padding-top: 40px;
	}
	.global-form .textarea-box:focus-within > textarea.with_placeholder, 
	.global-form .textarea-box:has(textarea:not(:placeholder-shown)) > textarea.with_placeholder{
		padding-top: 12px;
	}
	.global-form .char-counter {
		font-size:20px;
		bottom:16px;
		right:16px;
	}
	.global-form .textarea-box.is-focus > textarea {
		padding-top: 40px;
	}

	.global-form .textarea-box .textarea-counter {
		font-size: 24px;
		line-height: 28px;
		padding: 8px 0;
	}

	.global-form .form-select {
		height: var(--input--height, 96px);
		padding: var(--input--pad, 16px);
	}

	.global-form .form-select > label {
		font-size: var(--input--label-size, 32px);
		line-height: var(--input--label-lh, 48px);
	}

	.global-form .form-select:focus-within > label,
	.global-form .form-select:has(> select:not([value=""]):not([value=null])) > label {
		font-size: var(--input--label-up-size, 24px);
		line-height: var(--input--label-up-lh, 28px);
	}

	.global-form .form-select > .form-select__arrow {
		width: 48px;
		height: 48px;
	}

	.global-form .form-select + .form-select__error::before {
		width: 48px;
		height: 48px;
	}

	.info.tooltip .tooltip-anchor ,
	.global-form .tooltip-anchor {
		top: 25%;
		right: 20px;
		padding: 0;
	}
	.info.tooltip .tooltip-message ,
	.global-form .tooltip-message {
		color: #0d0d0d;
		font-size: 28px;
		font-weight: 400;
		line-height: 40px;
	}
	.info.tooltip .tooltip-message *,
	.global-form .tooltip-message * {
		font-size:inherit;
		line-height:inherit;
		font-weight:inherit;
	}
	.info.tooltip .tooltip-title,
	.global-form .tooltip-title {
		font-size: 32px !important;;
		line-height: 1.2;
	}
	.info.tooltip .tooltip-text,
	.global-form .tooltip-text {
		width: 560px;
	}
	.info.tooltip .tooltip-text::before, 
	.global-form .tooltip-text::before {
		width:18px;
		height:18px;
	}
	.global-form .state-item .field-error,
	.global-form .state-item .field-info,
	.global-form .state-item .field-warning {
		margin-top: 8px;
		font-size: var(--input--helper-size, 12px);
		line-height: var(--input--helper-lh, 14px);
	}

	.global-form .ticked-checkbox input+label {
		width: 48px;
		height: 48px;
		min-width: 48px;
		border-width: 3px;
		border-radius: 12px;
	}

	.global-form .ticked-checkbox input~label,
	.global-form .ticked-checkbox .text-details {
		font-size: 32px;
		line-height: 1.2;
		margin-left: 8px;
	}

	.global-form .ticked-checkbox input+label::before {
		width: 42px;
		height: 42px;
		-webkit-mask-size: 20px !important;
        mask-size: 20px !important;
	}

	.side-panel .button-wrapper-specific .global-button,
	.side-panel .button-wrapper .global-button {
		border-radius: 16px;
	}

	.global-form .ticked-radio input+label {
		width: 48px;
		height: 48px;
		min-width: 48px;
	}
	.global-form .ticked-radio .text-details, 
	.global-form .ticked-radio input~label {
		font-size: 32px;
		line-height: 1.2;
		
	}
	.global-form .ticked-radio input+label::before {
		width: 32px;
		height: 32px;
	}

	.global-form .ticked-radio.is-small input+label {
		width: 24px;
		height: 24px;
		min-width: 24px;
	}

	.global-form .ticked-radio.is-small input+label::before {
		width: 10px;
		height: 10px;
	}


	.global-form .custom-select-box:has(> label){
		border-radius:16px;
		height:96px;
		border-width:3px;
	}
	.global-form .custom-select-box:has(> label) select {
		padding:16px;
		border-radius:16px;
		height:96px;
	}
	.global-form .custom-select-box select option {
		font-size:28px;
	}
	.global-form .custom-select-box > label {
		font-size:32px;
	}
	.global-form .custom-select-box:has(> label) select {
		font-size:28px;
	}
	.global-form .custom-select-box:has(> label):focus-within select, 
	.global-form .custom-select-box:has(> label):has(select option:checked:not([hidden])) select {
		padding-top:40px;
	}
	.global-form .custom-select-box:has(> label):focus-within > label, 
	.global-form .custom-select-box:has(> label):has(select option:checked:not([hidden])) > label {
		top:24px;
		left:14px;
		font-size:24px;
	}
	.global-form .custom-select-box.is-focus:has(> label) > label {
		font-size:28px !important;
		top:24px !important;
	}
	.global-form .upload-container.upload-container_h100 {
		min-height:200px;
	}
	.global-form .upload-container {
		border-width:3px;
		font-size:64px;
		border-radius:16px;
		margin-bottom:20px;
		padding:48px 40px;
		min-height:400px;
	}
	.global-form .upload-content,
	.global-form .upload-inside {
		gap:32px;
	}
	.global-form .upload-icon-title {
		gap:24px;
	}
	.global-form .theme-icon {
		width:1.3em;
		height:1.3em;
		font-size:60px;

	}
	.global-form .upload-form-title {
		font-size:32px;
	}
	.global-form .upload-form-title .bigger_text {
		font-size:32px;
		line-height:48px;
		margin-bottom:16px;
	}
	.global-form .upload-form-title .smaller_text_paragraph *,
	.global-form .upload-form-title .smaller_text {
		font-size:28px;
		line-height:36px;
	}
	.global-form .upload-files-slot > .files-title,
	.global-form .upload-slot h3 {
		font-size:32px;
		padding-top:32px;
		margin-bottom:8px;
		line-height:48px;
	}
	.global-form .progress-container {
		margin-bottom:56px;
		border-radius:16px;
		padding:28px 24px;
	}
	.global-form .progress-status {
		gap:16px;
		padding-right:32px;

	}
	.global-form .progress-percentage {
		font-size:24px;
	}
	.global-form .progress-bar {
		height:8px;
		border-radius:90px;
	}
	.global-form .file-details {
		gap:16px;
	}
	.global-form .file-info {
		gap:20px
	}
	.global-form .file-icon {
		width:56px;
		height:56px;
	}
	.global-form .file-info span {
		font-size:24px;
	}
	.global-form .trash-icon {
		width:60px;
		height:60px;
	}
	.global-form .signature .sig-canvas {
		height:600px;
		border-radius:16px;
		border-width:3px;
	}
	.global-form .date-filter:after {
		min-width:48px;
		height:48px;
		top:24px;
		right:32px;
		background-repeat: no-repeat;
        background-size: contain;
	}
	.ui-datepicker {
		transform: scale(1.7);
	}
	.global-form .error-message {
		gap:18px;
		padding:18px;
		border-radius:12px;
		margin-top:18px;
		border-width:2px;
	}
	.global-form .error-icon {
		width:36px;
		height:36px;
	}
	.global-form .error-message span {
		font-size:20px;
		padding-top:3px;
	} */
}

/* ========================= INPUT FIELDS + PHONE INPUT — RESPONSIVE (max-width: 3000px) ========================= */
@media (max-width: 6000px) {
	/* Input Fields — reduce la 48px height */
	.global-form .input-box {
		height: 48px;
		border-radius: 8px;
	}

	.global-form .input-box input {
		padding: 13px 0 0;
	}

	.global-form .input-box.no-icon label {
		left: 16px !important;
	}

	.global-form .input-box.icon-before label {
		left: 48px;
	}

	.global-form .input-box.icon-before::before,
	.global-form .input-box.icon-after::after {
		width: 24px;
		height: 24px;
		margin-bottom: 4px;
	}

	/* Phone Input — same 48px height */
	.global-form .dual-input-wrapper {
		gap: 0;
		align-items: stretch;
		height: 48px;
		border-radius: 8px;
	}

	.global-form .iti-border-box {
		height: 48px;
		width: auto;
		min-width: 84px;
		border: none;
		border-radius: 8px 0 0 8px;
		box-sizing: border-box;
	}

	.global-form .iti-border-box .hidden-iti-input {
		width: 0 !important;
		min-width: 0 !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	.iti-border-box .iti__dropdown-content,
	.iti__dropdown-content {
		min-width: 320px;
		width: max-content;
		max-width: 80vw;
		z-index: 999;
	}

	.global-form .iti-border-box .iti__selected-country {
		display: flex;
		align-items: center;
		gap: 4px;
		height: 100%;
		padding: 0 8px;
	}

	.global-form .iti-border-box .iti__selected-country-primary {
		display: contents;
	}

	.global-form .iti-border-box .iti__flag,
	.global-form .iti-border-box .iti__selected-dial-code {
		margin: 0;
		order: 0;
	}

	.global-form .iti-border-box .iti__selected-dial-code {
		font-size: 14px;
	}

	.global-form .main-input-border-box {
		height: 48px;
		justify-content: center;
		border: none;
		border-radius: 0 8px 8px 0;
		box-sizing: border-box;
	}

	.global-form .main-input-border-box input[type="tel"] {
		height: 100%;
		padding: 13px 0 0;
		border-radius: 8px;
		font-size: 14px;
	}

	.global-form .iti-border-box .iti__arrow.iti__arrow--up {
		transform: rotate(180deg);
	}

	/* Tooltip */
	.global-form .tooltip-container::before,
	.info.tooltip .tooltip-container::before {
		width: 24px;
		height: 24px;
	}

	.global-form .tooltip-text,
	.info.tooltip .tooltip-text {
		gap: 4px;
		width: 280px;
		min-height: 80px;
		border-radius: 8px;
		padding: 8px;
	}

	.global-form .tooltip-text::before,
	.info.tooltip .tooltip-text::before {
		top: -5px;
		right: 22px;
		width: 12px;
		height: 6px;
	}

	.global-form .tooltip-close,
	.info.tooltip .tooltip-close {
		width: 16px;
		height: 16px;
	}

	.global-form .tooltip-close.flex-end,
	.info.tooltip .tooltip-close.flex-end {
		align-self: flex-end;
	}

	.global-form .tooltip-message,
	.info.tooltip .tooltip-message {
		font-size: 14px;
		font-weight: 400;
		line-height: 20px;
	}

	.global-form .tooltip-close:hover,
	.info.tooltip .tooltip-close:hover {
		opacity: 0.8;
	}

	/* Checkbox — unificat (era duplicat în 2 locuri diferite) */
	.global-form .ticked-checkbox input+label {
		width: 24px;
		height: 24px;
		min-width: 24px;
		border: 1px solid #6d7275;
		border-radius: 4px;
		box-sizing: border-box;
	}

	.global-form .ticked-checkbox input+label::before {
		width: 20px;
		height: 20px;
	}

	.global-form .ticked-checkbox .text-details,
	.global-form .ticked-checkbox input~label {
		/* margin-left: 8px; */
		font-size: 16px;
	}

	/* Side Panel */
	.global-form .side-panel .container-terms::-webkit-scrollbar,
	.global-form .textarea-box textarea::-webkit-scrollbar {
		width: 8px;
	}

	.global-form .side-panel .container-terms::-webkit-scrollbar-thumb,
	.global-form .textarea-box textarea::-webkit-scrollbar-thumb {
		background-color: #163fe8;
		border-radius: 49px;
	}

	.global-form .side-panel .container-terms::-webkit-scrollbar-track,
	.global-form .textarea-box textarea::-webkit-scrollbar-track {
		background-color: #d3d5d6;
		border-radius: 49px;
	}

	.global-form .side-panel .container-terms {
		padding-right: 12px;
	}

	.global-form .side-panel {
		top: 0px;
		width: 680px;
		padding: 80px 24px 0px;
	}

	body.navbar-hidden .global-form .side-panel {
		top: 0px;
		bottom: 0px;
	}

	.global-form .side-panel .global-title {
		font-size: 24px;
	}

	.global-form .side-panel .button-wrapper {
		gap: 12px;
		padding: 16px 0px;
	}

	.global-form .side-panel .button-wrapper .global-button {
		padding: 16px;
		font-size: 16px;
		border-radius: 8px;
	}

	.global-form .side-panel .button-wrapper .global-button-border-gray {
		border: 1.5px solid #6d7275 !important;
	}

	/* Text Checkbox Module */
	.global-form .text-checkbox-module {
		padding: 24px;
		border-radius: 8px;
	}

	.global-form .text-checkbox-module .text {
		font-size: 16px;
	}

	.global-form .text-checkbox-module .title {
		font-size: 20px;
		margin-bottom: 8px;
	}

	/* Input Fields — extra */
	.input-box:has(input:disabled) {
		pointer-events: none;
	}

	.global-form .custom-select-box:has(> label):has(select:disabled)::before {
		border-color: #6D7275;
	}

	.global-form .info {
		font-size: 16px;
	}

	.global-form .terms-and-condition-container {
		gap: 16px;
	}

	/* Custom Select */
	.global-form .custom-select-box:has(> label) {
		border-radius: 8px;
		border: 1px solid #0D0D0D;
		flex: 1 0 calc(25% - 24px);
	}

	.global-form .custom-select-box:has(> label) select {
		padding: 12px 8px 4px;
		border-radius: 8px;
		font-size: 14px;
		height: 48px;
	}

	.global-form .custom-select-box:has(> label) select:focus {
		outline: transparent;
		box-shadow: 0 0 0 2px #506FEE;
	}

	.global-form .custom-select-box>label {
		left: 8px;
		font-size: 14px;
	}


}

/* ========================= UPLOADS (max-width: 1200px) ========================= */
@media (max-width: 1200px) {
	.global-form .upload-container {
		border: 1px dashed #163FE8;
		font-size: 16px;
		margin-bottom: 5px;
		border-radius: 8px;
		padding: 24px;
		box-sizing: border-box;
	}

	.global-form .upload-container strong {
		margin-bottom: 10px;
		font-size: 32px;
	}

	.global-form .upload-container span {
		margin-bottom: 5px;
	}

	.global-form .files-container {
		margin-top: 24px;
		margin-bottom: 24px;
	}

	.global-form .file-container {
		width: 24%;
		min-width: 200px;
		height: 200px;
		margin-bottom: 10px;
	}

	.global-form .file-container:after {
		font-size: 30px;
		line-height: 200px;
	}

	.global-form .upload-icon-title {
		gap: 8px;
	}

	.global-form .upload-form-title {
		font-size: 14px;
	}

	.global-form .upload-form-text {
		font-size: 12px;
	}

	.global-form .form__container {
		border: 1px dashed #163FE8;
		font-size: 16px;
		margin-bottom: 5px;
		border-radius: 8px;
		padding: 24px;
		box-sizing: border-box;
	}

	.global-form .form__container strong {
		margin-bottom: 10px;
		font-size: 32px;
	}

	.global-form .form__progress-container {
		padding: 24px;
		gap: 24px;
	}
}

/* ========================= TABLET (max-width: 890px) ========================= */
@media (max-width: 890px) {
	.global-form .text-checkbox-module .title {
		font-size: 18px;
	}

	.global-form .side-panel {
		padding: 80px 24px 0px;
		width: 100%;
		max-width: 100%;
		display: flex;
		gap: 8px;
		top: 0px;
		height: 100dvh;
		box-sizing: border-box;
	}

	.global-form .side-panel .container-terms {
		flex: 1;
		min-height: 0;
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
		padding-right: 12px;
		overflow-y: auto;
	}

	.global-form .side-panel .button-wrapper {
		display: flex;
		flex-direction: column;
		gap: 24px;
		padding-top: 16px;
		box-sizing: border-box;
	}

	.global-form .side-panel .container-terms * {
		max-width: 100%;
		box-sizing: border-box;
	}

	.global-form .side-panel .container-terms p,
	.global-form .side-panel .container-terms li,
	.global-form .side-panel .container-terms a,
	.global-form .side-panel .container-terms span,
	.global-form .side-panel .container-terms strong,
	.global-form .side-panel .container-terms em {
		overflow-wrap: anywhere;
		word-break: break-word;
	}

	.global-form .side-panel .container-terms img,
	.global-form .side-panel .container-terms table,
	.global-form .side-panel .container-terms iframe,
	.global-form .side-panel .container-terms video {
		max-width: 100%;
		height: auto;
	}

	.global-form .side-panel .global-title {
		font-size: 20px;
	}

	@supports (-webkit-touch-callout: none) {
		.global-form .input-box input {
			font-size: 16px;
		}
	}

	.global-form .accordion-wrapp {
		padding: 14px 16px;
		margin-bottom: 8px;
	}

	.global-form .accordion-title {
		font-size: 13px;
	}

	.global-form .radio-buttons-type .radio input+span {
		padding: 8px 16px;
		font-size: 13px;
	}
}

/* ========================= (max-width: 768px) ========================= */
@media (max-width: 768px) {
	.global-form .accordion-wrapp {
		padding: 14px 16px;
		margin-bottom: 8px;
	}

	.global-form .accordion-title {
		font-size: 13px;
	}

	.global-form .radio-buttons-type {
		gap: 8px;
		margin-bottom: 24px;
		margin-top: 8px;
	}

	.global-form .radio-buttons-type .radio input+span {
		padding: 8px 16px;
		font-size: 13px;
	}

	.global-form .ticked-checkbox input+label {
		/* width: 16px;
		height: 16px;
		min-width: 16px;
		margin-top:3px; */
	}

	.global-form .ticked-checkbox input+label::before {
		width: 10px;
		height: 10px;
	}

	.global-form .ticked-checkbox .text-details {
		margin-left: 8px;
		font-size: 16px;
	}

	.global-form .textarea-box > textarea {
		font-size: 16px;
		min-height: 100px;
	}

	.global-form .textarea-box > label {
		font-size: 14px;
		line-height: 20px;
	}

	.global-form .textarea-box:focus-within > label,
	.global-form .textarea-box:has(textarea:not(:placeholder-shown)) > label {
		font-size: 12px;
		line-height: 14px;
	}

	.global-form .date-filter {
		width: 100%;
	}

	.ui-datepicker {
		font-size: 12px !important;
	}

	.ui-datepicker-calendar td a,
	.ui-datepicker-calendar td span {
		padding: 6px !important;
		font-size: 12px;
	}

	.ui-datepicker .dp-view-item {
		padding: 8px;
		font-size: 12px;
	}

	.global-form .ticked-radio input+label {
		width: 20px;
		height: 20px;
		min-width: 20px;
	}

	.global-form .ticked-radio input+label::before {
		width: 8px;
		height: 8px;
	}

	.global-form .ticked-radio.is-small input+label {
		width: 12px;
		height: 12px;
		min-width: 12px;
	}

	.global-form .ticked-radio.is-small input+label::before {
		width: 4px;
		height: 4px;
	}

	.global-form .ticked-radio .text-details {
		margin-left: 8px;
		font-size: 16px;
	}

	.global-form .upload-documents-wrapper {
		flex-direction: column;
		gap: 16px;
	}

	.global-form .upload-container {
		border: 1px dashed #163FE8;
		font-size: 14px;
		padding: 16px 12px;
		border-radius: 6px;
	}

	.global-form .upload-container strong {
		font-size: 24px;
		margin-bottom: 8px;
	}

	.global-form .upload-inside {
		gap: 8px;
	}

	.global-form .upload-content {
		gap: 8px;
	}

	.global-form .icon-upload {
		width: 32px;
		height: 32px;
	}

	.global-form .upload-icon-title {
		flex-direction: column;
		align-items: flex-start;
		gap: 6px;
	}

	.global-form .upload-form-title {
		font-size: 12px;
	}

	.global-form .form__container {
		border: 1px dashed #163FE8;
		font-size: 14px;
		padding: 16px 12px;
		border-radius: 6px;
		min-height: 150px;
	}

	.global-form .form__container strong {
		font-size: 24px;
		margin-bottom: 8px;
	}

	.global-form .form__progress-container {
		padding: 16px;
		gap: 16px;
	}

	.global-form .form__file-details {
		flex-direction: column;
	}
}

/* ========================= (max-width: 600px) ========================= */
@media (max-width: 600px) {
	.iti--container .iti__dropdown-content {
		min-width: 230px;
	}
}

/* ========================= (max-width: 400px) ========================= */
@media (max-width: 400px) {
	.global-form .button-container .global-button {
		min-width: 100%;
		width: 100%;
	}
	.info.tooltip .tooltip-text ,
	.global-form .tooltip-text {
		width: 250px;
	}

	.global-form .accordion-wrapp {
		padding: 12px 14px;
		margin-bottom: 6px;
	}

	.global-form .accordion-title {
		font-size: 12px;
	}

	.global-form .radio-buttons-type {
		gap: 6px;
		margin-bottom: 16px;
		margin-top: 6px;
	}

	.global-form .radio-buttons-type .radio input+span {
		padding: 6px 12px;
		font-size: 12px;
	}
}

/* NEW MODEL: custom-select-field visibility */
.global-form_old_model .custom-select-field.is-hidden ,
.global-form .custom-select-field.is-hidden  {
	display: none;
}
.global-form_old_model .custom-select-field.is-visible ,
.global-form .custom-select-field.is-visible {
	display: flex;
}

.global-form input:-webkit-autofill,
.global-form input:-webkit-autofill:hover,
.global-form input:-webkit-autofill:focus,
.global-form input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
    box-shadow: 0 0 0 1000px #fff inset !important;
    -webkit-text-fill-color: #000 !important;
    caret-color: #000;
}

.custom-select-field.width-50 {
    max-width:50% !important;
    flex: 1 0 calc(25% - 24px);
}
.custom-select-field.width-35 {
    max-width:35% !important;
}
.custom-select-field.no-margin {
    margin-bottom:0px !important;
}

.ticked-checkbox label.checkbox-no-margin-left{
    margin-left:0px !important;
}
.ticked-checkbox label.checkbox-margin-left-8 {
    margin-left:8px !important;
}
@media (min-width: 3001px) {
    /* .ticked-checkbox label.checkbox-no-margin-left{
        margin-left:0px !important;
    }
    .ticked-checkbox label.checkbox-margin-left-8 {
        margin-left:14px !important;
    } */
}


@media (max-width: 900px) {
	.custom-select-field.width-50 {
		max-width:100% !important;;
	}
	.custom-select-field.width-35 {
		max-width:100% !important;;
	}
}
/* ========================= DATEPICKER — iOS zoom (max-width: 1200px) =========================
   Safari iOS face zoom automat la focus pe inputuri sub 16px si nu revine dupa inchiderea
   calendarului. Inputurile cu datepicker (.date-filter / .datepicker-field: contractare,
   contractare VAS, actualizare date, global-forms) au 14px din .global-form .input-box input.
   Aceeasi regula ca in graficpretenergie.css; articlelist are deja 16px. */
@media (max-width: 1200px) {
	.global-form .date-filter input,
	.global-form .datepicker-field input {
		font-size: 16px;
	}
}

/* =========================================================================
 * Firefox: echivalentul scrollbar-ului custom ::-webkit-scrollbar de mai sus
 * (generat din aceleasi culori / latimi). Doar in Firefox (@supports): in Chrome 121+
 * scrollbar-color / scrollbar-width ar anula stilurile ::-webkit-scrollbar.
 * ========================================================================= */
@supports (-moz-appearance: none) {
    .side-panel .container-terms {
        scrollbar-width: auto; scrollbar-color: #163fe8 #d3d5d6;
    }
    .global-form_old_model .textarea-box textarea {
        scrollbar-width: auto; scrollbar-color: #163fe8 #d3d5d6;
    }
    .global-form .textarea-box textarea {
        scrollbar-width: auto; scrollbar-color: #163fe8 #d3d5d6;
    }
    @media (max-width: 6000px) {
        .global-form .side-panel .container-terms {
            scrollbar-width: thin; scrollbar-color: #163fe8 #d3d5d6;
        }
        .global-form .textarea-box textarea {
            scrollbar-width: thin; scrollbar-color: #163fe8 #d3d5d6;
        }
    }
}
