/**
 * Dentalora Pricing Plans Pro — Widget Stylesheet
 *
 * Matches the premium design from the reference screenshot:
 * pill navigation tabs, three-column cards, dark featured card,
 * soft shadows, smooth tab transitions, stagger entry animations.
 *
 * @package DentaloraCore
 * @since   1.2.0
 */

/* ─────────────────────────────────────────────────────────────────────────────
   CSS CUSTOM PROPERTIES (Design Tokens)
   Override via Elementor selectors controls on {{WRAPPER}}.
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-wrap {
	/* Tab pill tokens */
	--dnl-pt-tab-bg:           #f0ece6;
	--dnl-pt-tab-active-bg:    #ffffff;
	--dnl-pt-tab-hover-bg:     rgba(255,255,255,0.7);
	--dnl-pt-tab-color:        #5a5550;
	--dnl-pt-tab-active-color: #2c2420;
	--dnl-pt-tab-radius:       999px;
	--dnl-pt-tab-gap:          4px;
	--dnl-pt-tab-pad-v:        10px;
	--dnl-pt-tab-pad-h:        22px;
	--dnl-pt-tab-shadow:       0 1px 4px rgba(0,0,0,0.08);
	--dnl-pt-tab-font-size:    0.9375rem;
	--dnl-pt-tab-font-weight:  500;
	--dnl-pt-tab-anim:         260ms;

	/* Card tokens */
	--dnl-pt-card-bg:          #ffffff;
	--dnl-pt-card-hover-bg:    #ffffff;
	--dnl-pt-card-radius:      24px;
	--dnl-pt-card-pad:         36px 32px;
	--dnl-pt-card-gap:         20px;
	--dnl-pt-card-min-h:       auto;
	--dnl-pt-card-shadow:      0 4px 32px rgba(44,36,32,0.08);
	--dnl-pt-card-shadow-hover:0 12px 48px rgba(44,36,32,0.14);
	--dnl-pt-card-border-width:1px;
	--dnl-pt-card-border-color:#ece8e2;
	--dnl-pt-card-border-style:solid;

	/* Featured card tokens */
	--dnl-pt-feat-bg:          #2c3d30;
	--dnl-pt-feat-hover-bg:    #324537;
	--dnl-pt-feat-scale:       1.035;
	--dnl-pt-feat-offset:      -8px;
	--dnl-pt-feat-shadow:      0 16px 64px rgba(44,61,48,0.28);
	--dnl-pt-feat-glow:        rgba(179,155,93,0.18);
	--dnl-pt-feat-glow-spread: 16px;
	--dnl-pt-feat-border-color:rgba(255,255,255,0.10);

	/* Badge tokens */
	--dnl-pt-badge-bg:         #b39b5d;
	--dnl-pt-badge-color:      #ffffff;
	--dnl-pt-badge-radius:     999px;
	--dnl-pt-badge-font-size:  0.6875rem;
	--dnl-pt-badge-font-weight:700;
	--dnl-pt-badge-pad:        5px 14px;

	/* Plan name */
	--dnl-pt-name-color:       #8a7a6a;
	--dnl-pt-name-size:        0.7rem;
	--dnl-pt-name-weight:      700;
	--dnl-pt-name-spacing:     0.12em;

	/* Price */
	--dnl-pt-price-color:      #2c2420;
	--dnl-pt-price-size:       clamp(2.4rem, 4vw, 3.25rem);
	--dnl-pt-price-weight:     700;
	--dnl-pt-currency-size:    1.5rem;
	--dnl-pt-currency-valign:  0.35em;
	--dnl-pt-period-color:     #b39b5d;
	--dnl-pt-period-size:      0.85rem;

	/* Description */
	--dnl-pt-desc-color:       #6b6460;
	--dnl-pt-desc-size:        0.9rem;
	--dnl-pt-desc-line-height: 1.65;

	/* Feature list */
	--dnl-pt-feat-list-gap:    10px;
	--dnl-pt-icon-size:        15px;
	--dnl-pt-icon-color-on:    #4a7c5a;
	--dnl-pt-icon-color-off:   #aaa;
	--dnl-pt-feat-text-color:  #3d3530;
	--dnl-pt-feat-off-color:   #aaa9a7;
	--dnl-pt-feat-off-opacity: 0.7;
	--dnl-pt-feat-font-size:   0.875rem;

	/* Button */
	--dnl-pt-btn-radius:       10px;
	--dnl-pt-btn-pad:          14px 28px;
	--dnl-pt-btn-font-size:    0.9375rem;
	--dnl-pt-btn-font-weight:  600;
	--dnl-pt-btn-transition:   220ms ease;

	/* Outline button */
	--dnl-pt-btn-outline-bg:         transparent;
	--dnl-pt-btn-outline-color:      #2c2420;
	--dnl-pt-btn-outline-border:     #c8c2ba;
	--dnl-pt-btn-outline-hover-bg:   #f5f1ec;
	--dnl-pt-btn-outline-hover-color:#2c2420;

	/* Solid (featured) button */
	--dnl-pt-btn-solid-bg:           #b39b5d;
	--dnl-pt-btn-solid-color:        #ffffff;
	--dnl-pt-btn-solid-hover-bg:     #9c8549;
	--dnl-pt-btn-solid-hover-color:  #ffffff;

	/* Ghost button */
	--dnl-pt-btn-ghost-bg:           transparent;
	--dnl-pt-btn-ghost-color:        rgba(255,255,255,0.85);
	--dnl-pt-btn-ghost-border:       rgba(255,255,255,0.25);
	--dnl-pt-btn-ghost-hover-bg:     rgba(255,255,255,0.10);
	--dnl-pt-btn-ghost-hover-color:  #ffffff;

	/* Footer note */
	--dnl-pt-footer-color:     #a09890;
	--dnl-pt-footer-size:      0.78rem;

	/* Ribbon */
	--dnl-pt-ribbon-bg:        #b39b5d;
	--dnl-pt-ribbon-color:     #ffffff;
	--dnl-pt-ribbon-font-size: 0.7rem;
	--dnl-pt-ribbon-font-weight:700;

	/* Animations */
	--dnl-pt-anim-duration:    320ms;
	--dnl-pt-stagger-base:     60ms;

	/* Layout */
	--dnl-pt-cols:             3;
	--dnl-pt-card-w:           1fr;
}

