.label,.title
{
font-weight:700}

  :root {
    --bg:#0f172a; --bg2:#1e293b; --card:#ffffff; --ink:#0f172a; --muted:#64748b;
    --primary:#0f6fff; --ring:#93c5fd; --ok:#16a34a; --warn:#f59e0b; --danger:#ef4444;
    --bd:#e5e7eb; --radius:14px;
  }

  html {
    min-height: 100%;
    background:
      radial-gradient(1800px 1200px at 20% 8%, rgba(59,130,246,.2), transparent 78%),
      radial-gradient(1400px 1000px at 82% 92%, rgba(236,72,153,.15), transparent 78%),
      linear-gradient(135deg, var(--bg), var(--bg2));
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
  }

  body {
    display:flex; flex-wrap:wrap; min-height:100vh;
	justify-content:center;
    margin:0; 	padding:15px;
	gap:15px;
    font-family:Arial,Verdana,Inter,sans-serif;
    background:transparent;
    color:var(--ink);
  }


.card
{
	padding:20px;
	border-radius:15px;
	box-shadow:0 0 20px rgba(0,0,0,.05);
	font-size:1.8rem;
	text-align:justify;
	line-height:1.5;
	background-color:rgba(0,0,0,.2);
	box-sizing:border-box;
	cursor: grab;}

/* Mise en colonnes réelles */
.container{
  width:100%;
  margin:0 auto 0 15px;
  display:flex;
  gap:20px;
  align-items:flex-start;
}
.col{
  flex:1 1 0;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:15px;
  min-height:80px;
  padding-bottom:8px;
}

/* Les cartes occupent la largeur de leur colonne */
.card{
  width:auto;
  margin:0;          /* géré par .col > gap */
}

.card:active{ cursor: grabbing; }


.fallback-logo:hover
{
	transform:scale(1.05);
	cursor:pointer;
transition:transform .2s}

.sortable-chosen
{
	border:2px solid #0077b6;
box-shadow:0 0 15px rgba(0,119,182,.5)}

.sortable-placeholder
{
	background-color:rgba(0,119,182,.1);
	border:2px dashed #0077b6;
	min-height:50px;
	margin-bottom:20px;
border-radius:10px}

.placeholder
{
	color:#aaa;
font-style:italic}

.container.centrer-une-carte
{
justify-content:center}

.title
{
font-size:2.5rem}

