/*
 * PotsKids: GeoDirectory v2 listings in the look of the old site (GeoDirectory v1).
 * Values measured on the reference stack. Loaded after GeoDirectory's Bootstrap (AyeCode UI).
 */

:root {
	--color-accent: #d06e31;
	--color-text: #555;
	--color-heading: #172a77;
	--color-border: #ddd;
	--color-border-light: #e1e1e1;
	--color-separator: #ccc;
	--color-list-separator: #999;
	--color-search-band: #f2f2f2;
	--font-size-small: 12px;
	--line-height-small: 17px;
	--detail-info-width: 261px;
}

/* Links inside GeoDirectory output use the theme colour, not Bootstrap blue. */
#wrapper .bsui a:not(.btn) {
	color: var(--color-accent);
	text-decoration: none;
}

#wrapper .bsui a:not(.btn):hover {
	text-decoration: underline;
}

/* Search bar */
.geodir-search-container {
	background: var(--color-search-band);
	border-bottom: 1px solid var(--color-border);
	padding: 14px 3px 0;
}

.geodir-search-container form.geodir-listing-search {
	max-width: 520px;
}

.geodir-search-container .geodir-search-form-wrapper {
	margin-bottom: 8px !important; /* beats Bootstrap's mb-3 utility */
}

/* The old theme gives form blocks a bottom margin, which made the search band taller than before. */
.geodir-search-container .geodir-search,
.geodir-search-container .geodir-search div {
	margin-bottom: 0;
}

.geodir-search-container .search_text {
	height: 38px;
	border: 1px solid var(--color-separator);
	border-radius: 3px;
	font-size: 14px;
}

.geodir-search-container .gd-search-field-search {
	max-width: 350px !important; /* beats Bootstrap's column width */
}

.geodir-search-container .geodir_submit_search {
	max-width: 150px;
}

