/*
 * FixnGo basic shared style.
 * Keep this file for tokens, reset, layout, buttons and shared helpers only.
 */

:root {
	--uicolor: #08aef0;
	--uicolor-code: 8 174 240;
	--uicolor2: #117c9e;
	--uicolor2-code: 17 124 158;
	--uicolor3: #072740;
	--uicolor3-code: 7 39 64;
	--uicolor4: #97e6fd;
	--uicolor4-code: 151 230 253;
	--uicolor-gradient: linear-gradient(-90deg, var(--uicolor) 0%, var(--uicolor2) 100%);
	--Text-gradient: linear-gradient(110deg, var(--uicolor4) 0%, var(--uicolor) 30%, var(--uicolor2) 70%, var(--uicolor3) 100%);
	--background: #f5f5f5;
	--background2:var(--background);
	--background-color:var(--background);
	--background-soft:#f4f7f8;
	--surface-color:#fff;
	--surface-soft:color-mix(in srgb,var(--uicolor) 4%,var(--surface-color));
	--on-color:#fff;
	--primary-text: #10182b;
	--secondarytext:#5f6b84;
	--section-title:var(--primary-text);
	--Text-color:var(--primary-text);
	--second-text-color:var(--secondarytext);
	--hover-overlay:#2457e60c;
	--diver2:#f1eadc;
	--diver: #e3e7f0;
	--border:1px solid var(--diver);
	--border-defult:1px solid var(--diver);
	--border-defult-hover:#2457e624;
	--border-hover:var(--border-defult-hover);
	--box-shadow-defult:0 18px 45px rgb(var(--primary-text-code) / 8%);
	--box-shadow-hover:0 24px 55px rgb(var(--primary-text-code) / 12%);
	--container-width:1440px;
	--container-padding--value:40px;
	--container-padding:0 var(--container-padding--value);
	--font-family:"Alexandria","Cairo",sans-serif;
	--f-number:"Plus Jakarta Sans",sans-serif;
	--f-logo:"Alexandria",sans-serif;
	--fsize:14px;
	--miniradius: 10px;
	--largeradius: 15px;
	--xxlargeradius:38px;
	--pading: 60px 0;
	--transition:180ms;
	--success-color:var(--uicolor4);
	--danger-color:#ff4f2f;
	--danger-text:#b42318;
	--danger-surface:color-mix(in srgb,var(--danger-color) 7%,var(--surface-color));
	--warning-color:var(--uicolor3);
	--rating-color:var(--warning-color);
	--info-color:var(--uicolor);
	--whatsapp: #23b879;
	--positive:var(--success-color);
	--negative:var(--danger-color);
	--uicolor2-hover:color-mix(in srgb,var(--uicolor2) 82%,var(--primary-text));
	--media-placeholder:var(--diver2);
	--primary-text-code:20 33 61;
	--background2-code:242 245 253;
	--on-color-code:255 255 255;
	--social-facebook:#1877f2;
	--social-messenger:#7356ff;
	--social-telegram:#229ed9;
	--social-twitter:#15191d;
	--social-pinterest:#e60023;
	--social-instagram:#e4405f;
	--social-youtube:#f00;
	--_fa-family:var(--fa-family,var(--fa-style-family,"Font Awesome 7 Pro"));
	--chevron:"\f053";
	--disable-button:#dfe3e8;
	--disable-text:#7f8794;
}

*,
*::before,
*::after {
	box-sizing:border-box;
}

* {
	margin:0;
	padding:0;
}

.screen-reader-text {
	position:absolute !important;
	width:1px;
	height:1px;
	margin:-1px;
	padding:0;
	border:0;
	overflow:hidden;
	clip:rect(1px,1px,1px,1px);
	clip-path:inset(50%);
	white-space:nowrap;
}

.screen-reader-text:focus {
	z-index:100000;
	inset-block-start:8px;
	inset-inline-start:8px;
	width:auto;
	height:auto;
	margin:0;
	padding:12px 16px;
	clip:auto;
	clip-path:none;
	border-radius:8px;
	background:var(--surface-color);
	color:var(--primary-text);
	box-shadow:var(--box-shadow-defult);
}

