/* MDIX audit fixes — MDIX Kafe Harmoni */

/* Rupiah prices are wider than "$4.9": shorten the dotted leader so they stay inside the card. */
.kf-menu-item .price {
  padding-left: 110px;
  white-space: nowrap;
}
.kf-menu-item .price:before {
  width: 95px;
}
@media screen and (max-width: 767px) {
  .kf-menu-item .price {
    padding-left: 50px;
    font-size: 18px;
  }
  .kf-menu-item .price:before {
    width: 40px;
  }
}

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

/* Hamburger: 25x50 hit area -> 44x44 (icon stays 25px wide, centred). */
.kf-menu-btn {
  width: 44px;
  height: 44px;
  margin-left: 16px;
  margin-right: -10px;
}
.kf-menu-btn span {
  left: 50%;
  width: 25px;
  margin-left: -12.5px;
}

/* Testimonial dots: 8px dot inside a 24px tap target. */
.kf-testimonials-carousel .swiper-pagination .swiper-pagination-bullet {
  position: relative;
  width: 24px;
  height: 24px;
  margin: 0 2px !important;
  background: transparent;
  opacity: 1;
}
.kf-testimonials-carousel .swiper-pagination .swiper-pagination-bullet:before {
  content: "";
  position: absolute;
  left: 8px;
  top: 8px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
  opacity: 0.75;
}
.kf-testimonials-carousel .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: transparent;
}
.kf-testimonials-carousel .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:before {
  background: #b99272;
  opacity: 1;
}

/* Social icons: real tap targets (top bar, mobile menu, footer). */
.kf-h-social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  margin: 0 2px;
}
.kf-navbar-mobile .kf-h-social a,
.kf-footer .mdix-f-social a {
  width: 44px;
  height: 44px;
  margin: 0 8px 0 0;
  font-size: 18px;
}
.kf-footer .mdix-f-social a {
  border: 1px solid rgba(185, 146, 114, 0.5);
  border-radius: 50%;
  transition: background-color 0.2s, border-color 0.2s;
}
.kf-footer .mdix-f-social a:hover,
.kf-footer .mdix-f-social a:focus-visible {
  background: #b99272;
  border-color: #b99272;
}
.kf-footer .mdix-f-social a:hover i,
.kf-footer .mdix-f-social a:focus-visible i {
  color: #fff;
}

/* Footer: short tagline under the logo (column was empty), clickable email/phone. */
.kf-footer .mdix-f-about {
  margin: 20px 0 18px;
  max-width: 260px;
  color: #ced2d5;
  font-size: 15px;
  line-height: 1.7;
}
.kf-footer .mdix-f-social {
  display: flex;
  text-align: left;
}
.kf-f-contact ul li a {
  color: inherit;
  text-decoration: none;
}
.kf-f-contact ul li a:hover {
  color: #b99272;
}
@media screen and (max-width: 767px) {
  .kf-footer .kf-logo {
    margin-bottom: 0;
  }
  .kf-footer .mdix-f-social {
    margin-bottom: 50px;
  }
}

/* 993-1229px: theme container has no side padding, content touched the screen edge (12px). */
@media screen and (min-width: 993px) and (max-width: 1229px) {
  .container {
    padding: 0 30px;
  }
}

/* Tablet: the third number card was an orphan on the left. */
@media screen and (min-width: 768px) and (max-width: 991px) {
  .kf-numbers-items.row {
    justify-content: center;
  }
}

/* Phones/tablets in landscape: hero was 780px tall on a 390px screen, title below the fold. */
@media screen and (orientation: landscape) and (max-height: 600px) {
  .kf-started-item {
    height: calc(100vh - 90px);
    min-height: 300px;
  }
  .kf-started-item .name {
    margin-bottom: 20px;
    font-size: 48px;
    line-height: 56px;
  }
  .kf-started-item .subtitles {
    margin-bottom: 10px;
  }
}

/* 768-1229px: hero side arrows (47px) sat on top of the hero title; keep the text clear of them. */
@media screen and (min-width: 768px) and (max-width: 1229px) {
  .kf-started-item .container {
    padding-left: 72px;
    padding-right: 72px;
  }
}

