.kdu-tools {
  box-sizing: border-box;
  color: #1f2933;
  font-size: 16px;
  line-height: 1.45;
}

.kdu-tools *,
.kdu-tools *::before,
.kdu-tools *::after {
  box-sizing: inherit;
}

.kdu-jobs-alert,
.kdu-shipping-quote,
.kdu-free-listing-cta,
.kdu-rao-vat-hub {
  border: 1px solid #d7dee8;
  border-radius: 8px;
  margin: 20px 0;
  padding: 18px;
  background: #ffffff;
}

.kdu-tools-section {
  min-width: 0;
  border: 0;
  border-top: 1px solid #d7dee8;
  margin: 18px 0 0;
  padding: 16px 0 0;
}

.kdu-tools-section legend {
  padding: 0 8px 0 0;
  color: #1f2933;
  font-size: 17px;
  font-weight: 700;
}

.kdu-tools-inline {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 84px;
  gap: 8px;
}

.kdu-tools-checkbox-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 14px;
  margin-top: 12px;
}

.kdu-tools-checkbox-grid label {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-weight: 400;
}

.kdu-tools-checkbox-grid input {
  width: auto;
  min-height: 0;
  margin-top: 4px;
}

.kdu-tools-header {
  margin-bottom: 14px;
}

.kdu-tools-header h3 {
  margin: 0 0 4px;
  font-size: 22px;
  line-height: 1.25;
}

.kdu-tools-header p {
  margin: 0;
  color: #52606d;
}

.kdu-tools-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.kdu-tools label {
  display: block;
  font-weight: 600;
}

.kdu-tools label span {
  display: block;
  margin-bottom: 5px;
}

.kdu-tools input,
.kdu-tools select,
.kdu-tools textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid #bcccdc;
  border-radius: 6px;
  padding: 8px 10px;
  background: #ffffff;
  color: #1f2933;
}

.kdu-tools textarea {
  min-height: 84px;
}

.kdu-tools-full,
.kdu-tools-consent {
  margin-top: 12px;
}

.kdu-tools-consent {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-weight: 400;
}

.kdu-tools-consent input {
  width: auto;
  min-height: 0;
  margin-top: 4px;
}

.kdu-tools-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 14px;
}

.kdu-tools-actions button,
.kdu-tools-actions a {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  padding: 8px 13px;
  font-weight: 700;
  text-decoration: none;
}

.kdu-tools-actions button {
  border: 1px solid #1f6feb;
  background: #1f6feb;
  color: #ffffff;
  cursor: pointer;
}

.kdu-tools-actions button:disabled {
  cursor: wait;
  opacity: 0.65;
}

.kdu-tools-actions a {
  border: 1px solid #d7dee8;
  background: #f8fafc;
  color: #1f2933;
}

.kdu-tools-message {
  min-height: 22px;
  margin-top: 12px;
  font-weight: 600;
}

.kdu-tools-message[data-state="success"] {
  color: #0b6b3a;
}

.kdu-tools-message[data-state="error"] {
  color: #b42318;
}

.kdu-tools-privacy {
  margin: 8px 0 0;
  font-size: 14px;
}

.kdu-tools-honeypot {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.kdu-tools-admin-note {
  border: 1px dashed #b7791f;
  border-radius: 6px;
  padding: 10px;
  background: #fffaf0;
}

.kdu-free-listing-cta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 300px);
  gap: 18px;
  align-items: center;
  max-width: 820px;
  border-color: #b7d4ff;
  background: linear-gradient(135deg, #f8fbff 0%, #ffffff 64%);
}

.kdu-rao-vat-hub {
  max-width: 1040px;
  border-color: #b7d4ff;
  background: #ffffff;
}

/* Homepage SEO heading is server-rendered into the existing page content.
   Keep it visibly useful and compact without taking over the Elementor hero. */
.kdu-home-seo-heading {
  max-width: 1140px;
  margin: 0 auto 20px;
  padding: 0 16px;
  color: #12263a;
}

.kdu-home-seo-heading h1 {
  margin: 0 0 6px;
  font-size: 32px;
  line-height: 1.2;
}

.kdu-home-seo-heading p {
  margin: 0;
  color: #52606d;
}

/* P0 taxonomy archive content is rendered through RTCL/Classima hooks, not
   by editing either vendor template. Keep the controlled H1 compact so fresh
   listings remain visible near the top of the archive. */
