/*
The Scoop Stylesheet for Specific Features - Live
Updated: 2021-12-18 20:30
*/

/************************* For Reference *************************/
/* In this sheet:
 ** Ramadhan Food Guide
 */

/* CSS NOTES 2 errors: WP editor marks grid-template-columns (for Ramadhan food guide) as being erroneous but works fine. Ignore error and update as usual.

 * Constant:
 * #f7fa00 Yellow used for The Scoop
 */

/************************* The Styles *************************/

/* * Pages: Ramadhan Food Guide * */
/*
	.page-id-6985: Main guide page
	.page-id-7024: Form page
*/

/* Ramadhan Food Guide: Page Header & Related */

.page-id-6985 .page-header-title:before, .page-id-7024 .page-header-title:before {
    background: none;
}
.page-id-6985 .page-header-title, .page-id-7024 .page-header-title {
	padding-top: 40px;
    padding-bottom: 10px;
}
.page-id-6985 .page-header-title h1.page-title, .page-id-7024 .page-header-title h1.page-title {
	/* font-family: adriane-italic !important; */
	font-family: balto-medium !important;
    text-transform: initial;
    font-weight: normal;
}
	
.page-id-6985 .page-header-title h1.page-title {font-size: 40px;}
.page-id-7024 .page-header-title h1.page-title {font-size: 32px;}

.page-id-6985 .sc-ramadhan-page-subtitle, .page-id-7024 .sc-ramadhan-page-subtitle
	{margin-top:-4em}
.page-id-6985 .sc-ramadhan-page-subtitle .su-heading-inner,
.page-id-7024 .sc-ramadhan-page-subtitle .su-heading-inner {
	padding-bottom: initial;
}
/* .page-id-7024 .sc-ramadhan-page-subtitle {padding-bottom:1em} */
.page-id-7024 .sc-ramadhan-page-subtitle .su-heading-inner {padding-left: 0;}
	
	@media only screen and (max-width: 500px) {
		.page-id-6985 .sc-ramadhan-page-subtitle .su-heading-inner,
		.page-id-7024 .sc-ramadhan-page-subtitle .su-heading-inner {
			padding-bottom: 0px;
		}
	}

#post-6985 > figure.post-image > .wp-post-image {display:none}
	/* hides Featured Image on page although we still want it for Open Graph previews */

.su-row.sc-ramadhan-page {
	margin: auto;
	width: 80%;
}
.page-id-7024 .su-row.sc-ramadhan-page {width:initial}

.sc-ramadhan-page .su-heading-style-default {border: none;}

.sc-ramadhan-page .su-heading-style-default .su-heading-inner {
	border: none;
	padding-left: 0;
	padding-right: 0;
}
	
.page-id-6985 .sc-ramadhan-page-subtitle, .page-id-7024 .sc-ramadhan-page-subtitle {
	border-top: 1px solid #eee;
}
	
	@media only screen and (max-width: 991px) {
	
		.page-id-6985 .sc-ramadhan-page-subtitle, .page-id-7024 .sc-ramadhan-page-subtitle {
			border-top: none;
		}
		
	}


.page-id-6985 .thesc-iklan-articles-inside-revolving, .page-id-7024 .thesc-iklan-articles-inside-revolving,
.page-id-6985 .thesc-iklan-articles-inside-revolving-mobile, .page-id-7024 .thesc-iklan-articles-inside-revolving-mobile
{display:none}

.page-id-6985 .post .post-content ul li {
	list-style-position: outside;
}

/* Ramadhan Food Guide: Featured */

.sc-ramadhan-feat-heading {border:none !important;}

.sc-ramadhan-feat-heading .su-heading-inner {
	border-bottom: 10px #666 solid !important;
	padding-bottom: 15px !important;
	margin-top: 1.5em;
	border-top:none !important;
}

