/*
 * Copyright 2024 efekos
 *
 * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
 * documentation files (the “Software”), to deal in the Software without restriction, including without limitation the
 * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit
 * persons to whom the Software is furnished to do so, subject to the following conditions:
 *
 * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE
 * WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
 * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR
 * OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 */

@import "./social_icons.css";

body {
    background-color:%% colorTheme . general . backgroundColor%%;
    color:%% colorTheme . general . textColor%%;
    font-family:%% colorTheme . general . font%%;
    padding: 3rem;
    font-size: 1.5rem;
}

h1#name {
    font-family:%% colorTheme . general . nameFont%%, %% colorTheme . general . font%%;
    color:%% colorTheme . general . nameColor%%;
    font-size: 5rem;
    text-align: center;
    filter: drop-shadow(0rem 0rem 16rem%% colorTheme.general.nameColor%%);
    will-change: filter;
    transition: filter 200ms;
    user-select: none;
    margin-bottom: 1rem;
}

h1#name:hover {
    filter: drop-shadow(0rem 0rem 2rem%% colorTheme.general.nameColor%%);
}

h2#title {
    text-align: center;
    font-size: 2rem;
    font-family:%% colorTheme . general . titleFont%%;
}

a {
    text-decoration: none;
    color:%% colorTheme . general . linkColor%%;
}

.btn {
    font-size: 1.5rem;
    border-radius: 1rem;
    color: white;
    font-family:%% colorTheme . buttons . font%%, %% colorTheme . general . font%%;
    font-weight: 650;
    will-change: filter;
    transition: filter 1.5s;
    cursor: pointer;
    padding: 2rem 3rem;
    border: 0;
}

.btn-blue {
    background:%% colorTheme . buttons . blueColor%%;
}

.btn-blue:hover {
    filter: drop-shadow(0rem 0rem 16rem%% colorTheme.buttons.

    blueColor:last

% %);
}


.btn-green {
    background:%% colorTheme . buttons . greenColor%%;
}

.btn-green:hover {
    filter: drop-shadow(0rem 0rem 16rem%% colorTheme.buttons.

    greenColor:last

% %);
}

.btn-red {
    background:%% colorTheme . buttons . redColor%%;
}

.btn-red:hover {
    filter: drop-shadow(0rem 0rem 16rem%% colorTheme.buttons.

    redColor:last

% %);
}


.btn-orange {
    background:%% colorTheme . buttons . orangeColor%%;
}

.btn-orange:hover {
    filter: drop-shadow(0rem 0rem 16rem%% colorTheme.buttons.

    orangeColor:last

% %);
}

.btn-download {
    color:%% colorTheme . buttons . downloadTextColor%%;
    padding: 1rem;
    border-radius: 0.5rem;
    background-color:%% colorTheme . buttons . downloadBackgroundColor%%;
    will-change: background-color;
    transition: background-color 200ms;
}

.btn-download:hover {
    background-color:%% colorTheme . buttons . downloadBackgroundHoverColor%%;
}

br {
    user-select: none;
}

code:not([class]) {
    background-color:%% colorTheme . markdown . inlineCodeBackgroundColor%%;
    padding: 0.1rem 0.2rem;
    border-radius: 0.5rem;
}

footer {
    margin-top: 30rem;
    min-height: 15rem;
}


.search-bar {
    background-color:%% colorTheme . projects . searchBarBackgroundColor%%;
    border-radius: 3rem;
    max-width: 25rem;
}

.search-bar-input {
    background-color: transparent;
    color:%% colorTheme . projects . searchBarTextColor%%;
    margin-left: 1rem;
    border: 0;
    font-size: 1.5rem;
    margin-bottom: 0;
    margin-top: 0.4rem;
    padding: 1rem;
    vertical-align: middle;
    width: 80%;
}

.btn {
    user-select: none;
}

.search-bar-input:focus {
    outline: none;
}


.top {
    --offset: 50px;

    position: sticky;
    bottom: 20px;
    margin-right: 10px;
    place-self: end;
    margin-top: calc(250vh + var(--offset));
}

.lang-dropdown {
    position: relative;
}

.lang-dropdown select {
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
    font-size: 18px;
    padding: 5px 10px 5px 10px;
    background-color: #2e2e2e;
    border-radius: 5px;
    color:%% colorTheme . general . textColor%%;
    cursor: pointer;
    outline: none;
    max-width: 8rem;
}

.lang-dropdown select:focus {
    border-radius: 5px;
}

.lang-dropdown::after {
    content: "";
    position: absolute;
    pointer-events: none;
    top: 50%;
    right: 10px;
    transform: translate(0, -50%);
    width: 12px;
    height: 12px;
    background-color:%% colorTheme . general . textColor%%;
    clip-path: polygon(8% 17%, 0% 25%, 50% 84%, 100% 25%, 92% 17%, 50% 65%);
}


.tooltip {
    position: relative;
    display: inline-block;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: fit-content;
    background-color: rgb(60, 60, 60);
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
    margin-bottom: 0.5rem;

    position: absolute;
    z-index: 1;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

.tooltip .tooltiptext {
    width: fit-content;
    padding: 0.5rem;
    bottom: 100%;
    left: 50%;
    margin-left: -60px;
}

.contributor {
    border-radius: 3rem;
    border: 1.5px gray solid;
    margin: 0.2rem;
}