/* Import Roboto Mono font from Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap');

/* Apply Roboto Mono font to body */
body {
  font-family: 'Roboto Mono', monospace !important;
}

/* Force text wrapping to respect Solana template layout */
.about-entity .about-contents * {
  word-wrap: break-word;
  overflow-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
}

/* Fixed navbar */
.navbar {
  position: fixed !important;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1030;
  background-color: #FEFEFE !important;
  border-bottom: 0.5px solid #ddd !important;
}

/* Add padding to body and content areas to account for fixed navbar */
body {
  padding-top: 40px !important;
  background-color: #FFFAEF !important;
}

#quarto-content,
.quarto-title-block,
main {
  padding-top: 20px !important;
}

/* Solana template styling improvements */

/* Add horizontal rule after title/name */
.about-entity .about-links {
  margin-top: 0.1rem;
  padding-top: 1rem;
  border-top: 0.5px solid #000;
  max-width: 250px;
}

/* Make social link buttons smaller */
.about-entity .about-links a {
  font-size: 0.875rem !important;
  padding: 0.375rem 0.75rem !important;
}

/* Small screen layout: center everything */
@media (max-width: 991px) {
  /* Center the profile image */
  .about-entity img {
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 1rem !important;
  }
  
  /* Center the title */
  .about-entity .about-sep h1 {
    text-align: center !important;
  }
  
  /* Center the social links and remove left border */
  .about-entity .about-links {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    border-top: 0.5px solid #000;
    max-width: 250px;
  }
  
  /* Center link buttons */
  .about-entity .about-links a {
    display: inline-block !important;
    margin: 0.25rem !important;
  }
}

/* Force Solana layout: separate rows for header and content */
@media (min-width: 992px) {
  /* Break the header (title + image) into separate row */
  .about-entity .about-sep {
    display: block !important;
    width: 100% !important;
    clear: both !important;
  }
  
  /* Profile image should float right in header row - bring closer to header */
  .about-entity img {
    display: block !important;
    float: none !important;
    margin-top: 0 !important;
  }
  
  /* Reduce spacing in the header area */
  .about-entity .about-sep.row {
    margin-top: 0 !important;
  }
  
  /* Content below in its own row */
  .about-entity .about-contents {
    display: block !important;
    width: 150% !important;
    clear: both !important;
    margin-top: 2rem !important;
  }
}
