/* MDIX Klinik Prima — audit fixes */

/* Carousels with visible overflow widened the page canvas to ~4900px; clip them at the section. */
section.services-carousel,
section.team-layout2,
section.work-process-carousel {
  overflow-x: hidden;
}
@supports (overflow: clip) {
  section.services-carousel,
  section.team-layout2,
  section.work-process-carousel {
    overflow-x: clip;
  }
}

/* Hero photos are full-bleed now (theme JS moves them to the slide background);
   keep the dark headline readable with a light wash on the text side. */
.slider .slide-item.bg-img {
  position: relative;
}
.slider .slide-item.bg-img::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.94) 0%, rgba(255, 255, 255, 0.82) 40%, rgba(255, 255, 255, 0) 70%);
  pointer-events: none;
}
.slider .slide-item.bg-img > .container {
  position: relative;
  z-index: 1;
}
@media (max-width: 767.98px) {
  .slider .slide-item.bg-img::before {
    background: rgba(255, 255, 255, 0.84);
  }
}

/* Keep the emergency number on one line. */
.contact__content a.phone__number,
.contact__content a.phone__number span {
  white-space: nowrap;
  font-size: 18px;
}

/* Theme demo partner logos (blank boxes after rebrand). */
.clients-light {
  display: none !important;
}

/* ---------- Design-QA 2026-10-12 ---------- */

/* Indonesian sentences: no Title Case from the theme (h1–h6, buttons). */
h1, h2, h3, h4, h5, h6, .btn {
  text-transform: none;
}

/* Phone menu button: 44×44 touch target, same three lines (only where the theme shows it). */
@media (max-width: 991.98px) {
.navbar .navbar-toggler {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: -10px;
}
.navbar .navbar-toggler .menu-lines {
  position: relative;
  display: block;
  width: 23px;
  height: 13px;
}
}

/* The about photo reaches into the services section; keep the section subtitle clear of it. */
@media (min-width: 1200px) {
  .about-layout2 + .services-layout1 {
    padding-top: 270px;
  }
}

/* Rupiah prices are longer than the theme's dollar prices: keep them on one line. */
.pricing-package .package__price,
.widget-plan .plan__price {
  font-size: 34px;
  white-space: nowrap;
}
.pricing-package .package__currency {
  font-size: 22px;
  margin-right: 2px;
}

/* Last menu dropdowns open to the left so they stay inside the screen (1024–1199px). */
@media (min-width: 992px) {
  .navbar .navbar-nav > .nav__item:nth-last-child(-n+3) > .dropdown-menu {
    left: auto;
    right: 0;
  }
}

/* Hero feature labels: at least 12px on phones. */
@media (max-width: 575.98px) {
  .slider .features-list .feature-item .feature__title {
    font-size: 12px !important;
  }
}

/* Emergency / schedule / hours bar: three narrow columns clipped the text and phone at 768–1199px. */
@media (min-width: 768px) and (max-width: 1199.98px) {
  .contact-info .contact-box {
    flex-direction: column;
    padding: 30px 22px;
    height: 100%;
  }
  .contact-info .contact-box .contact__icon {
    margin: 0 0 14px;
  }
  .contact-info .contact__content a.phone__number,
  .contact-info .contact__content a.phone__number span {
    font-size: 16px;
  }
  .contact-info .time__list li {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    white-space: nowrap;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .contact-info .contact__content a.phone__number .icon-phone {
    display: none;
  }
}

/* Gallery carousel arrows sat half outside the screen below 1200px. */
@media (max-width: 1199.98px) {
  .gallery .slick-arrow.slick-prev,
  .gallery .slick-arrow.slick-next {
    z-index: 2;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.92);
  }
  .gallery .slick-arrow.slick-prev { left: 8px; }
  .gallery .slick-arrow.slick-next { right: 8px; }
}

