/* Fiche test - DOM 4/5 : colonne droite et blocs articles magazines */

/* Colonne droite - cadre, galerie et debordements */
#col_droite img {
	margin-bottom : 10px;
}

/* Styles pour la colonne droite - empÃªcher la scrollbar verticale */
#col_droite {
	box-sizing: border-box;
	overflow-x: hidden;
	overflow-y: visible;
}

#col_droite > *,
#col_droite fieldset {
	box-sizing: border-box;
	max-width: 100%;
	overflow-x: hidden;
	overflow-y: hidden;
	word-wrap: break-word;
	overflow-wrap: break-word;
	margin: 0px 10px 20px 15px;
}

/* Permettre au zoom de sortir du cadre pour les test_jeu_review et box_jeu_desc */
#col_droite .test_jeu_review {
	overflow: visible;
}

#col_droite .box_jeu_desc {
	overflow: visible;
}

#col_droite .wrapperMag {
	overflow: visible;
	overflow-y: hidden;
}

#col_droite .lightgallery {
	overflow: visible;
}

#col_droite #box_magazines.test-card-box {
	margin-top: 0;
	background: rgba(0, 0, 0, 0.2);
	/*background-color: rgba(250, 220, 0, 0.1);*/
}

.test-card-box-magazine-row {
	position: relative;
	display: block;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	min-inline-size: 0;
	box-sizing: border-box;
	margin: 0.38rem 0 1.15rem;
	padding: 0.52rem;
	text-align: center;
	background: rgba(250, 250, 250, 0.15);
	border: 2px solid rgba(255, 255, 255, 0.26);
	border-radius: 6px;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 18px rgba(0, 0, 0, 0.18);
	overflow: visible !important;
}

.test-card-box-magazine-row + .test-card-box-magazine-row {
	margin-top: 1.05rem;
}

.test-card-box .legend-mag {
	margin-left: 0;
	padding: 0 0.45rem;
	color: #f9c66a;
	text-shadow: 3px 3px 3px #003599;
	text-align: center;
	width: auto;
}

#box_magazines .test-magazine-group-header {
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
	margin: 0 0 0.5rem;
	padding: 0.35rem 0.45rem;
}

#box_magazines .test-magazine-group-header .magazine-left-title-link {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.12rem;
	width: 100%;
	min-width: 0;
	white-space: normal;
}

#box_magazines .test-magazine-group-header .magazine-left-title {
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: rgba(255, 255, 255, 0.9);
	font-family: var(--font-magazine-page-title);
	font-size: 1rem;
	line-height: 0.95;
	text-align: center;
	text-shadow: 1px 1px 1px #0000c9;
}

#box_magazines .test-magazine-group-header .magazine-left-date {
	padding: 0.22rem 0.38rem;
	color: rgba(235, 240, 242, 0.86);
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 4px;
	font-family: var(--font-magazine-meta);
	font-size: 0.68rem;
	line-height: 1;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75);
	letter-spacing: 0;
}

.test-card-box .legend-mag .magazine-left-title-link,
.test-card-box .legend-mag .magazine-left-title,
.test-card-box .legend-mag .magazine-left-date {
	text-align: center;
}

#box_magazines .wrapperMag {
	justify-content: center;
	align-items: flex-start;
	column-gap: 0.65rem;
	row-gap: 0.45rem;
	float: none;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
	margin: 0.18rem auto 0;
	padding: 0;
}

.test-magazine-wrapper-title {
	flex: 0 0 100%;
	display: flex;
	justify-content: center;
	text-align: center;
	list-style: none;
	margin: 0 0 0.5rem;
	padding: 0;
}

.test-magazine-wrapper-title .magazine-left-title-link,
.test-magazine-wrapper-title .magazine-left-title,
.test-magazine-wrapper-title .magazine-left-date {
	text-align: center;
}

.test-magazine-page-entry {
	position: relative;
	display: flex;
	flex-direction: column;
	list-style: none;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
	margin: 0.05rem 0 0.75rem;
	padding: 0;
	max-width: 100%;
	background: rgba(0, 0, 0, 0.2);
	border-radius: 4px;
	overflow: hidden;
}

