/* =========================
   GLOBAL STYLES
========================= */

*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{

background:#050505;
color:#e6dcc7;

font-family:
'Share Tech Mono',
monospace;

overflow-x:hidden;

/* GRID BACKGROUND */

background-image:

linear-gradient(
rgba(255,255,255,0.03) 1px,
transparent 1px
),

linear-gradient(
90deg,
rgba(255,255,255,0.03) 1px,
transparent 1px
);

background-size:40px 40px;
}

/* =========================
   TOP ALERT BAR
========================= */

.alert-bar{

width:100%;

padding:12px;

text-align:center;

border-top:
1px solid rgba(255,0,0,0.5);

border-bottom:
1px solid rgba(255,0,0,0.5);

background:
rgba(255,0,0,0.08);

letter-spacing:4px;

font-size:0.8rem;

color:#ff4747;
}

/* =========================
   MAIN DASHBOARD
========================= */

.dashboard{

display:grid;

grid-template-columns:
260px 1fr 380px;

gap:20px;

padding:25px;

align-items:start;
}

/* =========================
   PANELS
========================= */

.panel{

border:
1px solid rgba(255,0,0,0.25);

background:
rgba(0,0,0,0.5);

padding:20px;
}

/* =========================
   SIDEBAR
========================= */

.sidebar{

display:flex;
flex-direction:column;
gap:20px;
}

/* LOGO */

.logo{

text-align:center;
}

.logo h1{

font-size:4rem;

letter-spacing:4px;

margin-bottom:10px;
}

.logo p{

font-size:0.8rem;

opacity:0.6;
}

/* LOGO IMAGE */

.logo img{

width:180px;

margin-top:25px;

filter:
drop-shadow(0 0 20px rgba(255,0,0,0.2));
}

/* =========================
   STATUS BOX
========================= */

.status-box{

border:
1px solid rgba(0,255,0,0.25);

padding:20px;

line-height:2.2;

color:#77ff77;
}

/* =========================
   BUTTONS
========================= */

.control-btn{

padding:18px;

background:black;

border:
1px solid rgba(255,255,255,0.12);

color:#e6dcc7;

font-family:
inherit;

letter-spacing:2px;

cursor:pointer;

transition:0.3s;
}

.control-btn:hover{

border-color:#ff4747;

color:#ff4747;
}

/* =========================
   SECRET TERMINAL
========================= */

.secret-terminal{

margin-top:25px;

border:
1px solid rgba(0,255,0,0.15);

background:
rgba(0,0,0,0.6);

padding:18px;
}

/* HEADER */

.secret-header{

font-size:0.7rem;

letter-spacing:3px;

margin-bottom:15px;

color:#ff4747;
}

/* INPUT */

#command-input{

width:100%;

padding:14px;

background:black;

border:
1px solid rgba(255,255,255,0.08);

color:#77ff77;

font-family:
inherit;

outline:none;

margin-bottom:15px;
}

/* RESPONSE */

#terminal-response{

font-size:0.8rem;

line-height:1.6;

opacity:0.7;

color:#77ff77;

min-height:40px;
}