/*
 * GeekMag widgets (geekmagfeatures): additions to main.css.
 * Loaded right after main.css; uses the theme tokens, so dark mode follows.
 */

/* ---------- Shared ---------- */
.gm-widget-icon { display: inline-flex; flex: none; align-items: center; color: var(--gm-accent); line-height: 1; }
.gm-tabs__tab[aria-selected="true"] .gm-widget-icon { color: inherit; }
.gm-divider { display: block; width: 100%; border: 0; border-radius: 99px; }

/* ---------- Tabs ---------- */
.gm-tabs__tab { display: inline-flex; align-items: center; gap: 8px; transition: border-color .15s, color .15s, background-color .15s; }
.gm-tabs__tab:not([aria-selected="true"]):hover { border-color: var(--gm-accent); color: var(--gm-accent-text); }
.gm-tabs__panel:focus-visible { outline-offset: 3px; }
.gm-tabs__panel.gm-prose > :first-child, .gm-accordion__content > :first-child { margin-top: 0; }
.gm-tabs__panel.gm-prose > :last-child, .gm-accordion__content > :last-child { margin-bottom: 0; }
.gm-tabs__empty { margin: 0; padding: 8px; color: var(--gm-muted); }
@media (min-width: 700px) {
	.gm-tabs--vertical { display: grid; grid-template-columns: minmax(140px, 30%) minmax(0, 1fr); align-items: start; gap: 14px; }
	.gm-tabs--vertical > .gm-tabs__list { flex-direction: column; flex-wrap: nowrap; margin: 0; }
	.gm-tabs--vertical .gm-tabs__tab { justify-content: flex-start; text-align: left; }
}

/* ---------- Accordion ---------- */
.gm-accordion__title { flex: 1 1 auto; min-width: 0; }
.gm-accordion summary:hover { color: var(--gm-accent-text); }
.gm-accordion summary:focus-visible { outline-offset: -2px; }

/* ---------- Carousels ---------- */
/* Cards of one row share the same height. */
.gm-carousel .gm-carousel__item:not(.gm-list-widget) { display: flex; }
.gm-carousel .gm-carousel__item:not(.gm-list-widget) > .gm-card { flex: 1 1 auto; width: 100%; min-width: 0; }
.gm-carousel--list .gm-carousel__item { align-content: start; }
/* Carousel v2: card shape from the widget's "Image Size" setting. */
.gm-carousel--wide .gm-card--overlay { min-height: 0; aspect-ratio: 16 / 9; }
.gm-carousel--classic .gm-card--overlay { min-height: 0; aspect-ratio: 4 / 3; }
.gm-carousel--no-cats .gm-chips, .gm-carousel--no-meta .gm-meta, .gm-carousel--no-review .gm-review-badge { display: none; }

/* ---------- Author ---------- */
.gm-author--widget { margin-top: 0; }

/* ---------- YouTube channel ---------- */
.gm-ytv__poster { display: block; overflow: hidden; }
.gm-ytv__poster img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gm-ytv__poster::after { z-index: 1; }
.gm-ytv__poster:focus-visible, .gm-ytv__item:focus-visible { outline: 2px solid var(--gm-accent); outline-offset: -2px; }
.gm-ytv__head .gm-ytv__title { margin: 0; color: #fff; font-size: 1rem; }
.gm-ytv__head a { display: inline-flex; align-items: center; padding: 6px 12px; border-radius: 99px; background: rgba(255, 255, 255, .1); transition: background-color .15s, color .15s; }
.gm-ytv__head a:hover { background: #f00; color: #fff; }
/* Phones and tablets: the player sits above the list, so the list gets its own
   height (with flex-basis 0 it collapsed to nothing and no video was listed). */
@media (max-width: 960px) {
	.gm-ytv__list { flex: none; }
}