.popup {
    display: none;
    position: absolute;
    background-color: #add8e6;
    border: 1px solid #00e;
    text-indent: 0;
    padding: 5px;
    border-radius: 8px;
    width: auto;
    min-width: 40ch;
    max-width: 40ch;
    z-index: 1000;
    white-space: pre-wrap; /* Preserve whitespace and allow wrapping */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    word-wrap: break-word; /* Break words to prevent overflow */
    overflow-wrap: break-word; /* Ensure break-word behavior is supported */
    font-weight: normal; /* Ensure normal font weight */
}

.popup a {
    color: blue; 
    text-decoration: underline;
    word-break: break-all; /* Suggest breaking URLs at any character */
    overflow-wrap: break-word; /* Ensure long words break */
}

.hoverable {
    position: relative;
    display: inline-block;
    color: mediumblue;
    text-indent: 0;
}

.hoverable:hover .popup {
    display: block;
    left: 50%;
    transform: translateX(-50%);
    bottom: 100%;
    margin-bottom: 0;
}

div.gtelt0 {position: absolute; top: 0px; right: 10px; white-space: nowrap; }

.cmggtitle {display: inline-block; font-size: 1.5em; margin-top: 0.2em; font-weight:bold;}

/* The following was intended to be only put in lmgg.css, but some */
/* pages use only one or the other, so have ended up putting it here as well */
     /* Hide Google Translate Widget’s hover balloon */
#goog-gt-tt, .goog-tooltip, .goog-tooltip:hover { display: none !important; }  /* balloon */


/* For checkbox in TTTs */
/* Hide the 2nd column when the class is present */
.table--hide-mhd tr > td:nth-child(2),
.table--hide-mhd tr > th:nth-child(2) {
  display: none;
}