/* Carousel dots: 24px hit area, same 10px dot. */
.slick-dots li {
  width: 24px;
  height: 24px;
  margin: 0 1px;
}
.slick-dots li button {
  width: 24px;
  height: 24px;
  background-color: transparent;
  position: relative;
}
.slick-dots li button::after {
  content: "";
  position: absolute;
  top: 7px;
  left: 7px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #213360;
  transition: all 0.2s linear;
}
.slick-dots li.slick-active button {
  box-shadow: none;
}
.slick-dots li.slick-active button::after {
  background-color: #0b7d74;
  box-shadow: 0 0 0 5px rgba(11, 125, 116, 0.18);
}
.carousel-dots-light .slick-dots li button::after {
  background-color: #ffffff;
}

/* Small text links ("Lihat Jadwal Dokter", card arrows): at least 24px tall. */
.btn.btn__link {
  min-height: 24px;
}
.social-icons li a {
  min-width: 32px;
  min-height: 32px;
}
/* Footer links, blog meta links and phone numbers: at least 24px tall. */
.footer .footer-widget-nav li a {
  padding: 3px 0;
}
.post-item .post__meta-cat a,
.post-item .post__meta-author {
  display: inline-block;
  min-width: 26px;
  padding: 6px 0;
}
.post-item .post__meta-cat {
  padding-top: 0;
  padding-bottom: 0;
}
.breadcrumb-item a,
.doctors-timetable .event__header,
.comment__reply,
.accordion__title,
.widget-product__title a,
.post__meta-comments,
.header-topbar .contact__list a {
  display: inline-block;
  min-height: 24px;
  line-height: 24px;
}
.widget__form-search .btn {
  min-width: 44px;
}
.btn__filter,
.price-output input {
  min-height: 24px;
}
a.phone__number {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
}

/* Blog category tags: "Pencegahan, Tips" instead of "Pencegahan ,Tips". */
.post-item .post__meta-cat a {
  padding-right: 0;
}
.post-item .post__meta-cat a:after {
  position: static;
  margin-right: 4px;
}

/* Sidebar emergency number fits on one line. */
.widget-help .phone__number,
.widget-help .phone__number span {
  white-space: nowrap;
}
.widget-help .phone__number {
  font-size: 20px;
}

/* Text signature instead of the seller's "Michael Brian" image. */
.mdix-signature {
  display: flex;
  flex-direction: column;
  line-height: 1.4;
}
.mdix-signature strong {
  color: #213360;
  font-size: 15px;
}
.mdix-signature span {
  color: #0b7d74;
  font-size: 13px;
}

/* Inner page titles: dark heading over a photo needs a light wash on the text side. */
.page-title.bg-overlay:not(.page-title-layout4):not(.page-title-layout5):before {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.85) 45%, rgba(255, 255, 255, 0.15) 75%);
  opacity: 1;
}
@media (max-width: 767.98px) {
  .page-title.bg-overlay:not(.page-title-layout4):not(.page-title-layout5):before {
    background: rgba(255, 255, 255, 0.86);
  }
}

/* WCAG AA: brand teal #21cdc0 is too light behind white text and as text on white.
   Darker teal #0b7d74 (5.0:1) for buttons, badges, teal panels and teal text;
   body grey #848e9f (3.3:1) → #5e6878 (5.6:1). Generated from style.css rules. */
