/* Blog (Magazine) styles: article pages, archive, tag pages. Generated from the former inline blocks by build-blog.py's predecessor; edit here. */

input[type="text"] {
    color: white !important;
    cursor: pointer !important;
}
input[type="text"]:focus {
    outline: none !important;
}
.flatpickr-calendar {
    background: #333333 !important;
    border-radius: 0px !important;
    border: none !important;
    box-shadow: 0 20px 40px rgba(0,0,0,0.4) !important; /* Box shadow de volta */
    font-family: inherit !important;
    width: 350px !important; /* Aumentar largura */
}

/* HEADER MELHORADO */
.flatpickr-months {
    background: #333333 !important;
    padding: 24px 24px 16px 24px !important; /* Padding lateral 24px */
    font-size: 14px;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: relative !important;
}
.flatpickr-month {
    color: #fff !important;
    font-weight: 300 !important;
    font-size: 14px !important;
    display: flex !important;
    align-items: center !important;
    gap: 16px !important; /* Aumentar espaçamento entre mês e ano */
}
.flatpickr-current-month {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important; /* Espaçamento entre mês e ano */
}
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-current-month input.cur-year {
    color: #fff !important;
    background: transparent !important;
    border: none !important;
    font-weight: 300 !important;
    font-size: 14px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* SETAS MAIORES E ALINHADAS COM O MÊS/ANO */
.flatpickr-prev-month,
.flatpickr-next-month {
    color: #fff !important;
    width: 32px !important; /* Aumentar tamanho */
    height: 32px !important; /* Aumentar tamanho */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background 0.2s ease !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    fill: #fff !important; /* Forçar cor branca */
    margin-top: 8px !important; /* Mover um pouco para baixo para alinhar */
}
.flatpickr-prev-month svg,
.flatpickr-next-month svg {
    fill: #fff !important;
    stroke: #fff !important;
    width: 16px !important; /* Aumentar SVG */
    height: 16px !important; /* Aumentar SVG */
}
.flatpickr-prev-month:hover,
.flatpickr-next-month:hover {
    background: rgba(255,255,255,0.1) !important;
}

/* DIAS DA SEMANA COM MAIS ESPAÇAMENTO */
.flatpickr-weekdays {
    background: #333333 !important;
    color: #fff !important;
    font-weight: 300 !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    padding: 24px 24px !important; /* Ainda mais espaçamento vertical */
    display: flex !important;
    justify-content: space-between !important; /* Distribuir igualmente */
}
.flatpickr-weekday {
    color: #fff !important;
    font-weight: 300 !important;
    text-align: center !important;
    flex: 1 !important;
    padding: 0 8px !important; /* Mais espaçamento entre os nomes dos dias */
}

/* DIAS MELHOR ALINHADOS SEM CORTAR */
.flatpickr-days {
    background: #333333 !important;
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    gap: 0px !important; /* Sem espaçamento entre os números */
    padding: 0 24px 16px 24px !important; /* Padding 24px alinhado */
    width: 100% !important; /* Usar toda largura disponível */
    box-sizing: border-box !important;
}
.flatpickr-day {
    background: #333333 !important;
    color: #fff !important;
    width: 100% !important; /* Usar toda largura da célula do grid */
    height: 42px !important; /* Aumentar altura um pouco */
    font-weight: 300 !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
    border-radius: 0px !important;
    border: 0px !important;
    margin: 0px !important;
    padding: 0px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}
.flatpickr-day:hover {
    background: rgba(255,255,255,0.1) !important;
    color: #fff !important;
    border-radius: 0px !important;
    border: 0px !important;
}
/* DIA SELECIONADO */
.flatpickr-day.selected {
    background: #D9B57D !important;
    color: #333333 !important;
    font-weight: 400 !important;
    border-radius: 0px !important;
    border: 0px !important;
}
.flatpickr-day.selected:hover {
    background: #D9B57D !important;
    border-radius: 0px !important;
    border: 0px !important;
}
/* DIAS DESABILITADOS */
.flatpickr-day.flatpickr-disabled {
    color: #F8F7F3 !important;
    opacity: 0.3;
    cursor: not-allowed !important;
}
.flatpickr-day.flatpickr-disabled:hover {
    background: transparent !important;
    color: #F8F7F3 !important;
    opacity: 0.3;
}
/* DIA DE HOJE - REMOVIDO COMPLETAMENTE */
.flatpickr-day.today {
    background: #333333 !important;
    color: #fff !important;
    border: 0px !important;
    border-radius: 0px !important;
}
.flatpickr-day.today:hover {
    background: rgba(255,255,255,0.1) !important;
    border: 0px !important;
    border-radius: 0px !important;
}
/* DIAS DE OUTROS MESES */
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
    color: #fff !important;
}

