@font-face {
	font-family: "DGVF Kalameh";
	src: url("https://drgraphic.net/wp-content/uploads/2026/08/KalamehWeb-Regular.woff") format("woff");
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
}

.dgvf-variation-fields,
.dgvf-variation-fields * {
	font-family: "DGVF Kalameh", Tahoma, Arial, sans-serif !important;
	box-sizing: border-box;
}

.dgvf-variation-fields {
	width: 100%;
	margin: 0;
	direction: rtl;
}

.dgvf-variation-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	width: 100%;
}

.dgvf-variation-card {
	position: relative;
	display: flex !important;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 5px;
	width: 100%;
	min-width: 0;
	min-height: 72px;
	padding: 10px 12px;
	margin: 0;
	border: 1.5px solid #dfe6eb;
	border-radius: 11px;
	background: #fff;
	background-image: none;
	box-shadow: none;
	color: #2f3a45;
	line-height: 1.55;
	text-align: right;
	cursor: pointer;
	transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease, color .18s ease;
	appearance: none;
	-webkit-appearance: none;
}

.dgvf-variation-card:hover:not(.is-disabled),
.dgvf-variation-card:focus-visible:not(.is-disabled) {
	border-color: #57b9e4;
	background: #f3fbff;
	box-shadow: 0 5px 16px rgba(18, 144, 199, .10);
	outline: none;
	color: #253846;
	transform: translateY(-1px);
}

.dgvf-variation-card.is-selected,
.dgvf-variation-card.is-selected:hover,
.dgvf-variation-card.is-selected:focus-visible {
	border-color: #067fba;
	background: #0b98d8;
	box-shadow: 0 7px 20px rgba(4, 116, 171, .26), inset 0 0 0 2px rgba(255, 255, 255, .22);
	color: #fff;
	transform: translateY(-1px);
}

/* Professional selected-state marker: a subtle vertical accent, no check icon. */
.dgvf-variation-card.is-selected::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	top: 16px;
	bottom: 16px;
	width: 4px;
	border-radius: 4px;
	background: rgba(255, 255, 255, .92);
}

.dgvf-variation-card.is-selected::after {
	content: none !important;
	display: none !important;
}

.dgvf-variation-card.is-disabled {
	opacity: .48;
	cursor: not-allowed;
	transform: none;
}

.dgvf-variation-card .dgvf-variation-title,
.dgvf-variation-card .dgvf-variation-price,
.dgvf-variation-card .dgvf-variation-status,
.dgvf-variation-card:hover .dgvf-variation-title,
.dgvf-variation-card:hover .dgvf-variation-price,
.dgvf-variation-card:hover .dgvf-variation-status,
.dgvf-variation-card.is-selected .dgvf-variation-title,
.dgvf-variation-card.is-selected .dgvf-variation-price,
.dgvf-variation-card.is-selected .dgvf-variation-status {
	color: inherit;
}

.dgvf-variation-title {
	display: block;
	width: 100%;
	min-width: 0;
	margin: 0;
	padding: 0;
	font-weight: 700;
	font-size: 13px;
	line-height: 1.65;
	color: #34414d;
	white-space: normal;
	word-break: normal;
	overflow-wrap: break-word;
}

.dgvf-variation-price {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 6px;
	width: 100%;
	font-weight: 600;
	font-size: 12px;
	line-height: 1.6;
	color: #4b5966;
	white-space: normal;
}

.dgvf-variation-price del {
	opacity: .58;
	margin: 0;
}

.dgvf-variation-price ins {
	text-decoration: none;
}

.dgvf-variation-card.is-selected .dgvf-variation-price del {
	opacity: .72;
}

.dgvf-variation-status {
	display: inline-block;
	font-size: 11px;
	font-weight: 600;
}

form.variations_form.dgvf-managed-variation-form table.variations {
	display: none !important;
}

@media (max-width: 767px) {
	.dgvf-variation-fields {
		display: block !important;
		width: 100% !important;
		max-width: none !important;
		margin-inline: 0 !important;
	}

	.dgvf-variation-grid {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 8px;
		width: 100% !important;
		max-width: none !important;
	}

	.dgvf-variation-card {
		display: flex !important;
		width: 100% !important;
		max-width: none !important;
		min-width: 0 !important;
		min-height: 68px;
		padding: 9px 11px;
		border-radius: 10px;
	}

	.dgvf-variation-title {
		font-size: 12.5px;
	}

	.dgvf-variation-price {
		font-size: 11.5px;
	}
}

/* Mobile: make the shortcode widget fill its own Elementor container without flex-grow. */
@media (max-width: 767px) {
	.elementor-widget-shortcode:has(.dgvf-variation-fields) {
		--container-widget-width: 100% !important;
		--container-widget-flex-grow: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		align-self: stretch !important;
		margin-inline: 0 !important;
	}

	.elementor-widget-shortcode:has(.dgvf-variation-fields) > .elementor-widget-container,
	.elementor-widget-shortcode:has(.dgvf-variation-fields) .elementor-shortcode,
	.elementor-widget-shortcode:has(.dgvf-variation-fields) .dgvf-variation-fields,
	.elementor-widget-shortcode:has(.dgvf-variation-fields) .dgvf-variation-grid,
	.elementor-widget-shortcode:has(.dgvf-variation-fields) .dgvf-variation-card {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
	}

	.elementor-widget-shortcode:has(.dgvf-variation-fields) .dgvf-variation-grid {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) !important;
	}
}