/* =======================================================
   TEMA ESCURO - ESTILOS GERAIS
   ======================================================= */

/* Fundo geral */
body {
  background-color: #0e0e0e !important;
  color: #e0e0e0 !important;
}

/* =======================================================
   NAVBAR
   ======================================================= */

.navbar {
  background-color: #000 !important;
}

/* Links do menu (estado normal) */
.navbar-nav .nav-link {
  color: #ffffff !important;
  font-weight: bold !important;
}

/* Hover do menu */
.navbar-nav .nav-link:hover {
  color: #ffffff !important;
}

/* Item ativo */
.navbar-nav .nav-item.active .nav-link {
  color: #ffffff !important;
  font-weight: bold !important;
}

/* Navbar depois do scroll */
.top-nav-collapse {
  background-color: #000 !important;
}

/* Garantir que depois do scroll continua branco e bold */
.top-nav-collapse .navbar-nav .nav-link {
  color: #ffffff !important;
  font-weight: bold !important;
}

.top-nav-collapse .navbar-nav .nav-link:hover {
  color: #ffffff !important;
}

.top-nav-collapse .navbar-nav .nav-item.active .nav-link {
  color: #ffffff !important;
  font-weight: bold !important;
}

/* =======================================================
   SEÇÕES GERAIS
   ======================================================= */

section {
  background-color: #0e0e0e !important;
  color: #e0e0e0 !important;
}

/* Ajuste de scroll para links âncora */
section {
  scroll-margin-top: 120px;
}

/* =======================================================
   TÍTULOS
   ======================================================= */

.section-title,
h1, h2, h3, h4, h5, h6 {
  color: #ffffff !important;
}

/* =======================================================
   CARDS E BLOCOS
   ======================================================= */

.services-item,
.about-item,
.team-item,
.price-block-wrapper,
.blog-item,
.card {
  background-color: #141414 !important;
  color: #e0e0e0 !important;
  border: 1px solid #222 !important;
}

/* Texto dentro dos cards */
.services-content p,
.about-text p,
.card-body p {
  color: #cccccc !important;
}

/* =======================================================
   COUNTDOWN
   ======================================================= */

.countdown-timer {
  background-color: #0a0a0a !important;
}

.time-entry {
  background-color: #111 !important;
  color: #fff !important;
  border: 1px solid #222 !important;
}

/* =======================================================
   BOTÕES
   ======================================================= */

.btn-common {
  background-color: #222 !important;
  color: #fff !important;
  border: 1px solid #333 !important;
}

.btn-border {
  border: 1px solid #fff !important;
  color: #fff !important;
}

/* =======================================================
   FOOTER
   ======================================================= */

.footer-area {
  background-color: #000 !important;
}

#copyright {
  background-color: #000 !important;
  color: #888 !important;
}

/* =======================================================
   FORMULÁRIOS
   ======================================================= */

input,
textarea {
  background-color: #111 !important;
  color: #fff !important;
  border: 1px solid #333 !important;
}

/* =======================================================
   FAQ ACCORDION
   ======================================================= */

.accordion .card-header {
  background-color: #111 !important;
  color: #fff !important;
}

/* =======================================================
   GALERIA
   ======================================================= */

.gallery-box {
  background-color: #000 !important;
}

/* =======================================================
   LINKS GERAIS
   ======================================================= */

a {
  color: #ffffff !important;
}

a:hover {
  color: #bbbbbb !important;
}

/* =======================================================
   ESTILO ESPECÍFICO DA SECÇÃO ABOUT
   ======================================================= */

#about .container {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}

#about p {
  font-size: 22px;
  line-height: 1.8;
  text-align: center;
  margin-bottom: 20px;
}

.home-countdown {
  margin-top: 20px;
  display: flex;
  justify-content: center;
}

.home-countdown #clock {
  display: flex;
  justify-content: center;
}

.home-countdown .time-entry {
  background: rgba(0,0,0,0.6) !important;
  color: white !important;
  padding: 10px;
  margin: 5px;
}

/* ===== CUSTOM MODAL STYLE - FORÇADO ===== */

/* HEADER DO MODAL */
.modal-header,
.modal .modal-header,
.modal-dialog .modal-header,
.modal-content .modal-header {
  background-color: #333 !important;
  color: #333 !important;
}

/* TÍTULO PRINCIPAL */
.modal-title {
  font-weight: 800 !important;
  color: #ffffff !important;
}

/* CAIXA PRINCIPAL DO MODAL */
.modal-content {
  border-radius: 8px !important;
  background-color: #ffffff !important;
}

/* CORPO DO MODAL */
.modal-body {
  background-color: #333 !important;
  color: #ffffff !important;
}

/* SUBTÍTULOS DENTRO DO CORPO */
.modal-body h5 {
  color: #ffffff !important;
  margin-bottom: 10px;
}

/* PARÁGRAFOS */
.modal-body p {
  text-align: justify !important;
  color: #333 !important;
}

/* RODAPÉ DO MODAL */
.modal-footer {
  background-color: #333 !important;
  border-top: 0px solid #dddddd !important;
}

/* BOTÃO FECHAR */
.modal-footer .btn {
  background-color: #716c6e !important;
  color: white !important;
  border: none !important;
}

.modal-footer .btn:hover {
  background-color: #E91E63 !important;
}

/* ===== CENTRALIZAÇÃO SEGURA DO MODAL ===== */

.modal-dialog {
  display: flex !important;
  align-items: center;
  min-height: calc(100% - 1rem);
  margin: 0 auto !important;
}

.modal-content {
  margin: auto !important;
}

/* Animação suave */
.modal.fade .modal-dialog {
  transform: translateY(-20px);
  transition: transform 0.3s ease-out;
}

.modal.show .modal-dialog {
  transform: translateY(0);
}

/* Ajuste para mobile */
@media (max-width: 767px) {
  .modal-dialog {
    width: 95%;
  }
}