/*
 Theme Name:   Shuvadip Mondal
 Theme URI:    https://generatepress.com
 Description:  No 1 SEO optimised Theme
 Author:       Shuvadip Mondal
 Author URI:   https://shuvadipmondal.com/
 Template:     generatepress
 Version:      0.1
*/

.comment-form #url {
  display: none;
}

@media (min-width: 769px) {
  .site-content {
    display: flex;
  }

  .inside-right-sidebar {
    height: 100%;
  }

  .inside-right-sidebar aside:last-child {
    position: -webkit-sticky;
    position: sticky;
    top: 70px; /* Adjust position */
  }
}
/* sticky sidebar end */



.horizontal-scroll {
  flex-wrap: nowrap;
  overflow-x: auto;
  margin-top: 10px;
}

/* Home page custom css */
.secondary-post > div:not(:last-child) {
  border-bottom: 1px solid lightgrey;
}

/* headings highlight */
.gb-highlight {
  background-image: linear-gradient(45deg, #e96443, #904e95);
  color: transparent;
  -webkit-background-clip: text;
}

/* meta data */
.entry-meta {
  font-size: 14px;
}

/* Sidebar Universal */
.widget-title {
  padding: 10px 10px;
  background-image: linear-gradient(to right, #ebebeb 0%, #ebebeb 50%, #ebebeb 100%);
  border-radius: 10px;
  font-weight: 500;
  color: white !important;
  font-size: 18px !important;
  text-align: center;
  box-shadow: rgba(23, 43, 99, 0.3) 0 7px 28px;
}

.sidebar .widget {
  box-shadow: rgba(23, 43, 99, 0.3) 0 6px 18px;
  border-radius: 5px;
}

.sidebar .widget:first-child {
  background-image: linear-gradient(to right, #ffffff 0%, #ffffff 50%, #ffffff 100%);
}

.button.light {
  background-color: #fff;
  border-radius: 50px;
  font-weight: 700;
  color: #333;
}

.button.light:hover {
  background: #333;
  color: #fff;
}
/* End of sidebar code */

/* Shadow primary Navigation */
.main-navigation {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: #fff;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

/* Button Style */
.read-more-bt,
a.button,
.pagination-bt,
.wp-block-search__button,
input[type="submit"] {
  font-size: 19px;
  padding: 10px 25px;
  transition: 0.5s;
  background-size: 200% auto;
  box-shadow: rgba(23, 43, 99, 0.3) 0 7px 28px;
  background-image: linear-gradient(to right, #ff1500 0, #ff6f00 51%, #ff1500 100%);
  border-radius: 50px;
}

.read-more-bt:hover,
a.button:hover,
input[type="submit"]:hover,
.pagination-bt:hover,
.wp-block-search__button:hover {
  background-position: right center;
  color: #fff;
  text-decoration: none;
}

/* above title icons */
.scroll-list {
  display: inline-block;
  white-space: nowrap;
  padding-left: 1px;
  text-align: center;
  margin-right: 20px;
}

/* mobile-action-bar */
.mobile-action-bar {
  position: fixed;
  width: 100%;
  bottom: 0;
}

/* Rank Math FAQ */
/* Rank Math FAQ container */
#rank-math-faq {
  background-color: #fff;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.08);
  margin-bottom: 30px;
}

/* Rank Math FAQ list item */
#rank-math-faq .rank-math-list-item {
  position: relative;
  margin-bottom: 15px;
}

/* Invisible input checkbox to toggle FAQ */
#rank-math-faq .rank-math-list-item input {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 41px;
  opacity: 0;
  cursor: pointer;
  z-index: 999;
}

/* FAQ header (question) */
#rank-math-faq .rank-math-list-item h3 {
  background: #f1f2f6;
  padding: 10px 12px 10px 18px;
  cursor: pointer;
  font-size: 18px !important;
  font-weight: normal !important;
  position: relative;
  margin-bottom: 0;
  border-radius: 5px;
  transition: background-color 0.3s;
}

/* Arrow before FAQ question */
#rank-math-faq .rank-math-list-item h3:before {
  display: inline-block;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 12px;
  border-color: transparent transparent transparent #000000;
  margin-right: 8px;
  transition: transform 0.3s ease;
}

/* Rotate arrow when FAQ is open */
#rank-math-faq .rank-math-list-item input:checked + h3:before {
  transform: rotate(90deg);
}

/* FAQ answer (content) */
#rank-math-faq .rank-math-answer {
  padding: 10px 10px 0px 10px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease, padding 0.3s ease;
}

