html {
    --pst-font-family-base: 'Inter', sans-serif;
    --pst-font-family-heading: 'Inter', sans-serif;
    --pst-font-family-monospace: 'Courier', monospace;
}

html[data-theme="light"] {
    --pst-color-primary: black;
    --pst-color-secondary: #0A7D91;
}


html{
    --pst-color-secondary-highlight: #abdde6;
    --pst-color-table-row-hover-bg: #abdde6;
}

html[data-theme="dark"] {
    --pst-color-primary: white;
    --pst-color-secondary: #0A7D91;
}

.btn-primary {
    color: #212529;
    background-color: #0A7D91;
    border-color: #5bc2c2
}

.btn-primary:hover {
    color: #212529;
    background-color: #0A7D91;
    border-color: #8ad3d3
}

.btn-primary:focus,
.btn-primary.focus {
    box-shadow: 0 0 0 .2rem rgba(91, 194, 194, 0.5)
}

.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show>.btn-primary.dropdown-toggle {
    color: #212529;
    background-color: #0A7D91;
    border-color: #2e7c7c
}

.logo{
    width: 80%;
}

.search-button{
    display: none;
}

/* Footer Dynamic Text and Icon Colors */
.footer-text {
    color: var(--pst-color-text-base); /* Base text color */
}

.footer-icons a {
    color: var(--pst-color-primary); /* Primary theme color */
    transition: color 0.2s ease-in-out;
}

.footer-icons a:hover {
    color: var(--pst-color-secondary); /* Secondary theme color on hover */
}

.bd-main .bd-content .bd-article-container{
  max-width: 60em;
}

.sd-container, .sd-container-fluid, .sd-container-lg, .sd-container-md, .sd-container-sm, .sd-container-xl{
  padding: 0px;
}

/* .sd-row, .sd-row-cols-1, .sd-row-cols-xs-1, .sd-row-cols-sm-1, .sd-row-cols-md-1, .sd-row-cols-lg-2, .sd-g-1, .sd-g-xs-1, .sd-g-sm-1, .sd-g-md-1, .sd-g-lg-1{
  gap: 1rem;
} */

.sd-card{
    max-height: auto;
    margin-bottom: 1.5rem;
}

.cta-section{
  background-color: #00796B;
}

.hidden-section {
  display: none;
}

.recent-blogs {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  height: 40px;
}

.recent-blogs h2 {
  font-size: 24px;
  font-weight: 600;
  color: #333;
  margin: 0;
}

/* .btn {
  display: inline-block;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  border-radius: 6px;
  transition: background-color 0.3s, color 0.3s;
}

.btn-primary {
  background-color: #0077b6;
  color: #fff;
}

.btn-primary:hover {
  background-color: #005983;
} */

.custom-postlist {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  width: 100%;
}

.custom-postlist ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
  width: 100%;
}

.custom-postlist li {
  background: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 12px;
  padding: 20px;
  width: 100%;
  box-sizing: border-box;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transition: 
    transform 0.3s ease,
    box-shadow 0.3s ease;
  display: flex;
  flex-direction: column;
  margin-bottom: 1rem;
}

.custom-postlist li:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}

.custom-postlist li h2 {
  font-size: 20px;
  color: #333;
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 8px;
}

.custom-postlist li .post-date {
  font-size: 13px;
  color: #888;
  font-style: italic;
}

.custom-postlist li p {
  color: #666;
  font-size: 15px;
  line-height: 1.6;
  margin-bottom: 15px;
  flex-grow: 1;
}














/* Static color variables for light/dark mode */