.geodir-search-container .geodir_submit_search.btn {
	height: 38px;
	background: linear-gradient(#f9f9f9, #f1f1f1);
	border: 1px solid var(--color-border);
	border-radius: 3px;
	color: #333;
	font-size: 14px;
	font-weight: 700;
}

/* Listing card (archive item template "cp-listing") */
.cp-listing {
	display: flex;
	gap: 25px;
	padding: 15px 10px;
	color: var(--color-text);
	font-size: var(--font-size-small);
	line-height: var(--line-height-small);
}

.cp-listing-image {
	flex: 0 0 218px;
}

.cp-listing-image:not(:has(img)) {
	display: none;
}

.cp-listing-image img {
	width: 100%;
	height: auto;
	padding: 9px;
	border: 1px solid var(--color-border);
	background: #fff;
}

.cp-listing-body {
	flex: 1 1 auto;
	min-width: 0;
}

.cp-listing .geodir-entry-title {
	margin: 0 0 8px;
	font-size: 14px;
	font-weight: 700;
	line-height: 18px;
}

/* Field lists (card and detail info box): plain lines instead of Bootstrap list groups. */
.cp-listing .geodir-output-location .list-group,
.cp-detail-info .geodir-output-location .list-group {
	margin: 0 !important;
	border-radius: 0;
}

.cp-listing .geodir_post_meta.list-group-item {
	padding: 0 0 8px !important; /* beats Bootstrap's px-2 utility */
	border: 0;
	background: none;
	color: var(--color-text);
	font-size: var(--font-size-small);
	line-height: var(--line-height-small);
}

/* The old site showed the address with an icon only, no "Adresse:" label. */
.geodir-field-address .geodir_post_meta_title {
	display: none;
}

.cp-listing-excerpt .geodir_post_meta {
	margin-top: 4px;
}

/* List view (layout 0): one listing per row. Dotted separator, darker than the old dashed #ccc
   line, which the customer found too faint (feedback 04.11.2026). */
.geodir-category-list-view.row-cols-md-0 > .geodir-post {
	flex: 0 0 100%;
	max-width: 100%;
	margin-bottom: 0 !important;
}

.geodir-category-list-view.row-cols-md-0 > .geodir-post > .card {
	border: 0;
	border-bottom: 2px dotted var(--color-list-separator);
	border-radius: 0;
}

/* Grid view (layout 3, "Alle Einträge"): text only, framed boxes. */
.geodir-category-list-view.row-cols-md-3 .cp-listing-image,
.geodir-category-list-view.row-cols-md-3 .cp-listing-excerpt {
	display: none;
}

.geodir-category-list-view.row-cols-md-3 > .geodir-post {
	margin-bottom: 15px !important;
}

.geodir-category-list-view.row-cols-md-3 > .geodir-post > .card {
	border: 1px solid var(--color-border-light);
	border-radius: 0;
}

.geodir-category-list-view.row-cols-md-3 .cp-listing {
	padding: 14px;
}

/* Listing detail page: content left, info box right. */
.cp-detail {
	display: grid;
	grid-template-columns: minmax(0, 1fr) var(--detail-info-width);
	gap: 24px;
	align-items: start;
}

/* Descriptions contain empty "&nbsp;" paragraphs as spacers; v1 had no paragraph margin. */
.cp-detail-main .geodir-field-post_content p {
	margin: 0;
}

/* German hyphenation: the text column is narrower than on the old site and ragged without it. */
.cp-detail-main .geodir-field-post_content,
.cp-listing-excerpt {
	hyphens: auto;
}

/* Links ("Weiterlesen", addresses) stay whole. */
.cp-detail-main .geodir-field-post_content a,
.cp-listing-excerpt a {
	hyphens: manual;
}

/* Headings in descriptions: the theme's heading styles (small, bold, blue), which Bootstrap's
   ".bsui hN" rules would otherwise replace with large grey headings. Sizes from the old site. */
.cp-detail-main .geodir-field-post_content :is(h1, h2, h3, h4, h5, h6) {
	margin: 0.5em 0;
	color: var(--color-heading);
	font-weight: 700;
	line-height: 1.6;
}

.cp-detail-main .geodir-field-post_content :is(h1, h2, h4) {
	font-size: 21px;
}

.cp-detail-main .geodir-field-post_content h5 {
	font-size: 15.75px;
}

.cp-detail-main .geodir-field-post_content :is(h3, h6) {
	font-size: 14px;
}

.cp-detail-info .geodir-output-location .list-group {
	padding: 0 10px;
	border: 1px solid var(--color-border);
}

.cp-detail-info .geodir_post_meta.list-group-item {
	padding: 10px 0;
	border: 0;
	border-bottom: 1px solid var(--color-border);
	background: none;
	color: var(--color-text);
	font-size: 14px;
}

.cp-detail-info .geodir_post_meta.list-group-item:last-child {
	border-bottom: 0;
}

/* Prev/next as plain text links like "Zurück" / "Weiter" on the old site, with the old gap
   below the text. */
.cp-detail-main .geodir-pos_navigation {
	margin-top: 30px;
}

.cp-detail-main a.badge[rel="prev"],
.cp-detail-main a.badge[rel="next"] {
	padding: 0;
	background: none !important;
	color: var(--color-accent) !important;
	font-size: 14px;
	font-weight: 400;
}

/* Print template pages ("Druckvorlage", wrapper #druckversion in the page content): text only,
   the description labelled "Angebot:". */
#druckversion .geodir_post_meta_icon i,
#druckversion .cp-listing-image {
	display: none;
}

#druckversion .geodir-field-post_content::before {
	content: "Angebot: ";
	font-weight: 700;
}

@media (max-width: 767px) {
	.cp-listing {
		flex-direction: column;
		gap: 10px;
	}

	.cp-listing-image {
		flex-basis: auto;
	}

	.cp-detail {
		grid-template-columns: 1fr;
	}
}