/* ─────────────────────────────────────────────────────────────────────────────
   WRAPPER
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-wrap {
	box-sizing: border-box;
	font-family: inherit;
}

.dnl-ptp-wrap *,
.dnl-ptp-wrap *::before,
.dnl-ptp-wrap *::after {
	box-sizing: inherit;
}

/* ─────────────────────────────────────────────────────────────────────────────
   TAB NAVIGATION PILLS
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-tabs-outer {
	display: flex;
	justify-content: center;
	margin-bottom: 40px;
}

.dnl-ptp-tablist {
	display: inline-flex;
	align-items: center;
	gap: var(--dnl-pt-tab-gap);
	background: var(--dnl-pt-tab-bg);
	border-radius: var(--dnl-pt-tab-radius);
	padding: 5px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.dnl-ptp-tablist::-webkit-scrollbar {
	display: none;
}

.dnl-ptp-tab {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: var(--dnl-pt-tab-pad-v) var(--dnl-pt-tab-pad-h);
	border-radius: var(--dnl-pt-tab-radius);
	border: none;
	cursor: pointer;
	font-size: var(--dnl-pt-tab-font-size);
	font-weight: var(--dnl-pt-tab-font-weight);
	font-family: inherit;
	color: var(--dnl-pt-tab-color);
	background: transparent;
	transition:
		background var(--dnl-pt-tab-anim) ease,
		color var(--dnl-pt-tab-anim) ease,
		box-shadow var(--dnl-pt-tab-anim) ease;
	white-space: nowrap;
	line-height: 1;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
}

.dnl-ptp-tab:hover:not(.is-active) {
	background: var(--dnl-pt-tab-hover-bg);
	color: var(--dnl-pt-tab-active-color);
}

.dnl-ptp-tab.is-active,
.dnl-ptp-tab[aria-selected="true"] {
	background: var(--dnl-pt-tab-active-bg);
	color: var(--dnl-pt-tab-active-color);
	box-shadow: var(--dnl-pt-tab-shadow);
}

.dnl-ptp-tab:focus-visible {
	outline: 2px solid var(--dnl-pt-btn-solid-bg);
	outline-offset: 2px;
}

.dnl-ptp-tab-icon {
	display: inline-flex;
	align-items: center;
	font-size: 1em;
}

/* ─────────────────────────────────────────────────────────────────────────────
   TAB PANELS
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-panel {
	display: none;
	opacity: 0;
	transform: translateY(10px);
	transition:
		opacity var(--dnl-pt-anim-duration) ease,
		transform var(--dnl-pt-anim-duration) ease;
}

.dnl-ptp-panel.is-active {
	display: grid;
}

.dnl-ptp-panel.is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* ─────────────────────────────────────────────────────────────────────────────
   CARDS GRID
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-panel {
	grid-template-columns: repeat(var(--dnl-pt-cols), var(--dnl-pt-card-w));
	gap: var(--dnl-pt-card-gap);
	align-items: start;
}

/* Equal height */
.dnl-ptp-wrap.equal-height .dnl-ptp-panel {
	align-items: stretch;
}

