@import "layout.css";

/* https://paletton.com/#uid=7001R0kpuBmfjNMkLGVvUyxy5oW */

:root {
    --color-white: #ffffff;
    --color-c-gray: #cccccc;
    --color-9-gray: #999999;
    --color-6-gray: #666666;
    --color-3-gray: #333333;
    --color-black: #000000;

    --post-gradient-start: #ffffff99;
    --post-gradient-end: #cccccc66;

    --color-minecraft: #7AEA7A11;
    --color-rocketleague: #FFFD8511;
    --color-music: #FF858511;

    --color-primary-0: #FF3434;	/* Main Primary color */
    --color-primary-1: #FF8585;
    --color-primary-2: #FF5A5A;
    --color-primary-3: #FF0101;
    --color-primary-4: #C70000;
    
    --color-secondary-1-0: #FFFC34;	/* Main Secondary color (1) */
    --color-secondary-1-1: #FFFD85;
    --color-secondary-1-2: #FFFD5A;
    --color-secondary-1-3: #FFFC01;
    --color-secondary-1-4: #C7C400;
    
    --color-secondary-2-0: #852FBB;	/* Main Secondary color (2) */
    --color-secondary-2-1: #B679DC;
    --color-secondary-2-2: #9A4FCA;
    --color-secondary-2-3: #710BB1;
    --color-secondary-2-4: #540785;
    
    --color-complement-0: #2CD62C;	/* Main Complement color */
    --color-complement-1: #7AEA7A;
    --color-complement-2: #4EDF4E;
    --color-complement-3: #01D001;
    --color-complement-4: #009F00;
}

a {
    color: var(--color-secondary-1-0);
}

a:hover {
    color: var(--color-secondary-1-1);
}

body {
    background-image: linear-gradient(var(--color-black) , var(--color-3-gray) );
    color: var(--color-primary-2);
} 

img {
    border-color: var(--color-9-gray);
}

#content {
    background-color: var(--color-c-gray);
}

#pagetitle {
    background-color: var(--color-secondary-2-4);
}

#pagetitle h1, #pagetitle h1 a {
    color: var(--color-primary-0);
}

#pagetitle h3 {
    color: var(--color-secondary-1-0);
}

#menu {
    color: var(--color-primary-4);
    background-color: var(--color-secondary-1-2);
}

#menu label {
    color: var(--color-primary-4);
}

.menubutton{
    border-color: var(--color-secondary-2-4);
    background-color: var(--color-secondary-2-1);
}

.menubutton a {
    color: var(--color-black);
}

.menubutton:hover {
    color: var(--color-black);
    background-color: var(--color-primary-1);
    border-color: var(--color-primary-4);
}

.menubutton:hover a {
    color: var(--color-black);
}

.dlbutton{
    border-color: var(--color-secondary-2-4);
    background-color: var(--color-secondary-2-1);
}

.dlbutton:hover {
    color: var(--color-black);
    background-color: var(--color-primary-1);
    border-color: var(--color-primary-4);
}

#posts {
    background-color: var(--color-white);
}

div.dateheader {
    color: var(--color-secondary-2-4);
    border-left-color: var(--color-primary-0);
    border-bottom-color: var(--color-primary-0);
}

.post {
    background-image: linear-gradient(var(--post-gradient-start), var(--post-gradient-end));
}

div.minecraft {
    background-color: var(--color-minecraft);
}

div.rocketleague {
    background-color: var(--color-rocketleague);
}

div.music {
    background-color: var(--color-music);
}

.posttitle {
    color: var(--color-primary-4);
}

.postbody {
    color: var(--color-black);
}

.postbody a {
    color: var(--color-secondary-2-3);
}

.postbody a:hover {
    color: var(--color-primary-4);
}

.postbody h3 {
    color: var(--color-secondary-2-4);
}

.postbody h3 a {
    color: var(--color-secondary-2-3);
}

.postbody h3 a:hover {
    color: var(--color-primary-4);
}

.postfoot .links {
    border-color: var(--color-complement-4);
    color: var(--color-secondary-2-3);
    background-color: var(--color-complement-1);
}

.postfoot .links a {
    color: var(--color-secondary-2-3);
}

.postfoot .links a:hover {
    color: var(--color-secondary-2-4);
}

#pagefoot {
    background-color: var(--color-secondary-2-4);
    color: var(--color-primary-0);
}

#pagefoot a {
    color: var(--color-3-gray);
}

span.playerName {
    color: var(--color-primary-4);
}

div.tableGrid table.resultTable {
    background-color: #FFFFFFCC;
    border: 1px solid #333333;
}

.resultTable td, .resultTable th {
    border: 0px solid #006;
}

.resultTable td.score {
    background-color: #B679DC33;
}

.resultTable td.winningscore {
    background-color: #B679DC99;
}

.resultTable td.unplayed {
    background-color: #cccccc99;

}

section.pdfSelector input + label {
    border: 1px solid var(--color-secondary-2-4);
    background-color: var(--color-complement-1);
    color: #333333;
}

section.pdfSelector input:checked + label {
    border: 1px solid var(--color-primary-4);
    background-color: var(--color-secondary-1-1);
}