.bg-overlay-primary:before {
  background-color: rgba(11, 125, 116, 0.92);
}
.bg-overlay-primary-gradient:before {
  background-image: linear-gradient(180deg, rgba(11, 125, 116, 0.95) 19%, #0b7d74 71%);
}
body {
  color: #5e6878;
}
body {
  color: #5e6878;
}
::-moz-selection {
  background-color: #0b7d74;
}
::selection {
  background-color: #0b7d74;
}
a {
  color: #0b7d74;
}
.divider-primary {
  background-color: #0b7d74;
}
.color-primary {
  color: #0b7d74 !important;
}
.color-body {
  color: #5e6878 !important;
}
.bg-primary {
  background-color: #0b7d74 !important;
}
.text__link:hover a:not(.btn).color-secondary {
  color: #0b7d74;
}
.pagetitle__subheading {
  color: #0b7d74;
}
.page-title-layout2 .scroll-down {
  color: #0b7d74;
}
.btn__primary {
  background-color: #0b7d74;
}
.btn__primary .icon-outlined {
  color: #0b7d74;
}
.btn__primary .icon-filled {
  background-color: #0b7d74;
}
.btn__primary:active, .btn__primary:focus {
  background-color: #0b7d74;
  border-color: #0b7d74;
}
.btn__primary.btn__outlined {
  color: #0b7d74;
}
.btn__primary.btn__outlined .icon-arrow-right,
.btn__primary.btn__outlined .icon-arrow-left {
  background-color: #0b7d74;
}
.btn__primary.btn__outlined:hover {
  background-color: #0b7d74;
}
.btn__primary.btn__outlined:hover .icon-arrow-right,
.btn__primary.btn__outlined:hover .icon-arrow-left {
  color: #0b7d74;
}
.btn__secondary:before {
  background-color: #0b7d74 !important;
}
.btn__secondary:hover .icon-filled {
  background-color: #0b7d74;
}
.btn__white.btn__outlined:hover {
  color: #0b7d74;
}
.btn__white-style2 {
  color: #0b7d74;
}
.btn__white-style2:before {
  background-color: #0b7d74 !important;
}
.btn__link.btn__primary {
  color: #0b7d74;
}
.btn__link.btn__secondary:hover {
  color: #0b7d74;
}
.label-radio {
  color: #5e6878;
}
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after {
  background-color: #0b7d74;
}
.nice-select .current,
.nice-select .option {
  color: #5e6878;
}
.nav-tabs .nav__link:after {
  background-color: #0b7d74;
}
.nav-tabs .nav__link.active, .nav-tabs .nav__link:hover {
  color: #0b7d74;
}
.social-icons li a:hover {
  background-color: #0b7d74;
}
.social-icons-light li a:hover {
  color: #0b7d74;
}
.social-icons-primary li a {
  color: #0b7d74;
}
.pagination li a:hover,
.pagination li a.current {
  background-color: #0b7d74;
  border-color: #0b7d74;
}
.contact-list li a {
  color: #5e6878;
}
.list-items li:before {
  color: #0b7d74;
}
.list-items-layout2 li {
  color: #5e6878;
}
.list-items-layout2 li:before {
  background-color: #0b7d74;
  border-color: #0b7d74;
}
.list-items-layout4 li {
  color: #5e6878;
}
.list-items-light.list-items-layout2 li:before {
  background-color: #0b7d74;
  border-color: #0b7d74;
}
.alert-primary {
  color: #0b7d74;
}
.slick-arrow:hover {
  color: #0b7d74;
}
.slick-dots li.slick-active button {
  background-color: transparent;
}
.navbar .nav__item .nav__item-link:before {
  background-color: #0b7d74;
}
.navbar .nav__item .nav__item-link.active, .navbar .nav__item .nav__item-link:hover {
  color: #0b7d74;
}
.navbar .dropdown-menu .nav__item .nav__item-link:after {
  background-color: #0b7d74;
}
.navbar .dropdown-menu .nav__item .nav__item-link:hover {
  color: #0b7d74;
}
.lang-dropdown .dropdown-menu .dropdown-item {
  color: #5e6878;
}
.lang-dropdown .dropdown-menu .dropdown-item:focus, .lang-dropdown .dropdown-menu .dropdown-item:hover {
  color: #0b7d74;
}
.header-topbar .social-icons li a {
  background-color: #0b7d74;
}
.is-sticky .nav__item .nav__item-link:before {
  background-color: #0b7d74 !important;
}
.miniPopup-departments-trigger .menu-lines.active {
  color: #0b7d74;
}
.miniPopup-departments-trigger .menu-lines.active:before, .miniPopup-departments-trigger .menu-lines.active:after {
  background-color: #0b7d74;
}
.miniPopup-departments-trigger a:hover {
  color: #0b7d74;
}
.miniPopup-emergency .emergency__icon {
  color: #0b7d74;
}
.search-popup .search-popup__close {
  background-color: #0b7d74;
}
.search-popup .search-popup__btn:hover {
  color: #0b7d74;
}
.search-popup .search-popup__form__input {
  color: #5e6878;
}
.search-popup .search-popup__form__input::-webkit-input-placeholder {
  color: #5e6878;
}
.search-popup .search-popup__form__input:-moz-placeholder {
  color: #5e6878;
}
.search-popup .search-popup__form__input::-moz-placeholder {
  color: #5e6878;
}
.search-popup .search-popup__form__input:-ms-input-placeholder {
  color: #5e6878;
}
.login-popup .go-login,
.login-popup .go-register {
  color: #0b7d74;
}
.login-popup .go-login i,
.login-popup .go-register i {
  color: #0b7d74;
}
.login-popup .go-login:hover i,
.login-popup .go-register:hover i {
  background-color: #0b7d74;
}
@media (max-width: 991px) {
.navbar .nav__item .nav__item-link:hover {
  color: #0b7d74;
}
}
@media (min-width: 992px) {
.navbar .dropdown-menu.mega-dropdown-menu .nav__item .nav__item-link:after {
  color: #0b7d74;
}
}
.accordion-item .accordion__title:hover {
  color: #0b7d74;
}
.accordion-item.opened .accordion__header:not(.collapsed) .accordion__title {
  color: #0b7d74;
}
.accordion-item.opened .accordion__header:not(.collapsed) .accordion__title:after {
  background-color: #0b7d74;
}
.footer .footer-secondary:after {
  background-color: #0b7d74;
}
.footer .footer-widget-contact:after {
  background-color: #0b7d74;
}
.footer .footer-widget-nav li a {
  color: #a3acbb;
}
.footer .footer-widget-nav li a:hover {
  color: #21cdc0;
}
.footer .footer__copyright-links li a {
  color: #5e6878;
}
.footer .footer__copyright-links li a:hover {
  color: #0b7d74;
}
.phone__number:hover {
  color: #0b7d74 !important;
}
#scrollTopBtn {
  background-color: #0b7d74;
}
.cta-banner .cta__icon {
  color: #0b7d74;
}
.slider .cta-banner:before {
  background-color: #0b7d74;
}
.slider .cta-banner .slick-dots li.slick-active:before, .slider .cta-banner .slick-dots li.slick-active:after {
  background-color: #0b7d74;
}
.video__btn .video__player {
  background-color: #0b7d74;
}
.feature-item .feature__icon {
  color: #0b7d74;
}
.feature-item .btn__link .icon-outlined:hover {
  background-color: #0b7d74;
}
.feature-item:hover .feature__icon {
  color: #0b7d74;
}
.features-layout3 .feature-item-custom {
  background-color: #0b7d74;
}
.fancybox-item .fancybox__icon {
  color: #0b7d74;
}
.fancybox-item:hover .fancybox__title {
  color: #0b7d74;
}
.fancybox-layout2 .fancybox-item:hover {
  background-color: #0b7d74;
  border-color: #0b7d74;
}
.member:before {
  background-color: #0b7d74;
}
.member .member__info .member__name a:hover {
  color: #0b7d74;
}
.member .member__info .member__job {
  color: #0b7d74;
}
.member .btn__link.btn__secondary:hover {
  background-color: #0b7d74 !important;
}
.testimonials-layout1 .testimonials-wrapper:before {
  color: #0b7d74;
}
.testimonials-layout2 .testimonial__meta .testimonial__thmb:before,
.testimonials-layout3 .testimonial__meta .testimonial__thmb:before {
  color: #0b7d74;
}
.testimonials-layout3 .testimonial__meta-desc {
  color: #5e6878;
}
.testimonials__rating .total__rate {
  color: #0b7d74;
}
.post-item .post__title a:hover {
  color: #0b7d74;
}
.post-item .post__meta-cat {
  background-color: #0b7d74;
}
.post-item .btn__link.btn__secondary:hover {
  background-color: #0b7d74 !important;
}
.blog-share .social-icons a:hover {
  background-color: #0b7d74;
}
.widget-nav .widget-nav__prev:hover .widget-nav__ttile,
.widget-nav .widget-nav__prev:hover .widget-nav__img:before,
.widget-nav .widget-nav__next:hover .widget-nav__ttile,
.widget-nav .widget-nav__next:hover .widget-nav__img:before {
  color: #0b7d74;
}
.blog-author:after {
  background-color: #0b7d74;
}
.blog-author .social-icons li a:hover {
  color: #0b7d74;
}
.comments-list .comment__item .comment__content .comment__reply {
  color: #0b7d74;
}
.blog-tags ul li a {
  color: #0b7d74;
}
.blog-tags ul li a:before {
  color: #0b7d74;
}
.contact-info .boxes-wrapper > [class*=col-]:nth-of-type(1) .contact-box {
  background-color: #0b7d74;
}
.pricing-package .package__title {
  color: #0b7d74;
}
.pricing-widget-layout1 .pricing__list li .price {
  background-color: #0b7d74;
}
.widget:after {
  background-color: #0b7d74;
}
.widget-search .widget__form-search .btn {
  color: #0b7d74;
}
.widget-categories ul li a:hover {
  color: #0b7d74;
}
.widget-categories ul li a .cat-count {
  color: #0b7d74;
}
.widget-services ul li a:hover {
  background-color: #0b7d74;
}
.widget-tags ul li a {
  color: #0b7d74;
}
.widget-tags ul li a:hover {
  background-color: #0b7d74;
  border-color: #0b7d74;
}
.widget-post-item:hover .widget-post__title a {
  color: #0b7d74;
}
.widget-poducts .widget-product-item:hover .widget-product__title a {
  color: #0b7d74;
}
.widget-poducts .widget-product-item .widget-product__price {
  color: #0b7d74;
}
.widget-reports .btn__primary:hover i {
  background-color: #0b7d74;
}
.widget-filter .ui-slider-range {
  background-color: #0b7d74;
}
.widget-filter label {
  color: #5e6878;
}
.widget-filter input {
  color: #0b7d74;
}
.ui-slider-horizontal .ui-slider-handle {
  background-color: #0b7d74;
}
.about-layout2 .text-with-icon .text__icon {
  color: #0b7d74;
}
.about-layout3 .text__icon {
  color: #0b7d74;
}
.about-layout5 .tooltip-box .tooltip__icon {
  background-color: #0b7d74;
}
.service-item .btn:hover {
  background-color: #0b7d74;
  border-color: #0b7d74;
}
.service-item:hover:before {
  background-color: #0b7d74;
}
.doctors-timetable th {
  color: #5e6878;
}
.timeline-item:before {
  background-color: #0b7d74;
}
.product__title a:hover {
  color: #0b7d74;
}
.product__price {
  color: #0b7d74;
}
.product-item-single .product__rating i.active {
  color: #0b7d74;
}
.product__meta-review a {
  color: #5e6878;
}
.product__meta-review a:hover {
  color: #0b7d74;
}
.cart-table .cart-product__price,
.cart-table .cart-product__total {
  color: #5e6878;
}
.cart-table .cart-product__remove:hover {
  background-color: #0b7d74;
}
.process-item:before {
  background-color: #0b7d74;
}
.process-item:hover .process__icon {
  color: #0b7d74;
}
.progress-bar {
  background-color: #0b7d74;
}
.progress__percentage {
  color: #5e6878;
}

