/* ==========================================================================
   PinIndia AI × India Pin Code Directory plugin — integration styling
   Reskins the plugin's .ipd-* markup (search form, listings, single pin
   code page, shortcodes) to match this theme's glassmorphism/gradient
   design tokens, and bridges the theme's dark-mode toggle into the
   plugin's front end (which otherwise only follows OS preference or a
   fixed admin setting).
   ========================================================================== */

/* -- Base: let the plugin's wrapper inherit theme fonts/colors -- */
.ipd-wrapper{
	font-family: var(--font-body);
	color: var(--text);
	--ipd-border: var(--border);
	--ipd-bg-light: var(--bg-alt);
	--ipd-text: var(--text);
}
.ipd-wrapper h1, .ipd-wrapper h2, .ipd-wrapper h3{
	font-family: var(--font-display);
}
.ipd-pincode-header h1{ font-size: clamp(1.6rem, 3vw, 2.2rem); }

/* -- Breadcrumb -- */
.ipd-breadcrumb{ font-size: .85rem; color: var(--text-muted); margin-bottom: 20px; }
.ipd-breadcrumb a{ color: var(--text-muted); }
.ipd-breadcrumb a:hover{ color: var(--pin-saffron-500); }

/* -- Search form: glass pill treatment matching the hero search -- */
.pinindia-ipd-embed .ipd-search-form-wrap,
.ipd-search-form-wrap{ margin: 0; }
.ipd-search-row.ipd-search-main{
	background: var(--surface-glass);
	backdrop-filter: blur(16px) saturate(160%);
	border: 1px solid var(--border);
	border-radius: var(--radius-pill);
	padding: 8px 8px 8px 20px;
	box-shadow: var(--shadow-lg);
	flex-wrap: nowrap;
}
@media (max-width: 640px){
	.ipd-search-row.ipd-search-main{ flex-wrap: wrap; border-radius: var(--radius-md); padding: 14px; }
}
.ipd-search-input,
.ipd-search-form select{
	border: none;
	background: transparent;
	font-family: var(--font-mono);
	font-size: 1rem;
	color: var(--text);
	border-radius: 0;
}
.ipd-search-form select{
	font-family: var(--font-body);
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: var(--radius-sm);
}
.ipd-search-btn,
.ipd-filter-apply-btn{
	background: var(--pin-gradient-primary);
	border-radius: var(--radius-pill);
	font-weight: 600;
	flex-shrink: 0;
}
.ipd-location-btn{
	background: var(--surface-glass);
	border-radius: var(--radius-pill);
	color: var(--text);
	border-color: var(--border);
}
.ipd-search-row.ipd-search-filters{ margin-top: 12px; }

.ipd-autocomplete-results{
	background: var(--surface);
	border-color: var(--border);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-md);
	margin-top: 8px;
}
.ipd-autocomplete-results a{
	color: var(--text);
	border-bottom-color: var(--bg-alt);
}
.ipd-autocomplete-results a:hover{ background: var(--bg-alt); }

/* -- Grid lists (states, districts, popular/recent, nearby, other offices) -- */
.ipd-grid-list{ gap: 10px; }
.ipd-grid-list li{ border-bottom: none; padding: 0; }
.ipd-grid-list a{
	display: inline-flex;
	padding: .55em 1.1em;
	border-radius: var(--radius-pill);
	background: var(--surface);
	border: 1px solid var(--border);
	color: var(--text);
	font-weight: 500;
	transition: all var(--speed) var(--ease);
}
.ipd-grid-list a:hover{
	background: var(--pin-gradient-primary);
	color: #fff;
	border-color: transparent;
	text-decoration: none;
}

.ipd-alpha-link{ border-radius: var(--radius-sm); border-color: var(--border); color: var(--text); }
.ipd-alpha-link:hover{ background: var(--pin-gradient-primary); color: #fff; }

/* -- Single pin code header, detail table, actions -- */
.ipd-copy-pincode-value{
	font-family: var(--font-mono);
	color: var(--pin-indigo-700);
	font-size: 1.6rem;
}
.ipd-copy-btn{ background: var(--pin-gradient-accent); border-radius: var(--radius-pill); }
.ipd-print-btn{ background: var(--surface); border-color: var(--border); border-radius: var(--radius-pill); color: var(--text); }
.ipd-share-buttons a{ color: var(--pin-indigo-700); }

.ipd-detail-table{ border-radius: var(--radius-md); overflow: hidden; box-shadow: var(--shadow-sm); }
.ipd-detail-table th, .ipd-detail-table td{ border-bottom-color: var(--border); }
.ipd-detail-table th{ background: var(--bg-alt); font-family: var(--font-display); font-weight: 600; color: var(--text-muted); }

/* Modern layout header gets the theme's actual brand gradient. */
.ipd-layout-modern .ipd-pincode-header{
	background: var(--pin-gradient-primary);
	border-radius: var(--radius-lg);
}

.ipd-map-embed iframe{ border-radius: var(--radius-md); }
.ipd-not-found{ padding: 60px 0; }

/* -- Directory listing table -- */
.ipd-listing-table th{ background: var(--bg-alt); font-family: var(--font-display); }
.ipd-listing-table th, .ipd-listing-table td{ border-bottom-color: var(--border); }
.ipd-listing-table a{ color: var(--pin-indigo-700); }
.ipd-page-link{ border-radius: var(--radius-sm); border-color: var(--border); color: var(--text); }
.ipd-page-link.is-current{ background: var(--pin-gradient-primary); border-color: transparent; }

/* -- Pincode card shortcode -- */
.ipd-pincode-card{
	background: var(--surface);
	border-color: var(--border);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-sm);
}
.ipd-card-title a{ color: var(--pin-indigo-700); }
.ipd-card-link{ color: var(--pin-saffron-500); }

/* -- Sidebar -- */
.ipd-sidebar-column{
	background: var(--surface-glass);
	backdrop-filter: blur(16px);
	border-color: var(--border);
	border-radius: var(--radius-lg);
}

/* -- Embed scoping helpers (used when the theme prints its own section
   heading above a shortcode, e.g. [ipd_popular_pincodes]) -- */
.pinindia-ipd-embed.hide-heading .ipd-list-heading{ display: none; }
.pinindia-ipd-embed .ipd-recently-viewed h2{ display: none; }

/* ==========================================================================
   Dark-mode bridge: the theme's [data-theme] toggle takes precedence over
   the plugin's own OS-preference / forced on-off setting, so switching
   modes in the header always keeps the whole page consistent.
   ========================================================================== */
html[data-theme="dark"] .ipd-wrapper,
html[data-theme="dark"] .ipd-search-results{
	--ipd-border: rgba(255,255,255,.08);
	--ipd-bg-light: #101527;
	--ipd-text: #EDEDF7;
	--ipd-primary: var(--pin-teal-300, #5CD9CF);
	--ipd-primary-dark: var(--pin-teal-500, #0EA5A0);
	background: transparent;
}
html[data-theme="dark"] .ipd-search-input,
html[data-theme="dark"] .ipd-search-form select,
html[data-theme="dark"] .ipd-autocomplete-results{
	background: #121826;
	color: #EDEDF7;
}
html[data-theme="light"] .ipd-wrapper{
	--ipd-border: rgba(36,30,92,.10);
	--ipd-bg-light: #F1F0FB;
	--ipd-text: #191733;
	background: transparent;
}
