#td-quote-container {
	max-width: 800px;
	margin: 20px auto;
	font-family: 'Inter', sans-serif;
	color: #fff;
}

.td-card {
	background: #1e1e1e;
	border-radius: 15px;
	padding: 25px;
	margin-bottom: 25px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
	position: relative;
}

.td-card h3 {
	margin-top: 0;
	color: #fff;
	margin-bottom: 20px;
}

.stl-upload-box {
	border: 2px dashed #444;
	border-radius: 10px;
	padding: 30px;
	text-align: center;
	cursor: pointer;
	background: #252525;
	margin-bottom: 20px;
	transition: all 0.3s ease;
}

.stl-upload-box.dragover {
	border-color: #0a2463;
	background: #2a2a2a;
}

.folder-icon {
	font-size: 40px;
	color: #f1c40f;
	display: block;
	margin-bottom: 10px;
}

.stl-preview {
	width: 100%;
	height: 250px;
	background: #111;
	border-radius: 8px;
	display: none;
	margin-bottom: 20px;
}

input[type='text'],
input[type='email'],
input[type='tel'],
input[type='number'],
textarea {
	width: 100%;
	background: #2a2a2a;
	border: 1px solid #444;
	color: #ccc;
	padding: 12px;
	border-radius: 5px;
	margin-bottom: 15px;
}

.td-grid-2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 15px;
}

.radio-group {
	display: flex;
	gap: 8px;
	margin-bottom: 20px;
	flex-wrap: wrap;
	align-items: center;
}

.radio-group label {
	cursor: pointer;
	margin: 0;
}

.radio-group input {
	display: none;
}

.radio-group span {
	display: block;
	padding: 8px 18px;
	background: #333;
	border-radius: 6px;
	transition: 0.3s;
	font-size: 14px;
}

.radio-group input:checked + span {
	background: #0a2463;
	color: white;
}

.radio-group input:disabled + span {
	opacity: 0.2;
	cursor: not-allowed;
}

.slider-container {
	margin: 20px 0;
}

.kitoltes-slider {
	-webkit-appearance: none;
	width: 100%;
	height: 8px;
	border-radius: 5px;
	background: #444;
	outline: none;
	margin: 15px 0;
}

.kitoltes-slider::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #0a2463;
	cursor: pointer;
	border: 2px solid #fff;
}

.toggle-row {
	display: flex;
	align-items: center;
	gap: 15px;
	margin-top: 20px;
}

.switch {
	position: relative;
	display: inline-block;
	width: 120px;
	height: 34px;
}

.switch input {
	opacity: 0;
	width: 0;
	height: 0;
}

.slider-toggle {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #333;
	transition: 0.4s;
	border-radius: 34px;
}

.slider-toggle:before {
	position: absolute;
	content: '';
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	transition: 0.4s;
	border-radius: 50%;
	z-index: 2;
}

input:checked + .slider-toggle {
	background-color: #0a2463;
}

input:checked + .slider-toggle:before {
	transform: translateX(86px);
}

.toggle-labels {
	position: absolute;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: space-around;
	align-items: center;
	font-size: 10px;
	font-weight: bold;
	pointer-events: none;
}

.label-kerem {
	color: transparent;
	transition: 0.3s;
}

.label-nem {
	color: #fff;
	transition: 0.3s;
}

input:checked + .slider-toggle .label-kerem {
	color: #fff;
}

input:checked + .slider-toggle .label-nem {
	color: transparent;
}

.td-action-buttons {
	display: flex;
	gap: 15px;
	margin-bottom: 30px;
}

#add-model-btn,
#submit-quote-btn {
	background: #0a2463;
	color: white;
	border: none;
	padding: 15px 20px;
	border-radius: 8px;
	cursor: pointer;
	font-weight: bold;
	flex: 2;
}

#reset-form-btn {
	background: #444;
	color: white;
	border: none;
	padding: 15px 20px;
	border-radius: 8px;
	cursor: pointer;
	flex: 1;
}

.remove-model {
	position: absolute;
	top: 15px;
	right: 15px;
	color: #ff4d4d;
	cursor: pointer;
	font-size: 24px;
}

.gdpr-row {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 15px 0;
	font-size: 13px;
}

.loader {
	border: 3px solid #f3f3f3;
	border-top: 3px solid #0a2463;
	border-radius: 50%;
	width: 18px;
	height: 18px;
	animation: spin 1s linear infinite;
	display: inline-block;
}

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


/* --- Processing note under submit button --- */
.td-processing-note{
	margin-top:12px;
	font-size:13px;
	color: rgba(255,255,255,0.75);
	line-height:1.4;
}

/* --- Tooltip help icon --- */

/* --- Label rows with right-aligned help icon --- */
.td-label-row{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap: 10px;
}
.td-label-row .td-label-text{ flex:1 1 auto; min-width:0; }
.td-label-row .td-help{ flex:0 0 auto; margin-left: 10px; }

.td-toggle-label-row{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap: 10px;
	width: 100%;
}
.td-toggle-label-row .td-label-text{ flex:1 1 auto; min-width:0; }
.td-toggle-label-row .td-help{ flex:0 0 auto; }

/* Support removal field: label row + switch underneath */
.td-support-field{ margin-top: 12px; }
.td-support-control{ margin-top: 10px; display:flex; justify-content:flex-start; align-items:center; }

.td-help{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	margin-left:8px;
	cursor: help;
	position: relative;
	user-select: none;
	vertical-align: middle;
}

