/*
Theme Name: Hitradio Online 2025.1
Author: Sebastian Schwarz
Description: Your description goes here
Version: 2025.1
Template: generatepress

This is the child theme for GeneratePress theme, generated with Generate Child Theme plugin by catchthemes.

(optional values you can add: Theme URI, Author URI, License, License URI, Tags, Text Domain)
*/

/*----------------------
 * WEB FONTS
 * ---------------------*/

/* load web fonts */

/* montserrat-alternates-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 400;
  src: url('//static.hitradio-online.de/webfonts/montserrat-alternates-v17-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-alternates-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat Alternates';
  font-style: italic;
  font-weight: 400;
  src: url('//static.hitradio-online.de/webfonts/montserrat-alternates-v17-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-alternates-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 700;
  src: url('//static.hitradio-online.de/webfonts/montserrat-alternates-v17-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-alternates-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat Alternates';
  font-style: italic;
  font-weight: 700;
  src: url('//static.hitradio-online.de/webfonts/montserrat-alternates-v17-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-alternates-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 900;
  src: url('//static.hitradio-online.de/webfonts/montserrat-alternates-v17-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-alternates-900italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat Alternates';
  font-style: italic;
  font-weight: 900;
  src: url('//static.hitradio-online.de/webfonts/montserrat-alternates-v17-latin-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/*----------------------
 * SET COLORS
 * ---------------------*/

/* --agreen2 */
@property --gradienttop {
  syntax: '<color>';
  initial-value: #e1edba;
  inherits: false;
}

/* --agreen */
@property --gradientbottom {
  syntax: '<color>';
  initial-value: #a8d700;
  inherits: false;
}

/* --light */
@property --tablecelltop {
  syntax: '<color>';
  initial-value: #f0f0f0;
  inherits: false;
}

/* --gray */
@property --tablecellbottom {
  syntax: '<color>';
  initial-value: #d2d2d2;
  inherits: false;
}

/*----------------------
 * TYPOGRAPHY
 * ---------------------*/

/* underline titles */
.title, .entry-title{
	position: relative;
}

.title:after, .entry-title:after{
	content: "";
	position: absolute;
	bottom: -6px;
	height: 6px;
	border-radius: 16px;
	background: linear-gradient(to right, var(--agreen2), var(--agreen));
	width: 128px;
	left: 0px;
	}

/* remove top margin for first title */
.title:not(:first-child), .entry-title:not(:first-child){
	margin-top: 20px;
}

/*----------------------
 * BUTTONS
 * ---------------------*/

button,
.button,
input[type="submit"],
input[type="button"],
.wp-block-button a{
	border: none;
	font-weight: bold;
	border-radius: 16px !important;
	margin-bottom: 20px !important;
	text-decoration: none !important;
	background: linear-gradient(to bottom,  var(--gradienttop) 0%, var(--gradientbottom) 100%) !important;
	transition: --gradienttop 0.3s, --gradientbottom 0.3s;
}

.inside-article entry-content wp-block-buttons wp-block-button a{
	text-decoration: none !important;
}

button:hover,
.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.wp-block-button:hover a{
		--gradienttop: #fffab2 !important;
		--gradientbottom: #faeb0f !important;
}

/* bigger tune in button */
#tunein button{
	font-size: 24px;
}

/*----------------------
 * HEADER AND MENUS
 * ---------------------*/

/* header styling */
.site-header{
	border-radius: 16px;
	background-color: rgba(255, 255, 255, 0.8) !important;
	margin: 20px auto 0 auto;
}

/* remove logo padding */
.site-logo{
  padding: 0 !important;
}

/* set margin for main menu */
.main-navigation .inside-navigation{
	margin: 20px 0 0 0;
}

.main-navigation .main-nav ul li:last-child a{
	margin-bottom: 0 !important;
}

/* main menu gradient */
.main-navigation .main-nav ul li a{
	border: none;
	border-radius: 16px;
	margin-bottom: 20px !important;
	background: linear-gradient(to bottom,  var(--gradienttop) 0%, var(--gradientbottom) 100%) !important;
	transition: --gradienttop 0.3s, --gradientbottom 0.3s;
}
	
.main-navigation .main-nav ul li:hover a,
.main-navigation .main-nav ul li:focus a,
.main-navigation .main-nav ul li:active a{
	--gradienttop: #fffab2;
	--gradientbottom: #faeb0f;
}

/* slideout menu */
.slideout-navigation .slideout-menu{
	display: block;
	margin: 0 20px;
}

.slideout-overlay button.slideout-exit{
	background: none !important;
	transition: none !important;
	font-size: 48px !important;
}

.offside-js--is-left.slide-opened .slideout-overlay button.slideout-exit{
	left: calc(var(--gp-slideout-width) - 0px);
}

/*----------------------
 * CONTENT
 * ---------------------*/

.padding{
	padding: 10px;
}

/* page content styling */
.site-main{
	border-radius: 16px;
	background-color: rgba(255, 255, 255, 0.8) !important;
}

/* image rounded corners */
div.rounded-img figure img{
	border-radius: 16px;
}

/* site images */
.featured-image img{
  margin-bottom: 0 !important;
  border: 0px solid var(--gray);
  border-radius: 16px;
}

/* post images */
.post .post-image a img{
  margin-bottom: 0 !important;
  border: 0px solid var(--gray);
  border-radius: 16px;
}

/*----------------------
 * SIDEBAR AND WIDGETS
 * ---------------------*/

/* sidebar widget styling */
.inside-left-sidebar aside{
	border-radius: 16px;
	background-color: rgba(0, 0, 0, 0.5) !important;
}