.-yourcolor-form-alerts.alert-error {
	margin-block-end:13px;
	padding:9px;
	border:1px solid var(--negative);
	border-radius:14px;
	background:var(--danger-surface);
}

.owl-nav.disabled {
	display:none;
}

.bttop_dook {
	position:fixed;
	inset-inline-end:22px;
	inset-block-end:22px;
	z-index:80;
	display:flex;
	align-items:center;
	flex-direction:column;
	gap:10px;
}

html[dir="ltr"] .bttop_dook {
	inset-block-end: 22px;
}

html {
	scroll-behavior:smooth;
}

body {
	min-height:100vh;
	font-family:var(--font-family);
	font-size:var(--fsize);
	line-height:1.5;
	color:var(--primary-text);
	background: white;
	-webkit-font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
	text-transform: capitalize;
}

a {
	color:inherit;
	text-decoration:none;
}

html[dir="ltr"] .yc-dir-icon {
	transform:scaleX(-1);
}

ul,
ol {
	list-style:none;
}

img,
svg,
video,
canvas {
	max-width:100%;
	height:auto;
}

img {
	display:block;
}

button,
input,
textarea,
select {
	font:inherit;
}

button {
	border:0;
	color:inherit;
	background:transparent;
	cursor:pointer;
}

textarea {
	width:100%;
	min-height:110px;
	resize:vertical;
}

.container {
	width:100%;
	max-width:var(--container-width);
	margin:0 auto;
	padding:var(--container-padding);
}

.largerContainer {
	--container-width:1620px;
}

.-primary-body {
	position:relative;
	padding: 160px 0 50px;
}

.-ycw-sections,
.-ycw-section,
.-ycw-row {
	width:100%;
}

.-ycw-section {
	position:relative;
	padding:var(--pading);
}

.wdt_mode .-ycw-section:first-child {
	background:var(--surface-color) !important;
    padding-top: 20px;
}

.g-content {
	width:100%;
	max-width:850px;
	min-width:0;
	margin:0 auto 28px;
	text-align:center;
}

.betit-w {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	margin-block-end:8px;
	color:var(--uicolor);
	font-size: 18px;
	font-weight:800;
}

.tit-wdt {
	margin:0;
	color:var(--primary-text);
	font-size: 36px;
	font-weight: 700;
	line-height: 1.8;
	letter-spacing:-.5px;
}

.tit-wdt strong,
c--color {
	font-weight: 700;
	background: var(--Text-gradient);
	background-size: 200% auto;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	display: inline-block;
}

.topn-mark {
	display:block;
	width: 180px;
	height:20px;
	margin:8px auto 0;
	border-block-start:5px solid var(--uicolor);
	border-radius:50%;
	transform:rotate(-2deg);
}

.con-wgt {
	min-width:0;
	margin:10px auto 0;
	color:var(--secondarytext);
	font-size: 16px;
	font-weight:400;
	line-height:1.8;
	overflow-wrap:anywhere;
}

.con-wgt p {
	margin:0;
}

.wgt-hd {
	display:flex;
	align-items: center;
	justify-content:space-between;
	gap:24px;
	margin-block-end:34px;
}

.wgt-hd .g-content {
	max-width:850px;
	min-width:0;
	margin:0;
	text-align:start;
}

.wgt-hd .con-wgt {
	margin-inline:0;
}

.wgt-all {
	display:flex;
	align-items:center;
	gap:8px;
	flex:0 0 auto;
	padding-block-end:3px;
	color:var(--uicolor);
	font-size: 18px;
	font-weight:900;
}

.wgt-all i {
	transition:transform var(--transition),translate var(--transition);
}

.wgt-all:hover i {
	translate:-3px 0;
}

.-dURLArea,
.archive-btm,
.yc-widget-actions,
.yc-widget-loadmore-wrap {
	display:flex;
	align-items:center;
	justify-content:center;
	flex-wrap:wrap;
	gap:14px;
}

.--BTN,
.yc-widget-btn {
	flex:0 1 auto;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	max-width:100%;
	min-width:0;
}