.sc-ramadhan-page-featured .su-posts-teaser-loop {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.sc-ramadhan-page-featured .su-posts-teaser-loop .su-post {
    /*width: 33%;
    display: inline-flex;
    flex-flow: column;*/
    align-items: flex-start;
    padding: 20px;
    width: auto;
    flex-flow: row;
    flex-basis: 33%;
}

.sc-ramadhan-page-featured .su-post-thumbnail img {
    /* width: 295px; */
    border: 0 !important;
    border-radius: 0 !important;
    width: 100%;
    object-fit: cover;
    height: 210px;
}

.sc-ramadhan-page-featured .su-posts-teaser-loop h2.su-post-title a {padding-top: 1vw; display: inline-block;}

	/* additional CSS overrides moved down so can override SU's shortcodes.css...
	 * search for .sc-ramadhan-page-featured */

.sc-ramadhan-page-featured .su-posts-teaser-loop .entry-title-primary {
    font-size: 22px;
    line-height: 26px;
}

.sc-ramadhan-page-featured .su-posts-teaser-loop .entry-subtitle {
    /* font-size: 18px; */
    line-height: 22px;
    font-size: 17px;
    padding-top: 10px;
}

		@media only screen and (max-width: 991px) {

			.sc-ramadhan-page-featured .su-posts-teaser-loop .su-post {
				display: flex;
				flex-flow: row wrap;
				flex-basis: auto;
				margin-bottom: 1em;
			}
			.sc-ramadhan-page-featured .su-posts-teaser-loop .su-post-thumbnail {
				float: none;
				flex: 33%;
			}
			.sc-ramadhan-page-featured .su-posts-teaser-loop h2.su-post-title {
				flex: 3;
				margin-top: 0;
			}
			.sc-ramadhan-page-featured .su-posts-teaser-loop h2.su-post-title a
				{padding-top: 0;}
			
		}

		@media only screen and (max-width: 500px) {
			.sc-ramadhan-page-featured .su-posts-teaser-loop .su-post {
				flex-direction: column;
			}
		}


/* Ramadhan Food Guide: Teh Grid of Listings - TQ to https://glitch.com/edit/#!/grid-cats */

	/* --- Is styling for grid */
	#thesc_foodguide {
	  display: grid;
	  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); /* this will show as error in WP editor but works fine */
	  grid-gap: 0px 0px; /* bc each thesc_foodguide_box already padded */
	}
		/* ^-- 2018 version */
		
	#thesc_foodguide_2019 {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); /* this will show as error in WP editor but works fine */
		grid-gap: 0px 1em;
	}
		/* ^-- 2019 version */
	
	/*
	2019: Not in use, since we are just using normal posts with Shortcodes Ultimate
	to display featured restaurants
	
	#thesc_foodguide_featured {
	  display: grid;
	  grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
	  grid-gap: 0px 0px;
	}
	*/

	/* --- Is general */
	#thesc_foodguide,
	#thesc_foodguide_2019 {
	  max-width: 1200px;
	  margin: 0 auto 30px;
	}

/* Ramadhan Food Guide: Each Div Itself */

.thesc_foodguide_box {
	/* width: 33%;float: left; */
	padding:15px;
	position:relative}
.thesc_foodguide_box .fg_restaurant_title {
	text-align:center;
	/* font-family: neuton-italic !important; */
    /* font-size: xx-large; */
    padding-bottom: 15px;}
    /* ^-- 2018 */

#thesc_foodguide_2019 .thesc_foodguide_box .fg_restaurant_title {
	font-size: 22px;
    margin-top: 0px;
    text-align: left;
	}
	/* ^-- 2019 */

.thesc_foodguide_thumb {text-align:center}
	/* ^-- 2018 */
	
#thesc_foodguide_2019 .thesc_foodguide_thumb {
	width: fit-content;
    display: inline-flex;
    flex-flow: column;
    align-items: flex-start;
}
	/* ^-- 2019 */

.thesc_foodguide_thumb img {
    box-shadow: 10px 10px #f1f1f1;
    border: #d6c600 4px solid;margin:auto;
      width: 300px;
    height: 250px;
    object-fit: cover;
}
	/* ^-- 2018 */
    
#thesc_foodguide_2019 .thesc_foodguide_thumb img {    
    width: 150px;
    height: 135px;
    box-shadow: 7px 7px #f1f1f1;
}
	/* ^-- 2019 */

