@charset "utf-8";
/* Videogame Quiz, responzivní verze (Bootstrap 4.3.1 z hlavního webu + tyto styly).
   Barvy vychází z původního kvízu: tmavě modrý podklad #002d4e, oranžový akcent #ef7f01. */
:root {
	--q-bg: #002d4e;
	--q-bg-tmava: #00203a;
	--q-karta: #0b3a60;
	--q-karta-hlavicka: #0e4672;
	--q-okraj: #1f5785;
	--q-text: #eef1f6;
	--q-text-tlumeny: #a9b6cb;
	--q-akcent: #ef7f01;
	--q-akcent-hover: #ff9420;
	--q-ok: #6fbf3b;
	--q-ok-tmava: #2f6b12;
	--q-bad: #e5484d;
	--q-bad-tmava: #7a1d20;
	--q-zaobleni: 12px;
}

body.quiz {
	background-color: var(--q-bg);
	color: var(--q-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.quiz-container { max-width: 1400px; }
.quiz a { color: var(--q-akcent); }
.quiz a:hover { color: var(--q-akcent-hover); }
.quiz-text-muted { color: var(--q-text-tlumeny) !important; }
.text-quiz-ok { color: var(--q-ok) !important; }
.text-quiz-bad { color: var(--q-bad) !important; }
.quiz-odkaz { color: var(--q-akcent) !important; }

/* Navigace a záhlaví */
.quiz-nav {
	background-color: var(--q-bg-tmava);
	box-shadow: 0 2px 12px rgba(0, 0, 0, .35);
}
/* Logo kvízu v navigaci: na mobilu přes šířku vedle tlačítka menu, od tabletu podle výšky */
.quiz-nav { padding-top: 10px; padding-bottom: 10px; }
.quiz-nav .navbar-brand { max-width: calc(100% - 64px); margin-right: 1rem; padding: 0; }
.quiz-nav-logo { display: block; width: 100%; max-width: 360px; height: auto; }
@media (min-width: 576px) { .quiz-nav-logo { width: auto; max-width: none; height: 44px; } }
@media (min-width: 1200px) { .quiz-nav-logo { height: 58px; } }
.quiz-nav .nav-link { color: var(--q-text-tlumeny) !important; font-weight: 500; }
.quiz-nav .nav-link:hover, .quiz-nav .nav-item.active .nav-link { color: #fff !important; }
.quiz-nav .nav-item.active .nav-link { box-shadow: inset 0 -3px 0 var(--q-akcent); }

/* Karty */
.quiz-card {
	background-color: var(--q-karta);
	border: 1px solid var(--q-okraj);
	border-radius: var(--q-zaobleni);
	box-shadow: 0 6px 20px rgba(0, 0, 0, .25);
	overflow: hidden;
}
.quiz-card .card-header {
	background-color: var(--q-karta-hlavicka);
	border-bottom: 1px solid var(--q-okraj);
	font-weight: 600;
}

/* Tlačítka */
.btn-quiz {
	background-color: var(--q-akcent);
	border-color: var(--q-akcent);
	color: #fff !important;
	font-weight: 600;
}
.btn-quiz:hover, .btn-quiz:focus { background-color: var(--q-akcent-hover); border-color: var(--q-akcent-hover); }
.quiz .btn-outline-light { color: var(--q-text) !important; border-color: var(--q-okraj); }
.quiz .btn-outline-light:hover { background-color: var(--q-okraj); }
.quiz-btn-ok { background-color: var(--q-ok); color: #fff !important; font-weight: 600; }
.quiz-btn-bad { background-color: var(--q-bad); color: #fff !important; font-weight: 600; }
.quiz-btn-ok:hover, .quiz-btn-bad:hover { filter: brightness(1.1); }

/* Hlášky */
.alert-quiz { background-color: rgba(239, 127, 1, .15); border: 1px solid var(--q-akcent); color: var(--q-text); }
.quiz-vysledek-ok { background-color: var(--q-ok-tmava); border: 1px solid var(--q-ok); color: #fff; font-size: 1.1rem; }
.quiz-vysledek-bad { background-color: var(--q-bad-tmava); border: 1px solid var(--q-bad); color: #fff; font-size: 1.1rem; }

/* Otázka */
.quiz-cislo { font-weight: 700; font-size: 1.1rem; color: var(--q-akcent); }
.quiz-stitek-ok { background-color: var(--q-ok-tmava); color: #fff; }
.quiz-stitek-ceka { background-color: rgba(239, 127, 1, .25); color: var(--q-akcent); }
.quiz-obrazek { position: relative; background-color: #001829; text-align: center; }
.quiz-obrazek img { max-height: 420px; width: auto; margin: 0 auto; }
.quiz-obrazek-zvetsit {
	position: absolute; right: 12px; bottom: 12px;
	background-color: rgba(0, 0, 0, .6); color: #fff;
	border-radius: 50%; width: 38px; height: 38px; line-height: 38px;
}
.quiz-kredit { font-size: .75rem; color: var(--q-text-tlumeny); padding: 4px 12px; text-align: right; }
.quiz-otazka { font-size: 1.5rem; font-weight: 600; line-height: 1.35; margin: .25rem 0 1.25rem; }
.quiz-otazka-mala { font-size: 1.1rem; }
@media (min-width: 992px) { .quiz-otazka { font-size: 1.75rem; } }

/* Odpovědi A–D */
.quiz-odpoved {
	display: flex; align-items: center;
	min-height: 64px; height: 100%;
	padding: 12px 16px;
	background-color: var(--q-karta-hlavicka);
	border: 2px solid var(--q-okraj);
	border-radius: var(--q-zaobleni);
	color: var(--q-text) !important;
	text-decoration: none !important;
	transition: border-color .15s, transform .15s, background-color .15s;
}
a.quiz-odpoved:hover { border-color: var(--q-akcent); background-color: #125184; transform: translateY(-2px); }
.quiz-pismeno {
	flex: 0 0 38px; height: 38px; line-height: 38px;
	margin-right: 14px; text-align: center;
	border-radius: 50%; background-color: var(--q-akcent); color: #fff; font-weight: 700;
}
.quiz-odpoved-text { flex: 1 1 auto; font-size: 1.05rem; }
.quiz-odpoved-ikona { font-size: 1.4rem; margin-left: 10px; }
.quiz-odpoved-spravna { border-color: var(--q-ok); background-color: var(--q-ok-tmava); }
.quiz-odpoved-spravna .quiz-pismeno { background-color: var(--q-ok); }
.quiz-odpoved-spatna { border-color: var(--q-bad); background-color: var(--q-bad-tmava); }
.quiz-odpoved-spatna .quiz-pismeno { background-color: var(--q-bad); }
.quiz-odpoved-neaktivni { opacity: .55; }

/* Schvalování a statistiky */
.quiz-schvaleni {
	border: 1px dashed var(--q-akcent);
	border-radius: var(--q-zaobleni);
	padding: 16px; margin-top: .5rem;
	background-color: rgba(239, 127, 1, .07);
}
.quiz-progress { height: 8px; background-color: var(--q-bg-tmava); border-radius: 4px; }
.quiz-bar-ok { background-color: var(--q-ok); }
.quiz-bar-bad { background-color: var(--q-bad); }
.quiz-stat-cislo { font-size: 1.4rem; font-weight: 700; }
.quiz-stat-nazev { font-size: .8rem; color: var(--q-text-tlumeny); text-transform: uppercase; letter-spacing: .05em; }

/* Bazar autora */
.quiz-bazar { display: block; color: var(--q-text) !important; text-decoration: none !important; }
.quiz-bazar img { border-radius: 6px; margin-bottom: 4px; }
.quiz-bazar span { font-size: .85rem; font-weight: 600; color: var(--q-akcent); }

/* Profil v postranním panelu */
.quiz-ikona { width: 64px; height: 64px; object-fit: cover; border-radius: 50%; border: 2px solid var(--q-akcent); }
.quiz-profil-jmeno { font-size: 1.2rem; font-weight: 700; }
.quiz-poradi > div { border-right: 1px solid var(--q-okraj); }
.quiz-poradi > div:last-child { border-right: 0; }
.quiz-poradi-cislo { font-size: 1.5rem; font-weight: 700; color: var(--q-akcent); }
.quiz-poradi-nazev { font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; color: var(--q-text-tlumeny); }
.quiz-poradi-body { font-size: .85rem; }
.quiz-statistika li { padding: 3px 0; }

/* Žebříčky */
.quiz-zebricek li a {
	display: flex; align-items: center;
	padding: 8px 14px;
	border-bottom: 1px solid rgba(31, 87, 133, .6);
	color: var(--q-text) !important; text-decoration: none !important;
}
.quiz-zebricek li a:hover { background-color: var(--q-karta-hlavicka); }
.quiz-zebricek-ja a { background-color: rgba(239, 127, 1, .2); }
.quiz-zebricek-poradi {
	flex: 0 0 30px; height: 30px; line-height: 30px; margin-right: 10px;
	text-align: center; border-radius: 50%; font-size: .85rem; font-weight: 700;
	background-color: var(--q-bg-tmava);
}
.quiz-medaile-1 { background-color: #d4a017; color: #000; }
.quiz-medaile-2 { background-color: #b8bec7; color: #000; }
.quiz-medaile-3 { background-color: #b3672b; color: #fff; }
.quiz-zebricek-jmeno { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.quiz-zebricek-body { font-weight: 600; color: var(--q-akcent); margin-left: 8px; }
/* Oddělovač přeskočených míst: klikatá čára na výšku jednoho řádku */
.quiz-zebricek-mezera {
	height: 47px;
	border-bottom: 1px solid rgba(31, 87, 133, .6);
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='10'%3E%3Cpolyline points='0,8 7,2 14,8' fill='none' stroke='%23a9b6cb' stroke-width='2'/%3E%3C/svg%3E") repeat-x 0 center;
	background-size: 14px 10px;
	background-origin: content-box; background-clip: content-box;
	padding: 0 14px;
	opacity: .7;
}
/* Zkrácený žebříček: poslední dva řádky (cca 94 px) se ztrácí do ztracena */
.quiz-zebricek-zkraceny {
	-webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 94px), rgba(0, 0, 0, .12));
	mask-image: linear-gradient(to bottom, #000 calc(100% - 94px), rgba(0, 0, 0, .12));
}
.quiz-card .card-footer { background-color: var(--q-karta-hlavicka); border-top: 1px solid var(--q-okraj); font-weight: 600; }
.quiz-strankovani .page-link { background-color: var(--q-karta); border-color: var(--q-okraj); color: var(--q-text); }
.quiz-strankovani .page-link:hover { background-color: var(--q-karta-hlavicka); color: var(--q-akcent-hover); }
.quiz-strankovani .page-item.active .page-link { background-color: var(--q-akcent); border-color: var(--q-akcent); color: #fff; }
.quiz-strankovani .page-item.disabled .page-link { background-color: var(--q-bg-tmava); border-color: var(--q-okraj); color: var(--q-text-tlumeny); }
.quiz-strankovani .page-item { margin-bottom: 4px; }

/* Formulář otázky */
.quiz-input, .quiz-input:focus {
	background-color: var(--q-bg-tmava);
	border-color: var(--q-okraj);
	color: var(--q-text);
}
.quiz-input:focus { border-color: var(--q-akcent); box-shadow: 0 0 0 .2rem rgba(239, 127, 1, .25); }
.quiz-input option { background-color: var(--q-bg-tmava); }
.quiz-select { max-width: 220px; }
.quiz-pismeno-input { background-color: var(--q-akcent); border-color: var(--q-akcent); color: #fff; font-weight: 700; min-width: 42px; justify-content: center; }
.quiz .form-control-file { color: var(--q-text-tlumeny); }
.quiz-hr { border-top-color: var(--q-okraj); }

/* Tabulka otázek autora */
.quiz-tabulka { color: var(--q-text); }
.quiz-tabulka th { border-top: 0; border-bottom: 1px solid var(--q-okraj) !important; color: var(--q-text-tlumeny); font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; white-space: nowrap; }
.quiz-tabulka td { border-top: 1px solid rgba(31, 87, 133, .6); vertical-align: middle; }
.quiz-tabulka tbody tr:hover { background-color: var(--q-karta-hlavicka); }
.quiz-tabulka-odkaz { color: var(--q-text) !important; }
.quiz-tabulka-schvaleni { min-width: 140px; }
.quiz-stitek-bad { background-color: var(--q-bad-tmava); color: #fff; }

/* Mřížka všech otázek */
.quiz-legenda { display: inline-flex; align-items: center; margin: 0 16px 6px 0; }
.quiz-dlazdice-vzor { display: inline-block; width: 16px; height: 16px; border-radius: 4px; margin-right: 6px; }
.quiz-dlazdice { display: flex; flex-wrap: wrap; }
.quiz-dlazdice a {
	display: flex; align-items: center; justify-content: center;
	width: 52px; height: 44px; margin: 0 6px 6px 0;
	border-radius: 8px; font-weight: 600; font-size: .9rem;
	color: #fff !important; text-decoration: none !important;
	transition: transform .15s;
}
.quiz-dlazdice a:hover { transform: translateY(-2px); }
.quiz-dlazdice-nova { background-color: #2b6aa0; }
.quiz-dlazdice-ok { background-color: var(--q-ok); }
.quiz-dlazdice-bad { background-color: var(--q-bad); }
.quiz-dlazdice-ceka { background-color: #3d4b5c; color: var(--q-text-tlumeny) !important; }
.quiz-dlazdice-moje { background-color: var(--q-akcent); }

/* Reklamy AdSense; na localhostu jen rámeček s popiskem (.quiz-reklama-misto) */
.quiz-reklama { margin: 0 auto; text-align: center; overflow: hidden; }
.quiz-reklama-misto {
	display: flex; align-items: center; justify-content: center;
	border: 1px dashed var(--q-okraj);
	border-radius: 6px;
	color: var(--q-text-tlumeny); font-size: .75rem; text-transform: uppercase; letter-spacing: .1em;
	background-color: rgba(0, 0, 0, .15);
}
.quiz-reklama-300x600 { width: 300px; height: 600px; }
.quiz-reklama-300x250 { width: 300px; height: 250px; max-width: 100%; }
.quiz-reklama-responzivni { width: 100%; }
.quiz-reklama-misto.quiz-reklama-responzivni { max-width: 336px; height: 280px; }
/* Nevyplněná reklama nenechá prázdné místo */
ins.adsbygoogle[data-ad-status="unfilled"] { display: none !important; }
.quiz-sticky { position: sticky; top: 80px; }

/* Patička */
.quiz-footer {
	background-color: var(--q-bg-tmava);
	border-top: 1px solid var(--q-okraj);
	padding: 24px 0 16px;
	margin-top: 2rem;
}
.quiz-footer-logo { height: 40px; width: auto; margin: 4px 8px 4px 0; }

/* Modální okna */
.quiz-modal { background-color: var(--q-karta); color: var(--q-text); border: 1px solid var(--q-okraj); border-radius: var(--q-zaobleni); }
.quiz-modal .modal-header { border-bottom-color: var(--q-okraj); }
.quiz-modal .close { color: var(--q-text); text-shadow: none; opacity: .8; }
.quiz-nadpis { color: var(--q-akcent); font-weight: 700; margin-top: 1rem; }
