/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 6,000+ five-star reviews! It’s ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It’s fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.11.14.1762687694
Updated: 2025-11-09 16:58:14

*/

/* Add to your child theme's style.css */
.consyard-cta-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  background-color: #f97316 !important;
  color: #ffffff !important;
  padding: 0.6rem 1.2rem !important;
  border-radius: 0.5rem !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  box-shadow: 0 4px 6px rgba(249, 115, 22, 0.25) !important;
  transition: all 0.3s ease !important;
  transform: scale(1) !important;
}

.consyard-cta-button:hover {
  background-color: #ea580c !important;
  transform: scale(1.05) !important;
  box-shadow: 0 6px 10px rgba(249, 115, 22, 0.35) !important;
  color: #ffffff !important;
}

.main-header-menu .sub-menu {
  margin-top: 0.5rem !important;
  border-radius: 0.5rem;
}

.sub-menu:hover {
  border-radius: 0.5rem;
}


/* ============================================
   Blog Layout - Content Left, Sidebar Right
   ============================================ */

/* Container */
.blog-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 20px;
}

/* Two Column Flexbox Layout */
.blog-layout {
    display: flex;
    flex-direction: row;
    gap: 30px;
    align-items: flex-start;
}

/* Main Content Left - Takes Most Space */
.blog-main-content {
    flex: 1;
    min-width: 0;
    order: 1;
}

/* Right Sidebar - Fixed Width */
.blog-sidebar {
    flex: 0 0 300px;
    width: 300px;
    order: 2;
}

/* Sticky Sidebar */
.sidebar-sticky {
    position: sticky;
    top: 20px;
}

/* ============================================
   Sidebar Widget Styling
   ============================================ */

.blog-sidebar .widget {
    background: #ffffff;
    padding: 20px;
    margin-bottom: 25px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    border: 1px solid #e5e5e5;
}

.blog-sidebar .widget:last-child {
    margin-bottom: 0;
}

.blog-sidebar .widget-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1a1a1a;
    margin: 0 0 15px 0;
    padding-bottom: 12px;
    border-bottom: 3px solid #0066cc;
}

.blog-sidebar .widget ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.blog-sidebar .widget ul li {
    padding: 10px 0;
    border-bottom: 1px solid #eeeeee;
}

.blog-sidebar .widget ul li:last-child {
    border-bottom: none;
}

.blog-sidebar .widget ul li a {
    color: #333333;
    text-decoration: none;
    transition: color 0.3s ease, padding-left 0.3s ease;
    display: block;
}

.blog-sidebar .widget ul li a:hover {
    color: #f97316;
    padding-left: 8px;
}

/* Search Widget */
.blog-sidebar .widget_search input[type="search"] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
}

.blog-sidebar .widget_search button {
    width: 40%;
    padding: 12px;
    background: #0066cc;
    color: #fff;
    border: none;
    border-radius: 4px;
    margin-top: 10px;
    cursor: pointer;
    font-weight: 600;
    transition: background 0.3s ease;
}

.blog-sidebar .widget_search button:hover {
    background: #004999;
}

.wp-block-tag-cloud a {
  display: inline-block;
  padding: 2px 10px;
  border: 1px solid #ccc;
  margin: 0;
  background-color: #f97316;
  color: #fff;
  border-radius: 10px;
  font-size: 12px !important;
}
/* ============================================
   Blog Post Article Styling
   ============================================ */

.blog-post-wrapper {
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.blog-article {
    margin-bottom: 0;
}

/* Featured Image */
.post-thumbnail {
    width: 100%;
    overflow: hidden;
    margin-bottom: 0;
}

.post-thumbnail img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

/* Post Content Wrapper */
.post-content-wrapper {
    padding: 40px;
}

/* Entry Header */
.entry-header {
    margin-bottom: 30px;
}

.entry-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1a1a1a;
    margin: 0 0 25px 0;
    line-height: 1.3;
}

/* Entry Meta */
.entry-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding: 15px 0;
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
    font-size: 0.9rem;
    color: #666;
}

.meta-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.meta-item i {
    color: #0066cc;
    font-size: 14px;
}

.meta-item a {
    color: #0066cc;
    text-decoration: none;
    transition: color 0.3s ease;
}

.meta-item a:hover {
    color: #004999;
}

.cat-links a {
    color: #f97316;
    text-decoration: none;
    transition: color 0.3s ease;
}

.cat-links a:hover {
    color: #004999;
}

/* Entry Content */
.entry-content {
    font-size: 1.125rem;
    line-height: 1.8;
    color: #333;
    margin-bottom: 30px;
}

.entry-content p {
    margin-bottom: 20px;
}

