/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

 :root {
  --black: #000;
  --white: #FFF;
  --yellow-100: #FDF1DF;
  --yellow-300: #f7CC86;
  --yellow-400: #F5BB5E;
  --green-300: #81aa6d;
  --green-400: #578E3D;
  --blue-100: #EEF5F8;
  --blue-300: #599EBA;
  --blue-700: #3D778E;
  --grey-100: #fafafa;
  --grey-200: #f9fafb;
  --grey-300: #ebebeb;
  --grey-400: #dddddd;
  --grey-700: #5b5b5b;
  --teal-50: #f4f9f9;
  --teal-700: #2f5256;
  --teal-950: #111f22;
  --teal-800: #144035;
  --surface-sidebar: #1d2c2e;
  --surface-aside: #07304a;
  --primary-strong: #07304a;
  --primary-bg: #f3ab1b;
  --border-default: #d1d5dc;

  --text-heading: #101828;
  --text-body: #1e2939;
  --text-muted: #6a7282;
  --text-title: #1a2d3d;
  --text-on-dark: #ffffff;

  --success-bg: #eaf5f1;
  --success-default: #319977;
  --success-text: #1a624e;

  --blue-bg: #b9e8fe;
  --blue-surface: #eef4f8;
  --primary-subtle: #E7F2F2;

  --warning-bg: #faf3db;
  --warning-text: #d19700;
  --yellow-700: #9b6300;

  --purple-bg: #faf7fd;
  --purple-700: #7b3fb1;
  --purple-800: #683891;
  --purple-text: #7c45a7;

  --info-default: #36c1fa;
  --info-text: #0088c9;

  --neutral-100: #f3f4f6;
  --neutral-200: #e5e7eb;
  --neutral-300: #d1d5dc;
  --neutral-500: #6a7282;

  --text-disabled: #4a5565;
  --text-input: #617781;
  --stone-400: #7a746c;
  --border-on-dark-2: rgba(115, 134, 139, 0.5);

  --error-bg: #fdf3f3;
  --error-default: #d64142;
  --error-text: #922223;

  --modal-input-box: #111f22;
  --panel-border: #e5e8eb;

  --teal-900: #1d2c2e;

  --background-page: #f6f8f9;
}

html {
   overflow-y: scroll;
}

html,
body {
   display: flex;
   flex-direction: column;
   height: 100%;
   margin: 0;
   font-size: 16px;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   text-rendering: optimizeLegibility;
 }

 main {
   flex-grow: 1;
 }


@keyframes spinner {
  to {transform: rotate(360deg);}
}

.spinner {
  display: inline-block;
  width: 1.2em;
  height: 1.2em;
  vertical-align: text-bottom;
  border: 0.2em solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: spinner 0.75s linear infinite;
  margin-right: 0.5em;
}

input[type="search"]::-webkit-search-cancel-button {
  margin-left: 8px;
}

.gm-style .gm-style-iw-c {
  padding: 0 !important;
  max-height: none !important;
  border-radius: 6px !important;
  overflow: visible !important;
  box-shadow: 0px 10px 10px -6px rgba(0,0,0,0.1), 0px 20px 25px -5px rgba(0,0,0,0.05) !important;
}

.gm-style .gm-style-iw-d {
  overflow: visible !important;
  max-height: none !important;
}

.gm-style .gm-style-iw-tc {
  display: none !important;
}

.gm-style .gm-style-iw-chr {
  display: none !important;
}

.map-info-card a {
  pointer-events: none;
  display: block;
  border-radius: 6px;
  overflow: hidden;
}

.project-list-scroll::-webkit-scrollbar {
  width: 8px;
}

.project-list-scroll::-webkit-scrollbar-track {
  background: var(--neutral-200);
  border-radius: 100px;
}

.project-list-scroll::-webkit-scrollbar-thumb {
  background: var(--text-muted);
  border-radius: 100px;
}