.flatpickr-day.inRange {
    background: rgba(255,255,255,0.1) !important;
    color: #fff !important;
    border-radius: 0px !important;
    border: 0px !important;
    margin: 0px !important;
    padding: 0px !important;
    box-sizing: border-box !important;
}
.flatpickr-day.startRange {
    background: #D9B57D !important;
    color: #333333 !important;
    border-radius: 0px !important;
    border: 0px !important;
    margin: 0px !important;
    padding: 0px !important;
    box-sizing: border-box !important;
}
.flatpickr-day.endRange {
    background: #D9B57D !important;
    color: #333333 !important;
    border-radius: 0px !important;
    border: 0px !important;
    margin: 0px !important;
    padding: 0px !important;
    box-sizing: border-box !important;
}
.flatpickr-day.startRange.endRange {
    background: #D9B57D !important;
    color: #333333 !important;
    border-radius: 0px !important;
    border: 0px !important;
    margin: 0px !important;
    padding: 0px !important;
    box-sizing: border-box !important;
}

/* FORÇAR REMOÇÃO DE GAPS */
.flatpickr-days .flatpickr-day {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
}

/* OVERRIDE PADRÃO DO FLATPICKR */
.flatpickr-calendar .flatpickr-days .flatpickr-day {
    margin: 0 !important;
    border: 0 !important;
}

/* BOTÕES DE AÇÃO */
.flatpickr-calendar .flatpickr-time {
    background: #2c2c2c !important;
}

/* RESPONSIVO */
@media (max-width: 768px) {
    .flatpickr-calendar {
        width: 90vw !important;
        max-width: 350px !important; /* Atualizar max-width */
    }
}

/* PLACEHOLDER DOS INPUTS */
.flatpickr-input::placeholder {
    color: #fff !important;
}
.calendar-trigger {
    display: none;
}

.flatpickr-calendar {
    position: absolute !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    z-index: 9999 !important;
}

.reservation-wrap .flatpickr-calendar {
    position: absolute !important;
    bottom: 100% !important;
    left: 40% !important;  
    transform: translateX(-50%) !important;
    margin-bottom: 10px !important;
    z-index: 9999 !important;
}

/* Overflow fix */
.main-wrapper { overflow: visible !important; }