.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
    margin-top: 30px;
    margin-bottom: 15px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.4;
}

.entry-content h2 {
    font-size: 2rem;
}

.entry-content h3 {
    font-size: 1.5rem;
}

.entry-content h4 {
    font-size: 1.25rem;
}

.entry-content img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 20px 0;
}

.entry-content ul,
.entry-content ol {
    margin: 20px 0;
    padding-left: 30px;
}

.entry-content li {
    margin-bottom: 10px;
}

.entry-content blockquote {
    border-left: 4px solid #0066cc;
    padding: 20px 30px;
    margin: 30px 0;
    background: #f8f9fa;
    font-style: italic;
    color: #555;
    border-radius: 4px;
}

.entry-content a {
    color: #0066cc;
    text-decoration: underline;
    transition: color 0.3s ease;
}

.entry-content a:hover {
    color: #004999;
}

.entry-content code {
    background: #f4f4f4;
    padding: 2px 6px;
    border-radius: 3px;
    font-family: 'Courier New', monospace;
    font-size: 0.9em;
}

.entry-content pre {
    background: #282c34;
    color: #abb2bf;
    padding: 20px;
    border-radius: 6px;
    overflow-x: auto;
    margin: 20px 0;
}

.blog-article .entry-content p {
  text-align: justify;
}

/* Page Links */
.page-links {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #e5e5e5;
}

.page-links a {
    padding: 8px 15px;
    background: #f0f0f0;
    border-radius: 4px;
    text-decoration: none;
    color: #333;
    transition: background 0.3s ease;
}

.page-links a:hover {
    background: #0066cc;
    color: #fff;
}

/* Entry Footer */
.entry-footer {
    padding-top: 25px;
    margin-top: 30px;
    border-top: 3px solid #0066cc;
}

.post-tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-bottom: 15px;
}

.post-tags i {
    color: #0066cc;
    font-size: 16px;
}

.tags-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tag-item {
    display: inline-block;
    padding: 6px 16px;
    background: #f0f0f0;
    border-radius: 20px;
    color: #333;
    text-decoration: none;
    font-size: 0.9rem;
    transition: all 0.3s ease;
    font-size: 12px;
}

.tag-item:hover {
    background: #f97316;
    color: #fff;
    transform: translateY(-2px);
}

.edit-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #0066cc;
    text-decoration: none;
    font-weight: 600;
}

.edit-link:hover {
    color: #004999;
}

/* ============================================
   Author Bio Section
   ============================================ */

.author-bio {
    display: flex;
    gap: 20px;
    padding: 30px;
    margin: 30px 40px;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 8px;
    border-left: 4px solid #0066cc;
}

.author-avatar {
    flex-shrink: 0;
}

.author-avatar img {
    border-radius: 50%;
    border: 4px solid #fff;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.author-info {
    flex: 1;
}

.author-info .author-name {
    margin: 0 0 10px 0;
    font-size: 1.5rem;
    font-weight: 700;
    color: #1a1a1a;
}

.author-description {
    margin: 0;
    color: #555;
    line-height: 1.6;
    font-size: 1rem;
}

/* ============================================
   Comments Section
   ============================================ */

.comments-wrapper {
    padding: 40px;
    background: #f8f9fa;
    margin: 0;
}

.comments-area {
    background: #ffffff;
    padding: 30px;
    border-radius: 8px;
}

.comments-title {
    font-size: 1.75rem;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 2px solid #0066cc;
}

.comment-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.comment {
    margin-bottom: 20px;
}

.comment-body {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 8px;
    border-left: 3px solid #0066cc;
}

.comment-author {
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 8px;
}

.comment-meta {
    font-size: 0.875rem;
    color: #666;
    margin-bottom: 10px;
}

.comment-content p {
    margin: 0;
    line-height: 1.6;
}

.reply {
    margin-top: 10px;
}

.reply a {
    color: #0066cc;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 600;
}

.reply a:hover {
    color: #004999;
}

/* Comment Form */
.comment-respond {
    margin-top: 30px;
    padding-top: 30px;
    border-top: 2px solid #e5e5e5;
}

.comment-reply-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 20px;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    margin-bottom: 15px;
    font-size: 1rem;
    font-family: inherit;
}

.comment-form textarea {
    min-height: 150px;
    resize: vertical;
}

.comment-form input[type="submit"] {
    background: #0066cc;
    color: #fff;
    padding: 12px 30px;
    border: none;
    border-radius: 4px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s ease;
}

.comment-form input[type="submit"]:hover {
    background: #004999;
}

/* ============================================
   Responsive Design - Mobile First
   ============================================ */