/* 2 col */
.dnl-ptp-wrap.cols-2 { --dnl-pt-cols: 2; }
/* 4 col */
.dnl-ptp-wrap.cols-4 { --dnl-pt-cols: 4; }

/* ─────────────────────────────────────────────────────────────────────────────
   PRICING CARD BASE
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--dnl-pt-card-bg);
	border-radius: var(--dnl-pt-card-radius);
	border: var(--dnl-pt-card-border-width) var(--dnl-pt-card-border-style) var(--dnl-pt-card-border-color);
	box-shadow: var(--dnl-pt-card-shadow);
	padding: var(--dnl-pt-card-pad);
	min-height: var(--dnl-pt-card-min-h);
	transition:
		transform var(--dnl-pt-anim-duration) ease,
		box-shadow var(--dnl-pt-anim-duration) ease,
		background var(--dnl-pt-anim-duration) ease,
		opacity var(--dnl-pt-anim-duration) ease;
	overflow: hidden;
}

/*
 * Only hide cards initially when JS has confirmed it is running
 * (the init() method adds .dnl-pt-js to the wrapper).
 * Without JS the cards are always fully visible — no blank page.
 */
.dnl-pt-js .dnl-ptp-card {
	opacity: 0;
	transform: translateY(20px);
}

/* Stagger reveal — scoped to JS-initialised wrappers */
.dnl-pt-js .dnl-ptp-card.dnl-card-visible {
	opacity: 1;
	transform: translateY(0);
}

/* Hover lift */
.dnl-ptp-wrap.hover-lift .dnl-ptp-card:hover {
	transform: translateY(-6px);
	box-shadow: var(--dnl-pt-card-shadow-hover);
}

/* Scale hover */
.dnl-ptp-wrap.hover-scale .dnl-ptp-card:hover {
	transform: scale(1.02);
}

/* Shadow hover */
.dnl-ptp-wrap.hover-shadow .dnl-ptp-card:hover {
	box-shadow: var(--dnl-pt-card-shadow-hover);
}

