/*
 Theme Name: GeneratePress Child
 Theme URI: https://generatepress.com
 Description: Child theme for GeneratePress
 Author: Your Name
 Author URI: https://yourwebsite.com
 Template: generatepress
 Version: 1.0.0
*/

/* ✅ Hides page header image */
.page-header-image {
	display: none;
}

/* ✅ Table of contents box styling */
.kb-table-of-content-wrap {
    background: #f9ecdc;
    padding: 15px;
    border-radius: 10px;
    box-shadow: 2px 4px 5px gray;
    margin-bottom: 15px;
}

/* ✅ Hide featured image inside article */
.separate-containers .inside-article > .featured-image {
	display: none;
}

/* ✅ Adjust header inner padding */
.inside-header {
    padding-top: 2px;    /* reduce top padding */
    padding-bottom: 0px; /* reduce bottom padding */
}

/* ✅ Add dotted line below header */
.site-header {
    border-bottom: 2px dotted #333; /* Change color if needed */
}

/* ✅ Gradient animated site title */
.main-title a {
    display: inline-block;
    font-weight: bold;
    text-decoration: none;
    background: linear-gradient(270deg, #e63946, #f77f00, #2a9d8f, #457b9d, #e63946);
    background-size: 800% 800%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: gradientFlow 12s ease infinite; /* slower cycle */
}

/* ✅ Smooth gradient movement */
@keyframes gradientFlow {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* ✅ Wrap container to position download button */
.image-download-wrap {
  position: relative;
  display: inline-block;
}

/* ✅ Download button styling */
.kb-gallery-image-contain {
  position: relative;
}

.download-btn {
  position: absolute;
  top: 10px;
  left: 10px;  /* Left corner */
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  padding: 6px 12px;
  font-size: 13px;
  border-radius: 4px;
  text-decoration: none;
  opacity: 0.8;
  transition: opacity 0.3s ease;
}

.download-btn:hover {
  opacity: 1;
  background: rgba(0, 0, 0, 0.8);
}