/* Tablets and Below (768px) */
@media (max-width: 768px) {
    .blog-container {
        padding: 20px 15px;
    }
    
    /* Stack Layout on Mobile - Sidebar Goes Below */
    .blog-layout {
        flex-direction: column;
    }
    
    .blog-main-content {
        order: 1;
        width: 100%;
    }
    
    .blog-sidebar {
        flex: 1;
        width: 100%;
        order: 2;
        margin-top: 30px;
    }
    
    .sidebar-sticky {
        position: static;
    }
    
    /* Reduce Padding */
    .post-content-wrapper {
        padding: 25px 20px;
    }
    
    .entry-title {
        font-size: 1.875rem;
    }
    
    .entry-meta {
        flex-direction: column;
        gap: 12px;
    }
    
    .entry-content {
        font-size: 1rem;
    }
    
    .entry-content h2 {
        font-size: 1.625rem;
    }
    
    .entry-content h3 {
        font-size: 1.375rem;
    }
    
    /* Author Bio */
    .author-bio {
        flex-direction: column;
        text-align: center;
        margin: 20px;
        padding: 20px;
    }
    
    .author-avatar {
        margin: 0 auto;
    }
    
    /* Comments */
    .comments-wrapper {
        padding: 20px 15px;
    }
}

/* Small Mobile (480px) */
@media (max-width: 480px) {
    .entry-title {
        font-size: 1.5rem;
    }
    
    .post-content-wrapper {
        padding: 20px 15px;
    }
    
    .author-bio {
        margin: 15px;
        padding: 15px;
    }
  .blog-card-excerpt {
    text-align: justify;
    font-size:16px;
  }
  .blog-card-title {
    font-size: 1.4rem;
  }
}

/* Large Screens (1400px+) */
@media (min-width: 1400px) {
    .blog-container {
        max-width: 1400px;
    }
    
    .blog-sidebar {
        flex: 0 0 350px;
        width: 350px;
    }
}
#secondary .wp-block-search__button {
  padding: 0;
  margin-top: 0px;
}

/* Blog home page */

.blog-grid-container {
  max-width: 1200px; margin: 0 auto; padding: 30px 20px;
}
.blog-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 36px;
}
@media (max-width: 900px) {
  .blog-grid { grid-template-columns: 1fr; }
}
.blog-card {
  background: #fff;
  border-radius: 9px;
  box-shadow: 0 2px 14px rgba(0,0,0,0.06);
  overflow: hidden;
  display: flex; flex-direction: column;
  min-height: 100%;
}
.blog-card-thumb img {
  width: 100%; height: 220px; object-fit: cover;
}
.blog-card-meta {
  padding: 18px 24px 0 24px;
}
.blog-card-cat {
  background: #f97316; color: #fff; padding: 3px 16px;
  border-radius: 20px; font-size: 0.98em; text-decoration: none;
}
.blog-card-title {
  padding: 12px 24px 0 24px;
  font-size: 1.5rem; font-weight: bold; line-height: 1.3;
}
.blog-card-title a { color: #222; text-decoration: none; }
.blog-card-cat:hover {
  color: var(--ast-global-color-2);
}
.blog-card-excerpt {
  padding: 15px 24px 0 24px;
  color: #444;
}
.blog-card-tags {
  padding: 18px 24px 0 24px;
}
.blog-card-tags a {
  display: inline-block;
  background: #f0f0f0;
  color: #333;
  border-radius: 14px;
  padding: 3px 12px;
  font-size: 0.72em;
  text-decoration: none;
  margin-right: 5px;
  margin-bottom: 5px;
  transition: all 0.2s;
}
.blog-card-tags a:hover { background: #f97316; color: #fff; }
.blog-card-btn {
  display: inline-block;
  margin: 20px 24px 20px 24px;
  padding: 10px 30px;
  background: #f97316;
  color: #fff;
  border-radius: 4em;
  font-weight: 600;
  text-align: center;
  font-size: 14px;
  align-self: flex-start;
  transition: background 0.2s;
}
.blog-card-btn:hover {
  background: #000;
  color: #fff;
}

.blog-pagination {
  margin: 40px 0 30px 0;
  text-align: center;
}
.blog-pagination .page-numbers {
  display: inline-block;
  background: #f5f6fa;
  color: #222;
  border-radius: 4px;
  padding: 8px 16px;
  text-decoration: none;
  margin: 0 4px;
  border: 1px solid #eee;
  font-weight: 600;
  transition: all 0.2s;
}
.blog-pagination .page-numbers.current,
.blog-pagination .page-numbers:hover {
  background: #0066cc;
  color: #fff;
  border-color: #0066cc;
}
.social-links .social-icon:hover {
  color: var(--ast-global-color-4) !important;
}