/* stylelint-disable property-no-vendor-prefix */
/* stylelint-disable custom-property-pattern */
/* stylelint-disable selector-class-pattern */
.md-typeset table th:nth-child(1),
.md-typeset table td:nth-child(1) {
    white-space: nowrap;
}

.md-main__inner {
    margin-top: 0.8rem;
}

/* see https://github.com/squidfunk/mkdocs-material/issues/4278 */
.md-search-result .md-typeset {
    display: -webkit-box;
    -webkit-line-clamp: 5;
    /* line-clamp: 5; */
    -webkit-box-orient: vertical;
    max-height: 200px;
}

/* Style for version dropdown - auto adapts to light/dark theme */
.version-selector {
    margin-left: 1rem;
    padding: 4px 6px;
    border-radius: 4px;
    font-size: 0.6rem;
    border: none;
    color: var(--md-default-fg-color);
    background-color: var(--md-default-bg-color--light);
    height: 32px;
    appearance: none;
    cursor: pointer;
}

:root {
  --md-admonition-icon--response-json: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5 3h2v2H5v5a2 2 0 0 1-2 2 2 2 0 0 1 2 2v5h2v2H5c-1.07-.27-2-.9-2-2v-4a2 2 0 0 0-2-2H0v-2h1a2 2 0 0 0 2-2V5a2 2 0 0 1 2-2m14 0a2 2 0 0 1 2 2v4a2 2 0 0 0 2 2h1v2h-1a2 2 0 0 0-2 2v4a2 2 0 0 1-2 2h-2v-2h2v-5a2 2 0 0 1 2-2 2 2 0 0 1-2-2V5h-2V3zm-7 12a1 1 0 0 1 1 1 1 1 0 0 1-1 1 1 1 0 0 1-1-1 1 1 0 0 1 1-1m-4 0a1 1 0 0 1 1 1 1 1 0 0 1-1 1 1 1 0 0 1-1-1 1 1 0 0 1 1-1m8 0a1 1 0 0 1 1 1 1 1 0 0 1-1 1 1 1 0 0 1-1-1 1 1 0 0 1 1-1"/></svg>');
  --md-admonition-icon--response-xml: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 3H5c-1.11 0-2 .89-2 2v14c0 1.11.89 2 2 2h14c1.11 0 2-.89 2-2V5c0-1.11-.89-2-2-2M8 15H6.5L6 13l-.5 2H4l.75-3L4 9h1.5l.5 2 .5-2H8l-.75 3zm7.5 0H14v-4.5h-1V14h-1.5v-3.5h-1V15H9v-4c0-1.1.9-2 2-2h2.5a2 2 0 0 1 2 2zm4.5 0h-3V9h1.5v4.5H20z"/></svg>');
  --md-admonition-icon--routing-directions: url('data:image/svg+xml,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M14 14.5V12h-4v3H8v-4a1 1 0 0 1 1-1h5V7.5l3.5 3.5m4.21.29-9-9h-.01a.996.996 0 0 0-1.41 0l-9 9c-.39.39-.39 1.03 0 1.42l9 9c.39.38 1.02.39 1.42 0l9-9c.39-.39.39-1.03 0-1.42"></path></svg>');
  --md-admonition-icon--geocoding: url('data:image/svg+xml,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M15.5 12c2.5 0 4.5 2 4.5 4.5 0 .88-.25 1.71-.69 2.4l3.08 3.1L21 23.39l-3.12-3.07c-.69.43-1.51.68-2.38.68-2.5 0-4.5-2-4.5-4.5s2-4.5 4.5-4.5m0 2a2.5 2.5 0 0 0-2.5 2.5 2.5 2.5 0 0 0 2.5 2.5 2.5 2.5 0 0 0 2.5-2.5 2.5 2.5 0 0 0-2.5-2.5M14 6.11 8 4v11.89l1 .35v.26c0 .64.09 1.26.26 1.84L8 17.9l-5.34 2.07-.16.03a.5.5 0 0 1-.5-.5V4.38c0-.23.15-.41.36-.48L8 2l6 2.1L19.34 2h.16a.5.5 0 0 1 .5.5v9.31A6.48 6.48 0 0 0 15.5 10c-.5 0-1 .06-1.5.17z"></path></svg>');
  --md-admonition-icon--places: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7z" fill="%235c6bc0"/></svg>');
  --md-admonition-icon--route-optimization: url('data:image/svg+xml,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M18 15a3 3 0 0 1 3 3 3 3 0 0 1-3 3 2.99 2.99 0 0 1-2.83-2H14v-2h1.17c.41-1.17 1.52-2 2.83-2m0 2a1 1 0 0 0-1 1 1 1 0 0 0 1 1 1 1 0 0 0 1-1 1 1 0 0 0-1-1m0-9a1.43 1.43 0 0 0 1.43-1.43 1.43 1.43 0 1 0-2.86 0A1.43 1.43 0 0 0 18 8m0-5.43a4 4 0 0 1 4 4C22 9.56 18 14 18 14s-4-4.44-4-7.43a4 4 0 0 1 4-4M8.83 17H10v2H8.83A2.99 2.99 0 0 1 6 21a3 3 0 0 1-3-3c0-1.31.83-2.42 2-2.83V14h2v1.17c.85.3 1.53.98 1.83 1.83M6 17a1 1 0 0 0-1 1 1 1 0 0 0 1 1 1 1 0 0 0 1-1 1 1 0 0 0-1-1M6 3a3 3 0 0 1 3 3c0 1.31-.83 2.42-2 2.83V10H5V8.83A2.99 2.99 0 0 1 3 6a3 3 0 0 1 3-3m0 2a1 1 0 0 0-1 1 1 1 0 0 0 1 1 1 1 0 0 0 1-1 1 1 0 0 0-1-1m5 14v-2h2v2zm-4-6H5v-2h2z"></path></svg>');
  --md-admonition-icon--static-map: url('data:image/svg+xml,<svg viewBox="0 0 576 512" xmlns="http://www.w3.org/2000/svg"><!--! Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M408 120c0 54.6-73.1 151.9-105.2 192-7.7 9.6-22 9.6-29.6 0C241.1 271.9 168 174.6 168 120 168 53.7 221.7 0 288 0s120 53.7 120 120m8 80.4c3.5-6.9 6.7-13.8 9.6-20.6.5-1.2 1-2.5 1.5-3.7l116-46.4c15.8-6.3 32.9 5.3 32.9 22.3v270.8c0 9.8-6 18.6-15.1 22.3L416 503zm-278.4-62.1c2.4 14.1 7.2 28.3 12.8 41.5 2.9 6.8 6.1 13.7 9.6 20.6v251.4L32.9 502.7C17.1 509 0 497.4 0 480.4V209.6c0-9.8 6-18.6 15.1-22.3l122.6-49zM327.8 332c13.9-17.4 35.7-45.7 56.2-77v249.3l-192-54.9V255c20.5 31.3 42.3 59.6 56.2 77 20.5 25.6 59.1 25.6 79.6 0M288 152a40 40 0 1 0 0-80 40 40 0 1 0 0 80"></path></svg>');
}