/* Expand answer when FAQ is open */
#rank-math-faq .rank-math-list-item input:checked + h3 ~ .rank-math-answer {
  max-height: 100vh;
  overflow: visible;
  padding: 10px;
}





/* Easy TOC container */
#ez-toc-container {
  background-color: #fff;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.08);
  margin-bottom: 30px;
  font-family: inherit; /* Matches the site's default font */
}

/* TOC title */
#ez-toc-container .ez-toc-title {
  font-size: 18px;
  font-weight: 600;
  padding: 10px 15px;
  background-color: #f1f2f6;
  border-radius: 5px;
  margin-bottom: 10px;
  cursor: pointer;
  transition: background-color 0.3s;
}

/* TOC list styling */
#ez-toc-container ul,
#ez-toc-container ol {
  list-style: none; /* Removes bullets or numbers */
  padding: 0;
}

#ez-toc-container li {
  padding: 10px 0;
  font-size: 16px;
  border-bottom: 1px solid #e0e0e0;
}

#ez-toc-container li:last-child {
  border-bottom: none;
}

/* TOC links */
#ez-toc-container a {
  color: #333;
  text-decoration: none;
  transition: color 0.3s;
}

#ez-toc-container a:hover {
  color: #ff6f00;
}

/* Responsive design for smaller screens */
@media (max-width: 768px) {
  /* Adjust container padding for mobile */
  #ez-toc-container {
    padding: 15px;
  }

  /* Smaller font for mobile TOC title */
  #ez-toc-container .ez-toc-title {
    font-size: 16px;
  }

  /* Adjust padding of list items for mobile */
  #ez-toc-container li {
    padding: 8px 0;
    font-size: 14px;
  }
}




/* single post container width and shadow */
.single-post .inside-article {
  max-width: 950px;
  margin: 0 auto; /* Center the content */
}

 .single-post .inside-article {
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 8px;
  padding: 20px; /* Optional: Add padding for better spacing */
  border-radius: 8px; /* Optional: Add rounded corners */
}





/* Add a white box shadow to the whole table */


/* =========================================
   MODERN WORDPRESS BLOCKQUOTE
   ========================================= */
/* =====================================================
MODERN COMPACT QUOTE CARD
WordPress Quote Block
===================================================== */

.wp-block-quote {
position: relative !important;

width: 100% !important;
max-width: 620px !important;

margin: 32px auto !important;
padding: 52px 38px 30px !important;

box-sizing: border-box !important;

/* Card */
background: #ffffff !important;

border: 1px solid #e7e7f3 !important;
border-left: 4px solid #6366f1 !important;
border-radius: 16px !important;

box-shadow:
0 8px 25px rgba(99, 102, 241, 0.10) !important;

overflow: hidden !important;

/* Let the blog/theme decide the font */
font-family: inherit !important;

color: #1e293b !important;
}


/* =====================================================
TOP-LEFT QUOTATION MARK
===================================================== */

.wp-block-quote::before {
content: "“" !important;

position: absolute !important;

top: -3px !important;
left: 20px !important;

margin: 0 !important;
padding: 0 !important;

font-family: Arial, sans-serif !important;
font-size: 68px !important;
font-weight: 800 !important;
font-style: normal !important;
line-height: 1 !important;

color: #ff6b00 !important;

z-index: 5 !important;

pointer-events: none !important;
}


/* =====================================================
TOP-RIGHT DECORATIVE SHAPE
===================================================== */

.wp-block-quote::after {
content: "" !important;

position: absolute !important;

width: 105px !important;
height: 105px !important;

top: -58px !important;
right: -28px !important;

border-radius: 50% !important;

background: linear-gradient(
135deg,
#6366f1,
#a855f7
) !important;

opacity: 0.16 !important;

z-index: 1 !important;

pointer-events: none !important;
}


/* =====================================================
QUOTE TEXT
===================================================== */

.wp-block-quote > p {
position: relative !important;
z-index: 4 !important;

display: block !important;

margin: 0 !important;
padding: 0 4px !important;

/* IMPORTANT:
inherit your normal blog typography */
font-family: inherit !important;

font-size: inherit !important;
font-style: normal !important;
font-weight: inherit !important;
line-height: inherit !important;

color: #1e293b !important;

text-align: center !important;
}


/* =====================================================
CITATION
===================================================== */

.wp-block-quote > cite {
position: relative !important;
z-index: 4 !important;

display: block !important;

margin: 14px 0 0 !important;
padding: 0 !important;

font-family: inherit !important;
font-size: 13px !important;
font-style: normal !important;
font-weight: 600 !important;

color: #6366f1 !important;

text-align: center !important;
}


