/**
 * Theme Name: mediKon
 * Template:   dentia
 */

:root {
  --primary-color: #7f2534;
  --primary-color-transparent: #7f2534bb;
  --secondary-color: #f7dee2;
  --light-bg: #faf6ed;
  --light-bg-transparent: #faf6edbf;
  --active-color: #5f1c27;
  --text: #2F2F23;
  --text-inverse: #fff;
  --shadow: #2F2F2377;
}

.mobile-heading { 
  display: none;
}
.main-page-services,
.services-aggregate {
  align-items: stretch;
  height: 500px;
}
.main-page-services > div,
.main-page-services .elementor-element,
.main-page-services .pxl-icon-box,
.main-page-services .pxl-item-inner,
.services-aggregate > div,
.services-aggregate .elementor-element,
.services-aggregate .pxl-icon-box,
.services-aggregate .pxl-item-inner {
  height: 100%;
}

.no-shadow .elementor-widget-container {
  box-shadow: none !important;
}

.text-right a {
  justify-content: flex-end;
}
.text-right div {
  text-align: right;
}

.white,
.white a:link,
.white a:visited {
  color: white !important;
}

.main-page-header-text-bg {
  position: relative;
}
.main-page-header-text-bg::before {
  content: '';
  display: block;
  width: 100%;
  height: 400px;
  position: absolute;
  background: var(--primary-color);
  border-radius: 20px;
  left: auto;
  right: 0;
  top: auto;
  bottom: 0;
  margin-bottom: -163px;
  margin-right: -50%;
  opacity: .8;
}

/* Zmniejszyć rozwlekłe domyślne tytuły stron */
#pxl-page-title-default {
  padding: 120px 0 50px 0 !important;
}

@media screen and (max-width: 767px) {
  #pxl-page-title-default {
    padding: 40px 0 !important;
  }
}

/* Pozycja KARDIOLOGIA w menu głównym */
#menu-item-3710 {
  position: relative;
  padding: 0 20px;
}
#menu-item-3710 > a,
#menu-item-3710 > a > span {
  color: var(--text-inverse) !important;
}
#menu-item-3710:before {
  position: absolute;
  content: '';
  display: block;
  width: 112%;
  height: 50%;
  margin-top: 20%;
  margin-left: -19%;
  background: var(--primary-color);
  border-radius: 8px;
  opacity: .9;
}
.smaller #menu-item-3710:before {
  margin-top: 17%;
}
#menu-menu-glowne-gora-strony i.pxl-hide {
  display: none;
}

/* Godziny otwarcia */
.opening-hours .pxl-meta-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* OFERTA - kafelki z linkiem */
.offer-tile a:link,
.offer-tile a:visited {
  text-decoration: none;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}
.offer-tile a:hover {
  transform: scale(1.05);
  box-shadow: 0 5px 5px rgba(0, 0, 0, 0.15);
}

.offer-tile .elementor-widget-image {
  flex: 0 0 70px;
}
.offer-tile .elementor-widget-heading {
  flex: 0 0 1em;
}
.offer-tile h4 {
  margin-bottom: 10px;
}

.offer-tile img {
  width: 70px;
  height: 70px;
  margin-bottom: 50px;
}

.offer-tile-more-button {
  border: 1px solid var(--primary-color);
  flex: 0 0 1em;
  padding: 2px 30px 4px 25px;
  width: fit-content;
  margin: auto;
}
.offer-tile-more-button p {
  margin: 0 auto;
}

/* TOOLTIP GODZIN OTWARCIA */
.opening-hours-container, .opening-hours-cardio-container {
  position: relative;
  cursor: pointer;
}
.opening-hours-container .opening-hours-tooltip, .opening-hours-cardio-container .opening-hours-tooltip {
  visibility: hidden;
  width: auto;
  background-color: var(--light-bg);
  color: var(--text);
  text-align: center;
  border-radius: 8px;
  padding: 10px;
  position: absolute;
  z-index: 1;
  font-size: 12px;
  bottom: 90%; 
  left: 50%;
  margin-left: -20%;
  opacity: 0;
  transform: scale(0);
  transform-origin: bottom center;
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.opening-hours-container .opening-hours-tooltip::after,
.opening-hours-cardio-container .opening-hours-tooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -8px;
  border-width: 8px;
  border-style: solid;
  border-color: var(--light-bg) transparent transparent transparent;
}

.opening-hours-container:hover .opening-hours-tooltip,
.opening-hours-cardio-container:hover .opening-hours-tooltip {
  visibility: visible;
  opacity: 1;
  transform: scale(1);
}


