/* Coolysurf Board Hire — light, theme-friendly styling.
   Uses neutral spacing and inherits theme fonts/colours where possible.
   Accent colour picks up the ocean teal used in the data pack. */

:root {
	--csbh-accent: #0f5c6b;
	--csbh-accent-ink: #ffffff;
	--csbh-line: #e2e8ea;
	--csbh-soft: #f4f8f9;
}

.csbh-single { max-width: 820px; margin: 0 auto; padding: 1.5rem 1rem 3rem; }
.csbh-eyebrow { text-transform: uppercase; letter-spacing: .08em; font-size: .8rem; font-weight: 700; color: var(--csbh-accent); margin: 0 0 .25rem; }
.csbh-title { margin: 0 0 .5rem; line-height: 1.1; }
.csbh-lead { font-size: 1.15rem; opacity: .85; margin: 0 0 1.25rem; }
.csbh-hero img { width: 100%; height: auto; border-radius: 12px; display: block; }
.csbh-body { margin: 1.25rem 0; line-height: 1.6; }

.csbh-details { margin-top: 1.5rem; }
.csbh-h { font-size: 1.15rem; margin: 1.5rem 0 .5rem; }

.csbh-specs, .csbh-price { width: 100%; border-collapse: collapse; margin: 0 0 .5rem; }
.csbh-specs th, .csbh-specs td, .csbh-price th, .csbh-price td {
	text-align: left; padding: .55rem .75rem; border-bottom: 1px solid var(--csbh-line); vertical-align: top;
}
.csbh-specs th, .csbh-price th { width: 40%; font-weight: 600; }
.csbh-price td { font-variant-numeric: tabular-nums; font-weight: 600; }
.csbh-price tr:first-child { background: var(--csbh-soft); }
.csbh-paynote { font-size: .9rem; opacity: .7; margin: .35rem 0 1rem; }

.csbh-cta { margin: 1.25rem 0; }
.csbh-btn {
	display: inline-block; background: var(--csbh-accent); color: var(--csbh-accent-ink) !important;
	padding: .85rem 1.5rem; border-radius: 999px; font-weight: 700; text-decoration: none; font-size: 1.05rem;
}
.csbh-btn:hover { filter: brightness(1.08); }
.csbh-btn-missing { color: #b00; font-weight: 600; }

.csbh-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .6rem; margin: 1.5rem 0; }
.csbh-gallery img { width: 100%; height: auto; border-radius: 8px; display: block; }

.csbh-back { margin-top: 2rem; }
.csbh-back a { text-decoration: none; font-weight: 600; }

/* Archive grid (falls back to theme archive; helps if theme lists CPT) */
.post-type-archive-hire_board .hentry { border-bottom: 1px solid var(--csbh-line); padding-bottom: 1rem; }

/* --- Archive / listing page --- */
.csbh-archive { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1rem 3rem; }
.csbh-archive-head { margin-bottom: 1.5rem; }
.csbh-group { margin: 0 0 2.5rem; }
.csbh-group-title {
	font-size: 1.35rem; margin: 0 0 1rem; padding-bottom: .4rem;
	border-bottom: 2px solid var(--csbh-accent);
}
.csbh-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1.25rem; }
.csbh-card {
	display: flex; flex-direction: column; text-decoration: none; color: inherit;
	border: 1px solid var(--csbh-line); border-radius: 12px; overflow: hidden;
	background: #fff; transition: box-shadow .15s ease, transform .15s ease;
}
.csbh-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.10); transform: translateY(-2px); }
.csbh-card-img { aspect-ratio: 4 / 3; background: var(--csbh-soft); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.csbh-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.csbh-noimg { font-size: 2.5rem; opacity: .5; }
.csbh-card-body { padding: .85rem 1rem 1.1rem; display: flex; flex-direction: column; gap: .35rem; }
.csbh-card-title { font-size: 1.05rem; margin: 0; line-height: 1.25; }
.csbh-card-excerpt { font-size: .9rem; opacity: .75; margin: 0; }
.csbh-card-price { font-weight: 700; color: var(--csbh-accent); margin: .15rem 0 0; }
.csbh-empty { padding: 2rem 0; opacity: .7; }