/* Little orange accent before author */
.wp-block-quote > cite::before {
content: "" !important;

display: inline-block !important;

width: 20px !important;
height: 2px !important;

margin-right: 7px !important;

vertical-align: middle !important;

border-radius: 10px !important;

background: #ff6b00 !important;
}


/* =====================================================
HOVER
===================================================== */

.wp-block-quote {
transition:
transform 0.25s ease,
box-shadow 0.25s ease !important;
}

.wp-block-quote:hover {
transform: translateY(-2px) !important;

box-shadow:
0 14px 32px rgba(99, 102, 241, 0.14) !important;
}


/* =====================================================
MOBILE
===================================================== */

@media (max-width: 768px) {

.wp-block-quote {
max-width: calc(100% - 10px) !important;

margin: 26px auto !important;

padding: 48px 22px 26px !important;

border-radius: 14px !important;
}

.wp-block-quote::before {
left: 15px !important;
top: -4px !important;
font-size: 60px !important;
}

.wp-block-quote > p {
font-size: inherit !important;
line-height: 1.6 !important;
}
}
/* ...........................................................read more css .............................*/

.related-posts {
    margin-top: 30px; /* Adds some space before the section */
    padding: 15px; /* Adds padding around the content */
    background-color: #f9f9f9; /* Subtle background color for contrast */
    border: 1px solid #e1e1e1; /* Light border for definition */
    border-radius: 8px; /* Rounded corners */
    font-size: 20px; /* Slightly larger text for readability */
    line-height: 1.6; /* Improved line height for better readability */
    color: #333; /* Dark text color for readability */
}

.related-posts strong {
    font-size: 20px; /* Larger bold text for "Read More" */
    color: #ff6900; /* Darker color for the strong text */
    display: inline-block; /* Keep "Read More" inline with the link */
    margin-right: 8px; /* Spacing between "Read More" and the link */
}

.related-posts a {
    color: #0073aa; /* Blue color for the link */
    font-weight: bold; /* Make the link bold */
    text-decoration: none; /* Remove the underline */
    transition: color 0.3s ease, text-decoration 0.3s ease; /* Smooth transition */
}

.related-posts a:hover {
    color: #005f8d; /* Darker blue on hover */
    text-decoration: underline; /* Underline on hover for better interactivity */
}

.related-posts a:focus {
    outline: none; /* Remove the default focus outline */
    border-bottom: 2px solid #0073aa; /* Add a custom focus underline */
}

.related-posts ul {
    list-style-type: none; /* Remove default list styling */
    padding: 0; /* Remove padding */
    margin: 10px 0 0; /* Add some margin on top */
}

.related-posts li {
    margin-bottom: 10px; /* Add space between list items */
}

.related-posts .read-more-container {
    display: flex;
    justify-content: flex-start; /* Align the text and link to the left */
    align-items: center; /* Vertically align the text */
    gap: 10px; /* Space between the text and the link */
}



/* ............................................................. General reset for unordered and ordered lists ............................................................. */
.single .inside-article ul,
.single .inside-article ol {
list-style: none; /* Remove default list styling */
padding-left: 0; /* Remove extra padding */
margin-left: 0; /* Align lists to the content edge */
}

/* ............................................................. Ordered list styling (including sublist reset) ............................................................. */
.single .inside-article ol {
counter-reset: custom-counter; /* Initialize the counter for ordered list */
}

/* Enhance ordered list items */
.single .inside-article ol li {
position: relative; /* Enable positioning for the :before pseudo-element */
padding-left: 2.2em; /* Add space for the bold circle */
counter-increment: custom-counter; /* Increment the custom counter */
}

/* Style for the numbers inside the ordered list items */
.single .inside-article ol li:before {
content: counter(custom-counter); /* Use custom counter for numbers */
display: inline-flex; /* Display as inline-flex to center text */
align-items: center; /* Center the number vertically */
justify-content: center; /* Center the number horizontally */
width: 35px; /* Larger circle width */
height: 35px; /* Larger circle height */
border: 3px solid #72C472; /* Thicker circle border in green */
border-radius: 50%; /* Make it a perfect circle */
color: #72C472; /* Bold green color for the text */
font-weight: 700; /* Make numbers extra bold */
font-size: 16px; /* Increase font size for prominence */
position: absolute; /* Position it relative to the list item */
left: 0; /* Align to the left */
top: 0; /* Align to the first line */
transform: translateY(3px); /* Slightly adjust vertical alignment */
background-color: white; /* White background for better contrast */
box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.15); /* Enhanced shadow for depth */
}

