:root {
  --blue-1: #162f6a;
  --blue-2: #214aab;
  --blue-3: #5279d7;
  --blue-4: #a3bbf3;
  --blue-5: #d2dfff;

  --linen: #ebeaea;
  --inclusive: #ffffff;
  --deep-earthy-brown: #150202;
  --black: #000000;
  --deep-blue: #1d0a69;
  --liberty-green: #198754;
  --mustard-yellow: #ffc107;
  --coral-red: #dc3545;
  --information: #0d6efd;
  --grey-1: #c6c6c6;
  --grey-2: #8e8e8e;
  --grey-3: #606060;

  --fw-bold: 700;
  --fw-semibold: 600;
  --fw-medium: 500;
  --fw-regular: 400;
}
html {
  --heading-color-1: var(--blue-1, #162f6a);

  --bg-inclusive: var(--inclusive, #fff);
  --bg-primary: var(--blue-1, #162f6a);
  --bg-secondary: var(--blue-2, #214aab);
  --bg-third: var(--blue-3, #5279d7);
  --bg-forth: var(--blue-4, #a3bbf3);
  --bg-fifth: var(--blue-5, #d2dfff);
  --bg-linen: var(--linen, #ebeaea);
  --bg-linen-2: var(--linen, #ebeaea);
  --bg-image: var(--linen, #ebeaea);

  --text-inclusive: var(--inclusive, #fff);
  --text-primary: var(--blue-1, #162f6a);
  --text-secondary: var(--blue-2, #214aab);
  --text-third: var(--blue-3, #5279d7);
  --text-forth: var(--blue-4, #a3bbf3);
  --text-fifth: var(--blue-5, #d2dfff);
  --text-linen: var(--linen, #ebeaea);
  --text-deb: var(--deep-earthy-brown, #150202);

  --clickable-text-inclusive: var(--inclusive, #fff);
  --clickable-text-primary: var(--blue-1, #162f6a);
  --clickable-text-secondary: var(--blue-2, #214aab);
  --clickable-text-third: var(--blue-3, #5279d7);
  --clickable-text-forth: var(--blue-4, #a3bbf3);
  --clickable-text-fifth: var(--blue-5, #d2dfff);
  --clickable-text-linen: var(--linen, #ebeaea);
  --clickable-text-deb: var(--deep-earthy-brown, #150202);

  --clickable-border-inclusive: var(--inclusive, #fff);
  --clickable-border-primary: var(--blue-1, #162f6a);
  --clickable-border-secondary: var(--blue-2, #214aab);
  --clickable-border-third: var(--blue-3, #5279d7);
  --clickable-border-forth: var(--blue-4, #a3bbf3);
  --clickable-border-fifth: var(--blue-5, #d2dfff);
  --clickable-border-linen: var(--linen, #ebeaea);
  --clickable-border-deb: var(--deep-earthy-brown, #150202);
  --clickable-border-transparent: #214aab00;

  --overlay-dark: rgba(0, 0, 0, 0.55);
  --overlay-light: rgba(255, 255, 255, 0.7);
  --blue-rgb: rgb(33 74 171 / 1);
}
html.theme-dark-contrast {
  --heading-color-1: var(--inclusive, #fff);

  --bg-inclusive: var(--black, #000);
  --bg-primary: var(--black, #000);
  --bg-secondary: var(--grey-3, #000);
  --bg-third: var(--black, #000);
  --bg-forth: var(--black, #000);
  --bg-fifth: var(--black, #000);
  --bg-linen: var(--black, #000);
  --bg-linen-2: var(--grey-3, #606060);
  --bg-image: var(--grey-3, #606060);

  --text-inclusive: var(--inclusive, #fff);
  --text-primary: var(--inclusive, #fff);
  --text-secondary: var(--linen, #fff);
  --text-third: var(--inclusive, #fff);
  --text-forth: var(--inclusive, #fff);
  --text-fifth: var(--inclusive, #fff);
  --text-linen: var(--linen, #ebeaea);
  --text-deb: var(--inclusive, #fff);

  --clickable-text-inclusive: var(--mustard-yellow, #ffc107);
  --clickable-text-primary: var(--mustard-yellow, #ffc107);
  --clickable-text-secondary: var(--mustard-yellow, #ffc107);
  --clickable-text-third: var(--mustard-yellow, #ffc107);
  --clickable-text-forth: var(--mustard-yellow, #ffc107);
  --clickable-text-fifth: var(--mustard-yellow, #ffc107);
  --clickable-text-linen: var(--mustard-yellow, #ffc107);
  --clickable-text-deb: var(--mustard-yellow, #ffc107);

  --clickable-border-inclusive: var(--mustard-yellow, #ffc107);
  --clickable-border-primary: var(--mustard-yellow, #ffc107);
  --clickable-border-secondary: var(--mustard-yellow, #ffc107);
  --clickable-border-third: var(--mustard-yellow, #ffc107);
  --clickable-border-forth: var(--mustard-yellow, #ffc107);
  --clickable-border-fifth: var(--mustard-yellow, #ffc107);
  --clickable-border-linen: var(--mustard-yellow, #ffc107);
  --clickable-border-deb: var(--mustard-yellow, #ffc107);
  --clickable-border-transparent: var(--mustard-yellow, #ffc107);

  --overlay-dark: rgba(0, 0, 0, 0.9);
  --overlay-light: rgba(255, 255, 255, 0.9);
}

body {
  background-color: var(--bg-inclusive) !important;
  color: var(--text-deb, #150202) !important;
}
.deep-earthy-brown {
  color: var(--deep-earthy-brown, #333) !important;
}
html.theme-dark-contrast .deep-earthy-brown-theme {
  color: var(--inclusive, #fff) !important;
}
html.theme-dark-contrast .form-control {
  color: var(--inclusive, #fff) !important;
}
html a .clickable-text-primary {
  color: var(--clickable-text-primary, #162f6a) !important;
}

::-webkit-scrollbar {
  width: 7px;
  height: 5px;
  border-radius: 50px !important;
}

::-webkit-scrollbar-track {
  background: #dedfdf;
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(
    180deg,
    var(--blue-3, #5279d7),
    var(--blue-5, #d2dfff)
  );
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: #a6aaaf;
}
html.theme-dark-contrast ::-webkit-scrollbar-track {
  background: #dedfdf;
}
html.theme-dark-contrast ::-webkit-scrollbar-thumb {
  background: linear-gradient(
    180deg,
    var(--grey-1, #606060),
    var(--grey-3, #606060)
  );

  border-radius: 10px;
}

html.theme-dark-contrast ::-webkit-scrollbar-thumb:hover {
  background: #a6aaaf;
}

html {
  font-size: 100%; /* base */
}

/* Line-height toggle */
html.lh-add body {
  line-height: 1.8 !important;
}

/* Text spacing toggle */
html.text-spacing body {
  letter-spacing: 0.12em !important;
  word-spacing: 0.16em !important;
  line-height: 1.8 !important;
}

/* =========================
   BASE TYPOGRAPHY RULES
   ========================= */

body {
  font-family:
    "Noto Sans",
    "Noto Sans Devanagari",
    "Noto Sans Bengali",
    "Noto Sans Gujarati",
    "Noto Sans Gurmukhi",
    "Noto Sans Kannada",
    "Noto Sans Malayalam",
    "Noto Sans Oriya",
    "Noto Sans Tamil",
    "Noto Sans Telugu",
    system-ui,
    -apple-system,
    sans-serif !important;

  line-height: 1.5 !important;
}

/* Prevent long ALL CAPS text */
.no-all-caps {
  text-transform: none !important;
}

/* =========================
   DESKTOP TYPOGRAPHY SCALE
   ========================= */

/* Heading 1 */
.h1-bold {
  font-size: 2.25rem !important; /* 36px */
  font-weight: var(--fw-bold) !important;
  line-height: 1.3 !important;
}
.h1-semibold {
  font-size: 2.25rem !important; /* 36px */
  font-weight: var(--fw-semibold) !important;
  line-height: 1.3 !important;
}
.h1-medium {
  font-size: 2.25rem !important; /* 36px */
  font-weight: var(--fw-medium) !important;
  line-height: 1.3 !important;
}

/* Heading 2 */
.h2-bold {
  font-size: 1.5rem !important; /* 24px */
  font-weight: var(--fw-bold) !important;
  line-height: 1.35 !important;
}
.h2-semibold {
  font-size: 1.5rem !important; /* 24px */
  font-weight: var(--fw-semibold) !important;
  line-height: 1.35 !important;
}
.h2-medium {
  font-size: 1.5rem !important; /* 24px */
  font-weight: var(--fw-medium) !important;
  line-height: 1.35 !important;
}

/* Heading 3 / Subtitle */
.h3-bold {
  font-size: 1.25rem !important; /* 20px */
  font-weight: var(--fw-bold) !important;
  line-height: 1.4 !important;
}
.h3-semibold {
  font-size: 1.25rem !important; /* 20px */
  font-weight: var(--fw-semibold) !important;
  line-height: 1.4 !important;
}
.h3-medium {
  font-size: 1.25rem !important; /* 20px */
  font-weight: var(--fw-medium) !important;
  line-height: 1.4 !important;
}

/* Paragraph 1 */
.p1-bold {
  font-size: 1rem !important; /* 16px */
  font-weight: var(--fw-bold) !important;
  line-height: 1.5 !important;
}
.p1-regular {
  font-size: 1rem !important; /* 16px */
  font-weight: var(--fw-regular) !important;
  line-height: 1.5 !important;
}

/* Paragraph 2 */
.p2-bold {
  font-size: 0.875rem !important; /* 14px */
  font-weight: var(--fw-bold) !important;
  line-height: 1.5 !important;
}
.p2-semibold {
  font-size: 0.875rem !important; /* 14px */
  font-weight: var(--fw-semibold) !important;
  line-height: 1.5 !important;
}
.p2-regular {
  font-size: 0.875rem !important; /* 14px */
  font-weight: var(--fw-regular) !important;
  line-height: 1.5 !important;
}

/* Small Text */
.text-sm-semibold {
  font-size: 0.75rem !important; /* 12px */
  font-weight: var(--fw-semibold) !important;
  line-height: 1.4 !important;
}
.text-sm-regular {
  font-size: 0.75rem !important; /* 12px */
  font-weight: var(--fw-regular) !important;
  line-height: 1.4 !important;
}

html.lh-add body {
  line-height: 1.9 !important;
}

html.lh-add .h1-bold,
html.lh-add .h1-semibold,
html.lh-add .h1-medium {
  line-height: 1.6 !important;
}

html.lh-add .h2-bold,
html.lh-add .h2-semibold,
html.lh-add .h2-medium {
  line-height: 1.6 !important;
}

html.lh-add .h3-bold,
html.lh-add .h3-semibold,
html.lh-add .h3-medium {
  line-height: 1.7 !important;
}

html.lh-add .p1-bold,
html.lh-add .p1-regular,
html.lh-add .p2-bold,
html.lh-add .p2-semibold,
html.lh-add .p2-regular {
  line-height: 1.9 !important;
}

html.lh-add .text-sm-semibold,
html.lh-add .text-sm-regular {
  line-height: 1.8 !important;
}

/* =========================
   MOBILE TYPOGRAPHY SCALE
   ========================= */

@media (max-width: 768px) {
  .h1-bold,
  .h1-semibold,
  .h1-medium {
    font-size: 1.5rem !important; /* 24px */
  }

  .h2-bold,
  .h2-semibold,
  .h2-medium {
    font-size: 1.25rem !important; /* 20px */
  }

  .h3-bold,
  .h3-semibold,
  .h3-medium {
    font-size: 1rem !important; /* 16px */
  }

  .p1-bold,
  .p1-regular {
    font-size: 0.875rem !important; /* 14px */
  }

  .p2-bold,
  .p2-semibold,
  .p2-regular {
    font-size: 0.75rem !important; /* 12px */
  }

  .text-sm-semibold,
  .text-sm-regular {
    font-size: 0.625rem !important; /* 10px */
  }
}

/* =========================
   TABLE TYPOGRAPHY RULES
   ========================= */

table {
  font-family: inherit !important;
}

table th {
  text-align: center !important;
  font-size: 0.875rem !important; /* 14px */
  font-weight: var(--fw-bold) !important;
  line-height: 1.5 !important;
}

table td:nth-child(1) {
  text-align: left !important;
 font-size: 0.875rem !important; /* 14px */
  font-weight: var(--fw-bold) !important;
  line-height: 1.5 !important;
}
table td {
  text-align: left !important;
  font-size: 0.875rem !important;
  font-weight: var(--fw-regular) !important;
  line-height: 1.5 !important;
}

table td.number,
table td.numeric {
  text-align: right !important;
}

/* =========================
   INTERACTION & ACCESSIBILITY
   ========================= */

/* a,
button {
  cursor: pointer;
}

a:hover,
button:hover {
  text-decoration: underline;
} */

.icon-padding {
  padding: 2px;
}

.am-box-shadow {
  box-shadow:
    rgba(0, 0, 0, 0.02) 0px 1px 3px 0px,
    rgba(27, 31, 35, 0.15) 0px 0px 0px 1px !important;
}

.am-border-linen {
  border: 1px solid var(--linen, #ebeaea) !important;
}
.am-br-12 {
  border-radius: 12px !important;
}
.am-border-theme {
  border: 1px solid var(--grey-1, #c6c6c6) !important;
}
html.theme-dark-contrast .am-border-theme {
  border: 1px solid var(--linen, #ebeaea) !important;
}

html.theme-dark-contrast .am-ctt-btb {
  border-top: 1px solid var(--linen) !important;
  border-bottom: 1px solid var(--linen) !important;
}
html.theme-dark-contrast .am-ctt-bar {
  border-top: 1px solid var(--linen) !important;
  border-bottom: 1px solid var(--linen) !important;
  border-right: 1px solid var(--linen) !important;
  border-left: 1px solid var(--linen) !important;
}
html.theme-dark-contrast .am-ctt-bt {
  border-top: 1px solid var(--linen) !important;
}
html.theme-dark-contrast .am-ctt-bb {
  border-bottom: 1px solid var(--linen) !important;
}
html.theme-dark-contrast .am-ctt-be {
  border-right: 1px solid var(--linen) !important;
}
html.theme-dark-contrast .am-ctt-bs {
  border-left: 1px solid var(--linen) !important;
}

.am-icon-style {
  height: 28px !important;
  padding: 2px !important;
}

.light-icon {
  filter: brightness(0) invert(1);
}
.toggle-light-icon {
  filter: brightness(0) invert(1);
}
html.theme-dark-contrast .toggle-light-icon {
  filter: brightness(0) saturate(100%) invert(78%) sepia(53%) saturate(748%)
    hue-rotate(1deg) brightness(101%) contrast(101%);
}

html.theme-dark-contrast .theme-icon {
  filter: brightness(0) saturate(100%) invert(78%) sepia(53%) saturate(748%)
    hue-rotate(1deg) brightness(101%) contrast(101%);
}
