/*Muokannut Heikki Jyrkönen, heikki.jyrkonen@siilinjarvi.fi, versio:080223*/

/*metsä 0, 139, 98, hex #008B62*/
/*sydän 242, 135, 126, hex #F2877E*/
/*saniainen 153, 201, 128, hex #99C980 */
/*kivi 198,198,198, hex #c6c6c6*/
/*betoni 100,100,100, hex #646464*/
/*vaalea tausta #f5f4f3*/
/*Montserrat*/


html {

  /*muuttujat*/
  --metsa: #008B62;
  --lampo: #ea4e55;
  --jarvi: #008ac3;
  --unelma: #bc8edf;
  --sydan: #F2877E;
  --saniainen: #99C980;
  --betoni: #404040;
  --kivi: #c6c6c6;
  --vaalea: #f5f4f3;

/*valittu pääväri ja lisäväri*/
  --paa:var(--metsa);
  --sivu:var(--saniainen);

  --fontfamily: "Montserrat";
  --bannerbackground: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));

  --themesubduedforeground: var(--sivu);

  --pagebackground: var(--vaalea);
  --theme-highlight-color-light: #aaa;
  --theme-highlight-color-lighter: #ddd;
  --themeforeground: var(--sivu);
  --reversethemebackground: var(--paa); /*käänteinen taustaväri*/
  --navopenbackground: rgba(0, 65, 24, 0.05);
  --focusboxshadow: 0 0 0 0.20rem rgba(0, 65, 24, 0.75), 0 0 0 0.35rem rgba(255,255,255, 0.65);
  --buttonbackgroundhover: var(--sivu);
  --buttonbackgroundfocus: var(--sivu);
  --buttonbackgroundactive: var(--sivu);

  --linkcolor: var(--paa); /*alivalikko tekstin väri*/

/*alivalikon tausta*/
  --navopenbackground:var(--paa) linear-gradient(rgba(255,255,255,0.95), rgba(255,255,255,0.95)); 
/*pystyviiva valikon vasemmalla puolella*/
  --stripewidth: 0rem; /*0.2rem*/

  --reverselinkbackground: var(--paa); /*valikko, väärinpäin*/
  --linkcoloremphasized: var(--sivu); /*edellisen tason valikko*/

  --themetextcolor:var(--betoni);

  --themeinfo:var(--sivu); /*punainen ilmoitus*/
  --themesuccess: var(--paa); /*vihreä, "muutokset tallennettu"*/
  
  --luonappitausta: var(--sivu);


--bannerbackground: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
--bannerlinkbackground: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
--bannerlinkforeground: var(--vaalea);
--bannerimage:  linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
--bannerimage:url("https://peda.net/siilinjarvi/ksk/uudet-logot/i20230209111004:file/download/7be71257a310f47f1837a0b7d936b63f0bc9ce39/Siilinjarvi-julisteet-graafinen-elementti%20%285%29.png");
--buttonboxshadow: 0rem 0.25rem 1rem rgba(0, 0, 0, 0);

--hoverboxshadow: 0.25rem 0.25rem 0.5rem rgba(0,0,0,0); /* hover effect to be used for buttons et al while hovered */

--focusboxshadow: 0 0 0 0.0rem rgba(0,87,168, 0.65), 0 0 0 0.0rem rgba(255,255,255, 0.65); /* visible focus effect, partially transparent link color with offset white outline to ensure enough contrast no both light and dark backgrounds to pass accessibility requirements, should have at least contrast ratio 4.5 against BOTH black and white backgrounds. */

/*sivun läpinäkyvyys*/
--themebackground: rgba(255,255,255,0.90); 

/*tilapalkin korkeus*/
  --statusbarheight: 2rem; 


/*tausta*/

/*vaakuna*/
  /*--pagebackgroundimage: url("https://peda.net/siilinjarvi/ksk/uudet-logot/t:file/download/ec620df224caa0cfe8a83468bee82c8aba651c3c/taustalogo_sopiva_25.png");*/

/*sydän sen sanoo*/
--pagebackgroundimage: url("https://peda.net/siilinjarvi/ksk/uudet-logot/i20230209114638:file/download/05ae3dafd71ba5f706370b95cef6d164e0f8ecff/Logo%2Bslogan-toissijainen-musta%20copy-RGB2.png");

/*--pagebackgroundimage: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0));*/
background-attachment: fixed;
background-repeat:no-repeat;
background-position: right bottom;
background-size:15%;
}


