/* pag inicio animación ppal */
.postit-container {
  width: 100%;
  height: 50%;
}
.postit {
  position: absolute;
  width: 15vw;
  min-width: 100px;
  height: auto;
  cursor: pointer;
  box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
}
.laptop {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  transform-origin: center center;
}

/* pág inicio animación terminal */
/* Contenedor lineas / links */
#contenedorTerminal{
  font-family: monospace;
  color: white;
  display:none;
}
#contenedorTerminal .new-terminal-btn{
  background-color: var(--ast-global-color-0);
}
#contenedorTerminal .terminal-controls button{
  background-color: transparent;
  color: var(--ast-global-color-1);
  padding: 3px;
}
#contenedorTerminal button:hover{
  color: var(--ast-global-color-7);
}
#contenedorTerminal .terminal-bar, #contenedorTerminal .terminal-body{
  padding: 10px;
}
#contenedorTerminal .terminal-bar{
  display:flex;
  justify-content: space-between;
  border-bottom: 2px solid var(--ast-global-color-1);
}
#terminal .line{
  display:flex;
  gap:10px;
  font-size: 22px;
  line-height:1.6;
}
#terminal .type-link{
  text-decoration: none !important;
}
/* Cursor parpadeante */
.cursor{
  display:inline-block;
  width:5px;
  height:1em;
  vertical-align:middle;
  background: white;
  margin-left:3px;
  animation:blink 1s infinite;
}
@keyframes blink{
  0%,50%,100%{opacity:1;}
  25%,75%{opacity:0;}
}

/* Maximización terminal: se puede ajustar desde Elementor si quieres */
#terminal{
  width:50%;      
  height:auto;    
}
#terminal.maximized{
  width:95%;      /* ancho completo o lo que quieras */
  height:100vh;    /* altura expandida */
  max-height:350px;
}

@media only screen and (max-width: 920px){
    /* controlar que en inicio la aparición del pc no haga un salto */
    #animacionInicio{
        height: 320px;
    }
    .postit-container {
        position: relative;
        width: 100%;
        overflow: hidden; /* evita scroll al aparecer laptop */
    }

    /* terminal barra superior */
    .terminal-title{
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }
    .terminal-controls{
        display:flex;
        align-items:center;
        flex-shrink:0;
        gap: 10px;
    }
    #terminal{
        width:80%;      
    }
}