.thesc_foodguide_thumb p {margin-top:10px}
.thesc_foodguide_thumb p a {font-size: small;
    border-bottom: 3px solid #f7fa00;
	color: #111;}
	

/* Ramadhan Food Guide: Info Box */

.thesc_foodguide_info {
    display: inline-flex;
    flex-flow: column;
    align-items: flex-start;
	float: right;
    width: 50%;
    margin-right: 0px;
}

/* Ramadhan Food Guide: Sub boxes: Promo box */

.thesc_foodguide_promo {
    padding: 15px;
    border: #f7fa00 2px solid;
    margin-bottom: 20px;
     border-top-left-radius: 10px;
    border-top-right-radius: 10px;}
.thesc_foodguide_promo p, .thesc_foodguide_promo span, .thesc_foodguide_promo li {
	font-size: 16px !important;
    /* line-height: 1em; */
}
.thesc_foodguide_promo .fg_promo_header {background: yellow;
    padding: 5px;
    margin: -15px -15px 10px -15px;
    text-align: center;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;}


/* Ramadhan Food Guide: Sub boxes: Bullet Box */

.thesc_foodguide_bullets {
      background: lightgrey;
     padding: 15px !important;
    margin: 25px 0px !important;}
.thesc_foodguide_bullets ul {padding:0 !important;margin:0 0 10px 0 !important}
.thesc_foodguide_bullets ul li, .thesc_foodguide_bullets p {
      font-size: 16px !important;    line-height: 1.4em !important;}
.thesc_foodguide_bullets ul li {
	list-style: none !important;}
.thesc_foodguide_bullets ul li strong {
font-family: balto-bold;
    font-size: 15px;
	padding-right: 3px;}
.thesc_foodguide_bullets ul li p, .thesc_foodguide_bullets ul li span {display:block}
.thesc_foodguide_bullets ul li span.fg_location { 
    display:inline;
}
.thesc_foodguide_bullets ul li span.fg_location::before { 
    content: ", ";
}
.thesc_foodguide_bullets ul li span.fg_location:nth-child(2)::before { 
    content: "";
}
/* For some reason, using 'after' for commas was stripping the whitespace in  ', ' to just ','
 * 
 * .thesc_foodguide_bullets ul li span.fg_location:last-child::after { 
    content: "";
} */

.thesc_foodguide_bullets > p {text-align:center;margin:0}
.thesc_foodguide_bullets a {border: none !important;
    background-color: #f9ff99 !important;
    padding: 0px 6px;}
.thesc_foodguide_website {margin-top: 10px !important;
	overflow: hidden;
	/* overflow-wrap: break-word */	
}
.thesc_foodguide_website a {background-color:yellow !important}


/* Ramadhan Food Guide: Form */

form.pods-form-pod-restaurant {
      margin: auto;
    max-width: 700px;}

li.pods-field {list-style:none !important}
p.pods-form-ui-comment {font-size:smaller !important}
.pods-form .pods-field-input textarea {min-height: 100px !important}

.pods-form-ui-label-pods-field-post-title {
	visibility: hidden;
	position: relative;}
.pods-form-ui-label-pods-field-post-title:after {
	visibility: visible;
	position: absolute;
	top: 0;
	left: 0;
	content:'Restaurant Name'}
	/* Replace 'Title' with 'Restaurant Name'
	 * Makasih https://blog.escapecreative.com/how-to-replace-text-with-css/ */

#pods-form-ui-pods-field-restaurant-promotion_ifr {height:100px !important}




/* ----------- */

/* * Additional overrides! * */


/* Ramadhan Food Guide */

/* Featured - Additional Overrides (due to Shortcodes Ultimate's shortcodes.css)
 * Search for .sc-ramadhan-page-featured
 */

.sc-ramadhan-page-featured .su-post-thumbnail {
	/*width: 300px !important;*/
    width: 100% !important;}
    
.sc-ramadhan-page-featured h2.su-post-title {margin-top:10px !important;}