@import url("/sites/zweb/css/common/zc-signup.css");

body:has(.zws-form-section) .zw-product-header,
.quick-connect-links-wrap,
body:has(.zws-form-section) .z-mobile-menu-v2,
.zw-promo-top:not(:has(.zDCnotif-container)) {
	display: none
}

.zws-form-section {
	--zws-input-padding-top: 32px;
	--zws-input-padding-bottom: 8px;
	--zws-placeholder-focus-inset-block-start: 20px;
	--zws-input-non-label-padding-top: 20px;
	--zws-input-non-label-padding-bottom: 20px
}

.zws-header {
	border-bottom: 1px solid var(--sp-header-border);
	position: sticky;
	top: 0;
	background-color: var(--sp-white);
	z-index: 100
}

.zws-header-wrap {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: min(100%, 1920px);
	margin-inline: auto;
	padding: 12px clamp(15px, 4vw, 30px);
	column-gap: 20px
}

body:not(.zw-product-trainercentral):not(.zw-product-zillum) .zws-logo {
	background: var(--zoho-logo-web) no-repeat
}

.zws-logo {
	height: 42px;
	width: 98px;
	background-size: 100% auto;
	background-position: left center;
	display: inline-block;
	font-size: 0
}

.zws-login-text {
	margin: 0;
	font-size: 14px;
	letter-spacing: -0.24px;
	text-align: right
}

.zws-login-text a {
	color: var(--anchor-clr);
	font-family: var(--zf-secondary-bold);
	display: inline-block
}

.zsc-note,
.zws-noregion-note {
	background: var(--sp-note-bg);
	border: 1px dashed var(--sp-note-border);
	padding: 8px 16px;
	width: fit-content;
	margin: 0 auto;
	color: var(--primary-btn-color);
	font-family: var(--primaryfont-semibold);
	font-size: clamp(14px, 3vw, 20px);
	border-radius: 4px;
	text-wrap-style: pretty;
	max-width: 400px
}

@media(prefers-color-scheme:dark) and (max-width:767px) {
	body.zw-page-39806 {
		--sp-header-border: #2a2a2a;
		--sp-section-bg: #121212;
		--sp-text-color: #ffffff8c;
		--sp-label-color: #a0a0a0;
		--sp-check-bx: #22c55e;
		--sp-check-bx-sh: #22c55e;
		--sp-error-color: #ff6060;
		--sp-fc-color: #4d8eff;
		--sp-cta-color: #c0392b;
		--sp-white: #1e1e1e;
		--sp-black: #f0f0f0;
		--sp-input-bg: #2a2a2a;
		--sp-note-bg: #2d2200;
		--sp-note-border: #c49a1a;
		--sp-tooltip-bg: #2e2e2e;
		--sp-tooltip-text: #f0f0f0;
		--sp-defdomain-color: #909090;
		--sp-gradient-start: #0d1f35;
		--sp-info-section-bg: #1a1a2e;
		--sp-shadow-color: rgba(0, 0, 0, 0.35);
		--sp-access-apps-bg: #166534;
		--sp-social-text-color: #aaa;
		--sp-checkbox-checked-border: #166534;
		--sp-radio-border: #555;
		--sp-wallet-note-color: #f0c070;
		--sp-wallet-note-bg: #2a1f00;
		--sp-wallet-note-border: #c49a1a;
		--sp-disabled-color: #555;
		--sp-disabled-bg: #2e2e2e;
		--zs-filter: invert(1) brightness(1000)
	}
}

.zws-form-section:after {
	position: fixed;
	width: 49%;
	inset-block-start: 0;
	inset-block-end: 0;
	inset-inline-end: 0;
	background: linear-gradient(140deg, var(--sp-gradient-start) 29.81%, var(--sp-white) 75.62%);
	z-index: -1;
	height: 100vh
}