.md-typeset .admonition {
    font-size: 0.8rem;
}

/* Template cho tất cả các class */
.md-typeset .admonition.response-json,
.md-typeset details.response-json {
    border-color: #38a1db;
}

.md-typeset .response-json > .admonition-title,
.md-typeset .response-json > summary {
    background-color: #38a1db1a;
}

.md-typeset .response-json > .admonition-title::before,
.md-typeset .response-json > summary::before {
    background-color: #38a1db;
    mask-image: var(--md-admonition-icon--response-json);
    -webkit-mask-image: var(--md-admonition-icon--response-json);
}

.md-typeset .admonition.response-xml,
.md-typeset details.response-xml {
    border-color: #a36cd9;
}

.md-typeset .response-xml > .admonition-title,
.md-typeset .response-xml > summary {
    background-color: #a36cd91a;
}

.md-typeset .response-xml > .admonition-title::before,
.md-typeset .response-xml > summary::before {
    background-color: #a36cd9;
    mask-image: var(--md-admonition-icon--response-xml);
    -webkit-mask-image: var(--md-admonition-icon--response-xml);
}

/* Minimalist, subtle border styles for all blocks */
.md-typeset .admonition.routing-directions,
.md-typeset details.routing-directions,
.md-typeset .admonition.geocoding,
.md-typeset details.geocoding,
.md-typeset .admonition.places,
.md-typeset details.places,
.md-typeset .admonition.note,
.md-typeset details.note {
    border-color: var(--md-default-fg-color--lightest);
    border-width: 1px;
    border-left-width: 1px;
}

