/**
 * Tak Center Modern Persian (Jalali) DatePicker Styles
 *
 * Designed with IRANYekanX typography, sleek cards, micro-animations,
 * and high-density RTL layout.
 */

:root {
	--tk-jdp-primary: #0284c7;
	--tk-jdp-primary-hover: #0369a1;
	--tk-jdp-primary-light: #f0f9ff;
	--tk-jdp-today-border: #38bdf8;
	--tk-jdp-ink: #0f172a;
	--tk-jdp-muted: #64748b;
	--tk-jdp-border: #e2e8f0;
	--tk-jdp-bg: #ffffff;
	--tk-jdp-disabled: #cbd5e1;
	--tk-jdp-radius: 14px;
	--tk-jdp-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.12), 0 8px 10px -6px rgba(0, 0, 0, 0.08);
}

/* ==========================================================================
   Checkout Quick Delivery Day Cards & Input Wrapper
   ========================================================================== */
.tk-delivery-date-cards-wrap {
	margin-bottom: 14px;
}

.tk-delivery-day-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
	gap: 10px;
	margin-bottom: 12px;
}

.tk-delivery-day-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 10px 8px;
	background: #ffffff;
	border: 1.5px solid var(--tk-jdp-border);
	border-radius: 10px;
	cursor: pointer;
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
	text-align: center;
	user-select: none;
	position: relative;
}

.tk-delivery-day-card:hover {
	border-color: var(--tk-jdp-primary);
	background: #f8fafc;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(2, 132, 199, 0.08);
}

.tk-delivery-day-card.is-selected {
	border-color: var(--tk-jdp-primary);
	background: #f0f9ff;
	box-shadow: 0 0 0 1px var(--tk-jdp-primary);
}

.tk-delivery-day-card.is-selected .tk-day-card-name {
	color: var(--tk-jdp-primary);
	font-weight: 800;
}

.tk-delivery-day-card .tk-day-card-badge {
	font-size: 10.5px;
	font-weight: 700;
	padding: 2px 6px;
	border-radius: 4px;
	margin-bottom: 4px;
	background: #e2e8f0;
	color: #475569;
}

.tk-delivery-day-card.is-today .tk-day-card-badge {
	background: #fef2f2;
	color: #e11d48;
}

.tk-delivery-day-card.is-tomorrow .tk-day-card-badge {
	background: #ecfdf5;
	color: #059669;
}

.tk-delivery-day-card .tk-day-card-name {
	font-size: 13px;
	font-weight: 700;
	color: var(--tk-jdp-ink);
	margin-bottom: 2px;
}

.tk-delivery-day-card .tk-day-card-date {
	font-size: 11.5px;
	color: var(--tk-jdp-muted);
}

.tk-delivery-custom-date-row {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 10px;
}

.tk-delivery-datepicker-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--tk-jdp-primary);
	background: #ffffff;
	border: 1px dashed var(--tk-jdp-primary);
	border-radius: 8px;
	cursor: pointer;
	transition: all 0.2s;
}

.tk-delivery-datepicker-btn:hover {
	background: var(--tk-jdp-primary-light);
	border-style: solid;
}

/* ==========================================================================
   Jalali Popover Calendar Widget
   ========================================================================== */
.tk-jdp-modal-backdrop {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(15, 23, 42, 0.4);
	backdrop-filter: blur(2px);
	z-index: 99998;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease;
}

.tk-jdp-modal-backdrop.is-open {
	opacity: 1;
	pointer-events: auto;
}

.tk-jdp-popover {
	position: absolute;
	width: 310px;
	background: var(--tk-jdp-bg);
	border: 1px solid var(--tk-jdp-border);
	border-radius: var(--tk-jdp-radius);
	box-shadow: var(--tk-jdp-shadow);
	padding: 16px;
	z-index: 99999;
	font-family: inherit;
	color: var(--tk-jdp-ink);
	box-sizing: border-box;
	display: none;
	opacity: 0;
	transform: translateY(6px);
	transition: opacity 0.2s ease, transform 0.2s ease;
}