/* center widget titles */
.widget-title{
	text-align: center;
	margin-bottom: 10px;
}

/* remove widget padding */
.widget ul, widget ul li{
  padding-left: 0px;
}

/* social buttons tweaking */
.widget .zoom-social-icons-list--no-labels.zoom-social-icons-list--without-canvas{
    margin-left: unset;
    margin-top: unset !important;
}

.widget .zoom-social-icons-list--without-canvas{
    margin-left: unset;
    margin-top: unset;
}

/*----------------------
 * FOOTER
 * ---------------------*/

/* footer styling */
.site-footer{
	border-radius: 16px;
	background-color: rgba(0, 0, 0, 0.5) !important;
	margin: 20px auto;
}

/*----------------------
 * FORMS
 * ---------------------*/

/* field styling */
input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], input[type="file"], select, textarea{
	width: 100%;
	border-width: 3px;
	border-radius: 16px;
}

/* date picker styling */
input[type="date"]{
	color: var(--dark);
	background: var(--agreen2);
	border: 3px var(--dark) solid;
	border-radius: 16px;
	padding: 10px 15px;
	max-width: 100%;
}

input[type="date"]:focus{
  color: var(--dark);
  background: var(--ayellow2);
}

/* upload styling */
input[type="file"]{
	background: var(--agreen2);
	border: 3px var(--dark) solid;
	padding: 10px 15px;
}

/* CF7 - delete list item margin */
.wpcf7-list-item{
	margin-left: 0px;
}

/* CF7 - show checkboxes and radio buttons as block */
span.wpcf7-list-item{
	display: block;
}

/* CF7 - privacy border */
#kontakt_datenschutz{
  border: 3px solid var(--agreen);
  border-radius: 16px;
  padding: 20px;
  margin-bottom: 25px;
  display: block;
}

/*----------------------
 * TABLES
 * ---------------------*/

/* scrollable tables*/
table{
	overflow-x: scroll;
	width: 100%;
	display: block;
	border: none;
	font-size: inherit !important;
}

/* gradient in cells */
td{
	background: linear-gradient(to bottom, var(--tablecelltop), var(--tablecellbottom));
	transition: --tablecelltop 0.3s, --tablecellbottom 0.3s;
}

/* gradient in frist row and column */
tr:first-child, tr td:first-child{
	background: linear-gradient(to bottom, var(--gradienttop), var(--gradientbottom)) !important;
}

/* gradients by hovering */
td:hover{
	--tablecelltop: #fffab2;
	--tablecellbottom: #faeb0f;
}

/*----------------------
 * BLOG
 * ---------------------*/

/* remove paddings */
.post{
  padding: 0px;
  border: 0px solid var(--dark);
  border-radius: 0px;
} 

/*----------------------
 * MISC
 * ---------------------*/

/* style horizontal rulers */
hr{
  background: var(--agreen);
  border: none;
  display: block;
  margin: 20px 0;
  border-style: unset;
  border-width: 2px;
}

/* back to top button tweak */
.generate-back-to-top{
  border-radius: 16px;
}

/* margin inside accordions */
.eb-accordion-content p {
	margin: 1em auto !important;
	padding: 0 !important;
}

/*----------------------
 * POLLS / VOTES
 * ---------------------*/

.songduell input.votebutton {
  background: var(--color1) !important;
  border: 2px solid var(--color1) !important;
  width: 100%;
}

.songduell input.votebutton:hover {
  background: var(--dark) !important;
  color: var(--light);
  border: 2px solid var(--dark) !important;
}

/*----------------------
 * MOBILE CUSTOMIZATIONS
 * ---------------------*/
@media (max-width: 769px){
	
	/* move sidebar content above content */
	/*#content {
		display: flex;
		flex-direction: column-reverse;
	}*/
	
	/* add margin to complete site */
	body{
		margin: 0 20px;
	}
	
	/* align left */
	.inside-header{
		align-items: start;
		text-align: left;
		padding: 20px;
	}
	
	/* change header image */
	/* .site-header{
		background-image: url('https://hitradio-online.de/wp-content/uploads/schildi-left.png');
		background-repeat: no-repeat;
		background-size: contain;
		background-position: right 10px !important;
	} */
	
	.site-header{
		background-image: none !important;
	}
	
	.site-header .header-widget{
		margin: 20px 0 0 0;
		text-align: left;
	}
	
	.separate-containers .inside-article,
	.separate-containers .comments-area,
	.separate-containers .page-header,
	.separate-containers .paging-navigation,
	.one-container .site-content,
	.inside-page-header{
		padding: 20px;
	}
	
	.widget-area .widget{
		padding: 20px;
}
	
	/* Mobile Menu Button */
	.menu-toggle{
		margin: 0 !important;
	}
	
	.has-menu-bar-items button.menu-toggle{
		margin: 10px auto;
		flex-grow: 1;
	}

	.post-image-below-header.post-image-aligned-left .inside-article .post-image{
		margin-top: 26px !important;
	}

	.entry-content:not(:first-child),
	.entry-summary:not(:first-child),
	.page-content:not(:first-child){
		margin-top: 10px !important;
	}

}

/*----------------------
 * DESKTOP CUSTOMIZATIONS
 * ---------------------*/
@media (min-width: 769px){
	
	.inside-header{
		align-items: middle;
		text-align: left;
		justify-content: space-between;
	}
	
	.site-header .header-widget,
	.site-header .header-widget .widget_custom_html {
	margin: 10px 0 0 0;
	text-align: right;
	}
	
	#tunein,
	#tunein p,
	#tunein button{
		text-align: right !important;
	}

	/* back to top animation */
	.generate-back-to-top {
		transition: all .25s;
	}
	
}