/* =====================================================================
   DigiDollar - search results page                        (dd-serp.css)
   ---------------------------------------------------------------------
   Skin for the /?s= page (search.php + inc/serp.php). Loads only on
   is_search(). Same architecture as the 404 page: brand tokens consumed
   from dd-widgets with fallbacks, a namespaced .dd-serp scope, physical
   hairline borders, icon tiles for emphasis - none of the banned label or
   rail patterns. Dark mode: the --dd-* tokens flip on their own; the
   handful of page-local colours are re-declared with !important and
   their --dracula-* twins pinned (trap #9).
   ===================================================================== */

.dd-serp {
	--g:      var(--dd-gold, #e0be00);
	--gd:     var(--dd-gold-deep, #9a7d00);
	--grad:   var(--dd-grad, linear-gradient(135deg, #fdb837 0%, #ffbf2f 45%, #e0be00 100%));
	--ink:    var(--dd-ink, #18181c);
	--muted:  var(--dd-muted, #6c6c78);
	--brd:    var(--dd-card-brd, rgba(20, 20, 35, 0.08));
	--hair:   var(--dd-hair, rgba(224, 190, 0, 0.28));
	--tile:   rgba(224, 190, 0, 0.13);
	--tint:   rgba(224, 190, 0, 0.09);
	--card:   var(--dd-card, rgba(255, 255, 255, 0.74));
	--cta-ink: #3a2c00;
	--page-bg:
		radial-gradient(105% 70% at 88% -12%, #fff4d2 0%, transparent 52%),
		radial-gradient(90% 60% at 4% -6%, #fffaef 0%, transparent 46%),
		linear-gradient(180deg, #fdfbf4 0%, #ffffff 34%, #fdfbf4 100%);

	display: block;
	width: 100%;
	position: relative;
	color: var(--ink);
	background: var(--page-bg);
	overflow-x: clip;
	font-family: 'Digidollar', 'Digidollar Fallback', 'Vazirmatn', -apple-system, 'Segoe UI', Tahoma, sans-serif;
	line-height: 1.9;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

.dd-serp * { box-sizing: border-box; }
.dd-serp a { color: inherit; text-decoration: none; }

/* the theme dresses headings for editorial prose - and its inline <style>
   forces `h2 { display:flex; text-align:center !important }` (trap list #1),
   so the reset must carry !important at class specificity to win */
.dd-serp h1,
.dd-serp h2 {
	display: block !important;
	text-align: start !important;
	color: inherit;
	font-family: inherit;
	margin: 0;
	padding: 0 !important;
	border: 0;
}
.dd-serp__hero .dd-serp__h1 { text-align: center !important; }
.dd-serp h1::before, .dd-serp h1::after,
.dd-serp h2::before, .dd-serp h2::after { content: none; display: none; }

.dd-serp__wrap {
	max-width: 880px;
	margin-inline: auto;
	padding-inline: clamp(18px, 5vw, 40px);
	/* the navbar is a fixed glass capsule: the top pad is clearance, not taste */
	padding-block: clamp(104px, 11vw, 140px) clamp(56px, 7vw, 96px);
}

/* ---------------------------------------------------------------------
   Hero - title, form, fast-search
   --------------------------------------------------------------------- */
.dd-serp__hero { text-align: center; }
.dd-serp__h1 {
	/* the Customizer's global `h1 { font-size:x-large !important }` (trap #8) */
	font-size: clamp(26px, 4vw, 40px) !important;
	font-weight: 800 !important;
	line-height: 1.4 !important;
	margin-top: 0 !important;
}
.dd-serp__lead {
	margin: 10px 0 0 !important;
	font-size: 14px;
	color: var(--muted);
}

.dd-serp__form {
	display: flex;
	align-items: center;
	gap: 10px;
	max-width: 620px;
	margin: 26px auto 0;
	padding: 8px 8px 8px 18px;
	background: var(--card);
	border: 1px solid var(--hair);
	border-radius: 999px;
	box-shadow: var(--dd-shadow, 0 14px 38px -16px rgba(25, 22, 50, 0.22));
	transition: border-color .2s ease;
}
.dd-serp__form:focus-within { border-color: var(--g); }
.dd-serp__form .dd-serp__gi--mag { flex: none; width: 18px; height: 18px; background-color: var(--gd); }
.dd-serp__input {
	flex: 1;
	min-width: 0;
	margin: 0 !important;            /* theme: input { margin-bottom: 15px } */
	padding: 8px 8px !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	outline: none !important;
	font-family: 'Digidollar', 'Digidollar Fallback', 'Vazirmatn', -apple-system, 'Segoe UI', Tahoma, sans-serif !important;
	font-size: 16px;                 /* >=16px: no iOS focus zoom */
	font-weight: 600;
	color: var(--ink) !important;
}
.dd-serp__input::placeholder { color: var(--muted); opacity: .8; font-weight: 500; }
.dd-serp__input::-webkit-search-cancel-button { -webkit-appearance: none; }
.dd-serp__submit {
	flex: none;
	border: 0;
	border-radius: 999px;
	padding: 11px 24px;
	background: var(--grad);
	color: var(--cta-ink);
	font-family: inherit;
	font-size: 14px;
	font-weight: 800;
	cursor: pointer;
	transition: transform .2s cubic-bezier(.2, .7, .2, 1), box-shadow .2s ease;
}
.dd-serp__submit:hover { transform: translateY(-1px); box-shadow: 0 10px 26px -12px rgba(224, 190, 0, 0.7); }
.dd-serp__submit:active { transform: none; }

.dd-serp__fast {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	border: 1px solid var(--brd);
	border-radius: 999px;
	background: transparent;
	padding: 8px 16px;
	font-family: inherit;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--muted);
	cursor: pointer;
	transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.dd-serp__fast:hover { color: var(--ink); border-color: var(--hair); background: var(--tint); }
.dd-serp__fast kbd {
	font-family: inherit;
	font-size: 10.5px;
	font-weight: 600;
	border: 1px solid var(--brd);
	border-radius: 7px;
	padding: 2px 7px;
	background: transparent;
	color: var(--muted);
}

/* ---------------------------------------------------------------------
   Count + result rows
   --------------------------------------------------------------------- */
.dd-serp__count {
	margin: clamp(30px, 5vw, 46px) 0 6px !important;
	font-size: 13px;
	color: var(--muted);
}
.dd-serp__count strong { color: var(--ink); font-weight: 800; }

.dd-serp__row {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 18px 6px;
	border-width: 0 0 1px;
	border-style: solid;
	border-bottom-color: var(--brd);
	border-radius: 0;
	transition: background .15s ease;
}
.dd-serp__row:hover { background: var(--tint); }
.dd-serp__list .dd-serp__row:last-child { border-bottom-color: transparent; }

.dd-serp__tile {
	flex: none;
	width: 42px;
	height: 42px;
	margin-top: 3px;
	border-radius: 13px;
	background: var(--tile);
	display: grid;
	place-items: center;
}
.dd-serp__body { flex: 1; min-width: 0; }

.dd-serp__title {
	font-size: 16.5px !important;
	font-weight: 800 !important;
	line-height: 1.75 !important;
}
.dd-serp__title a { color: var(--ink); transition: color .15s ease; }
.dd-serp__title a:hover { color: var(--gd); }
.dd-serp mark {
	background: transparent !important;
	color: var(--gd) !important;
	font-weight: 800;
	padding: 0 !important;
}

.dd-serp__meta {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 2px 0 0 !important;
	font-size: 12px;
	color: var(--muted);
}
.dd-serp__kind { font-weight: 700; color: var(--gd); }
.dd-serp__sep { width: 3px; height: 3px; border-radius: 50%; background: var(--muted); opacity: .55; flex: none; }
.dd-serp__path { unicode-bidi: plaintext; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.dd-serp__snip {
	margin: 6px 0 0 !important;
	font-size: 13px;
	line-height: 2;
	color: var(--muted);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ---------------------------------------------------------------------
   Group label lockup (hairline-flanked text, the approved shape)
   --------------------------------------------------------------------- */
.dd-serp__gl {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: clamp(30px, 5vw, 44px) 0 4px !important;
	font-size: 12px;
	font-weight: 700;
	color: var(--muted);
}
.dd-serp__gl::after {
	content: "" !important;
	flex: 1;
	height: 1px;
	background: var(--brd);
}

/* ---------------------------------------------------------------------
   Chips + quick routes (start / no-result states)
   --------------------------------------------------------------------- */
.dd-serp__chips { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 12px; }
.dd-serp__chip {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	border: 1px solid var(--brd);
	border-radius: 999px;
	padding: 8px 15px;
	font-size: 13px;
	font-weight: 600;
	color: var(--ink);
	background: var(--card);
	transition: border-color .18s ease, background .18s ease;
}
.dd-serp__chip:hover { border-color: var(--hair); background: var(--tint); }

.dd-serp__quick {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 10px;
	margin-top: 12px;
}
.dd-serp__quick-it {
	display: flex;
	align-items: center;
	gap: 11px;
	padding: 10px 12px;
	border: 1px solid var(--brd);
	border-radius: 15px;
	background: var(--card);
	font-size: 13.5px;
	font-weight: 700;
	color: var(--ink);
	transition: border-color .18s ease, background .18s ease;
}
.dd-serp__quick-it:hover { border-color: var(--hair); background: var(--tint); }
.dd-serp__quick-it .dd-serp__tile { width: 36px; height: 36px; margin-top: 0; border-radius: 11px; }

/* ---------------------------------------------------------------------
   No results
   --------------------------------------------------------------------- */
.dd-serp__none { margin-top: clamp(34px, 5vw, 52px); text-align: center; }
.dd-serp__none-t { margin: 0 !important; font-size: 17px; font-weight: 800; color: var(--ink); }
.dd-serp__none-s {
	margin: 10px auto 0 !important;
	max-width: 52ch;
	font-size: 13px;
	line-height: 2.1;
	color: var(--muted);
}
.dd-serp__none .dd-serp__chips,
.dd-serp__none .dd-serp__quick { justify-content: center; }
.dd-serp__none .dd-serp__gl { text-align: start; }

/* ---------------------------------------------------------------------
   Pagination (core .page-numbers, restyled as chips)
   --------------------------------------------------------------------- */
.dd-serp__pag { margin-top: clamp(30px, 5vw, 44px); }
.dd-serp__pag .screen-reader-text { position: absolute; clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; }
.dd-serp__pag .nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
}
.dd-serp__pag .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 13px;
	border: 1px solid var(--brd);
	border-radius: 999px;
	background: var(--card);
	font-size: 13.5px;
	font-weight: 700;
	color: var(--ink);
	transition: border-color .18s ease, background .18s ease;
}
.dd-serp__pag a.page-numbers:hover { border-color: var(--hair); background: var(--tint); }
.dd-serp__pag .page-numbers.current {
	background: var(--grad);
	border-color: transparent;
	color: var(--cta-ink);
}
.dd-serp__pag .page-numbers.dots { border-color: transparent; background: transparent; color: var(--muted); }

/* ---------------------------------------------------------------------
   Glyphs - alpha-masked spans painted by background-color (dark-safe)
   --------------------------------------------------------------------- */
.dd-serp__gi {
	display: inline-block;
	width: 20px;
	height: 20px;
	background-color: var(--gd);
	-webkit-mask: var(--gi) center / contain no-repeat;
	mask: var(--gi) center / contain no-repeat;
}
.dd-serp__chip .dd-serp__gi { width: 13px; height: 13px; background-color: var(--muted); }
.dd-serp__gi--mag { --gi: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='none'%20stroke='%23000'%20stroke-width='2.2'%20stroke-linecap='round'%20d='M15.6%2015.6L20%2020M17.2%2011a6.2%206.2%200%201%201-12.4%200%206.2%206.2%200%200%201%2012.4%200z'/%3E%3C/svg%3E"); }
.dd-serp__gi--c { --gi: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='%23000'%20d='M12%202.6a9.4%209.4%200%201%200%200%2018.8%209.4%209.4%200%200%200%200-18.8zm0%202a7.4%207.4%200%201%201%200%2014.8%207.4%207.4%200%200%201%200-14.8zm-1%203.1h2.1c1.6%200%202.8.9%202.8%202.3%200%201-.6%201.7-1.4%202%20.9.2%201.7%201%201.7%202.1%200%201.5-1.2%202.5-3%202.5H11a1%201%200%200%201-1-1V8.7a1%201%200%200%201%201-1zm1%201.7v1.9h1c.7%200%201.1-.4%201.1-1s-.4-.9-1.1-.9h-1zm0%203.5v2h1.2c.8%200%201.2-.4%201.2-1s-.5-1-1.2-1H12z'/%3E%3C/svg%3E"); }
.dd-serp__gi--v { --gi: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='%23000'%20d='M4%206.5A2.5%202.5%200%200%201%206.5%204h11A2.5%202.5%200%200%201%2020%206.5v2.1a2.9%202.9%200%200%200%200%206.8v2.1a2.5%202.5%200%200%201-2.5%202.5h-11A2.5%202.5%200%200%201%204%2017.5v-2.1a2.9%202.9%200%200%200%200-6.8V6.5zm9.5%201.2h-2v2h2v-2zm0%203.7h-2v2h2v-2zm0%203.7h-2v2h2v-2z'/%3E%3C/svg%3E"); }
.dd-serp__gi--g { --gi: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='%23000'%20d='M20%207h-2.2c.13-.31.2-.65.2-1a2.9%202.9%200%200%200-5.2-1.8L12%205.2l-.8-1A2.9%202.9%200%200%200%206%206c0%20.35.07.69.2%201H4a2%202%200%200%200-2%202v2h20V9a2%202%200%200%200-2-2zM8.9%205.1a1%201%200%201%201%200%202%201%201%200%200%201%200-2zm6.2%200a1%201%200%201%201%200%202%201%201%200%200%201%200-2zM3%2013.5V19a2%202%200%200%200%202%202h14a2%202%200%200%200%202-2v-5.5H13V19h-2v-5.5H3z'/%3E%3C/svg%3E"); }
.dd-serp__gi--b,
.dd-serp__gi--l { --gi: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='%23000'%20d='M6%202.8h9.5L20%207.3V20a1.2%201.2%200%200%201-1.2%201.2H6A1.2%201.2%200%200%201%204.8%2020V4A1.2%201.2%200%200%201%206%202.8zm8.7%201.7v3.6h3.6l-3.6-3.6zM8%2012h8v1.7H8V12zm0%203.6h8v1.7H8v-1.7zM8%208.4h4v1.7H8V8.4z'/%3E%3C/svg%3E"); }
.dd-serp__gi--n { --gi: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='%23000'%20d='M13%202.5L4.3%2013.4c-.4.5%200%201.1.6%201.1h5.3L9%2021.2c-.1.7.8%201.1%201.2.5l8.7-10.9c.4-.5%200-1.1-.6-1.1H13l1.2-6.7c.1-.7-.8-1.1-1.2-.5z'/%3E%3C/svg%3E"); }
.dd-serp__gi--z { --gi: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='%23000'%20d='M4%2019h16v2H4a1%201%200%200%201-1-1V3h2v16zm3.5-4.2l3.6-4.7%202.6%202.4%204.4-6%201.6%201.2-5.7%207.8-2.6-2.4-2.4%203.1-1.5-1.4z'/%3E%3C/svg%3E"); }
.dd-serp__gi--p { --gi: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='%23000'%20d='M5%203.8h14A1.2%201.2%200%200%201%2020.2%205v14A1.2%201.2%200%200%201%2019%2020.2H5A1.2%201.2%200%200%201%203.8%2019V5A1.2%201.2%200%200%201%205%203.8zm1%203.4v2.2h12V7.2H6zm0%204.4v6h5.4v-6H6zm7.2%200v6H18v-6h-4.8z'/%3E%3C/svg%3E"); }
.dd-serp__gi--spark { --gi: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='%23000'%20d='M12%203c.7%205%204%208.3%209%209-5%20.7-8.3%204-9%209-.7-5-4-8.3-9-9%205-.7%208.3-4%209-9z'/%3E%3C/svg%3E"); }

/* ---------------------------------------------------------------------
   Mobile
   --------------------------------------------------------------------- */
@media screen and (max-width: 640px) {
	.dd-serp__form { flex-wrap: nowrap; padding-inline-start: 14px; }
	.dd-serp__submit { padding: 10px 16px; font-size: 13px; }
	.dd-serp__quick { grid-template-columns: 1fr 1fr; }
	.dd-serp__tile { width: 38px; height: 38px; }
	.dd-serp__snip { -webkit-line-clamp: 3; }
}

@media (prefers-reduced-motion: reduce) {
	.dd-serp__submit, .dd-serp__row, .dd-serp__chip, .dd-serp__quick-it, .dd-serp__fast { transition: none !important; }
}

/* ---------------------------------------------------------------------
   Dark scheme - the shared --dd-* tokens flip upstream (dd-widgets +
   dd-darkfix); only the page-local colours need declaring, each pinned
   with its --dracula-* twin so the dark plugin's re-emission pass
   cannot darken them a second time.
   --------------------------------------------------------------------- */
html[data-dracula-scheme="dark"] .dd-serp {
	--page-bg:
		radial-gradient(105% 70% at 88% -12%, rgba(253, 184, 55, 0.10) 0%, transparent 52%),
		radial-gradient(90% 60% at 4% -6%, rgba(224, 190, 0, 0.06) 0%, transparent 46%),
		linear-gradient(180deg, #121217 0%, #0e0e12 40%, #121217 100%) !important;
	--gd: #ffbf2f !important;
	--dracula-text--gd: #ffbf2f !important;
	--dracula-bg--gd: #ffbf2f !important;
	--tile: rgba(255, 191, 47, 0.12) !important;
	--dracula-bg--tile: rgba(255, 191, 47, 0.12) !important;
	--tint: rgba(255, 191, 47, 0.09) !important;
	--dracula-bg--tint: rgba(255, 191, 47, 0.09) !important;
}
