/*
 ****************************************************************************
 ** RETROGEEK RELOADED SOURCE FILE                                         **
 ** Copyright (c) 2021-2022 Tuxlog                                         **
 ** Copyright (c) 2024 JeremyStarTM & Contributors                         **
 ** Licensed under the GNU General Public License v3                       **
 ****************************************************************************
 ** This program is free software: you can redistribute it and/or modify   **
 ** it under the terms of the GNU General Public License as published by   **
 ** the Free Software Foundation, either version 3 of the License, or      **
 ** (at your option) any later version.                                    **
 **                                                                        **
 ** This program is distributed in the hope that it will be useful,        **
 ** but WITHOUT ANY WARRANTY; without even the implied warranty of         **
 ** MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the          **
 ** GNU General Public License for more details.                           **
 **                                                                        **
 ** You should have received a copy of the GNU General Public License      **
 ** along with this program.  If not, see <https://www.gnu.org/licenses/>. **
 ****************************************************************************
 ** searchform.php (Search form template)                                  **
 **                                                                        **
 ** This source file is a template for displaying search forms.            **
 ****************************************************************************
*/

/* whenever we need to clear floats */
.clearfix { content:""; display:table; clear:both; }

/* position post thumbnails */
.retrogeek-thumbnail {float:left; padding-right: 20px;}

body {  background-color: var(--rg-background-color);
	color: var(--rg-text-color);
}

.site-branding,
.asite-description,
.site-info,
.site-title {
	align-items: center;
	justify-content: center;
	display: flex;
}

@media (max-width: 700px) {
	#asciiartlogo { font-size: 10px; }
}

.site-description {margin-bottom: 30px;}

.site-title > a >pre { font-size:16px;}

/* Hide short text by default (resolution > 600px) */
.site-title-mob { display: none; }

/* When resolution <= 600px, hide full text and show short text */
@media (max-width: 600px) {
	.site-title { display: none; }
	.site-title-mob { display: inline-block; }
}

/* some space */
.site-footer { margin-top: 50px; }
.entry-right { padding-bottom: 55px;}


