/*
 * Dark theme (エレガントなお嬢様) by @mei23
 * Light theme (Lavender) by @sokuyuku
 * Source for both can be found at https://github.com/mei23/misskey
 */
body {
    background-color: #f8cfd2;
    color: rgb(206, 147, 191);
}
a {
    color: rgb(206, 147, 191);
}
a:visited {
    color: rgb(206, 147, 191);
}
.center {
    text-align: center;
}
.wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.wrap.languages {
    flex-wrap: nowrap;
    margin-bottom: 20px;
}
#could_not_switch_languages_text {
    color: red;
}
.item {
    width: 100%;
    height: 150px;
}
.item-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 450px;
    margin: 5px 10px;
    gap: 10px;
}
.language, .switch_languages {
    display: flex;
}
.language {
    margin: 0px 10px;
}
.switch_languages {
    margin: 0px 5px;
}
#switchbutton {
    white-space: nowrap;
}
button {
    background-color: #ce93bf;
    color: #ffffff;
    font-size: 1rem;
    padding: 4px 10px;
    border: 2px solid #888888;
}
input, select, textarea {
    width: 100%;
    font-size: 1rem;
    padding: 4px;
    border: 2px solid #888888;
}
textarea {
    resize: vertical;
    height: 5rem;
    font-family: sans-serif;

    /* Stretch to form width */
    width: 100%;
}
input:focus, select:focus, textarea:focus, button:focus {
    border-color: #faf4f8;
    outline: 1px solid #faf4f8;
}
body {
    justify-content: center;
    font-family: sans-serif;
}
#definitions_and_translations {
    display: grid;
    margin: auto;
    width: 1100px;
    gap: 10px;
    grid-template-areas: "definitions translations";

}
.def_type {
    color: #007979;
    text-transform: capitalize;
}
.syn {
    color: #804700;
}
.syn_type {
    color: #007979;
}
.use_in_sentence {
    color: #009902;
}
.definitions li:not(:last-child) {
    margin-bottom: 1rem;
}
@media screen and (max-width: 1200px) {
    #definitions_and_translations {
	display: grid;
	width: 90vw;
	grid-template-areas:
	    "definitions definitions"
	    "translations translations";
    }
}
div.definitions {
    grid-area: definitions;
}
div.translations {
    grid-area: translations;
}
a {
    text-decoration: none;
}
@media screen and (prefers-color-scheme: dark) {
    body {
        background-color: #700000;
        color: #ffffff;
    }
    #could_not_switch_languages_text {
        color: yellow;
    }

    a:visited {
        color: #18c018;
        text-decoration: none;
    }
    a {
        color: #18c018;
        text-decoration: none;
    }
    button {
	background-color: #18c018;
	color: #ffffff;
    }
    input, textarea {
        background-color: #5b0000;
        border-color: #202020;
        color: #b3784b;
    }
    select, option {
	background-color: #5b0000;
	color: #ffffff;
    }
    .def_type {
        color: #5d590c;
        text-transform: capitalize;
    }
    .syn {
        color: #bc8080;
    }
    .syn_type {
        color: #358611;
    }
    .use_in_sentence {
        color: #d7b081;
    }
}