/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       David Dark
 Template:     generatepress
 Version:      0.1
*/


/*Background Image */
.site {
    background-image: linear-gradient(rgba(0, 0, 0, 0.50), rgba(0, 0, 0, 0.50)), url("https://darkstories.com.au/wp-content/uploads/2021/03/darkstories_truecrimetours.jpg");
    background-repeat: no-repeat;
    width: 100%;
}



/* No Background Image for Mobile Phones */
@media (max-width: 768px) {
          #page{
        background-image: none;
    }
}

/* No Background Image for Mobile Phones and Block Cover combinations */
@media (max-width: 768px) {
    .inside-article .entry-content .wp-block-cover {
        background-image: none;
    }
}



/*Comment Input Box */
.comment-form-comment textarea {
    width: 100%;
	background: #696969;
	border-width: 3px;
  border-color: #b43c3c;
	color: #FFFFFF;
}

/*Tags, Categorys and Leave a Comment(or Comment Count) Font Settings */
footer.entry-meta {
    font-size: 16px;
  padding-top: 5px;
  padding-bottom: 5px;
  margin-top: 20px;
  border-top: 1px solid #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
}


/* This is to deal with the Imagify Plugin reducing the webp image sizes.  For some reason they won't render at full width. This expands the image back to 100% width, which the jpeg files rendered in previously. */
picture img {
    width: 100%;
}


/* This displays the menu option "Subscribe" as a Button */
    .main-navigation .main-nav ul li.mc-nav-button  a {
        background-color: #25652C; /* Darker Green Now - Changed from Bright Green #4CAF50;  */
        border: 3px solid white;
        color: #FFFFFF;
       line-height: 35px;
      		border-radius: 20px;
		-moz-border-radius: 20px;
		-webkit-border-radius: 20px;
    }



/* This font will be used to display text whilst waiting for Rezdy iFrames to loads; the setting is currently swap.  It will use the font uploaded to the server until the rezdy font actually loads. */
@font-face {
  font-family: 'RezdyIcons';
  font-style: normal;
  src: url('/wp-content/themes/generatepress_child/assets/fonts/rezdy-icons-2018.ttf') format('truetype'); /* Adjust the path as needed */
  font-display: swap;
}



/* THIS IS THE CRIME TOUR BOOKING PAGE CSS - CHECK TO SEE ITS IMPACT ON OTHER PAGES */


/* Renders content bullet points with the image of the scales of justice. 
   Avoids affecting primary menu structures by using .entry-content. */
.entry-content ul li {
    margin: 0 0 30px; /* Adds space below each list item */
    padding: 0 0 0 75px; /* Increases left padding for the bullet image */
    list-style: none; /* Removes default list style */
    position: relative; /* Positions the ::before pseudo-element */
}

.entry-content ul li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 50px; /* Adjust if your image is larger */
    height: 50px; /* Adjust if your image is larger */
    background-image: url("https://darkstories.com.au/wp-content/uploads/2020/08/scales-of-justice.png");
    background-size: contain; /* Ensures the entire image fits */
    background-repeat: no-repeat;
}



    #button-booking,
    #button-booking-01,
    #button-booking-02,
    #button-booking-03 {
        font-size: 20px !important;
        padding: 15px 30px !important;
    }



/* This controls the line spacing for the HTML Sitemap which is in the Footer section of the website */
.HTML-Sitemap .wp-block-paragraph, .HTML-Sitemap p { 
    margin-bottom: 10px; /* Reduces space between paragraphs */
    line-height: 1.1; /* Standard line spacing for readability */
}

/* This controls the footer spacing left and right as well as centreing the contents */
.site-footer .uagb-columns__inner-wrap {
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px; /* Space on the left */
    width: 100%;
}

/* This setting manages the Tap Target Size in the Sitemap */
/* Media query for mobile and tablet devices */
@media screen and (max-width: 768px) { /* Adjust the max-width as needed */
.HTML-Sitemap a {
    padding: 4.00px; /* Minimal padding for desktop */
    display: inline-block; /* Ensures padding applies correctly */
    }
}

/* Media queries for tablet and mobile */
@media (max-width: 768px) { /* Adjust the max-width as needed for tablet */
    .site-footer .uagb-columns__inner-wrap {
        padding-left: 15px; /* Space on the left */
        padding-right: 15px; /* Space on the right */
    }
}