/* Nested ordered list (reset the counter for sublists) */
.single .inside-article ol li > ol {
counter-reset: nested-counter; /* Reset counter for sublists */
}

/* Nested ordered list items */
.single .inside-article ol li > ol li {
counter-increment: nested-counter; /* Increment the nested counter */
}

/* Nested ordered list numbers */
.single .inside-article ol li > ol li:before {
content: counter(nested-counter); /* Display the nested counter for sublist items */
display: inline-flex; /* Display as inline-flex to center text */
align-items: center; /* Center the number vertically */
justify-content: center; /* Center the number horizontally */
width: 30px; /* Smaller circle for sublist numbers */
height: 30px; /* Adjust height for sublist */
border: 2px solid #72C472; /* Thicker border for sublist items */
border-radius: 50%; /* Make it a perfect circle */
color: #72C472; /* Bold green color for the text */
font-weight: 700; /* Make numbers extra bold */
font-size: 14px; /* Slightly smaller font size for sublist numbers */
position: absolute; /* Position it relative to the list item */
left: 0; /* Align to the left */
top: 0; /* Align to the first line of the nested list item */
transform: translateY(3px); /* Slightly adjust vertical alignment */
background-color: white; /* White background for contrast */
box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.15); /* Enhanced shadow for depth */
}

/* ............................................................. Unordered list (custom bullet styling) ............................................................. */
.single .inside-article ul li {
position: relative; /* Enable absolute positioning for :before */
padding-left: 2em; /* Add space for the custom bullet */
}

/* Custom Bullet (SVG icon) for unordered list items */
.single .inside-article ul li:before {
content: ''; /* No default content */
display: inline-block; /* Display the SVG bullet */
width: 20px; /* Width of the bullet */
height: 20px; /* Height of the bullet */
position: absolute; /* Position relative to the list item */
left: 0; /* Align bullet to the left */
top: 3px; /* Slightly move down for alignment */
background: url('data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20opacity%3D%220.4%22%20d%3D%22M12%2022C17.5228%2022%2022%2017.5228%2022%2012C22%206.47715%2017.5228%202%2012%202C6.47715%202%202%206.47715%202%2012C2%2017.5228%206.47715%2022%2012%2022Z%22%20fill%3D%22%236D28D9%22/%3E%3Cpath%20d%3D%22M10.7397%2016.2802C10.5497%2016.2802%2010.3597%2016.2102%2010.2097%2016.0602C9.91969%2015.7702%209.91969%2015.2902%2010.2097%2015.0002L13.2097%2012.0002L10.2097%209.00016C9.91969%208.71016%209.91969%208.23016%2010.2097%207.94016C10.4997%207.65016%2010.9797%207.65016%2011.2697%207.94016L14.7997%2011.4702C15.0897%2011.7602%2015.0897%2012.2402%2014.7997%2012.5302L11.2697%2016.0602C11.1197%2016.2102%2010.9297%2016.2802%2010.7397%2016.2802Z%22%20fill%3D%22%236D28D9%22/%3E%3C/svg%3E') no-repeat center center;

background-size: contain; /* Ensure the SVG scales properly */
}
/* ......................................................................Article/POST SMALL container width for PC ONLY....................................... */
@media (min-width: 1024px) {
    .single .inside-article {
        max-width: 750px; /* Adjust this value as needed */
        margin: 0 auto;
    }
}





/* ........................................................................Default shadow on post images........................................................................ */
.single .inside-article img {
    /* Softer, more subtle shadow for a pop-up effect */
    box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 12px 0px;
	margin-bottom: 20px;

    /* Border radius for rounded corners */
    border-radius: 20px; /* Adjust this value for more or less rounded corners */
}

/* Adjusting gap between list items (unordered and ordered) inside single posts */
.single .inside-article ul li, 
.single .inside-article ol li {
    margin-bottom: 27px;  /* Adjust the value (9px) as per your needs */
}

/* ================================
   BOOK A CALL — REFINED HEADER CTA
   GeneratePress
   CSS Class: sv-book-call-menu
   ===================== */
/* BOOK A CALL — REFINED HEADER CTA (v2, modern pill + icon) */
/* BOOK A CALL — REFINED HEADER CTA (v3, polished pill) */
.main-navigation ul li.sv-book-call-menu,
#site-navigation ul li.sv-book-call-menu {
    display: flex;
    align-items: center;
    margin-left: 8px;
}

.main-navigation ul li.sv-book-call-menu > a,
#site-navigation ul li.sv-book-call-menu > a {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 7px;
    background: linear-gradient(135deg, #7c5cff, #5636d9) !important;
    color: #ffffff !important;
    padding: 9px 20px !important;
    border-radius: 50px !important;
    font-weight: 600;
    font-size: 14px;
    line-height: 1;
    white-space: nowrap;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    box-shadow: 0 3px 10px rgba(109, 74, 255, 0.35);
}