/* Echo reviews font overrides */
.echo-section * { font-family: 'Fff Acidgrotesk', Tahoma, sans-serif !important; }
.echo-section h2 { font-weight: 200 !important; letter-spacing: 0 !important; }
.echo-section .text-\[\#5a4a32\] { color: #d9b57d !important; }

/* Scroll animations */
@keyframes scroll-left { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
@keyframes scroll-right { 0% { transform: translateX(-50%); } 100% { transform: translateX(0); } }
.animate-scroll-left { animation: scroll-left 40s linear infinite; }
.animate-scroll-right { animation: scroll-right 40s linear infinite; }
.animate-scroll-left:hover, .animate-scroll-right:hover { animation-play-state: paused; }

/* Responsive: Tablet */
@media screen and (max-width: 991px) {
  [data-echo='welcome'] > div > div,
  [data-echo='culture'] > div > div {
    display: flex !important;
    flex-flow: column !important;
  }
  [data-echo='welcome'] > div > div > h2,
  [data-echo='culture'] > div > div > h2 {
    max-width: none !important;
  }
}

/* Responsive: Mobile */
@media screen and (max-width: 767px) {
  [data-echo='welcome'],
  [data-echo='culture'] {
    padding: 4rem 1rem !important;
  }
  [data-echo='welcome'] h3,
  [data-echo='culture'] h3 {
    font-size: 1.5rem !important;
  }
  .echo-section {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
  }
}

/* Responsive: Small mobile */
@media screen and (max-width: 479px) {
  [data-echo='welcome'] > div > div,
  [data-echo='culture'] > div > div {
    gap: 1rem !important;
  }
  [data-echo='welcome'] h3,
  [data-echo='culture'] h3 {
    font-size: 1.25rem !important;
  }
}

.article-hero {
    position: relative;
    height: 70vh;
    min-height: 500px;
    overflow: hidden;
    display: flex;
    background-color: #47614d;
  }
  .article-hero-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .article-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.35) 50%, rgba(0,0,0,0.15) 100%);
  }
  .article-hero .container-large {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 5.5rem 3rem;
    width: 100%;
    max-width: 150rem;
    margin: 0 auto;
  }
  .article-category {
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.6px;
    color: #d9b57d;
    margin-bottom: 1rem;
  }
  .article-hero h1 {
    font-size: 3rem;
    font-weight: 200;
    color: #f7f7f2;
    line-height: 1.3;
    max-width: 48rem;
    margin-bottom: 1.5rem;
  }
  .article-meta {
    font-size: 0.875rem;
    font-weight: 400;
    color: rgba(247,247,242,0.7);
    letter-spacing: 1.6px;
  }

  /* Article body */
  .article-body {
    padding: 5.5rem 3rem;
    background-color: #f7f7f2;
  }
  .article-body-inner {
    max-width: 150rem;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(200px, 200px) 1fr;
    gap: 2rem;
  }
  .article-sidebar {
    position: sticky;
    top: 6rem;
    align-self: start;
  }
  .article-sidebar-label {
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.6px;
    color: #333;
    max-width: 7.8rem;
    line-height: 1.4;
    border-top: 1px solid #333;
    padding-top: 1.5rem;
  }
  .article-content {
    max-width: 48rem;
  }
  .article-content p {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: 1.6px;
    color: #333;
    margin-bottom: 2rem;
  }
  .article-inline-image {
    width: 100%;
    margin: 1rem 0 3rem;
    overflow: hidden;
  }
  .article-inline-image img {
    width: 100%;
    height: auto;
    max-height: 28rem;
    object-fit: cover;
    display: block;
  }

  .article-content h2 {
    font-size: 1.5rem;
    font-weight: 500;
    letter-spacing: 1.6px;
    line-height: 1.35;
    color: #333;
    margin: 3rem 0 1.25rem;
  }
  .article-content h3 {
    font-size: 1.125rem;
    font-weight: 600;
    letter-spacing: 1.6px;
    line-height: 1.4;
    color: #333;
    margin: 2rem 0 1rem;
  }
  .article-content ul, .article-content ol {
    margin: 0 0 2rem 1.25rem;
  }
  .article-content li {
    font-size: 1rem;
    line-height: 1.8;
    letter-spacing: 1.6px;
    color: #333;
    margin-bottom: 0.5rem;
  }
  /* Related posts */
  .related-section {
    padding: 5.5rem 3rem;
    background-color: #47614d;
  }
  .related-inner {
    max-width: 150rem;
    margin: 0 auto;
  }
  .related-title-wrap {
    border-top: 1px solid #f7f7f2;
    padding-top: 1.5rem;
    margin-bottom: 3rem;
  }
  .related-title {
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.6px;
    color: #f7f7f2;
  }
  .related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
  }
  .related-card {
    text-decoration: none;
    color: #f7f7f2;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    transition: opacity 0.3s;
  }
  .related-card:hover { opacity: 0.85; }
  .related-card-image {
    aspect-ratio: 541 / 350;
    overflow: hidden;
  }
  .related-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
  }
  .related-card:hover img { transform: scale(1.03); }
  .related-card-category {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.6px;
    color: #d9b57d;
  }
  .related-card-title {
    font-size: 1.25rem;
    font-weight: 200;
    line-height: 1.4;
  }

  /* Back link */
  .back-to-magazine {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 2rem;
    font-size: 0.875rem;
    font-weight: 300;
    color: #333;
    text-decoration: underline;
    text-underline-offset: 40%;
    text-decoration-thickness: calc(1em / 16.6667);
    transition: opacity 0.3s;
  }
  .back-to-magazine:hover { opacity: 0.75; }

  .main-wrapper { overflow: visible !important; }
  .page-wrapper { overflow: visible !important; }
  .article-body { padding-bottom: 8rem; }
  
  /* Reading time in sidebar */
  .article-reading-time {
    font-size: 0.875rem;
    font-weight: 400;
    color: #999;
    letter-spacing: 1.6px;
    margin-top: 1rem;
  }
  .article-share-links {
    margin-top: 2rem;
    display: flex;
    gap: 1rem;
  }
  .article-share-links a {
    font-size: 0.875rem;
    font-weight: 300;
    color: #333;
    text-decoration: underline;
    text-underline-offset: 40%;
    text-decoration-thickness: calc(1em / 16.6667);
    transition: opacity 0.3s;
  }
  .article-share-links a:hover { opacity: 0.6; }

  /* Responsive */
  @media (max-width: 991px) {
    .article-hero h1 { font-size: 2.25rem; }
    .article-body-inner { grid-template-columns: 1fr; }
    .article-sidebar { position: static; }
    .related-grid { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 767px) {
    .article-hero { min-height: 400px; height: 60vh; }
    .article-hero .container-large { padding: 4rem 1rem; }
    .article-hero h1 { font-size: 1.75rem; }
    .article-body { padding: 4rem 1rem; }
    .related-section { padding: 4rem 1rem; }
    .related-grid { grid-template-columns: 1fr; }
  }

/* Hero - matching eventos page */
    .blog-hero {
      position: relative;
      height: 100vh;
      min-height: 600px;
      overflow: hidden;
      display: flex;
      background-color: #47614d;
    }
    .blog-hero-image {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: 0.5;
    }
    .blog-hero-overlay {
      position: absolute;
      inset: 0;
      background-color: rgba(51, 51, 51, 0.3);
    }
    .blog-hero .container-large {
      position: relative;
      z-index: 1;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding: 8rem 3rem;
      width: 100%;
    }
    .blog-hero h1 {
      font-size: 3.5rem;
      font-weight: 200;
      color: #f7f7f2;
      line-height: 1.2;
      margin-bottom: 1.5rem;
    }
    .blog-hero-subtitle {
      font-size: 1.75rem;
      font-weight: 200;
      color: #f7f7f2;
      line-height: 1.4;
      max-width: 48rem;
      overflow: hidden;
    }

    /* Filters section */
    .blog-filters-section {
      padding: 5.5rem 3rem 0;
      background-color: var(--brand--off-white, #f7f7f2);
    }
    .blog-filters-inner {
      max-width: 150rem;
      margin: 0 auto;
      border-top: 1px solid #333;
      padding-top: 1.5rem;
      display: grid;
      grid-template-columns: minmax(200px, 200px) 1fr;
      gap: 2rem;
      align-items: start;
    }
    .filter-label {
      font-size: 0.875rem;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 1.6px;
      color: #333;
      max-width: 7.8rem;
      line-height: 1.4;
    }
    .filter-buttons {
      display: flex;
      flex-wrap: wrap;
      gap: 0.75rem;
      align-items: center;
    }
    .filter-btn {
      font-family: 'Fff Acidgrotesk', Tahoma, sans-serif;
      font-size: 0.875rem;
      font-weight: 400;
      letter-spacing: 1.6px;
      padding: 0.625rem 1.5rem;
      border: 1px solid #333;
      background: #f7f7f2;
      color: #333;
      cursor: pointer;
      transition: all 0.5s;
    }
    .filter-btn:hover {
      border-color: #f7f7f2;
      background-color: transparent;
      color: #f7f7f2;
    }
    .filter-btn.active {
      background-color: #333;
      color: #f7f7f2;
      border-color: #333;
    }
    .filter-btn.active:hover {
      background-color: #f7f7f2;
      color: #333;
      border-color: #333;
    }

    /* Grid section */
    .blog-grid-section {
      padding: 3.5rem 3rem 5.5rem;
      background-color: var(--brand--off-white, #f7f7f2);
    }
    .blog-grid-inner {
      max-width: 150rem;
      margin: 0 auto;
    }
    .blog-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 3.5rem 2rem;
      align-items: stretch;
    }

    /* Card */
    .blog-card {
      display: flex;
      flex-direction: column;
      gap: 1.5rem;
      text-decoration: none;
      color: inherit;
      transition: opacity 0.3s;
    }
    .blog-card:hover {
      opacity: 0.85;
    }
    .blog-card-content {
      display: flex;
      flex-direction: column;
      gap: 0.75rem;
      flex: 1;
    }
    .blog-card-meta {
      margin-top: auto;
      padding-top: 0.5rem;
    }
    .blog-card-image {
      aspect-ratio: 541 / 400;
      overflow: hidden;
      position: relative;
    }
    .blog-card-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.6s ease;
    }
    .blog-card:hover .blog-card-image img {
      transform: scale(1.04);
    }
    .blog-card-category {
      font-size: 0.875rem;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 1.6px;
      color: var(--brand--gold, #d9b57d);
    }
    .blog-card-title {
      font-size: 1.5rem;
      font-weight: 200;
      line-height: 1.4;
      color: #333;
      letter-spacing: 0;
    }
    .blog-card-excerpt {
      font-size: 0.875rem;
      font-weight: 400;
      line-height: 1.6;
      letter-spacing: 1.6px;
      color: #333;
    }
    .blog-card-meta {
      display: flex;
      align-items: center;
      gap: 1rem;
    }
    .blog-card-date {
      font-size: 0.875rem;
      font-weight: 400;
      color: #999;
      letter-spacing: 1.6px;
    }
    .blog-card-readmore {
      font-weight: 300;
      color: #333;
      text-decoration: underline;
      text-underline-offset: 40%;
      text-decoration-skip-ink: auto;
      text-decoration-thickness: calc(1em / 16.6667);
      font-size: 0.875rem;
      transition: opacity 0.3s;
    }
    .blog-card:hover .blog-card-readmore {
      opacity: 0.75;
    }

    /* No results */
    .no-results {
      text-align: center;
      padding: 4rem 0;
      font-size: 1.25rem;
      font-weight: 300;
      color: #999;
      grid-column: 1 / -1;
      display: none;
    }
    .no-results.visible {
      display: block;
    }

    /* Responsive */
    @media (max-width: 991px) {
      .blog-hero .container-large { padding: 5.5rem 3rem; }
      .blog-hero h1 { font-size: 2.5rem; }
      .blog-hero-subtitle { font-size: 1.5rem; }
      .blog-grid { grid-template-columns: repeat(2, 1fr); }
      .blog-filters-inner { grid-template-columns: 1fr; }
      .filter-label { max-width: none; }
    }
    @media (max-width: 767px) {
      .blog-hero { min-height: 450px; height: 70vh; }
      .blog-hero .container-large { padding: 4rem 1rem; }
      .blog-hero h1 { font-size: 2rem; }
      .blog-hero-subtitle { font-size: 1.25rem; max-width: 100%; }
      .blog-filters-section { padding: 4rem 1rem 0; }
      .blog-filters-inner { grid-template-columns: 1fr; }
      .filter-buttons {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 0.5rem;
        scrollbar-width: none;
      }
      .filter-buttons::-webkit-scrollbar { display: none; }
      .filter-btn { white-space: nowrap; flex-shrink: 0; }
      .blog-grid-section { padding: 2rem 1rem 4rem; }
      .blog-grid { grid-template-columns: 1fr; gap: 2.5rem; }
    }
    @media (max-width: 479px) {
      .blog-hero h1 { font-size: 1.75rem; }
      .blog-hero-subtitle { font-size: 1rem; }
      .blog-card-title { font-size: 1.25rem; }
    }

.blog-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  padding: 2rem 3rem 5.5rem;
  background-color: #f7f7f2;
}
.page-btn {
  font-family: 'Fff Acidgrotesk', Tahoma, sans-serif;
  font-size: 0.875rem;
  font-weight: 400;
  letter-spacing: 1.6px;
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #333;
  background: transparent;
  color: #333;
  cursor: pointer;
  transition: all 0.3s;
}
.page-btn:hover, .page-btn.active {
  background-color: #333;
  color: #f7f7f2;
}
.page-btn.nav-arrow {
  width: auto;
  padding: 0 1rem;
  font-weight: 300;
}
.page-btn:disabled {
  opacity: 0.3;
  cursor: default;
}
.page-btn:disabled:hover {
  background: transparent;
  color: #333;
}
/* Hide main-wrapper overflow fix for blog page */
.main-wrapper { overflow: visible !important; }
.page-wrapper { overflow: visible !important; }