/* styles.css */
:root{
--bg: #000c18;
--text: #2277ff;
--black: #000;
}


*{box-sizing:border-box}
html,body{width: 100%;
  margin: 0;
  padding: 0;
  height: auto; /* allow body to grow when children are taller than viewport */
  overflow-x: hidden;
  overflow-y: auto;}
  #cesiumContainer{
  position:fixed;
    width: 100vw;
  height: 650px;
  margin: 0;
  padding: 0;
  /* overflow: hidden; */
  }
#cesiumContainer:fullscreen,
 :-webkit-full-screen #cesiumContainer {
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    }
/* #cesiumContainer:fullscreen ~ *,
:-webkit-full-screen #cesiumContainer ~ * {
  display: none;
} */
:fullscreen body > *:not(#cesiumContainer),
:-webkit-full-screen body > *:not(#cesiumContainer) {
  display: none !important;
}
#cameraWidget {
  position: absolute;
  top: 10px;
  left: 10px;
  background: rgba(10, 2, 122, 0.8);
  color: #fc56e0;
  font-family: monospace;
  font-size: 1.4em;
  padding: 6px 10px;
  border-radius: 6px;
  pointer-events: none; /* ne bloque pas les clics sur la carte */
  z-index: 100000;
}
#fullerCodeWidget {
  position: absolute;
  top: 60px;
  left: 10px;
  background: rgba(10, 2, 122, 0.8);
  color: #56fc8d;
  font-family: monospace;
  font-size: 1.4em;
  padding: 6px 10px;
  border-radius: 6px;
  z-index: 100000;
}

#fullerCodeInput {
  position: absolute;
  top: 110px;
  left: 10px;
  background: rgba(10, 2, 122, 0.8);
  color: #f0ff6a;
  font-family: monospace;
  font-size: 1.4em;
  padding: 6px 10px;
  border-radius: 6px;
  border: 1px solid #f0ff6a;
  z-index: 100000;
  width: 200px;
}
/* Copy button next to the fullerCodeWidget */
.fullerCodeCopy {
  position: absolute; /* positioned by JS (left/top) */
  z-index: 100000;
  padding: 6px 10px;
  border-radius: 6px;
  border: 1px solid rgba(86,252,141,0.9);
  background: rgba(10,2,122,0.8);
  color: #56fc8d;
  font-family: monospace;
  font-size: 1.4em;
  cursor: pointer;
}

.fullerCodeCopy:active,
.fullerCodeCopy:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(86,252,141,0.12);
}
body{
margin:0;
font-family: Consolas, 'Courier New', Courier, monospace;
background:var(--bg);
color:var(--text);
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
}
.container{
max-width:1100px;
margin:0 auto;
padding:1rem;
}
.compact {
  line-height: 1em;
}

.site-header{
background:#223355;
border-bottom:1px solid rgba(0,0,0,0.06);
position:fixed;
top:0;
left:0;
right:0;
z-index:1000;
}
.site-header .container{
display:flex;
align-items:center;
justify-content:space-between;
gap:1rem;
}
.logo{
margin:0;
font-size:1.25rem;
}


.main-nav ul{
list-style:none;
margin:0;
padding:0;
display:flex;
gap:0.75rem;
}


.main-nav a{
display:inline-block;
padding:0.5rem 0.9rem;
background:var(--black);
color:#f280d0;
text-decoration:none;
border-radius:6px;
font-weight:700;
letter-spacing:0.02em;
}


.hero{
padding:6rem 0 2rem 0; /* add top padding to avoid overlap with fixed header */
}
.hero h2{
margin-top:0;
}


.content-cards{
display:flex;
gap:1rem;
flex-wrap:wrap;
}
.card{
background:#b0b0b0;
padding:1rem;
border-radius:8px;
box-shadow:0 2px 6px rgba(0,0,0,0.04);
flex:1 1 220px;
}


.site-footer{
padding:1rem 0;
text-align:center;
color:rgba(0,0,0,0.6);
}


@media (max-width:700px){
.main-nav ul{
flex-wrap:wrap;
justify-content:center;
}
}

/* On small screens make the Cesium container part of the document flow so the page can scroll
   and users can reach controls (fullscreen, etc.). Desktop keeps fixed for layout.
*/
@media (max-width:700px) {
  #cesiumContainer {
    position: relative;
    width: 100%;
    /* use the full viewport height minus the fixed header so the Cesium view fills the screen */
    height: calc(100vh - 64px);
    margin-top: 64px; /* push below the fixed header */
    overflow: hidden;
  }
}

/* Copy button next to the fullerCodeWidget */
.fullercode-copy {
  position: absolute; /* positioned by JS (left/top) */
  z-index: 100000;
  padding: 6px 10px;
  border-radius: 6px;
  border: 1px solid rgba(86,252,141,0.9);
  background: rgba(10,2,122,0.8);
  color: #56fc8d;
  font-family: monospace;
  font-size: 1.0em;
  cursor: pointer;
}

.fullercode-copy:active,
.fullercode-copy:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(86,252,141,0.12);
}