/**
Theme Name: Metagony Astral Mods
Author: Metagony
Author URI: http://metagony.com
Description: Heh.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: metagony-astral-mods
Template: astra
*/

/*
.barock-initialen {
	font-family: 'Barock Initialen', serif;
	font-size: 3em;
}

.goudy-initialen {
	font-family: 'Goudy Initialen', serif;	
	font-size: 3em;
}

.fraktur {
	font-family: 'Fette Haenel Fraktur', serif;
}
*/

/* MEDIEVALISE SECTION */
.entry-title, .nav-previous p, .nav-next p {
	font-family: 'Fette Haenel Fraktur', serif;
}

.comments-title {
    display: none;
}

.page-title {
	color: var(--ast-global-color-7) !important;
}

/* TITLE LINKS SECTION */
.nav-previous a:hover, .nav-next a:hover, .entry-title a:hover {
	color: var(--ast-global-color-6) !important;
}

/* INPUT SECTION */
input[type="text"], input[type="email"], input[type="password"], input[type="search"], textarea {
    background-color: var(--ast-global-color-8) !important; /* dark background #202020 */
    color: var(--ast-global-color-1) !important; /* red text for user input #FF3224 */
    border: 2px solid var(--ast-global-color-7) !important; /* amber border */
}

input[type="text"]::placeholder, input[type="email"]::placeholder, input[type="password"]::placeholder, .search-field::placeholder, #search-field::placeholder, input[type="search"]::placeholder, textarea::placeholder {
    color: var(--ast-global-color-7) !important; /* amber placeholder text */
}

input[type="text"]:hover, input[type="email"]:hover, input[type="password"]:hover, .search-field:hover, #search-field:hover, input[type="search"]:hover, textarea:hover {
    background-color: var(--ast-global-color-2) !important; /* magenta background */
}

input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, .search-field:focus, #search-field:focus, input[type="search"]:focus, textarea:focus {
    border: 2px solid var(--ast-global-color-2) !important; /* magenta border */
    background-color: var(--ast-global-color-8) !important; /* dark background #202020 */
}

.ast-search-submit i svg {
    fill: var(--ast-global-color-7); /* amber */
}

/* CHECKMARK SECTION */
input[type="checkbox"] {
  display: none;
}

input[type="checkbox"] + label:before {
  content: '';
  display: inline-block;
  vertical-align: middle;
  width: 20px; /* Checkbox size */
  height: 20px; /* Checkbox size */
  background-color: var(--ast-global-color-8); /* dark background */
  border: 2px solid var(--ast-global-color-7); /* amber border */
  margin-right: 8px; /* Space between the checkbox and label text */
  cursor: pointer;
}

input[type="checkbox"]:checked + label:before {
  background-color: var(--ast-global-color-8); /* dark background */
  border-color: var(--ast-global-color-7); /* aber border */
  content: "\2713"; /* Checkmark symbol */
  color: var(--ast-global-color-1); /* red mark for user input */
  font-size: 14px; /* Adjust size of the checkmark */
  text-align: center;
  line-height: 18px; /* Center the checkmark vertically */
}

input[type="checkbox"]:checked + label:before {
  background-color: var(--ast-global-color-8); /* dark background */
  border-color: var(--ast-global-color-7); /* amber border */
  content: "\2713"; /* Checkmark symbol */
  color: var(--ast-global-color-1); /* red mark for user input */
  font-size: 20px; /* Make the checkmark bigger */
  text-align: center;
  line-height: 20px; /* Adjust line height to vertically center the checkmark */
  text-shadow: -1px -1px 0 var(--ast-global-color-1), 1px -1px 0 var(--ast-global-color-1), -1px 1px 0 var(--ast-global-color-1), 1px 1px 0 var(--ast-global-color-1); /* Optional: Add text-shadow for a bolder look */
}

input[type="checkbox"] + label {
  cursor: pointer;
  color: var(--ast-global-color-7); 
}

/* BORDERS SECTION */
.ast-comment, .comment-respond {
	border-color: var(--ast-global-color-2) !important;
}

.nav-previous::after  {
	background-color: var(--ast-global-color-2) !important; /* magenta */
}

/* COMMENTS SECTION */
.comment .avatar {
    border: 4px solid var(--ast-global-color-7); /* amber outline */
}