.kdu-archive-seo-intro,
.kdu-archive-seo-faq {
  max-width: 1040px;
  border: 1px solid #d7dee8;
  border-radius: 8px;
  margin: 0 0 16px;
  padding: 16px;
  background: #ffffff;
}

.kdu-archive-seo-intro__eyebrow {
  margin: 0 0 5px;
  color: #1f6feb;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.kdu-archive-seo-intro h1 {
  margin: 0 0 8px;
  color: #12263a;
  font-size: 30px;
  line-height: 1.2;
}

.kdu-archive-seo-intro__copy {
  margin: 0;
  color: #52606d;
}

.kdu-archive-seo-intro__links {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 12px;
  margin-top: 12px;
}

.kdu-archive-seo-intro__links a {
  color: #1f6feb;
  font-weight: 700;
  text-decoration: none;
}

.kdu-archive-seo-intro__links a:hover,
.kdu-archive-seo-intro__links a:focus {
  text-decoration: underline;
}

.kdu-archive-seo-faq {
  margin-top: 18px;
}

.kdu-archive-seo-faq h2 {
  margin: 0 0 10px;
  color: #12263a;
  font-size: 22px;
  line-height: 1.25;
}

.kdu-archive-seo-faq__items {
  display: grid;
  gap: 8px;
}

.kdu-archive-seo-faq details {
  border: 1px solid #e6edf5;
  border-radius: 6px;
  padding: 10px 12px;
}

.kdu-archive-seo-faq summary {
  cursor: pointer;
  color: #1f2933;
  font-weight: 800;
}

.kdu-archive-seo-faq p {
  margin: 8px 0 0;
  color: #52606d;
}

.kdu-rao-vat-hub__main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: end;
}

.kdu-rao-vat-hub__content {
  min-width: 0;
}

