/**
 * @file theme.css
 * shadcn/ui-compatible theme variables for Byte Theme.
 *
 * You can customize these values without rebuilding the compiled CSS.
 * Tools like https://tweakcn.com can help generate these values.
 */

:root {
  /* --background: oklch(0.13 0.043 265.132); */
  --background: oklch(100% 0.00011 271.152);
  --foreground: oklch(1 0 89.876);
  --card: oklch(0.208 0.042 266.359);
  --card-foreground: var(--foreground);
  --primary: oklch(0.547 0.246 262.866);
  --primary-foreground: var(--foreground);
  --secondary: oklch(0.704 0.04 256.993);
  --secondary-foreground: oklch(0.13 0.043 265.132);
  --muted: oklch(0.28 0.041 260.329);
  --reitbg: #E6EDF5;
  --muted-foreground: oklch(0.934 0.016 256);
  --accent: oklch(0.932 0.032 255.585);
  --accent-foreground: oklch(0.13 0.043 265.132);
  --destructive: oklch(0.6368 0.2078 25.3313);
  --destructive-foreground: oklch(1 0 0);
  --border: oklch(0.373 0.031 259.733);
  --input: oklch(0.373 0.031 259.733);
  --font-sans: "Roboto", "Helvetica Neue", Arial, Helvetica, sans-serif;
  --font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  --font-mono: "Fira Mono", "Menlo", "Consolas", "Liberation Mono", monospace;
  --font-satoshi: "Satoshi";
  --radius: 0.5rem;
  --shadow-x: 0;
  --shadow-y: 1px;
  --shadow-blur: 3px;
  --shadow-spread: 0px;
  --shadow-opacity: 0.1;
  --shadow-color: oklch(0 0 0);
  --shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
  --shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
  --shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 1px 2px -1px hsl(0 0% 0% / 0.1);
  --shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 1px 2px -1px hsl(0 0% 0% / 0.1);
  --shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 2px 4px -1px hsl(0 0% 0% / 0.1);
  --shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 4px 6px -1px hsl(0 0% 0% / 0.1);
  --shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 8px 10px -1px hsl(0 0% 0% / 0.1);
  --shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);

  --bg-color-neutral-100: var(--neutral-100, #f8f8f8);
  --text-color-neutral-600: var(--color-neutral-600,#656565);
  --text-color-neutral-950: var(--color-neutral-950,#292929);
  --bg-color-background-color-bg-accent-subtle: #E6EDF5;
  --text-color-text-color-text-primary: #292929;
  --text-color-text-color-text-secondary: #656565;

  /* Set navbar height for hero billboard overlay */
  --navbar-height: calc(var(--spacing) * 15);

  @media (min-width: 768px) {
    --navbar-height: calc(var(--spacing) * 18);
  }
}
.webform-input, .webform-input:focus  {
    border: 1px solid #E4E4E4;
    border-radius: 10px;
    padding: 15px;
    font-weight: normal;
}

.webform-input:focus {
    font-size: 20px;
    background: none;
}

.webform-input::placeholder {
    color: #BDBDBD;
}

.webform-label, .webform-label:focus {
    color: black;
    font-size: 16px;

}

.webform-label > a {
    text-decoration: underline;
}

form#webform-submission-contact-form-canvas-page-32-add-form {
    border: 1px solid #E4E4E4;
    border-radius: 10px;
    padding: 15px;
    font-size: 20px;
}

/* Hide the actual input */
.arrow-submit input[type="submit"] {
  position: absolute !important;
  opacity: 0 !important;
  width: 100% !important;
  height: 100% !important;
  top: 0 !important;
  left: 0 !important;
  cursor: pointer !important;
  margin: 0 !important;
}

/* Wrapper becomes the button */
.arrow-submit {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0 !important;
  padding: 0 !important;
  background: #1352A2 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  cursor: pointer !important;
  width: fit-content !important;
  transition: background 0.2s ease !important;
}

.arrow-submit:hover {
  background: #003d78 !important;
}

/* Label — left side */
.arrow-submit::before {
  content: "Submit";
  display: inline-flex;
  align-items: center;
  padding: 12px 18px 12px 20px;
  color: #ffffff;
  font-size: 15px;
  font-weight: 700;
  font-family: 'Satoshi', 'Inter', sans-serif;
  white-space: nowrap;
  pointer-events: none;
}

/* Arrow box — right side */
.arrow-submit::after {
  content: "";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background-color: #ffffff;
  border-radius: 6px;
  margin: 4px 4px 4px 0;
  flex-shrink: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.175 13H4V11H16.175L10.575 5.4L12 4L20 12L12 20L10.575 18.6L16.175 13Z' fill='%231352A2'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
  pointer-events: none;
  transition: background-color 0.2s ease;
}

.arrow-submit:hover::after {
  background-color: #e8f0fb;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.175 13H4V11H16.175L10.575 5.4L12 4L20 12L12 20L10.575 18.6L16.175 13Z' fill='%23003d78'/%3E%3C/svg%3E");
}

.text-reitbg {
  color: oklch(0.934 0.016 256);
}