/* 
Theme Name:		 Digital V Tamil
Theme URI:		 http://vtamilnews.com/
Description:	 Digital V Tamil is a child theme of GeneratePress, created by vtamilnews.com
Author:			 Digital V Tamil
Author URI:		 http://vtamilnews.com/
Template:		 generatepress
Version:		 1.0.0
Text Domain:	 Digital-V-Tamil
*/

.post-dates {
    font-size: 12px;
}

nav#secondary-navigation{
	.inside-navigation{
padding:0px!important;
flex-direction: row-reverse;
}
	.wp-block-social-links.has-small-icon-size {
    font-size: 20px!important;
}
	p.gb-text.gb-text-2850bce2 a{
		color:white;
font-weight:500;
	}
	p{
margin-bottom:0px!important;}
}
nav#site-navigation {
box-shadow: rgba(0, 0, 0, 0.09) 0px 3px 12px;}
.icon-pro-menu-bars {
    font-size: 29px;
}
.icon-pro-menu-bars svg{
	top:8px;
}
button.menu-toggle {
    line-height: 0px !important;
/*     transform: rotateY(180deg); */
    padding-right: 11px !important;
    font-size: 18px !important;
}
form.search-modal-form {
    border-radius: 10px;
    border-bottom: 3px solid black;
}
div#left-sidebar{
	width:12%;
	 
}
@media(min-width: 769px) {
    .both-sidebars .site-content {
        display: flex;
    }
    #left-sidebar, #primary, #right-sidebar {
        left: unset;
    }
    #left-sidebar {
        order: -1;
    }
    .inside-left-sidebar, .inside-right-sidebar {
        position: -webkit-sticky;
        position: sticky;
        top: 75px;
    }
}
.entry-content ol{
	    margin: 0px 18px;
}

.featured-image.page-header-image-single {
    margin: 7px 0px !important;
}

.featured-image.page-header-image-single {
  position: relative;
}

.featured-image.page-header-image-single::before,
.featured-image.page-header-image-single::after {
content: "";
    position: absolute;
    width: 70px;
    height: 70px;
    border: 7px solid red;
    z-index: 1;
}

.featured-image.page-header-image-single::before {
  top: 0;
  left: 0;
  border-right: none;
  border-bottom: none;
}

.featured-image.page-header-image-single::after {
  bottom: 0;
  right: 0;
  border-left: none;
  border-top: none;
}
img.attachment-full.size-full {
    border-radius: 0px 0px 0px 24px;
}

/* Mobile Css */
@media (min-width: 320px) and (max-width: 480px) {
  nav#secondary-navigation{
display:none;}
  div#left-sidebar{
display:none!important;
}
	div#primary {
padding-left:0px!important;
}

article.post {
     h2#subtitle_TXt {
         color: #f4f4f4;
         font-size: 17px !important;
         margin-bottom: 5px;
        margin-top: 6px;
        
         font-family: roboto;
         line-height: 1.5;
    }
    h1.entry-title {
         font-size: 25px;
         color: #f4f4f4 !important;
    }
    header.entry-header {
         background: #1d201f;
         margin: -15px !important;
         padding: 15px;
         padding-bottom: 136px;
         margin-bottom: -135px !important;
         color: white;
    }

}
.story-row {
    background:#1d201f!important;
    margin-bottom: -10px;
display:flex!important;
}
nav.rank-math-breadcrumb a {
    color: #dbdbdb!important;
}
	nav.rank-math-breadcrumb p{color: #dbdbdb!important;
}
span.separator {
    margin: 0px -3px;
}
}



/*
 * Style for the Gallery Icon Widget on GenerateBlocks Image
 */

/* 1. Make the GenerateBlocks image container a positioning context */
/*
 * Styles for the Photo Gallery Icon on Archive Posts
 */

/* 1. Create a positioning context for the icon.
   This targets the wrapper we added with our PHP function. */
.image-with-icon-wrapper {
    position: relative;
    display: inline-block; /* Ensures the wrapper only takes up the image's space */
    width: 100%; /* Make sure it fills the container from GenerateBlocks */
}

/* 2. Style the icon itself. */
.photo-gallery-icon {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 10;
    background-color: rgba(0, 0, 0, 0.7);
    color: #ffffff;
    border-radius: 50%; /* Makes it a circle */
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease-in-out;
}

/* Optional: Add a subtle hover effect */
.image-with-icon-wrapper:hover .photo-gallery-icon {
    transform: scale(1.1);
}

/* 3. Ensure the icon SVG is sized correctly within its container. */
.photo-gallery-icon svg {
    width: 22px;
    height: 22px;
}

/* 4. Make sure the image inside our wrapper behaves correctly. */
.image-with-icon-wrapper .gb-block-image img {
    width: 100%;
    height: auto;
    display: block; /* Removes any bottom space under the image */
}