html, body {
    background-color: #F2F3F4;
    height: 100%;
}


/* .content { */
/*   padding: 0 18px; */
/*   display: none; */
/*   overflow: hidden; */
/*   background-color: #f1f1f1; */
/* } */

.custom-button {
    display: flex;
    width: 26px;
    height: 26px;
    align-items:center;
    justify-content:center;
    padding: 5px;
}

.custom-button:hover {
    background-color: lightgray;
    border-radius: 50%;
}

/* Add a smooth transition for collapsing/expanding */
.content {
    max-height: 0;
    overflow: hidden;
    /* transition: max-height 0.3s ease-out; */
}
.content.expanded {
    max-height: 500px; /* Adjust as needed, should be larger than content */
    /* transition: max-height 0.5s ease-in; */
}

a.custom-hover-color:hover { 
  background-color: #621a0a !important;
  color: white !important;
}

.custom-hover-arXiv { 
    color: #b61a20 !important; 
    border: 2px solid #b61a20 !important;
}

.custom-hover-arXiv:hover { 
  background-color: #b61a20 !important;
  color: white !important;
}

.custom-hover-JHEP { 
    color: #7a710b !important; 
    border: 2px solid #7a710b !important;
}

.custom-hover-JHEP:hover { 
    background-color: #7a710b !important;
    color: white !important;
}

.custom-hover-PRD { 
    color: #00528a !important; 
    border: 2px solid #00528a !important;
}

.custom-hover-PRD:hover { 
    background-color: #00528a !important; 
    color: white !important;
}

.custom-hover-ApJL { 
    color: #85a6d8 !important; 
    border: 2px solid #85a6d8 !important;
}

.custom-hover-ApJL:hover { 
    background-color: #85a6d8 !important; 
    color: white !important;
}

.custom-hover-PRL { 
    color: #00b58d !important; 
    border: 2px solid #00b58d !important;
}

.custom-hover-PRL:hover { 
    background-color: #00b58d !important; 
    color: white !important;
}

.custom-hover-JCAP { 
    color: #FFB62E !important; 
    border: 2px solid #FFB62E !important;
}

.custom-hover-JCAP:hover { 
    background-color: #FFB62E !important; 
    color: white !important;
}


.year-container {
  display: flex; /* Enables Flexbox layout */
  align-items: center; /* Vertically aligns items (text and rule) in the middle */
  width: 100%; /* Optional: Set a width for the container */
  font-size: 28px;
}

.year-text {
  /* Styles for the "2025" text */
  margin-right: 0.75em; /* Adds space between the text and the rule */
  /* You can add more styles like font-size, font-weight, etc. */
  /* font-weight: bold; */
}

.horizontal-rule {
  flex-grow: 1; /* Allows the rule to take up the remaining horizontal space */
  height: 2px; /* Sets the thickness of the rule */
  /* background-color: #808080; /* Sets the color of the rule */ */;
  background-color: #000000; /* Sets the color of the rule */
}