:root {
  --hound-pink: #ff0f87;
  --hound-green: #1dd714;
  --hound-white: #ffffff;
  /* Shades */
  --hound-black-100: #1B1818;
  /* Heading */
  --hound-black-90: #1B1818E5;
  --hound-black-80: #1B1818CC;
  --hound-black-70: #1B1818B2;

  /* Paragraph */
  --hound-black-60: #1B181899;
  --hound-black-50: #1B181880;
  --hound-black-40: #1B181866;
}

/* ------- Dashboard Design --------*/

.dashed-separator{
	border: 1px dashed #ccc;
	margin: 30px 0;
	width: 40%;
}

.hound-welcome-panel {
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='0' x2='0' y1='1' y2='0'%3E%3Cstop offset='0' stop-color='%230FF'/%3E%3Cstop offset='1' stop-color='%23CF6'/%3E%3C/linearGradient%3E%3ClinearGradient id='b' x1='0' x2='0' y1='0' y2='1'%3E%3Cstop offset='0' stop-color='%23F00'/%3E%3Cstop offset='1' stop-color='%23FC0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill='%23FFF' fill-opacity='0' stroke-miterlimit='10'%3E%3Cg stroke='url(%23a)' stroke-width='2'%3E%3Cpath transform='translate(0 0)' d='M1409 581 1450.35 511 1490 581z'/%3E%3Ccircle stroke-width='4' transform='rotate(0 800 450)' cx='500' cy='100' r='40'/%3E%3Cpath transform='translate(0 0)' d='M400.86 735.5h-83.73c0-23.12 18.74-41.87 41.87-41.87S400.86 712.38 400.86 735.5z'/%3E%3C/g%3E%3Cg stroke='url(%23b)' stroke-width='4'%3E%3Cpath transform='translate(0 0)' d='M149.8 345.2 118.4 389.8 149.8 434.4 181.2 389.8z'/%3E%3Crect stroke-width='8' transform='rotate(0 1089 759)' x='1039' y='709' width='100' height='100'/%3E%3Cpath transform='rotate(0 1400 132)' d='M1426.8 132.4 1405.7 168.8 1363.7 168.8 1342.7 132.4 1363.7 96 1405.7 96z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
	background-attachment: fixed;
	background-position: top right;
	background-size: cover;
	border-radius: 5px;
	padding: 40px 40px 60px;
	margin: 20px 20px 20px 0;
	font-size: 16px;
}

.hound-welcome-title{
	display: flex;
	align-items: center;
	gap: 12px;
}

.hound-welcome-title span {
	background-color: var(--hound-pink);
	color: #fff;
	border-radius: 25px;
	padding: 5px 15px;
	font-weight: bold;
	font-size: 13px;
	margin-top: 8px;
}

.hound-welcome-heading .hound-subtitle {
	font-size: 20px;
	margin-top: 0;
}

#hound-shortcode{
	width: 200px;
	font-size: 16px;
	padding: 10px 15px;
	display: inline-block;
}

.hound-copy-shortcode-btn {
	background-color: var(--hound-pink);
	color: #fff;
	padding: 15px 18px;
	border-radius: 4px;
	font-weight: normal;
	border: 2px solid var(--hound-pink);
}

.hound-copy-shortcode-success{
	background-color: var(--hound-green);
	border-color: var(--hound-green);
}

.support-section ul {
    display: flex;
    gap: 20px;
    flex-direction: column;
}

.support-section ul li{
	display: flex;
	align-items: center;
	gap: 10px;
}

.support-section ul li a{
	color: #3c434a;
	font-size: 18px;
	text-decoration: none;
	cursor: pointer;
}

.support-section ul li a:hover{
	color: var(--hound-pink);
}

/* ------- Pro Features --------*/
.pro-features{
	pointer-events: none;
	position: relative;
	border-width: 0 2 2 0;
	border-left: 5px solid var(--hound-pink);
	border-bottom: 1px solid #ccc;
}

.pro-features:before{
	content: "Pro";
    background-color: var(--hound-pink);
    color: #fff;
    padding: 3px 10px;
    border-radius: 3px;
    margin-bottom: 10px;
	position: inherit;
	z-index: 3;
}

.pro-features:after{
	position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #dedede54;
    z-index: 2;
}