/*********************************************
* Variables *
*********************************************/
:root {
  --orange-title-color: rgba(253, 126, 20, 0.1);
  --orange-border-color: #fd7e14;
  --note-title-color: rgba(68,138,255,.1);
  --note-border-color: #659fdc;
  --warning-title-color: rgba(220,53,69,.1);
  --warning-border-color: #dc3545;
  --hint-title-color: rgba(255,193,7,.2);
  --hint-border-color: #ffc107;
  --caution-title-color: rgba(253,126,20,.1);
  --caution-border-color: #fd7e14;
  --grey-title-color: rgba(204,204,204,.2);
  --grey-border-color: #ccc;
  --example-title-color: rgba(235, 247, 236, 1);
  --example-border-color: #29A745;
  --exercise-title-color: rgba(253, 126, 20, 0.2);
  --exercise-border-color: #fd7e14;   
}

/*********************************************
* Main body *
*********************************************/


/*********************************************
* theorem *
*********************************************/
div.theorem {
	border-color: var(--hint-border-color);
	background-color: transparent;
}

div.theorem p.admonition-title {
	background-color: var(--hint-title-color);
}

/*********************************************
* definition *
*********************************************/
div.definition {
  background-color: transparent;
}

/*********************************************
* remark *
*********************************************/
div.remark {
  background-color: transparent;
}

/*********************************************
* example *
*********************************************/
div.example {
	border-color: var(--example-border-color);
	background-color: none;
}

/* div.example p.admonition-title {
	background-color: var(--example-title-color);
} */

div.example p.admonition-title:after {
  /* content: "\f0cb"; the fa-list-ol icon */
  content: "\f03a"; 
}

/*********************************************
* exercise *
*********************************************/
div.exercise {
    border-color: var(--exercise-border-color);
    background-color: transparent;
}

div.exercise p.admonition-title {
    background-color: var(--exercise-title-color);
}

/* Remove content box */
div.exercise p.admonition-title::before {
  content: none;
}

div.exercise p.admonition-title:after {
  color: black;
  /* the fa-pencil icon */
  /* content: "\f303";  */

  /* the fa-pen-to-square icon */  
  content: "\f044"; 
}


/*********************************************
* question *
*********************************************/
div.question {
  border-color: var(--caution-border-color);
  background-color: transparent;
}

div.question p.admonition-title {
  background-color: rgb(250, 185, 124, 0.3);
}

div.question  p.admonition-title:after {
  color: rgb(248, 100, 74);
  content: "\f059"; /* the fa-question icon */  
}

/*********************************************
* solution *
*********************************************/
div.solution {
  background-color: transparent;
}

div.solution  p.admonition-title:after {
  /* color: green; */
  /* the fa-reply icon */
  /* content: "\f3e5";     */

  /* the fa-key icon */
  content: "\f084";      
}

/*********************************************
* Customise Icon *
*********************************************/
div.admonition.admonition-icon > .admonition-title:after {
  content: "\f24e"; /* the fa-scale icon */  
}


/* <your static path>/custom.css */

div.admonition.admonition-youtube {
  border-color: hsl(0, 100%, 50%); /* YouTube red */
}
div.admonition.admonition-youtube > .admonition-title {
  background-color: hsl(0, 99%, 18%);
  color: white;
}
div.admonition.admonition-youtube > .admonition-title:after {
  color: hsl(0, 100%, 50%);
  content: "\f26c"; /* fa-solid fa-tv */
}

/*********************************************
* Footer *
*********************************************/
.footer-start__start, .footer-start__end {
  flex-direction: row;
}

/*********************************************
* hyperlink *
*********************************************/
a:link, a:link * {
  text-decoration: none !important;
}
/*
a:link {
  color: #176DE8;
  background-color: transparent;
  text-decoration: none !important;
}

a:visited {
  color: #176DE8;
  background-color: transparent;
  text-decoration: none;
}

a:hover {
  background-color: rgba(255, 166, 0, 0.1);
  text-decoration: none;
}
*/

/* a:active {
  color: red;
  background-color: rgba(255, 166, 0, 0.1);
  text-decoration: none;
} */

/* .prev-next-subtitle {
  color: red;
}

.prev-next-title {
  color: blue;
} */
/*********************************************
* header style *
*********************************************/
/* h1 {
  color: #000000 !important;
} */


/*********************************************
* text alignment *
*********************************************/
/* p {
  text-align: justify;
} */

/*********************************************
* table styling *
*********************************************/
thead {
  background-color: rgba(210,204,204,0.8);
}

tr:nth-child(even) {
  background-color: rgba(210,204,204,.3);
}

td {
  border: 0;
}