/* Glow hover */
.dnl-ptp-wrap.hover-glow .dnl-ptp-card:not(.is-featured):hover {
	box-shadow:
		var(--dnl-pt-card-shadow-hover),
		0 0 0 var(--dnl-pt-feat-glow-spread) var(--dnl-pt-feat-glow);
}

/* ─────────────────────────────────────────────────────────────────────────────
   FEATURED CARD
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-card.is-featured {
	background: var(--dnl-pt-feat-bg);
	border-color: var(--dnl-pt-feat-border-color);
	box-shadow: var(--dnl-pt-feat-shadow);
	transform: scale(var(--dnl-pt-feat-scale)) translateY(var(--dnl-pt-feat-offset));
	color: rgba(255,255,255,0.9);
}

/* Featured card — restore after JS stagger reveal */
.dnl-pt-js .dnl-ptp-card.is-featured.dnl-card-visible {
	transform: scale(var(--dnl-pt-feat-scale)) translateY(var(--dnl-pt-feat-offset));
}

/* Legacy selector kept for backward compat */
.dnl-ptp-card.is-featured.dnl-card-visible {
	transform: scale(var(--dnl-pt-feat-scale)) translateY(var(--dnl-pt-feat-offset));
}

/* Hover state for featured card */
.dnl-ptp-wrap.hover-lift .dnl-ptp-card.is-featured:hover,
.dnl-ptp-wrap.hover-scale .dnl-ptp-card.is-featured:hover {
	transform: scale(var(--dnl-pt-feat-scale)) translateY(calc(var(--dnl-pt-feat-offset) - 5px));
	box-shadow:
		var(--dnl-pt-feat-shadow),
		0 0 0 var(--dnl-pt-feat-glow-spread) var(--dnl-pt-feat-glow);
}

/* Decorative orb inside featured card */
.dnl-ptp-card.is-featured::before {
	content: '';
	position: absolute;
	top: -60px;
	right: -60px;
	width: 220px;
	height: 220px;
	border-radius: 50%;
	background: rgba(255,255,255,0.04);
	pointer-events: none;
}

