/* Extra CSS found in old version */
/* From administrator/views/import/tmpl/default.php */
.btn-group, .btn-group-vertical {
    display: inline-flex;
    position: relative;
    vertical-align: middle;
    margin-left: 5px;
}
.dcnav .sidebar-nav {
    padding: 0;
    margin: 10px 0;
    background: #fff;
}
.dcnav .flex-column {
    flex-direction: row !important;
}
.dcnav .sidebar-nav li {
    font-size: .9rem;
    font-weight: 700;
    display: inline-block;
    margin: 0 5px;
    padding: 5px 10px;
}

/* CSS for the new wikipedia display */

.wiki-grid-container {
    display: grid;
    grid-auto-flow: column;
    grid-gap: 20px;
    grid-template-columns: repeat(3, auto); 
    grid-template-rows: repeat(3, auto); 
}

.wiki-letter-section {
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

h2.wiki-h2 {
    margin: 0 0 10px;
    color: #333;
}

ul.wiki-ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.wiki-word-item {
    cursor: pointer;
    color: #007BFF;
    margin-bottom: 10px;
    display: inline-block;
}

.wiki-word-item:hover {
    text-decoration: underline;
}

.wiki-definition {
    display: none;
    margin-left: 20px;
    color: #555;
}

@media screen and (max-width: 768px) {
    .wiki-grid-container {
        display: grid;
        grid-auto-flow: column;
        grid-gap: 20px;
        grid-template-columns: repeat(2, auto); 
        grid-template-rows: repeat(2, auto); 
    }
}
@media screen and (max-width: 480px) {
    .wiki-grid-container {
    display: grid;
    grid-auto-flow: column;
    grid-gap: 15px;
    grid-template-columns: repeat(1, auto); 
    grid-template-rows: repeat(3, auto); 
}
}
/* new wikipedia display CSS ends */
/* To make the inline help button obvious at the back end */
#toolbar-inlinehelp .button-inlinehelp {
    display: inline-block !important; /* Override d-none */
}