/* Light variants for dark sections, restored after the colour overrides above. */
.heading-light .heading__subtitle {
  color: #f9f9f9;
}
.heading-light .heading__subtitle:after {
  background-color: #ffffff;
}
.heading-light .heading__title,
.heading-light .heading__desc {
  color: #ffffff;
}
.social-icons-light li a {
  color: #ffffff;
}
.social-icons-light li a:hover {
  color: #21cdc0;
}
.list-items-light li {
  color: #ffffff;
}
.list-items-light li:before {
  color: #ffffff;
}
.list-items-light.list-items-layout2 li:before {
  color: #ffffff;
  background-color: #0b7d74;
}
.carousel-arrows-light .slick-arrow {
  color: rgba(255, 255, 255, 0.8);
}
.carousel-arrows-light .slick-arrow:hover {
  color: #ffffff;
}
.banner-layout1 .list-items-light.list-items-layout2 li:before,
.banner-layout2 .list-items-light.list-items-layout2 li:before {
  color: #213360;
  background-color: #ffffff;
}
.fancybox-light .fancybox-item .fancybox__icon,
.fancybox-light .fancybox-item .fancybox__title,
.fancybox-light .fancybox-item:hover .fancybox__title {
  color: #ffffff;
}
.contact-layout5 .list-items-light.list-items-layout2 li:before {
  color: #213360;
  background-color: #ffffff;
}