.kdu-rao-vat-hub__eyebrow {
  margin: 0 0 6px;
  color: #1f6feb;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.kdu-rao-vat-hub h1,
.kdu-rao-vat-hub h2 {
  margin: 0 0 8px;
  color: #12263a;
  font-size: 30px;
  line-height: 1.2;
}

.kdu-rao-vat-hub h2 {
  font-size: 26px;
}

.kdu-rao-vat-hub p {
  max-width: 760px;
  margin: 0;
  color: #52606d;
}

.kdu-rao-vat-hub--archive {
  max-width: 100%;
  margin: 14px 0 16px;
  padding: 16px;
  border-color: #d7dee8;
  background: #ffffff;
}

.kdu-rao-vat-hub--archive .kdu-rao-vat-hub__main {
  grid-template-columns: minmax(0, 1fr) minmax(180px, 260px);
  align-items: center;
}

.kdu-rao-vat-hub--archive .kdu-rao-vat-hub__eyebrow {
  margin-bottom: 4px;
  font-size: 12px;
}

.kdu-rao-vat-hub--archive h2 {
  margin-bottom: 6px;
  font-size: 24px;
}

.kdu-rao-vat-hub--archive p {
  max-width: 860px;
  font-size: 15px;
  line-height: 1.4;
}

.kdu-rao-vat-hub--archive .kdu-rao-vat-hub__links {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.kdu-rao-vat-hub--archive .kdu-rao-vat-hub__links a {
  min-height: 62px;
  padding: 8px 10px;
}

.kdu-rao-vat-hub--archive .kdu-rao-vat-hub__links small {
  font-size: 12px;
}

.kdu-rao-vat-hub__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.kdu-rao-vat-hub__button,
.kdu-rao-vat-hub__secondary {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  padding: 9px 14px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none;
}

.kdu-rao-vat-hub__button,
.kdu-rao-vat-hub a.kdu-rao-vat-hub__button:link,
.kdu-rao-vat-hub a.kdu-rao-vat-hub__button:visited {
  border: 1px solid #1f6feb;
  background: #1f6feb;
  color: #ffffff;
}

.kdu-rao-vat-hub__secondary,
.kdu-rao-vat-hub a.kdu-rao-vat-hub__secondary:link,
.kdu-rao-vat-hub a.kdu-rao-vat-hub__secondary:visited {
  border: 1px solid #d7dee8;
  background: #f8fafc;
  color: #1f2933;
}

.kdu-rao-vat-hub__links {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 16px;
}

.kdu-rao-vat-hub__links a {
  display: block;
  min-width: 0;
  border: 1px solid #e6edf5;
  border-radius: 6px;
  padding: 10px 12px;
  background: #fbfdff;
  color: #1f2933;
  text-decoration: none;
}

.kdu-rao-vat-hub__links span {
  display: block;
  overflow-wrap: anywhere;
  font-weight: 800;
}

.kdu-rao-vat-hub__links small {
  display: block;
  margin-top: 3px;
  color: #62748a;
  font-size: 13px;
  line-height: 1.25;
}

.kdu-free-listing-cta--compact,
.kdu-free-listing-cta--inline {
  margin: 18px 0;
}

/* Single-listing CTA: stack vertically so it never spreads full-width on
   desktop, regardless of how wide the container it lands in is. */
.kdu-free-listing-cta--compact {
  grid-template-columns: 1fr;
  gap: 12px;
  border-left: 4px solid #1f6feb;
  padding: 14px;
  background: #ffffff;
}

.kdu-free-listing-cta--compact .kdu-free-listing-cta__actions {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
}

.kdu-free-listing-cta--compact .kdu-free-listing-cta__button,
.kdu-free-listing-cta--compact .kdu-free-listing-cta__secondary {
  flex: 1 1 200px;
}

.kdu-free-listing-cta--compact .kdu-free-listing-cta__note {
  flex: 1 1 100%;
  margin: 0;
}

.kdu-free-listing-cta--compact h3 {
  font-size: 20px;
}

.kdu-free-listing-cta--compact ul {
  grid-template-columns: 1fr;
  gap: 5px;
  margin-top: 8px;
}

.kdu-free-listing-cta--compact .kdu-free-listing-cta__button,
.kdu-free-listing-cta--compact .kdu-free-listing-cta__secondary {
  min-height: 40px;
  padding: 8px 12px;
}

.kdu-free-listing-cta__eyebrow {
  margin: 0 0 6px;
  color: #1f6feb;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.kdu-free-listing-cta h3 {
  margin: 0 0 8px;
  color: #16212f;
  font-size: 24px;
  line-height: 1.2;
}

.kdu-free-listing-cta p {
  margin: 0 0 10px;
}

.kdu-free-listing-cta ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
}

.kdu-free-listing-cta li {
  position: relative;
  padding-left: 18px;
  color: #3e4c59;
  font-size: 14px;
}

.kdu-free-listing-cta li::before {
  position: absolute;
  top: 0;
  left: 0;
  color: #1f6feb;
  content: "✓";
  font-weight: 800;
}

.kdu-free-listing-cta__actions {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.kdu-free-listing-cta__button,
.kdu-free-listing-cta__secondary {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  padding: 10px 14px;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
}

.kdu-free-listing-cta__button {
  border: 1px solid #1f6feb;
  background: #1f6feb;
}

.kdu-free-listing-cta__button:hover,
.kdu-free-listing-cta__button:focus {
  background: #185abc;
}

.kdu-free-listing-cta__secondary {
  border: 1px solid #d7dee8;
  background: #ffffff;
}

/* Force button text colors above theme link styles (Classima overrides <a> color,
   which made the primary button text look dark on the blue background). */
.kdu-free-listing-cta a.kdu-free-listing-cta__button,
.kdu-free-listing-cta a.kdu-free-listing-cta__button:link,
.kdu-free-listing-cta a.kdu-free-listing-cta__button:visited,
.kdu-free-listing-cta a.kdu-free-listing-cta__button:hover,
.kdu-free-listing-cta a.kdu-free-listing-cta__button:focus {
  color: #ffffff !important;
  text-shadow: none;
}

.kdu-free-listing-cta a.kdu-free-listing-cta__secondary,
.kdu-free-listing-cta a.kdu-free-listing-cta__secondary:link,
.kdu-free-listing-cta a.kdu-free-listing-cta__secondary:visited,
.kdu-free-listing-cta a.kdu-free-listing-cta__secondary:hover,
.kdu-free-listing-cta a.kdu-free-listing-cta__secondary:focus {
  color: #1f2933 !important;
  text-shadow: none;
}

.kdu-free-listing-cta__note {
  color: #52606d;
  font-size: 13px;
}

/* Demand-side CTA. It borrows the compact single-column layout but takes its
   own accent on purpose: the "post what you need" ask runs on the same pages
   as the "post what you have" ask and is being measured against it, so the two
   must not look like the same offer. Declared after the shared button rules so
   the accent wins on specificity ties. */
.kdu-free-listing-cta--wanted {
  grid-template-columns: 1fr;
  gap: 12px;
  margin: 18px 0;
  padding: 14px;
  border-color: #b3ddc7;
  border-left: 4px solid #0f7b52;
  background: linear-gradient(135deg, #f3fbf7 0%, #ffffff 64%);
}

.kdu-free-listing-cta--wanted .kdu-free-listing-cta__eyebrow {
  color: #0f7b52;
}

.kdu-free-listing-cta--wanted h3 {
  font-size: 20px;
}

.kdu-free-listing-cta--wanted ul {
  grid-template-columns: 1fr;
  gap: 5px;
  margin-top: 8px;
}

.kdu-free-listing-cta--wanted .kdu-free-listing-cta__actions {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
}

.kdu-free-listing-cta--wanted .kdu-free-listing-cta__button {
  flex: 0 1 auto;
  min-height: 40px;
  padding: 8px 14px;
  border-color: #0f7b52;
  background: #0f7b52;
}

.kdu-free-listing-cta--wanted .kdu-free-listing-cta__button:hover,
.kdu-free-listing-cta--wanted .kdu-free-listing-cta__button:focus {
  background: #0b5c3d;
}

.kdu-free-listing-cta--wanted .kdu-free-listing-cta__note {
  flex: 1 1 100%;
  margin: 0;
}

/* Archive description "read more" clamp (applied by JS on listing archive
   pages so a long category/location description does not push the listings
   far down, especially on mobile). Content stays in the DOM for SEO. */
.kdu-term-description--clamped {
  position: relative;
  overflow: hidden;
}

.kdu-term-description-toggle {
  display: inline-block;
  margin-top: 6px;
  border: 0;
  padding: 2px 0;
  background: none;
  color: #1f6feb;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.kdu-archive-control-toggle {
  display: none;
}

@media (max-width: 782px) {
  .kdu-archive-control-toggle {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid #d7dee8;
    border-radius: 8px;
    margin: 10px 0;
    padding: 10px 12px;
    background: #ffffff;
    color: #1f2933;
    font: inherit;
    font-weight: 700;
    line-height: 1.2;
    text-align: left;
    cursor: pointer;
  }

  .kdu-archive-control-toggle::after {
    content: "+";
    display: inline-flex;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #eef4ff;
    color: #1f6feb;
    font-weight: 800;
  }

  .kdu-archive-control-toggle[aria-expanded="true"]::after {
    content: "-";
  }

  .kdu-archive-control-panel.is-collapsed {
    min-height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    border-top-width: 0 !important;
    border-bottom-width: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .kdu-archive-control-panel.is-open {
    max-height: none;
    overflow: visible;
    margin-bottom: 12px;
  }

  .kdu-archive-control-holder {
    margin-bottom: 8px;
  }

  .kdu-archive-control-holder .kdu-archive-control-toggle {
    margin-top: 0;
  }

  .kdu-rao-vat-hub__main {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .kdu-rao-vat-hub--archive .kdu-rao-vat-hub__main {
    grid-template-columns: 1fr;
  }

  .kdu-rao-vat-hub__actions {
    justify-content: stretch;
  }

  .kdu-rao-vat-hub__button,
  .kdu-rao-vat-hub__secondary {
    width: 100%;
  }

  .kdu-rao-vat-hub__links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kdu-rao-vat-hub--archive .kdu-rao-vat-hub__links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .kdu-tools-grid {
    grid-template-columns: 1fr;
  }

  .kdu-tools-checkbox-grid {
    grid-template-columns: 1fr;
  }

  .kdu-rao-vat-hub__main {
    grid-template-columns: 1fr;
  }

  /* Category shortcuts stay two-up on phones on every hub surface. A single
     column pushed the listing results below a full screen of navigation. */
  .kdu-rao-vat-hub__links,
  .kdu-rao-vat-hub--archive .kdu-rao-vat-hub__links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kdu-rao-vat-hub h1,
  .kdu-rao-vat-hub h2 {
    font-size: 24px;
  }

  .kdu-archive-seo-intro h1 {
    font-size: 24px;
  }

  .kdu-home-seo-heading {
    margin-bottom: 16px;
    padding: 0 14px;
  }

  .kdu-home-seo-heading h1 {
    font-size: 25px;
  }

  .kdu-archive-seo-faq h2 {
    font-size: 20px;
  }

  .kdu-rao-vat-hub--archive h2 {
    font-size: 21px;
  }

  .kdu-rao-vat-hub--archive p {
    font-size: 14px;
  }

  .kdu-rao-vat-hub__actions {
    justify-content: stretch;
  }

  .kdu-rao-vat-hub__button,
  .kdu-rao-vat-hub__secondary {
    width: 100%;
  }

  .kdu-tools-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .kdu-tools-actions button,
  .kdu-tools-actions a {
    width: 100%;
  }

  .kdu-free-listing-cta {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 12px;
  }

  .kdu-free-listing-cta--compact,
  .kdu-free-listing-cta--inline,
  .kdu-free-listing-cta--wanted {
    gap: 10px;
    margin: 14px 0;
  }

  .kdu-free-listing-cta--compact,
  .kdu-free-listing-cta--wanted {
    border-left-width: 3px;
  }

  .kdu-free-listing-cta__eyebrow {
    margin-bottom: 4px;
    font-size: 12px;
    line-height: 1.25;
  }

  .kdu-free-listing-cta h3,
  .kdu-free-listing-cta--inline h3,
  .kdu-free-listing-cta--compact h3 {
    margin-bottom: 6px;
    font-size: 20px;
    line-height: 1.2;
  }

  .kdu-free-listing-cta p {
    margin-bottom: 8px;
    font-size: 14px;
    line-height: 1.4;
  }

  .kdu-free-listing-cta ul {
    grid-template-columns: 1fr;
    gap: 5px;
    margin-top: 8px;
  }

  .kdu-free-listing-cta li {
    padding-left: 17px;
    font-size: 13px;
    line-height: 1.35;
  }

  /* Every variant that sets a row direction for its desktop layout must be
     listed here. A variant-scoped rule outside this media query carries two
     classes and would otherwise outrank a single-class rule inside it, so the
     row direction would survive onto phones. */
  .kdu-free-listing-cta__actions,
  .kdu-free-listing-cta--compact .kdu-free-listing-cta__actions,
  .kdu-free-listing-cta--wanted .kdu-free-listing-cta__actions {
    flex-direction: column;
    gap: 8px;
    align-items: stretch;
  }

  /* 44px is the Apple HIG / WCAG 2.5.5 minimum tap target. These are the
     primary conversion actions on a phone, which is where most KDU traffic
     is, so they get the full size rather than the 40-42px the desktop
     variants use. */
  .kdu-free-listing-cta__button,
  .kdu-free-listing-cta__secondary,
  .kdu-free-listing-cta--compact .kdu-free-listing-cta__button,
  .kdu-free-listing-cta--compact .kdu-free-listing-cta__secondary,
  .kdu-free-listing-cta--wanted .kdu-free-listing-cta__button,
  .kdu-free-listing-cta--wanted .kdu-free-listing-cta__secondary {
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    font-size: 15px;
  }

  /* The compact CTA uses a 200px flex basis for its desktop row. Once the
     actions stack vertically, that basis would become 200px of height per
     button. Reset it here so mobile buttons remain tap-sized, not panels. */
  .kdu-free-listing-cta--compact .kdu-free-listing-cta__button,
  .kdu-free-listing-cta--compact .kdu-free-listing-cta__secondary,
  .kdu-free-listing-cta--wanted .kdu-free-listing-cta__button {
    flex: 0 0 auto;
    height: auto;
  }

  .kdu-free-listing-cta__note,
  .kdu-free-listing-cta--compact .kdu-free-listing-cta__note,
  .kdu-free-listing-cta--wanted .kdu-free-listing-cta__note {
    margin: 0;
    font-size: 12px;
    line-height: 1.35;
  }
}

/* Single listing H1
   -------------------------------------------------------------------------
   Classima's single-listing template never calls the_title(), so the ad's own
   title was on the page only in <title>, schema, the breadcrumb and a hidden
   modal. SingleListingHeading restores it as the page heading. Sized to read
   as the page title on a phone first — most KDU traffic is mobile — without
   fighting the gallery it sits above. */
.kdu-listing-heading {
  margin: 0 0 12px;
  color: #12263a;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.28;
  overflow-wrap: anywhere;
}

@media (min-width: 641px) {
  .kdu-listing-heading {
    margin-bottom: 14px;
    font-size: 28px;
    line-height: 1.24;
  }
}

/* Demand signal
   -------------------------------------------------------------------------
   "N người đang tìm việc" on hiring/rental archives and the listing form.
   Mobile-first: the count is the headline, actions stack full-width, and the
   whole block sits after the listings so it never pushes results down. It
   shares the demand-side green so a visitor reads it as the same family as
   the "cần tìm" CTA, not as a second unrelated banner. */
.kdu-demand-signal {
  margin: 18px 0;
  padding: 14px;
  border: 1px solid #b3ddc7;
  border-left: 4px solid #0f7b52;
  border-radius: 8px;
  background: linear-gradient(135deg, #f3fbf7 0%, #ffffff 64%);
}

.kdu-demand-signal__count {
  margin: 0 0 6px;
  color: #0f7b52;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
}

.kdu-demand-signal__count strong {
  font-size: 26px;
  font-weight: 800;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.kdu-demand-signal__body {
  margin: 0 0 12px;
  color: #3e4c59;
  font-size: 14px;
  line-height: 1.45;
}

.kdu-demand-signal__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin: 0;
}

.kdu-demand-signal__button,
.kdu-demand-signal__secondary {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  padding: 10px 14px;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
}

.kdu-demand-signal__button {
  border: 1px solid #0f7b52;
  background: #0f7b52;
}

.kdu-demand-signal__secondary {
  border: 1px solid #cfe4d9;
  background: #ffffff;
}

/* Classima restyles <a>, which turned the primary button text dark on its own
   background. Same fix the CTA needed. */
.kdu-demand-signal a.kdu-demand-signal__button,
.kdu-demand-signal a.kdu-demand-signal__button:link,
.kdu-demand-signal a.kdu-demand-signal__button:visited,
.kdu-demand-signal a.kdu-demand-signal__button:hover,
.kdu-demand-signal a.kdu-demand-signal__button:focus {
  color: #ffffff !important;
  text-shadow: none;
}

.kdu-demand-signal a.kdu-demand-signal__secondary,
.kdu-demand-signal a.kdu-demand-signal__secondary:link,
.kdu-demand-signal a.kdu-demand-signal__secondary:visited,
.kdu-demand-signal a.kdu-demand-signal__secondary:hover,
.kdu-demand-signal a.kdu-demand-signal__secondary:focus {
  color: #14503a !important;
  text-shadow: none;
}

@media (max-width: 640px) {
  .kdu-demand-signal {
    margin: 14px 0;
    padding: 12px;
    border-left-width: 3px;
  }

  .kdu-demand-signal__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .kdu-demand-signal__button,
  .kdu-demand-signal__secondary {
    width: 100%;
  }
}

/* City x category cell links
   -------------------------------------------------------------------------
   "Xem theo thành phố" under a category archive. These are the only links to
   the promoted cells, so they have to be reachable and tappable on a phone
   first. Two-up on mobile rather than a single column: a city list stacked one
   per row pushes the rest of the page below a full screen. */
.kdu-cell-links {
  margin: 18px 0;
  padding: 14px;
  border: 1px solid #d7dee8;
  border-radius: 8px;
  background: #ffffff;
}

.kdu-cell-links__label {
  margin: 0 0 10px;
  color: #52606d;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.kdu-cell-links ul {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.kdu-cell-links a {
  display: flex;
  min-height: 44px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid #d7dee8;
  border-radius: 7px;
  padding: 10px 12px;
  background: #f8fafc;
  color: #12263a;
  font-weight: 700;
  text-decoration: none;
}

.kdu-cell-links a:hover,
.kdu-cell-links a:focus {
  border-color: #1f6feb;
}

.kdu-cell-links a span {
  color: #52606d;
  font-size: 13px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 640px) {
  .kdu-cell-links {
    margin: 14px 0;
    padding: 12px;
  }

  .kdu-cell-links ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
  }
}

/* Archive card thumbnails
   -------------------------------------------------------------------------
   ArchiveThumbnailPolicy filters the placeholder <img> out of a listing card,
   which leaves the theme's own wrapper anchor behind with nothing inside it.
   Collapse that anchor rather than the whole `.rtin-thumb` block: Classima
   renders the price badge and the sold-out banner as siblings of the image,
   inside the same block, so hiding the block would remove the price too. */
.rtcl-listing-item .rtin-thumb-inner:empty,
.listing-grid-each .rtin-thumb-inner:empty {
  display: none;
}