.main-navigation ul li.sv-book-call-menu > a::before,
#site-navigation ul li.sv-book-call-menu > a::before {
    content: "";
    display: inline-block;
    width: 15px;
    height: 15px;
    flex-shrink: 0;
    background-color: #ffffff;
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6.62 10.79a15.05 15.05 0 0 0 6.59 6.59l2.2-2.2a1 1 0 0 1 1.01-.24 11.36 11.36 0 0 0 3.58.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11.36 11.36 0 0 0 .57 3.58 1 1 0 0 1-.25 1.01l-2.2 2.2z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6.62 10.79a15.05 15.05 0 0 0 6.59 6.59l2.2-2.2a1 1 0 0 1 1.01-.24 11.36 11.36 0 0 0 3.58.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11.36 11.36 0 0 0 .57 3.58 1 1 0 0 1-.25 1.01l-2.2 2.2z'/></svg>");
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

.main-navigation ul li.sv-book-call-menu > a:hover,
#site-navigation ul li.sv-book-call-menu > a:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 6px 16px rgba(109, 74, 255, 0.5);
}

/* SEARCH MODAL — MODERN STYLING ...........................................................................*/

/* ============================================
   SEARCH MODAL — DARK GLOW PILL (FINAL)
   ============================================ */

.search-modal-form,
.navigation-search .search-form {
    max-width: 600px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    background: linear-gradient(135deg, #2a1f5c, #1a1240);
    border: 1px solid rgba(140, 110, 255, 0.5);
    border-radius: 50px;
    padding: 4px 4px 4px 22px;
    box-shadow: 0 0 25px rgba(124, 92, 255, 0.35);
}

.search-modal-form input[type="search"],
.navigation-search input[type="search"] {
    border: none !important;
    background: transparent !important;
    padding: 12px 0 !important;
    font-size: 17px;
    color: #ffffff !important;
    outline: none !important;
    flex: 1;
    box-shadow: none !important;
}

.search-modal-form input[type="search"]::placeholder,
.navigation-search input[type="search"]::placeholder {
    color: rgba(255, 255, 255, 0.55);
}

.search-modal-form input[type="search"]::-webkit-search-cancel-button {
    display: none;
}

.search-modal-form button,
.navigation-search .search-submit {
    background: #ffffff !important;
    border-radius: 50px !important;
    border: none !important;
    padding: 14px 28px !important;
    margin: 0;
    height: auto;
    width: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    color: #1a1240;
    font-size: 15px;
    cursor: pointer;
    transition: transform 0.15s ease;
}

.search-modal-form button:hover,
.navigation-search .search-submit:hover {
    transform: scale(1.03);
}

/* Hide the default icon in all its possible forms */
.search-modal-form button svg,
.navigation-search .search-submit svg,
.search-modal-form button .gp-icon,
.navigation-search .search-submit .gp-icon,
.search-modal-form button i,
.navigation-search .search-submit i {
    display: none !important;
}

/* Show "Search" text instead */
.search-modal-form button::after,
.navigation-search .search-submit::after {
    content: "Search" !important;
}

/* =========================================
========================================= */
/* =========================================
   GeneratePress - Stylish Gutenberg Tables
   ========================================= */

.wp-block-table {
    margin: 35px 0;
}

/* The actual table */
.wp-block-table > table {
    width: 100%;
    margin: 0;
    border-collapse: separate !important;
    border-spacing: 0;
    overflow: hidden;

    background: #ffffff;

    border: 1px solid #e4e6f0 !important;
    border-radius: 14px !important;

    box-shadow: 0 10px 30px rgba(49, 60, 91, 0.10);

    color: #40566f;
}


/* =========================================
   HEADER
   ========================================= */

.wp-block-table > table > thead > tr {
    background: linear-gradient(
        135deg,
        #6254e8,
        #7168f2
    ) !important;
}

.wp-block-table > table > thead > tr > th {
    background: transparent !important;
    color: #ffffff !important;

    padding: 17px 18px !important;

    border: 0 !important;

    font-size: 16px;
    font-weight: 700;
    text-align: left;
}


/* =========================================
   BODY
   ========================================= */

.wp-block-table > table > tbody > tr {
    background: #ffffff !important;

    transition:
        background-color 0.2s ease,
        box-shadow 0.2s ease;
}

.wp-block-table > table > tbody > tr:nth-child(even) {
    background: #faf9ff !important;
}


/* Cells */

.wp-block-table > table > tbody > tr > td {
    padding: 16px 18px !important;

    border: 0 !important;
    border-bottom: 1px solid #edf0f6 !important;

    color: #40566f;
}


/* Last row */

.wp-block-table > table > tbody > tr:last-child > td {
    border-bottom: 0 !important;
}


/* =========================================
   FIRST / LEFT COLUMN
   Permanent Violet Accent
   ========================================= */

.wp-block-table > table > tbody > tr > td:first-child {
    color: #334b66;
    font-weight: 600;

    border-left: 4px solid #6254e8 !important;
}


/* =========================================
   HOVER
   ========================================= */

.wp-block-table > table > tbody > tr:hover {
    background: #f3f1ff !important;
}

.wp-block-table > table > tbody > tr:hover > td:first-child {
    color: #6254e8;
}


/* =========================================
   ROUNDED CORNERS
   ========================================= */

.wp-block-table > table > thead > tr:first-child > th:first-child {
    border-top-left-radius: 14px;
}

.wp-block-table > table > thead > tr:first-child > th:last-child {
    border-top-right-radius: 14px;
}

.wp-block-table > table > tbody > tr:last-child > td:first-child {
    border-bottom-left-radius: 14px;
}

.wp-block-table > table > tbody > tr:last-child > td:last-child {
    border-bottom-right-radius: 14px;
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 600px) {

    .wp-block-table {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .wp-block-table > table {
        min-width: 520px;
        font-size: 14px;
    }

    .wp-block-table > table > thead > tr > th,
    .wp-block-table > table > tbody > tr > td {
        padding: 13px 14px !important;
    }
}

/* =========================================
   Post Tags
   ========================================= */

.vv-post-tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;

    margin: 30px 0 25px;
    padding: 18px 20px;

    background: #faf9ff;
    border: 1px solid #e7e4f7;
    border-radius: 12px;

    box-shadow: 0 6px 20px rgba(49, 60, 91, 0.06);
}


/* Tags title */

.vv-post-tags-title {
    color: #334b66;

    font-size: 14px;
    font-weight: 700;

    margin-right: 3px;
}


/* Individual tag */

.vv-post-tag {
    display: inline-flex;
    align-items: center;

    padding: 7px 12px;

    background: #ffffff;

    border: 1px solid #dcd8f7;
    border-radius: 7px;

    color: #6254e8 !important;

    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;

    text-decoration: none !important;

    transition:
        background-color 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease,
        box-shadow 0.2s ease;
}


/* Hover */

.vv-post-tag:hover {
    background: #6254e8;

    border-color: #6254e8;

    color: #ffffff !important;

    transform: translateY(-1px);

    box-shadow: 0 4px 10px rgba(98, 84, 232, 0.20);
}


/* =========================================
   Mobile
   ========================================= */

@media (max-width: 600px) {

    .vv-post-tags {
        padding: 15px;
        gap: 7px;
        margin: 25px 0 20px;
    }

    .vv-post-tags-title {
        width: 100%;
        margin-bottom: 3px;
    }

    .vv-post-tag {
        padding: 7px 10px;
        font-size: 12px;
    }
}

/* =========================================
   GeneratePress - Previous / Next Navigation
   ========================================= */
/* =========================================
   PREMIUM PREVIOUS / NEXT POST NAVIGATION
   GenerateBlocks + GeneratePress
   ========================================= */

.vv-post-navigation {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;

    width: 100%;
    box-sizing: border-box;

    margin: 32px 0;
    padding: 18px 0;

    border-top: 1px solid #e5e6ef;
    border-bottom: 1px solid #e5e6ef;
}


/* =========================================
   NAVIGATION LINKS
   ========================================= */

.vv-post-prev,
.vv-post-next {
    position: relative;

    display: flex;
    align-items: center;

    min-height: 82px;

    padding: 14px 16px;

    box-sizing: border-box;

    background: #faf9ff;

    border: 1px solid #e9e7f7;
    border-radius: 12px;

    color: #334b66 !important;
    text-decoration: none !important;

    transition:
        background-color 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease;
}


/* Previous alignment */

.vv-post-prev {
    justify-content: flex-start;
}


/* Next alignment */

.vv-post-next {
    justify-content: flex-end;
    text-align: right;
}


/* =========================================
   HOVER CARD
   ========================================= */

.vv-post-prev:hover,
.vv-post-next:hover {
    background: #ffffff;

    border-color: #dcd8f7;

    box-shadow:
        0 8px 25px rgba(49, 60, 91, 0.08);

    transform: translateY(-2px);
}


/* =========================================
   ARROWS
   ========================================= */

.vv-post-arrow {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;

    flex: 0 0 46px;

    border-radius: 10px;

    background: linear-gradient(
        135deg,
        #6254e8,
        #7168f2
    );

    color: #ffffff !important;

    font-size: 30px;
    font-weight: 300;
    line-height: 1;

    box-shadow:
        0 5px 14px rgba(98, 84, 232, 0.20);

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}


/* =========================================
   ARROW SPACING
   ========================================= */

.vv-post-prev .vv-post-arrow {
    margin-right: 16px;
}

.vv-post-next .vv-post-arrow {
    margin-left: 16px;
}


/* =========================================
   TEXT CONTAINER
   ========================================= */

.vv-post-info {
    display: flex;
    flex-direction: column;

    min-width: 0;

    gap: 5px;
}


/* =========================================
   PREVIOUS / NEXT LABEL
   ========================================= */

.vv-post-label {
    display: block;

    color: #6254e8;

    font-size: 10px;
    font-weight: 800;

    line-height: 1;

    text-transform: uppercase;
    letter-spacing: 0.7px;
}


/* =========================================
   POST TITLE
   ========================================= */

.vv-post-title {
    display: -webkit-box;

    color: #334b66;

    font-size: 14px;
    font-weight: 650;

    line-height: 1.45;

    max-width: 330px;

    overflow: hidden;

    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;

    transition: color 0.2s ease;
}


/* =========================================
   TITLE HOVER
   ========================================= */

.vv-post-prev:hover .vv-post-title,
.vv-post-next:hover .vv-post-title {
    color: #6254e8;
}


/* =========================================
   ARROW HOVER
   ========================================= */

.vv-post-prev:hover .vv-post-arrow {
    transform: translateX(-4px);

    box-shadow:
        0 8px 20px rgba(98, 84, 232, 0.30);
}


.vv-post-next:hover .vv-post-arrow {
    transform: translateX(4px);

    box-shadow:
        0 8px 20px rgba(98, 84, 232, 0.30);
}


/* =========================================
   SUBTLE TOP ACCENT
   ========================================= */

.vv-post-prev::before,
.vv-post-next::before {
    content: "";

    position: absolute;

    top: 0;
    left: 20px;
    right: 20px;

    height: 2px;

    background: linear-gradient(
        90deg,
        #6254e8,
        #7168f2
    );

    border-radius: 0 0 5px 5px;

    opacity: 0;

    transition: opacity 0.25s ease;
}


.vv-post-prev:hover::before,
.vv-post-next:hover::before {
    opacity: 1;
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 700px) {

    .vv-post-navigation {
        grid-template-columns: 1fr;
        gap: 12px;

        margin: 25px 0;
        padding: 16px 0;
    }


    .vv-post-prev,
    .vv-post-next {
        min-height: 72px;

        padding: 12px 14px;
    }


    .vv-post-next {
        justify-content: flex-start;
        text-align: left;
    }


    .vv-post-next .vv-post-arrow {
        order: -1;

        margin-left: 0;
        margin-right: 12px;
    }


    .vv-post-arrow {
        width: 40px;
        height: 40px;

        flex-basis: 40px;

        font-size: 27px;
    }


    .vv-post-prev .vv-post-arrow {
        margin-right: 12px;
    }


    .vv-post-title {
        font-size: 13px;
    }
}

/* =========================================
   NO SELECTION OF IMAGE
   ========================================= */
img {
    -webkit-user-drag: none !important;
    -webkit-user-select: none !important;
    user-select: none !important;
    pointer-events: none !important;
}

/* ==========================================
   SHUVADIP MONDAL — WORDPRESS COMMENT DESIGN
   GeneratePress compatible
========================================== */

/* Comment section spacing */
#comments,
#respond {
  margin-top: 36px;
  color: #263449;
  font-family: inherit;
}