@media (max-width: 480px) { /* Adjust the max-width as needed for mobile */
    .site-footer .uagb-columns__inner-wrap {
        padding-left: 10px; /* Space on the left */
        padding-right: 10px; /* Space on the right */
    }
}


/* This reduces the empty space at the top and bottom of the footer separator */
.site-footer .wp-block-separator {
    margin-top: 20px; /* Adjust the space above the separator */
    margin-bottom: 20px; /* Adjust the space below the separator */
    opacity: 0.5; /* 50% transparency */
}




/* Styling the geot_switcher dropdown and its container   */

.widget.geot-dropdown-widget {
            background-color: #B43C3C;
            font: #FFFFFF;
            font-weight: bold;
            padding: 0px;
            border-radius: 5px;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5), /* Adds shadows for a 3D effect */
                inset 0 1px 0 rgba(255, 255, 255, 0.25),
                inset 0 -1px 0 rgba(0, 0, 0, 0.25);
            margin-bottom: 20px; /* Space below the widget */
        }

.widget.geot-dropdown-widget select {
            width: 100%;
            padding: 10px;
            background-color: #B43C3C;
            font: #FFFFFF;
            font-weight: bold;            
            margin-top: 0px;
            border: 1px solid #FFFFFF;
            border-radius: 4px;
            box-sizing: border-box;
        }

.geot_dropdown_container {
           background-color: #B43C3C !important;
           padding: 15px !important;
           border-radius: 5px !important;
           font-weight: bold !important;
           box-shadow: 0 2px 5px rgba(0,0,0,0.1) !important;
           border: 1px solid #FFFFFF !important; /* Optional: if you want a border */
}


/* Hover state for Selectize control to match original hover effects */
.widget.geot-dropdown-widget .geot_dropdown_container .geot_switcher:hover {
            background-color: #a53232; /* Darker shade for hover effect */
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6), /* Enhanced shadow for depth */
                inset 0 1px 0 rgba(255, 255, 255, 0.3),
                inset 0 -1px 0 rgba(0, 0, 0, 0.3);
}


/* Styles for the Crime Database notification block */
.update-notification {
            display: none; /* Hidden by default */
            position: fixed;
            top: 25%; /* Adjust based on your layout */
            left: 45%;
            transform: translateX(-50%);
            z-index: 1001; /* Ensure its above other content */
            background-color: rgba(0, 0, 0, 0.8);
            color: #FFFFFF;
            padding: 10px 20px;
            border-radius: 5px;
            font-size: 16px;
            box-shadow: 0 2px 4px rgba(0,0,0,0.5);
             animation: flashAnimation 1s infinite; /* Apply the animation */
}

/* Flashing text settings */
@keyframes flashAnimation {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.60; }
}


/* Styles for the Crime Database notification block for mobile screens */
@media (max-width: 768px) {
    .update-notification {
        top: 35%; /* Adjusted positioning for mobile */
    }
}



/* Style the Bloody Handprint */
.geot_image_container img {
    width: 50% !important; /* Adjust the percentage to your preference */
    height: auto !important; /* Keeps the aspect ratio of the image */
}

/*Mimic Hover Effect for Image */
#geot_switcher_image:hover {
    opacity: 0.8; /* Slightly reduce opacity on hover */
    cursor: pointer; /* Change cursor to indicate clickable items */
}


/*Mimic Button Pressing Effect for Image */
#geot_switcher_image:active {
    transform: scale(0.90); /* Slightly scale down on press */
    opacity: 0.8; /* Change opacity to indicate interaction */
    transition: transform 0.1s ease, opacity 0.1s ease; /* Smooth transition for feedback */
}


/* Smaller screens */
@media (max-width: 768px) {
  .geot_image_container img {
    width: 50% !important; /* Smaller size on mobile screens */
    height: auto !important;
  }
}


/* lowers the handprint alignment */
.widget {
    margin: 0 10px 10px !important;
}


/* This forces the container block that contains the handprint to be size corrected*/
.gb-container-4f7e9c00 img {
    width: 71px !important; /* 50% of the original width if the original was 142px */
    height: 90.5px !important; /* 50% of the original height if the original was 181px */
    display: block !important; /* Ensures the image is treated as a block-level element, which can help with alignment issues */
}