/* code tag wrap amd color */
code { display: block; overflow-x: auto; padding: .5em; background: #444444; }

/* add border to sticky post */
.sticky { border: #ffffff solid 2px; padding:10px; margin-bottom: 30px;}

/* make quotes italic */
blockquote { font-style: italic; }

/* custom logo */
.custom-logo { max-width: 170px; }


/* Menu bar start */
.navigation{ position: relative; z-index: 1000; padding: 11px 0 0; }
.nav{ margin: 0; padding: 0; }
div.main-nav { background-color: #444444; min-height: 31px; margin: 0 0 25px; }

.nav li{
	float: left;
	font-size: 16px;
	line-height: 26px;
	margin: 0 38px 0 0;
	position: relative;
	list-style-type: none;
	background-color: #444444;
}

.nav li:last-child{
	margin: 0;
}

.nav li a{
	color: var(--rg-text-color);
	display: block;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.nav li a:hover, .nav li.current_page_item a{
	color: var(--rg-link-text-color);
}

.nav li ul{
	position: absolute;
	width: 220px;
	top: 23px;
	left: 0;
	background-color: #444444;
	transform: scaleY(0);
	transform-origin: 0 0 0;
	transition: all 0.3s ease 0s;
	visibility: hidden;
}

.nav li:hover > ul,
.nav li:focus-within ul{
	transform: scale(1);
	visibility: visible;
	z-index: 1;
}

.nav li ul li{
	float: none;
	margin: 0;
	font-size: 14px;
	line-height: 22px;
	border-top: 1px solid #aaaaaa;
}

.nav li ul li a{
	padding: 10px 10px;
	color: var(--rg-text-color);
}
.nav li ul li a:hover{
	color: var(--rg-link-text-color);
}
/* end menubar */

/*
 * style mobile top navigation menu
 */
.toggle-topnav {
	display: none !important;
}

@media screen and ( max-width: 580px ) {
	.main-nav { display: none; }
	.toggle-topnav {
		display: inline-block !important;
		margin: 15px 15px 0px 15px;
		font-size: 2em;
		transition: color linear 0.15s;
	}

	a.toggle-topnav:link,
	a.toggle-topnav:visited,
	a.toggle-topnav:hover,
	a.toggle-topnav:active {
		text-decoration: none;
		color: var(--rg-text-color);
	}

	.sub-menu { display: block !important; }
}

.top-nav {
	display: block;
	position: relative;
	background: #444;
	text-align: left;
}


.top-nav ul {
	display: none;
	overflow: auto;
	top: 0px;
	right: 0px;
	z-index: 999;
	padding-right: 15px;
	background: #444;
	font-size: 100% !important;
	margin: 0.5rem 0.5rem 0.1rem 0.1rem;
}

.top-nav ul li {
	float: none;
	display: block;
	position: relative;
	top: 0px;
	right: -15px;
	min-width: 200px;
	background: #444;
	text-align: left;
}

.top-nav li:after {
	content: none;
}


/* position footer widget areas */
.widget-area { float:left; width:33%;}
@media (max-width:767px) {
	.widget-area{ position:relative; width:100%; }
}


/* WordPress classes */
.alignleft { display: inline; float: left; }
.alignright { display: inline; float: right; }
.aligncenter { display: block; margin-right: auto; margin-left: auto; }
blockquote.alignleft, .wp-caption.alignleft, img.alignleft { margin: 0.4em 1.6em 1.6em 0; }
blockquote.alignright, .wp-caption.alignright, img.alignright { margin: 0.4em 0 1.6em 1.6em; }
blockquote.aligncenter, .wp-caption.aligncenter, img.aligncenter { clear: both; margin-top: 0.4em; margin-bottom: 1.6em; }
.wp-caption.alignleft, .wp-caption.alignright, .wp-caption.aligncenter { margin-bottom: 1.2em; }
.wp-caption-text { color: var(--rg-text-color); font-family: "Monospace", sans-serif; font-size: 12px; font-size: 1.2rem; line-height: 1.5; padding: 0.5em 0; }
.gallery-caption { color: var(--rg-text-color); display: block; font-family: "Monospace", sans-serif; font-size: 12px; font-size: 1.2rem; line-height: 1.5; padding: 0.5em 0; }
.bypostauthor > article .fn:after { content: "\f304"; position: relative; top: 5px; left: 3px; }
.says, .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); height: 1px; overflow: hidden; position: absolute !important; width: 1px; }


/* comment classes */
li.comment {list-style-type: none;}
div.comment-author { float:left; padding-right:10px;}
div.comment-author > cite { vertical-align:top; }
div.comment-meta:after {content:"";display:table; clear:both;}
div.reply {margin-bottom: 3em;}
div.comment-body > p {margin-bottom: 1em;}
.comment.odd {background-color: #444444}
input#submit.submit {color: var(--rg-link-text-color);}
textarea#comment { color: #000000;}
.comment-respond {margin-top: 40px;}
.nav-previous { float:left;}
.nav-next { float:right;}
div.nav-links:after {content:"";display:table; clear:both;}


/*
 * Style the search form at the right side of the menu bar
 */
/* my-nav-menu-search menu item created in functions.php. Move it way over to the right */
.my-nav-menu-search {
	float: right;
}

.my-nav-menu-search .search-form {
	position: relative;
	margin: 0;
}
/*Stop the display of the Search button*/
.my-nav-menu-search .search-submit {
	display: none;
}
/* The "Search for" text is needed for screen readers, but we move it off screen, so we won't see it */
.my-nav-menu-search .search-form .screen-reader-text {
	position: absolute;
	left: -9999px;
	overflow: hidden;
}

.search-field {
	background-color: var(--rg-background-color) !important;
	color: var(--rg-text-color);
}

.search-submit {
	display:none;
}



/* Style the search input textbox */
.my-nav-menu-search .search-field {
	border: none;
	-webkit-box-shadow:    none;
	-moz-box-shadow:       none;
	box-shadow:            none;
	cursor: pointer;
	height: 22px;
	margin: 1px 0 1px 0;
	padding: 0px;
	position: relative;
	-webkit-transition: width 400ms ease;
	-moz-transition:    width 400ms ease;
	-o-transition:      width 400ms ease;
	transition:         width 400ms ease;
	width: 130px;
	color: var(--rg-text-color);
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: var(--rg-link-text-color);
	opacity: 1; /* Firefox */
}

/* Reset nav width and search floating for mobile menu */
@media (max-width: 979px){
	.navbar .nav .my-nav-menu-search {
		float: left;
	}
	.navbar .nav {
		width: auto;
	}
}


/* skip to content link is hidden until it gets focus. */
.skip-link:focus {
	clip: auto;
	height: auto;
	left: 6px;
	top: 7px;
	width: auto;
	z-index: 100000;
	position:relative !important;
}

/* make sure WordPress galleries have a correct clear at the end */
.gallery:after { content:""; display:table; clear:both; }

/* make sure tables are striped if applicable */
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
	background-color: #444444;
}

/* formatting for the tickerwidget */
.rg_tickertext {
	margin-right: 25px;
	margin-bottom: 25px;
}


/* added some fixes for mobile view -thanks to Samuel - v0.6 */
/* position checkbox above text - comments and visitor not logged in */
.comment-form-cookies-consent label {
	display: inline;
}
#wp-comment-cookies-consent {
	margin-bottom: 0;
}

/* for mobile */
@media (max-width: 575.98px) {
  /* beautify post thumbnail on mobile */
	.retrogeek-thumbnail {
		float: unset !important;
		padding-right: 0 !important;
		width: 100%;
		margin-bottom: 2em;
	}
	.retrogeek-thumbnail img {
		width: 100%;
		height: auto;
		object-fit: contain;
	}
	
	/* fix width of comment text input field */
	#comment {
		width: 348px;
	}
}