.zws-other-info-section:not(:empty) {
	width: min(45%, 480px);
	padding-inline: clamp(32px, 6vw, 48px);
	background-color: var(--sp-info-section-bg);
	padding-block: clamp(32px, 5vw, 48px);
	align-content: center;
	border: 12px solid var(--sp-white);
	border-radius: 24px
}

.zws-other-info-section>div:not(:last-child) {
	margin-block-end: 48px
}

.zws-ot-logo {
	margin-block-end: 15px
}

.zws-ot-logo img {
	border-radius: 20px;
	width: 68px;
	height: 68px
}

.zws-testimonial-quote {
	font-size: clamp(16px, 2vw, 20px);
	line-height: 1.5;
	font-family: var(--secondaryfont-regular);
	margin-block-end: 28px
}

.zws-testimonial-author-name {
	font-size: 16px;
	text-transform: capitalize;
	font-family: var(--zf-primary-bold);
	letter-spacing: -0.32px;
	display: block
}

.zws-testimonial-author span {
	display: block
}

.zws-testimonial-author-designation {
	font-size: 14px;
	letter-spacing: -0.24px;
	line-height: 1.3;
	display: inline-block
}

.zws-testimonial-logo {
	margin-block-end: 12px
}

.zws-testimonial-author-info {
	display: flex;
	gap: 14px;
	align-items: center
}

.zws-testimonial-author-photo {
	min-width: 60px;
	height: 60px;
	width: 60px
}

.zws-testimonial-author-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%
}

.zws-trusted-brand-section :is(p, h5) {
	font-size: 16px
}

.zws-trusted-brand {
	display: flex;
	align-items: stretch;
	background: var(--sp-white);
	gap: 12px;
	flex-wrap: wrap;
	padding: 12px;
	justify-content: space-evenly;
	border-radius: 8px
}

.zws-trusted-brand img {
	padding: 12px;
	max-width: 110px;
	object-fit: contain;
	max-height: 70px
}

.zws-awards-section-lists {
	display: flex;
	align-items: stretch;
	flex-wrap: nowrap;
	gap: 10px;
	flex-wrap: wrap
}

.zws-awards-section-lists img {
	display: block;
	padding: 12px;
	background: var(--sp-white);
	border-radius: 8px;
	width: 100px;
	object-fit: contain;
	box-shadow: var(--sp-shadow-color) 0 0 3px 1px
}

.zws-cuscount-text {
	padding: 24px;
	background: var(--sp-white);
	border-radius: 10px;
	border: 1px solid var(--secondary-color);
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 8px
}

.zws-cuscount-text :is(h2, p) {
	margin: 0
}

.zws-cuscount-text h2 {
	font-size: 48px;
	line-height: 1
}

.zws-mailid-phoneno-container {
	max-width: 600px;
	margin: auto
}

.zwc-contact-sales {
	position: relative
}

.zwc-contact-sales h2 {
	font-family: var(--zf-primary-semibold);
	font-size: 24px;
	margin-bottom: 25px
}

.zwc-contact-list {
	display: flex;
	gap: 40px;
	flex-wrap: wrap
}

.zwc-contact-list>li {
	display: grid;
	grid-template-columns: max-content 1fr;
	grid-template-rows: max-content 1fr;
	grid-gap: 0 15px
}

.zwc-contact-list>li::after {
	content: '';
	display: inline-block;
	grid-row: 1 / 2;
	grid-column: 1 / 2;
	margin-inline: auto;
	position: relative;
	inset-block-start: 16px
}

.zwc-contact-list>li::before {
	content: '';
	display: inline-block;
	height: 50px;
	width: 50px;
	border-radius: 8px;
	grid-row: 1 / 2;
	grid-column: 1 / 2;
	background: var(--sp-white);
	margin-block-start: 3px
}

