/* MDIX Pertanian Prima — audit fixes */

/* Partner carousel only showed the theme seller's "envato" logo five times. */
.tm-sc-clients {
  display: none !important;
}

/* Off-canvas info panel peeked into full-page captures; keep it hidden until opened. */
body:not(.side-panel-open) #side-panel-container {
  visibility: hidden;
}

/* "Hubungi Kami" text sat on a bright corn photo with little contrast. */
section[data-tm-bg-img="mdix-photos/3e9c9202e3.jpg"] {
  position: relative;
}
section[data-tm-bg-img="mdix-photos/3e9c9202e3.jpg"]::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(20, 35, 25, 0.62);
  pointer-events: none;
}
section[data-tm-bg-img="mdix-photos/3e9c9202e3.jpg"] > .container {
  position: relative;
}
section[data-tm-bg-img="mdix-photos/3e9c9202e3.jpg"] p,
section[data-tm-bg-img="mdix-photos/3e9c9202e3.jpg"] .icon-box-title {
  color: #e9efe9 !important;
}

/* White CTA heading on a pale sky photo was hard to read. */
section[data-tm-bg-img="mdix-photos/eb34635dd5.jpg"] {
  position: relative;
}
section[data-tm-bg-img="mdix-photos/eb34635dd5.jpg"]::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(20, 35, 25, 0.5);
  pointer-events: none;
}
section[data-tm-bg-img="mdix-photos/eb34635dd5.jpg"] > .container {
  position: relative;
}

/* Footer link columns are narrow; keep each link on one line. */
.agrool-footer .widget_nav_menu .menu-item a {
  white-space: nowrap;
}

/* A decorative floating object is pushed 300px past the right edge (data-tm-right="-300px"),
   which widened the scrollable page to 1500px; clip it at its section. */
body section {
  overflow-x: clip;
}

/* The dark panel behind the counters used images/bg/fresh-food-bg.png, which is missing (404),
   so the white numbers sat on white. Give the panel a solid dark green instead. */
.fresh-product:before {
  background-color: #28332d;
  background-image: none !important; /* the referenced file does not exist (404) */
}

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

/* Light green (#87c03d) failed AA with white text (2.18:1) on project titles, the vertical phone
   label and the "Lihat Semua Layanan" link. Darker leaf green: 5.1:1 with white. */
:root {
  --theme-color3: #4a7a1c;
  --theme-color3-rgb: 74, 122, 28;
}

/* Theme set Title Case on section titles; wrong for Indonesian sentences. */
.tm-sc-section-title .title-wrapper .title {
  text-transform: none;
}
.tm-sc-section-title .title-wrapper .title::first-letter {
  text-transform: uppercase;
}

/* Service cards all showed "01": the CSS counter had no reset on the grid. */
.row:has(> div > .service-item-current-style1) {
  counter-reset: my-sec-counter;
}

/* Revolution Slider builds its height after load, pushing the page down (CLS 0.34 on desktop).
   Reserve the final slider height (gridheight 900/700/640/600, responsiveLevels 1920/1700/1050/680). */
#home {
  min-height: 900px;
}
@media (max-width: 1699px) {
  #home { min-height: 700px; }
}
@media (max-width: 1049px) {
  #home { min-height: min(640px, calc(100vw * 640 / 778)); }
}
@media (max-width: 679px) {
  #home { min-height: calc(100vw * 1.25); }
}

/* Inner-page banners use a bright rice-terrace photo: keep the white title readable. */
.page-title.divider {
  position: relative;
}
.page-title.divider::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(15, 30, 20, 0.5);
  pointer-events: none;
}
.page-title.divider > .container {
  position: relative;
}

/* Touch targets: footer links were 23px tall, carousel dots 16x20. */
.agrool-footer .widget_nav_menu .menu-item a {
  display: inline-block;
  padding: 3px 0;
  min-height: 28px;
}
.owl-dots .owl-dot {
  min-width: 24px;
  min-height: 24px;
}

/* Phones: the green top bar stacked phone, email, city, icons and CTA (270px) and pushed the
   menu button below the first screen. Keep phone, icons and CTA on two compact rows. */
@media (max-width: 991.98px) {
  header#header .header-top .contact-email,
  header#header .header-top .contact-address {
    display: none !important;
  }
  header#header .header-top {
    padding-top: 6px;
    padding-bottom: 6px;
  }
  header#header .header-top .element {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
  }
  header#header .header-top .header-top-right {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 4px 12px;
  }
  header#header .header-top .header-top-right .element {
    display: inline-block;
    margin: 0;
  }
  header#header .header-top .styled-icons {
    margin: 0;
  }
  header#header .header-top .styled-icons li a {
    min-width: 36px;
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

/* Menu button: theme size was 30x40. */
.menuzord .showhide {
  min-width: 44px;
  min-height: 44px;
}

