@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400..700&display=swap');

[data-url*="\/docs\/api\/vertt"] {
  --primary: hsl(271, 91%, 60%) !important;
  --primary-foreground: hsl(271, 91%, 98%) !important;

  &.dark {
    --primary: hsl(271, 100%, 75%) !important;
    --primary-foreground: hsl(271, 91%, 98%) !important;
  }
}

[data-url*="\/docs\/api\/omnichannel"],
[data-url*="\/docs\/webhooks\/omnichannel"],
[data-url*="\/docs\/api\/enviar-template"],
[data-url*="\/docs\/api\/omnichannel-clients"],
[data-url*="\/docs\/api\/omnichannel-developers"] {
  --primary: hsl(171, 100%, 30%) !important;
  --primary-foreground: hsl(171, 100%, 98%) !important;

  &.dark {
    --primary: hsl(171, 100%, 50%) !important;
    --primary-foreground: hsl(171, 100%, 2%) !important;
  }
}

[data-url*="\/docs\/api\/tars"] {
  --primary: hsl(340, 100%, 50%) !important;
  --primary-foreground: hsl(340, 100%, 98%) !important;

  &.dark {
    --primary: hsl(340, 100%, 60%) !important;
  }
}

[data-url*="\/docs\/api\/portal"],
[data-url*="\/docs\/api\/assist"] {
  --primary: hsl(211, 100%, 50%) !important;
  --primary-foreground: hsl(211, 100%, 98%) !important;

  &.dark {
    --primary: hsl(211, 100%, 60%) !important;
  }
}

[data-url*="\/docs\/api\/touch"] {
  --primary: hsl(205, 100%, 50%) !important;
  --primary-foreground: hsl(205, 100%, 98%) !important;

  &.dark {
    --primary: hsl(205, 100%, 60%) !important;
  }
}

:root {
  --color-vertt-muted: 244, 232, 255;
  --color-vertt-lighter: 193, 132, 252;
  --color-vertt-light: 168, 85, 247;
  --color-vertt: 145, 51, 234;
  --color-vertt-dark: 122, 34, 206;
  --color-vertt-darker: 102, 33, 168;
}

.dark {
  --color-vertt-muted: 214, 171, 255, 0.1;
  --color-vertt: 168, 85, 247;
}

.font-mono,
.code-block {
  --text-xs: 0.8rem;
  --text-sm: 0.95rem;
  --text-base: 1.05rem;
}

.grid-quick-links {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 20px;
}

h2.break-all {
  word-break: normal !important;
}

[alt="Convert Developers"] {
  width: 140px;
  position: relative;
}

div:has(> [alt="Convert Developers"]) {
  &::after {
    margin-left: -30px;
    content: "for developers";
    font-size: 1.3em;
    font-weight: 400;
    color: var(--color-primary);
    font-family: 'Caveat', cursive;
  }
}


@property --angle {
  syntax: "<angle>";
  inherits: true;
  initial-value: 0turn;
}

@keyframes spin-gradient {
  to {
    --angle: 1turn;
  }
}

.animated-border {
  position: relative;
  isolation: isolate;
  border: solid 1px transparent;
  overflow: hidden;
  box-sizing: border-box;

  --width: 1px;
  --from: #95a7b82c;
  --to: #fff;

  &::before {
    content: " ";
    position: absolute;
    inset: 0;
    z-index: -1;
    border: inherit;
    border-width: var(--width);
    border-radius: inherit;
    background-image: conic-gradient(from var(--angle), var(--from) 80%, var(--to) 88%, var(--to) 92%, var(--from) 100%);
    background-origin: border-box;
    -webkit-mask: linear-gradient(black, black) content-box, linear-gradient(black, black);
    mask: linear-gradient(black, black), linear-gradient(black, black);
    -webkit-mask-clip: content-box, border-box;
    mask-clip: content-box, border-box;
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    animation: spin-gradient 2s linear infinite;
  }
}


.blueprint {
  isolation: isolate;

  &::after {
    inset: 0px;
    content: "";
    position: absolute;
    z-index: -999;
    opacity: 0.04;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 100 100'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='1'%3E%3Cpath opacity='.5' d='M96 95h4v1h-4v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9zm-1 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9z'/%3E%3Cpath d='M6 5V0H5v5H0v1h5v94h1V6h94V5H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  }
}

.font-handwritten {
  font-family: 'Caveat', cursive;
}

[data-url="/docs/home"] {
  [data-pagefind-body] {
    padding: 0px;
  }
}

[href*="~schemas"] {
  display: none;
}