/* STRONA OFERTY - obrazki - dopasowanie proporcji */
.wp-singular .type-service .pxl-image-single .pxl-item--inner .bg-image {
  bottom: 1px;
  width: 553px;
  height: 369px;
  border-radius: 20px;
}
.wp-singular .type-service .vertical .pxl-image-single .pxl-item--inner .bg-image {
  width: 330px;
  height: 420px;
  margin: auto;
}

/* PROTETYKA */
.protetyka-grid .pxl-grid .pxl-grid-inner div:nth-child(8) > div {
  background: url('https://stomatologia.elso.pl/wp-content/uploads/korona_porcelanowa_schemat.webp') no-repeat center center;
  background-size: cover;
  height: 240px;
}
/* ZACHOWAWCZA */
.zachowawcza-grid .pxl-grid .pxl-grid-inner div:nth-child(3) > div {
  background: url('https://stomatologia.elso.pl/wp-content/uploads/gabinet01.jpg') no-repeat center center;
  background-size: cover;
  height: 240px;
}
.zachowawcza-grid .pxl-grid .pxl-grid-inner div:nth-child(7) > div {
  background: url('https://medikon.pila.pl/wp-content/uploads/stomatologia-glowne.jpg') no-repeat center center;
  background-size: cover;
  height: 240px;
}
/* DIAGNOSTYKA */
.diagnostyka-grid .pxl-grid .pxl-grid-inner div:nth-child(4) > div {
  background: url('https://stomatologia.elso.pl/wp-content/uploads/sprzet03.jpg') no-repeat center center;
  background-size: cover;
  height: 600px;
}
.diagnostyka-grid .pxl-grid .pxl-grid-inner div:nth-child(6) > div {
  background: url('https://stomatologia.elso.pl/wp-content/uploads/sprzet05.jpg') no-repeat center center;
  background-size: cover;
  height: 600px;
}
/* PERDIODONTOLOGIA */
.periodontologia-grid .pxl-grid .pxl-grid-inner div:nth-child(5) > div {
  background: url('https://stomatologia.elso.pl/wp-content/uploads/Periodontologia-2.jpg') no-repeat center center;
  background-size: cover;
  height: 240px;
}
.periodontologia-grid .pxl-grid .pxl-grid-inner div:nth-child(15) > div {
  background: url('https://stomatologia.elso.pl/wp-content/uploads/Periodontologia-3.jpg') no-repeat center center;
  background-size: cover;
  height: 240px;
}
/* ENDODONCJA */
.endodoncja-grid .pxl-grid .pxl-grid-inner div:nth-child(6) > div {
  background: url('https://stomatologia.elso.pl/wp-content/uploads/sprzet01.jpg') no-repeat center center;
  background-size: cover;
  height: 500px;
}
/* CHIRURGIA */
.chirurgia-grid .pxl-grid .pxl-grid-inner div:nth-child(12) > div {
  background: url('https://stomatologia.elso.pl/wp-content/uploads/chirurgia-stomatologiczna-2.jpg') no-repeat center center;
  background-size: cover;
  height: 240px;
}

/* reset obrazków, żeby pokazywały się w całości */
.image-reset .pxl-item--inner .pxl-item--bg.bg-image {
  bottom: 0 !important;
}

/* ZESPÓŁ */
#zespol-photo {
  position: relative;
}
#zespol-photo > div[data-element_type="container"] {
  position: absolute;
  top: 0;
  left: 0;
}
/* kółko */
#zespol-photo > div[data-element_type="container"] > .trigger {
  display: block;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--primary-color);
  border: 4px solid var(--light-bg);
  cursor: pointer;
  position: absolute;
  z-index: 100;
  transform: translate(-115px, 80px);
}
#zespol-photo > div[data-element_type="container"] > .trigger:hover + .elementor-widget-text-editor {
  opacity: 1;
  display: block;
}

#zespol-photo .elementor-widget-text-editor {
  opacity: 0;
  display: none;
  transition: all 0.3s ease-in-out;
  animation-delay: 0.1s;
  height: 100px;
  width: 300px;
  background: var(--primary-color);
  padding: 6px 20px 0 0;
  pointer-events: none;
}
#zespol-photo .elementor-widget-text-editor h4,
#zespol-photo .elementor-widget-text-editor p {
  color: var(--text-inverse);
  text-align: right;
  margin-bottom: 10px;
  line-height: 20px;
}
#zespol-photo .elementor-widget-text-editor h4 {
  line-height: 35px;
}
/* trójkąt */
#zespol-photo .elementor-widget-text-editor::before {
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-bottom: 100px solid var(--primary-color);
  border-left: 100px solid transparent;
  transform: translate(-100px, -6px);
}