/* Text-only buttons stay transparent (the darker-teal fill above must not reach them). */
.btn__primary.btn__link,
.btn__secondary.btn__link,
.btn__white.btn__link {
  background-color: transparent;
}
.color-body {
  color: #5e6878 !important;
}

/* Teal text on dark (navy / dark-teal) sections stays the bright brand teal. */
.bg-overlay-secondary .color-primary,
.bg-overlay-secondary .heading__subtitle,
.bg-secondary .color-primary,
.footer .footer-widget-about .btn__primary.btn__link,
.footer .footer-widget-about .btn__primary-style2 {
  color: #21cdc0 !important;
}

/* ---------- Design-QA 2026-10-12, round 2 (re-audit) ---------- */

/* Slick arrows: the hidden "Previous"/"Next" label is removed in main.js (aria-label kept). */

/* Links that wrap only an image measured 16px tall (inline box): make them block-level. */
.post__img a,
.widget-post__img a,
.widget-product__img a,
.widget-nav__img a {
  display: block;
}

/* Sidebar search button: 19px wide hit area → 44px. */
.widget-search .widget__form-search .btn {
  min-width: 44px;
  width: 44px;
  right: 8px;
  text-align: center;
}

/* Contact panel list, product review link, product tabs: 24px touch targets. */
.contact-panel__info .contact__list li a,
.product__meta-review a {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
}
.nav-tabs .nav__link {
  min-height: 24px;
  padding-top: 2px;
}

