/*
	Custom CSS
	Please make sure your CSS rules are 
	more particular / have higher priority
	then other page styles
*/
/*
.form-group.form-client-email{
    display: none;
}
*/

 #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 */
}

.tab.tab-col .excerpt-info .btn-bar .btn.select a {
   font-weight: bold;
   font-size: 20px;
}

.tab.tab-col .cap.short {
    font-size: 20px;
}

.blur-company-name {
    display: none;
}
 
/* Налаштування заголовка для вашого шаблону */
.cap.short, .cap {
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important; /* Дозволяємо 3 рядки */
    -webkit-box-orient: vertical !important;
    overflow: visible !important;
    white-space: normal !important;
    height: auto !important;
    min-height: 3.9em !important;
    line-height: 1.3em !important;
}

/* Прибираємо обмеження висоти у батьківського контейнера */
.excerpt-info {
    height: auto !important;
}

@media (max-width: 1024px){

  /* =========================
     0) ПРИБИРАЄМО БІЛИЙ ПРОШАРОК ПІД ПЛАШКОЮ
  ========================== */
  #sb-timeline #steps-content,
  #sb-timeline #steps-content > .container-fluid,
  #sb-timeline #steps-content .row,
  #sb-timeline #sb_back_button,
  #sb-timeline #sb_booking_content{
    background: transparent !important;
  }

  /* back button без “поля” */
  #sb-timeline #sb_back_button{
    padding: 0 !important;
  }

  /* =========================
     1) НАВІГАЦІЯ КРОКІВ: ЛИШАЄМО SERVICE + ACTIVE
  ========================== */

  /* ховаємо всі кроки */
  #sb-timeline #steps-nav ul.clearfix > li{
    display: none !important;
  }

  /* показуємо активний крок (Heure/Provider/Client…) */
  #sb-timeline #steps-nav ul.clearfix > li.step_info_item.active{
    display: block !important;
  }

  /* показуємо Service (зазвичай 3-й) */
  #sb-timeline #steps-nav ul.clearfix > li:nth-child(3){
    display: block !important;
  }

  /* =========================
     2) ПРИБИРАЄМО СТРІЛКИ/СЕГМЕНТИ
  ========================== */
  #sb-timeline #steps-nav ul.clearfix > li::before,
  #sb-timeline #steps-nav ul.clearfix > li::after,
  #sb-timeline #steps-nav ul.clearfix > li a::before,
  #sb-timeline #steps-nav ul.clearfix > li a::after{
    display: none !important;
    content: none !important;
  }

  /* =========================
     3) РОБИМО ПЛАШКУ “ГУМОВОЮ” (ЩОБ ТЕКСТ НЕ РІЗАВСЯ)
  ========================== */
  #sb-timeline #steps-nav,
  #sb-timeline #steps-nav ul.clearfix,
  #sb-timeline #steps-nav ul.clearfix > li,
  #sb-timeline #steps-nav ul.clearfix > li a,
  #sb-timeline #steps-nav ul.clearfix > li .content{
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  /* рівні прямі плашки */
  #sb-timeline #steps-nav ul.clearfix > li a{
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  /* =========================
     4) SERVICE: ПОВНИЙ ТЕКСТ (БЕЗ ОБРІЗАННЯ)
  ========================== */
  #sb-timeline #steps-nav ul.clearfix > li:nth-child(3) .content{
    padding: 12px 16px 8px !important;
    text-align: center !important;
  }

  #sb-timeline #steps-nav ul.clearfix > li:nth-child(3) .title{
    display: block !important;
    height: auto !important;
    line-height: 1.2 !important;
    margin: 0 0 4px 0 !important;

    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: .4px !important;
    opacity: .9 !important;
    color: #fff !important;

    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
  }

  #sb-timeline #steps-nav ul.clearfix > li:nth-child(3) .title-sub{
    display: block !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;

    -webkit-line-clamp: unset !important;
    -webkit-box-orient: unset !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    margin: 0 !important;
    color: #fff !important;
  }

  /* =========================
     5) ACTIVE КРОК (Heure/Provider…)
  ========================== */
  #sb-timeline #steps-nav ul.clearfix > li.step_info_item.active .content{
    padding: 12px 16px !important;
    text-align: center !important;
  }

  #sb-timeline #steps-nav ul.clearfix > li.step_info_item.active .title{
    display: block !important;
    height: auto !important;
    line-height: 1.2 !important;

    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;

    font-size: 14px !important;
    font-weight: 600 !important;
  }

  /* =========================
     6) OPУСКАЄМО RETOUR НИЖЧЕ
  ========================== */

  /* простір під фіолетовою плашкою */
  #sb-timeline #steps-nav{
    margin-bottom: 24px !important;
  }

  /* робимо Retour нижче */
  #sb-timeline #sb_back_button{
    margin-top: 16px !important;
    padding-top: 4px !important;
    position: relative !important;
    z-index: 2 !important;
  }
}