/* MyColoc Chambres : grille media + lightbox (front).
   Reutilise les variables du framework MyColoc avec valeurs de repli. */

.myc-media{
	display:grid;
	grid-template-columns:repeat(3, minmax(0,1fr));
	gap:var(--space-s, 16px);
}
@media (max-width:991px){ .myc-media{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:560px){ .myc-media{ grid-template-columns:1fr; } }

.myc-media__item{
	position:relative;
	display:block;
	width:100%;
	aspect-ratio:4 / 3;
	padding:0;
	margin:0;
	border:0;
	border-radius:var(--radius-l, 16px);
	overflow:hidden;
	cursor:pointer;
	background:var(--bg-soft, #efe7da) center / cover no-repeat;
}
.myc-media__item img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
	transition:transform .45s ease;
}
.myc-media__item:hover img{ transform:scale(1.04); }
.myc-media__item:focus-visible{ outline:2px solid var(--primary, #c5704e); outline-offset:3px; }

/* Tuile video */
.myc-media__item--video::after{
	content:"";
	position:absolute;
	inset:0;
	background:rgba(35,30,28,.28);
}
.myc-media__play{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:64px;
	height:64px;
	border-radius:50%;
	background:var(--primary, #c5704e);
	z-index:1;
}
.myc-media__play::before{
	content:"";
	position:absolute;
	top:50%;
	left:54%;
	transform:translate(-50%,-50%);
	border-style:solid;
	border-width:11px 0 11px 18px;
	border-color:transparent transparent transparent #fff;
}
.myc-media__cap{
	position:absolute;
	left:14px;
	bottom:12px;
	z-index:1;
	color:#fff;
	font-weight:600;
	font-size:var(--text-s, 14px);
	letter-spacing:.02em;
}

/* Lightbox */
.myc-lb{
	position:fixed;
	inset:0;
	z-index:99999;
	display:none;
	align-items:center;
	justify-content:center;
	background:rgba(20,16,14,.92);
	padding:max(16px, 4vw);
}
.myc-lb.is-open{ display:flex; }
.myc-lb__stage{
	position:relative;
	max-width:min(1100px, 92vw);
	max-height:88vh;
	width:100%;
	display:flex;
	align-items:center;
	justify-content:center;
}
.myc-lb__stage img,
.myc-lb__stage video{
	max-width:100%;
	max-height:88vh;
	border-radius:var(--radius-m, 12px);
	display:block;
}
.myc-lb__frame{
	position:relative;
	width:min(1100px, 92vw);
	aspect-ratio:16 / 9;
	max-height:88vh;
}
.myc-lb__frame iframe{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	border:0;
	border-radius:var(--radius-m, 12px);
}
.myc-lb__btn{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	width:52px;
	height:52px;
	border:0;
	border-radius:50%;
	background:rgba(255,255,255,.14);
	color:#fff;
	font-size:26px;
	line-height:1;
	cursor:pointer;
	transition:background .2s ease;
}
.myc-lb__btn:hover{ background:rgba(255,255,255,.28); }
.myc-lb__prev{ left:-8px; }
.myc-lb__next{ right:-8px; }
.myc-lb__close{
	position:absolute;
	top:-12px;
	right:-4px;
	transform:none;
	width:46px;
	height:46px;
	font-size:24px;
}
@media (max-width:560px){
	.myc-lb__prev{ left:0; }
	.myc-lb__next{ right:0; }
	.myc-lb__btn{ width:44px; height:44px; }
}
.myc-lb__btn[hidden]{ display:none; }

/* Etat vide (visible editeurs seulement) */
.myc-media__placeholder{
	background:var(--bg-soft, #efe7da);
	border:1px dashed var(--border-primary, #d9cbb8);
	cursor:default;
}
.myc-media__placeholder--video::after{
	content:"";
	position:absolute;
	inset:0;
	background:rgba(35,30,28,.12);
}
.myc-media__hint{
	margin-top:var(--space-s, 16px);
	color:var(--text-muted, #8a7d70);
	font-size:var(--text-s, 14px);
	font-style:italic;
}