/*
 * Finobazaar PIN Codes – public display.
 * Loaded only on pages that show the PIN tool. Uses the theme's tokens
 * when present, with the brand values as fallbacks. pin.js only adds
 * suggestions and nearby lists; everything works without it.
 */
.fbp {
	--fbp-blue: var(--fb-brand-blue, #105de1);
	--fbp-blue-dark: var(--fb-brand-blue-dark, #0848b8);
	--fbp-blue-light: var(--fb-brand-blue-light, #eaf2ff);
	--fbp-black: var(--fb-brand-black, #111111);
	--fbp-white: #ffffff;
	--fbp-neutral: var(--fb-bg, #f7f9fc);
	--fbp-border: var(--fb-border, #e3e8f0);
	--fbp-text: var(--fb-text, #202020);
	--fbp-muted: var(--fb-text-2, #4a5361);
	--fbp-radius: 10px;
	color: var(--fbp-text);
	margin: 0 0 2rem;
	max-width: 100%;
}
.fbp h2 { color: var(--fbp-black); font-size: 1.25rem; line-height: 1.3; margin: 1.75rem 0 .75rem; }
.fbp-muted { color: var(--fbp-muted); }
.fbp-note { color: var(--fbp-muted); font-size: .9375rem; margin: .75rem 0; }
.fbp-more { margin: 1rem 0 0; }
.fbp a { color: var(--fbp-blue-dark); text-underline-offset: 2px; }
.fbp a:focus-visible,
.fbp button:focus-visible,
.fbp input:focus-visible { outline: 3px solid var(--fbp-blue); outline-offset: 2px; }

/* Search */
.fbp-search { margin: 0 0 1.5rem; }
.fbp-search__label { display: block; font-weight: 600; margin: 0 0 .375rem; color: var(--fbp-black); }
.fbp-search__row { display: flex; gap: .5rem; }
.fbp-search__input {
	flex: 1 1 auto;
	min-width: 0;
	min-height: 44px;
	border: 1px solid var(--fbp-border);
	border-radius: 8px;
	background: var(--fbp-white);
	color: var(--fbp-text);
	font: inherit;
	padding: .5rem .75rem;
}
.fbp-search__button {
	flex: 0 0 auto;
	min-height: 44px;
	border: 0;
	border-radius: 8px;
	background: var(--fbp-blue);
	color: var(--fbp-white);
	cursor: pointer;
	font: inherit;
	font-weight: 600;
	padding: .5rem 1.125rem;
}
.fbp-search__button:hover { background: var(--fbp-blue-dark); }

/* One PIN code: the six boxes of an Indian envelope's PIN field. */
.fbp-pin__head { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; margin: 0 0 1.25rem; }
.fbp-pin__digits { display: flex; gap: .3rem; margin: 0; }
.fbp-pin__digits span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 3rem;
	border: 2px solid var(--fbp-black);
	border-radius: 4px;
	background: var(--fbp-white);
	color: var(--fbp-black);
	font-size: 1.75rem;
	font-variant-numeric: tabular-nums;
	font-weight: 700;
	line-height: 1;
}
.fbp-pin__digits span:nth-child(3) { margin-right: .35rem; }
.fbp-pin__where { color: var(--fbp-black); font-size: 1.0625rem; font-weight: 600; margin: 0; }
.fbp-pin__title { margin-top: 0; }

.fbp dl.fbp-facts {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
	gap: .75rem 1.5rem;
	background: var(--fbp-neutral);
	border: 1px solid var(--fbp-border);
	border-radius: var(--fbp-radius);
	margin: 0;
	padding: 1rem 1.125rem;
}
.fbp-facts div { margin: 0; }
.fbp-facts dt { color: var(--fbp-muted); font-size: .8125rem; margin: 0; }
.fbp-facts dd { color: var(--fbp-black); font-weight: 600; margin: .125rem 0 0; }

/* Tables */
.fbp-table-wrap { overflow-x: auto; border: 1px solid var(--fbp-border); border-radius: var(--fbp-radius); }
.fbp table.fbp-table { display: table; width: 100%; overflow: visible; border-collapse: collapse; font-size: .9375rem; margin: 0; }
.fbp .fbp-table th,
.fbp .fbp-table td { border-bottom: 1px solid var(--fbp-border); padding: .625rem .75rem; text-align: left; vertical-align: top; }
.fbp .fbp-table thead th { background: var(--fbp-neutral); color: var(--fbp-muted); font-size: .8125rem; font-weight: 600; }
.fbp .fbp-table tbody tr:last-child th,
.fbp .fbp-table tbody tr:last-child td { border-bottom: 0; }
.fbp .fbp-table tbody th { color: var(--fbp-black); font-weight: 600; }
.fbp-pinlink { font-variant-numeric: tabular-nums; font-weight: 700; letter-spacing: .04em; }

/* Lists */
.fbp ul.fbp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr)); gap: .5rem; list-style: none; margin: 0; padding: 0; }
.fbp ul.fbp-grid li {
	display: flex;
	flex-direction: column;
	gap: .125rem;
	border: 1px solid var(--fbp-border);
	border-radius: 8px;
	background: var(--fbp-white);
	margin: 0;
	padding: .625rem .75rem;
}
.fbp-grid__name { font-weight: 600; }
.fbp-grid__count { color: var(--fbp-muted); font-size: .8125rem; }
.fbp ul.fbp-chips { display: flex; flex-wrap: wrap; gap: .375rem; list-style: none; margin: 0; padding: 0; }
.fbp ul.fbp-chips li { border: 1px solid var(--fbp-border); border-radius: 999px; background: var(--fbp-white); font-size: .875rem; margin: 0; padding: .25rem .75rem; }

.fbp ul.fbp-hits { list-style: none; margin: 0; padding: 0; border: 1px solid var(--fbp-border); border-radius: var(--fbp-radius); }
.fbp ul.fbp-hits li.fbp-hit { display: flex; gap: 1rem; border-bottom: 1px solid var(--fbp-border); margin: 0; padding: .75rem; }
.fbp ul.fbp-hits li.fbp-hit:last-child { border-bottom: 0; }
.fbp-hit__pin { flex: 0 0 4.5rem; }
.fbp-hit__text { flex: 1 1 auto; min-width: 0; }

.fbp-pages { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin: 1rem 0 0; }

.fbp-context {
	background: var(--fbp-blue-light);
	border-radius: var(--fbp-radius);
	margin: 0 0 1.5rem;
	padding: 1rem 1.125rem;
}
.fbp-context h2 { margin-top: 0; font-size: 1.0625rem; }
.fbp-context__pin { display: flex; flex-wrap: wrap; align-items: baseline; gap: .75rem; font-size: 1.25rem; margin: 0 0 .75rem; }
.fbp-context__pin span { font-size: .9375rem; }

.fbp-empty { background: var(--fbp-neutral); border: 1px solid var(--fbp-border); border-radius: var(--fbp-radius); padding: 1rem 1.125rem; }
.fbp-empty p { margin: 0 0 .5rem; }
.fbp-empty p:last-child { margin: 0; }

.fbp-source { border-top: 1px solid var(--fbp-border); font-size: .875rem; margin: 2rem 0 0; padding: 1rem 0 0; }
.fbp-source p { margin: 0 0 .375rem; }

.fbp-card { border: 1px solid var(--fbp-border); border-radius: var(--fbp-radius); padding: .875rem 1rem; }
.fbp-card p { margin: 0 0 .25rem; }
.fbp-card__pin { font-size: 1.375rem; font-variant-numeric: tabular-nums; font-weight: 700; letter-spacing: .04em; }
.fbp-card__where { color: var(--fbp-black); font-weight: 600; }

@media (max-width: 480px) {
	.fbp-search__row { flex-direction: column; }
	.fbp-pin__digits span { width: 2.125rem; height: 2.625rem; font-size: 1.5rem; }
	.fbp ul.fbp-hits li.fbp-hit { flex-direction: column; gap: .25rem; }
	.fbp-hit__pin { flex-basis: auto; }
}

/* Inside the theme's article column (.fb-prose): keep list markers and
   spacing of the tool's own lists out. */
.fbp ul.fbp-grid li::marker,
.fbp ul.fbp-chips li::marker,
.fbp ul.fbp-hits li::marker { content: none; }
.fbp ul.fbp-grid li + li,
.fbp ul.fbp-chips li + li,
.fbp ul.fbp-hits li + li { margin-block-start: 0; }

/* 1.1: suggestions (combobox) */
.fbp-combo { position: relative; flex: 1 1 auto; min-width: 0; display: flex; }
.fbp-combo .fbp-search__input { width: 100%; }
.fbp ul.fbp-combo__list {
	position: absolute; z-index: 20; inset-inline: 0; top: calc(100% + 4px);
	list-style: none; margin: 0; padding: .25rem 0;
	max-height: min(22rem, 60vh); overflow-y: auto;
	background: var(--fbp-white); border: 1px solid var(--fbp-border); border-radius: 8px;
	box-shadow: 0 8px 24px rgba(16, 32, 64, .12);
}
.fbp ul.fbp-combo__list[hidden] { display: none; }
.fbp ul.fbp-combo__list li { margin: 0; }
.fbp ul.fbp-combo__list li::marker { content: none; }
.fbp-combo__opt { display: flex; flex-direction: column; gap: .125rem; padding: .5rem .75rem; cursor: pointer; }
.fbp-combo__opt[aria-selected="true"], .fbp-combo__opt:hover { background: var(--fbp-blue-light); }
.fbp-combo__title { color: var(--fbp-black); font-weight: 600; }
.fbp-combo__pin { color: var(--fbp-blue-dark); font-variant-numeric: tabular-nums; font-weight: 600; }
.fbp-combo__meta { color: var(--fbp-muted); font-size: .875rem; }
.fbp-combo__note { color: var(--fbp-muted); padding: .5rem .75rem; font-size: .9375rem; }
.fbp-search__hint { color: var(--fbp-muted); font-size: .875rem; margin: .375rem 0 0; }

/* Buttons */
.fbp-btn { min-height: 40px; border-radius: 8px; font: inherit; font-weight: 600; padding: .375rem 1rem; cursor: pointer; }
.fbp-btn--quiet { background: var(--fbp-white); border: 1px solid var(--fbp-blue); color: var(--fbp-blue-dark); }
.fbp-btn--quiet:hover { background: var(--fbp-blue-light); }
.fbp-btn[disabled] { opacity: .6; cursor: progress; }
.fbp select { min-height: 40px; border: 1px solid var(--fbp-border); border-radius: 8px; background: var(--fbp-white); font: inherit; padding: .25rem .5rem; }
.fbp select:focus-visible { outline: 3px solid var(--fbp-blue); outline-offset: 2px; }

/* Near me */
.fbp-me { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin: -0.5rem 0 1.5rem; }
.fbp-me[hidden] { display: none; }
.fbp-me > [data-fbp-me-list] { flex: 1 0 100%; }

/* Breadcrumb trail */
.fbp-trail ol { display: flex; flex-wrap: wrap; gap: .25rem; list-style: none; margin: 0 0 1rem; padding: 0; font-size: .875rem; color: var(--fbp-muted); }
.fbp-trail li { margin: 0; }
.fbp-trail li::marker { content: none; }
.fbp-trail li + li::before { content: "›"; margin-inline-end: .25rem; color: var(--fbp-muted); }

/* Nearby */
.fbp-near__form { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 0 0 .75rem; }
.fbp ol.fbp-nearlist { list-style: none; margin: 0; padding: 0; border: 1px solid var(--fbp-border); border-radius: var(--fbp-radius); counter-reset: none; }
.fbp ol.fbp-nearlist li { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .75rem; margin: 0; padding: .625rem .75rem; border-bottom: 1px solid var(--fbp-border); }
.fbp ol.fbp-nearlist li:last-child { border-bottom: 0; }
.fbp ol.fbp-nearlist li::marker { content: none; }
.fbp ol.fbp-nearlist li + li { margin-block-start: 0; }
.fbp-nearlist__name { font-weight: 600; }
.fbp-nearlist__pin { font-variant-numeric: tabular-nums; }
.fbp-nearlist__km { margin-inline-start: auto; font-variant-numeric: tabular-nums; color: var(--fbp-black); }
.fbp-near__note { font-size: .8125rem; margin: .5rem 0 0; }

/* Search results 1.1 */
.fbp-hit__type { flex: 0 0 7.5rem; color: var(--fbp-muted); font-size: .8125rem; padding-top: .125rem; }
.fbp-hit__text .fbp-hit__pin { margin-inline-start: .375rem; font-variant-numeric: tabular-nums; color: var(--fbp-blue-dark); font-weight: 600; }
.fbp-hit__title { font-weight: 600; }
.fbp-hit__where { color: var(--fbp-text); font-size: .9375rem; }
.fbp-filter ul { display: flex; flex-wrap: wrap; gap: .375rem; list-style: none; margin: 0 0 1rem; padding: 0; }
.fbp-filter li { margin: 0; }
.fbp-filter li::marker { content: none; }
.fbp-filter a, .fbp-filter span { display: inline-block; border: 1px solid var(--fbp-border); border-radius: 999px; padding: .25rem .75rem; font-size: .875rem; text-decoration: none; }
.fbp-filter span[aria-current] { background: var(--fbp-blue); border-color: var(--fbp-blue); color: var(--fbp-white); }
[aria-busy="true"] { opacity: .6; }
@media (max-width: 480px) {
	.fbp-hit__type { flex-basis: auto; }
	.fbp-nearlist__km { margin-inline-start: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.fbp * { scroll-behavior: auto !important; transition: none !important; }
}