#anna-konarska {
  transform: translate(615px, 160px);
}
#wiktoria-kujawa {
  transform: translate(475px, 230px);
}
#magdalena-karnowska {
  transform: translate(355px, 130px);
}
#joanna-salitra {
  transform: translate(430px, 20px);
}
#beniamin-mochocki {
  transform: translate(395px, -25px);
}

#joanna-salitra p,
#beniamin-mochocki p {
  padding-top: 5px;
}

/* Ramka */
.border .pxl-item--bg {
  border: 1px solid var(--primary-color);
}

/* ------------------------ */
/* Tryb mobilny             */
/* ------------------------ */

@media screen and (max-width: 767px) {
  .main-page-header-text-bg,
  .main-page-header-heading,
  .main-page-header-heading h1,
  .main-page-header-heading span {
    visibility: hidden !important;
  }
  .mobile-heading {
    display: block;
  }
  .main-page-icons-bar .e-con-inner {
    padding: 0;
  }
  .main-page-icons-bar .pxl-item-inner {
    align-items: center;
    text-align: center;
  }

  .elementor-element .pxl-button.pxl-atc-link {
    text-align: center !important;
  }

  /* OFERTA */
  .services-grid {
    padding-top: 0;
  }
  .services-grid, .services-grid > div {
    display: block;
  }
  .services-grid .services-aggregate > div {
    margin-bottom: 30px;
  }
  .services-grid .services-aggregate > div > a {
    display: block;
    height: unset;
  }
  .services-grid .services-aggregate,
  .services-grid .services-aggregate > div > a .elementor-widget-image,
  .services-grid .services-aggregate > div > a .elementor-widget-heading,
  .services-grid .services-aggregate > div > a .elementor-widget-text-editor,
  .services-grid .offer-tile {
    height: unset;
  }
  .services-grid .services-aggregate > div > a .elementor-widget-heading h4 {
    text-align: center;
  }
  .services-grid .services-aggregate .offer-tile img {
    margin-bottom: 10px;
  }
  .services-grid .services-aggregate > div > a .elementor-widget-text-editor {
    margin: 30px auto 0;
  }
  
  /* ZESPÓŁ */
  #zespol-photo .trigger, #zespol-photo .elementor-widget-text-editor::before { display: none; }
  #zespol-photo > div[data-element_type="container"] { position: static; transform: none !important; }
  #zespol-photo .elementor-widget-text-editor { opacity: 1; display: block; width: 100%; padding: 5px; margin: 5px auto; border-radius: 20px; }
  #zespol-photo .elementor-widget-text-editor h4, #zespol-photo .elementor-widget-text-editor p { text-align: center; }
  #anna-konarska { margin-top: 10px; }
}

/* ----------------------- */
/* ELEMENTOR - overrides   */
/* ----------------------- */

/* main button text on hover + secondary button text on hover (used to slide down) */
.btn.btn-default:hover .pxl--btn-text1, .btn.btn-default:focus .pxl--btn-text1, .btn.btn-default:active .pxl--btn-text1, .btn.btn-default:not([disabled]):not(.disabled).active .pxl--btn-text1, .btn.btn-default:not([disabled]):not(.disabled):active .pxl--btn-text1 {
  transform: none !important;
}
.btn.btn-default .pxl--btn-text2 {
  display: none;
}
/* button hover */
.btn.btn-default:hover, .btn.btn-default:focus, .btn.btn-default:active, .btn.btn-default:not([disabled]):not(.disabled).active, .btn.btn-default:not([disabled]):not(.disabled):active {
  background: var(--primary-color-transparent) !important;
  box-shadow: 0 0 10px var(--shadow) !important;
  transform: scale(110%) !important;
}
/* hidden panel background */
#pxl-hidden-panel-popup .pxl-item--conent {
  background: var(--light-bg-transparent) !important;
}
#pxl-hidden-panel-popup .pxl-close {
  color: var(--primary-color) !important;
}
#pxl-hidden-panel-popup .pxl-close:before, #pxl-hidden-panel-popup .pxl-close:after {
  background: var(--primary-color) !important;
}
/* pojedyncza oferta - tabelka z klockami - rozszerzenie klocków w pionie */
.type-service .pxl-grid .pxl-grid-inner .pxl-grid-item {
  position: static !important;
}
/* zespół - tło */
.pxl-banner-box .pxl-banner-inner {
  background-color: var(--light-bg-transparent) !important;
}

/* galeria */
.galeria .pxl-grid-filter.style-1 .filter-item {
  padding-bottom: 9px;
  color: var(--primary-color-transparent);
}
