/*
	Custom CSS
	Please make sure your CSS rules are 
	more particular / have higher priority
	then other page styles
*/
 #events h3   {
	/* add your css rule here */
}


 #events p.duration, #events div.duration   {
	/* add your css rule here */
}


 #events p.description, #events div.description   {
	/* add your css rule here */
}


 #events .selectedEvent   {
	/* add your css rule here */
}


 #events input.reserve_time_btn   {
	/* add your css rule here */
}


 #events input.select_another_btn   {
	/* add your css rule here */
}


 #eventForm #start_date-block-container h3, #eventForm #timeline-container h3   {
	/* add your css rule here */
}


 #eventForm #save_button   {
	/* add your css rule here */
}


 div.ui-widget-content   {
	/* add your css rule here */
}


 div.ui-widget-header   {
	/* add your css rule here */
}


 #timeline-container table.timeline   {
	/* add your css rule here */
}


 .timeline td.not_worked_time   {
	/* add your css rule here */
}


 .timeline td.free_time   {
	/* add your css rule here */
}


 .timeline td.selected_time   {
	/* add your css rule here */
}


 .timeline td.reserved_time   {
	/* add your css rule here */
}


 div#loading   {
	/* add your css rule here */
}


 #start_date-block-container .zend_form dt, start_date-block-container .zend_form dt b, start_date-block-container .zend_form dd label   {
	/* add your css rule here */
}

/* ===================================================
   Massage Spa D02 — Custom Booking Page Styles
   Cole este código no campo de CSS customizado do
   SimplyBook (Settings → Design → Color settings →
   Enable "Customize with CSS styles")
   =================================================== */

/* Importa fontes mais elegantes (Google Fonts) */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700&family=Montserrat:wght@500;600&family=Lato:wght@400;500&display=swap');

/* Tipografia geral */
body, .sb-widget, .sb-widget * {
  font-family: 'Lato', sans-serif !important;
}

/* Títulos com fonte mais sofisticada */
h1, h2, h3,
.sb-service-title,
.company-title,
.step-title {
  font-family: 'Playfair Display', serif !important;
  letter-spacing: 0.3px;
}

/* Cards de serviço — sombra suave e cantos arredondados */
.service-item {
  border-radius: 14px !important;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08) !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
  border: none !important;
}

/* Efeito hover — o card "flutua" levemente */
.service-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.14) !important;
}

/* Imagem do serviço — leve zoom no hover */
.service-item img {
  transition: transform 0.4s ease;
  border-radius: 14px 14px 0 0 !important;
}

.service-item:hover img {
  transform: scale(1.05);
}

/* ===================================================
   Botões — estilo premium (dourado envelhecido, uppercase,
   minimalista). Classes reais confirmadas via inspeção do DOM:
   .btn.select (cards) / .btn.map / .btn.book (banner)
   — nem todos têm .custom, então o seletor não depende dela
   =================================================== */
.btn.map, .btn.book, .btn.select {
  background: #1E2430 !important;
  border: 1px solid #DEC17E !important;
  border-radius: 4px !important;
  color: #DEC17E !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  padding: 12px 28px !important;
  box-shadow: none !important;
  transition: background 0.3s ease, color 0.3s ease, letter-spacing 0.3s ease !important;
}

.btn.map:hover, .btn.book:hover, .btn.select:hover {
  background: #DEC17E !important;
  color: #1E2430 !important;
  letter-spacing: 2px !important;
}

/* Garante que o link <a> por dentro do .btn herde a cor certa */
.btn.map a, .btn.book a, .btn.select a,
.btn.map, .btn.book, .btn.select {
  color: #DEC17E !important;
  text-decoration: none !important;
}

.btn.map:hover a, .btn.book:hover a, .btn.select:hover a,
.btn.map:hover, .btn.book:hover, .btn.select:hover {
  color: #1E2430 !important;
}

/* Preço em destaque */
.sb-price,
.price {
  font-weight: 600 !important;
  color: #2D5FA8 !important;
}

/* Fundo geral da página — leve textura/gradiente em vez de cor chapada */
body {
  background: linear-gradient(180deg, #F4F1EC 0%, #E6E2DD 100%) !important;
}

/* Esconde branding "powered by" se existir (ajuste o seletor se necessário) */
.sb-powered-by,
.powered-by {
  display: none !important;
}

/* ===================================================
   Banner principal — título
   =================================================== */

/* Título sobre a foto — garante legibilidade com sombra
   Classe real confirmada via inspeção do DOM: .company-name
   (NÃO usar .title-main — essa classe é compartilhada com
   "Opening Hours", "Contact us" e outros títulos de seção) */
.company-name,
.company-name a {
  font-family: 'Playfair Display', serif !important;
  font-size: 2.2rem !important;
  color: #DEC17E !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.6) !important;
  letter-spacing: 1px !important;
}

/* Mobile — reduz mais pra evitar quebra de linha em telas estreitas */
@media (max-width: 600px) {
  .company-name,
  .company-name a {
    font-size: 1.5rem !important;
    letter-spacing: 0.5px !important;
  }
}

/* Linha dourada decorativa + tagline abaixo do nome */
.company-name::after {
  content: "Sensual Massage · Dublin";
  display: block;
  width: fit-content;
  margin: 12px auto 0;
  padding-top: 10px;
  border-top: 1px solid #DEC17E;
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  letter-spacing: 3px;
  color: #DEC17E;
  text-transform: uppercase;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.6);
}

/* ===================================================
   Esconde a aba "Reviews" (sem avaliações ainda)
   =================================================== */
.sb-tab-reviews,
.tab-reviews,
[data-tab="reviews"],
a[href*="reviews"],
.reviews-tab,
.sb-reviews-section {
  display: none !important;
}

/* ===================================================
   Esconde profissionais sem horário disponível na data
   selecionada (colunas do calendário "Modern Provider")
   =================================================== */
.tab_provider-col:not(:has(.time-cell.free)) {
  display: none !important;
}


/* Foto das profissionais no calendário — levemente maior */
.tab_provider-col .photo.user {
  width: 106px !important;
  height: 106px !important;
}