/* =========================================================
   Tabs, Map and Image Slider blocks (inc/page-blocks.php).
   Surface/border/text tokens from style.css, so dark mode
   and the site's accent colour carry through.
   ========================================================= */

/* ---------- Tabs ---------- */
.ust-tabs { margin: 0 0 1.6em; }
.ust-tabs__nav { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 1.25em; }
.ust-tabs--align-center .ust-tabs__nav { justify-content: center; }
.ust-tabs__tab {
	appearance: none;
	border: 0;
	background: none;
	color: var(--ust-surface-text-muted);
	font: inherit;
	font-weight: 600;
	padding: .7em 1.1em;
	cursor: pointer;
	border-radius: var(--ust-radius);
	transition: color .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.ust-tabs__tab:hover { color: var(--ust-surface-text); }
.ust-tabs__tab:focus-visible { outline: 2px solid var(--ust-accent, var(--ust-color-button-bg)); outline-offset: 2px; }
.ust-tabs__tab[aria-selected="true"] { color: var(--ust-accent, var(--ust-color-button-bg)); }
.ust-tabs__panel:focus-visible { outline: 2px solid var(--ust-accent, var(--ust-color-button-bg)); outline-offset: 4px; }
.ust-tabs__panel > :last-child { margin-bottom: 0; }

/* underline */
.ust-tabs--underline .ust-tabs__nav { gap: 0; border-bottom: 1px solid var(--ust-surface-border); }
.ust-tabs--underline .ust-tabs__tab { border-radius: 0; margin-bottom: -1px; box-shadow: inset 0 -2px 0 transparent; }
.ust-tabs--underline .ust-tabs__tab[aria-selected="true"] { box-shadow: inset 0 -3px 0 var(--ust-accent, var(--ust-color-button-bg)); }

/* pills */
.ust-tabs--pills .ust-tabs__tab { border-radius: 999px; background: var(--ust-surface-2); }
.ust-tabs--pills .ust-tabs__tab[aria-selected="true"] { background: var(--ust-accent, var(--ust-color-button-bg)); color: var(--ust-color-button-text, #fff); }

/* boxed */
.ust-tabs--boxed .ust-tabs__nav { gap: 0; margin: 0; }
.ust-tabs--boxed .ust-tabs__tab { border-radius: var(--ust-radius) var(--ust-radius) 0 0; border: 1px solid transparent; border-bottom: 0; }
.ust-tabs--boxed .ust-tabs__tab[aria-selected="true"] { background: var(--ust-surface); border-color: var(--ust-surface-border); color: var(--ust-surface-text); position: relative; z-index: 1; margin-bottom: -1px; }
.ust-tabs--boxed .ust-tabs__panel { background: var(--ust-surface); border: 1px solid var(--ust-surface-border); border-radius: 0 var(--ust-radius) var(--ust-radius) var(--ust-radius); padding: 1.5em; }

@media (max-width: 600px) {
	.ust-tabs__nav { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
	.ust-tabs__nav::-webkit-scrollbar { display: none; }
	.ust-tabs__tab { flex: 0 0 auto; white-space: nowrap; }
	.ust-tabs--boxed .ust-tabs__panel { padding: 1.1em; border-radius: 0 0 var(--ust-radius) var(--ust-radius); }
}

/* Editor: every tab shown as a labelled card so all content stays editable. */
.ust-tabs-editor .ust-tab-editor { border: 1px dashed var(--ust-surface-border); border-radius: var(--ust-radius); padding: 12px 16px; margin: 0 0 12px; }
.ust-tab-editor__title { font-weight: 700; margin: 0 0 8px; padding-bottom: 6px; border-bottom: 1px solid var(--ust-surface-border); }

/* ---------- Map ---------- */
.ust-map { position: relative; width: 100%; height: var(--ust-map-h, 400px); border-radius: var(--ust-radius); overflow: hidden; background: var(--ust-surface-2); }
.ust-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
@media (max-width: 600px) { .ust-map { height: min(var(--ust-map-h, 400px), 70vh); } }
.ust-map-placeholder { padding: 2em; text-align: center; border: 1px dashed var(--ust-surface-border); border-radius: var(--ust-radius); color: var(--ust-surface-text-muted); }

/* ---------- Image Slider (engine: assets/js/ums-slider.js) ---------- */
.ust-image-slider { position: relative; overflow: hidden; border-radius: var(--ust-radius); margin: 0 0 1.6em; }
.ust-image-slider .eb-slider-init { display: flex; }
.ust-image-slider__slide { flex: 0 0 100%; margin: 0; position: relative; }
.ust-image-slider__slide > a { display: block; }
.ust-image-slider__img { display: block; width: 100%; height: auto; margin: 0; }
.ust-image-slider--fixed .ust-image-slider__img { height: var(--ust-slider-h); object-fit: cover; }
.ust-image-slider__caption {
	position: absolute; left: 0; right: 0; bottom: 0;
	padding: 2.4em 1.2em 1em;
	color: #fff; font-weight: 600;
	background: linear-gradient(transparent, rgba(0,0,0,.65));
}
.ust-image-slider-editor__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px; margin: 0 0 10px; }
.ust-image-slider-editor__grid img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 6px; display: block; }