.status-state-success {
  color: var(--tblr-success);
}
.status-state-failure,
.status-state-cancelled,
.status-state-error {
  color: var(--tblr-danger);
}
.status-state-pending,
.status-state-running {
  color: var(--tblr-warning);
}

.avatar-inner {
  /* --tblr-avatar-bg: var(--tblr-bg-surface-secondary); */
  position: relative;
  width: 66%;
  height: 66%;
  display: inline-flex;
  background: var(--tblr-avatar-bg) no-repeat center/cover;
  /* border-radius: var(--tblr-border-radius); */
}

.small-caps {
  font-variant: small-caps;
}

.avatar,
.card,
.table tr {
  border: 0px solid transparent !important;
  box-shadow: none !important;
}

.avatar,
.avatar-inner {
  /* background-color: transparent !important; */
  --tblr-bg-surface-secondary: var(--tblr-bg-surface-tertiary);
  /* aspect ration */
  aspect-ratio: 1/1;
}

.navbar {
  box-shadow: none;
}

.skeleton {
  width: 100%;
  height: 100%;
  border-radius: 8px;
  background: linear-gradient(90deg, #f0f0f0 25%, #e8e8e8 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: shimmer 3.5s infinite;
  display: flex;
  flex: 1;
}

@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

/* https://www.realtimecolors.com/?colors=2f1b0e-ebd5b2-ac856c-b0cda7-86bb96&fonts=NTR-Manjari */
:root,
[data-bs-theme="light"] {
  --text: #2f1b0e;
  --background: #ebd5b2;
  --primary: #ac856c;
  --secondary: #b0cda7;
  --accent: #86bb96;

  --text-rgb: 47, 27, 14;
  --background-rgb: 235, 213, 178;
  --primary-rgb: 172, 133, 108;
  --secondary-rgb: 176, 205, 167;
  --accent-rgb: 134, 187, 150;

  --text-50: #f9f1eb;
  --text-100: #f3e3d8;
  --text-200: #e8c6b0;
  --text-300: #dcaa89;
  --text-400: #d08e62;
  --text-500: #c4723b;
  --text-600: #9d5b2f;
  --text-700: #764423;
  --text-800: #4f2d17;
  --text-900: #27170c;
  --text-950: #140b06;

  --background-50: #faf4eb;
  --background-100: #f5e9d6;
  --background-200: #ead3ae;
  --background-300: #e0bd85;
  --background-400: #d5a75d;
  --background-500: #cb9134;
  --background-600: #a2742a;
  --background-700: #7a571f;
  --background-800: #513a15;
  --background-900: #291d0a;
  --background-950: #140f05;

  --primary-50: #f6f1ef;
  --primary-100: #ede4de;
  --primary-200: #dac9be;
  --primary-300: #c8ae9d;
  --primary-400: #b6927c;
  --primary-500: #a3775c;
  --primary-600: #835f49;
  --primary-700: #624837;
  --primary-800: #413025;
  --primary-900: #211812;
  --primary-950: #100c09;

  --secondary-50: #f0f6ef;
  --secondary-100: #e2edde;
  --secondary-200: #c4dabe;
  --secondary-300: #a7c89d;
  --secondary-400: #8ab67c;
  --secondary-500: #6ca35c;
  --secondary-600: #578349;
  --secondary-700: #416237;
  --secondary-800: #2b4125;
  --secondary-900: #162112;
  --secondary-950: #0b1009;

  --accent-50: #eff6f1;
  --accent-100: #deede3;
  --accent-200: #bedac6;
  --accent-300: #9dc8aa;
  --accent-400: #7cb68e;
  --accent-500: #5ca371;
  --accent-600: #49835b;
  --accent-700: #376244;
  --accent-800: #25412d;
  --accent-900: #122117;
  --accent-950: #09100b;

  --tblr-body-bg: var(--background);
  --tblr-body-color: var(--text);
  --tblr-bg-surface: var(--background-100);
  --tblr-bg-forms: var(--background-50);

  --tblr-primary: var(--accent-500);
  --tblr-primary-darken: var(--accent-600);
  /* --tblr-primary: var(--primary); */
  /* --tblr-link-color: var(--secondary); */

  --tblr-primary-rgb: var(--accent-rgb);
  --tblr-secondary-rgb: var(--primary-rgb);
  --tblr-secondary: var(--primary-500);
  --tblr-secondary-darken: var(--primary-600);

  --tblr-gray-50: var(--primary-50);
  --tblr-gray-100: var(--primary-100);
  --tblr-gray-200: var(--primary-200);
  --tblr-gray-300: var(--primary-300);
  --tblr-gray-400: var(--primary-400);
  --tblr-gray-500: var(--primary-500);
  --tblr-gray-600: var(--primary-600);
  --tblr-gray-700: var(--primary-700);
  --tblr-gray-800: var(--primary-800);

  --tblr-border-color-translucent: var(--primary-100);
  --tblr-bg-surface-tertiary: var(--background-50);
  --tblr-muted-rgb: var(--text-rgb);
}

[data-bs-theme="dark"] {
  --text: #f1ddd0;
  --background: #4d3714;
  --primary: #936b53;
  --secondary: #3b5832;
  --accent: #447954;

  --text-50: #140b06;
  --text-100: #27170c;
  --text-200: #4f2d17;
  --text-300: #764423;
  --text-400: #9d5b2f;
  --text-500: #c4723b;
  --text-600: #d08e62;
  --text-700: #dcaa89;
  --text-800: #e8c6b0;
  --text-900: #f3e3d8;
  --text-950: #f9f1eb;

  --background-50: #140f05;
  --background-100: #291d0a;
  --background-200: #513a15;
  --background-300: #7a571f;
  --background-400: #a2742a;
  --background-500: #cb9134;
  --background-600: #d5a75d;
  --background-700: #e0bd85;
  --background-800: #ead3ae;
  --background-900: #f5e9d6;
  --background-950: #faf4eb;

  --primary-50: #100c09;
  --primary-100: #211812;
  --primary-200: #413025;
  --primary-300: #624837;
  --primary-400: #835f49;
  --primary-500: #a3775c;
  --primary-600: #b6927c;
  --primary-700: #c8ae9d;
  --primary-800: #dac9be;
  --primary-900: #ede4de;
  --primary-950: #f6f1ef;

  --secondary-50: #0b1009;
  --secondary-100: #162112;
  --secondary-200: #2b4125;
  --secondary-300: #416237;
  --secondary-400: #578349;
  --secondary-500: #6ca35c;
  --secondary-600: #8ab67c;
  --secondary-700: #a7c89d;
  --secondary-800: #c4dabe;
  --secondary-900: #e2edde;
  --secondary-950: #f0f6ef;

  --accent-50: #09100b;
  --accent-100: #122117;
  --accent-200: #25412d;
  --accent-300: #376244;
  --accent-400: #49835b;
  --accent-500: #5ca371;
  --accent-600: #7cb68e;
  --accent-700: #9dc8aa;
  --accent-800: #bedac6;
  --accent-900: #deede3;
  --accent-950: #eff6f1;

  --tblr-body-bg: var(--background);
  --tblr-body-color: var(--text);
  --tblr-bg-surface: var(--background-100);
  --tblr-bg-forms: var(--background-50);

  --tblr-primary: var(--accent-500);
  --tblr-primary-darken: var(--accent-600);
  /* --tblr-primary: var(--primary); */
  /* --tblr-link-color: var(--secondary); */

  --tblr-primary-rgb: var(--accent-rgb);
  --tblr-secondary-rgb: var(--primary-rgb);
  --tblr-secondary: var(--primary);
  --tblr-secondary-darken: var(--primary-600);

  --tblr-gray-50: var(--primary-50);
  --tblr-gray-100: var(--primary-100);
  --tblr-gray-200: var(--primary-200);
  --tblr-gray-300: var(--primary-300);
  --tblr-gray-400: var(--primary-400);
  --tblr-gray-500: var(--primary-500);
  --tblr-gray-600: var(--primary-600);
  --tblr-gray-700: var(--primary-700);
  --tblr-gray-800: var(--primary-800);

  --tblr-border-color-translucent: var(--primary-100);
  --tblr-bg-surface-tertiary: var(--background-50);
  --tblr-muted-rgb: var(--text-rgb);
}

.navbar {
  --tblr-navbar-color: var(--text);
  --tblr-navbar-active-color: var(--text);
  /* --tblr-navbar-active-color: var(--secondary-700); */
}
.text-muted {
  --tblr-muted: var(--text);
  --tblr-text-opacity: 0.8;
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


.varela-round-regular {
  font-family: "Varela Round", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.concert-one-regular {
  font-family: "Concert One", sans-serif;
  font-weight: 400;
  font-style: normal;
}


:root,
[data-bs-theme="light"] {
  --tblr-font-sans-serif: "Varela Round", sans-serif;
  /* "Inter Var", Inter, -apple-system, BlinkMacSystemFont, San Francisco,
    Segoe UI, Roboto, Helvetica Neue, sans-serif;

  --tblr-body-font-family: var(--tblr-font-sans-serif);
} */

h1, .h1 {
  font-family: "Concert One", sans-serif;
  margin-top: -0.2ex;
}