/* Primary color */
:root {
    --pst-color-teal-50: #f4fbfc;
    --pst-color-teal-100: #e9f6f8;
    --pst-color-teal-200: #d0ecf1;
    --pst-color-teal-300: #abdde6;
    --pst-color-teal-400: #3fb1c5;
    --pst-color-teal-500: #0a7d91;
    --pst-color-teal-600: #085d6c;
    --pst-color-teal-700: #064752;
    --pst-color-teal-800: #042c33;
    --pst-color-teal-900: #021b1f;
  
    /* Secondary color */
    --pst-color-teal-sec-50: #E0F2F1;
    --pst-color-teal-sec-100: #B2DFDB;
    --pst-color-teal-sec-200: #80CBC4;
    --pst-color-teal-sec-300: #4DB6AC;
    --pst-color-teal-sec-400: #26A69A;
    --pst-color-teal-sec-500: #009688;
    --pst-color-teal-sec-600: #00897B;
    --pst-color-teal-sec-700: #00796B;
    --pst-color-teal-sec-800: #00695C;
    --pst-color-teal-sec-900: #004D40;
  
    /* Neutrals */
    --pst-color-gray-50: #f9f9fa;
    --pst-color-gray-100: #f3f4f5;
    --pst-color-gray-200: #e5e7ea;
    --pst-color-gray-300: #d1d5da;
    --pst-color-gray-400: #9ca4af;
    --pst-color-gray-500: #677384;
    --pst-color-gray-600: #48566b;
    --pst-color-gray-700: #29313d;
    --pst-color-gray-800: #222832;
    --pst-color-gray-900: #14181e;
  
    /* Accent color */
    --pst-color-teal-sec-50: #E0F2F1;
    --pst-color-teal-sec-100: #B2DFDB;
    --pst-color-teal-sec-200: #80CBC4;
    --pst-color-teal-sec-300: #4DB6AC;
    --pst-color-teal-sec-400: #26A69A;
    --pst-color-teal-sec-500: #009688;
    --pst-color-teal-sec-600: #00897B;
    --pst-color-teal-sec-700: #00796B;
    --pst-color-teal-sec-800: #00695C;
    --pst-color-teal-sec-900: #004D40;
  
    /* Foundation */
    --pst-color-white: #ffffff;
    --pst-color-black: #14181e;
  }
  
  /* Theme rules for light and dark mode */
  html[data-theme="light"] {
    --pst-color-primary: var(--pst-color-teal-500);
    --pst-color-primary-bg: var(--pst-color-teal-200);
    --pst-color-secondary: var(--pst-color-teal-sec-500);
    --pst-color-secondary-bg: var(--pst-color-teal-sec-100);
    --pst-color-accent: var(--pst-color-pink-500);
    --pst-color-accent-bg: var(--pst-color-pink-200);
    --pst-color-info: #276be9;
    --pst-color-info-bg: #dce7fc;
    --pst-color-warning: #f66a0a;
    --pst-color-warning-bg: #f8e3d0;
    --pst-color-success: #00843f;
    --pst-color-success-bg: #d6ece1;
    --pst-color-danger: #d72d47;
    --pst-color-danger-bg: #f9e1e4;
    --pst-color-text-base: #222832;
    --pst-color-text-muted: #48566b;
    --pst-color-heading-color: #ffffff;
    --pst-color-shadow: rgba(0, 0, 0, 0.1);
    --pst-color-border: #d1d5da;
    --pst-color-border-muted: rgba(23, 23, 26, 0.2);
    --pst-color-blockquote-notch: #677384;
    --pst-color-inline-code: #912583;
    --pst-color-inline-code-links: #085d6c;
    --pst-color-target: #f3cf95;
    --pst-color-table: #14181e;
    --pst-color-table-row-hover-bg: #d0ecf1;
    --pst-color-table-inner-border: #e5e7ea;
    --pst-color-background: #ffffff;
    --pst-color-on-background: #ffffff;
    --pst-color-surface: #f3f4f5;
    --pst-color-on-surface: #677384;
  }
  
  html[data-theme="dark"] {
    --pst-color-primary: var(--pst-color-teal-400);
    --pst-color-primary-bg: var(--pst-color-teal-800);
    --pst-color-secondary: var(--pst-color-teal-sec-400);
    --pst-color-secondary-bg: var(--pst-color-teal-sec-800);
    --pst-color-accent: var(--pst-color-pink-400);
    --pst-color-accent-bg: var(--pst-color-pink-800);
    --pst-color-info: #79a3f2;
    --pst-color-info-bg: #06245d;
    --pst-color-warning: #ff9245;
    --pst-color-warning-bg: #652a02;
    --pst-color-success: #5fb488;
    --pst-color-success-bg: #002f17;
    --pst-color-danger: #e78894;
    --pst-color-danger-bg: #4e111b;
    --pst-color-text-base: #ced6dd;
    --pst-color-text-muted: #9ca4af;
    --pst-color-heading-color: #14181e;
    --pst-color-shadow: rgba(0, 0, 0, 0.2);
    --pst-color-border: #48566b;
    --pst-color-border-muted: #29313d;
    --pst-color-blockquote-notch: #48566b;
    --pst-color-inline-code: #6e1c64;
    --pst-color-inline-code-links: var(--pst-color-teal-400);
    --pst-color-target: #675c04;
    --pst-color-table: #ffffff;
    --pst-color-table-row-hover-bg: #6e1c64;
    --pst-color-table-inner-border: #364150;
    --pst-color-background: #14181e;
    --pst-color-on-background: #222832;
    --pst-color-surface: #29313d;
    --pst-color-on-surface: #f3f4f5;
  }
  
  /* Additional light/dark mode rules for elements */
  /* img:not(.only-dark, .dark-light) {
    filter: brightness(0.8) contrast(1.2);
  }
  
  .bd-content img:not(.only-dark, .dark-light) {
    background-color: rgb(255, 255, 255);
    border-radius: 0.25rem;
  }
  
  .MathJax_SVG * {
    fill: var(--pst-color-text-base);
  }
  
  .only-dark,
  .only-dark ~ figcaption {
    display: none !important;
  }
  
  .only-light,
  .only-light ~ figcaption {
    display: none !important;
  } */