/* ============================================
   Webkoob Suite – نمودار قیمت – Frontend
   ============================================ */

:root {
	--wbkb-pc-line-color: var(--wbkb-color-primary, #093C75);
	--wbkb-pc-point-color: var(--wbkb-color-primary, #093C75);
	--wbkb-pc-grid-color: #e5e9ef;
	--wbkb-pc-label-color: #8a94a6;
}

/* ---------------------------------------------
   Trigger Button
--------------------------------------------- */

.wbkb-pc-widget {
	display: inline-flex;
	direction: rtl;
}

.wbkb-pc-trigger {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	background-color: #eef4fb;
	cursor: pointer;
	transition: background-color .2s ease, transform .15s ease;
	line-height: 1;
}

.wbkb-pc-widget.wbkb-pc-has-label .wbkb-pc-trigger {
	width: auto;
	height: auto;
	padding: 10px 16px;
	border-radius: 999px;
}

.wbkb-pc-shape-circle .wbkb-pc-trigger {
	border-radius: 50%;
}

.wbkb-pc-shape-square .wbkb-pc-trigger {
	border-radius: 10px;
}

.wbkb-pc-shape-none .wbkb-pc-trigger {
	background: transparent !important;
}

/* .wbkb-pc-trigger:hover {
	transform: translateY(-1px);
} */

/* .wbkb-pc-trigger:active {
	transform: translateY(0);
} */

.wbkb-pc-trigger.is-loading {
	pointer-events: none;
}

.wbkb-pc-trigger.is-loading .wbkb-pc-trigger-icon {
	display: none;
}

.wbkb-pc-trigger.is-loading .wbkb-pc-trigger-label {
	opacity: .55;
}

.wbkb-pc-trigger-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.wbkb-pc-trigger-icon svg {
	width: 20px;
	height: 20px;
	fill: var(--wbkb-color-primary, #093C75);
}

.wbkb-pc-trigger-icon i {
	color: var(--wbkb-color-primary, #093C75);
	font-size: 20px;
}

.wbkb-pc-trigger-spinner {
	display: none;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	border: 2px solid rgba(9, 60, 117, .2);
	border-top-color: var(--wbkb-color-primary, #093C75);
	animation: wbkb-pc-spin .7s linear infinite;
	flex-shrink: 0;
}

.wbkb-pc-trigger.is-loading .wbkb-pc-trigger-spinner {
	display: inline-block;
}

@keyframes wbkb-pc-spin {
	to {
		transform: rotate(360deg);
	}
}

.wbkb-pc-trigger-label {
	font-size: 14px;
	font-weight: 600;
	color: var(--wbkb-color-primary, #093C75);
	white-space: nowrap;
}

/* ---------------------------------------------
   Modal Overrides
--------------------------------------------- */

.wbkb-pc-dialog {
	width: 700px;
	max-width: 95%;
	direction: rtl;
	text-align: right;
}

.wbkb-pc-modal-title {
	margin: 0 0 6px;
	font-size: 19px;
	font-weight: 700;
	color: #1e1e1e;
	padding-inline-end: 30px;
}

.wbkb-pc-modal-subtitle {
	margin: 0 0 20px;
	font-size: 13px;
	color: #757575;
	line-height: 1.7;
}

/* ---------------------------------------------
   Chart
--------------------------------------------- */

.wbkb-pc-chart-wrap {
	position: relative;
	width: 100%;
	aspect-ratio: 700 / 320;
	direction: ltr; /* محور زمان همیشه از چپ (قدیم) به راست (جدید) رسم می‌شود */
}

.wbkb-pc-loading {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	color: #8a94a6;
	font-size: 13px;
	direction: rtl;
}

.wbkb-pc-svg {
	width: 100%;
	height: 100%;
	display: block;
	overflow: visible;
}

.wbkb-pc-grid-line {
	stroke: var(--wbkb-pc-grid-color);
	stroke-width: 1;
	stroke-dasharray: 4 4;
}

.wbkb-pc-y-label,
.wbkb-pc-x-label {
	fill: var(--wbkb-pc-label-color);
	font-size: 11px;
	font-family: inherit;
	direction: rtl;
	unicode-bidi: plaintext;
}

.wbkb-pc-line {
	fill: none;
	stroke: var(--wbkb-pc-line-color);
	stroke-width: 2.5;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.wbkb-pc-point {
	fill: #fff;
	stroke: var(--wbkb-pc-point-color);
	stroke-width: 2.5;
	cursor: pointer;
	transition: r .15s ease;
}

.wbkb-pc-point:hover,
.wbkb-pc-point.is-active {
	r: 7;
	fill: var(--wbkb-pc-point-color);
}

/* ---------------------------------------------
   Tooltip
--------------------------------------------- */

.wbkb-pc-tooltip {
	position: absolute;
	transform: translate(-50%, -115%);
	background: #fff;
	border: 1px solid #e5e9ef;
	border-radius: 10px;
	box-shadow: 0 10px 30px rgba(0,0,0,.12);
	padding: 10px 14px;
	min-width: 150px;
	text-align: center;
	direction: rtl;
	pointer-events: none;
	opacity: 0;
	transition: opacity .15s ease;
	white-space: nowrap;
	z-index: 5;
}

.wbkb-pc-tooltip.is-visible {
	opacity: 1;
}

.wbkb-pc-tooltip-date {
	font-size: 11px;
	color: #8a94a6;
	margin-bottom: 4px;
}

.wbkb-pc-tooltip-price {
	font-size: 15px;
	font-weight: 700;
	color: #1e1e1e;
}

.wbkb-pc-tooltip-badge {
	display: inline-block;
	margin-top: 5px;
	padding: 2px 8px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
}

.wbkb-pc-tooltip-badge.is-down {
	background: #e8f8ee;
	color: var(--wbkb-color-secondary, #1a9e52);
}

.wbkb-pc-tooltip-badge.is-up {
	background: #fdecec;
	color: #e13c3c;
}

/* ---------------------------------------------
   Responsive
--------------------------------------------- */

@media (max-width: 600px) {

	.wbkb-pc-y-label {
		font-size: 9px;
	}

	.wbkb-pc-x-label {
		font-size: 9px;
	}

	.wbkb-pc-tooltip {
		min-width: 120px;
		padding: 8px 10px;
	}
}
