/*
	Theme Name:   PT-BR Magazine365 child theme
	Theme URI:    https://www.365scores.com/pt-br/news/magazine/
	Description:  Child theme for magazine website - Portuguese (Jannah V6.2.1)
	Author:       365scores
	Author URI:   https://365scores.com
	Template:     jannah
	Version:      1.0.3
	License:      license purchased
	License URI:  http://themeforest.net/licenses/regular_extended
	Text Domain:  scores365
*/


/* write custom css after this line */

/* Theme font declarations */
@font-face {
    font-family: '365 Sans Medium';
    src: url('assets/fonts/365_Sans_Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: '365 Sans DemiBold';
    src: url('assets/fonts/365_Sans_DemiBold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

.main-content .stream-item.stream-item-above-post {
	z-index: 999 !important;
}

@media (min-width: 768px) {
	.main-content .stream-item.stream-item-above-post {
		z-index: 99 !important;
	}	
}

.author-post-count {
	font-size: 18px;
	margin-top: 10px;
}


/* Markers for post progress bar */
#reading-position-indicator::before, #reading-position-indicator::after, #reading-position-indicator .center-marker {
    content: "";
    position: absolute;
    width: 6px;
    height: 5px;
    background-color: #fff;
}

#reading-position-indicator::before {
	left: calc(100vw * 1/4);
}
#reading-position-indicator::after {
    	left: calc(100vw * 3/4);
}
#reading-position-indicator .center-marker {
	left: calc(50vw);
}

/* Gallery - Carousel styles */
.wp-block-gallery {
		margin: 0 30px 20px;		
	}

.wp-block-gallery figure.wp-block-image.slick-slide figcaption {
	position: relative;
    font-size: 10px;
    line-height: 1.2;
    text-align: left;
    background: none;
    color: var(--base-color);
    max-height: 40px;
}
.wp-block-gallery .slick-prev, .wp-block-gallery .slick-next {
	top: calc((100% - 40px) / 2);
}
.wp-block-gallery .slick-prev:before, .wp-block-gallery .slick-next:before {
	color: #a40b55;
	font-size: 24px;
	width: 30px;
	height: 30px;
}
.wp-block-gallery .slick-prev:hover:before, .wp-block-gallery .slick-next:hover:before {
	color: #a40b55;
}
.wp-block-gallery .slick-next {
	right: -32px;
}
.wp-block-gallery .slick-prev {
	left: -32px;
}

/* Give ad units min-height */
/* Banner_Moblie_MagazinePT_320x100_Article_TopScreen  //  Banner_Desktop_MagazinePT_728x90_Article_TopScreen */
.stream-item-after-post-title .stream-item-size {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 100px;
}
/* Banner_Moblie_MagazinePT_336x280_Article_Mid1  //  Banner_Desktop_MagazinePT_728x90_Article_Mid1 */
.stream-item.stream-item-in-post.stream-item-inline-post {
	z-index: 1 !important;
}
.stream-item-in-post.stream-item-inline-post:not(:first-of-type) .stream-item-size {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 90px;
}
@media (max-width: 767px) {
	/* Video ad - keep on top*/
	.stream-item.stream-item-in-post.stream-item-inline-post:first-of-type {
		z-index: 999999 !important;
	}
	.stream-item-in-post.stream-item-inline-post:not(:first-of-type) .stream-item-size {
		display: flex;
		flex-direction: column;
		justify-content: center;
		min-height: 280px;
	}	
}

/* Banner_Desktop_MagazinePT_728x90_Article_Mid2 //  Banner_Moblie_MagazinePT_336x280_Article_Mid2 */
.stream-item-above-footer {
	display: block !important;
	z-index: 1 !important;
}
.stream-item-above-footer .stream-item-size {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 90px;
	max-width: 728px;
	margin: 0 auto;
}
@media (max-width: 767px) {
	.stream-item-above-footer .stream-item-size {
		display: flex;
		flex-direction: column;
		justify-content: center;
		min-height: 280px;
	}	
}

/*****************************************/
/*Didomi GDPR */
#didomi-host.didomi-host #didomi-notice {
	background-color: #fff !important;
}

