/* One shared mobile composition at every viewport, using the approved SVGs. */
body.client-khurcargo {
  --bg: #FFFFFF;
  --surface: #FFFFFF;
  --border: #E3E3E3;
  --text: #0B0B0B;
  --muted: #686868;
  --accent: #ED1C24;
  --accent2: #C4141B;
  --accent-hover: #D01820;
  --success: #18764E;
  --track-bg: #F3F3F3;
  color-scheme: light;
  min-height: 100vh;
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  border-top: 4px solid var(--accent);
}

body.client-khurcargo::before {
  display: block;
  background-image:
    linear-gradient(rgba(237, 28, 36, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(237, 28, 36, .045) 1px, transparent 1px);
  background-size: 32px 32px;
}

body.client-khurcargo::after { display: none; }

body.client-khurcargo .container {
  max-width: 432px;
  padding: 28px 18px calc(112px + env(safe-area-inset-bottom));
}

body.client-khurcargo [hidden] { display: none !important; }
body.client-khurcargo .env-badge { display: none; }

body.client-khurcargo .lang-toggle { display: none; }

body.client-khurcargo header {
  align-items: stretch;
  text-align: center;
  margin: 0 0 20px;
  animation: none;
}

body.client-khurcargo .public-branding { display: flex; flex-direction: column; align-items: center; gap: 12px; }
body.client-khurcargo .logo-mark { margin: 0; flex: 0 0 auto; }
body.client-khurcargo .logo-mark img { width: 208px; height: auto; max-width: 100%; object-fit: contain; }
body.client-khurcargo .public-brand-copy { min-width: 0; }

body.client-khurcargo h1 {
  margin: 0 0 6px;
  color: var(--text);
  background: none;
  -webkit-text-fill-color: currentColor;
  font-family: inherit;
  font-size: 24px;
  font-weight: 750;
  line-height: 1.25;
  letter-spacing: -.025em;
  overflow-wrap: anywhere;
}

body.client-khurcargo .subtitle { color: var(--muted); font-size: 13px; font-weight: 400; letter-spacing: 0; }

body.client-khurcargo .public-availability {
  margin-bottom: 12px;
  padding: 10px 12px;
  background: #F5F5F5;
  color: #52565E;
  border: 1px solid #EEEEEE;
  border-radius: 10px;
  font-size: 12px;
  line-height: 1.5;
}

body.client-khurcargo .search-card {
  padding: 18px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-top: 3px solid var(--accent);
  border-radius: 16px;
  box-shadow: 0 8px 28px #0B0B0B06;
  margin-bottom: 16px;
}

body.client-khurcargo .search-tabs { gap: 4px; padding: 4px; background: var(--track-bg); border: 0; border-radius: 12px; margin-bottom: 16px; }
body.client-khurcargo .search-tab { display: flex; align-items: center; justify-content: center; flex: 1 1 0; min-width: 0; height: 44px; min-height: 44px; padding: 0 10px; color: var(--muted); font-family: inherit; font-size: 12px; font-weight: 600; line-height: 1.25; border: 0; border-radius: 8px; transition: background .15s, color .15s; }
body.client-khurcargo .search-tab.active { background: var(--text); color: #FFFFFF; box-shadow: none; }
body.client-khurcargo .search-label { margin-bottom: 8px; color: var(--text); font-size: 13px; font-weight: 600; letter-spacing: 0; text-transform: none; }

body.client-khurcargo #trackInput {
  height: 58px;
  min-height: 58px;
  padding: 16px 86px 16px 14px;
  border: 1px solid #D8D8D8;
  border-radius: 10px;
  background: #FAFAFA;
  color: var(--text);
  font-family: inherit;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: 0;
  box-shadow: none;
}

body.client-khurcargo #trackInput::placeholder { color: #757575; font-size: 15px; line-height: 24px; letter-spacing: 0; }
body.client-khurcargo #trackInput:focus { border-color: var(--accent); background: #FFFFFF; box-shadow: 0 0 0 3px #ED1C2414; }
body.client-khurcargo #trackInput.multi { height: auto; min-height: 120px; padding: 12px 56px 12px 14px; overflow-y: auto; }
body.client-khurcargo .track-paste-btn { top: 50%; right: 10px; min-width: 64px; height: 38px; padding: 0 10px; border-radius: 8px; background: #FFFFFF; border-color: var(--border); color: var(--text); font-family: inherit; font-size: 11px; line-height: 1; letter-spacing: 0; }
body.client-khurcargo .track-paste-btn:hover { background: #F5F5F5; border-color: #BBBBBB; }
body.client-khurcargo .track-clear-btn { right: 10px; width: 38px; height: 38px; border-radius: 8px; background: #F5F5F5; border-color: var(--border); color: var(--muted); }
body.client-khurcargo .track-clear-btn:hover { background: #EFEFEF; border-color: #BBBBBB; color: var(--text); }
body.client-khurcargo .multi-hint { color: var(--muted); font-family: inherit; }

body.client-khurcargo #searchBtn {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  min-height: 52px;
  padding: 0 16px;
  margin-top: 2px;
  background: var(--accent);
  border: 0;
  border-radius: 10px;
  color: #FFFFFF;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: .02em;
  box-shadow: none;
  transition: background .15s, opacity .15s;
}

body.client-khurcargo #searchBtn::before { display: none; }
body.client-khurcargo #searchBtn:hover:not(:disabled),
body.client-khurcargo #searchBtn:focus-visible:not(:disabled) { background: var(--accent-hover); transform: none; filter: none; box-shadow: none; }
body.client-khurcargo #searchBtn:active:not(:disabled) { background: #BF151C; transform: none; }
body.client-khurcargo #searchBtn:focus-visible { outline: 2px solid var(--text); outline-offset: 3px; }
body.client-khurcargo #searchBtn:disabled { opacity: .55; cursor: not-allowed; }
body.client-khurcargo :is(button, a, textarea):focus-visible { outline: 2px solid var(--accent2); outline-offset: 3px; }
body.client-khurcargo .recent-tracking { background: #FAFAFA; border-color: var(--border); }
body.client-khurcargo .recent-tracking-chip { background: #FFFFFF; color: var(--text); border-color: var(--border); }

body.client-khurcargo :is(.result-card, .result-item, .accordion, .site-notice) { background: #FFFFFF; border-color: var(--border); box-shadow: none; border-radius: 18px; }
body.client-khurcargo .result-header { border-bottom-color: var(--border); background: #FAFAFA; }
body.client-khurcargo :is(.tracking-number, .result-item-track) { color: var(--text); font-family: inherit; font-weight: 750; overflow-wrap: anywhere; }
body.client-khurcargo :is(.d-label, .tracking-label, .result-item-meta, .step-label) { color: var(--muted); font-family: inherit; }
body.client-khurcargo :is(.d-value, .accordion-title, .accordion-body, .addr-value, .contact-val) { color: var(--text); font-family: inherit; }
body.client-khurcargo .d-value.highlight { color: var(--accent2); }
body.client-khurcargo :is(.result-item-detail, .details-section, .progress-section) { background: transparent; border-color: var(--border); }
body.client-khurcargo .details-row { border-bottom-color: var(--border); }
body.client-khurcargo .status-badge::before { background: currentColor; box-shadow: none; }
body.client-khurcargo .step.has-connector::before { display: none; }
body.client-khurcargo .step.line-solid::after { background: #ED1C2459; }
body.client-khurcargo .step.line-fade::after { background: linear-gradient(#ED1C2459, var(--border)); }
body.client-khurcargo .step.line-muted::after { background: var(--border); }
body.client-khurcargo :is(.step.done, .step.active) .step-dot { background: #FFF0F1; color: var(--accent2); border: 1px solid #F5CBD0; animation: none; box-shadow: none; }
body.client-khurcargo .step.final .step-dot { background: #EAF6EF; color: var(--success); animation: none; box-shadow: none; }
body.client-khurcargo .step-date { font-family: inherit; font-size: 12px; letter-spacing: 0; }
body.client-khurcargo .step-date.amber { color: var(--accent2); }
body.client-khurcargo .step-date.green { color: var(--success); }
body.client-khurcargo :is(.status-badge, .result-item-status).transit { background: #FFF0F1; color: #B81628; border-color: #F5CBD0; }
body.client-khurcargo :is(.status-badge, .result-item-status).order { background: #F0F1F3; color: #525968; border-color: #D8DCE3; }
body.client-khurcargo :is(.status-badge, .result-item-status).arrived,
body.client-khurcargo :is(.status-badge, .result-item-status).delivered { background: #EAF6EF; color: #176B43; border-color: #BCDDCB; }
body.client-khurcargo :is(.show-all-btn, .call-btn, .map-btn, .addr-copy-btn) { font-family: inherit; }
body.client-khurcargo .error-box { color: #A91424; background: #FFF0F1; border-color: #F5CBD0; }
body.client-khurcargo .site-notice-message { color: var(--text); }
body.client-khurcargo .site-notice-title { font-family: inherit; }

/* Existing shared tabs display only published Khur content. */
body.client-khurcargo .info-sections { display: none; margin-top: 24px; }
body.client-khurcargo:not(.public-tab-home) .public-home-section { display: none !important; }
body.client-khurcargo:not(.public-tab-home):not(.homepage-fallback-hidden) .info-sections { display: flex; }
body.client-khurcargo .info-sections .accordion { display: none; }
body.client-khurcargo.public-tab-pricing #acc-pricing,
body.client-khurcargo.public-tab-address #acc-overseas,
body.client-khurcargo.public-tab-schedule #acc-local,
body.client-khurcargo.public-tab-notice #acc-precautions { display: block; }
body.client-khurcargo:not(.public-tab-home) .accordion-body { max-height: none !important; }
body.client-khurcargo:not(.public-tab-home) .accordion-btn { pointer-events: none; }
body.client-khurcargo:not(.public-tab-home) .accordion-chevron { display: none; }

body.client-khurcargo .public-bottom-nav {
  position: fixed;
  inset: auto 12px max(16px, env(safe-area-inset-bottom));
  z-index: 20;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  max-width: 396px;
  margin: 0 auto;
  padding: 7px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: #FFFFFF;
  box-shadow: 0 10px 40px #17191D12;
}

body.client-khurcargo .public-bottom-nav-btn { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; min-width: 0; min-height: 58px; padding: 7px 4px; border: 0; border-radius: 11px; background: transparent; color: var(--muted); font-family: inherit; font-size: 10px; line-height: 1.25; }
body.client-khurcargo .public-bottom-nav-btn.active { color: var(--accent2); background: #FFF0F1; font-weight: 700; }
body.client-khurcargo .public-bottom-nav-btn:disabled { color: #858991; opacity: .65; cursor: not-allowed; }
body.client-khurcargo .public-bottom-nav-icon { width: 19px; height: 19px; }
body.client-khurcargo .public-bottom-nav-icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

body.client-khurcargo [data-public-tab="schedule"] .public-bottom-nav-icon {
  --warehouse-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21V8l9-5 9 5v13H3Z'/%3E%3Cpath d='M7 21V11h10v10M7 15h10M7 18h10'/%3E%3C/svg%3E");
  background: currentColor;
  -webkit-mask: var(--warehouse-icon) center / contain no-repeat;
  mask: var(--warehouse-icon) center / contain no-repeat;
}
body.client-khurcargo [data-public-tab="schedule"] .public-bottom-nav-icon svg { display: none; }

body.client-khurcargo .page-footer { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; border-top: 1px solid var(--border); padding-top: 16px; margin-top: 20px; }
body.client-khurcargo .footer-fb-link { min-height: 36px; padding: 7px 10px; border: 1px solid #D7E3F4; border-radius: 9px; background: #F5F8FD; box-shadow: none; color: #204D87; text-decoration: none; font-family: inherit; font-size: 12px; font-weight: 500; }
body.client-khurcargo .footer-fb-link svg { flex: 0 0 15px; width: 15px; height: 15px; }
body.client-khurcargo .footer-fb-link:hover { background: #EDF3FC; border-color: #BDD1EF; }
body.client-khurcargo .footer-fb-link:active { background: #E4EEFB; border-color: #A9C3E8; }
body.client-khurcargo .footer-fb-link.is-static { pointer-events: none; }
body.client-khurcargo .footer-fb-link.is-static svg { display: none; }
body.client-khurcargo .footer-dev { flex: 0 0 auto; margin-left: auto; line-height: 1.5; }
body.client-khurcargo :is(.footer-copy, .footer-credit) { color: var(--muted); }
body.client-khurcargo .footer-dev .footer-credit { font-family: inherit; }
body.client-khurcargo .footer-dev .footer-credit:hover { color: var(--text); text-shadow: none; }

@media (max-width: 360px) {
  body.client-khurcargo .container { padding-left: 12px; padding-right: 12px; }
  body.client-khurcargo .search-card { padding: 16px; }
}