/*luo uutta sisältöä -nappi*/
.actions.important li.create a
{
color: #fff;
background-color: var(--luonappitausta);
}


/*etsi-laatikko*/
.searchnav .searchdocuments input[type="search"]
{
background-color: #fff;
border-color:var(--saniainen);
border-width:0.3rem;
color:var(--saniainen);
}

/*muropolku hover*/
.breadcrumbs  a:hover,
h1.toplevel a:hover,
header a:hover,
nav.main ul.sitemap a:hover
{
text-decoration: underline;
}

/*valikko hover*/
nav.main ul.sitemap .item a:hover
{
	background-color: rgba(0,0,0,0);
	color: var(--paa);
	box-shadow: 0.25rem 0.25rem 0.5rem rgba(0,0,0, 0);
}


/*alapalkin varjostus pois*/
body > footer
{
	background: var(--reversethemebackground) no-repeat;
	background-image: linear-gradient(to bottom, rgba(0,0,0, 0), rgba(0,0,0, 0), rgba(0,0,0, 0));
}


/*statusbarin varjostus pois KESKEN*/
.statusbar
{
	padding: 0 var(--gap);
	grid-area: statusbar;
	align-self: stretch;
	display: flex;
	align-items: center;
	height: var(--statusbarheight);

	color: var(--reversethemeforeground);
	background: var(--reversethemebackground) no-repeat;
	background-image: linear-gradient(to left, rgba(0,0,0, 0.1), rgba(0,0,0, 0.1), rgba(0,0,0, 0));

	position: relative; /* this is container for position absolute items within the statusbar */
}

/*bannerin varjostus pois*/
.banner > body > header > .banner { background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)); }

.banner {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
}


/*valintanappien värit*/
input[type="radio"]:checked, input[type="checkbox"]:checked {
  background: var(--sivu);
  border-color: var(--sivu);
}

/*Valitun valintanapin väri väri*/
input[type=radio]:checked:after,
input[type=checkbox]:checked:after
{
	background: rgba(0, 0, 0, 0);
	color: rgba(255,255,255,1);
}

/*valinnan ympäröivä varjo*/
input[type=radio]:focus,
input[type=checkbox]:focus
{
	/*box-shadow: var(--focusboxshadow);*/
        box-shadow: var(--focusboxshadow);
}


/*lihavoitu sivun otsikko bannerialueella*/
h1.toplevel {
  font-weight: 900;
}


/*toimintanappien väri*/
a.button:link, a.button:visited, a.button, span.button, li.button > a {
  border-color: var(--sivu);
  color: #fff;
  background-color: var(--sivu);
}

/*toimintanappien väri hover*/
a.button:hover, span.button:hover, li.button:hover > a {
  text-decoration: underline;
}

button.primary:hover{
  background-color: var(--reverselinkbackground);
  color: var(--reverselinkforeground);
  border-color: var(--reverselinkbackground);
  text-decoration: underline;
}
button.secondary:hover {
  color: var(--reverselinkbackground);
  background-color: var(--reverselinkforeground);
  border-color: var(--reverselinkbackground);
  text-decoration: underline;
}

a:link, a:visited{
  color:var(--sivu);
  text-decoration:none;
}
a:hover{

  text-decoration:underline;
}


/*modulin reunaviivan väri*/
main.page article.supermodule, main.page article.module, article.supermodule article.module, article.page.subscriptions > .main > article{
  border: solid var(--paa) var(--linewidth);
}

main.page article.supermodule > header, main.page article.supermodule > footer, article.supermodule article.module > header, article.supermodule article.module > footer, main.page article.module > header, main.page article.module > footer, article.page.subscriptions > .main > article > header, article.page.subscriptions > .main > article > footer {
  background: var(--reversethemebackground);
  color: var(--reversethemeforeground);
  padding: calc(0.5 * var(--gap)) var(--gap);
  margin: 0;
}


/*lukitun valintanapin väri mm lomakkeen tarkituksessa*/
.form input[disabled], .form textarea[disabled], .form input[type="radio"][disabled], .form input[type="radio"][disabled]:active, .form input[type="radio"][disabled]:hover, .form input[type="checkbox"][disabled], .form input[type="checkbox"][disabled]:active, .form input[type="checkbox"][disabled]:hover{
  color: var(--themetextcolor);
  background: #ccc;


}


/*logon reunaviivan poisto*/
a img.icon {
  box-shadow: var(--buttonboxshadow);
  border: 0px;
}