@import url('./context_help.css?v=20261026b');

.road-assistant-widget,
.road-assistant-widget * { box-sizing: border-box; }

.road-assistant-widget {
  position: fixed;
  z-index: 9999;
  right: 24px;
  bottom: 24px;
  display: block;
  width: 156px;
  height: 50px;
  overflow: visible;
  border: 1px solid rgb(190 213 232 / 88%);
  border-radius: 17px;
  background: linear-gradient(135deg, rgb(255 255 255 / 98%), rgb(247 251 255 / 97%));
  box-shadow: 0 8px 24px rgb(12 44 78 / 19%), 0 2px 5px rgb(12 44 78 / 8%);
  color: #103b65;
  backdrop-filter: blur(14px);
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  transition: width 230ms cubic-bezier(.2,.78,.2,1), height 230ms cubic-bezier(.2,.78,.2,1), border-radius 230ms ease, box-shadow 180ms ease, background 180ms ease, border-color 180ms ease;
}

.road-assistant-widget:hover {
  border-color: #8bb9dc;
  box-shadow: 0 10px 28px rgb(12 44 78 / 23%), 0 2px 5px rgb(12 44 78 / 8%);
}

.road-assistant-widget.is-dragging {
  transition: none;
  cursor: grabbing;
  box-shadow: 0 13px 34px rgb(12 44 78 / 27%), 0 3px 8px rgb(12 44 78 / 12%);
}

.road-assistant-toggle {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 0;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: inherit;
  background: transparent;
  box-shadow: none;
  color: inherit;
  font: 750 14px/1 system-ui, -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif;
  cursor: pointer;
  touch-action: none;
}

.road-assistant-toggle:hover { border: 0; background: transparent; box-shadow: none; }

.road-assistant-label {
  position: absolute;
  inset: 0 8px 0 43px;
  display: grid;
  place-items: center;
  color: #123d68;
  letter-spacing: .02em;
  white-space: nowrap;
}

.road-assistant-logo {
  position: absolute;
  inset: 0;
  display: none;
  overflow: hidden;
  place-items: center;
  border-radius: inherit;
  pointer-events: none;
}

.road-assistant-logo svg {
  display: block;
  width: 34px;
  height: 34px;
  max-width: none;
  fill: none;
}

.road-assistant-collapse {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  display: block;
  width: 39px;
  min-width: 39px;
  height: 46px;
  min-height: 46px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #6b8197;
  cursor: pointer;
  touch-action: none;
}

.road-assistant-collapse::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 36px;
  height: 30px;
  border-top-left-radius: 14px;
  background: linear-gradient(142deg, #071d3b 0%, #0b4c83 55%, #12a6d4 100%);
  clip-path: path("M 0 13 C 0 5.8 5.8 0 13 0 H 36 V 12 C 31 21 19 28 0 30 Z");
  content: "";
}

.road-assistant-badge-icon {
  position: absolute;
  z-index: 1;
  top: 1px;
  left: 4px;
  display: grid;
  width: 25px;
  height: 25px;
  place-items: center;
  pointer-events: none;
}

.road-assistant-badge-icon svg { display: block; width: 25px; height: 25px; }

.road-assistant-collapse::after {
  position: absolute;
  top: 27px;
  left: 11px;
  color: #7b8da0;
  font: 500 17px/16px system-ui, sans-serif;
  content: "‹";
}

.road-assistant-collapse:hover::after { color: #155c91; }
.road-assistant-collapse[hidden] { display: none !important; }
.road-assistant-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }

.road-assistant-widget.is-collapsed {
  width: 52px;
  height: 52px;
  overflow: hidden;
  border: 1px solid rgb(125 211 252 / 76%);
  border-radius: 50%;
  background: radial-gradient(ellipse at 29% 18%, rgb(255 255 255 / 48%), transparent 35%), linear-gradient(145deg, #38bdf8 0%, #1d4ed8 48%, #0f294a 100%);
  box-shadow: 0 9px 25px rgb(12 62 125 / 33%), inset 0 1px 1px rgb(255 255 255 / 48%), inset 0 -3px 7px rgb(5 22 53 / 28%);
}

.road-assistant-widget.is-collapsed .road-assistant-toggle {
  width: 50px;
  min-width: 50px;
  height: 50px;
  border-radius: 50%;
}

.road-assistant-widget.is-collapsed .road-assistant-label,
.road-assistant-widget.is-collapsed .road-assistant-collapse { display: none !important; }
.road-assistant-widget.is-collapsed .road-assistant-logo { display: grid; }

.road-assistant-toggle:focus-visible,
.road-assistant-collapse:focus-visible,
.road-assistant-panel button:focus-visible,
.road-assistant-panel a:focus-visible {
  outline: 3px solid #66b8eb;
  outline-offset: 3px;
}

.road-assistant-panel {
  position: fixed;
  z-index: 10000;
  top: auto;
  right: 16px;
  bottom: 82px;
  left: auto;
  width: min(390px, calc(100vw - 24px));
  max-height: min(72dvh, 640px);
  overflow: auto;
  overscroll-behavior: contain;
  padding: 13px 15px;
  border: 1px solid #cfdeea;
  border-radius: 13px;
  background: rgb(255 255 255 / 97%);
  box-shadow: 0 12px 38px rgb(16 43 73 / 19%);
  color: #344b61;
  font: 14px/1.55 system-ui, -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif;
  backdrop-filter: blur(14px);
}

.road-assistant-panel,
.road-assistant-panel * { box-sizing: border-box; }
.road-assistant-panel[hidden] { display: none !important; }

.road-assistant-panel > header {
  position: static;
  inset: auto;
  display: flex;
  width: auto;
  max-width: none;
  min-width: 0;
  height: auto;
  min-height: 0;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  padding: 0 0 9px;
  border: 0;
  border-bottom: 1px solid #e4edf4;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.road-assistant-panel > header > span { display: flex; min-width: 0; align-items: center; gap: 8px; color: #183c60; }
.road-assistant-panel > header strong { overflow-wrap: anywhere; }
.road-assistant-panel > header button { position: static; inset: auto; display: inline-grid; width: 34px; min-width: 34px; max-width: 34px; height: 34px; min-height: 34px; flex: 0 0 34px; margin: 0; padding: 0; place-items: center; border: 1px solid #d4e0e9; border-radius: 50%; background: #fff; color: #36546d; font-size: 22px; line-height: 1; cursor: pointer; }
.road-assistant-orbit { display: inline-grid; width: 29px; height: 29px; flex: 0 0 auto; overflow: hidden; place-items: center; border-radius: 50%; background: #eaf5fc; color: #1477b8; }
.road-assistant-orbit svg { display: block; width: 42px; height: 42px; max-width: none; }
.road-assistant-greeting { margin: 11px 0 7px; padding: 10px 11px; border: 1px solid #d7e8f5; border-radius: 9px; background: linear-gradient(135deg, #f1f9ff, #f8fbff); color: #244b6e; font-size: 13px; line-height: 1.65; }
.road-assistant-guidance { padding-top: 8px; }
.road-assistant-guidance h3 { margin: 5px 0; color: #36546d; font-size: 14px; }
.road-assistant-guidance p { margin: 5px 0 8px; color: #53677a; }
.road-assistant-guidance ol { margin: 6px 0 12px; padding-left: 23px; }
.road-assistant-guidance li { margin: 5px 0; padding-left: 2px; }
.road-assistant-guidance nav { position: static; inset: auto; display: flex; width: auto; max-width: none; min-width: 0; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 7px; margin: 0; padding: 10px 0 0; border: 0; border-top: 1px solid #edf0f4; background: transparent; box-shadow: none; font: inherit; }
.road-assistant-guidance nav a { position: static; inset: auto; display: inline-flex; width: auto; max-width: 100%; min-width: 0; min-height: 34px; align-items: center; margin: 0; padding: 5px 9px; border: 1px solid #cfdae7; border-radius: 6px; background: #f6f9fc; color: #245983; font-size: 13px; font-weight: 650; text-decoration: none; }
.road-assistant-guidance nav a:hover { border-color: #91acc5; background: #edf5fb; text-decoration: none; }
.road-assistant-disclosure { margin: 11px 0 0 !important; padding-top: 8px; border-top: 1px solid #edf0f4; color: #758596 !important; font-size: 11px; }

.road-assistant-panel #copilotBody { padding-top: 2px; }
.road-assistant-panel #copilotBody section { padding: 9px 0 6px; border-bottom: 1px solid #edf0f4; }
.road-assistant-panel #copilotBody h3 { margin: 0 0 3px; color: #36546d; font-size: 14px; }
.road-assistant-panel #copilotBody p { margin: 2px 0; color: #53677a; font-size: 14px; line-height: 1.4; }

@media (max-width: 520px) {
  .road-assistant-panel { width: min(390px, calc(100vw - 20px)); max-height: min(68dvh, 560px); padding: 11px 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .road-assistant-widget { transition: none; }
}

@media print {
  .road-assistant-widget,
  .road-assistant-panel { display: none !important; }
}

/* Keep the map footer clear and reserve one dedicated assistant zone. */
body.platform-page .road-assistant-widget { right: 22px; bottom: 52px; }