/* Main comments heading */
#comments .comments-title,
#respond .comment-reply-title {
  color: #263449;
  font-size: clamp(25px, 3vw, 32px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.5px;
  margin: 0 0 20px;
}

/* Leave a comment form card */
#respond {
  padding: 28px;
  background: #ffffff;
  border: 1px solid #e8edf3;
  border-radius: 16px;
  box-shadow: 0 5px 24px rgba(15, 23, 42, 0.045);
}

/* Logged-in user information */
#respond .logged-in-as,
#respond .comment-notes {
  color: #64748b;
  font-size: 14px;
  line-height: 1.8;
  margin: 0 0 22px;
}

#respond .logged-in-as a,
#respond .comment-notes a {
  color: #2563eb;
  text-decoration: none;
}

#respond .logged-in-as a:hover,
#respond .comment-notes a:hover {
  text-decoration: underline;
}

/* Form labels */
#respond .comment-form label {
  display: block;
  color: #334155;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 8px;
}

/* Comment textarea */
#respond textarea#comment {
  display: block;
  width: 100%;
  min-height: 150px;
  padding: 15px 16px;
  color: #263449;
  background: #f8fafc;
  border: 1px solid #dbe3ed;
  border-radius: 10px;
  font-family: inherit;
  font-size: 15px;
  line-height: 1.7;
  resize: vertical;
  box-shadow: none;
  transition:
    border-color .2s ease,
    background .2s ease,
    box-shadow .2s ease;
}