/* ─────────────────────────────────────────────────────────────────────────────
   RIBBON
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-ribbon {
	position: absolute;
	top: 0;
	right: 24px;
	background: var(--dnl-pt-ribbon-bg);
	color: var(--dnl-pt-ribbon-color);
	font-size: var(--dnl-pt-ribbon-font-size);
	font-weight: var(--dnl-pt-ribbon-font-weight);
	font-family: inherit;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 8px 12px 16px;
	clip-path: polygon(0 0, 100% 0, 100% 80%, 50% 100%, 0 80%);
	line-height: 1;
}

/* ─────────────────────────────────────────────────────────────────────────────
   BADGE (pill below ribbon area)
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-badge-row {
	min-height: 28px;
	display: flex;
	align-items: center;
	margin-bottom: 14px;
}

.dnl-ptp-badge {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: var(--dnl-pt-badge-pad);
	background: var(--dnl-pt-badge-bg);
	color: var(--dnl-pt-badge-color);
	border-radius: var(--dnl-pt-badge-radius);
	font-size: var(--dnl-pt-badge-font-size);
	font-weight: var(--dnl-pt-badge-font-weight);
	font-family: inherit;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1;
}

/* ─────────────────────────────────────────────────────────────────────────────
   PLAN NAME (eyebrow)
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-plan-name {
	font-size: var(--dnl-pt-name-size);
	font-weight: var(--dnl-pt-name-weight);
	letter-spacing: var(--dnl-pt-name-spacing);
	text-transform: uppercase;
	color: var(--dnl-pt-name-color);
	margin: 0 0 10px;
	font-family: inherit;
}

.dnl-ptp-card.is-featured .dnl-ptp-plan-name {
	color: rgba(255,255,255,0.55);
}

/* ─────────────────────────────────────────────────────────────────────────────
   PRICE BLOCK
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-price-block {
	margin-bottom: 6px;
}

.dnl-ptp-price-row {
	display: flex;
	align-items: baseline;
	gap: 2px;
	line-height: 1;
	flex-wrap: wrap;
}

.dnl-ptp-currency {
	font-size: var(--dnl-pt-currency-size);
	font-weight: var(--dnl-pt-price-weight);
	color: var(--dnl-pt-price-color);
	vertical-align: baseline;
	position: relative;
	top: calc(-1 * var(--dnl-pt-currency-valign));
	font-family: inherit;
}

.dnl-ptp-card.is-featured .dnl-ptp-currency {
	color: #ffffff;
}

.dnl-ptp-price {
	font-size: var(--dnl-pt-price-size);
	font-weight: var(--dnl-pt-price-weight);
	color: var(--dnl-pt-price-color);
	line-height: 1;
	font-family: inherit;
}

.dnl-ptp-card.is-featured .dnl-ptp-price {
	color: #ffffff;
}

.dnl-ptp-period {
	display: block;
	font-size: var(--dnl-pt-period-size);
	color: var(--dnl-pt-period-color);
	margin-top: 6px;
	font-family: inherit;
}

.dnl-ptp-card.is-featured .dnl-ptp-period {
	color: rgba(255,255,255,0.5);
}

/* ─────────────────────────────────────────────────────────────────────────────
   DIVIDER
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-divider {
	height: 1px;
	background: rgba(0,0,0,0.07);
	border: none;
	margin: 22px 0;
}

.dnl-ptp-card.is-featured .dnl-ptp-divider {
	background: rgba(255,255,255,0.10);
}

/* ─────────────────────────────────────────────────────────────────────────────
   DESCRIPTION
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-desc {
	font-size: var(--dnl-pt-desc-size);
	color: var(--dnl-pt-desc-color);
	line-height: var(--dnl-pt-desc-line-height);
	margin: 0 0 20px;
	font-family: inherit;
}

.dnl-ptp-card.is-featured .dnl-ptp-desc {
	color: rgba(255,255,255,0.60);
}

/* ─────────────────────────────────────────────────────────────────────────────
   FEATURE LIST
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-features {
	display: flex;
	flex-direction: column;
	gap: var(--dnl-pt-feat-list-gap);
	list-style: none;
	margin: 0 0 24px;
	padding: 0;
	flex: 1;
}

.dnl-ptp-feature-item {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: var(--dnl-pt-feat-font-size);
	color: var(--dnl-pt-feat-text-color);
	font-family: inherit;
	line-height: 1.5;
}

.dnl-ptp-card.is-featured .dnl-ptp-feature-item {
	color: rgba(255,255,255,0.80);
}

.dnl-ptp-feature-item.is-disabled {
	opacity: var(--dnl-pt-feat-off-opacity);
}

.dnl-ptp-feature-item .dnl-ptp-feat-text {
	flex: 1;
}

.dnl-ptp-feature-item.is-disabled .dnl-ptp-feat-text {
	color: var(--dnl-pt-feat-off-color);
	text-decoration: line-through;
	text-decoration-color: rgba(0,0,0,0.20);
}

.dnl-ptp-card.is-featured .dnl-ptp-feature-item.is-disabled .dnl-ptp-feat-text {
	color: rgba(255,255,255,0.35);
	text-decoration-color: rgba(255,255,255,0.15);
}

/* Feature icon */
.dnl-ptp-feat-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: var(--dnl-pt-icon-size);
	height: var(--dnl-pt-icon-size);
	margin-top: 1px;
	color: var(--dnl-pt-icon-color-on);
}

.dnl-ptp-feat-icon svg {
	width: 100%;
	height: 100%;
}

.dnl-ptp-feature-item.is-disabled .dnl-ptp-feat-icon {
	color: var(--dnl-pt-icon-color-off);
}

.dnl-ptp-card.is-featured .dnl-ptp-feat-icon {
	color: rgba(255,255,255,0.65);
}