#box_magazines .test-magazine-page-entry .itemMag {
	position: relative;
	margin: 0;
	width: 100%;
	max-width: none;
	height: auto;
}

#box_magazines .test-magazine-page-entry .magazine-page-frame {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 4 / 5;
	padding: 0.55rem;
	background: rgba(255, 255, 255, 0.035);
	box-sizing: border-box;
	overflow: hidden;
}

#box_magazines .test-magazine-page-entry .magazine-page-image {
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
	max-height: 100%;
	margin: 0;
	padding: 0;
	object-fit: contain;
	filter: drop-shadow(0 5px 9px rgba(0, 0, 0, 0.55));
	transform: translateZ(0) scale(1);
	transform-origin: center;
	transition: transform 0.55s cubic-bezier(0.2, 0.8, 0.2, 1), filter 0.55s cubic-bezier(0.2, 0.8, 0.2, 1);
}

#box_magazines .test-magazine-page-entry:hover {
	transform: none;
	background: rgba(0, 0, 0, 0.2);
	box-shadow: none;
}

#box_magazines .test-magazine-page-entry:hover .magazine-page-image {
	filter: drop-shadow(0 5px 9px rgba(0, 0, 0, 0.55));
	transform: translateZ(0) scale(1.045);
}

#box_magazines .test-magazine-page-entry .itemMag:hover {
	transform: none;
	z-index: auto;
}

#box_magazines .test-magazine-page-content {
	display: block;
	margin: 0.16rem 0 0;
	width: auto;
	max-width: 100%;
	color: rgba(248, 252, 255, 0.94);
	font-family: var(--font-test-value);
	font-size: var(--type-size-test-magazine-content);
	font-weight: 400;
	line-height: 1;
	text-align: center;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.85);
	text-transform: none;
}

#box_magazines .test-magazine-page-title {
	min-height: 2.15rem;
	margin: 0;
	padding: 0.2rem 0.65rem 0.05rem;
	color: rgba(248, 252, 255, 0.94);
	font-family: var(--font-magazine-summary);
	font-size: 0.82rem;
	font-weight: 400;
	line-height: 1;
	text-align: center;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.85);
	box-sizing: border-box;
}

#box_magazines .test-magazine-page-title .magazine-page-title-main,
#box_magazines .test-magazine-page-title .magazine-page-title-detail {
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: var(--font-magazine-summary);
	font-size: 0.82rem;
	font-weight: 400;
	line-height: 1;
}

#box_magazines .test-magazine-page-title .magazine-page-title-detail {
	color: rgba(248, 252, 255, 0.78);
}

.test-magazine-page-meta {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	min-height: 34px;
	padding: 0.32rem 0.45rem;
	margin-top: auto;
	background: rgba(255, 255, 255, 0.04);
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	box-sizing: border-box;
	pointer-events: none;
}

#box_magazines .test-magazine-page-chip {
	padding: 0.32rem 0.45rem;
	font-size: var(--type-size-test-magazine-chip);
	background: rgba(255, 255, 255, 0.12) !important;
	border-color: rgba(255, 255, 255, 0.22) !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}

.test-card-box-label {
	font-family: var(--font-test-label);
	font-size: var(--type-size-test-box-label);
	line-height: 1;
	color: rgb(250,250,250);
	text-shadow: 1px 1px 1px #0000c9;
	text-transform: uppercase;
}

.test-card-box-value {
	min-width: 0;
	font-family: var(--font-test-value);
	font-size: var(--type-size-test-box-value);
	line-height: 1;
	color: rgba(248, 252, 255, 0.94);
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.85);
	overflow-wrap: normal;
	word-break: normal;
}

.test-card-box-value a {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	color: rgb(215 225 255 / 95%);
	text-decoration: none;
}

.test-card-box-value a:hover {
	color: rgba(235, 70, 70, 0.95);
	text-decoration: none;
}

