/**
 * Naat Academy — Global Apple-inspired Pill UI (v4.4.0)
 * ---------------------------------------------------------------------------
 * A cascade override layer, enqueued LAST on every front-end page, that turns
 * every button / chip / badge / tag / filter pill / pagination control across
 * the whole site into a fully rounded (9999px) Apple-style pill with soft
 * glassmorphism, subtle borders, and smooth hover / press motion.
 *
 * Purely visual — no layout, no functionality, no markup changes. Selectors
 * are scoped to interactive/label elements only so typography and cards are
 * untouched. Works identically on desktop and mobile.
 *
 * Design tokens:
 *   --pill-radius   fully rounded
 *   --pill-ease     Apple-style spring-ish easing
 * ------------------------------------------------------------------------- */

:root {
	--pill-radius: 9999px;
	--pill-ease: cubic-bezier( .22, .61, .36, 1 );
	--pill-border: rgba( 15, 23, 42, .08 );
	--pill-glass: rgba( 255, 255, 255, .55 );
	--pill-shadow: 0 1px 2px rgba( 15, 23, 42, .06 ), 0 6px 18px -10px rgba( 15, 23, 42, .18 );
	--pill-shadow-hover: 0 2px 6px rgba( 15, 23, 42, .1 ), 0 14px 30px -12px rgba( 15, 23, 42, .28 );
}

/* ===== 1. Universal pill shape ========================================== */
/* stylelint-disable */

/* Buttons + action pills */
.naat-fsb-btn, .naat-fsb-btn-primary, .naat-fsb-btn-ghost,
.naat-kbtn, .naat-kbtn-copy, .naat-kbtn-share, .naat-kbtn-wa,
.naat-hero-search, .naat-hero-search-btn,
.naat-ash-fbtn, .naat-ash-randombtn, .naat-ash-pill,
.naat-maj-vbtn, .naat-maj-filteractions button, .naat-maj-filteractions a,
.naat-alpha-btn, .naat-lang-btn, .naat-lex-btn, .naat-tas-btn,
.naat-cal-view-btn, .naat-dword-kbtn, .naat-dword-ap-btn,
.naat-dword-pill, .naat-dword-pill-ghost, .naat-dsb-wa-btn,
.naat-chip-btn, .naat-chip-more, .naat-kd-bahrbtn,
.naat-pill-dark, .naat-pill-light, .naat-pill-link,
.naat-owais-trigger, .naat-fsb-btn.naat-fsb-btn-primary,
.ds-btn, .naat-ais-btn, .wp-element-button,
.naat-ashx-copy, .naat-ashx-full, [data-ashx-copy],
.naat-ashx-browse, .naat-ashx-link,
/* Chips */
.naat-chip, .naat-maj-chip, .naat-kd-chip, .naat-ash-chip,
.naat-ashx-chip, .naat-cal-chip, .naat-tl-chip, .naat-owais-chip,
.naat-dsb-chip, .ds-chip, .naat-poet-chip, .naat-ash-poetchip,
.naat-mini-chip, .naat-farhang-chips > *, .naat-rq-pill,
.naat-cal-hero-today-chip,
/* Badges */
.naat-ais-badge, .naat-ash-badge, .naat-ash-catbadge,
.naat-ash-stage-badge, .naat-blog-badge, .naat-kalam-badge,
.naat-cal-hero-badge, .naat-tl-badge, .naat-fsb-badge,
.naat-farhang-badge,
/* Tags */
.naat-ais-tag, .naat-art-tags a, .naat-maj-rec-tag,
.naat-maj-tax-tag, .naat-rq-tag,
/* Pagination */
.naat-bahr-pagination a, .naat-bahr-pagination span,
.naat-bahr-pagination .page-numbers,
.page-numbers, .naat-pagination a, .naat-pagination span {
	border-radius: var( --pill-radius ) !important;
}

/* Ensure enough horizontal breathing room for the pill shape without
   altering vertical rhythm. Only nudge where padding is visibly cramped. */
.naat-chip, .naat-maj-chip, .naat-kd-chip, .naat-ash-chip,
.naat-ashx-chip, .naat-cal-chip, .naat-tl-chip, .naat-owais-chip,
.naat-dsb-chip, .ds-chip, .naat-mini-chip, .naat-ais-tag,
.naat-maj-rec-tag, .naat-maj-tax-tag, .naat-rq-tag,
.naat-ais-badge, .naat-ash-badge, .naat-blog-badge {
	padding-left: max( .7em, 12px );
	padding-right: max( .7em, 12px );
}

/* ===== 2. Glass + motion ================================================ */

/* Smooth Apple-style transition on every pill element. */
.naat-fsb-btn, .naat-fsb-btn-primary, .naat-fsb-btn-ghost,
.naat-kbtn, .naat-kbtn-copy, .naat-kbtn-share, .naat-kbtn-wa,
.naat-hero-search-btn, .naat-ash-fbtn, .naat-ash-randombtn, .naat-ash-pill,
.naat-maj-vbtn, .naat-alpha-btn, .naat-lang-btn, .naat-lex-btn,
.naat-tas-btn, .naat-cal-view-btn, .naat-dword-kbtn, .naat-dword-ap-btn,
.naat-dword-pill, .naat-dword-pill-ghost, .naat-dsb-wa-btn,
.naat-chip-btn, .naat-chip-more, .naat-kd-bahrbtn,
.naat-pill-dark, .naat-pill-light, .naat-owais-trigger,
.ds-btn, .wp-element-button, .naat-ashx-copy, .naat-ashx-full,
.naat-ashx-browse, .naat-chip, .naat-maj-chip, .naat-kd-chip,
.naat-ash-chip, .naat-ashx-chip, .naat-cal-chip, .naat-tl-chip,
.naat-owais-chip, .ds-chip, .naat-poet-chip, .naat-ais-tag,
.naat-maj-rec-tag, .naat-maj-tax-tag, .naat-rq-tag,
.page-numbers {
	transition: transform .28s var( --pill-ease ),
		box-shadow .28s var( --pill-ease ),
		background-color .28s var( --pill-ease ),
		border-color .28s var( --pill-ease );
}

