/*
Theme Name: Gamereactor
Theme URI: https://www.gamereactor.kr/
Author: Clickout Media
Description: 1:1-genskabelse af Gamereactors design til den migrerede WordPress-platform. Bygget ud fra det oprindelige frontend.css og markup-struktur, så .kr (og senere øvrige TLD'er) kan skifte platform uden visuelt brud.
Version: 0.1.0
Requires at least: 6.4
Requires PHP: 8.1
Text Domain: gamereactor
*/

/* Selve designet ligger i assets/css/frontend.css (originalens stylesheet).
   Denne fil bruges kun til tema-headeren + evt. WP-specifikke justeringer. */

/* "Copied!"-boblen ved Instagram/TikTok-ikonerne. Originalen viser den via
   sin egen JS; her styres den af klassen .is-visible fra app.js. */
.socialIcons .linkCopied {
	position: absolute;
	transform: translateY(-1.6rem);
	padding: 2px 6px;
	border-radius: 3px;
	background: #222;
	color: #fff;
	font-size: 11px;
	white-space: nowrap;
	opacity: 0;
	pointer-events: none;
	transition: opacity .15s ease-in-out;
}
.socialIcons .linkCopied.is-visible { opacity: 1; }

/* Brødtekstens billeder kommer fra kilden med originalmål i width/height.
   Uanset hvad der står i attributterne må de aldrig sprænge artikelspalten. */
.breadtext img,
.breadtext video,
.breadtext iframe {
	max-width: 100%;
	height: auto;
}

/* Billedtekster under figurerne, som originalen viser dem. */
figure.gr-image {
	margin: 0 0 1em;
}
figure.gr-image figcaption {
	font-size: 12px;
	color: #767676;
	padding-top: 4px;
}

/* ---------------------------------------------------------------------------
 * Bokse i højrespalten (casino-modulerne og fremhævede artikler).
 *
 * Temaets .artistyle3 article.guide er 232px bred — kortbredden fra den brede
 * spalte. I den 335px smalle sidebjælke gav det 91px død luft i højre side og
 * fik indholdet til at se venstrestillet ud. Overskriftsbjælken var samtidig
 * 302 af 335px.
 *
 * Her fylder boksen spalten, bjælken går kant til kant, og indholdet har
 * symmetrisk polstring.
 * ------------------------------------------------------------------------ */
.colthin .gr-sidebox {
	width: 100%;
	max-width: 100%;
	margin: 0 0 1em;
	padding: 0 0 12px;
	box-sizing: border-box;
	overflow: hidden;
}

.colthin .gr-sidebox > h4.hbar1 {
	margin: 0 0 10px;
	width: 100%;
	box-sizing: border-box;
}

.colthin .gr-sidebox .content,
.colthin .gr-sidebox article.guide {
	width: auto;
	max-width: none;
	margin: 0;
	padding: 0 12px;
	box-sizing: border-box;
	float: none;
}

.colthin .gr-sidebox article.guide + article.guide {
	margin-top: 14px;
}

.colthin .gr-sidebox img {
	width: 100%;
	height: auto;
	display: block;
	margin: 0 0 6px;
}