.test-download-tree-group + .test-download-tree-group {
	margin-top: 0.52rem;
}

.test-download-tree-files {
	position: relative;
	display: grid;
	gap: 0.28rem;
	margin: 0.18rem 0 0.5rem 0.72rem;
	padding-left: 0.72rem;
	border-left: 2px solid rgba(244, 210, 93, 0.34);
}

.test-download-tree-file {
	position: relative;
	background: rgba(0, 0, 0, 0.10);
}

.test-download-tree-file::before {
	content: "";
	position: absolute;
	left: -0.74rem;
	top: 50%;
	width: 0.55rem;
	border-top: 1px solid rgba(244, 210, 93, 0.34);
}

.test-game-year-tree-title .test-card-box-value {
	font-weight: 700;
}

#box_download .test-download-tree-title .test-card-box-value {
	font-weight: 700;
}

#box_conception .test-conception-tree-title .test-card-box-value {
	font-family: var(--font-test-label);
	font-size: var(--type-size-test-box-label);
	font-weight: 800;
    color: rgba(248, 252, 255, 0.94);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.85);
	text-transform: uppercase;
}

#box_conception .test-conception-tree-title {
	/* background: rgba(151, 255, 236, 0.17); */
	/* border-color: rgba(151, 255, 236, 0.3); */
}

#box_conception .test-conception-job-group,
#box_interview .test-interview-job-group {
	margin-top: 0.34rem;
}

#box_conception .test-conception-job-title,
#box_interview .test-interview-job-title {
	/* background: rgba(151, 255, 236, 0.09); */
	/* border-color: rgba(151, 255, 236, 0.16); */
}

#box_conception .test-conception-job-title .test-card-box-value,
#box_interview .test-interview-job-title .test-card-box-value {
	font-family: var(--font-test-label);
	font-size: var(--type-size-test-box-label);
	font-weight: 800;
	color: rgb(250,250,250);
	text-shadow: 1px 1px 1px #0000c9;
	text-transform: uppercase;
}

#box_conception .test-conception-person-files,
#box_interview .test-interview-person-files {
	margin-bottom: 0.22rem;
}

#box_conception .test-conception-tree-file:has(a):hover,
#box_interview .test-interview-tree-file:has(a):hover,
#box_download .test-download-tree-file:has(a):hover,
#box_liste_jeux_developpeur .test-game-year-tree-file:has(a):hover,
#box_ludographie .test-game-year-tree-file:has(a):hover,
#box_societe_personnalites .test-societe-person-row:has(a):hover,
#box_societe_jeux .test-game-year-tree-file:has(a):hover,
#box_recommandations .test-game-year-tree-file:has(a):hover {
	background: rgba(210, 28, 38, 0.42);
	border-color: rgba(255, 78, 78, 0.72);
	box-shadow: inset 0 0 0 1px rgba(255, 120, 120, 0.22), 0 0 10px rgba(210, 28, 38, 0.28);
}

#box_liste_jeux_developpeur .test-game-year-tree-file:has(a):hover,
#box_recommandations .test-game-year-tree-file:has(a):hover {
	background: linear-gradient(90deg, rgba(47, 149, 199, 0.24), rgba(250, 250, 250, 0.16));
	border-color: rgba(151, 255, 236, 0.36);
	box-shadow: inset 0 0 0 1px rgba(151, 255, 236, 0.1);
}

#box_liste_jeux_developpeur .test-game-year-tree-file:has(a):hover .test-card-box-value,
#box_recommandations .test-game-year-tree-file:has(a):hover .test-card-box-value {
	color: rgba(245, 252, 255, 0.98);
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.82);
}

#box_conception .test-conception-tree-file:has(a),
#box_interview .test-interview-tree-file:has(a),
#box_download .test-download-tree-file:has(a),
#box_liste_jeux_developpeur .test-game-year-tree-file:has(a),
#box_ludographie .test-game-year-tree-file:has(a),
#box_societe_personnalites .test-societe-person-row:has(a),
#box_societe_jeux .test-game-year-tree-file:has(a),
#box_recommandations .test-game-year-tree-file:has(a) {
	cursor: pointer;
}