.md-typeset .routing-directions > .admonition-title,
.md-typeset .routing-directions > summary,
.md-typeset .geocoding > .admonition-title,
.md-typeset .geocoding > summary,
.md-typeset .places > .admonition-title,
.md-typeset .places > summary,
.md-typeset .note > .admonition-title,
.md-typeset .note > summary {
    background-color: transparent;
}

.md-typeset .routing-directions > .admonition-title::before,
.md-typeset .routing-directions > summary::before,
.md-typeset .geocoding > .admonition-title::before,
.md-typeset .geocoding > summary::before,
.md-typeset .places > .admonition-title::before,
.md-typeset .places > summary::before,
.md-typeset .note > .admonition-title::before,
.md-typeset .note > summary::before {
    background-color: var(--md-default-fg-color--lighter);
}

.md-typeset .routing-directions > .admonition-title::before,
.md-typeset .routing-directions > summary::before {
    mask-image: var(--md-admonition-icon--routing-directions);
    -webkit-mask-image: var(--md-admonition-icon--routing-directions);
}

.md-typeset .geocoding > .admonition-title::before,
.md-typeset .geocoding > summary::before {
    mask-image: var(--md-admonition-icon--geocoding);
    -webkit-mask-image: var(--md-admonition-icon--geocoding);
}

.md-typeset .places > .admonition-title::before,
.md-typeset .places > summary::before {
    mask-image: var(--md-admonition-icon--places);
    -webkit-mask-image: var(--md-admonition-icon--places);
}

.md-typeset .admonition.route-optimization,
.md-typeset details.route-optimization {
    border-color: #ff4081;
}

.md-typeset .route-optimization > .admonition-title,
.md-typeset .route-optimization > summary {
    background-color: #ff40811a;
}

.md-typeset .route-optimization > .admonition-title::before,
.md-typeset .route-optimization > summary::before {
    background-color: #ff4081;
    mask-image: var(--md-admonition-icon--route-optimization);
    -webkit-mask-image: var(--md-admonition-icon--route-optimization);
}

.md-typeset .admonition.static-map,
.md-typeset details.static-map {
    border-color: #007acc;
}

.md-typeset .static-map > .admonition-title,
.md-typeset .static-map > summary {
    background-color: #007acc1a;
}

.md-typeset .static-map > .admonition-title::before,
.md-typeset .static-map > summary::before {
    background-color: #007acc;
    mask-image: var(--md-admonition-icon--static-map);
    -webkit-mask-image: var(--md-admonition-icon--static-map);
}

.md-typeset .admonition.note-grey,
.md-typeset details.note-grey {
    border-color: #b0b0b0;
}

.md-typeset .note-grey > .admonition-title,
.md-typeset .note-grey > summary {
    background-color: #b0b0b01a;
    color: #333;
}

body[data-md-color-scheme="slate"] .md-typeset .note-grey > .admonition-title,
.md-typeset .note-grey > summary {
    color: #eee;
}


.md-typeset .note-grey > .admonition-title::before,
.md-typeset .note-grey > summary::before {
    background-color: #b0b0b0;
    mask-image: var(--md-admonition-icon--note);
    -webkit-mask-image: var(--md-admonition-icon--note);
}
/**/
.special-button {
    display: inline-block;
    color: rgba(255,255,255,0.7) !important;
    font-size: 0.7rem;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.2s;
}
.special-button:hover {
    color: #fff !important;
}

.pricing-button {
    display: inline-block;
    color: rgba(255,255,255,0.7) !important;
    font-size: 0.7rem;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.2s;
}
.pricing-button:hover {
    color: #fff !important;
}
.md-nav__dropdown {
    position: relative;
}

.md-nav__dropdown-toggle:after {
content: " ▼";
font-size: 0.7em;
}

.md-nav__dropdown-menu {
display: none;
position: absolute;
left: 0;
top: 100%;
background: #222b36;
min-width: 180px;
z-index: 1000;
box-shadow: 0 2px 8px rgba(0,0,0,0.15);
border-radius: 4px;
padding: 0.5em 0;
}

.md-nav__dropdown:hover .md-nav__dropdown-menu,
.md-nav__dropdown:focus-within .md-nav__dropdown-menu {
display: block;
}