.td-help-icon{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width: 18px;
	height: 18px;
	border-radius: 999px;
	border: 1px solid rgba(255,255,255,0.22);
	background: rgba(255,255,255,0.06);
	color: rgba(255,255,255,0.92);
	font-size: 12px;
	font-weight: 900;
	line-height: 1;
	transition: transform 0.08s ease, border-color 0.12s ease, background 0.12s ease;
}

.td-help:hover .td-help-icon,
.td-help:focus .td-help-icon,
.td-help.is-open .td-help-icon{
	border-color: rgba(155,155,255,0.65);
	background: rgba(10,36,99,0.22);
	transform: translateY(-1px);
}

.td-tooltip{
	position: absolute;
	right: 0;
	left: auto;
	bottom: calc(100% + 12px);
	--td-tip-shift: 0px;
	transform: translateX(var(--td-tip-shift));
	max-width: min(320px, calc(100vw - 24px));
	width: min(320px, calc(100vw - 24px));
	white-space: normal;
	overflow-wrap: anywhere;
	word-break: break-word;
	background: linear-gradient(180deg, rgba(30,30,30,0.98), rgba(18,18,18,0.98));
	border: 1px solid rgba(255,255,255,0.14);
	box-shadow: 0 16px 40px rgba(0,0,0,0.45);
	border-radius: 14px;
	padding: 12px 12px 10px;
	color: rgba(255,255,255,0.92);
	font-size: 12px;
	line-height: 1.45;
	z-index: 9999;
	display: none;
}

.td-tooltip::after{
	content: "";
	position: absolute;
	left: auto;
	right: 12px;
	top: 100%;
	transform: none;
	border: 7px solid transparent;
	border-top-color: rgba(255,255,255,0.14);
}
.td-tooltip.td-tip-below::after{
	left: auto;
	right: 12px;
	top: auto;
	bottom: 100%;
	transform: none;
	border: 7px solid transparent;
	border-top-color: transparent;
	border-bottom-color: rgba(255,255,255,0.14);
}


.td-tip-title{
	display:block;
	font-weight: 900;
	letter-spacing: 0.2px;
	margin-bottom: 8px;
	color: #9bb3ff;
}

.td-tip-text{
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.td-tip-item{
	display:block;
	padding-left: 10px;
	position: relative;
}

.td-tip-item::before{
	content: "•";
	position: absolute;
	left: 0;
	color: rgba(255,255,255,0.55);
}

.td-help:hover .td-tooltip,
.td-help:focus .td-tooltip,
.td-help.is-open .td-tooltip{ display:block; }

@media (max-width: 640px){
	.td-tooltip{
		position: absolute;
		right: 0;
		left: auto;
		bottom: calc(100% + 12px);
		transform: translateX(var(--td-tip-shift));
		max-width: min(320px, calc(100vw - 24px));
		width: min(320px, 86vw);
	}
	.td-tooltip::after{
		display: block;
	}
}


/* --- Mobile / tablet optimization --- */
@media (max-width: 900px){
	#td-quote-container{ max-width: 92vw; }
	.td-card{ padding: 18px; }
	.stl-upload-box{ padding: 20px; }
}

@media (max-width: 640px){
	#td-quote-container{ margin: 14px auto; }
	.td-card{ padding: 16px; border-radius: 14px; }
	.td-grid-2{ grid-template-columns: 1fr; }
	.radio-group span{ padding: 10px 14px; }
	.stl-preview{ height: 210px; }
	.toggle-row{ flex-wrap: wrap; gap: 10px; }
	.switch{ width: 110px; }
	input:checked + .slider-toggle:before{ transform: translateX(76px); }
	.td-action-buttons{ flex-direction: column; }
	.td-action-buttons button{ width: 100%; }
	.td-processing-note{ font-size: 12px; }
}

/* fixed tooltip (mobile) */
.td-tooltip-fixed{ will-change: transform; }

/* Customer portal */
.td-portal-wrap{max-width:980px;margin:0 auto;padding:20px;}
.td-portal-inner{background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.10);border-radius:18px;padding:18px;}
.td-portal-title{margin:0 0 12px 0;color:#fff;}
.td-portal-login label{display:block;margin-top:10px;color:#ddd;}
.td-portal-login input{width:100%;padding:10px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.35);color:#fff;}
.td-btn{margin-top:12px;padding:10px 14px;border-radius:12px;border:0;background:#fff;color:#111;font-weight:700;cursor:pointer;}
.td-btn-outline{padding:8px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.2);background:transparent;color:#fff;cursor:pointer;}
.td-portal-profile{display:flex;gap:12px;align-items:center;justify-content:space-between;margin:10px 0 14px 0;color:#ddd;}
.td-portal-logout{color:#fff;text-decoration:underline;}
.td-portal-card{border:1px solid rgba(255,255,255,.10);border-radius:16px;margin:12px 0;overflow:hidden;background:rgba(0,0,0,.35);}
.td-portal-card-head{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:12px 14px;}
.td-portal-num{color:#fff;font-weight:800;}
.td-portal-status{color:#bbb;}
.td-portal-body{display:none;padding:14px;border-top:1px solid rgba(255,255,255,.08);}
.td-form-error{background:#2a0f10;border:1px solid #ff4d4f;color:#ffb3b3;padding:12px 14px;border-radius:10px;margin:12px 0;font-size:14px;}
.td-portal-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px;}
.td-portal-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
@media(max-width:700px){.td-portal-grid-2{grid-template-columns:1fr;}}
.td-portal-form label{display:block;margin-top:10px;color:#ddd;}
.td-portal-form input, .td-portal-form select{width:100%;padding:10px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.35);color:#fff;}