.--BTN > a,
.--BTN.activable,
a.--BTN,
.yc-widget-loadmore {
	position:relative;
	z-index:0;
	isolation:isolate;
	max-width:100%;
	min-width:0;
	min-height:52px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	padding:0 24px;
	border:1px solid transparent;
	border-radius: 74px;
	color:var(--on-color);
	background:var(--uicolor-gradient);
	box-shadow:0 14px 28px rgb(var(--uicolor2-code) / 18%);
	font-weight: 500;
	font-size:16px;
	line-height:1.3;
	text-align:center;
	overflow-wrap:anywhere;
	touch-action:manipulation;
	transition:transform var(--transition),box-shadow var(--transition),background var(--transition),color var(--transition),border-color var(--transition);
}

.--BTN > a::after,
.--BTN.activable::after,
a.--BTN::after,
.yc-widget-loadmore::after {
	content:"";
	position:absolute;
	inset:0;
	z-index:-1;
	display:inline-block;
	width:100%;
	height:100%;
	border-radius:inherit;
	background:inherit;
	pointer-events:none;
	transition: transform .4s ease,opacity .4s ease;
}

.--BTN > a:hover,
.--BTN.activable:hover,
a.--BTN:hover,
.yc-widget-loadmore:hover {
	box-shadow:0 18px 34px rgb(var(--uicolor-code) / 22%);
	transform:translateY(-2px);
}

.--BTN > a:hover::after,
.--BTN.activable:hover::after,
a.--BTN:hover::after,
.yc-widget-loadmore:hover::after {
	transform:scaleX(1.2) scaleY(1.4);
	opacity:0;
}

.--BTN._url_2 > a,
.--BTN > a._url_2,
.yc-widget-btn._url_2 > a {
	color: white;
	background: var(--uicolor);
	border-color:var(--diver);
	box-shadow:none;
}

.--BTN._url_2 > a:hover,
.--BTN > a._url_2:hover,
.yc-widget-btn._url_2 > a:hover {
	color:var(--on-color);
	background:var(--uicolor);
	border-color:var(--uicolor);
}

.--BTN i,
.yc-widget-loadmore i {
	line-height:1;
}

.activable:active,
.yc-widget-loadmore:active {
	transform:translateY(0) scale(.98);
}

.is-btn-loader {
	position:relative;
	pointer-events:none;
}

.is-btn-loader > *:not(.-button-loader) {
	opacity:0;
}

.-button-loader {
	position:absolute;
	inset:0;
	display:flex;
	align-items:center;
	justify-content:center;
}

.-button-loader svg {
	width:26px;
	height:26px;
	animation:yc-rotate 1s linear infinite;
}

.-button-loader .path {
	stroke:currentColor;
	stroke-linecap:round;
}

@keyframes yc-rotate {
	100% {
		transform:rotate(360deg);
	}
}

.--empty-attchment-area {
	width:100%;
	min-height:360px;
	display:flex;
	align-items:center;
	justify-content:center;
	flex-direction:column;
	gap:18px;
	padding:42px;
	border:1px dashed var(--diver);
	border-radius:var(--largeradius);
	color:var(--secondarytext);
	background:var(--surface-color);
	text-align:center;
}

.--empty-attchment-svg-v1 {
	width:120px;
	height:120px;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:50%;
	color:var(--uicolor);
	background:rgb(var(--uicolor-code) / 10%);
	font-size:48px;
}

.--empty-attchment-description {
	max-width:520px;
	min-width:0;
	color:var(--secondarytext);
	font-size:16px;
	line-height:1.8;
	overflow-wrap:anywhere;
}

.--empty-attchment-actions {
	display:flex;
	align-items:center;
	justify-content:center;
	flex-wrap:wrap;
	gap:12px;
}

.whatsapp { --sociaColor:var(--whatsapp); }
.facebook { --sociaColor:var(--social-facebook); }
.twitter { --sociaColor:var(--social-twitter); }
.telegram { --sociaColor:var(--social-telegram); }
.linkedin { --sociaColor:var(--uicolor); }
.instagram { --sociaColor:var(--social-instagram); }
.youtube { --sociaColor:var(--social-youtube); }
.threads { --sociaColor:var(--social-twitter); }

.btn-fixed-bh {
	position:fixed;
	inset-inline-start: 22px;
	inset-block-end: 31px;
	z-index:80;
	display:flex;
	align-items:center;
	flex-direction:column;
	gap:10px;
}

