/* Generated file. Source: shared/brand/styles/orders/geometry.css. Do not edit directly. Run: node tools/brand/sync-shared-brand.mjs */
body.orders-public {
  --orders-geom-radius-mobile: 8px;
  --orders-geom-radius-desktop: 16px;
  --orders-geom-radius: var(--orders-geom-radius-desktop);
  --orders-geom-content-inset-mobile: 16px;
  --orders-geom-content-inset-desktop: 20px;
  --orders-geom-content-inset: var(--orders-geom-content-inset-desktop);
  --orders-geom-inner-inset: var(--orders-geom-content-inset);
  --orders-geom-stroke-width: 1px;
  --orders-geom-cut-size: 48px;
  --orders-geom-cut-join: 0.5px;
  --orders-geom-cut-endpoint: calc(var(--orders-geom-cut-size) + var(--orders-geom-stroke-width));
  --orders-geom-cut-corner-safe-mobile: calc(var(--orders-geom-cut-endpoint) + var(--orders-geom-content-inset));
  --orders-geom-cut-corner-safe: 0px;
  --orders-geom-cut-path: polygon(0 0, 100% 0, 100% calc(100% - var(--orders-geom-cut-endpoint)), calc(100% - var(--orders-geom-cut-endpoint)) 100%, 0 100%);
  --orders-arrow-size-sm: 16px;
  --orders-arrow-size-lg: 36px;
}

@media (max-width: 720px) {
  body.orders-public {
    --orders-geom-radius: var(--orders-geom-radius-mobile);
    --orders-geom-content-inset: var(--orders-geom-content-inset-mobile);
    --orders-geom-cut-corner-safe: var(--orders-geom-cut-corner-safe-mobile);
  }
}

.orders-frame {
  border: var(--orders-geom-stroke-width) solid var(--orders-frame-stroke, var(--orders-line));
  border-radius: var(--orders-geom-radius);
}

.orders-cut-shell {
  position: relative;
  border: var(--orders-geom-stroke-width) solid var(--orders-frame-stroke, var(--orders-line));
  border-radius: var(--orders-geom-radius);
}

@media (max-width: 720px) {
  .orders-cut-shell {
    clip-path: var(--orders-geom-cut-path);
    border-color: var(--orders-material-tone) !important;
  }

  .orders-cut-shell::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 4;
    box-sizing: border-box;
    pointer-events: none;
    background-color: var(--orders-material-tone);
    clip-path: polygon(
      calc(100% + 1.5px) calc(100% - 50.5px),
      calc(100% + 2.5px) calc(100% - 49.5px),
      calc(100% - 49.5px) calc(100% + 2.5px),
      calc(100% - 50.5px) calc(100% + 1.5px)
    );
  }

  .orders-cut-corner-row {
    padding-inline-end: var(--orders-geom-cut-corner-safe);
  }

  .orders-cut-corner-action {
    inset-inline-end: var(--orders-geom-cut-corner-safe);
  }
}

.orders-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  font-size: var(--orders-arrow-size-sm);
}

.orders-arrow--small {
  font-size: var(--orders-arrow-size-sm);
}

.orders-arrow--large {
  font-size: var(--orders-arrow-size-lg);
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .orders-arrow {
    transition: transform 180ms ease;
  }

  .orders-route-plane:hover .orders-arrow,
  .orders-route-plane:focus-visible .orders-arrow,
  .orders-support-panel:hover .orders-arrow,
  .orders-support-panel:focus-visible .orders-arrow,
  .orders-custom-panel:hover .orders-arrow,
  .orders-custom-panel:focus-visible .orders-arrow,
  .orders-fallback-link-geometry:hover .orders-arrow,
  .orders-fallback-link-geometry:focus-visible .orders-arrow {
    transform: translateX(5px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .orders-arrow {
    transition: none !important;
    transform: none !important;
  }
}