.FIN
{
background-color:#0077b6}

.RH
{
background-color:#c72626}

.ACTE
{
background-color:#c38ade}

.POPCITE
{
background-color:#ff9e4f}

.ENF
{
background-color:#49c468}

.EAUFAC
{
background-color:#75b2bf}

.SIG
{
background-color:#17b05c}

.CIM
{
background-color:#8c1f69}

.logo
{
	transition:transform .2s;
	width:180px;
	height:80px;
	object-fit:contain;
display:block}

.bandeau-general,.logo::after
{
	width:100%;
	font-weight:700;
color:#fff}

.add-line-btn,.card.hidden-card,.details,.logo img:empty,.logo img[onerror],.toggle
{
display:none}

.logo:hover
{
	transform:scale(1.1);
cursor:pointer}

.logo::after,.toggle:checked~.details,body.edit-mode
{
display:block}

.logo::after
{
	content:attr(data-text);
	height:100%;
	line-height:70px;
font-size:1.5rem}

.details
{
margin-top:5px}

#toggle-bandeau:hover
{
background-color:#004c99}

.bandeau-general
{
	overflow:hidden;
	background:#f33;
	font-size:1.6rem;
	padding:10px 0;
	position:fixed;
	bottom:0;
	visibility:hidden;
	transition:.3s;
z-index:1000}

.close-btn,.hidden-list button,.reset-btn
{
	background:0 0;
border:none}

.card-header,.footer .version
{
position:relative}

.texte-defilant
{
	display:inline-block;
	white-space:nowrap;
	padding-left:100%;
animation:linear infinite defilement}

@keyframes defilement
{
	from
	{
	transform:translateX(0)}

	to
	{
	transform:translateX(-100%)}
}

.sortable-ghost
{
	opacity:.5;
	transform:scale(1.05);
	opacity:.4;
border:2px dashed #999}

.close-btn
{
	position:absolute;
	top:5px;
	right:5px;
	font-size:20px;
	cursor:pointer;
	color:#333;
display:none}

.edit-mode .close-btn
{
	display:inline-block;
cursor:pointer}

.close-btn:hover
{
	transform:scale(1.2);
color:red}

.footer .version,.footer a:hover
{
	color:#007bff;
text-decoration:underline}

.reset-btn
{
	padding:0;
	cursor:pointer;
	color:inherit;
	width:auto;
height:auto}

.hidden-card
{
	opacity:0;
	height:0;
	margin:0;
	padding:0;
	pointer-events:none;
	overflow:hidden;
transition:opacity .3s}

.container,.hidden-list
{
pointer-events:auto}

.hidden-list button
{
	display:block;
	width:100%;
	text-align:left;
padding:5px 8px}

.hidden-list button:hover
{
background:#e6f3ff}

.highlight
{
	background-color:#ff0;
	animation:3s infinite blink;
	border-radius:10px;
	box-shadow:0 0 20px rgba(0,0,0,.05);
	padding:10px;
margin:-10px}

@keyframes blink
{
	0%,100%
	{
	background-color:#ff0}

	40%,60%
	{
	background-color:transparent}
}

.details .modifiable
{
	margin:2px 0;
line-height:1.2}

.details hr
{
margin:6px 0}

.zone-actions button
{
	padding:8px 12px;
	font-size:14px;
	background-color:#337ab7;
	color:#fff;
	border:none;
	border-radius:8px;
	cursor:pointer;
transition:background-color .2s}

.zone-actions button:hover
{
background-color:#235a94}

.actions-container
{
	position:fixed;
	bottom:10px;
	left:20px;
	display:none;
	align-items:center;
	gap:10px;
	z-index:1001;
transition:bottom .3s}

.actions-container.visible
{
display:flex}

.zone-actions
{
	display:flex;
	gap:10px;
align-items:center}

#toggle-zone-actions-btn
{
	background:0 0;
	border:none;
	color:#fff;
	font-size:1.5rem;
	cursor:pointer;
	padding:0;
transition:color .2s}

#toggle-zone-actions-btn:hover
{
color:#ccc}

#toggle-zone-actions-btn:focus
{
outline:0}

.actions-container.above-bandeau
{
bottom:60px}

#toggle-bandeau.above-bandeau
{
	bottom:40px;
transition:bottom .3s}

@keyframes gradientShift
{
	0%,100%
	{
	background-position:0 50%}

	50%
	{
	background-position:100% 50%}
}

.modifiable
{
	white-space:pre-wrap;
word-wrap:break-word}

.edit-toolbar
{
margin-bottom:4px}

.edit-toolbar button
{
	margin-right:5px;
	padding:2px 6px;
cursor:pointer}

.footer
{
	position:fixed;
	bottom:0;
	width:100%;
	text-align:center;
	color:#969696;
	font-size:14px;
	padding:8px 0;
	background:0 0;
z-index:900}

.footer a
{
	text-decoration:none;
	color:inherit;
cursor:pointer}

.footer .version
{
cursor:pointer}

.footer .tooltiptext
{
	opacity:0;
	display:none;
	position:absolute;
	bottom:125%;
	left:50%;
	transform:translateX(-50%);
	background-color:#324468;
	color:#fff;
	padding:6px 10px;
	border-radius:10px;
	font-size:12px;
	white-space:nowrap;
	z-index:1000;
	transition:opacity 1s,transform 1s;
box-shadow:0 4px 12px rgba(0,0,0,.2)}

.footer .version:hover .tooltiptext
{
	opacity:1;
visibility:visible}

#btn-favoris-container
{
	position:relative;
display:inline-block}

.hidden-list
{
	position:absolute;
	bottom:110%;
	left:0;
	display:none;
	background:#9fcbf5;
	border-radius:6px;
	padding:5px;
	max-height:250px;
	overflow-y:auto;
z-index:9999}

.hidden-list button
{
	cursor:pointer;
margin-bottom:4px
}

/* --- Boîte à idées --- */
#btn-ideas {
  background: none;
  border: none;
  font-size: 1em;
  cursor: pointer;
  color: #007bff;
  margin-left: 0px;
  transition: transform 0.2s, color 0.2s;
  vertical-align: middle;
}

#btn-ideas:hover {
  color: #00b7ff;
  transform: rotate(360deg) scale(1.5);
}

/* Arrière-plan du modal */
#ideas-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(15, 23, 36, 0.8);
  backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  animation: fadeIn 0.3s ease forwards;
}

#ideas-modal .modal-content {
  background: linear-gradient(160deg, #1f2c3e 0%, #2e4756 100%);
  color: #f0f0f0;
  padding: 25px;
  border-radius: 12px;
  width: 600x;
  max-width: 90%;
  box-shadow: 0 0 20px rgba(0, 123, 255, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.1);
  animation: popIn 0.25s ease;
}

#ideas-modal h3 {
  text-align: center;
  margin: 0 0 8px 0;
  font-size: 1.4rem;
  color: #00bfff;
}

.modal-subtitle {
  text-align: center;
  font-size: 0.9rem;
  color: #bbb;
  margin-bottom: 12px;
}

#ideas-textarea {
  width: 95%;
  height: 180px;
  resize: vertical;
  padding: 10px;
  border-radius: 8px;
  border: 1px solid #555;
  background: #1a1a1a;
  color: #e0e0e0;
  font-family: inherit;
  font-size: 0.95rem;
  outline: none;
  transition: border-color 0.3s;
}

#ideas-textarea:focus {
  border-color: #00bfff;
  box-shadow: 0 0 5px rgba(0, 191, 255, 0.4);
}

.modal-actions {
  text-align: right;
  margin-top: 15px;
}

.modal-actions button {
  padding: 8px 14px;
  border: none;
  border-radius: 8px;
  font-size: 14px;
  cursor: pointer;
  transition: background-color 0.2s, transform 0.1s;
}

#save-ideas {
  background-color: #007bff;
  color: #fff;
}

#save-ideas:hover {
  background-color: #00b7ff;
  transform: scale(1.05);
}

#close-ideas {
  background-color: #333;
  color: #ddd;
}

#close-ideas:hover {
  background-color: #555;
  transform: scale(1.05);
}

/* Animations */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes popIn {
  from { transform: scale(0.9); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

.alert {
	display:none;
	position:fixed;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	border-radius:15px;
	z-index:10000;
	text-align:center;
	max-width:90%;
	animation:fadeInOut 2s forwards;
	}

@keyframes fadeInOut {
			0% { opacity:0; transform:translate(-50%, -60%); }
			10%, 90% { opacity:1; transform:translate(-50%, -50%); }
			100% { opacity:0; transform:translate(-50%, -40%); }
		}


html, body {
  height: 100%;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  overflow-y: hidden; /* évite le scroll parasite */
}

html {
  background-attachment: scroll; /* corrige le bug GPU Chrome */
}

body {
  padding: 15px 15px 60px 15px; /* garde ton espace mais évite que ça pousse le bas */
  box-sizing: border-box;
}

.card { user-select: none; }
.card .modifiable { user-select: text; }

/* Scroll vertical uniquement en mode édition */
html.edit-mode,
body.edit-mode{
  overflow-y: auto;
  overscroll-behavior-y: contain;   /* évite les effets de rebond */
  -webkit-overflow-scrolling: touch;
}
:root{
  --tile-font: 1.8rem;   /* base adaptative */
  --grid-gap: 20px;      /* gap .container */
  --col-gap: 15px;       /* gap .col */
  --card-pad: 20px;      /* padding .card */
}

/* branche les variables */
.container{ gap: var(--grid-gap); }
.col{ gap: var(--col-gap); }
.card{ padding: var(--card-pad); font-size: var(--tile-font); }
.details .modifiable{ font-size: inherit; } /* évite l’inline style qui bloque l’auto-fit */


/* Masque doux pendant init (n’influe pas le layout) */
html[data-app-ready="0"] #container { opacity: 0; }
html[data-app-ready="1"] #container { opacity: 1; transition: opacity .18s ease; }

/* Splash plein écran optionnel */
#app-splash{
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  font: 500 14px/1.2 system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  background: rgba(250,250,250,.85); backdrop-filter: blur(4px);
  transition: opacity .18s ease; opacity: 1;
}
#app-splash.hidden{ opacity: 0; pointer-events: none; }

/* Coupe les transitions/animations tant que l’app n’est pas prête */
html.init-no-anim *{ transition: none !important; animation: none !important; }

/* Accessibilité : pas de fade si reduced motion */
@media (prefers-reduced-motion: reduce){
  html[data-app-ready="1"] #container { transition: none; }
  #app-splash { transition: none; }
}

/* Splash plein écran */
#app-splash{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  background:
    radial-gradient(60% 80% at 70% 20%, rgba(99,102,241,.08), transparent 60%),
    radial-gradient(70% 70% at 20% 80%, rgba(14,165,233,.08), transparent 60%),
    var(--bg, #f7f7fb);
  transition: opacity .22s ease, transform .22s ease;
  opacity: 1;
  transform: translateZ(0);
}
#app-splash.hidden{ opacity: 0; transform: scale(.985); pointer-events: none; }

/* Carte centrale */
#app-splash .splash-card{
  width: min(540px, 92vw);
  background: var(--card, #ffffff);
  color: var(--ink, #222);
  border: 1px solid var(--bd, #e9e6f0);
  border-radius: 16px;
  box-shadow: 0 20px 50px rgba(20,20,40,.12);
  padding: 28px 26px;
}

/* En-tête */
.splash-head{
  display: flex; align-items: center; gap: 14px; margin-bottom: 14px;
}
.splash-logo{
  width: 44px; height: 44px; border-radius: 12px;
  background: conic-gradient(from 180deg,
    #0f6fff, #60a5fa 45%, #f472b6 90%, #0f6fff 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.5);
}
.splash-title{ font-weight: 700; font-size: 1.05rem; letter-spacing: .2px; }
.splash-sub{ color: var(--muted, #666); font-size: .95rem; }

/* Barre indéterminée (accessible) */
.splash-meter{
  position: relative; height: 8px; border-radius: 999px; overflow: hidden;
  background: linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.04));
  margin-top: 14px;
}
.splash-meter span{
  position: absolute; inset: 0; width: 38%;
  background: linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.9) 50%,
    rgba(255,255,255,0) 100%),
    linear-gradient(180deg, var(--ring, #a5b4fc), var(--primary, #60a5fa));
  border-radius: 999px;
  animation: splashSlide 1.1s infinite cubic-bezier(.4,0,.2,1);
  box-shadow: 0 0 20px rgba(96,165,250,.35);
}
@keyframes splashSlide{
  from{ transform: translateX(-110%); }
  to  { transform: translateX(270%);  }
}

/* Désactive les animations de l’app pendant l’init, pas celles du splash */
.init-no-anim #container, .init-no-anim .card, .init-no-anim [data-animated]{
  animation: none !important; transition: none !important;
}

/* Respect des préférences d’animation */
@media (prefers-reduced-motion: reduce){
  .splash-meter span{ animation: none; width: 55%; left: 22%; }
}

/* Masquer le contenu pendant le fit initial */
html[data-fitting="1"] #container,
html[data-fitting="1"] .footer,
html[data-fitting="1"] .actions-container,
html[data-fitting="1"] #bandeau{
  opacity:0;                /* on mesure quand même */
  pointer-events:none;
  visibility:hidden;        /* et on n’affiche rien */
}

/* Couvre tout l’écran avant la révélation */
html[data-fitting]::before{
  content:"";
  position:fixed; inset:0;
  background:var(--bg, #fff); /* adapte à ton fond */
  z-index:2147483647;
}

/* Pas d’animations/transitions pendant le fit */
html[data-fitting] *{
  transition:none !important;
  animation:none !important;
}

@font-face{
  font-family:"Inter";
  src:url("/fonts/Inter.woff2") format("woff2");
  font-weight:100 900;
  font-style:normal;
  font-display:block;
}


/* Petite révélation propre une fois prêt */
#container{ opacity:1; }
html:not([data-fitting="1"]) #container{ transition:opacity .16s ease; }



/* === 🎄 THEME NOËL === */
body.christmas-theme {
  /* ambiance froide */
  background:
    radial-gradient(1600px 1000px at 20% 15%, rgba(125,211,252,.18), transparent 70%),
    radial-gradient(1400px 900px at 85% 85%, rgba(147,197,253,.12), transparent 75%),
    linear-gradient(180deg, #0b1222 0%, #111827 60%, #0b1222 100%);
  transition: background-color .4s ease;
}

/* petit rab pour la neige en haut des cartes */
body.christmas-theme .card {
  padding-top: calc(20px + 10px);
  position: relative;
  overflow: visible; /* pour laisser dépasser les guirlandes */
}

/* canvas neige par-dessus tout, mais sans bloquer les clics */
#snow-canvas {
  position: fixed;
  inset: 0;
  z-index: 10000;
  pointer-events: none;
  display: none; /* montré quand le thème est actif */
}

/* badges un peu givrés */
body.christmas-theme .title,
body.christmas-theme .label {
  text-shadow: 0 1px 0 rgba(255,255,255,.35);
}

/* Guirlande lumineuse tout autour des cartes (sans voile vert) */
body.christmas-theme .card::after {
  content: "";
  position: absolute;
  inset: -8px;
  border-radius: 18px;
  pointer-events: none;
  z-index: 2;

  /* Câbles + ampoules sur les 4 côtés */
  background:
    /* câbles */
    linear-gradient(to right, rgba(15,23,42,0.95), rgba(15,23,42,0.95))   top    / 100% 2px no-repeat,
    linear-gradient(to right, rgba(15,23,42,0.95), rgba(15,23,42,0.95))   bottom / 100% 2px no-repeat,
    linear-gradient(to bottom,rgba(15,23,42,0.95), rgba(15,23,42,0.95))   left   / 2px 100% no-repeat,
    linear-gradient(to bottom,rgba(15,23,42,0.95), rgba(15,23,42,0.95))   right  / 2px 100% no-repeat,

    /* ampoules haut / bas */
    radial-gradient(circle, #f97373 0 4px, transparent 4px)  0    0    / 32px 18px repeat-x,
    radial-gradient(circle, #facc15 0 4px, transparent 4px) 16px  0    / 32px 18px repeat-x,
    radial-gradient(circle, #22c55e 0 4px, transparent 4px)  8px 100%  / 32px 18px repeat-x,
    radial-gradient(circle, #38bdf8 0 4px, transparent 4px) 24px 100%  / 32px 18px repeat-x,

    /* ampoules côtés */
    radial-gradient(circle, #f97373 0 4px, transparent 4px)  0    8px  / 18px 32px repeat-y,
    radial-gradient(circle, #facc15 0 4px, transparent 4px)  0   24px  / 18px 32px repeat-y,
    radial-gradient(circle, #22c55e 0 4px, transparent 4px)100% 16px  / 18px 32px repeat-y,
    radial-gradient(circle, #38bdf8 0 4px, transparent 4px)100% 32px  / 18px 32px repeat-y;

  filter: drop-shadow(0 0 6px rgba(255,255,255,0.9));
  animation: xmasLightsCycle 3.2s linear infinite;
  animation-delay: var(--xmas-lights-delay, 0s); /* <- décalage propre à chaque carte */
}



/* Clignotement / cycle de couleurs des guirlandes */
@keyframes xmasLightsCycle {
  0% {
    opacity: 0.9;
    filter: drop-shadow(0 0 4px rgba(255,255,255,0.7)) hue-rotate(0deg);
  }
  25% {
    opacity: 1;
    filter: drop-shadow(0 0 8px rgba(250,204,21,1)) hue-rotate(90deg);
  }
  50% {
    opacity: 0.95;
    filter: drop-shadow(0 0 7px rgba(56,189,248,1)) hue-rotate(180deg);
  }
  75% {
    opacity: 1;
    filter: drop-shadow(0 0 8px rgba(244,114,182,1)) hue-rotate(270deg);
  }
  100% {
    opacity: 0.9;
    filter: drop-shadow(0 0 5px rgba(34,197,94,1)) hue-rotate(360deg);
  }
}

#santa-gif {
  position: fixed;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  max-width: 660px; /* 3x plus grand */
  height: auto;
  z-index: 2147483001;
  pointer-events: none;
  display: none;
}


/* sécurité : si jamais le body n'est pas en mode Noël, on ne l'affiche jamais */
body:not(.christmas-theme) #santa-gif {
  display: none !important;
}

/* === Train de Noël en bas de l'écran === */
#xmas-train {
  position: fixed;
  bottom: 8px;                 /* posé sur le "sol", ajustable */
  left: -400px;                /* démarre hors écran à gauche */
  width: 320px;                /* taille de base */
  max-width: 40vw;             /* limite sur grands écrans */
  height: auto;
  pointer-events: none;
  z-index: 2147482998;         /* au-dessus du contenu, sous/au même niveau que la neige */
  display: none;
}

/* quand le train est en cours de passage */
body.christmas-theme #xmas-train.run {
  display: block;
  animation: xmasTrainRun 16s linear forwards;
}

@keyframes xmasTrainRun {
  0% {
    transform: translateX(0);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    transform: translateX(calc(100vw + 500px)); /* il sort bien à droite */
    opacity: 0;
  }
}

/* sécurité : si Noël est coupé, on ne l’affiche jamais */
body:not(.christmas-theme) #xmas-train {
  display: none !important;
}

/* === Sprite Noël (gif droite → gauche) === */
#xmas-sleigh {
  position: fixed;
  bottom: 400px;                  
  right: -400px;                 /* démarre hors écran à droite */
  width: 400px;                  /* un peu plus petit, tu peux ajuster */
  max-width: 35vw;
  height: auto;
  pointer-events: none;
  z-index: 2147482998;
  display: none;
}

/* quand le gif est en cours de passage */
body.christmas-theme #xmas-sleigh.run {
  display: block;
  animation: xmasSleighRun 10s linear forwards; /* plus rapide que le train */
}

@keyframes xmasSleighRun {
  0% {
    transform: translateX(0);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    transform: translateX(calc(-100vw - 500px)); /* traverse tout l'écran vers la gauche */
    opacity: 0;
  }
}

/* sécurité : si Noël OFF → sprite jamais visible */
body:not(.christmas-theme) #xmas-sleigh {
  display: none !important;
}

/* Dameuse / chasse-neige en bas de l'écran */
#xmas-plow {
  position: fixed;
  bottom: 8px;                 /* même “sol” que le train */
  left: -420px;                /* démarre hors écran à gauche */
  width: 260px;
  max-width: 35vw;
  height: auto;
  pointer-events: none;
  z-index: 2147482999;         /* au dessus des cartes, sous le gif Père Noël/neige si tu veux */
  display: none;
}

/* Animation de passage gauche → droite */
body.christmas-theme #xmas-plow.run {
  display: block;
  animation: xmasPlowRun 7s linear forwards; /* un peu plus rapide que le train */
}

@keyframes xmasPlowRun {
  0% {
    transform: translateX(0);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    transform: translateX(calc(100vw + 500px)); /* sort de l'écran à droite */
    opacity: 0;
  }
}

/* sécurité : pas de dameuse si Noël est désactivé */
body:not(.christmas-theme) #xmas-plow {
  display: none !important;
}

#rh-gif {
  position: fixed;
  bottom: 18px;
  right: 6%;                 /* décalé à droite du Père Noël */
  max-width: 320px;
  height: auto;
  z-index: 2147483001;
  pointer-events: none;
  display: none;
}

/* pas de danse RH si Noël OFF */
body:not(.christmas-theme) #rh-gif {
  display: none !important;
}