/* Centered page titles (layouts 2, 4, 5) put dark text over the photo: uniform light wash. */
.page-title-layout2.bg-overlay:before,
.page-title-layout4.bg-overlay:before,
.page-title-layout5.bg-overlay:before {
  opacity: 1;
  background: rgba(255, 255, 255, 0.82);
}

/* Feature cards: equal height per row (titles wrap to 1 or 2 lines). */
@media (min-width: 768px) {
  .features-layout2 .feature-item {
    height: calc(100% - 30px);
  }
}

/* Hero feature icons on phones: four per row instead of 3 + 1. */
@media (max-width: 575.98px) {
  .slider .features-list .feature-item {
    flex: 0 0 25%;
    max-width: 25%;
    margin-right: 0;
    padding: 0 3px;
  }
  .slider .features-list .feature-item .feature__title {
    white-space: normal;
    line-height: 1.3;
  }
}

/* round 2b */
/* Blog image links keep a height before the lazy image loads (24px target); department card photos share one ratio. */
.post__img a {
  min-height: 120px;
}
.services-layout2 .service-item .service__img img {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}
/* Breadcrumb links measured 23.6px. */
.breadcrumb-item a {
  min-height: 26px;
  line-height: 26px;
}
/* Hero feature icons: 2 x 2 under 390px ("Pemeriksaan" split mid-word at 25%). */
@media (max-width: 389.98px) {
  .slider .features-list .feature-item {
    flex: 0 0 50%;
    max-width: 50%;
  }
}
.slider .features-list .feature-item .feature__title {
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}
/* Short breadcrumb words ("Blog") measured 23.6px wide. */
.breadcrumb-item a {
  min-width: 26px;
}

/* Verifikasi ulang akhir 2026-10-13: logo di header HP hanya 120x32 (teks ±10px) → 160px. */
@media (max-width: 991px) { .navbar .navbar-brand img.logo-dark, .navbar-brand .logo-dark { width: 160px; max-width: 160px; height: auto; } }