.dnl-ptp-card.is-featured .dnl-ptp-feature-item.is-disabled .dnl-ptp-feat-icon {
	color: rgba(255,255,255,0.25);
}

/* Custom icon class (Elementor icon picker) */
.dnl-ptp-feat-icon i,
.dnl-ptp-feat-icon svg {
	font-size: var(--dnl-pt-icon-size);
	width: var(--dnl-pt-icon-size);
	height: var(--dnl-pt-icon-size);
}

/* Tooltip */
.dnl-ptp-feat-tooltip {
	position: relative;
	display: inline-flex;
	align-items: center;
	cursor: help;
	color: #aaa;
	font-size: 0.75em;
}

.dnl-ptp-feat-tooltip::after {
	content: attr(data-tip);
	position: absolute;
	bottom: calc(100% + 6px);
	left: 50%;
	transform: translateX(-50%);
	background: #2c2420;
	color: #fff;
	font-size: 0.8rem;
	font-weight: 400;
	padding: 6px 10px;
	border-radius: 6px;
	white-space: nowrap;
	pointer-events: none;
	opacity: 0;
	transition: opacity 180ms ease;
	z-index: 99;
}

.dnl-ptp-feat-tooltip:hover::after,
.dnl-ptp-feat-tooltip:focus::after {
	opacity: 1;
}