.test-tree-row-target {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	opacity: 0;
	pointer-events: none;
}

#box_conception .test-conception-tree-file .test-card-box-value a,
#box_interview .test-interview-tree-file .test-card-box-value a,
#box_download .test-download-tree-file .test-card-box-value a,
#box_liste_jeux_developpeur .test-game-year-tree-file .test-card-box-value a,
#box_ludographie .test-game-year-tree-file .test-card-box-value a,
#box_societe_jeux .test-game-year-tree-file .test-card-box-value a,
#box_recommandations .test-game-year-tree-file .test-card-box-value a {
	color: inherit;
	pointer-events: none;
}

#box_conception .test-conception-tree-file .test-card-box-value a:hover,
#box_interview .test-interview-tree-file .test-card-box-value a:hover,
#box_download .test-download-tree-file .test-card-box-value a:hover,
#box_liste_jeux_developpeur .test-game-year-tree-file .test-card-box-value a:hover,
#box_ludographie .test-game-year-tree-file .test-card-box-value a:hover,
#box_societe_jeux .test-game-year-tree-file .test-card-box-value a:hover,
#box_recommandations .test-game-year-tree-file .test-card-box-value a:hover {
	color: inherit;
}

#col_gauche .box_jeu_boite {
	box-sizing: border-box;
	max-width: 100%;
	overflow: visible; /* Permet au #percent de dÃ©passer complÃ¨tement */
	word-wrap: break-word;
	overflow-wrap: break-word;
}

#col_gauche .wrapper {
	box-sizing: border-box;
	max-width: 100%;
	word-wrap: break-word;
	overflow-wrap: break-word;
}

#col_gauche .box_jeu_playlist_desc {
	overflow: visible;
}

#col_gauche .wrapperMag {
	overflow: visible !important;
	overflow-y: visible !important; /* Permet au zoom de dÃ©passer sans scrollbar */
}

#col_gauche .lightgallery {
	overflow: visible !important;
}

.lg-outer.test-lightgallery .lg-image {
	image-rendering: auto;
	filter: drop-shadow(0 14px 28px rgba(0, 0, 0, 0.45));
}

.lg-outer.test-lightgallery.test-lg-origin-opening .lg-current .lg-image {
	opacity: 0 !important;
}

.lg-outer.test-lightgallery.test-lg-origin-settling .lg-current .lg-image {
	animation: testLightgalleryImageSettle 240ms ease both;
}

.test-lightgallery-origin-ghost {
	position: fixed;
	z-index: 1083;
	display: block;
	margin: 0;
	object-fit: contain;
	transform-origin: 0 0;
	image-rendering: auto;
	pointer-events: none;
	transition:
		transform 560ms cubic-bezier(0.22, 0.88, 0.22, 1),
		opacity 260ms ease;
	will-change: transform, opacity;
	filter: drop-shadow(0 14px 28px rgba(0, 0, 0, 0.45));
}

.test-lightgallery-origin-ghost--closing {
	opacity: 0 !important;
	transition: opacity 240ms ease !important;
}

@keyframes testLightgalleryImageSettle {
	from {
		opacity: 1;
	}
	to {
		opacity: 1;
	}
}

body:not(.lg-from-hash) .lg-outer.test-lightgallery.lg-start-zoom .lg-object {
	transition: transform 560ms cubic-bezier(0.22, 0.88, 0.22, 1), opacity 260ms ease !important;
}

/* S'assurer que box_jeu_desc dans col_gauche permet le dÃ©bordement */
#col_gauche .box_jeu_desc {
	overflow-x: hidden;
	overflow-y: visible !important; /* Permet au zoom de dÃ©passer sans scrollbar */
}

/* S'assurer que fieldset dans col_gauche permet le dÃ©bordement */
#col_gauche fieldset.box_jeu_desc {
	overflow-x: hidden;
	overflow-y: visible !important; /* Permet au zoom de dÃ©passer sans scrollbar */
}