/*****************************************/
/* Bottom sticky ad */
.stream-item-below-post .ad_close_button {
	display: none;
}
@media (max-width: 768px) {
	.stream-item-below-post {
		position: fixed;
		bottom: 40px;
		left: 0;
	 	right: 0;
		margin: 0!important;
	}
	.stream-item-below-post .stream-item-size {
		background: #fff;
		max-height: 100px;
	}
	.stream-item-below-post .ad_close_button{
		display: block;
		width: 20px;
		right: 5px;
		top: -20px;
		position: absolute;
	}	
}


/* CSS for Adsense Units  */

/* Container for AdSense ads */
.adsense-ad-container {
    margin: 20px 0;
    text-align: center;
    clear: both;
}

/* Hide both ad types by default */
.adsense-ad-container .desktop-ad,
.adsense-ad-container .mobile-ad {
    display: none;
    text-align: center;
}

/* Show desktop ads on larger screens */
@media (min-width: 768px) {
    .adsense-ad-container .desktop-ad {
        display: block;
    }
}

/* Show mobile ads on smaller screens */
@media (max-width: 767px) {
    .adsense-ad-container .mobile-ad {
        display: block;
    }
}


/**
 * Premium Blocks CSS
 * Styles for custom blocks in the "365 Premium" category
 */

/* Hero Block */
.premium-hero-block {
    position: relative;
    width: 100%;
    overflow: hidden;
    margin-bottom: 30px;
}

.premium-hero-block .background {
    position: relative;
    width: 100%;
}

.premium-hero-block .desktop-image,
.premium-hero-block .mobile-image {
    width: 100%;
}

.premium-hero-block .hero-img {
    display: block;
    width: 100%;
    height: auto;
}

.premium-hero-block .mobile-image {
    display: none;
}

.premium-hero-block .content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 60px 40px;
    pointer-events: none;
}

.premium-hero-block h1 {
    font-family: '365 Sans DemiBold', sans-serif;
    font-size: 65px;
    line-height: 1.3;
    text-transform: uppercase;
    max-width: 68%;
    color: #ffffff;
    margin: 0 0 20px 0;
    pointer-events: auto;
    overflow-wrap: normal;
}

#the-post .entry-content .premium-hero-block p {
    font-family: '365 Sans DemiBold', sans-serif;
    font-size: 40px;
    line-height: 1.1;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #ffffff;
    margin: 0;
    pointer-events: auto;
}

/* Mobile styles */
@media (max-width: 767px) {
    .premium-hero-block .desktop-image {
        display: none;
    }
    
    .premium-hero-block .mobile-image {
        display: block;
    }
    
    .premium-hero-block .content {
        padding: 8% 15px;
    }
    
    .premium-hero-block h1 {
        line-height: 1.05;
        max-width: none;
        font-size: 55px;
    }
    
    #the-post .entry-content .premium-hero-block p {
        font-size: 26px;
        max-width: 80vw;
    }
}

/* Text and Background Block */
.premium-text-background-block {
    position: relative;
    width: 100%;
    overflow: hidden;
    margin-top: 30px;
    margin-bottom: 30px;
}

.premium-text-background-block .background {
    position: relative;
    width: 100%;
}

.premium-text-background-block .desktop-image,
.premium-text-background-block .mobile-image {
    width: 100%;
}

.premium-text-background-block .background-img {
    display: block;
    width: 100%;
    height: auto;
}

.premium-text-background-block .mobile-image {
    display: none;
}

.premium-text-background-block .content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px;
    pointer-events: none;
}

.premium-text-background-block h2 {
    font-family: '365 Sans DemiBold', sans-serif;
    font-size: 30px;
    line-height: 1;
    text-align: center;
    margin: 0 0 20px 0;
    max-width: 80%;
    pointer-events: auto;
}

#the-post .entry-content .premium-text-background-block p {
    font-family: '365 Sans', sans-serif;
    font-size: 18px;
    line-height: 1.3;
    text-align: center;
    margin: 0;
    max-width: 80%;
    pointer-events: auto;
}

/* Mobile styles for Text and Background Block */
@media (max-width: 767px) {
    .premium-text-background-block .desktop-image {
        display: none;
    }
    
    .premium-text-background-block .mobile-image {
        display: block;
    }

    .premium-text-background-block .mobile-image img {
    	min-height: 550px;
    	object-fit: contain;
    }

    .premium-text-background-block .content {
    	padding: 20px 8%;
    }
    
    .premium-text-background-block h2 {
        font-size: 22px;
    }
}