/* Feature link */
.dnl-ptp-feat-link {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.dnl-ptp-feat-link:hover {
	text-decoration: none;
}

/* ─────────────────────────────────────────────────────────────────────────────
   CTA BUTTON AREA
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-cta {
	margin-top: auto;
}

.dnl-ptp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: var(--dnl-pt-btn-pad);
	border-radius: var(--dnl-pt-btn-radius);
	font-size: var(--dnl-pt-btn-font-size);
	font-weight: var(--dnl-pt-btn-font-weight);
	font-family: inherit;
	cursor: pointer;
	text-decoration: none;
	line-height: 1;
	transition:
		background var(--dnl-pt-btn-transition),
		color var(--dnl-pt-btn-transition),
		border-color var(--dnl-pt-btn-transition),
		box-shadow var(--dnl-pt-btn-transition),
		transform var(--dnl-pt-btn-transition);
	border: 1.5px solid transparent;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
}

.dnl-ptp-btn:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

/* Hover button lift */
.dnl-ptp-wrap.hover-btn .dnl-ptp-btn:hover {
	transform: translateY(-2px);
}

/* Icon position */
.dnl-ptp-btn.icon-left  { flex-direction: row; }
.dnl-ptp-btn.icon-right { flex-direction: row-reverse; }

/* Outline style */
.dnl-ptp-btn.btn-outline {
	background: var(--dnl-pt-btn-outline-bg);
	color: var(--dnl-pt-btn-outline-color);
	border-color: var(--dnl-pt-btn-outline-border);
}

.dnl-ptp-btn.btn-outline:hover {
	background: var(--dnl-pt-btn-outline-hover-bg);
	color: var(--dnl-pt-btn-outline-hover-color);
}

/* Solid style */
.dnl-ptp-btn.btn-solid {
	background: var(--dnl-pt-btn-solid-bg);
	color: var(--dnl-pt-btn-solid-color);
	border-color: var(--dnl-pt-btn-solid-bg);
}

.dnl-ptp-btn.btn-solid:hover {
	background: var(--dnl-pt-btn-solid-hover-bg);
	color: var(--dnl-pt-btn-solid-hover-color);
	border-color: var(--dnl-pt-btn-solid-hover-bg);
}

/* Ghost style (for featured dark card) */
.dnl-ptp-btn.btn-ghost {
	background: var(--dnl-pt-btn-ghost-bg);
	color: var(--dnl-pt-btn-ghost-color);
	border-color: var(--dnl-pt-btn-ghost-border);
}

.dnl-ptp-btn.btn-ghost:hover {
	background: var(--dnl-pt-btn-ghost-hover-bg);
	color: var(--dnl-pt-btn-ghost-hover-color);
}

/* ─────────────────────────────────────────────────────────────────────────────
   FOOTER NOTE
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-footer-note {
	font-size: var(--dnl-pt-footer-size);
	color: var(--dnl-pt-footer-color);
	text-align: center;
	margin-top: 14px;
	font-family: inherit;
}

.dnl-ptp-card.is-featured .dnl-ptp-footer-note {
	color: rgba(255,255,255,0.35);
}

/* ─────────────────────────────────────────────────────────────────────────────
   STAGGER ANIMATIONS
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-wrap.stagger-anim .dnl-ptp-card {
	transition:
		opacity var(--dnl-pt-anim-duration) ease,
		transform var(--dnl-pt-anim-duration) ease,
		box-shadow var(--dnl-pt-anim-duration) ease;
}

/* Stagger delays are applied inline by JS */

/* ─────────────────────────────────────────────────────────────────────────────
   CAROUSEL MODE
───────────────────────────────────────────────────────────────────────────── */
.dnl-ptp-wrap.carousel-mode .dnl-ptp-panel {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	gap: var(--dnl-pt-card-gap);
	padding-bottom: 8px;
}

.dnl-ptp-wrap.carousel-mode .dnl-ptp-panel::-webkit-scrollbar {
	display: none;
}

.dnl-ptp-wrap.carousel-mode .dnl-ptp-card {
	flex: 0 0 min(88vw, 340px);
	scroll-snap-align: start;
}

/* ─────────────────────────────────────────────────────────────────────────────
   RESPONSIVE BREAKPOINTS
───────────────────────────────────────────────────────────────────────────── */

/* Tablet — 2 columns */
@media (max-width: 1024px) {
	.dnl-ptp-wrap:not(.carousel-mode):not(.cols-2) {
		--dnl-pt-cols: 2;
	}

	/* Featured card: reset scale on tablet when stacked */
	.dnl-ptp-wrap:not(.carousel-mode) .dnl-ptp-card.is-featured {
		transform: translateY(0) scale(1);
	}

	.dnl-ptp-wrap:not(.carousel-mode) .dnl-ptp-card.is-featured.dnl-card-visible {
		transform: translateY(0) scale(1);
	}
}

/* Mobile — single column */
@media (max-width: 640px) {
	.dnl-ptp-wrap:not(.carousel-mode) {
		--dnl-pt-cols: 1;
	}

	.dnl-ptp-tabs-outer {
		justify-content: flex-start;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.dnl-ptp-tablist {
		width: max-content;
	}
}

/* ─────────────────────────────────────────────────────────────────────────────
   RTL SUPPORT
───────────────────────────────────────────────────────────────────────────── */
[dir="rtl"] .dnl-ptp-btn.icon-right { flex-direction: row; }
[dir="rtl"] .dnl-ptp-btn.icon-left  { flex-direction: row-reverse; }

[dir="rtl"] .dnl-ptp-ribbon {
	right: auto;
	left: 24px;
}

[dir="rtl"] .dnl-ptp-feat-tooltip::after {
	left: auto;
	right: 50%;
	transform: translateX(50%);
}

/* ─────────────────────────────────────────────────────────────────────────────
   ELEMENTOR EDITOR — Prevent flicker on panel re-render
───────────────────────────────────────────────────────────────────────────── */
.elementor-editor-active .dnl-ptp-panel.is-active {
	display: grid;
	opacity: 1;
	transform: none;
}

.elementor-editor-active .dnl-ptp-card {
	opacity: 1;
	transform: none;
}

.elementor-editor-active .dnl-ptp-card.is-featured {
	transform: scale(var(--dnl-pt-feat-scale)) translateY(var(--dnl-pt-feat-offset));
}