/*
Theme Name: Hello Biz Child
Theme URI: https://github.com/elementor/hello-biz-child/
Description: Hello Biz Child is a child theme of Hello Biz, created by Elementor team
Author: Elementor Team
Template: hello-biz
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Version: 1.0.0
Stable tag: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: hello-biz-child
Tags: flexible-header, custom-colors, custom-menu, custom-logo, featured-images, rtl-language-support, threaded-comments, translation-ready, style-variations
*/

/* Add your custom styles here */

/*
#wpadminbar {
	display: none !important;
}
*/


a:hover,
a:focus {
  outline: 0 !important;
}

input:focus,
textarea:focus,
select:focus,
button:focus {
  outline: none !important;
  box-shadow: none !important;
}

.navModal .e-n-tabs-heading button,
.navModal .e-n-tabs-heading a {
  border-bottom: 1px solid #000 !important;
}

.event-meta-item-time {
  padding: 8px 16px;
  border-radius: 50px;
  background: #fff;
}

.doula-active-search-label {
  text-transform: capitalize;
}


.doula-search-container {
  display: flex;
  background: #fff;
  gap: 24px;
  padding: 12px;
}

.doula-search-container input {
  background: transparent !important;
  border: unset !important;
  padding-left: 12px;
}

.doula-search-container button {
  display: flex;
  padding: 12px;
  border-radius: 100%;
  width: 54px;
  justify-content: center;
}

.doula-search-container button img {
  width: 24px;
  height: 24px;
}

.ui-autocomplete {
  display: none !important;
  max-height: 250px;
  overflow-y: auto;
  overflow-x: hidden;
  background: #fff;
  border: 1px solid #ccc;
  list-style: none;
  padding: 0;
  margin: 0;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
  border-radius: 4px;
  z-index: 60;
}

.ui-menu-item {
  padding: 10px 12px;
  border-bottom: 1px solid #eee;
  cursor: pointer;
  color: #333;
}

.ui-menu-item:last-child {
  border-bottom: none;
}

.ui-menu-item.ui-state-active,
.ui-menu-item:hover {
  background-color: #FFEFE4 !important;
  color: #000;
}

.doula-active-search-label {
  display: inline-flex;
  align-items: center;
  color: #000;
  padding: 9px 16px;
  border-radius: 120px;
  border: 1px solid #000;
}

.doula-clear-search-button {
  color: #000;
  text-decoration: none;
  margin-left: 10px;
  font-size: 32px;
  line-height: 1;
  cursor: pointer;
}


/* =================================================================== */
/*  Styles for Custom Events Shortcodes ([monthly_events_list] & [latest_events])
/* =================================================================== */

/* Wrapper for the full list on the events page */
.custom-events-container {
  width: 100%;
}

/* Wrapper for the widget on the homepage */
.latest-events-widget-container {
  width: 100%;
}

/* The "Month Year" heading (e.g., "Srpanj 2025") */
.monthly-event-heading {
  margin-top: 40px;
  margin-bottom: 20px;
  font-size: 2.5rem;
}

/* The main container for a single event row */
.event-item-container {
  display: flex;
  flex-direction: row;
  border-bottom: 1px solid #e0e0e0;
  padding: 24px 0;
  gap: 20px;
}

/* The left column holding the date */
.event-date-column {
  width: 25%;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-right: 20px;
}

/* The right column with all event details */
.event-details-column {
  width: 75%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* The "DD/MM" part of the date */
.event-date-column .day-month {
  color: #de5d5e;
}

/* The "YYYY" part of the date */
.event-date-column .year {
  font-size: 1.1rem;
}

/* The event title */
.event-details-column .title {
  font-size: 1.3rem;
  font-weight: 600;
  margin: 0 0 15px 0;
}

/* Container for meta items like time and theme */
.event-meta-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 20px;
  margin-bottom: 15px;
}

/* A single meta item (icon + text) */
.event-meta-item {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* The clock icon */
.event-meta-item svg {
  width: 20px;
  height: 20px;
}

/* The "Saznaj više" button */
.event-button a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #000;
  text-decoration: none;
  border-bottom: 1px solid #de5d5e;
  padding-bottom: 5px;
  font-weight: 500;
  transition: border-color 0.3s;
}

.event-button a:hover {
  border-color: #de5d5e;
}

.doula-search-button {
  justify-content: center;
}

/* Responsive styles for mobile devices */
@media (max-width: 767px) {
  .event-item-container {
    flex-direction: column;
    gap: 20px;
  }

  .event-date-column,
  .event-details-column {
    width: 100%;
    text-align: left;
  }

  .event-date-column {
    border-bottom: 1px dashed #eee;
    padding-bottom: 15px;
  }
}

/* Courses css */

.courses-template-default h1 {
  font-size: 32px;
  line-height: 36px;
}

.courses-template-default h3 {
  font-size: 18px;
  line-height: 24px;
}

.courses-template-default h2 {
  font-size: 26px;
  line-height: 30px;
}

.courses-template-default h4.tutor-accordion-item-header {
  font-size: 18px;
  line-height: 24px;
}

.courses-template-default .tutor-course-content-list-item-title {
  font-size: 16px;
  line-height: 26px;
}

.tutor-wrap,
#tutor-registration-wrap {
  padding-top: 40px;
  padding-bottom: 80px;
}

button.tutor-iconic-btn.tutor-modal-close-o {
  background: transparent;
  color: black;
}

/* TODO: Fix issue - style applys to all buttons because .tutor-lms class is in body on all pages

.tutor-lms button:not(.tutor-btn-block) {
    background: transparent;
    color: black;
    padding: initial;
}

*/

/* buttons */

.tutor-btn-block {
  width: 100%;
}

.tutor-lms .tutor-btn-primary {
  width: 100%;
  background-color: #DE5D5E;
  font-family: "Outfit", Sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  color: var(--e-global-color-55f3f47);
  border-style: none;
  border-radius: 50px 50px 50px 50px;
  padding: 16px 40px 16px 40px;
}

.tutor-lms .tutor-btn-outline-primary {
  width: 100%;
  background-color: transparent;
  font-family: "Outfit", Sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  color: #000000;
  border-style: none;
  border-radius: 50px 50px 50px 50px;
  padding: 16px 40px 16px 40px;
  border: 1px solid #F58883;
}

.tutor-lms .tutor-btn-outline-primary:hover {
  border: 1px solid #F58883;
  background: #F58883;
}

.acf-contact-icons a {
  display: flex;
}