html[dir="ltr"] .btn-fixed-bh {
	inset-block-end:31px;
}

.--YourColor--phone-button,
.--YourColor--whatsapp-button,
.--YourColor--share-button,
.--YourColor--cta-button,
.GotoTop {
	width:54px;
	height:54px;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:50%;
	color:var(--on-color);
	background:var(--uicolor);
	box-shadow:0 14px 30px rgb(var(--primary-text-code) / 14%);
	font-size:20px;
	transition:transform var(--transition),background var(--transition),box-shadow var(--transition);
}

.--YourColor--phone-button > a,
.--YourColor--whatsapp-button > a,
.--YourColor--share-button > a,
.--YourColor--cta-button > a {
	width:100%;
	height:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:inherit;
	touch-action:manipulation;
}

.--yourcolor--button--phones.--YourColor--cta-button span {
	display:none;
}

.--YourColor--whatsapp-button {
	background:var(--whatsapp);
}

.--YourColor--share-button {
	background:var(--primary-text);
}

.GotoTop {
	opacity:0;
	visibility:hidden;
	transform:translateY(10px);
	display: none;
	background: var(--uicolor3);
	cursor: pointer;
}
 
.GotoTop.visible {
	display:flex;
	opacity:1;
	visibility:visible;
	transform:translateY(0);
}

.GotoTop.active {
	opacity:1;
	visibility:visible;
	transform:translateY(0);
}

.--YourColor--phone-button:hover,
.--YourColor--whatsapp-button:hover,
.--YourColor--share-button:hover,
.--YourColor--cta-button:hover,
.GotoTop:hover {
	color:var(--on-color);
	transform:translateY(-3px);
	box-shadow:0 18px 38px rgb(var(--primary-text-code) / 18%);
}

.--YourColor--phone-button:active,
.--YourColor--whatsapp-button:active,
.--YourColor--share-button:active,
.--YourColor--cta-button:active,
.GotoTop:active {
	transform:translateY(0) scale(.96);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
	outline:3px solid rgb(var(--uicolor-code) / 34%);
	outline-offset:3px;
}

/* =========================
   Tablet Responsive
========================= */

@media only screen and (max-width:1024px) {
	:root {
		--container-padding--value:28px;
		--pading:64px 0;
	}
}

/* =========================
   Mobile App Experience
========================= */

@media only screen and (max-width:767px) {
	:root {
		--container-padding--value:18px;
		--pading:52px 0;
		--largeradius:20px;
		--xxlargeradius:28px;
	}

	.-primary-body {
		padding:90px 0;
	}

	.g-content {
		margin-block-end:24px;
		text-align:start;
	}

	.betit-w {
		font-size:14px;
		line-height:1.5;
	}

	.tit-wdt {
		font-size: 23px;
		line-height:1.55;
		letter-spacing:-.4px;
		overflow-wrap:anywhere;
	}

	.topn-mark {
		width:90px;
		height:14px;
		margin-inline:0 auto;
		border-block-start-width:4px;
	}

	.con-wgt {
		margin-block-start:12px;
		font-size:15px;
		line-height:1.75;
	}

	.wgt-hd {
		align-items:flex-start;
		gap:14px;
		margin-block-end:24px;
	}

	.wgt-hd .g-content {
		margin:0;
	}

	.wgt-all {
		width:44px;
		height:44px;
		min-width:44px;
		min-height:44px;
		justify-content:center;
		padding:0;
		border-radius:50%;
		background:rgb(var(--uicolor-code) / 8%);
	}

	.wgt-all span {
		display:none;
	}

	.-dURLArea,
	.archive-btm,
	.yc-widget-actions,
	.yc-widget-loadmore-wrap {
		align-items:stretch;
		gap:10px;
	}

	.-dURLArea > .--BTN:not(:only-child),
	.yc-widget-actions > .yc-widget-btn:not(:only-child) {
		flex:1 1 calc(50% - 5px);
		max-width:calc(50% - 5px);
	}

	.--BTN > a,
	.--BTN.activable,
	a.--BTN,
	.yc-widget-loadmore {
		min-height:46px;
		padding-inline:18px;
		border-radius:13px;
	}

	.--empty-attchment-area {
		min-height:280px;
		padding:28px 18px;
		border-radius:18px;
	}

	.--empty-attchment-area > .--empty-attchment-svg-v1 {
		width:96px;
		height:96px;
		font-size:40px;
	}

	.--empty-attchment-area > h1 {
		line-height:1.45;
		overflow-wrap:anywhere;
	}

	.btn-fixed-bh {
		inset-inline-start:14px;
		gap:8px;
	}

	.bttop_dook {
		inset-inline-end:14px;
		inset-block-end:max(22px, env(safe-area-inset-bottom));
		gap:8px;
	}

	html[dir="ltr"] .btn-fixed-bh {
		inset-block-end:max(31px, env(safe-area-inset-bottom));
	}

	html[dir="ltr"] .bttop_dook {
		inset-block-end:max(92px, env(safe-area-inset-bottom));
	}

	.--YourColor--phone-button,
	.--YourColor--whatsapp-button,
	.--YourColor--share-button,
	.--YourColor--cta-button,
	.GotoTop {
		width:48px;
		height:48px;
		font-size:18px;
	}
}

