/*
 Theme Name: BookVandar Custom Styles
 Description: Additional CSS for bookvandar.com
 Author: BookVandar
 Version: 1.0
*/

.home-title {
     position: absolute;
     left: -9999px;
     top: auto;
     width: 1px;
     height: 1px;
     overflow: hidden;
}
/* Fix subcategory image size WITHOUT breaking layout */
 .woocommerce ul.products li.product-category {
     height: auto !important;
     text-align: center;
}
/* Control image only */
 .woocommerce ul.products li.product-category a img {
     height: 220px !important;
     width: 160px !important;
     object-fit: cover !important;
}
/* Ensure title is visible */
 .woocommerce ul.products li.product-category .woocommerce-loop-category__title {
     display: block !important;
     margin-top: 10px;
     font-size: 14px;
}
 a {
     color: #1a73e8;
     text-decoration: none;
     font-weight: 500;
}
 a:hover {
     text-decoration: underline;
}
 .single-post .entry-content p, .single-post .entry-content li {
     font-size: 14px;
     line-height: 1.6;
}
 body {
     font-size: 16px;
     line-height: 1.7;
}
 h1 {
     font-size: 28px;
}
 h2 {
     font-size: 24px;
}
 p {
     margin-bottom: 15px;
}
/* Premium Medium-style Blog Design */
 .blog-details_content {
     background: #f7f7f7;
     padding: 40px 0;
}
 .blog_page__title {
     display: none;
}
 .blog-details {
     max-width: 780px;
     margin: 0 auto;
     background: #ffffff;
     padding: 38px;
     border-radius: 14px;
     box-shadow: 0 8px 28px rgba(0,0,0,0.05);
}
 .blog-details__title {
     font-size: 31px !important;
     line-height: 1.35;
     font-weight: 700;
     color: #1f2937;
     margin-bottom: 14px;
}
 .post-meta {
     font-size: 14px;
     color: #6b7280;
     margin-bottom: 22px;
     gap: 16px;
}
 .blog-details__thumb img {
     width: 100%;
     height: auto;
     border-radius: 12px;
     margin-bottom: 28px;
}
 .blog-details__content {
     font-size: 17px;
     line-height: 1.7;
     color: #222;
}
 .blog-details__content p {
     margin-bottom: 13px;
}
 .blog-details__content h2 {
     font-size: 24px !important;
     line-height: 1.4;
     margin-top: 28px;
     margin-bottom: 10px;
     color: #111827;
}
 .blog-details__content h3 {
     font-size: 21px !important;
     line-height: 1.4;
     margin-top: 22px;
     margin-bottom: 8px;
     color: #1f2937;
}
 .blog-details__content ul, .blog-details__content ol {
     margin: 14px 0 18px 24px;
     padding-left: 12px;
}
 .blog-details__content li {
     margin-bottom: 6px !important;
     line-height: 1.55;
}
 .blog-details__content li p {
     margin-bottom: 5px !important;
}
 .blog-details__content hr {
     border: 0;
     border-top: 1px solid #e5e7eb;
     margin: 18px 0;
}
 .blog-details__content a {
     color: #047857;
     text-decoration: underline;
     text-underline-offset: 3px;
}
/* Hide sidebar for clean article layout */
/*.sidebar {
     display: none;
}
*/
 .col-xl-8, .col-lg-8 {
     width: 100% !important;
     max-width: 100% !important;
     flex: 0 0 100% !important;
}
/* Share section */
 .post-share {
     margin-top: 30px !important;
     padding-top: 20px;
     border-top: 1px solid #e5e7eb;
}
/* Comments */
 .comments-area, .comment-respond {
     max-width: 780px;
     margin: 32px auto 0;
     background: #ffffff;
     padding: 28px;
     border-radius: 14px;
     box-shadow: 0 8px 25px rgba(0,0,0,0.05);
}
 .comment-respond textarea, .comment-respond input[type="text"], .comment-respond input[type="email"], .comment-respond input[type="url"] {
     width: 100%;
     padding: 12px 14px;
     border: 1px solid #d1d5db;
     border-radius: 8px;
     margin-bottom: 12px;
     font-size: 15px;
}
 .comment-respond input[type="submit"] {
     background: #111827;
     color: #ffffff;
     border: 0;
     padding: 11px 24px;
     border-radius: 999px;
     cursor: pointer;
     font-weight: 600;
}
 .comment-respond input[type="submit"]:hover {
     background: #047857;
}
/* Premium Blog Design With Sidebar */
 .blog-details_content {
     background: #f7f7f7;
     padding: 40px 0;
}
 .blog_page__title {
     display: none;
}
/* Left blog card */
 .blog-details {
     width: 100%;
     background: #ffffff;
     padding: 34px;
     border-radius: 14px;
     box-shadow: 0 8px 28px rgba(0,0,0,0.05);
}
/* Correct layout: post left, sidebar right */
 .col-xl-8, .col-lg-8 {
     width: 68% !important;
     max-width: 68% !important;
     flex: 0 0 68% !important;
}
 .col-xl-4, .col-lg-4 {
     width: 32% !important;
     max-width: 32% !important;
     flex: 0 0 32% !important;
}
/* Title */
 .blog-details__title {
     font-size: 30px !important;
     line-height: 1.35;
     font-weight: 700;
     color: #1f2937;
     margin-bottom: 14px;
}
 .post-meta {
     font-size: 14px;
     color: #6b7280;
     margin-bottom: 22px;
     gap: 16px;
}
/* Featured image */
 .blog-details__thumb img {
     width: 100%;
     height: auto;
     border-radius: 12px;
     margin-bottom: 26px;
}
/* Content typography */
 .blog-details__content {
     font-size: 17px;
     line-height: 1.7;
     color: #222;
}
 .blog-details__content p {
     margin-bottom: 13px;
}
 .blog-details__content h2 {
     font-size: 24px !important;
     line-height: 1.4;
     margin-top: 28px;
     margin-bottom: 10px;
     color: #111827;
}
 .blog-details__content h3 {
     font-size: 21px !important;
     line-height: 1.4;
     margin-top: 22px;
     margin-bottom: 8px;
     color: #1f2937;
}
 .blog-details__content ul, .blog-details__content ol {
     margin: 14px 0 18px 24px;
     padding-left: 12px;
}
 .blog-details__content li {
     margin-bottom: 6px !important;
     line-height: 1.55;
}
 .blog-details__content li p {
     margin-bottom: 5px !important;
}
 .blog-details__content hr {
     border: 0;
     border-top: 1px solid #e5e7eb;
     margin: 18px 0;
}
 .blog-details__content a {
     color: #047857;
     text-decoration: underline;
     text-underline-offset: 3px;
}
/* Sidebar */
 .sidebar {
     display: block;
     position: sticky;
     top: 90px;
}
 .blog-widget {
     background: #ffffff;
     border-radius: 14px;
     overflow: hidden;
     box-shadow: 0 8px 24px rgba(0,0,0,0.05);
}
 .blog-widget__title {
     background: #dc2626;
     color: #ffffff;
     font-size: 18px;
     font-weight: 700;
     padding: 15px 18px;
     margin: 0;
}
 .short-post-wrapper {
     padding: 16px;
}
 .short-post {
     display: flex;
     gap: 12px;
     margin-bottom: 16px;
     padding-bottom: 16px;
     border-bottom: 1px solid #e5e7eb;
}
 .short-post:last-child {
     margin-bottom: 0;
     padding-bottom: 0;
     border-bottom: 0;
}
 .short-post .thumb {
     flex: 0 0 70px;
}
 .short-post .thumb img {
     width: 70px;
     height: 70px;
     object-fit: cover;
     border-radius: 8px;
}
 .short-post .title {
     font-size: 14px;
     line-height: 1.4;
     margin: 0 0 5px;
}
 .short-post .title a {
     color: #111827;
     text-decoration: none;
}
 .short-post .title a:hover {
     color: #047857;
}
 .short-post .date {
     font-size: 12px;
     color: #6b7280;
}
/* Share */
 .post-share {
     margin-top: 30px !important;
     padding-top: 20px;
     border-top: 1px solid #e5e7eb;
}
/* Comments */
 .comments-area, .comment-respond {
     margin-top: 32px;
     background: #ffffff;
     padding: 28px;
     border-radius: 14px;
     box-shadow: 0 8px 25px rgba(0,0,0,0.05);
}
 .comment-respond textarea, .comment-respond input[type="text"], .comment-respond input[type="email"], .comment-respond input[type="url"] {
     width: 100%;
     padding: 12px 14px;
     border: 1px solid #d1d5db;
     border-radius: 8px;
     margin-bottom: 12px;
     font-size: 15px;
}
 .comment-respond input[type="submit"] {
     background: #111827;
     color: #ffffff;
     border: 0;
     padding: 11px 24px;
     border-radius: 999px;
     cursor: pointer;
     font-weight: 600;
}
 .comment-respond input[type="submit"]:hover {
     background: #047857;
}
/* Mobile */
 @media (max-width: 991px) {
     .col-xl-8, .col-lg-8, .col-xl-4, .col-lg-4 {
         width: 100% !important;
         max-width: 100% !important;
         flex: 0 0 100% !important;
    }
     .sidebar {
         position: static;
         margin-top: 25px;
    }
}
 @media (max-width: 768px) {
     .blog-details_content {
         padding: 20px 0;
    }
     .blog-details {
         padding: 22px;
         border-radius: 10px;
    }
     .blog-details__title {
         font-size: 25px !important;
         line-height: 1.35;
    }
     .blog-details__content {
         font-size: 16px;
         line-height: 1.65;
    }
     .blog-details__content h2 {
         font-size: 21px !important;
         margin-top: 24px;
    }
     .blog-details__content h3 {
         font-size: 19px !important;
    }
     .comments-area, .comment-respond {
         padding: 22px;
    }
}
/* Fix sidebar latest article image + title alignment */
 .short-post {
     display: flex !important;
     align-items: flex-start;
     gap: 12px;
}
 .short-post .thumb {
     width: 80px !important;
     min-width: 80px !important;
     flex: 0 0 80px !important;
}
 .short-post .thumb img {
     width: 80px !important;
     height: 65px !important;
     object-fit: cover;
     border-radius: 8px;
     display: block;
}
 .short-post .content {
     flex: 1 !important;
     min-width: 0;
}
 .short-post .title {
     font-size: 14px !important;
     line-height: 1.45 !important;
     margin: 0 0 6px 0 !important;
}
 .short-post .title a {
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
}
 .short-post .date {
     display: block;
     font-size: 12px !important;
     line-height: 1.4;
}
 .sub-cat-slider-container {
     padding: 15px 0;
     width: 100%;
}
/* Fix for Golden-Yellow Stars like image_6.png */
 .star-rating {
     font-family: 'star' !important;
     font-size: 14px !important;
    /* Matches standard small icons */
     width: 5.4em !important;
     position: relative;
     display: inline-block;
     color: #ffb400 !important;
    /* The precise golden-yellow for filled stars */
     margin: 0 !important;
}
/* This forces the stars to be "filled" with color */
 .star-rating span {
     color: #ffb400 !important;
     position: absolute;
     top: 0;
     left: 0;
     visibility: visible !important;
    /* Ensures the yellow is not hidden */
}
/* Alignment Row - Keeping stars and numbers side-by-side */
 .bv-rating-row {
     display: flex !important;
     flex-direction: row !important;
     justify-content: center !important;
     align-items: center !important;
     gap: 6px;
     margin: 5px 0 !important;
     width: 100% !important;
}
/* Review Count Style - Like image_6.png */
 .bv-count {
     font-weight: 300 !important;
    /* Very thin font, like standard text in reference */
     color: #999 !important;
    /* Lighter grey for number count */
     font-size: 13px !important;
     display: inline-block !important;
     line-height: 1;
}
/* Forces empty stars behind to look golden-yellow, matching image_6.png */
 .star-rating::before {
     content: '\73\73\73\73\73' !important;
     color: #ffb400 !important;
    /* Same color for background stars in reference image */
     opacity: 1 !important;
}
/* Single Product Page Rating Structure */
 .bv-single-rating-wrap {
     display: flex;
     align-items: center;
     gap: 8px;
     margin-bottom: 15px;
    /* Spacing below the title version */
}
/* Specific styling for the single page stars */
 .bv-single-rating-wrap .star-rating {
     font-size: 16px;
    /* Slightly larger stars for single pages */
     color: #ffb400;
    /* Precise golden yellow */
}
/* Number style (like "13 Ratings | 8 Reviews" in image_6.png) */
 .bv-single-count {
     font-size: 14px;
     color: #888;
    /* Soft grey like the reference images */
     font-weight: 400;
}
/* Adjusting the version inside the gray price box (image_7.png) */
 .gray-price-box .bv-single-rating-wrap {
     margin: 5px 0 15px 0;
    /* Adjust spacing inside the price box */
     justify-content: flex-start;
    /* Aligns left with price */
}
/* Final Color Fix to ensure background stars match image_6.png standard */
 .star-rating::before {
     color: #ffb400;
    /* Rokomari/MamunBooks style uses yellow for empty stars */
     opacity: 0.3;
    /* This creates the hollow light-yellow outline */
}
/* Recently Viewed সেকশনে স্টারের অ্যালাইনমেন্ট ঠিক করার জন্য */
 .bv-slider-stars {
     display: block !important;
    /* স্টারগুলোকে নতুন লাইনে নিয়ে আসবে */
     width: 100% !important;
     text-align: center !important;
    /* সেন্টারে রাখবে */
     margin: 5px 0 10px 0 !important;
    /* উপরে-নিচে গ্যাপ তৈরি করবে */
     clear: both !important;
    /* কোনো সাইড এলিমেন্ট থাকলে তা সরিয়ে দিবে */
}
 .bv-slider-stars .star-rating {
     display: inline-block !important;
    /* স্টারগুলোকে এক লাইনে রাখবে */
     float: none !important;
     vertical-align: middle !important;
}
/* ব্র্যাকেটে থাকা রেটিং কাউন্ট (0) এর জন্য */
 .bv-slider-stars span {
     display: inline-block !important;
     vertical-align: middle !important;
     margin-left: 5px !important;
}