.zwc-contact-number::after {
	height: 20px;
	width: 20px;
	background-color: var(--sp-contact-phone-color);
	inset-block-start: -40px;
	clip-path: path('M17.374,13.878c-1.2-1.03-2.427-1.654-3.617-.626l-.71.622c-.52.451-1.486,2.56-5.223-1.738S6.311,7.174,6.832,6.727L7.546,6.1c1.184-1.031.737-2.329-.117-3.665L6.914,1.63C6.057.3,5.123-.578,3.936.451l-.641.56A6.019,6.019,0,0,0,.949,4.995c-.428,2.831.922,6.073,4.015,9.629s6.114,5.346,8.979,5.315a6.035,6.035,0,0,0,4.269-1.768l.644-.561c1.184-1.029.448-2.076-.757-3.109l-.724-.623Z')
}

.zwc-contact-list>li p {
	font-size: 15px;
	margin-bottom: 2px;
	font-family: var(--zf-secondary-medium)
}

.zwc-contact-list span {
	display: block;
	font-family: var(--zf-secondary-medium)
}

.zwc-contact-list a {
	color: var(--sp-black);
	font-family: var(--zf-primary-bold);
	white-space: nowrap;
	text-decoration: underline
}

.zwc-contact-mail::after {
	height: 25px;
	width: 25px;
	background-color: var(--sp-contact-mail-color);
	inset-block-start: -40px;
	clip-path: path('M24.335,10.756A11.982,11.982,0,1,0,10.88,24.33a12.409,12.409,0,0,0,1.607.105,11.863,11.863,0,0,0,6.161-1.713,1.159,1.159,0,1,0-1.2-1.986A9.663,9.663,0,1,1,21.6,15.619,1.674,1.674,0,0,1,20,16.706a1.729,1.729,0,0,1-1.727-1.727V7.819a1.159,1.159,0,1,0-2.318,0V7.83a5.8,5.8,0,1,0,.418,8.9A4.037,4.037,0,0,0,20,19.024a3.993,3.993,0,0,0,3.8-2.646,12.005,12.005,0,0,0,.54-5.623ZM12.474,15.933a3.478,3.478,0,1,1,3.478-3.478A3.478,3.478,0,0,1,12.474,15.933Z')
}

.zws-contentfirst-section {
	width: min(55%, 660px);
	padding-block: clamp(60px, 6vw, 70px);
	margin-inline: auto
}

.zws-other-info-section:empty {
	display: none
}

.zws-form-wrap:has(.zws-other-info-section:empty) {
	justify-content: center;
	width: 90%;
	gap: 60px
}

.body-umain.czone-iswallet-page .loggedin-userinfo {
	display: none !important
}

.czone-iswallet-page .ZPprivacy,
.zwc-wallet-credit-sec .coupon-error:empty {
	display: none
}

.zwc-wallet-credit-sec .sgfrm {
	margin-block-end: 12px;
	text-align: left
}

.zwc-wallet-credit-sec .zfield {
	position: relative
}

.zwc-wallet-credit-sec .note {
	font-size: 14px;
	margin-block-end: 16px;
	display: inline-block;
	color: var(--sp-wallet-note-color);
	text-align: left;
	background: var(--sp-wallet-note-bg);
	padding: 8px 12px;
	border-radius: 4px;
	border: 1px dashed var(--sp-wallet-note-border);
	position: relative
}

.zwc-wallet-credit-sec .note b {
	font-family: var(--primaryfont-semibold)
}

.zwc-wallet-credit-sec .sgfrm .zfield input:disabled {
	color: var(--sp-disabled-color);
	background: var(--sp-disabled-bg);
	border: 1px solid var(--sp-disabled-bg)
}

.zwc-wallet-credit-sec .sgfrm .zfield:has(input:disabled) .placeholder {
	background: var(--sp-disabled-bg)
}

.zws-copy-rights,
.zwf-new-footer .zwf-only-copyright ul {
	display: none
}

.zwf-new-footer .zwf-only-copyright p {
	margin: 0;
	text-align: center;
	font-size: 14px;
	width: 100%
}