/* =========================
   Small Mobile Adjustments
========================= */

@media only screen and (max-width:390px) {
	:root {
		--container-padding--value:14px;
		--pading:44px 0;
		--largeradius:18px;
		--xxlargeradius:24px;
	}

	.-primary-body {
		padding:84px 0 44px;
	}

	.g-content {
		margin-block-end:20px;
	}

	.tit-wdt {
		font-size: 22px;
		line-height:1.5;
	}

	.con-wgt {
		font-size:14px;
		line-height:1.7;
	}

	.topn-mark {
		width:78px;
		height:12px;
		margin-block-start:6px;
	}

	.wgt-hd {
		gap:10px;
		margin-block-end:20px;
	}

	.-dURLArea > .--BTN:not(:only-child),
	.yc-widget-actions > .yc-widget-btn:not(:only-child) {
		flex:1 1 100%;
		max-width:100%;
		width:100%;
	}

	.-dURLArea > .--BTN:not(:only-child) > a,
	.yc-widget-actions > .yc-widget-btn:not(:only-child) > a {
		width:100%;
	}

	.--BTN > a,
	.--BTN.activable,
	a.--BTN,
	.yc-widget-loadmore {
		min-height:48px;
		padding-inline:16px;
		font-size:15px;
	}

	.--empty-attchment-area {
		min-height:240px;
		gap:14px;
		padding:24px 16px;
	}

	.--empty-attchment-area > .--empty-attchment-svg-v1 {
		width:82px;
		height:82px;
		font-size:34px;
	}

	.--empty-attchment-description {
		font-size:14px;
		line-height:1.7;
	}

	.btn-fixed-bh {
		inset-inline-start:12px;
		gap:7px;
	}

	.bttop_dook {
		inset-inline-end:12px;
		gap:7px;
	}

	.--YourColor--phone-button,
	.--YourColor--whatsapp-button,
	.--YourColor--share-button,
	.--YourColor--cta-button,
	.GotoTop {
		width:46px;
		height:46px;
		font-size:17px;
	}
}

@media (hover:none) and (pointer:coarse) {
	a,
	button {
		-webkit-tap-highlight-color:transparent;
	}

	.--BTN > a:hover,
	.--BTN.activable:hover,
	a.--BTN:hover,
	.yc-widget-loadmore:hover,
	.--YourColor--phone-button:hover,
	.--YourColor--whatsapp-button:hover,
	.--YourColor--share-button:hover,
	.--YourColor--cta-button:hover,
	.GotoTop:hover {
		transform:none;
	}

	.--BTN > a:hover::after,
	.--BTN.activable:hover::after,
	a.--BTN:hover::after,
	.yc-widget-loadmore:hover::after {
		transform:none;
		opacity:1;
	}

	.wgt-all:hover i {
		translate:0;
	}
}

@media (prefers-reduced-motion:reduce) {
	*,
	*::before,
	*::after {
		scroll-behavior:auto !important;
		transition-duration:.01ms !important;
		animation-duration:.01ms !important;
		animation-iteration-count:1 !important;
	}
}
