/* Paleta "offshore" — mesma identidade visual do app Flutter
   (flutter_sync/lib/theme/app_theme.dart). Sobrescreve Bootstrap por
   seletor em vez de substituí-lo — o site continua usando os componentes
   JS do Bootstrap (modais, dropdowns) normalmente, só "repintado" por cima. */
:root {
  --offshore-petroleo: #0A2540;
  --offshore-petroleo-escuro: #071A2B;
  --offshore-superficie: #0F2D45;
  --offshore-teal: #0E8C8C;
  --offshore-ambar: #FFA000;
  --offshore-texto: #e8edf2;
  --offshore-borda: #1B3A52;
}

body {
  background-color: var(--offshore-petroleo-escuro);
  color: var(--offshore-texto);
}

a { color: var(--offshore-teal); }

.offshore-navbar, .navbar.bg-primary, .navbar.bg-dark {
  background-color: var(--offshore-petroleo) !important;
}

.card {
  background-color: var(--offshore-superficie);
  border: none;
  color: var(--offshore-texto);
}
.card-header.bg-dark, .card-header.bg-primary, .card-header.bg-success {
  background-color: var(--offshore-petroleo) !important;
  border-bottom: 1px solid var(--offshore-borda);
}

.btn-primary, .btn-warning {
  background-color: var(--offshore-ambar);
  border-color: var(--offshore-ambar);
  color: #000;
  font-weight: bold;
}
.btn-primary:hover, .btn-warning:hover { filter: brightness(0.92); color: #000; }

.btn-outline-primary, .btn-outline-warning {
  color: var(--offshore-teal);
  border-color: var(--offshore-teal);
}
.btn-outline-primary:hover, .btn-outline-warning:hover {
  background-color: var(--offshore-teal);
  color: #fff;
}

.table { color: var(--offshore-texto); --bs-table-bg: transparent; }
.table-striped > tbody > tr:nth-of-type(odd) > * { color: var(--offshore-texto); }
.table-hover > tbody > tr:hover > * { color: #fff; --bs-table-accent-bg: var(--offshore-borda); }
.table > thead { border-bottom: 2px solid var(--offshore-borda); }

.form-control, .form-select {
  background-color: var(--offshore-superficie);
  color: var(--offshore-texto);
  border-color: var(--offshore-borda);
}
.form-control:focus, .form-select:focus {
  background-color: var(--offshore-superficie);
  color: var(--offshore-texto);
  border-color: var(--offshore-teal);
  box-shadow: 0 0 0 0.2rem rgba(14, 140, 140, 0.25);
}
.form-control::placeholder { color: #8aa0b3; }
.form-label, label, .text-muted { color: #aabccb !important; }

/* .text-dark é uma classe do Bootstrap pensada pro tema claro original
   (texto quase preto sobre fundo branco) — sobre o fundo escuro novo,
   ficava quase invisível (achado real: "8,55 horas" e botões com
   .text-dark praticamente ilegíveis). */
.text-dark:not(.bg-light):not(.bg-warning):not(.bg-info):not(.bg-success) { color: var(--offshore-texto) !important; }

.modal-content {
  background-color: var(--offshore-superficie);
  color: var(--offshore-texto);
}
.modal-header { border-bottom-color: var(--offshore-borda); }
.modal-footer { border-top-color: var(--offshore-borda); }

.dropdown-menu {
  background-color: var(--offshore-superficie);
  border-color: var(--offshore-borda);
}
.dropdown-item { color: var(--offshore-texto); }
.dropdown-item:hover, .dropdown-item:focus {
  background-color: var(--offshore-borda);
  color: #fff;
}
.dropdown-divider { border-color: var(--offshore-borda); }

.alert-success { background-color: rgba(14, 140, 140, 0.2); color: #b9f3ed; border-color: var(--offshore-teal); }
.alert-danger { background-color: rgba(220, 53, 69, 0.2); color: #ffc6cc; border-color: #dc3545; }
.alert-warning { background-color: rgba(255, 160, 0, 0.2); color: #ffe1ad; border-color: var(--offshore-ambar); }

/* Impressão/PDF (Relatório Mensal) precisa continuar legível em fundo
   branco — nunca herdar o tema escuro aqui. */
@media print {
  body, .card, .table, .form-control { background-color: #fff !important; color: #000 !important; }
  .form-label, label, .text-muted { color: #555 !important; }
}