/* Phone gutters were ~11px; use 16px. */
@media (max-width: 575.98px) {
  .container,
  .container-fluid:not(.p-0) {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* Quantity stepper rendered as a 50px field with 22x27px buttons squeezed to a sliver;
   lay it out as [-][1][+] with 40x44px buttons and readable white signs. */
.quantity {
  display: inline-flex;
  align-items: stretch;
  vertical-align: middle;
}
.quantity .qty {
  order: 2;
  width: 52px;
  height: 44px;
  margin: 0 4px;
  line-height: 44px;
}
.quantity .minus,
.quantity .plus {
  position: static;
  width: 40px;
  height: 44px;
  line-height: 44px;
  font-size: 18px;
  color: #fff;
  border-radius: 2px;
}
.quantity .minus { order: 1; }
.quantity .plus { order: 3; }
.quantity .minus:hover,
.quantity .plus:hover {
  color: #111;
}

/* Landscape phones (390px tall): the top bar + header filled 270px, so the opened menu sat below
   the fold. The top bar's phone/CTA are repeated in the footer and side panel; hide it here. */
@media (max-width: 991.98px) and (max-height: 500px) and (orientation: landscape) {
  header#header .header-top {
    display: none;
  }
}

/* Contrast: the skin hardcodes the light green for text-theme-colored3 links. */
.text-theme-colored3 {
  color: #4a7a1c !important;
}

/* CTA title is a fixed 46px in the theme (3-class selector, no responsive step), so on
   phones the longest word ("Menyediakan") overflowed and split mid-word. Match the theme's
   specificity and scale it down for narrow screens. */
@media (max-width: 575.98px) {
  .mailchimp_subscription .subscribe-block .subscribe-text {
    font-size: 32px;
    line-height: 1.22;
  }
}
@media (max-width: 400px) {
  .mailchimp_subscription .subscribe-block .subscribe-text {
    font-size: 28px;
  }
}
@media (max-width: 360px) {
  .mailchimp_subscription .subscribe-block .subscribe-text {
    font-size: 25px;
  }
}

/* Shop: light grey categories (2.45:1), pale green prices (2.89:1) and grey filter tabs (4.18:1). */
.product .product-details .product-categories a {
  color: #5f6577;
  display: inline-block;
  padding: 2px 0;
}
.product .product-details .price,
.product .product-details .price ins .amount {
  color: #3d6b2e;
}
.product .product-details .price del,
.product .product-details .price del .amount,
.product_list_widget del .amount {
  color: #6f6f6f;
}
.product_list_widget .amount {
  color: #3d6b2e;
}
.isotope-layout-filter.filter-style-4 a:not(.active) {
  color: #4a4a4a;
}
/* Product images: the link wrapping each photo was an inline box only 23px tall. */
.product .thumb > a,
.product-image-slider a.lightgallery-trigger {
  display: block;
}

/* Contact cards: grey text on the light grey card was 4.38:1. */
.bg-white-f1 .icon-text .content,
.bg-white-f1 .icon-text .content a {
  color: #555;
}

/* Small inline links (breadcrumbs, sidebar lists, contact lines, product meta) were 19–23px tall. */
.breadcrumbs a,
.sidebar .widget ul li a,
.bg-white-f1 .icon-text .content a,
.product_meta a,
.product-rating .review-link {
  display: inline-block;
  padding: 3px 0;
  min-height: 24px;
}

/* Cart table on phones squeezed product names into 6-line cells and cut the last columns;
   keep a readable width and let the table scroll sideways inside its own box. */
@media (max-width: 767.98px) {
  .tbl-shopping-cart {
    min-width: 640px;
  }
}

/* Cart/checkout: the product-thumbnail links wrapped their image as an inline box only
   23px tall; make the link wrap the full 38px thumbnail so it is a proper touch target. */
td.product-thumbnail > a {
  display: inline-block;
  line-height: 0;
}
/* Order-review / mini-cart product name links were ~23px tall. */
td.product-name > a,
ul.cart_list li a:not(.remove),
.widget_shopping_cart .cart_list a:not(.remove) {
  display: inline-block;
  min-height: 24px;
  padding: 2px 0;
}

/* Verifikasi ulang akhir 2026-10-13: keterangan data contoh */
.mdix-sample-note { display: block; width: 100%; margin: 16px 0 0; font-size: 13px; line-height: 1.4; font-style: italic; font-weight: 400; letter-spacing: 0; text-transform: none; color: inherit; }
.mdix-sample-note--light { color: #e5e7eb; }

/* Verifikasi ulang akhir 2026-10-13: logo footer terlalu kecil (134x95, teks ±9px) → wordmark baru 560x150 ditampilkan 240px */
.contact-widgets img[src$="footer-logo-1.png"] { width: 240px; max-width: 100%; height: auto; }