html body .esaf-pro-dashboard {
	--esaf-color-fore-base: var(--color-coal-----);
	--esaf-color-fore-note: var(--color-white----);
	--esaf-color-fore-icon: var(--color-plum-----);
	--esaf-color-back-base: var(--color-ghost----);
	--esaf-color-border: var(--color-grape----);
	--esaf-radius-outer: 10px;
	--esaf-radius-inner: 7px;

	margin-inline: -30px;

	& .esaf-pro-dashboard-signup {
		background-color: var(--color-sand-----);
	}

	& .esaf-pro-dashboard-content {
		color: var(--esaf-color-fore-base) !important;
	}

	& .qr-flex,
	& .esaf-affiliate-dashboard-home-box,
	& .esaf-affiliate-dashboard-home-content {
		border-radius: 10px;
	}

	& input {
		border-radius: 7px;
	}

	& h3 {
		font: var(--type-base-h2-----fonts) !important;
		letter-spacing: var(--type-base-h2-----space) !important;
	}

	& h4 {
		font: var(--type-base-h3-----fonts) !important;
		letter-spacing: var(--type-base-h3-----space) !important;
	}

	& [class*="label"] {
		font: var(--type-base-body---fonts);
		letter-spacing: var(--type-base-body---space);
	}

	& [class*="value"] {
		font: var(--type-base-body---fonts);
		letter-spacing: var(--type-base-body---space);
	}

	& [class*="amount"] {
		font: var(--type-base-body---fonts);
		letter-spacing: var(--type-base-body---space);
	}

	& [class*="payments-header"],
	& [class*="stat"] {
		justify-content: start;

		& svg {
			fill: currentColor;
			color: var(--color-plum-----);
		}
	}

	& [class*="tooltip-message"] {
		border-radius: 4px;
		background-color: var(--color-plum-----);
		color: var(--color-white----);
		padding: 15px;
		width: max-content;
		max-width: 240px;
		margin-left: -120px;

		&::after {
			border-color: var(--color-plum-----) transparent transparent transparent;
		}
	}

	& [class*="header-menu"] {
		& .avatar {
			border: none;
		}

		& [class*="menu-drop"] {
			& [class*="user-box"] {
				border: 0;
				margin: 0;
				padding: 0;
				border-block-end: 1px solid var(--color-pastel---);
				margin-block-end: 10px;
				padding-block-end: 10px;

				& + a {
					width: max-content;
					margin: 0;
					padding: 0;
					margin-inline-start: auto;
				}
			}
		}
	}

	& #esaf-dashboard-my-affiliate-link,
	& #esaf-dashboard-showcase-url,
	& .esaf-affiliate-dashboard-home-box,
	& .esaf-affiliate-dashboard-home-content,
	& .esaf-custom-links-form {
		border-color: var(--color-grape----);
		background-color: var(--color-ghost----);
		border-radius: 10px;
	}

	& .daterangepicker .ranges li.active,
	& .daterangepicker td.active,
	& .daterangepicker td.active:hover,
	& .daterangepicker td.in-range.end-date {
		background-color: var(--color-plum-----);
	}

	& .daterangepicker td.in-range {
		background-color: var(--color-plumlight);
	}

	& .esaf-form input[type="text"],
	& .esaf-form input[type="email"],
	& .esaf-form input[type="password"],
	& .esaf-form input[type="url"],
	& .esaf-form textarea,
	& .esaf-form select {
		background-color: var(--color-beige----);
	}

	& .esaf-dashboard-my-affiliate-link-input > span,
	& .esaf-dashboard-custom-link-input > span,
	& .esaf-mepr-coupon-valid-product-input > span,
	& .esaf-dashboard-custom-link-edit {
		color: var(--color-plum-----);
	}

	& .esaf-dashboard-qr,
	& .esaf-td-qr {
		& img {
			display: block;
			mix-blend-mode: multiply;
		}
	}

	& .qr-flex {
		& .esaf-dashboard-qr {
			align-self: end;
		}
	}

	& #esaf-dashboard-custom-links-table {
		border-collapse: separate;

		& th,
		& td {
			border-color: var(--esaf-color-border);
			background-color: var(--color-ghost----);

			& a {
				color: var(--color-plum-----);
				transition: var(--transition-color-foreground);

				&:hover {
					color: var(--color-plumlink-);
				}
			}
		}

		& thead {
			& tr {
				&:first-child {
					& th {
						&:first-child {
							border-top-left-radius: var(--esaf-radius-outer);
						}

						&:last-child {
							border-top-right-radius: var(--esaf-radius-outer);
						}
					}
				}
			}
		}

		& tbody {
			& tr {
				&:last-child {
					& td {
						&:first-child {
							border-bottom-left-radius: var(--esaf-radius-outer);
						}

						&:last-child {
							border-bottom-right-radius: var(--esaf-radius-outer);
						}
					}
				}
			}
		}
	}
}