.md-nav__dropdown-item a {
color: #fff;
padding: 0.5em 1.5em;
display: block;
text-decoration: none;
white-space: nowrap;
}

.md-nav__dropdown-item a:hover {
background: #1a202c;
}

.md-tabs__dropdown {
  position: relative;
}

.md-tabs__dropdown-menu {
  display: none;
  position: absolute;
  left: 0;
  top: 100%;
  background: #222b36;
  min-width: 180px;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  border-radius: 4px;
  padding: 0.5em 0;
}

.md-tabs__dropdown:hover .md-tabs__dropdown-menu,
.md-tabs__dropdown:focus-within .md-tabs__dropdown-menu {
  display: block;
}

.md-tabs__dropdown-menu li a {
  color: #fff;
  padding: 0.5em 1.5em;
  display: block;
  text-decoration: none;
  white-space: nowrap;
}

.md-tabs__dropdown-menu li a:hover {
  background: #1a202c;
}

/* ============================================================
   MAPVINA BRAND — Dark header, teal accent, EN/VI switcher
   ============================================================ */

/* Dark header matching mapvina.com */
.md-header {
  background: #0d1b2e !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.07) !important;
}
.md-tabs {
  background: #091524 !important;
}

/* Flex the tabs list so margin-left:auto works */
.md-tabs__list {
  display: flex !important;
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
}

/* Language switcher — pushed to far right */
.mv-lang-wrap {
  margin-left: auto !important;
  display: flex !important;
  align-items: center;
  gap: 5px;
  padding: 0 1rem 0 0.5rem;
  flex-shrink: 0;
}

.mv-lang-active {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #fff;
  cursor: default;
}

.mv-lang-link {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: rgba(255,255,255,0.4) !important;
  text-decoration: none !important;
  transition: color 0.2s;
}
.mv-lang-link:hover {
  color: rgba(255,255,255,0.85) !important;
}

.mv-lang-sep {
  color: rgba(255,255,255,0.18);
  font-size: 0.65rem;
  user-select: none;
}

/* Hide built-in language selector in header (replaced by EN|VI in tabs) */
.md-header__option .md-select {
  display: none !important;
}

/* Move palette form off-screen — inputs stay in DOM for JS, form can't block clicks */
form.md-header__option[data-md-component="palette"] {
  position: absolute !important;
  left: -9999px !important;
  overflow: hidden !important;
  width: 0 !important;
  height: 0 !important;
}

/* Hide site name text on desktop — logo already shows the brand */
/* visibility:hidden keeps the flex space so search stays on the right */
@media screen and (min-width: 76.25em) {
  .md-header__title {
    visibility: hidden;
  }
}

/* Palette (light/dark) toggle inside tabs nav */
.mv-palette-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  cursor: pointer;
  color: rgba(255,255,255,0.55);
  transition: color 0.2s;
  vertical-align: middle;
}
.mv-palette-btn:hover {
  color: rgba(255,255,255,0.9);
}
.mv-palette-btn svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

/* Light mode (default): show moon, hide sun */
.mv-ico-sun  { display: none; }
.mv-ico-moon { display: inline-block; }

/* Dark mode (slate): show sun, hide moon */
[data-md-color-scheme="slate"] .mv-ico-sun  { display: inline-block; }
[data-md-color-scheme="slate"] .mv-ico-moon { display: none; }

/* ============================================================
   HOMEPAGE BANNER — compact, one-line highlight
   ============================================================ */

.mv-banner {
  padding: 0.6rem 1rem;
  margin-bottom: 1.2rem;
  border-radius: 6px;
  background: linear-gradient(90deg, rgba(0, 150, 136, 0.1) 0%, rgba(0, 150, 136, 0.04) 100%);
  border: 1px solid rgba(0, 150, 136, 0.25);
  font-size: 0.82rem;
  line-height: 1.5;
}

[data-md-color-scheme="slate"] .mv-banner {
  background: linear-gradient(90deg, rgba(0, 191, 165, 0.08) 0%, rgba(0, 191, 165, 0.02) 100%);
  border-color: rgba(0, 191, 165, 0.2);
}

/* Highlights cards — compact */
.mv-highlights .md-typeset ul,
.mv-highlights .md-typeset ol {
  margin-bottom: 0;
}

.mv-highlights > ul > li {
  padding: 0.5rem 0.8rem;
}
