/* ==========================================================
   BASE NAUTICA TURVO V0.10.1
   VISUAL INSPIRADO NO PAINEL DE MESAS
========================================================== */

.nt101-page{
  display:grid;
  gap:14px;
}

.nt101-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

.nt101-header h2{
  margin:0;
  font-size:22px;
}

.nt101-header p{
  margin:4px 0 0;
  font-size:12px;
  color:var(--muted);
}

.nt101-legend{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

.nt101-legend span{
  display:flex;
  align-items:center;
  gap:6px;
  background:#0b2231;
  border:1px solid var(--line);
  border-radius:18px;
  padding:6px 9px;
  font-size:10px;
}

.nt101-dot{
  width:9px;
  height:9px;
  border-radius:50%;
}

.nt101-dot.disponivel{background:#24be7b}
.nt101-dot.passeio{background:#269ed5}
.nt101-dot.manutencao{background:#d7a92f}
.nt101-dot.guardada{background:#8397a1}
.nt101-dot.bloqueada{background:#d75966}
.nt101-dot.indefinida{background:#9b6bdf}


/* CONTADORES */

.nt101-counters{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.nt101-counter{
  min-width:110px;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:10px;
  padding:9px 11px;
}

.nt101-counter strong{
  display:block;
  font-size:24px;
}

.nt101-counter span{
  color:var(--muted);
  font-size:10px;
}

.nt101-counter.disponivel strong{color:#6ce8aa}
.nt101-counter.passeio strong{color:#76d6ff}
.nt101-counter.manutencao strong{color:#ffd269}
.nt101-counter.alerta strong{color:#ff8c98}
.nt101-counter.guardada strong{color:#b8c8d0}
.nt101-counter.bloqueada strong{color:#ff9ca7}
.nt101-counter.indefinida strong{color:#d1b2ff}


/* ALERTA */

.nt101-alert{
  background:#3c2329;
  border:1px solid #704049;
  border-radius:10px;
  padding:11px 13px;
  color:#edc8cd;
  font-size:11px;
  line-height:1.6;
}

.nt101-alert strong{
  color:#ff9ca7;
}


/* ESTRUTURA */

.nt101-main{
  display:grid;
  grid-template-columns:minmax(0,2.2fr) minmax(290px,.8fr);
  gap:14px;
  align-items:start;
}

.nt101-board-shell{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:14px;
  padding:15px;
}

.nt101-board-title{
  margin-bottom:13px;
}

.nt101-board-title strong{
  display:block;
  font-size:17px;
}

.nt101-board-title span{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:10px;
}


/* QUADRO TIPO MESAS */

.nt101-board{
  display:grid;
  grid-template-columns:repeat(4,minmax(120px,1fr));
  gap:10px;
}


/* EMBARCACAO */

.nt101-boat{
  border:2px solid transparent;
  border-radius:15px;
  min-height:122px;
  padding:11px 8px;
  cursor:pointer;
  color:white;
  position:relative;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  transition:.12s ease;
}

.nt101-boat:hover{
  transform:scale(1.025);
}

.nt101-boat.selected{
  border-color:white;
  box-shadow:
    0 0 0 3px rgba(255,255,255,.13),
    0 8px 22px rgba(0,0,0,.25);
}

.nt101-boat.disponivel{
  background:linear-gradient(145deg,#19885e,#0d5b3e);
}

.nt101-boat.passeio{
  background:linear-gradient(145deg,#187ca9,#0f5275);
}

.nt101-boat.manutencao{
  background:linear-gradient(145deg,#a27a1d,#655014);
}

.nt101-boat.guardada{
  background:linear-gradient(145deg,#526b78,#354953);
}

.nt101-boat.bloqueada{
  background:linear-gradient(145deg,#a84855,#71323c);
}

.nt101-boat.indefinida{
  background:linear-gradient(145deg,#273a43,#17252c);
  border-color:#39515c;
}

.nt101-name{
  font-size:17px;
  font-weight:900;
  line-height:1.1;
}

.nt101-status{
  margin-top:8px;
  font-size:10px;
  text-transform:uppercase;
  font-weight:900;
  letter-spacing:.4px;
}

.nt101-local{
  margin-top:7px;
  font-size:10px;
  opacity:.88;
}

.nt101-fuel{
  margin-top:8px;
  font-size:12px;
  font-weight:850;
}

.nt101-rank{
  position:absolute;
  top:6px;
  right:6px;
  min-width:20px;
  height:20px;
  padding:0 4px;
  border-radius:10px;
  background:rgba(0,0,0,.25);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:9px;
}


/* PAINEL DIREITO */

.nt101-side{
  display:grid;
  gap:12px;
}

.nt101-detail,
.nt101-suggest{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:14px;
  padding:15px;
}

.nt101-detail-name{
  font-size:25px;
  font-weight:900;
}

.nt101-last-reading{
  display:grid;
  gap:4px;
  margin:12px 0;
  padding:12px 14px;
  border:1px solid #45d995;
  border-left:5px solid #45d995;
  border-radius:10px;
  background:#103e32;
  box-shadow:0 5px 16px rgba(0,0,0,.18);
}

.nt101-last-reading span{
  color:#a9dfc7;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.nt101-last-reading strong{
  color:#fff;
  font-size:1rem;
  line-height:1.35;
}

.nt101-status-pill{
  display:inline-block;
  margin-top:7px;
  padding:6px 10px;
  border-radius:18px;
  font-size:10px;
  font-weight:900;
}

.nt101-status-pill.disponivel{
  background:#124a35;
  color:#77efb5;
}

.nt101-status-pill.passeio{
  background:#164c68;
  color:#91ddff;
}

.nt101-status-pill.manutencao{
  background:#534118;
  color:#ffda76;
}

.nt101-status-pill.guardada{
  background:#354b56;
  color:#d7e2e7;
}

.nt101-status-pill.bloqueada{
  background:#603039;
  color:#ffb0ba;
}

.nt101-status-pill.indefinida{
  background:#263842;
  color:#afc1ca;
}


/* DADOS */

.nt101-data{
  display:grid;
  gap:7px;
  margin-top:13px;
}

.nt101-row{
  display:flex;
  justify-content:space-between;
  gap:10px;
  background:#091e2c;
  border-radius:8px;
  padding:9px 10px;
}

.nt101-row span{
  color:var(--muted);
  font-size:10px;
}

.nt101-row strong{
  text-align:right;
  font-size:11px;
}


/* COMBUSTIVEL */

.nt101-fuel-detail{
  margin-top:11px;
  padding:11px;
  background:#081c28;
  border-radius:10px;
}

.nt101-fuel-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:end;
}

.nt101-fuel-head strong{
  font-size:27px;
}

.nt101-fuel-head span{
  text-align:right;
  color:var(--muted);
  font-size:10px;
}


/* BOTAO DETALHES */

.nt101-detail-button{
  margin-top:12px;
  width:100%;
  border:0;
  border-radius:9px;
  padding:11px;
  background:#126fa6;
  color:white;
  font-weight:850;
  cursor:pointer;
}


/* SUGESTAO */

.nt101-suggest h3{
  margin:0;
  font-size:16px;
}

.nt101-suggest p{
  margin:4px 0 10px;
  color:var(--muted);
  font-size:10px;
}

.nt101-form{
  display:grid;
  grid-template-columns:1fr auto;
  gap:7px;
}

.nt101-form input{
  min-width:0;
  padding:10px;
  background:#071c29;
  border:1px solid var(--line);
  border-radius:8px;
  color:white;
}

.nt101-form button{
  border:0;
  border-radius:8px;
  background:#126fa6;
  color:white;
  padding:0 12px;
  font-weight:800;
  cursor:pointer;
}

.nt101-result{
  margin-top:9px;
  font-size:11px;
}

.nt101-rec{
  background:#09242f;
  border:1px solid #245466;
  border-radius:8px;
  padding:9px;
  margin-top:7px;
  line-height:1.6;
}

.nt101-rec.best{
  background:#0c2c23;
  border-color:#2b8c60;
}


/* RESPONSIVO */

@media(max-width:1100px){

  .nt101-main{
    grid-template-columns:1fr;
  }

  .nt101-board{
    grid-template-columns:repeat(4,1fr);
  }

}

@media(max-width:760px){

  .nt101-board{
    grid-template-columns:repeat(3,1fr);
  }

}

@media(max-width:520px){

  .nt101-board{
    grid-template-columns:repeat(2,1fr);
  }

  .nt101-boat{
    min-height:110px;
  }

}
.nt101-boat.limpeza-pendente{background:linear-gradient(145deg,#7d3cb5,#5a2488)!important;border-color:#c794f0!important}.nt101-detail.limpeza-pendente,.nt101-detail .limpeza-pendente{border-color:#a96ee0!important}.nt-cleaning-option{display:flex!important;align-items:center;gap:10px;margin:14px 0;padding:12px;border:1px solid #9059bd;border-radius:10px;background:#28183a;color:#f2ddff}.nt-cleaning-option input{width:22px;height:22px}
