/* Modern overrides for the original template (keeps the site simple + lightweight) */

:root{
  --bg:#0b1220;
  --panel:rgba(255,255,255,.06);
  --panel2:rgba(255,255,255,.08);
  --text:rgba(255,255,255,.92);
  --muted:rgba(255,255,255,.75);
  --line:rgba(255,255,255,.14);
  --accent:#7dd3fc;
  --shadow:0 18px 60px rgba(0,0,0,.45);
  --r:18px;
}

body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; background:var(--bg); color:var(--text)}
a{color:var(--accent)}

/* header */
.templatemo-site-title{font-weight:800; letter-spacing:.02em}
.affix{background:rgba(11,18,32,.72)!important; backdrop-filter:blur(10px); border-bottom:1px solid var(--line)}
.menu{background:rgba(11,18,32,.72)!important; backdrop-filter:blur(10px); border-right:1px solid var(--line)}
.menu a{color:var(--muted)!important}
.menu li.active a,.menu a:hover{color:var(--text)!important}

/* content panel */
.templatemo-content-wrapper{background:none!important}
.templatemo-content{background:rgba(255,255,255,.03)!important; border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow)}
.templatemo-content-section, #chalet-text, #availability-text, #local-text, #admin-text, #contact-text, #history-text{padding:24px 20px!important}

h2,h3{letter-spacing:.01em}
p{color:var(--muted); line-height:1.65}

/* gallery: turn the long stack of .image blocks into a responsive grid */
#chalet-text .chalet-gallery{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px}
@media (max-width: 991px){#chalet-text .chalet-gallery{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px}}

#chalet-text .image{margin:0!important; border:1px solid var(--line); border-radius:16px; overflow:hidden; background:rgba(255,255,255,.02)}
#chalet-text .image img{width:100%!important; height:auto; display:block}
#chalet-text .image p{margin:0; padding:10px 12px 12px; color:var(--muted); background:rgba(0,0,0,.12)}

/* availability image */
#availability-text img{border:1px solid var(--line); border-radius:16px}

/* contact map */
.image-center img{border:1px solid var(--line); border-radius:16px}

/* small typo fix helper */
.typo-fix{color:var(--muted)}

/* footer */
.footer{background:transparent!important; border-top:1px solid var(--line)}
.footer-text span{color:var(--muted2)}


/* Ensure headings are readable on light backgrounds */
h1, h2, h3, h4, h5, h6 {
  color: #1f2933; /* dark slate */
}

/* Headings inside dark sections */
.section-dark h1,
.section-dark h2,
.section-dark h3 {
  color: #ffffff;
}


/* --- Light theme override for readability --- */
:root{
  --bg:#f8fafc;
  --panel:#ffffff;
  --panel2:#ffffff;
  --text:#0f172a;
  --muted:#334155;
  --line:rgba(15,23,42,.12);
  --accent:#0369a1;
  --shadow:0 18px 60px rgba(2,6,23,.12);
}

body{background:var(--bg)!important; color:var(--text)!important}
a{color:var(--accent)!important}

/* header / menu on light background */
.affix{background:rgba(248,250,252,.85)!important}
.menu{background:rgba(248,250,252,.85)!important}
.menu a{color:var(--muted)!important}
.menu li.active a,.menu a:hover{color:var(--text)!important}

/* content panel */
.templatemo-content{background:var(--panel)!important; border-color:var(--line)!important}


/* Lightbox (full-page photo viewer) */
.lightbox-overlay{
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.92);
  z-index: 9999;
  padding: 24px;
}
.lightbox-overlay.is-open{ display: flex; }

.lightbox-overlay img{
  max-width: min(1100px, 96vw);
  max-height: 92vh;
  width: auto;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.55);
}

.lightbox-close{
  position: fixed;
  top: 16px;
  right: 16px;
  border: 0;
  border-radius: 999px;
  padding: 10px 14px;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  background: rgba(255,255,255,0.10);
  color: #fff;
  backdrop-filter: blur(6px);
}
.lightbox-close:hover{ background: rgba(255,255,255,0.18); }

/* Make chalet photos feel clickable */
#chalet-text .image img{ cursor: zoom-in; }


/* Chalet gallery: make caption boxes line up */
#chalet-text .chalet-gallery{
  align-items: stretch;
}

#chalet-text .chalet-gallery .image{
  display: flex;
  flex-direction: column;
  height: 100%;
  margin: 0;
}

#chalet-text .chalet-gallery .image img{
  width: 100%;
  height: auto;
  display: block;
}

/* Push caption to the bottom so captions align across a row */
#chalet-text .chalet-gallery .image p{
  margin-top: auto;
}


/* Chalet gallery: make each photo+caption card the same size */
#chalet-text .chalet-gallery{
  grid-auto-rows: 1fr;
}

#chalet-text .chalet-gallery .image{
  display: grid;
  grid-template-rows: 1fr auto;
  height: 100%;
}

#chalet-text .chalet-gallery .image .photo{
  width: 100%;
  aspect-ratio: 4 / 3; /* change to taste (e.g., 16/9) */
  overflow: hidden;
  border-radius: 14px;
}

#chalet-text .chalet-gallery .image .photo img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Fixed caption box height so rows align even with different text lengths */
#chalet-text .chalet-gallery .image p{
  min-height: 3.6em; /* ~2 lines */
  margin: 10px 0 0 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}


/* Availability image (booking page) */
.availability-image-wrap{
  display:flex;
  justify-content:center;
  padding: 8px 0 0 0;
}
.availability-image{
  width: min(1100px, 100%);
  height: auto;
  border-radius: 14px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.08);
  border: 1px solid rgba(0,0,0,0.06);
}
.availability-help{ max-width: 900px; margin-left:auto; margin-right:auto; }