.body-umain .zws-form-title {
	display: none
}

.body-umain .zws-form-section {
	align-items: center
}

.body-umain .zws-form {
	text-align: center;
	padding-block: 60px;
	margin-block: auto
}

.body-umain .zws-form .username {
	margin-block-end: clamp(18px, 3vw, 20px);
	display: block;
	font-family: var(--zf-primary-bold);
	text-align: center
}

.body-umain .access-apps {
	display: block;
	width: fit-content;
	margin-inline: auto;
	background: var(--sp-access-apps-bg);
	font-family: var(--zf-secondary-semibold);
	text-transform: capitalize;
	min-height: fit-content
}

.other-lang .zws-other-info-section:not(:empty) {
	display: none
}

.other-lang .zws-form-section:after {
	content: none
}

.other-lang .zws-form-wrap {
	justify-content: center
}

.loggedin-userinfo .access-apps {
	padding: 12px 32px
}

h1.zws-form-title {
	font-size: 24px;
	margin-bottom: 8px;
	letter-spacing: -0.48px;
	line-height: 1.2;
	text-wrap-style: pretty
}

.zws-brand-logo {
	margin-bottom: 16px
}

@media(min-width:1600px),
(min-height:1080px) {
	.zws-form-section {
		background: var(--sp-section-bg)
	}

	.zws-form-wrap {
		width: min(100%, 1200px);
		max-width: 1200px;
		margin: 48px auto;
		padding: 16px;
		background: var(--sp-white);
		border-radius: 12px;
		min-height: auto
	}

	.zws-header-wrap {
		width: min(100%, 1260px)
	}

	.zws-other-info-section:not(:empty) {
		width: min(45%, 420px);
		border: 0 solid var(--sp-white);
		border-radius: 8px
	}

	.zws-other-info-section:not(:empty) {
		width: min(45%, 420px);
		border: 0 solid var(--sp-white);
		border-radius: 8px
	}

	.body-umain .zws-form-section {
		align-items: start
	}
}

@media only screen and (min-width:992px) and (max-width:1199px) {
	.zws-form-wrap {
		gap: 0
	}

	.zws-other-info-section:not(:empty) {
		width: min(40%, 400px)
	}
}

@media screen and (max-width:991px) {
	.zws-form-wrap {
		flex-direction: column;
		gap: 0;
		align-items: center;
		width: 100%
	}

	.zws-form-section {
		background: var(--sp-white)
	}

	.zws-cuscount-text {
		justify-content: center;
		width: min(90%, 560px);
		margin: auto
	}

	.zws-other-info-section>div {
		margin-block: 0
	}

	.zws-testimonials-container,
	.zws-form {
		width: min(90%, 480px);
		margin-inline: auto
	}

	.zws-form-wrap .zws-contentfirst-section {
		width: min(90%, 720px);
		padding-bottom: 10px
	}

	.zws-form-wrap:has(.zws-other-info-section:empty) {
		gap: 20px
	}

	.zws-form {
		padding-block-end: 40px
	}

	.zws-ot-logo {
		text-align: center
	}

	.zws-testimonial-quote,
	.zws-testimonial-logo,
	.zws-testimonial-author-data {
		text-align: center
	}

	.zws-testimonial-author,
	.zws-trusted-brand-section,
	.zws-trusted-brand-section p {
		text-align: center
	}

	.zws-trusted-brand {
		justify-content: center
	}

	.zws-testimonial-author-info {
		flex-direction: column
	}

	.zws-other-info-section:not(:empty) {
		padding-block: 60px;
		width: 100%
	}

	.zws-other-info-section {
		display: flex;
		flex-direction: column;
		gap: 60px;
		justify-content: space-between
	}

	.zws-form-wrap {
		height: auto
	}

	.zws-form-section {
		height: auto
	}

	.body-umain .zws-header-wrap {
		justify-content: center
	}
}