/* Glassmorphic ghost/secondary action pills get soft glass + subtle border. */
.naat-fsb-btn-ghost, .naat-ash-fbtn, .naat-ash-randombtn,
.naat-alpha-btn, .naat-lang-btn, .naat-cal-view-btn,
.naat-dword-pill-ghost, .naat-chip-more, .naat-kd-bahrbtn,
.naat-pill-light, .naat-maj-vbtn {
	-webkit-backdrop-filter: saturate( 160% ) blur( 10px );
	backdrop-filter: saturate( 160% ) blur( 10px );
	border: 1px solid var( --pill-border );
	box-shadow: var( --pill-shadow );
}

/* Hover lift for interactive pills (buttons + action pills). */
.naat-fsb-btn:hover, .naat-fsb-btn-primary:hover, .naat-fsb-btn-ghost:hover,
.naat-kbtn:hover, .naat-kbtn-copy:hover, .naat-kbtn-share:hover, .naat-kbtn-wa:hover,
.naat-hero-search-btn:hover, .naat-ash-fbtn:hover, .naat-ash-randombtn:hover,
.naat-ash-pill:hover, .naat-maj-vbtn:hover, .naat-alpha-btn:hover,
.naat-lang-btn:hover, .naat-lex-btn:hover, .naat-tas-btn:hover,
.naat-cal-view-btn:hover, .naat-dword-kbtn:hover, .naat-dword-ap-btn:hover,
.naat-dword-pill:hover, .naat-dword-pill-ghost:hover, .naat-dsb-wa-btn:hover,
.naat-chip-btn:hover, .naat-chip-more:hover, .naat-kd-bahrbtn:hover,
.naat-pill-dark:hover, .naat-pill-light:hover, .naat-owais-trigger:hover,
.ds-btn:hover, .wp-element-button:hover, .naat-ashx-copy:hover,
.naat-ashx-full:hover, .naat-ashx-browse:hover, .page-numbers:hover {
	transform: translateY( -2px );
	box-shadow: var( --pill-shadow-hover );
}

/* Tactile press feedback. */
.naat-fsb-btn:active, .naat-fsb-btn-primary:active, .naat-fsb-btn-ghost:active,
.naat-kbtn:active, .naat-hero-search-btn:active, .naat-ash-fbtn:active,
.naat-ash-randombtn:active, .naat-ash-pill:active, .naat-maj-vbtn:active,
.naat-alpha-btn:active, .naat-cal-view-btn:active, .naat-dword-kbtn:active,
.naat-dword-pill:active, .naat-chip-btn:active, .naat-owais-trigger:active,
.ds-btn:active, .wp-element-button:active, .naat-ashx-copy:active,
.naat-ashx-full:active, .naat-ashx-browse:active, .page-numbers:active {
	transform: translateY( 0 ) scale( .97 );
	box-shadow: var( --pill-shadow );
}

/* Chips: gentle hover tint + tiny lift (no scale jump). */
.naat-chip:hover, .naat-maj-chip:hover, .naat-kd-chip:hover,
.naat-ash-chip:hover, .naat-ashx-chip:hover, .naat-cal-chip:hover,
.naat-tl-chip:hover, .naat-owais-chip:hover, .ds-chip:hover,
.naat-poet-chip:hover, .naat-ais-tag:hover, .naat-maj-rec-tag:hover,
.naat-maj-tax-tag:hover, .naat-rq-tag:hover {
	transform: translateY( -1px );
}

/* ===== 3. Reduced motion ================================================ */

@media ( prefers-reduced-motion: reduce ) {
	.naat-fsb-btn, .naat-fsb-btn-primary, .naat-fsb-btn-ghost,
	.naat-kbtn, .naat-hero-search-btn, .naat-ash-fbtn, .naat-ash-randombtn,
	.naat-ash-pill, .naat-maj-vbtn, .naat-alpha-btn, .naat-lang-btn,
	.naat-cal-view-btn, .naat-dword-kbtn, .naat-dword-pill, .naat-chip-btn,
	.naat-owais-trigger, .ds-btn, .wp-element-button, .naat-ashx-copy,
	.naat-ashx-full, .naat-ashx-browse, .page-numbers,
	.naat-chip, .naat-maj-chip, .naat-kd-chip, .naat-ash-chip,
	.naat-ashx-chip, .naat-cal-chip, .naat-tl-chip, .naat-owais-chip {
		transition: none !important;
	}
	.naat-fsb-btn:hover, .naat-fsb-btn-primary:hover, .naat-kbtn:hover,
	.naat-hero-search-btn:hover, .naat-ash-fbtn:hover, .naat-maj-vbtn:hover,
	.naat-cal-view-btn:hover, .naat-owais-trigger:hover, .wp-element-button:hover,
	.naat-ashx-copy:hover, .naat-ashx-full:hover, .naat-ashx-browse:hover,
	.page-numbers:hover, .naat-chip:hover, .naat-maj-chip:hover,
	.naat-cal-chip:hover {
		transform: none !important;
	}
}
