/*
Theme Name: Production Factory Child
Description: Datang brand layer on top of Production Factory. Overrides the header, banner and footer patterns with real company data; keeps the demo look.
Author: Datang
Template: production-factory
Version: 1.0.2
Requires at least: 6.0
License: GNU General Public License v3 or later
Text Domain: production-factory-child
*/

/* Contact page helpers, matched to the theme palette */
.pf-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.pf-contact-card {
  background: #fff;
  border: 1px solid #e6e9ef;
  border-top: 4px solid var(--wp--preset--color--secaccent);
  padding: 30px 30px 26px;
  box-shadow: 0 10px 26px rgba(27,38,59,.07);
}
.pf-contact-card h2 { margin: 0 0 16px; font-size: 22px; }
.pf-contact-card p { margin: 0 0 12px; line-height: 1.7; }
.pf-contact-card i { color: var(--wp--preset--color--secaccent); width: 20px; }
.pf-contact-card a { color: var(--wp--preset--color--accent); text-decoration: none; font-weight: 600; }
.pf-contact-card a:hover { text-decoration: underline; }
.pf-contact-lead { font-size: 18px; line-height: 1.75; color: #46536b; }
.pf-accent-band {
  background: var(--wp--preset--color--secaccent);
  padding: 34px 38px;
  margin: 40px 0 0;
}
.pf-accent-band h2 { margin: 0 0 10px; }
.pf-accent-band p { margin: 0; }
@media (max-width: 860px) { .pf-contact-grid { grid-template-columns: 1fr; } }

/* Theme sets break-all on footer copy — that splits words mid-word */
.footer-box p,
.footer-box a,
.footer-box li { word-break: normal !important; overflow-wrap: break-word; }

/* ---------- Inner page components (match the Contact page) ---------- */
.wp-block-image img { max-width: 100%; height: auto; }
.pf-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.pf-card2 {
  background: #fff; border: 1px solid #e6e9ef; border-top: 4px solid var(--wp--preset--color--secaccent);
  box-shadow: 0 10px 26px rgba(27,38,59,.07); display: flex; flex-direction: column;
}
.pf-card2 img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.pf-card2__body { padding: 22px 24px 24px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
.pf-card2 h3 { margin: 0; font-size: 19px; line-height: 1.3; }
.pf-card2 h3 a { color: #1B263B; text-decoration: none; }
.pf-points { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.pf-points li { position: relative; padding-left: 20px; font-size: 14.5px; color: #4b576b; line-height: 1.5; }
.pf-points li:before { content: ""; position: absolute; left: 0; top: .55em; width: 8px; height: 8px; background: var(--wp--preset--color--secaccent); }
.pf-actions { margin-top: auto; display: flex; gap: 10px; flex-wrap: wrap; }
.pf-btn2 { display: inline-block; padding: 10px 18px; border: 1px solid #1B263B; color: #1B263B; text-decoration: none; font-weight: 700; font-size: 14px; }
.pf-btn2:hover { background: #1B263B; color: #fff; }
.pf-btn2--solid { background: #1B263B; color: #fff; }
.pf-btn2--solid:hover { background: var(--wp--preset--color--secaccent); border-color: var(--wp--preset--color--secaccent); color: #1B263B; }

.pf-spec { max-width: 100%; overflow-x: auto; }
.pf-spec table { width: 100%; border-collapse: collapse; font-size: 15px; }
.pf-spec th, .pf-spec td { border: 1px solid #e6e9ef; padding: 11px 14px; text-align: left; vertical-align: top; }
.pf-spec th { background: #f6f8fb; font-weight: 700; color: #1B263B; }

/* Product galleries on the seven fin tube detail pages */
.wp-block-gallery.pf-gallery { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 18px; }
.wp-block-gallery.pf-gallery .wp-block-image { width: 100% !important; margin: 0; }
.wp-block-gallery.pf-gallery img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; display: block; border: 1px solid #e6e9ef; }
@media (max-width: 1000px) { .wp-block-gallery.pf-gallery { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 640px) { .wp-block-gallery.pf-gallery { grid-template-columns: 1fr !important; } }

/* galleries that ended up with one or two images: keep the tiles a sensible
   size and centre them instead of leaving empty grid columns */
@media (min-width: 641px) {
  .wp-block-gallery.pf-gallery:has(> :only-child) { grid-template-columns: minmax(0, 480px) !important; justify-content: center; }
  .wp-block-gallery.pf-gallery:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 400px)) !important; justify-content: center; }
}

/* Quality-control photo strip (4:3 crop so the three images line up) */
.wp-block-gallery.pf-qc-grid { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 18px; }
.wp-block-gallery.pf-qc-grid .wp-block-image { width: 100% !important; margin: 0; }
.wp-block-gallery.pf-qc-grid img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; display: block; border: 1px solid #e6e9ef; }
@media (max-width: 1000px) { .wp-block-gallery.pf-qc-grid { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 640px) { .wp-block-gallery.pf-qc-grid { grid-template-columns: 1fr !important; } }

/* Certification logo row */
.pf-cert-row { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 22px; margin: 6px 0 30px; }
.pf-cert-row img { height: 40px; width: auto; display: block; }
@media (max-width: 640px) { .pf-cert-row img { height: 34px; } }

/* Project case pages: two project photos per case */
.wp-block-gallery.pf-case-grid { display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 18px; }
.wp-block-gallery.pf-case-grid .wp-block-image { width: 100% !important; margin: 0; }
.wp-block-gallery.pf-case-grid img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; display: block; border: 1px solid #e6e9ef; }
@media (max-width: 640px) { .wp-block-gallery.pf-case-grid { grid-template-columns: 1fr !important; } }

/* Application pages: one hero photo, capped at its source width so it stays sharp */
.wp-block-image.pf-app-hero img { width: 100%; max-width: 720px; height: auto; display: block; margin: 0 auto; }

/* Customer visit photos on the reviews page */
.pf-customer-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 26px 0 6px; }
.pf-customer-row figure { margin: 0; }
.pf-customer-row img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; display: block; border: 1px solid #e6e9ef; }
.pf-customer-row figcaption { font-size: 12px; color: #4b576b; line-height: 1.35; margin-top: 6px; }
@media (max-width: 1000px) { .pf-customer-row { grid-template-columns: repeat(2, 1fr); } }

/* Contact page factory photo */
.wp-block-image.pf-contact-photo img { width: 100%; max-width: 900px; height: auto; display: block; margin: 0 auto; border: 1px solid #e6e9ef; }

/* Technical illustrations and in-article photos */
.wp-block-image.pf-diagram img { width: 100%; max-width: 900px; height: auto; display: block; margin: 0 auto; border: 1px solid #e6e9ef; }
.wp-block-image.pf-diagram figcaption { text-align: center; font-size: 13px; color: #4b576b; margin-top: 10px; }
.wp-block-image.pf-inline-photo img { width: 100%; max-width: 700px; height: auto; display: block; margin: 0 auto; }

/* photos whose source file is only 450px wide: cap the display size instead of
   letting the theme stretch them to 1099px (~2.4x upscale, visibly soft) */
/* featured images are never stretched past 700px (the theme otherwise renders
   them at 1099px, which blurs any source smaller than that) */
.wp-block-post-featured-image img {
  width: 100%; max-width: min(700px, 100%); height: auto; display: block; margin-left: auto; margin-right: auto;
}

.pf-linkcards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.pf-linkcard { border-left: 4px solid var(--wp--preset--color--secaccent); background: #f8fafc; padding: 22px 24px; }
.pf-linkcard h3 { margin: 0 0 8px; font-size: 17px; }
.pf-linkcard h3 a { color: #1B263B; text-decoration: none; }
.pf-linkcard p { margin: 0; font-size: 14.5px; color: #4b576b; }

@media (max-width: 1000px) {
  .pf-grid, .pf-linkcards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .pf-grid, .pf-linkcards { grid-template-columns: 1fr; }
}

/* Header nav: 7 top-level items — keep them on one line */
.header-box-upper .header-logo { flex-basis: 22% !important; }
.header-box-upper .header-inner-menu { flex-basis: 78% !important; }
.header-box-upper .wp-block-navigation__container { gap: 0 !important; }
.header-box-upper .wp-block-navigation .wp-block-navigation-item__content {
  padding-left: 9px !important; padding-right: 9px !important; font-size: 16px !important;
}
@media (max-width: 1200px) {
  .header-box-upper .wp-block-navigation .wp-block-navigation-item__content { font-size: 16px !important; padding-left: 5px !important; padding-right: 5px !important; }
}

/* tighter top nav so all seven items stay on one row */
.header-box-upper .wp-block-navigation { max-width: 100%; }
.header-box-upper .wp-block-navigation .wp-block-navigation-item__content {
  padding-left: 6px !important; padding-right: 6px !important; font-size: 16px !important;
}
.header-box-upper .wp-block-navigation__submenu-icon { margin-left: 2px; }

/* final nav tuning */
.header-box-upper .header-logo { flex-basis: 18% !important; }
.header-box-upper .header-inner-menu { flex-basis: 82% !important; }
.header-box-upper .wp-block-navigation .wp-block-navigation-item__content {
  padding-left: 5px !important; padding-right: 5px !important; font-size: 16px !important; white-space: nowrap;
}

/* header graphic logo (replaces the site title text) */
.header-box-upper .wp-block-site-logo a { display: block; line-height: 0; }
.header-box-upper .wp-block-site-logo img { height: 56px; width: auto !important; display: block; }

/* keep the logo clear of the menu on wide screens */
.header-box-upper .header-logo { flex-basis: 21% !important; min-width: 0; }
.header-box-upper .header-inner-menu { flex-basis: 79% !important; }

/* mid widths (1000–1399px): the parent theme already wants 14px links here and
   the 16px override crowds the 7 items into the yellow logo block; restore the
   tighter size and trim the 14px link padding so nothing sits under the logo. */
@media (min-width: 1000px) and (max-width: 1399px) {
  .header-inner-menu .wp-block-navigation__container .wp-block-navigation-item > a {
    font-size: 14px !important; padding-left: 8px !important; padding-right: 8px !important;
  }
}

@media (min-width: 1000px) and (max-width: 1199px) {
  .header-box-upper .wp-block-site-logo img { height: 50px; }
  .header-box-upper .header-logo { flex-basis: 18% !important; padding-left: 0 !important; }
  .header-box-upper .header-inner-menu { flex-basis: 82% !important; }
}

@media (max-width: 1023px) {
  .header-box-upper .wp-block-site-logo img { height: 48px; }
}
@media (max-width: 480px) {
  .header-box-upper .wp-block-site-logo img { height: 40px; }
}

/* never wrap the top menu */
.header-box-upper .wp-block-navigation__container,
.header-box-upper .wp-block-navigation__responsive-container-content > ul {
  flex-wrap: nowrap !important;
}

/* ---------- RFQ form ---------- */
.pf-rfq-form {
  background: #fff; border: 1px solid #e6e9ef; border-top: 4px solid var(--wp--preset--color--secaccent);
  padding: 32px 34px 30px; box-shadow: 0 10px 26px rgba(27,38,59,.07); margin: 8px 0 34px;
}
.pf-rfq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 22px; }
.pf-rfq-form label { display: block; font-size: 14px; font-weight: 600; color: #1B263B; }
.pf-rfq-form label span { color: #d94a3d; }
.pf-rfq-form input[type="text"],
.pf-rfq-form input[type="email"],
.pf-rfq-form select,
.pf-rfq-form textarea {
  width: 100%; margin-top: 6px; padding: 11px 13px; border: 1px solid #d7dde7;
  font-size: 15px; color: #1B263B; background: #fff; border-radius: 0;
}
.pf-rfq-form input:focus, .pf-rfq-form select:focus, .pf-rfq-form textarea:focus {
  outline: none; border-color: var(--wp--preset--color--secaccent);
}
.pf-rfq-full { display: block; margin-top: 18px; }
.pf-rfq-submit { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin: 22px 0 0; }
.pf-rfq-form button.pf-btn2 { cursor: pointer; font-size: 15px; padding: 13px 30px; }
.pf-rfq-alt { font-size: 14px; color: #4b576b; }
.pf-rfq-alt a { color: #1B263B; font-weight: 600; }
.pf-rfq-hp { position: absolute !important; left: 0 !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip-path: inset(50%) !important; opacity: 0 !important; }
.pf-rfq-note { padding: 14px 18px; margin-bottom: 20px; font-weight: 600; }
.pf-rfq-note--ok { background: #eaf7ee; border-left: 4px solid #2e9c53; color: #1f6b3a; }
.pf-rfq-note--err { background: #fdecea; border-left: 4px solid #d94a3d; color: #8f2b22; }
@media (max-width: 780px) { .pf-rfq-grid { grid-template-columns: 1fr; } .pf-rfq-form { padding: 24px 20px; } }

/* Mobile navigation: collapsible submenus (2026-10-24) */
@media (max-width: 1023px) {
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu {
    display: flex; flex-wrap: wrap; align-items: center;
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu > .wp-block-navigation-item__content {
    flex: 1 1 auto;
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle {
    display: inline-flex !important; align-items: center; justify-content: center;
    width: 34px; height: 34px; margin-left: auto; padding: 0;
    background: none; border: 0; color: inherit; cursor: pointer;
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu.datang-submenu-open > .wp-block-navigation-submenu__toggle svg { transform: rotate(180deg); }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu > .wp-block-navigation__submenu-container {
    display: none !important; flex: 1 1 100%;
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu.datang-submenu-open > .wp-block-navigation__submenu-container {
    display: flex !important;
  }
}

/* New banner photo: keep the white hero copy readable over the bright sky */
.banner-main .wp-block-cover__background {
  opacity: 1 !important;
  background-image: linear-gradient(90deg, rgba(16, 28, 51, .82) 0%, rgba(16, 28, 51, .42) 58%, rgba(16, 28, 51, .08) 100%) !important;
}

/* ---------- Language switcher (EN / RU) ---------- */
.datang-lang-switch {
  display: flex; align-items: center; gap: 6px;
  margin-left: 16px; font-size: 13px; font-weight: 600;
  font-family: montserrat, sans-serif; white-space: nowrap;
}
.datang-lang-switch a {
  color: #fff; text-decoration: none; opacity: .62; letter-spacing: .04em;
}
.datang-lang-switch a:hover,
.datang-lang-switch a.is-current { opacity: 1; }
.datang-lang-switch .datang-lang-sep { color: #fff; opacity: .35; }
@media (max-width: 1023px) {
  .datang-lang-switch { margin-left: 0; margin-right: auto; padding: 10px 0 4px; }
}

/* Russian nav is wider than English: keep the menu clear of the yellow logo block */
.datang-lang-ru .header-box-upper .wp-block-navigation .wp-block-navigation-item__content {
  padding-left: 4px !important; padding-right: 4px !important; font-size: 15px !important;
}
.datang-lang-ru .header-box-upper { position: relative; }
.datang-lang-ru .header-box-upper .datang-lang-switch {
  position: absolute; right: 22px; top: 50%; transform: translateY(-50%);
  margin: 0; z-index: 6;
}
.datang-lang-ru .header-box-upper .header-inner-menu { padding-right: 78px !important; }
@media (max-width: 1023px) {
  .datang-lang-ru .header-box-upper .datang-lang-switch {
    position: static; transform: none; margin: 0 0 0 auto; padding: 8px 14px 0;
  }
  .datang-lang-ru .header-box-upper .header-inner-menu { padding-right: 0 !important; }
}

/* ---------- Language switcher: dropdown for 3+ languages ---------- */
.datang-lang-dropdown { position: relative; margin-left: 16px; }
.datang-lang-dropdown summary {
  list-style: none; cursor: pointer; color: #fff; opacity: .85;
  font-size: 13px; font-weight: 600; letter-spacing: .04em;
  font-family: montserrat, sans-serif; display: flex; align-items: center; gap: 4px;
}
.datang-lang-dropdown summary::-webkit-details-marker { display: none; }
.datang-lang-dropdown summary:hover { opacity: 1; }
.datang-lang-caret { font-size: 10px; opacity: .7; }
.datang-lang-dropdown .datang-lang-list {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 50;
  margin: 0; padding: 6px 0; list-style: none; min-width: 150px;
  background: #fff; border: 1px solid #e6e9ef;
  box-shadow: 0 10px 26px rgba(27,38,59,.16);
}
.datang-lang-dropdown .datang-lang-list li { margin: 0; }
.datang-lang-dropdown .datang-lang-list a {
  display: block; padding: 9px 16px; color: #1B263B;
  font-size: 13.5px; font-weight: 500; text-decoration: none; white-space: nowrap;
}
.datang-lang-dropdown .datang-lang-list a:hover { background: #f6f8fb; }
.datang-lang-dropdown .datang-lang-list a.is-current { color: #1B263B; font-weight: 700; background: #FFF6E0; }
@media (max-width: 1023px) {
  .datang-lang-dropdown { margin: 8px 14px 4px; }
  .datang-lang-dropdown .datang-lang-list { position: static; box-shadow: none; border: 0; padding: 0; }
}
/* ---------- Arabic (RTL) ---------- */
.datang-lang-ar body, body.datang-lang-ar { direction: rtl; }
body.datang-lang-ar .header-box-upper .header-inner-menu { padding-right: 0 !important; padding-left: 78px !important; }
body.datang-lang-ar .datang-lang-dropdown .datang-lang-list { right: auto; left: 0; }
body.datang-lang-ar .pf-points li { padding-left: 0; padding-right: 20px; }
body.datang-lang-ar .pf-points li:before { left: auto; right: 0; }
body.datang-lang-ar .pf-spec th,
body.datang-lang-ar .pf-spec td { text-align: right; }
body.datang-lang-ar .pf-contact-card i { margin-left: 8px; margin-right: 0; }

/* Arabic: keep phone numbers in LTR order inside RTL text */
body.datang-lang-ar a[href^="tel:"] { direction: ltr; unicode-bidi: bidi-override; display: inline-block; }
body.datang-lang-ar .datang-phone { direction: ltr; unicode-bidi: bidi-override; display: inline-block; }

/* Arabic: honeypot must not extend the scroll area in RTL */
body.datang-lang-ar .pf-rfq-hp { left: 0 !important; right: auto !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip-path: inset(50%) !important; opacity: 0 !important; }

/* Arabic: tighter header nav so the RTL logo block never covers an item */
body.datang-lang-ar .header-box-upper .wp-block-navigation .wp-block-navigation-item__content {
  padding-left: 4px !important; padding-right: 4px !important; font-size: 15px !important;
}
body.datang-lang-ar .header-box-upper { position: relative; }
body.datang-lang-ar .header-box-upper .datang-lang-switch {
  position: absolute; left: 22px; top: 50%; transform: translateY(-50%);
  margin: 0; z-index: 6;
}
body.datang-lang-ar .header-box-upper .header-inner-menu { padding-left: 78px !important; padding-right: 0 !important; }
@media (max-width: 1023px) {
  body.datang-lang-ar .header-box-upper .datang-lang-switch {
    position: static; transform: none; margin: 0 0 0 auto; padding: 8px 14px 0;
  }
  body.datang-lang-ar .header-box-upper .header-inner-menu { padding-left: 0 !important; }
}

@media (min-width: 1000px) and (max-width: 1199px) {
  body.datang-lang-ar .header-box-upper .wp-block-navigation .wp-block-navigation-item__content {
    padding-left: 2px !important; padding-right: 2px !important; font-size: 13px !important;
  }
}