#respond textarea#comment::placeholder {
  color: #94a3b8;
}

#respond textarea#comment:focus {
  background: #ffffff;
  border-color: #2563eb;
  outline: none;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

/* Name, email and website fields, when present */
#respond input[type="text"],
#respond input[type="email"],
#respond input[type="url"] {
  width: 100%;
  max-width: 100%;
  min-height: 46px;
  padding: 11px 14px;
  color: #263449;
  background: #f8fafc;
  border: 1px solid #dbe3ed;
  border-radius: 9px;
  font-family: inherit;
  font-size: 15px;
  box-shadow: none;
  transition: border-color .2s ease, box-shadow .2s ease;
}

#respond input[type="text"]:focus,
#respond input[type="email"]:focus,
#respond input[type="url"]:focus {
  background: #ffffff;
  border-color: #2563eb;
  outline: none;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

/* Form field spacing */
#respond .comment-form-comment,
#respond .comment-form-author,
#respond .comment-form-email,
#respond .comment-form-url {
  margin-bottom: 20px;
}

/* Cloudflare verification: preserve its original layout */
#respond .cf-turnstile {
  margin: 14px 0 22px;
  max-width: 100%;
}

/* Submit button */
#respond input#submit,
#respond .form-submit input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 12px 24px;
  background: #2563eb;
  color: #ffffff;
  border: 1px solid #2563eb;
  border-radius: 9px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(37, 99, 235, .17);
  transition:
    background .2s ease,
    border-color .2s ease,
    box-shadow .2s ease,
    transform .2s ease;
}

