:root{
  --bg:#0a0f1a;
  --panel:#111a2b;
  --panel-2:#0d1522;
  --line:#1e2c42;
  --amber:#ffb100;
  --amber-dim:#8a6206;
  --cyan:#37e0ff;
  --text:#e8ecf3;
  --muted:#8a93a6;
  --green:#3ddc84;
  --red:#ff5d5d;
  --radius:10px;
  --mono: 'IBM Plex Mono', monospace;
  --sans: 'Inter', sans-serif;
}

*{box-sizing:border-box;}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;}
}

body{
  margin:0;
  background:
    radial-gradient(circle at 20% 0%, #101d33 0%, transparent 45%),
    radial-gradient(circle at 90% 10%, #0f1b2c 0%, transparent 40%),
    var(--bg);
  color:var(--text);
  font-family:var(--sans);
  min-height:100vh;
  padding:24px 16px 64px;
}

.board-wrap{
  max-width:920px;
  margin:0 auto;
}

/* HEADER */
.board-header{
  border:1px solid var(--line);
  background:linear-gradient(180deg, var(--panel), var(--panel-2));
  border-radius:var(--radius);
  padding:24px 24px 20px;
  margin-bottom:20px;
  position:relative;
  overflow:hidden;
}
.board-header::after{
  content:"";
  position:absolute; inset:0;
  background-image:repeating-linear-gradient(180deg, rgba(255,255,255,0.02) 0px, rgba(255,255,255,0.02) 1px, transparent 1px, transparent 3px);
  pointer-events:none;
}
.header-top{
  display:flex; justify-content:space-between; align-items:center;
  font-family:var(--mono); font-size:12px; color:var(--amber);
  letter-spacing:1px; margin-bottom:14px;
}
.clock{color:var(--cyan);}
.board-header h1{
  font-size:28px; margin:0 0 8px; line-height:1.2;
  font-weight:800;
}
.accent{color:var(--amber);}
.subtitle{color:var(--muted); margin:0; font-size:14.5px; max-width:60ch; line-height:1.5;}

/* FORM */
.search-panel{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px 16px;
  border:1px solid var(--line);
  background:var(--panel);
  border-radius:var(--radius);
  padding:22px;
  margin-bottom:20px;
}
.field{display:flex; flex-direction:column; gap:6px; position:relative;}
.field.span-2{grid-column:1 / -1;}
label{font-size:12.5px; color:var(--muted); font-weight:600; letter-spacing:.3px;}
input[type=text], input[type=date], input[type=number], select{
  background:var(--panel-2);
  border:1px solid var(--line);
  color:var(--text);
  padding:11px 12px;
  border-radius:8px;
  font-family:var(--sans);
  font-size:14.5px;
  outline:none;
  transition:border-color .15s ease;
}
input:focus, select:focus{border-color:var(--amber);}
.checkbox-label{
  display:flex; align-items:center; gap:8px;
  font-size:13.5px; color:var(--text); font-weight:400;
  margin-bottom:4px; cursor:pointer;
}
.checkbox-label input{width:16px; height:16px; accent-color:var(--amber);}

.autocomplete{
  position:absolute; top:100%; left:0; right:0; z-index:5;
  background:var(--panel-2); border:1px solid var(--line); border-radius:8px;
  margin-top:4px; max-height:180px; overflow-y:auto; display:none;
}
.autocomplete div{padding:9px 12px; font-size:13.5px; cursor:pointer;}
.autocomplete div:hover{background:var(--line);}

.btn-search{
  grid-column:1 / -1;
  background:linear-gradient(180deg, var(--amber), #e08e00);
  border:none; color:#1a1200;
  padding:15px; border-radius:8px;
  cursor:pointer; font-family:var(--sans);
  display:flex; flex-direction:column; align-items:center; gap:2px;
  transition:transform .1s ease, box-shadow .15s ease;
  box-shadow:0 4px 14px rgba(255,177,0,0.15);
}
.btn-search:hover{transform:translateY(-1px); box-shadow:0 6px 18px rgba(255,177,0,0.25);}
.btn-search:active{transform:translateY(0);}
.btn-label{font-weight:800; font-size:15.5px;}
.btn-sub{font-size:11.5px; font-weight:500; opacity:.75;}

/* STATUS */
.status-panel{
  border:1px solid var(--line); background:var(--panel);
  border-radius:var(--radius); padding:18px 20px; margin-bottom:20px;
  position:relative; overflow:hidden; font-family:var(--mono); font-size:13px; color:var(--cyan);
}
.scan-line{
  position:absolute; top:0; left:-40%; width:40%; height:2px;
  background:linear-gradient(90deg, transparent, var(--cyan), transparent);
  animation:scan 1.4s linear infinite;
}
@keyframes scan{ to{ left:110%; } }

/* SUMMARY */
.summary-panel{
  display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:20px;
}
.summary-card{
  background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:16px; text-align:center;
}
.summary-card .value{font-family:var(--mono); font-size:22px; font-weight:700; color:var(--amber);}
.summary-card .label{font-size:12px; color:var(--muted); margin-top:4px;}

/* ALERTS */
.alerts-panel{display:flex; flex-direction:column; gap:8px; margin-bottom:20px;}
.alert{
  border-radius:8px; padding:11px 14px; font-size:13.5px;
  display:flex; align-items:center; gap:10px;
  border:1px solid;
}
.alert.warn{background:rgba(255,93,93,0.08); border-color:rgba(255,93,93,0.35); color:#ffb3b3;}
.alert.good{background:rgba(61,220,132,0.08); border-color:rgba(61,220,132,0.35); color:#a9f2c9;}
.alert.info{background:rgba(55,224,255,0.08); border-color:rgba(55,224,255,0.3); color:#b8f2ff;}

/* RESULTS */
.results-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:12px;}
.results-head h2{font-size:16px; margin:0;}
#resultsCount{color:var(--muted); font-weight:400; font-size:13px;}
.sort-controls{display:flex; align-items:center; gap:8px;}
.sort-controls label{font-size:12px;}
.sort-controls select{padding:7px 10px; font-size:13px;}

.results-list{display:flex; flex-direction:column; gap:12px;}

.flight-card{
  border:1px solid var(--line); background:var(--panel);
  border-radius:var(--radius); padding:16px 18px;
  display:grid; grid-template-columns:1fr auto; gap:10px 16px;
  position:relative;
}
.flight-card.best{border-color:var(--amber); box-shadow:0 0 0 1px rgba(255,177,0,0.25), 0 4px 20px rgba(255,177,0,0.08);}
.flight-card.flash::before{
  content:"⚡ PROMOÇÃO RELÂMPAGO";
  position:absolute; top:-10px; left:16px;
  background:var(--red); color:#1a0a0a; font-size:10.5px; font-weight:700;
  padding:3px 8px; border-radius:5px; letter-spacing:.4px;
}

.fc-top{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
.fc-airline{font-weight:700; font-size:14.5px;}
.fc-source{font-family:var(--mono); font-size:10.5px; color:var(--muted); border:1px solid var(--line); padding:2px 6px; border-radius:5px;}
.fc-stars{color:var(--amber); font-size:13px; letter-spacing:1px;}

.fc-route{
  display:flex; align-items:center; gap:14px; margin-top:6px; flex-wrap:wrap;
}
.fc-leg{display:flex; flex-direction:column;}
.fc-time{font-family:var(--mono); font-size:19px; font-weight:600;}
.fc-airport{font-size:11.5px; color:var(--muted);}
.fc-arrow{color:var(--muted); font-size:13px; display:flex; flex-direction:column; align-items:center;}
.fc-duration{font-size:11px; color:var(--muted);}
.fc-stops{font-size:11px; color:var(--cyan); margin-top:2px;}

.fc-meta{display:flex; gap:14px; margin-top:10px; flex-wrap:wrap; font-size:12.5px; color:var(--muted);}
.fc-meta span strong{color:var(--text);}

.fc-price-col{
  display:flex; flex-direction:column; align-items:flex-end; justify-content:space-between; text-align:right; min-width:150px;
}
.fc-price{font-family:var(--mono); font-size:24px; font-weight:700; color:var(--text);}
.fc-price-per{font-size:11px; color:var(--muted);}
.fc-savings{font-size:11.5px; color:var(--green); margin-top:4px;}
.fc-buy{
  margin-top:10px; background:var(--cyan); color:#031820; border:none;
  padding:9px 16px; border-radius:7px; font-weight:700; font-size:13px;
  cursor:pointer; text-decoration:none; display:inline-block;
}
.fc-buy:hover{filter:brightness(1.08);}
.fc-alt-link{font-size:11px; color:var(--muted); margin-top:6px; text-decoration:underline; cursor:pointer;}

.empty-state{
  text-align:center; color:var(--muted); padding:40px 20px;
  border:1px dashed var(--line); border-radius:var(--radius);
}

.board-footer{
  margin-top:28px; font-size:12px; color:var(--muted); line-height:1.6;
  border-top:1px solid var(--line); padding-top:16px;
}
.board-footer code{color:var(--cyan); background:var(--panel-2); padding:1px 5px; border-radius:4px;}

@media (max-width:640px){
  .search-panel{grid-template-columns:1fr;}
  .summary-panel{grid-template-columns:1fr;}
  .flight-card{grid-template-columns:1fr;}
  .fc-price-col{align-items:flex-start; text-align:left;}
}
