/*
 * Stili applicativi. Bootstrap 5 e' caricato separatamente nel layout.
 * Personalizzazioni di brand: colore primario verde Ghost Boats e font Poppins.
 */

:root {
  --bs-primary: #1C5A57;
  --bs-primary-rgb: 28, 90, 87;
}

body {
  font-family: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

a {
  color: #1C5A57;
}

.text-primary {
  color: #1C5A57 !important;
}

.btn-primary {
  --bs-btn-bg: #1C5A57;
  --bs-btn-border-color: #1C5A57;
  --bs-btn-hover-bg: #154441;
  --bs-btn-hover-border-color: #123a37;
  --bs-btn-active-bg: #123a37;
  --bs-btn-active-border-color: #0f312f;
  --bs-btn-disabled-bg: #1C5A57;
  --bs-btn-disabled-border-color: #1C5A57;
}

/* Login split-screen (richiama l'impostazione del login Yii). */
.login-page {
  min-height: 100vh;
}

.login-aside {
  background-color: #f2f3f5;
}

.login-card {
  max-width: 450px;
}

.login-logo {
  max-width: 320px;
  width: 100%;
}

/* Thumbnail quadrato e centrato (ritaglio cover) per la lista boats. */
.boat-thumb {
  width: 72px;
  height: 72px;
  object-fit: cover;
  object-position: center;
}

/* Placeholder quando la boat non ha foto. */
.boat-thumb-placeholder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #e9ecef;
  color: #adb5bd;
  font-size: 1.6rem;
}

.dashboard-map {
  min-height: 440px;
  height: 100%;
}

/* Contenitore del grafico: altezza definita cosi' Chart.js non si dilata. */
.chart-box {
  position: relative;
  min-height: 300px;
}

/* ===== App shell (dashboard) ===== */
.app-header {
  height: 64px;
  background: #fff;
  border-bottom: 1px solid #e9ecef;
  position: sticky;
  top: 0;
  z-index: 1030;
}

.app-logo img {
  height: 38px;
  max-width: 205px;
}

.app-topmenu .nav-link {
  color: #1C5A57;
  font-weight: 600;
}

.app-topmenu .nav-link:hover {
  color: #123a37;
}

.app-sidebar {
  width: 260px;
  flex-shrink: 0;
  background: #fff;
  border-right: 1px solid #e9ecef;
  position: sticky;
  top: 64px;
  height: calc(100vh - 64px);
  overflow-y: auto;
}

.app-sidebar .nav-link {
  color: #3f4254;
  font-weight: 500;
  border-radius: .5rem;
  padding: .6rem .85rem;
}

.app-sidebar .nav-link:hover {
  background: #f2f5f4;
  color: #1C5A57;
}

.app-sidebar .nav-link.active {
  background: #e6f0ef;
  color: #1C5A57;
  font-weight: 600;
}

/* Icone allineate: larghezza fissa cosi' le label partono tutte dallo stesso punto. */
.app-sidebar .nav-link .bi {
  width: 1.25rem;
  font-size: 1.05rem;
  text-align: center;
  color: #8a94a6;
}

.app-sidebar .nav-link:hover .bi,
.app-sidebar .nav-link.active .bi {
  color: #1C5A57;
}