#respond input#submit:hover,
#respond .form-submit input[type="submit"]:hover {
  background: #1d4ed8;
  border-color: #1d4ed8;
  color: #ffffff;
  box-shadow: 0 6px 16px rgba(37, 99, 235, .22);
  transform: translateY(-1px);
}

#respond input#submit:focus-visible {
  outline: 3px solid rgba(37, 99, 235, .3);
  outline-offset: 3px;
}

/* Privacy / cookies checkbox */
#respond .comment-form-cookies-consent {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin: 16px 0;
}

#respond .comment-form-cookies-consent input {
  margin-top: 5px;
}

#respond .comment-form-cookies-consent label {
  font-weight: 400;
  line-height: 1.6;
}

/* Existing comments */
#comments .comment-list {
  margin-top: 25px;
}

#comments .comment-body {
  padding: 20px;
  margin-bottom: 16px;
  background: #f8fafc;
  border: 1px solid #e8edf3;
  border-radius: 12px;
}

#comments .comment-author .fn {
  color: #263449;
  font-weight: 600;
}

#comments .comment-meta,
#comments .comment-metadata {
  color: #64748b;
  font-size: 13px;
}

#comments .comment-content {
  color: #475569;
  line-height: 1.8;
  overflow-wrap: anywhere;
}

#comments .reply a {
  color: #2563eb;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}

#comments .reply a:hover {
  text-decoration: underline;
}

/* Mobile responsive adjustments */
@media (max-width: 600px) {
  #respond {
    padding: 19px 16px;
    border-radius: 12px;
  }

  #comments,
  #respond {
    margin-top: 26px;
  }

  #comments .comments-title,
  #respond .comment-reply-title {
    font-size: 25px;
  }

  #respond textarea#comment {
    min-height: 130px;
  }

  #respond input#submit,
  #respond .form-submit input[type="submit"] {
    width: 100%;
    min-height: 48px;
  }

  #comments .comment-body {
    padding: 15px;
  }
}

/* Reduced motion accessibility */
@media (prefers-reduced-motion: reduce) {
  #respond *,
  #comments * {
    transition: none !important;
  }
}

/* Reduce WordPress comment box height by half */
#respond textarea#comment {
  min-height: 105px !important;
  height: 75px !important;
  padding: 12px 14px;
}