.tk-jdp-popover.is-open {
	display: block;
	opacity: 1;
	transform: translateY(0);
}

/* Mobile Bottom Sheet style */
@media (max-width: 640px) {
	.tk-jdp-popover.is-mobile-fixed {
		position: fixed !important;
		top: 50% !important;
		left: 50% !important;
		right: auto !important;
		bottom: auto !important;
		transform: translate(-50%, -50%) !important;
		width: 90% !important;
		max-width: 340px !important;
		margin: 0 !important;
	}
}

/* Header */
.tk-jdp-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 14px;
	padding-bottom: 10px;
	border-bottom: 1px solid #f1f5f9;
}

.tk-jdp-title {
	font-size: 14.5px;
	font-weight: 800;
	color: var(--tk-jdp-ink);
	display: flex;
	align-items: center;
	gap: 6px;
}

.tk-jdp-nav-btns {
	display: flex;
	align-items: center;
	gap: 4px;
}

.tk-jdp-nav-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 8px;
	border: 1px solid var(--tk-jdp-border);
	background: #f8fafc;
	color: var(--tk-jdp-ink);
	cursor: pointer;
	transition: all 0.15s;
	padding: 0;
}

.tk-jdp-nav-btn:hover {
	background: var(--tk-jdp-primary-light);
	border-color: var(--tk-jdp-primary);
	color: var(--tk-jdp-primary);
}

.tk-jdp-nav-btn svg {
	width: 16px;
	height: 16px;
	stroke-width: 2.2;
}

/* Weekday header */
.tk-jdp-weekdays {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	text-align: center;
	margin-bottom: 8px;
	gap: 2px;
}

.tk-jdp-weekday {
	font-size: 11.5px;
	font-weight: 700;
	color: var(--tk-jdp-muted);
	padding: 4px 0;
}

.tk-jdp-weekday.is-friday {
	color: #e11d48;
}

/* Days Grid */
.tk-jdp-days {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 4px;
}

.tk-jdp-day {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 34px;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	color: var(--tk-jdp-ink);
	background: transparent;
	border: 1px solid transparent;
	cursor: pointer;
	transition: all 0.15s;
	padding: 0;
	user-select: none;
}

.tk-jdp-day:hover:not(.is-disabled):not(.is-selected) {
	background: var(--tk-jdp-primary-light);
	color: var(--tk-jdp-primary);
	border-color: #bae6fd;
}

.tk-jdp-day.is-today {
	border-color: var(--tk-jdp-today-border);
	background: #f0fdf4;
	color: #166534;
	font-weight: 800;
}

.tk-jdp-day.is-selected {
	background: var(--tk-jdp-primary) !important;
	color: #ffffff !important;
	font-weight: 800 !important;
	box-shadow: 0 3px 8px rgba(2, 132, 199, 0.3);
}

.tk-jdp-day.is-disabled {
	color: var(--tk-jdp-disabled);
	cursor: not-allowed;
	opacity: 0.45;
	pointer-events: none;
}

.tk-jdp-day.is-friday:not(.is-disabled):not(.is-selected) {
	color: #e11d48;
}

.tk-jdp-day.is-empty {
	pointer-events: none;
	visibility: hidden;
}

/* Footer / Actions */
.tk-jdp-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 14px;
	padding-top: 10px;
	border-top: 1px solid #f1f5f9;
}

.tk-jdp-btn-action {
	font-size: 11.5px;
	font-weight: 700;
	padding: 4px 10px;
	border-radius: 6px;
	border: 1px solid var(--tk-jdp-border);
	background: #f8fafc;
	color: var(--tk-jdp-muted);
	cursor: pointer;
	transition: all 0.15s;
}

.tk-jdp-btn-action:hover {
	background: #e2e8f0;
	color: var(--tk-jdp-ink);
}

.tk-jdp-btn-action.btn-today {
	color: var(--tk-jdp-primary);
	border-color: #bae6fd;
	background: var(--tk-jdp-primary-light);
}

.tk-jdp-btn-action.btn-today:hover {
	background: #e0f2fe;
}