/* Mobile menu opened in ~1s (curtain 0.75s + JS delays); now ~0.45s (JS delays shortened in js/common.js). */
.kf-header.animated .kf-navbar-mobile:before {
  -webkit-animation-duration: 0.4s;
  animation-duration: 0.4s;
}
.kf-navbar-mobile:before {
  -webkit-animation-duration: 0.4s;
  animation-duration: 0.4s;
}

/* AA contrast: white button text on #b99272 was 2.83:1. Slightly deeper tan -> 5.2:1 (hover text too). */
a.kf-btn:not(.dark-btn),
.kf-btn:not(.dark-btn),
button.kf-btn:not(.dark-btn),
input[type="submit"]:not(.dark-btn) {
  background-color: #86664c;
}
a.kf-btn:hover,
.kf-btn:hover {
  color: #86664c;
}
/* Ronde 3: .kf-btn-link adalah link teks ("Selengkapnya"), bukan tombol -> tanpa kotak latar
   (sebelumnya ikut aturan di atas: kotak cokelat pudar dengan teks 50% opacity). */
a.kf-btn-link,
.kf-btn-link {
  background: none;
  opacity: 0.75;
}
a.kf-btn-link:hover,
a.kf-btn-link:focus-visible,
.kf-btn-link:hover {
  opacity: 1;
  color: #c9a585;
}
.kf-history-item .label,
.kf-filter a.active,
a.page-numbers.current,
a.post-page-numbers.current,
.page-numbers.current,
.post-page-numbers.current,
a.page-numbers:hover,
a.post-page-numbers:hover,
.page-numbers:hover,
.post-page-numbers:hover,
.tags-links a:hover,
.col__sedebar .tagcloud a:hover {
  background-color: #86664c;
}

/* Touch targets on inner pages (>= 24px): history year tabs, "Selengkapnya" links, blog sidebar,
   blog search button, post category link, reply links, contact e-mail/phone links. */
.kf-history-carousel .swiper-pagination-bullet {
  height: 28px;
  line-height: 28px;
}
a.kf-btn-link,
.content-sidebar .widget ul li a,
.kf-date a,
.comment-reply-link,
.kf-contacts-item .desc ul li a {
  display: inline-block;
  padding-top: 3px;
  padding-bottom: 3px;
  margin-top: -3px;
  margin-bottom: -3px;
}
.wp-block-search__button {
  min-width: 32px;
  min-height: 32px;
}

/* ---- Design QA 2026-10-12, ronde 2 ---- */

/* Menu HP: link menu mewarisi transition 0.7s dari <a> tema, jadi masih "terlihat" 0.7 dtk setelah ditutup
   (Escape/tombol). Hanya warna yang dianimasikan, jadi menu tertutup seketika bersama panelnya. */
.kf-navbar-mobile .kf-main-menu a,
.kf-navbar-mobile .kf-topline a,
.kf-navbar-mobile .kf-h-social a {
  transition-property: color, background-color, border-color;
}
.kf-header:not(.show) .kf-navbar-mobile .kf-main-menu,
.kf-header:not(.show) .kf-navbar-mobile .kf-topline {
  transition-duration: 0.15s;
}

/* Strip logo mitra tema ("FOOD COURT", "RESTAURANT – SLOGAN GOES HERE") adalah placeholder penjual;
   disembunyikan sampai klien punya logo mitra sendiri (section tetap ada di HTML). */
.section.kf-brands {
  display: none;
}

/* Daftar menu makanan (kf-menu-item-2): nama panjang mendorong harga keluar baris -> nama boleh wrap. */
@media screen and (min-width: 768px) {
  .kf-menu-item-2 .name {
    max-width: calc(100% - 125px);
  }
  .kf-menu-item-2 .price {
    white-space: nowrap;
  }
}

/* Link "Balas" di komentar blog: 53x20 -> tinggi 24px (WCAG 2.5.8). */
.comment-reply-link {
  display: inline-block;
  min-height: 24px;
  line-height: 24px;
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0;
}

/* ---- Design QA 2026-10-12, ronde 3 ---- */

/* FAQ di HP: foto float kiri menyisakan kolom teks ±110px (satu-dua kata per baris) ->
   di bawah 576px foto jadi pita penuh di atas jawaban. */
@media screen and (max-width: 575px) {
  .kf-faq-item .collapse-content img.alignleft {
    float: none;
    display: block;
    width: 100%;
    max-width: 100%;
    height: 180px;
    object-fit: cover;
    margin: 0 0 16px 0;
  }
}