@import "https://unpkg.com/open-props";

@font-face {
  font-family: "Noto Sans Tamil", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
  "wdth" 100;
}

body {
  font-family: "Noto Sans Tamil", sans-serif;
  font-size: var(--font-size-fluid-0);
  margin-left: var(--size-fluid-4);
}

#response {
  margin-top: var(--size-3);
}

button.highlight {
  border-color: var(--indigo-3);
  background-color: var(--indigo-1);
  color: var(--yellow-12);
}

.collapsed {
  display: none;
}

button.action {
  font-family: "Noto Sans Tamil", sans-serif;
  border-color: var(--blue-1);
  background-color: var(--blue-3);
  color: var(--blue-12);
  font-size: var(--font-size-fluid-1);
}

button.action_emergency {
  font-family: "Noto Sans Tamil", sans-serif;
  border-color: var(--orange-3);
  background-color: var(--orange-5);
  color: var(--orange-12);
  font-size: var(--font-size-fluid-1);
}

div.config {
  display: flex;
  gap: var(--size-fluid-2);
  margin-bottom: var(--size-fluid-1);
  align-items: flex-start;
}

.spinner {
  border: 8px solid #f3f3f3;
  border-radius: 50%;
  border-top: 8px solid #3498db;
  width: 30px;
  height: 30px;
  animation: var(--animation-spin);
  animation-duration: 1.5s;
  aspect-ratio: var(--ratio-square);
}

hr.response-sep {
  border: none;
  border-top: 2px dashed var(--blue-5);
}
