/**
1.0  Variables
2.0  Normalize
3.0  Common
4.0  Header
      4.1 Top Header 
      4.2 Header Main 
          4.2.1 header--layout-one
5.0  Home Page
      5.1 Introduction Section
      5.2 Tags Categories Group Section
      5.3 Main Banner Section
      5.4 Featured Blogs 
      5.5 Latest Blogs Wrapper
      5.6 Latest Blogs 
      5.7 Pagination
      5.8 Sidebar 
      5.9 You may have missed 
6.0  Footer
7.0  Single Post
      7.1 Breadcrumb
      7.2 Blog Item
      7.3 Post Navigation
      7.4 Comments
      7.5 Related Posts Missed Section
      7.6 Single Layout Two
8.0  Category Page
9.0  No Results Page
10.0 404 Page
11.0 Contact form 
12.0 Theme mode toggle
13.0 Back to top button
14.0 Dark mode
**/

/*
=========================================
1.0 Variables
=========================================
*/

:root {
  /* color presents */
  --ink-primary-color: #ff9a83;
  --ink-secondary-color: #49b0ef;
  --ink-author-bg-color: #f4f3ff;
  --ink-bg: #f4f3ff;
  --ink-bg-dark-mode: #171718;
  --ink-bottom-footer-bg: none;
  --ink-bottom-footer-text-color-hover: #ff9a83;
  --ink-bottom-footer-text-color-initial: #f7f7f7;
  --ink-placeholder-dark-color: #b0b0b0;
  --ink-pre-border-color: #f4f4f4;
  --ink-box-shadow-color: #a39bf74d;
  --ink-color-1: #f7f7f7;
  --ink-color-2: #111111;
  --ink-color-3: #a39bf7;
  --ink-color-4: #ffffff;
  --ink-footer-meta-bg-color: #f4f3ff;
  --ink-primary-box-shadow-color: #ff9a834d;
  --ink-reply-link-bg-color: #ff9a8366;
  --ink-site-box-bg: #f6f6f6;
  --ink-site-footer-bg: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 154, 131, 1) 100%
  );
  --ink-site-header-bg: linear-gradient(
    to top,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 100%
  );
  --ink-site-title-tagline-color-hover: #ff9a83;
  --ink-site-title-tagline-color-initial: #111111;
  --ink-site-sticky-header-bg: rgba(255, 255, 255, 0.6);
  --ink-site-dark-sticky-header-bg: rgba(0, 0, 0, 0.6);
  --ink-site-sticky-header-box-shadow-color: rgba(194, 187, 186, 0.3);
  --ink-sub-menu-bg-color: #f7f7f7;
  --ink-sub-menu-bg-color-dark-mode: #140e0e;
  --ink-tags-border-color: #49b0ef99;
  --ink-top-header-bg: linear-gradient(45deg, #ff9a83, #d2aaff);
  --ink-top-header-text-color-hover: #ff9a83;
  --ink-top-header-text-color-initial: #f7f7f7;

  /* layout presents */
  --ink-site-max-width: 1600px;

  --ink-sticky-header-height: 0px;

  --ink-post-stats-offset: 20px;

  --ink-content-vertical-gap: 20px;
  --ink-content-vertical-gap-mob: 18px;
  --ink-content-vertical-gap-sm: 16px;

  --ink-header-off-canvas-width: 432px;
  --ink-header-off-canvas-width-tab: 420px;
  --ink-header-off-canvas-width-mob: 300px;
  --ink-header-off-canvas-width-sm: 290px;

  --ink-site-horizontal-padding: 100px;
  --ink-site-horizontal-padding-tab: 50px;
  --ink-site-horizontal-padding-mob: 40px;
  --ink-site-horizontal-padding-sm: 20px;

  --ink-site-vertical-gap: 40px;
  --ink-site-vertical-gap-tab: 35px;
  --ink-site-vertical-gap-mob: 25px;
  --ink-site-vertical-gap-sm: 20px;

  /* image size presents */
  --ink-social-item-image-height: 18px;
  --ink-social-item-image-height-tab: 17px;
  --ink-social-item-image-height-mob: 16px;
  --ink-social-item-image-height-sm: 15px;

  --ink-social-item-image-width: 18px;
  --ink-social-item-image-width-tab: 17px;
  --ink-social-item-image-width-mob: 16px;
  --ink-social-item-image-width-sm: 15px;

  /* typography presents */
  --ink-primary-font-family: IBM Plex Sans;
  --ink-secondary-font-family: Nunito;

  --ink-archive-post-title-typo1-font-family: IBM Plex Sans;
  --ink-archive-post-title-typo1-font-weight: 500;
  --ink-archive-post-title-typo1-font-size: 24px;
  --ink-archive-post-title-typo1-font-size-mob: 24px;
  --ink-archive-post-title-typo1-line-height: normal;

  --ink-breadcrumb-text-typo-font-family: IBM Plex Sans;
  --ink-breadcrumb-text-typo-font-weight: 400;
  --ink-breadcrumb-text-typo-font-size: 20px;
  --ink-breadcrumb-text-typo-font-size-mob: 18px;
  --ink-breadcrumb-text-typo-line-height: normal;

  --ink-button-typo1-font-family: Nunito;
  --ink-button-typo1-font-weight: 500;
  --ink-button-typo1-font-size: 14px;
  --ink-button-typo1-line-height: normal;

  --ink-header-menu-item-typo1-font-family: IBM Plex Sans;
  --ink-header-menu-item-typo1-font-weight: 400;
  --ink-header-menu-item-typo1-font-size: 20px;
  --ink-header-menu-item-typo1-font-size-mob: 18px;
  --ink-header-menu-item-typo1-line-height: 1.5;

  --ink-header-sub-menu-item-typo1-font-family: IBM Plex Sans;
  --ink-header-sub-menu-item-typo1-font-weight: 400;
  --ink-header-sub-menu-item-typo1-font-size: 18px;
  --ink-header-sub-menu-item-typo1-line-height: 1.5;

  --ink-introduction-description-typo-font-family: Nunito;
  --ink-introduction-description-typo-font-weight: 300;
  --ink-introduction-description-typo-font-size: 20px;
  --ink-introduction-description-typo-font-size-tab: 19px;
  --ink-introduction-description-typo-font-size-mob: 18px;
  --ink-introduction-description-typo-line-height: normal;
  --ink-introduction-description-typo-line-height-tab: normal;
  --ink-introduction-description-typo-line-height-mob: normal;
  --ink-introduction-description-typo-letter-spacing: 0;
  --ink-introduction-description-typo-letter-spacing-tab: 0;
  --ink-introduction-description-typo-letter-spacing-mob: 0;
  --ink-introduction-description-typo-text-decoration: none;
  --ink-introduction-description-typo-text-transform: none;

  --ink-introduction-title-typo-font-family: IBM Plex Sans;
  --ink-introduction-title-typo-font-weight: 400;
  --ink-introduction-title-typo-font-size: 44px;
  --ink-introduction-title-typo-font-size-tab: 40px;
  --ink-introduction-title-typo-font-size-mob: 36px;
  --ink-introduction-title-typo-line-height: normal;
  --ink-introduction-title-typo-line-height-tab: normal;
  --ink-introduction-title-typo-line-height-mob: normal;
  --ink-introduction-title-typo-letter-spacing: 0;
  --ink-introduction-title-typo-letter-spacing-tab: 0;
  --ink-introduction-title-typo-letter-spacing-mob: 0;
  --ink-introduction-title-typo-text-decoration: none;
  --ink-introduction-title-typo-text-transform: none;

  --ink-paragraph-typo1-font-family: Nunito;
  --ink-paragraph-typo1-font-weight: 300;
  --ink-paragraph-typo1-font-size: 18px;
  --ink-paragraph-typo1-line-height: normal;

  --ink-paragraph-typo2-font-family: Nunito;
  --ink-paragraph-typo2-font-weight: 300;
  --ink-paragraph-typo2-font-size: 19px;
  --ink-paragraph-typo2-line-height: normal;

  --ink-section-title-typo-font-family: IBM Plex Sans;
  --ink-section-title-typo-font-weight: 500;
  --ink-section-title-typo-font-size: 20px;
  --ink-section-title-typo-font-size-tab: 19px;
  --ink-section-title-typo-font-size-mob: 18px;
  --ink-section-title-typo-font-size-sm: 17px;
  --ink-section-title-typo-line-height: normal;

  --ink-single-post-title-typo-font-family: IBM Plex Sans;
  --ink-single-post-title-typo-font-weight: 500;
  --ink-single-post-title-typo-font-size: 24px;
  --ink-single-post-title-typo-font-size-mob: 22px;
  --ink-single-post-title-typo-line-height: normal;

  --ink-site-tagline-typo-font-family: Nunito;
  --ink-site-tagline-typo-font-weight: 400;
  --ink-site-tagline-typo-font-size: 20px;
  --ink-site-tagline-typo-font-size-tab: 18px;
  --ink-site-tagline-typo-font-size-mob: 16px;
  --ink-site-tagline-typo-line-height: normal;
  --ink-site-tagline-typo-line-height-tab: normal;
  --ink-site-tagline-typo-line-height-mob: normal;
  --ink-site-tagline-typo-letter-spacing: 0;
  --ink-site-tagline-typo-letter-spacing-tab: 0;
  --ink-site-tagline-typo-letter-spacing-mob: 0;
  --ink-site-tagline-typo-text-decoration: none;
  --ink-site-tagline-typo-text-transform: none;

  --ink-site-title-typo-font-family: Plus Jakarta Sans;
  --ink-site-title-typo-font-weight: 500;
  --ink-site-title-typo-font-size: 52px;
  --ink-site-title-typo-font-size-tab: 48px;
  --ink-site-title-typo-font-size-mob: 40px;
  --ink-site-title-typo-line-height: normal;
  --ink-site-title-typo-line-height-tab: normal;
  --ink-site-title-typo-line-height-mob: normal;
  --ink-site-title-typo-letter-spacing: 0;
  --ink-site-title-typo-letter-spacing-tab: 0;
  --ink-site-title-typo-letter-spacing-mob: 0;
  --ink-site-title-typo-text-decoration: none;
  --ink-site-title-typo-text-transform: none;

  --ink-tags-list-item-typo-font-family: Nunito;
  --ink-tags-list-item-typo-font-weight: 300;
  --ink-tags-list-item-typo-font-size: 18px;
  --ink-tags-list-item-typo-font-size-mob: 16px;
  --ink-tags-list-item-typo-line-height: normal;

  --ink-tags-typo1-font-family: Nunito;
  --ink-tags-typo1-font-weight: 500;
  --ink-tags-typo1-font-size: 14px;
  --ink-tags-typo1-line-height: normal;

  --ink-top-menu-typo-font-family: IBM Plex Sans;
  --ink-top-menu-typo-font-weight: 400;
  --ink-top-menu-typo-font-size: 16px;
  --ink-top-menu-typo-font-size-mob: 15px;
  --ink-top-menu-typo-line-height: normal;

  --ink-widget-category-title-typo-font-family: Nunito;
  --ink-widget-category-title-typo-font-weight: 500;
  --ink-widget-category-title-typo-font-size: 14px;
  --ink-widget-category-title-typo-line-height: 1.5;

  --ink-widget-post-content-typo2-font-family: Nunito;
  --ink-widget-post-content-typo2-font-weight: 400;
  --ink-widget-post-content-typo2-font-size: 12px;
  --ink-widget-post-content-typo2-line-height: normal;

  --ink-widget-title-typo-font-family: IBM Plex Sans;
  --ink-widget-title-typo-font-weight: 500;
  --ink-widget-title-typo-font-size: 20px;
  --ink-widget-title-typo-line-height: normal;

  --ink-ymhm-excerpt-typo1-font-family: Nunito;
  --ink-ymhm-excerpt-typo1-font-weight: 400;
  --ink-ymhm-excerpt-typo1-font-size: 15px;
  --ink-ymhm-excerpt-typo1-line-height: normal;

  --ink-ymhm-title-typo1-font-family: IBM Plex Sans;
  --ink-ymhm-title-typo1-font-weight: 500;
  --ink-ymhm-title-typo1-font-size: 20px;
  --ink-ymhm-title-typo1-line-height: normal;
}

/*
=========================================
2.0 Normalize
=========================================
*/
body {
  background: var(--ink-bg);
  color: var(--ink-color-2);
  font-family: var(--ink-paragraph-typo2-font-family);
  font-size: var(--ink-paragraph-typo2-font-size);
  font-weight: var(--ink-paragraph-typo2-font-weight);
  line-height: var(--ink-paragraph-typo2-line-height);
}

body.site-boxed {
  padding: 60px 100px;
}

body.custom-background {
  background: var(--ink-bg);
}

body > img {
  width: 100%;
}

p,
h1,
h2,
h3,
h4,
h5,
h6,
figure {
  margin: 0;
}

ul,
ol,
li > ol {
  list-style: none;
  padding: 0;
  margin: 0;
}

.wp-block-list {
  list-style: revert;
  margin: revert;
  padding: revert;
}

a,
a:visited {
  text-decoration: none;
  color: var(--ink-color-2);
  cursor: pointer;
}

.post,
.page,
.widget {
  margin: 0;
}

body .site {
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  position: relative;
}

body.site-boxed .site {
  background: var(--ink-site-box-bg);
}

#content,
.site-header,
.top-header-section,
.header-main-section,
.featured-section,
.footer-widgets-area,
.bottom-footer-section,
.you-may-have-missed-section,
.main-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#content {
  gap: var(--ink-site-vertical-gap);
}

.page-content {
  margin: 0px;
}

p {
  font-family: var(--ink-paragraph-typo1-font-family);
  font-size: var(--ink-paragraph-typo1-font-size);
  font-weight: var(--ink-paragraph-typo1-font-weight);
  line-height: var(--ink-paragraph-typo1-line-height);
  color: var(--ink-color-2);
}

p:empty {
  display: none;
}

input[type="file"],
input[type="submit"],
input[type="checkbox"],
input[type="radio"] {
  cursor: pointer;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
  width: 100%;
}

/*
=========================================
3.0  Common
=========================================
*/
.inkora-container {
  max-width: var(--ink-site-max-width);
  width: 100%;
  padding: 0px var(--ink-site-horizontal-padding);
}

.main-wrapper .inkora-container {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.main-wrapper .row {
  display: flex;
  gap: 40px;
}

.blog .main-wrapper .row,
.archive .main-wrapper .row,
.search-results .main-wrapper .row {
  margin-top: 60px;
}

.breadcrumb-trail,
.page-header {
  width: calc((100% - 40px) * 0.7);
}

.site-no-sidebar-compact .breadcrumb-trail,
.site-no-sidebar-compact .page-header {
  width: 80%;
}

.site-no-sidebar-full .breadcrumb-trail,
.site-no-sidebar-full .page-header {
  width: 100%;
}

.page-header {
  background-color: var(--ink-color-4);
  border-radius: 8px;
  padding: 20px 30px 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  position: relative;
}

body:not(.home) .page-header::before {
  content: "";
  width: 90px;
  height: 4px;
  background-color: var(--ink-primary-color);
  z-index: 100;
  border-bottom-left-radius: 8px;
  position: absolute;
  bottom: 0px;
  left: 0px;
}

.inkora-row {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 45px;
}

/*
=========================================
 4.0 Header
========================================= 
*/
.site-header {
  margin-bottom: var(--ink-site-vertical-gap);
}

body.main-banner-enabled.introduction-section-disabled.tc-group-section-disabled
  .site-header,
.single.single-blog-layout-single-two .site-header,
.site-header.header--float {
  margin-bottom: 0px;
}

/*
=========================================
 4.1 Top Header Section
========================================= 
*/
.top-header-section {
  background: var(--ink-top-header-bg);
}

.top-header-section .inkora-row {
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  padding: 6px 0px;
}

.top-navigation ul {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.top-navigation ul a,
.social-item-title,
.social-item-users {
  font-family: var(--ink-top-menu-typo-font-family);
  font-size: var(--ink-top-menu-typo-font-size);
  font-weight: var(--ink-top-menu-typo-font-weight);
  line-height: var(--ink-top-menu-typo-line-height);
}

.top-navigation ul a,
.top-header-section .social-item {
  color: var(--ink-top-header-text-color-initial);
  transition: color 0.3s linear;
}

.top-navigation ul a:hover {
  color: var(--ink-top-header-text-color-hover);
}

.inkora-social-items {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.social-item {
  display: flex;
  align-items: center;
  padding: 6px 10px;
  gap: 6px;
}

.social-item-image {
  display: flex;
  justify-content: center;
  align-items: center;
}

.social-item-image img {
  height: var(--ink-social-item-image-height);
  width: var(--ink-social-item-image-width);
}

.social-item-title {
  margin-right: 6px;
}

/*
=========================================
 4.2 Header Main Section
========================================= 
*/
.header-main-section {
  background: var(--ink-site-header-bg);
}

.header-main-content {
  padding: 20px 0px;
  transition: all 0.3s linear;
}

.header-main-section .inkora-row {
  width: 100%;
  justify-content: space-between;
}

.inkora-logo-dark {
  display: none;
}

.site-title a {
  color: var(--ink-site-title-tagline-color-initial);
  font-family: var(--ink-site-title-typo-font-family);
  font-size: var(--ink-site-title-typo-font-size);
  font-weight: var(--ink-site-title-typo-font-weight);
  line-height: var(--ink-site-title-typo-line-height);
  letter-spacing: var(--ink-site-title-typo-letter-spacing);
  text-decoration: var(--ink-site-title-typo-text-decoration);
  text-transform: var(--ink-site-title-typo-text-transform);
  transition: all 0.3s linear;
}

.site-title a:hover {
  color: var(--ink-site-title-tagline-color-hover);
}

.site-description {
  color: var(--ink-site-title-tagline-color-initial);
  font-family: var(--ink-site-tagline-typo-font-family);
  font-size: var(--ink-site-tagline-typo-font-size);
  font-weight: var(--ink-site-tagline-typo-font-weight);
  line-height: var(--ink-site-tagline-typo-line-height);
  letter-spacing: var(--ink-site-tagline-typo-letter-spacing);
  text-decoration: var(--ink-site-tagline-typo-text-decoration);
  text-transform: var(--ink-site-tagline-typo-text-transform);
  transition: all 0.3s linear;
}

.main-navigation {
  flex: 1;
}

.offcanvas-close {
  display: none;
  padding: 6px;
  border: none;
  background: var(--ink-color-4);
  color: var(--ink-color-2);
  font-size: 18px;
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
  border-radius: 4px;
  position: absolute;
  top: 20px;
  left: 0;
  transform: translateX(-50%);
  z-index: 100000;
  transition: all 0.3s linear;
}

.main-navigation ul ul {
  box-shadow: none;
}

.main-navigation ul ul a {
  max-width: 200px;
  width: max-content;
}

.menu-toggle {
  display: none;
}

.main-navigation ul,
.nav-menu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.nav-menu li a {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 10px 12px;
  border-radius: 8px;
  color: var(--ink-color-2);
  font-family: var(--ink-header-menu-item-typo1-font-family);
  font-size: var(--ink-header-menu-item-typo1-font-size);
  font-weight: var(--ink-header-menu-item-typo1-font-weight);
  line-height: var(--ink-header-menu-item-typo1-line-height);
  position: relative;
  overflow: hidden;
  transition: all 0.3s linear;
}

.nav-menu .current-menu-item a,
.nav-menu .current-menu-ancestor a {
  background: var(--ink-color-4);
}

.nav-menu li a::before {
  content: "";
  position: absolute;
  bottom: 0px;
  left: 0px;
  height: 2px;
  width: 0px;
  background: var(--ink-primary-color);
  transition:
    width 0.3s linear,
    opacity 0.3s linear;
  opacity: 0;
}

.nav-menu .current-menu-item a::before,
.nav-menu .current-menu-ancestor a::before {
  width: 50px;
  opacity: 1;
}

.item-arrow {
  padding: 6px;
  border: none;
  background: transparent;
  color: var(--ink-color-2);
}

.sub-menu .item-arrow {
  transform: rotate(-90deg);
}

.sub-menu {
  opacity: 0;
  transition: all 0.3s linear;
  transform: translateY(-10px);
  box-shadow: none;
  padding: 8px 0px 0px;
}

.menu .sub-menu-inner {
  flex: 1;
  background: var(--ink-sub-menu-bg-color);
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
  border-radius: 8px;
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.menu .sub-menu li {
  transition: transform 0.3s linear;
}

.menu .sub-menu li a {
  padding: 8px 10px;
  font-family: var(--ink-header-sub-menu-item-typo1-font-family);
  font-size: var(--ink-header-sub-menu-item-typo1-font-size);
  font-weight: var(--ink-header-sub-menu-item-typo1-font-weight);
  line-height: var(--ink-header-sub-menu-item-typo1-line-height);
}

.sub-menu::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid var(--ink-sub-menu-bg-color);
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
}

.menu .sub-menu .sub-menu {
  transform: translateX(-6px);
  left: calc(100%);
  top: -8px;
  padding: 0px 0px 0px 12px;
}

.menu .sub-menu .sub-menu::before {
  top: 33px;
  left: 4px;
  transform: translateY(-50%);
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-right: 8px solid var(--ink-sub-menu-bg-color);
  border-left: 0;
}

/* Desktop: use hover */
@media (hover: hover) and (pointer: fine) {
  .nav-menu .menu-item:hover > a {
    background: var(--ink-color-4);
  }

  .nav-menu .menu-item:hover > a::before {
    width: 50px;
    opacity: 1;
  }

  .menu .sub-menu li:hover {
    transform: translateX(6px);
  }

  .menu > li:hover > a .item-arrow {
    transform: rotate(180deg);
  }

  .menu > li:hover > .sub-menu {
    opacity: 1;
    transform: translateY(0);
  }

  .menu .sub-menu li:hover > .sub-menu {
    opacity: 1;
    transform: translateX(0);
  }

  .offcanvas-close:hover {
    color: var(--ink-primary-color);
  }

  .header-off-canvas .menu > li:hover > .sub-menu,
  .header-off-canvas .sub-menu li:hover > .sub-menu {
    height: max-content;
    transform: translateY(0);
  }

  .header-off-canvas .menu .sub-menu li:hover {
    transform: none;
  }

  .header-off-canvas .sub-menu-inner > li:hover > a .item-arrow {
    transform: rotate(180deg);
  }
}

/*  @media (hover: none), (pointer: coarse) and  Mobile/Touch: use .focus class */
.nav-menu .menu-item.focus > a {
  background: var(--ink-color-4);
}

.nav-menu .menu-item.focus > a::before {
  width: 50px;
  opacity: 1;
}

.menu .sub-menu li.focus {
  transform: translateX(6px);
}

.menu > li.focus > a .item-arrow {
  transform: rotate(180deg);
}

.menu > li.focus > .sub-menu {
  opacity: 1;
  transform: translateY(0);
}

.menu .sub-menu li.focus > .sub-menu {
  opacity: 1;
  transform: translateX(0);
}

.offcanvas-close:focus {
  color: var(--ink-primary-color);
}

.header-off-canvas .menu > li.focus > .sub-menu,
.header-off-canvas .sub-menu li.focus > .sub-menu {
  height: max-content;
  transform: translateY(0);
}

.header-off-canvas .menu .sub-menu li.focus {
  transform: none;
}

.header-off-canvas .sub-menu-inner > li.focus > a .item-arrow {
  transform: rotate(180deg);
}

/* coffee button */
.buy-coffee-button,
a:visited.buy-coffee-button {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 14px 20px;
  background-color: var(--ink-color-2);
  color: var(--ink-color-1);
  border-radius: 8px;
  font-family: var(--ink-primary-font-family);
  font-size: 22px;
  font-weight: 400;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: all 0.3s linear;
}

.buy-coffee-button img {
  height: 26px;
  width: 26px;
  resize: contain;
  animation: inkoraCoffeeShake 5s cubic-bezier(0.4, 0, 0.2, 1) infinite;
  transform-origin: 50% 85%; /* slightly above bottom for natural pivot */
}

.buy-coffee-button:hover,
.buy-coffee-button:focus {
  transform: translateY(-4px);
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
  background-color: "#111111E6";
  color: var(--ink-color-1);
}

.buy-coffee-button::before,
.buy-coffee-button::after,
.read-more-btn::before,
.read-more-btn::after,
.form-submit::before,
.form-submit::after,
.wpcf7-form p:has(.wpcf7-submit)::before,
.wpcf7-form p:has(.wpcf7-submit)::after {
  content: "";
  position: absolute;
  bottom: 0px;
  height: 2px;
  width: 0;
  background-color: var(--ink-secondary-color);
  transition: width 0.3s linear;
}

.form-submit::before,
.form-submit::after,
.wpcf7-form p:has(.wpcf7-submit)::before,
.wpcf7-form p:has(.wpcf7-submit)::after {
  background-color: var(--ink-primary-color);
}

.buy-coffee-button::before,
.read-more-btn::before,
.form-submit::before,
.wpcf7-form p:has(.wpcf7-submit)::before {
  left: 0;
}

.buy-coffee-button::after,
.read-more-btn::after,
.form-submit::after,
.wpcf7-form p:has(.wpcf7-submit)::after {
  right: 0;
}

.buy-coffee-button:hover::before,
.buy-coffee-button:hover::after,
.buy-coffee-button:focus::before,
.buy-coffee-button:focus::after,
.read-more-btn:hover::before,
.read-more-btn:hover::after,
.form-submit:hover::before,
.form-submit:hover::after,
.wpcf7-form p:has(.wpcf7-submit):hover::before,
.wpcf7-form p:has(.wpcf7-submit):hover::after {
  width: 50%;
}

.offcanvas-toggle {
  cursor: pointer;
  background-color: transparent;
  border: none;
  padding: 0px;
}

.offcanvas-toggle i {
  font-size: 30px;
  color: var(--ink-color-2);
}

/* header off canvas css */
.header-off-canvas {
  position: fixed;
  top: 0;
  right: -100%;
  min-width: var(--ink-header-off-canvas-width);
  max-width: 50%;
  height: 100vh;
  background: var(--ink-sub-menu-bg-color);
  z-index: 10000;
  padding: 60px 40px 40px;
  transition: all 0.6s linear;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 40px;
  visibility: hidden;
}

.header-main-section .inkora-row.header-off-canvas {
  width: max-content;
}

.header--layout-one .header-main-section .inkora-row.header-off-canvas {
  gap: 40px;
}

.header-off-canvas.active {
  right: 0;
  visibility: visible;
}

.header-off-canvas .main-navigation {
  flex: 1;
  overflow-y: auto;
}

.header-off-canvas .offcanvas-close {
  display: block;
}

.header-off-canvas .nav-menu {
  flex-direction: column;
}

.header-off-canvas .nav-menu li,
.header-off-canvas .nav-menu li a {
  width: 100%;
}

.header-off-canvas .main-navigation ul ul a {
  min-width: 100%;
}

.header-off-canvas .nav-menu li a {
  justify-content: space-between;
}

.header-off-canvas .sub-menu {
  width: 100%;
  height: 0;
  transition:
    opacity 0.3s linear,
    height 0.3s linear,
    transform 0.3s linear;
  position: static;
  float: none;
  padding: 0px;
}

.header-off-canvas .sub-menu .sub-menu {
  padding: 0px;
}

.header-off-canvas .menu .sub-menu-inner {
  box-shadow: none;
  background: none;
  padding: 0px;
  margin: 0px;
}

.header-off-canvas .sub-menu-inner li {
  padding: 0px;
}

.header-off-canvas .nav-menu > li > .sub-menu > .sub-menu-inner > li,
.header-off-canvas
  .nav-menu
  > li
  > .sub-menu
  > .sub-menu-inner
  > li
  > .sub-menu
  > .sub-menu-inner
  > li {
  padding: 0px 0px 0px 10px;
}

.header-off-canvas .sub-menu::before {
  display: none;
}

.header-off-canvas .sub-menu .item-arrow {
  transform: rotate(0deg);
}

.header-off-canvas .sub-menu .sub-menu {
  transform: translateY(-10px);
}

.header-off-canvas .buy-coffee-button {
  position: sticky;
  bottom: 0;
}

/* When sticky */
.header-main-section.is-sticky {
  position: fixed;
  width: 100%;
  top: 0px;
  background: var(--ink-site-sticky-header-bg);
  box-shadow: 0 2px 8px var(--ink-site-sticky-header-box-shadow-color);
  z-index: 1000;
}

.header-main-section.is-sticky .inkora-container {
  display: flex;
  justify-content: center;
}

.is-sticky .header-main-content {
  width: 100%;
  padding: 14px 0px;
}

.is-sticky .header-main-content .site-title a {
  font-size: var(--ink-site-title-typo-font-size-mob);
}

.is-sticky .header-main-content .site-description {
  font-size: var(--ink-site-tagline-typo-font-size-mob);
}

.is-sticky .header-main-content .nav-menu li a {
  font-size: var(--ink-header-menu-item-typo1-font-size-mob);
}

.is-sticky .menu .sub-menu-inner {
  background: var(--ink-site-sticky-header-bg);
}

.is-sticky .sub-menu::before {
  border-bottom-color: var(--ink-site-sticky-header-bg);
}

.is-sticky .menu .sub-menu .sub-menu::before {
  border-right-color: var(--ink-site-sticky-header-bg);
}

.is-sticky .header-main-content .buy-coffee-button {
  padding: 10px 14px;
  font-size: 18px;
}

/* floating header */
.header--float .header-main-section {
  width: calc(100% - var(--ink-site-horizontal-padding));
  margin: var(--ink-site-vertical-gap) 0px;
  padding: 0px var(--ink-site-horizontal-padding);
  box-shadow: 0 2px 8px var(--ink-site-sticky-header-box-shadow-color);
  border-radius: 8px;
  z-index: 1000;
}

.header--float .header-main-section .inkora-container {
  padding: 0px;
  max-width: unset;
}

/*
=========================================
4.2.1 header--layout-one
========================================= 
*/
.header--layout-one .is-sticky .header-main-content .inkora-row {
  flex: unset;
  width: unset;
}

.header--layout-one
  .is-sticky
  .header-main-content
  .inkora-row:has(.offcanvas-toggle) {
  flex: 1;
}

.header--layout-one .is-sticky .header-main-content .nav-row {
  flex: 1;
  width: 100%;
}

.header--layout-one .header-main-section .site-branding {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

/*
=========================================
5.0 Home Page
========================================= 
*/
.section-header,
.blog .page-header,
.blog .main-wrapper header {
  padding: 10px 30px 10px 20px;
  background-color: var(--ink-primary-color);
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-items: center;
  gap: 20px;
  width: max-content;
  max-width: 100%;
  border-radius: 4px 100px 100px 4px;
}

.section-title,
.page-title {
  font-family: var(--ink-section-title-typo-font-family);
  font-size: var(--ink-section-title-typo-font-size);
  font-weight: var(--ink-section-title-typo-font-weight);
  line-height: var(--ink-section-title-typo-line-height);
  text-transform: uppercase;
}

.page-title {
  color: var(--ink-color-2);
}

.blog .page-title,
.section-title {
  color: var(--ink-color-1);
}

.sub-title,
.inkora-dark-mode .sub-title {
  max-width: 0;
  font-family: var(--ink-secondary-font-family);
  font-size: 14px;
  font-weight: 300;
  line-height: normal;
  color: var(--ink-color-1);
  border-radius: 50px;
  opacity: 0;
  overflow: hidden;
  white-space: nowrap;
  padding: 0;
  transition: all 0.3s linear;
}

.section-header:hover .sub-title,
.home .page-header:hover .sub-title {
  max-width: 900px;
  opacity: 1;
  padding: 2px 14px;
}

/*
=========================================
5.1 Introduction Section
========================================= 
*/
.introduction-section .row {
  display: flex;
  flex-direction: column;
  padding: 0px 200px;
  gap: 10px;
}

.introduction-section .title {
  text-transform: capitalize;
  text-align: center;
  color: #000000;
  font-family: var(--ink-introduction-title-typo-font-family);
  font-size: var(--ink-introduction-title-typo-font-size);
  font-weight: var(--ink-introduction-title-typo-font-weight);
  line-height: var(--ink-introduction-title-typo-line-height);
  letter-spacing: var(--ink-introduction-title-typo-letter-spacing);
  text-decoration: var(--ink-introduction-title-typo-text-decoration);
  text-transform: var(--ink-introduction-title-typo-text-transform);
}

.introduction-section .title span {
  color: var(--ink-primary-color);
}

.introduction-section .description {
  text-align: center;
  color: #000000;
  font-family: var(--ink-introduction-description-typo-font-family);
  font-size: var(--ink-introduction-description-typo-font-size);
  font-weight: var(--ink-introduction-description-typo-font-weight);
  line-height: var(--ink-introduction-description-typo-line-height);
  letter-spacing: var(--ink-introduction-description-typo-letter-spacing);
  text-decoration: var(--ink-introduction-description-typo-text-decoration);
  text-transform: var(--ink-introduction-description-typo-text-transform);
}

/*
=========================================
5.2 Tags Categories Group Section
========================================= 
*/
.cats-tags-wrapper {
  padding: 0px 47px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.cats-tags-wrapper .categories-list,
.cats-tags-wrapper .tags-list {
  width: 100%;
}

.cats-tags-wrapper ul {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.cats-tags-wrapper .inkora-cat-item,
.cats-tags-wrapper .inkora-tag-item {
  padding: 6px 12px;
  border-radius: 8px;
}

.cats-tags-wrapper .inkora-tag-item {
  background-color: var(--ink-color-4);
  border: 1px solid var(--ink-tags-border-color);
  transition: all 0.3s linear;
}

.cats-tags-wrapper .inkora-tag-item:hover {
  transform: translateY(-4px);
}

.cats-tags-wrapper .inkora-cat-item,
.category-item-style-one .cats-tags-wrapper .inkora-cat-item,
.category-item-style-two .cats-tags-wrapper .inkora-cat-item,
.cats-tags-wrapper .inkora-tag-item,
.cats-tags-wrapper .inkora-cat-item a,
.cats-tags-wrapper .inkora-tag-item a {
  color: #000000;
  font-family: var(--ink-tags-list-item-typo-font-family);
  font-size: var(--ink-tags-list-item-typo-font-size);
  font-weight: var(--ink-tags-list-item-typo-font-weight);
  line-height: var(--ink-tags-list-item-typo-line-height);
}

/*
=========================================
5.3 Main Banner Section
layout-one-no-ad
layout-two
layout-three-full-width
========================================= 
*/
.main-banner-section {
  width: 100%;
}

.main-banner-section.width-container {
  padding: 0px var(--ink-site-horizontal-padding);
}

.main-banner-section .row {
  width: 100%;
  display: flex;
  gap: 10px;
}

.slider-block .sticky .post-thumbnail-wrap::before,
.slider-block .sticky.no-thumbnail .post-content-wrap::before,
.slider-block .sticky .post-thumbnail-wrap::after,
.slider-block .sticky.no-thumbnail .post-content-wrap::after {
  display: none;
}

/* layout-one-no-ad */
.layout-one-no-ad .slider-block {
  width: 65%;
}

/* layout-two */
.layout-one-no-ad .insta-images-block,
.layout-two .insta-images-block {
  width: 35%;
}

.layout-two .ad-block {
  width: 18%;
  border-radius: 8px;
  overflow: hidden;
}

.layout-two .ad-block,
.slider-block {
  height: 478px;
  align-self: flex-end;
}

.layout-two .ad-block img,
.slider-post-thumbnail-wrap img {
  width: 100%;
  height: 478px;
  object-fit: cover;
}

.site-wide .layout-two .ad-block,
.site-wide .slider-block,
.site-wide .layout-two .ad-block img,
.site-wide .slider-post-thumbnail-wrap img,
.site-wide .insta-images-swiper,
.site-wide.single-blog-layout-single-two.single
  .post-thumbnail-wrap
  .wp-post-image {
  height: 580px;
}

.layout-two .slider-block {
  width: 55%;
}

/* layout-three-full-width */
.layout-three-full-width .slider-block {
  width: 100%;
}

.layout-three-full-width .insta-images-block {
  display: none;
}

.slider-post-item {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
}

.site-wide .layout-three-full-width .slider-post-item {
  border-radius: 0px;
}

.slider-post-item .post-content-wrap {
  position: absolute;
  bottom: 0px;
  width: 100%;
  height: 100%;
  color: var(--ink-color-1);
  display: flex;
  flex-direction: column;
  gap: 10px;
  justify-content: flex-end;
  background: linear-gradient(
    to top,
    rgba(255, 255, 255, 0.8) 0%,
    rgba(0, 0, 0, 0) 20%
  );
  z-index: 10;
  padding: 20px;
}

.layout-three-full-width .post-content-wrap {
  align-items: center;
  padding: 0px;
  padding-bottom: 20px;
}

.layout-three-full-width .post-content-wrap > * {
  max-width: calc(
    var(--ink-site-max-width) - (2 * var(--ink-site-horizontal-padding))
  );
  width: calc(100% - (2 * var(--ink-site-horizontal-padding)));
}

.post-categories {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  height: max-content;
}

.inkora-cat-item {
  font-family: var(--ink-secondary-font-family);
  font-size: 14px;
  font-weight: 500;
  line-height: normal;
}

.category-item-style-two .inkora-cat-item,
.post-categories a:visited {
  padding: 4px 6px;
  border-radius: 4px;
  color: var(--ink-color-4);
}

.post-title a {
  color: var(--ink-color-2);
  font-family: var(--ink-archive-post-title-typo1-font-family);
  font-size: var(--ink-archive-post-title-typo1-font-size);
  font-weight: var(--ink-archive-post-title-typo1-font-weight);
  line-height: var(--ink-archive-post-title-typo1-line-height);
  transition: color 0.3s linear;
}

.post-title a:hover {
  color: var(--ink-primary-color);
}

.slider-block .swiper-button-prev,
.slider-block .swiper-button-next,
.featured-section .swiper-button-prev,
.featured-section .swiper-button-next {
  background-color: #ffffff80;
  border-radius: 8px;
  padding: 10px 0px;
  color: #000000;
  transition:
    box-shadow 0.3s linear,
    transform 0.3s linear;
  z-index: 100;
}

.slider-block .swiper-button-prev:hover,
.slider-block .swiper-button-next:hover,
.featured-section .swiper-button-prev:hover,
.featured-section .swiper-button-next:hover {
  background-color: var(--ink-color-4);
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
}

.slider-block .swiper-button-prev:hover,
.featured-section .swiper-button-prev:hover,
.pagination .prev:hover {
  transform: translateX(-6px);
}

.slider-block .swiper-button-next:hover,
.featured-section .swiper-button-next:hover,
.pagination .next:hover {
  transform: translateX(6px);
}

.insta-images-block .column-header {
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  height: 71px;
}

.insta-images-block .column-title {
  color: #000000;
  font-family: var(--ink-archive-post-title-typo1-font-family);
  font-size: var(--ink-archive-post-title-typo1-font-size);
  font-weight: var(--ink-archive-post-title-typo1-font-weight);
  line-height: var(--ink-archive-post-title-typo1-line-height);
}

.insta-images-block .swiper-button-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

.insta-images-block .swiper-button-wrap .swiper-button-prev,
.insta-images-block .swiper-button-wrap .swiper-button-next {
  width: 35px;
  height: 35px;
  position: static;
  margin: 0px;
  color: #000000;
  padding: 8px 10px;
  background-color: var(--ink-color-4);
  border-radius: 8px;
  transition:
    box-shadow 0.3s linear,
    transform 0.3s linear;
  transform: rotate(90deg);
}

.insta-images-block .swiper-button-wrap .swiper-button-prev:hover,
.insta-images-block .swiper-button-wrap .swiper-button-next:hover {
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
}

.insta-images-block .swiper-button-wrap .swiper-button-prev:hover {
  transform: translateY(-6px) rotate(90deg);
}

.insta-images-block .swiper-button-wrap .swiper-button-next:hover {
  transform: translateY(6px) rotate(90deg);
}

.insta-images-swiper {
  height: 478px;
}

.insta-item {
  border-radius: 8px;
  background-repeat: no-repeat;
  overflow: hidden;
}

.insta-item-tag {
  background-color: var(--ink-primary-color);
  color: var(--ink-color-2);
  padding: 4px 6px;
  border-radius: 2px;
  position: absolute;
  bottom: 0px;
  font-family: var(--ink-secondary-font-family);
  font-size: 14px;
  font-weight: 500px;
  line-height: normal;
}

/*
=========================================
5.4 Featured Blogs
========================================= 
*/
.featured-section .section-header {
  margin-bottom: var(--ink-content-vertical-gap);
}

.featured-post-item {
  border-radius: 8px;
  overflow: hidden;
  background-color: var(--ink-color-4);
  transition: box-shadow 0.3s linear;
}

.featured-post-item:hover,
.blog-post-item:hover,
.ymhm-post-item:hover,
.related-posts-item:hover {
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
}

.featured-post-thumbnail-wrap {
  height: 300px;
  position: relative;
}

.featured-post-thumbnail-wrap .wp-post-image {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.post-caption {
  padding: 4px 8px;
  position: absolute;
  right: 20px;
  background-color: var(--ink-secondary-color);
  border-radius: 14px;
  color: var(--ink-color-1);
  font-family: var(--ink-secondary-font-family);
  font-weight: 500;
  font-size: 10px;
  line-height: normal;
  z-index: 10;
  max-width: 50%;
  transition: max-width 0.3s linear;
  line-clamp: 1;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

.featured-post-item .post-caption:hover,
.blog-post-item .post-caption:hover,
.ymhm-post-item .post-caption:hover {
  max-width: calc(100% - 55px);
  -webkit-box-orient: unset;
  -webkit-line-clamp: unset;
  line-clamp: unset;
  display: block;
}

.featured-post-thumbnail-wrap .post-caption {
  top: 20px;
}

.post-thumbnail-wrap .read-time,
.featured-post-thumbnail-wrap .read-time,
.ymhm-post-thumbnail-wrap .read-time,
.related-posts-thumbnail-wrap .read-time {
  display: flex;
  align-items: center;
  text-transform: uppercase;
  background-color: rgba(0, 0, 0, 0.55);
  gap: 4px;
  padding: 4px 8px;
  border-radius: 14px;
  color: var(--ink-color-4);
  font-family: var(--ink-secondary-font-family);
  font-weight: 500;
  font-size: 10px;
  line-height: normal;
  max-width: 70%;
  z-index: 15;
  position: absolute;
  right: 20px;
  bottom: 20px;
}

.featured-post-title {
  padding: 20px;
}

.inkora-post-title-truncate .featured-post-title a {
  line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

/*
=========================================
5.5 Latest Blogs Wrapper
========================================= 
*/
.home .main-wrapper .inkora-container {
  gap: 0px;
}

.site-main {
  width: 70%;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.widget-area {
  width: 30%;
}

.site-left-sidebar .main-wrapper .row {
  flex-direction: row-reverse;
}

.site-no-sidebar-full .row,
.site-no-sidebar-compact .row {
  width: 100%;
  justify-content: center;
  align-items: center;
}

.site-no-sidebar-full .widget-area,
.site-no-sidebar-compact .widget-area {
  display: none;
}

.site-no-sidebar-compact .site-main {
  width: 80%;
}

.site-no-sidebar-full .site-main {
  width: 100%;
}

/*
=========================================
5.6 Latest Blogs 
========================================= 
*/
.inner-post-wrap {
  display: flex;
  flex-direction: column;
  gap: 80px;
}

.blog-post-item {
  display: flex;
  background-color: var(--ink-color-4);
  border-radius: 8px;
  position: relative;
  overflow: visible;
  transition: box-shadow 0.5s linear;
}

.blog-post-item .post-thumbnail-wrap {
  width: 35%;
  height: 320px;
  position: relative;
}

.blog-post-item .post-thumbnail-wrap .read-time {
  bottom: 60px;
}

.blog-post-item .post-thumbnail-wrap .wp-post-image,
.page .article-body .wp-post-image {
  width: calc(100% - 10px);
  height: 320px;
  object-fit: cover;
  border-radius: 8px;
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
  transition: box-shadow 0.5s linear;
  position: absolute;
  top: -40px;
  right: 0px;
}

.blog-post-item:hover .post-thumbnail-wrap .wp-post-image,
.page .article-body:hover .wp-post-image {
  box-shadow: none;
}

.sticky .post-thumbnail-wrap::before,
.sticky.no-thumbnail .post-content-wrap::before {
  content: "";
  position: absolute;
  top: -40px;
  left: 10px;
  width: 90px;
  height: 4px;
  background-color: var(--ink-primary-color);
  z-index: 100;
  border-top-left-radius: 8px;
}

.blog-layout-grid-one .sticky .post-thumbnail-wrap::before,
.blog-layout-grid-full-width .sticky .post-thumbnail-wrap::before {
  left: 20px;
}

.inner-post-wrap .no-thumbnail {
  margin-top: -40px;
}

.sticky .post-thumbnail-wrap::after,
.sticky.no-thumbnail .post-content-wrap::after {
  content: "\f08d";
  color: "#000000";
  font-family: FontAwesome;
  font-size: 24px;
  position: absolute;
  top: -26px;
  left: 26px;
  z-index: 100;
  transform: rotate(-45deg);
  transform-origin: center;
}

.blog-layout-grid-one .sticky .post-thumbnail-wrap::after,
.blog-layout-grid-full-width .sticky .post-thumbnail-wrap::after {
  left: 36px;
}

.sticky.no-thumbnail .post-content-wrap::before {
  top: 0px;
  left: 0px;
}

.sticky.no-thumbnail .post-content-wrap::after {
  top: -8px;
  left: -8px;
}

.blog-post-item .post-caption {
  top: -20px;
}

.blog-post-item .post-content-wrap {
  flex: 1;
  width: 65%;
  padding: 20px 20px 15px;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  gap: 10px;
}

.blog-post-item.no-thumbnail .post-content-wrap,
.ymhm-post-item.no-thumbnail .post-content-wrap,
.related-posts-item.no-thumbnail .post-content-wrap {
  width: 100%;
}

.blog-post-item .content-wrap {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-bottom: 20px;
}

.inkora-post-title-truncate .blog-post-item .post-title a {
  line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.meta-wrap {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 20px 0px;
  border-top: 0.5px solid rgba(0, 0, 0, 0.1);
}

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

.avatar-wrap {
  position: relative;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: inline-block;
}

.avatar {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  display: block;
}

.avatar-wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid var(--ink-primary-color);
  clip-path: inset(70% 0 0 0);
  transition: clip-path 0.5s ease;
}

.blog-post-item:hover .byline .avatar-wrap::after {
  clip-path: inset(0 0 0 0);
}

.vcard.author {
  transition: transform 0.5s linear;
}

.vcard.author:hover {
  transform: translateX(4px);
}

.vcard.author a {
  padding: 6px 8px;
  border-radius: 50px;
  background-color: var(--ink-author-bg-color);
  font-family: var(--ink-secondary-font-family);
  font-size: 12px;
  font-weight: 400;
  line-height: normal;
  color: var(--ink-color-2);
}

.blog-post-item .post-categories {
  justify-content: right;
}

.tag-list {
  display: flex;
  gap: 10px;
  border-radius: 8px;
  padding: 10px;
  background-color: var(--ink-color-4);
  color: #000000;
  font-family: var(--ink-tags-typo1-font-family);
  font-size: var(--ink-tags-typo1-font-size);
  font-weight: var(--ink-tags-typo1-font-weight);
  line-height: var(--ink-tags-typo1-line-height);
  position: absolute;
  bottom: -12px;
  left: 10px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition:
    box-shadow 0.3s linear,
    background-color 0.3s linear,
    opacity 0.3s linear,
    transform 0.3s linear;
}

.read-more-btn {
  border-radius: 8px;
  padding: 10px;
  background-color: var(--ink-color-4);
  color: #000000;
  font-family: var(--ink-button-typo1-font-family);
  font-size: var(--ink-button-typo1-font-size);
  font-weight: var(--ink-button-typo1-font-weight);
  line-height: var(--ink-button-typo1-line-height);
  pointer-events: none;
  box-sizing: border-box;
  position: absolute;
  bottom: -12px;
  right: 10px;
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
  transform: translateY(-10px);
  transition:
    box-shadow 0.3s linear,
    background-color 0.3s linear,
    opacity 0.3s linear,
    transform 0.3s linear;
}

.tag-list:hover,
.read-more-btn:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
  background-color: #ffffffe6;
}

.blog-post-item:hover .tag-list,
.blog-post-item:hover .read-more-btn,
.ymhm-post-item:hover .read-more-btn,
.related-posts-item:hover .read-more-btn {
  opacity: 1;
  visibility: visible;
}

.blog-post-item:hover .read-more-btn,
.ymhm-post-item:hover .read-more-btn,
.related-posts-item:hover .read-more-btn {
  pointer-events: auto;
}

.blog-post-item:hover .tag-list:not(:hover),
.blog-post-item:hover .read-more-btn:not(:hover),
.ymhm-post-item:hover .read-more-btn:not(:hover),
.related-posts-item:hover .read-more-btn:not(:hover) {
  transform: translateY(0);
}

.blog-layout-list-one .inner-post-wrap .blog-post-item .post-content-wrap,
.blog-layout-list-two
  .inner-post-wrap
  .blog-post-item:nth-child(odd)
  .post-content-wrap,
.blog-layout-grid-one .inner-post-wrap .blog-post-item .post-content-wrap,
.blog-layout-grid-full-width
  .inner-post-wrap
  .blog-post-item
  .post-content-wrap {
  position: relative;
}

.blog-layout-list-two .inner-post-wrap .blog-post-item:nth-child(even) {
  flex-direction: row-reverse;
}

.blog-layout-list-two .blog-post-item:nth-child(even) .tag-list {
  left: calc(35% + 10px);
}

.blog-layout-grid-one .inner-post-wrap,
.blog-layout-grid-mixed-one .grid-2-wrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  row-gap: 80px;
  column-gap: 20px;
}

.blog-layout-grid-full-width .inner-post-wrap {
  grid-template-columns: 1fr;
}

.blog-layout-grid-one .inner-post-wrap .blog-post-item,
.blog-layout-grid-full-width .inner-post-wrap .blog-post-item,
.blog-layout-grid-mixed-one .inner-post-wrap .blog-post-item {
  flex-direction: column;
}

.blog-layout-grid-one .inner-post-wrap .blog-post-item .post-content-wrap,
.blog-layout-grid-one .inner-post-wrap .blog-post-item .post-thumbnail-wrap,
.blog-layout-grid-full-width
  .inner-post-wrap
  .blog-post-item
  .post-content-wrap,
.blog-layout-grid-full-width
  .inner-post-wrap
  .blog-post-item
  .post-thumbnail-wrap,
.blog-layout-grid-mixed-one .inner-post-wrap .blog-post-item .post-content-wrap,
.blog-layout-grid-mixed-one
  .inner-post-wrap
  .blog-post-item
  .post-thumbnail-wrap {
  width: 100%;
}

.blog-layout-grid-one
  .inner-post-wrap
  .blog-post-item
  .post-thumbnail-wrap
  .wp-post-image,
.blog-layout-grid-full-width
  .inner-post-wrap
  .blog-post-item
  .post-thumbnail-wrap
  .wp-post-image,
.blog-layout-mixed-one
  .inner-post-wrap
  .blog-post-item
  .post-thumbnail-wrap
  .wp-post-image {
  width: calc(100% - 20px);
}

.blog-layout-grid-one .inner-post-wrap .blog-post-item .post-content-wrap,
.blog-layout-grid-full-width
  .inner-post-wrap
  .blog-post-item
  .post-content-wrap,
.blog-layout-grid-mixed-one
  .inner-post-wrap
  .blog-post-item
  .post-content-wrap {
  padding: 0px 20px 20px;
}

.blog-layout-grid-one
  .inner-post-wrap
  .blog-post-item.no-thumbnail
  .post-content-wrap,
.blog-layout-grid-full-width
  .inner-post-wrap
  .blog-post-item.no-thumbnail
  .post-content-wrap,
.blog-layout-grid-mixed-one
  .inner-post-wrap
  .blog-post-item.no-thumbnail
  .post-content-wrap {
  padding: 20px;
}

.blog-layout-grid-one .inner-post-wrap .blog-post-item .content-wrap,
.blog-layout-grid-full-width .inner-post-wrap .blog-post-item .content-wrap,
.blog-layout-grid-mixed-one .inner-post-wrap .blog-post-item .content-wrap {
  padding-bottom: 0px;
}

/*
=========================================
5.7 Pagination
========================================= 
*/
.pagination {
  margin-bottom: 32px;
}

.pagination ul {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

.pagination li a,
.pagination li span {
  display: inline-block;
  color: var(--ink-color-2);
  padding: 10px 20px;
  border-radius: 4px;
  background-color: var(--ink-color-4);
  transition:
    box-shadow 0.3s linear,
    transform 0.3s linear;
  font-family: var(--ink-breadcrumb-text-typo-font-family);
  font-size: var(--ink-breadcrumb-text-typo-font-size);
  font-weight: var(--ink-breadcrumb-text-typo-font-weight);
  line-height: var(--ink-breadcrumb-text-typo-line-height);
}

.pagination li a:hover,
.pagination li span:hover {
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
}

.pagination li .current {
  border-bottom: 2px solid var(--ink-primary-color);
}

.pagination li a i {
  display: inline-flex;
  width: 11px;
  height: 20px;
  align-items: center;
  justify-content: center;
}

/*
=========================================
5.8 Sidebar Section
========================================= 
*/
.widget-area {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.widget {
  padding: 20px;
  border-radius: 8px;
  background: var(--ink-color-4);
  transition: transform 0.5s linear;
}

.widget:hover {
  transform: translateY(-4px);
}

.wp-block-search {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.wp-block-search input[type="search"],
.search-form input[type="search"] {
  background-color: transparent;
  border: none;
  outline: none;
  width: 100%;
  padding: 6px 10px;
  color: var(--ink-color-2);
  font-family: var(--ink-secondary-font-family);
  font-size: 14px;
  font-weight: 400;
  line-height: normal;
}

.wp-block-search__button-inside .wp-block-search__inside-wrapper,
.wp-block-search__no-button .wp-block-search__inside-wrapper,
.wp-block-search__button-only .wp-block-search__inside-wrapper,
.search-form,
.wp-block-search__button-outside input[type="search"] {
  background-color: var(--ink-color-1);
  border-radius: 20px;
  padding: 10px;
  border: none;
  display: flex;
  align-items: center;
}

.wp-block-search__button,
.search-form .search-submit {
  background-color: transparent;
  color: var(--ink-color-2);
  border: none;
  cursor: pointer;
  padding: 0px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
}

.wp-block-search__button:hover,
.search-form .search-submit:hover {
  color: var(--ink-primary-color);
}

.widget ul,
.widget ol {
  background-color: #f4f4f4;
  border-radius: 20px;
  padding: 10px;
}

.widget li,
.wp-block-tag-cloud a {
  padding: 6px 10px;
}

.widget .no-comments,
.widget li,
.widget li a,
.widget li footer,
.widget li span,
.useful-widgets-wrap li a {
  color: var(--ink-color-2);
  font-family: var(--ink-widget-category-title-typo-font-family);
  font-size: var(--ink-widget-category-title-typo-font-size);
  font-weight: var(--ink-widget-category-title-typo-font-weight);
  line-height: var(--ink-widget-category-title-typo-line-height);
}

.wp-block-latest-comments__comment,
.wp-block-tag-cloud a {
  margin: 0px;
}

.widget li a.wp-block-latest-comments__comment-author {
  font-weight: 400;
}

.wp-block-gallery {
  overflow: hidden;
}

.wp-block-gallery.wp-block-gallery-2 {
  gap: 10px;
}

/* bullet on list item hover */
.widget li {
  position: relative;
  transition: all 0.3s linear;
}

.widget li::before {
  content: "";
  position: absolute;
  left: 10px;
  top: calc(6px + (1.5em / 2));
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--ink-color-2);
  opacity: 0;
  transition: opacity 0.3s linear;
}

.widget li:hover {
  padding-left: 24px;
}

.widget li:hover::before {
  opacity: 1;
}

/*
=========================================
5.9 You may have missed Section
========================================= 
*/
.you-may-have-missed-section .inkora-container,
.related-posts-missed-section {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.ymhm-posts-wrap,
.related-posts-wrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  row-gap: 40px;
  column-gap: 20px;
}

.ymhm-post-item,
.related-posts-item {
  display: flex;
  background-color: var(--ink-color-4);
  border-radius: 8px;
  transition: box-shadow 0.5s linear;
  position: relative;
}

.ymhm-post-item.no-thumbnail,
.related-posts-item.no-thumbnail {
  margin-top: -20px;
}

.ymhm-post-thumbnail-wrap,
.related-posts-thumbnail-wrap {
  width: 40%;
  height: 145px;
  position: relative;
}

.ymhm-post-thumbnail-wrap .wp-post-image,
.related-posts-thumbnail-wrap .wp-post-image {
  width: calc(100% - 10px);
  height: 145px;
  object-fit: cover;
  border-radius: 8px;
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
  transition: box-shadow 0.5s linear;
  position: absolute;
  top: -20px;
  right: 0px;
}

.ymhm-post-item:hover .ymhm-post-thumbnail-wrap .wp-post-image,
.related-posts-item:hover .related-posts-thumbnail-wrap .wp-post-image {
  box-shadow: none;
}

.ymhm-post-thumbnail-wrap .post-caption,
.related-posts-thumbnail-wrap .post-caption {
  top: -10px;
  right: 10px;
}

.ymhm-post-thumbnail-wrap .read-time,
.related-posts-thumbnail-wrap .read-time {
  right: 10px;
  bottom: 30px;
}

.ymhm-post-item .post-content-wrap,
.related-posts-item .post-content-wrap {
  width: 60%;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ymhm-post-title a,
.related-posts-title a {
  color: var(--ink-color-2);
  font-family: var(--ink-ymhm-title-typo1-font-family);
  font-size: var(--ink-ymhm-title-typo1-font-size);
  font-weight: var(--ink-ymhm-title-typo1-font-weight);
  line-height: var(--ink-ymhm-title-typo1-line-height);
}

.inkora-post-title-truncate .ymhm-post-title a,
.inkora-post-title-truncate .related-posts-title a {
  line-clamp: 1;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

.ymhm-post-item .post-excerpt *,
.related-posts-item .post-excerpt * {
  color: var(--ink-color-2);
  font-family: var(--ink-ymhm-excerpt-typo1-font-family);
  font-size: var(--ink-ymhm-excerpt-typo1-font-size);
  font-weight: var(--ink-ymhm-excerpt-typo1-font-weight);
  line-height: var(--ink-ymhm-excerpt-typo1-line-height);
}

.inkora-post-title-truncate .ymhm-post-item .post-excerpt,
.inkora-post-title-truncate .related-posts-item .post-excerpt {
  line-clamp: 3;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

/*
=========================================
6.0 Footer
========================================= 
*/
.site-footer {
  background: var(--ink-site-footer-bg);
  display: flex;
  flex-direction: column;
  gap: 30px;
  margin-top: var(--ink-site-vertical-gap);
}

.bottom-footer-section {
  background: var(--ink-bottom-footer-bg);
}

.site-footer .inkora-row {
  padding: 20px 0px;
  justify-content: space-between;
}

.site-footer .inkora-row,
.site-footer .inkora-inner-row {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.site-footer .inkora-inner-row {
  width: 100%;
}

.footer-widget-column {
  flex: 1;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer-layout-column-one .footer-widget-column-2,
.footer-layout-column-one .footer-widget-column-3,
.footer-layout-column-one .footer-widget-column-4,
.footer-layout-column-two .footer-widget-column-3,
.footer-layout-column-two .footer-widget-column-4,
.footer-layout-column-three .footer-widget-column-4 {
  display: none;
}

.footer-widgets-layout-alter-one .inkora-row {
  flex-direction: column;
}

.bottom-footer-section .inkora-social-items {
  justify-content: flex-start;
}

.site-info,
.site-info a {
  font-family: var(--ink-top-menu-typo-font-family);
  font-size: var(--ink-top-menu-typo-font-size);
  font-weight: var(--ink-top-menu-typo-font-weight);
  line-height: var(--ink-top-menu-typo-line-height);
}

.bottom-footer-section .social-item,
.site-info,
.site-info a {
  color: var(--ink-bottom-footer-text-color-initial);
}

.site-info a:hover {
  color: var(--ink-bottom-footer-text-color-hover);
}

/*
=========================================
7.0  Single Post
========================================= 
*/
.single .site-main,
.single-blog-layout-single-two.single .main-wrapper {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/*
=========================================
7.1 Breadcrumb
========================================= 
*/
.breadcrumb-trail .trail-items {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  padding: 4px 10px;
  color: var(--ink-color-2);
  font-family: var(--ink-breadcrumb-text-typo-font-family);
  font-size: var(--ink-breadcrumb-text-typo-font-size);
  font-weight: var(--ink-breadcrumb-text-typo-font-weight);
  line-height: var(--ink-breadcrumb-text-typo-line-height);
  border-left: 2px solid var(--ink-primary-color);
}

.breadcrumb-trail .trail-items span span {
  font-style: italic;
}

.breadcrumb-trail a:hover {
  color: var(--ink-primary-color);
}

/*
=========================================
7.2 Blog Item
========================================= 
*/
.single .blog-post-item,
.page .page {
  display: flex;
  flex-direction: column;
  gap: 20px;
  background-color: transparent;
  border-radius: 0px;
}

.single .blog-post-item:hover,
.page .page :hover {
  box-shadow: none;
}

.entry-header,
.entry-footer {
  padding: 20px;
  background-color: var(--ink-color-4);
  display: flex;
  flex-direction: column;
  gap: 16px;
  border-radius: 8px;
  transition: box-shadow 0.5s linear;
}

.entry-header:hover,
.entry-footer:hover {
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
}

.single .blog-post-item .entry-title,
.page .page .entry-title {
  color: var(--ink-color-2);
  font-family: var(--ink-single-post-title-typo-font-family);
  font-size: var(--ink-single-post-title-typo-font-size);
  font-weight: var(--ink-single-post-title-typo-font-weight);
  line-height: var(--ink-single-post-title-typo-line-height);
}

.entry-meta-wrap,
.entry-footer {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.single .blog-post-item .entry-meta,
.page .page .entry-meta {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: wrap;
}

.single .blog-post-item .entry-meta,
.single .blog-post-item .entry-meta a,
.page .page .entry-meta,
.page .page .entry-meta a {
  color: var(--ink-color-2);
  font-family: var(--ink-secondary-font-family);
  font-size: 16px;
  font-weight: 700;
  line-height: normal;
}

.single .blog-post-item .entry-meta a,
.page .page .entry-meta a {
  font-weight: 400;
}

.single .vcard.author a {
  padding: 0px;
  border-radius: 0px;
  background-color: transparent;
  transition: color 0.3s ease;
}

.single .vcard.author:hover {
  transform: none;
}

.single .entry-meta a:hover {
  color: var(--ink-primary-color);
}

.entry-footer-meta {
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  background-color: var(--ink-footer-meta-bg-color);
  border-radius: 4px;
}

.cat-links,
.tags-links,
.edit-link {
  display: flex;
  gap: 10px;
}

.cat-links .meta-prefix i,
.tags-links .meta-prefix i,
.edit-link .meta-prefix i {
  font-size: 16px;
  margin-top: 6px;
}

.entry-footer-meta a {
  color: var(--ink-color-2);
  font-family: var(--ink-secondary-font-family);
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
}

.entry-footer-meta .edit-link i,
.entry-footer-meta .edit-link a {
  color: var(--ink-primary-color);
}

.edit-link a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.article-body {
  display: flex;
  flex-direction: column;
  background-color: var(--ink-color-4);
  border-radius: 8px;
  transition: box-shadow 0.5s linear;
  position: relative;
}

.single-blog-layout-single-one.single .article-body,
.page .article-body {
  margin-top: 40px;
}

.single-blog-layout-single-one.single .no-thumbnail .article-body,
.page .no-thumbnail .article-body {
  margin-top: 0px;
}

.article-body:hover {
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
}

.single .post-thumbnail-wrap,
.page .page .post-thumbnail-wrap {
  width: 100%;
  height: max-content;
}

.single .article-body .wp-post-image,
.page .article-body .wp-post-image {
  height: 420px;
  width: calc(100% - 20px);
}

.entry-content-row {
  display: flex;
  gap: 20px;
  margin: 0px;
  padding: 40px 20px;
  align-items: flex-start; /* required for sticky to work in flex */
}

.entry-content-row .post-stats-column {
  display: flex;
  flex-direction: column;
  gap: 10px;
  position: sticky;
  top: calc(
    var(--ink-sticky-header-height) + var(--ink-post-stats-offset)
  ); /* sticks post stats offset from top */
  flex-shrink: 0; /* prevents column from shrinking */
}

.entry-content-row .read-time {
  --progress: 0deg;
  width: 70px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-radius: 50%;
  overflow: hidden;
  padding: 4px;
  font-family: var(--ink-secondary-font-family);
  font-size: 14px;
  font-weight: 400;
  line-height: normal;
  border: 2px solid transparent;
  background:
    linear-gradient(
        var(--ink-footer-meta-bg-color),
        var(--ink-footer-meta-bg-color)
      )
      padding-box,
    conic-gradient(
        from 0deg,
        var(--ink-primary-color) var(--progress),
        var(--ink-pre-border-color) var(--progress)
      )
      border-box;
  background-clip: padding-box, border-box;
}

.single .main-wrapper .post-caption,
.page .page .post-caption {
  position: static;
  display: block;
  padding: 0px 20px;
  text-align: end;
  border-radius: 0px;
  background-color: transparent;
  color: #000000;
  text-decoration: underline;
  text-underline-offset: 2px;
  max-width: 100%;
  -webkit-line-clamp: unset;
  -webkit-box-orient: unset;
  line-clamp: unset;
  font-family: var(--ink-paragraph-typo1-font-family);
  font-size: var(--ink-paragraph-typo1-font-size);
  font-weight: var(--ink-paragraph-typo1-font-weight);
  line-height: var(--ink-paragraph-typo1-line-height);
}

.single-blog-layout-single-one.single
  .blog-post-item
  .thumbnail-has-caption
  .post-caption,
.page .page .thumbnail-has-caption .post-caption,
.single-blog-layout-single-one.single
  .blog-post-item.has-thumbnail
  .thumbnail-no-caption
  .entry-content-row,
.page .page.has-thumbnail .thumbnail-no-caption .entry-content {
  margin-top: 380px;
}

.article-body .entry-content {
  margin: 0px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  flex: 1;
}

.page .article-body .entry-content {
  padding: 40px 20px;
}

.article-body .entry-content figure {
  width: 100% !important;
}

.article-body .entry-content pre {
  white-space: pre-wrap;
  word-break: break-word;
  overflow-x: auto;
}

.single.site-no-sidebar-full .article-body .entry-content-row,
.single.site-no-sidebar-compact .article-body .entry-content-row,
.page.site-no-sidebar-full .article-body .entry-content,
.page.site-no-sidebar-compact .article-body .entry-content {
  margin-left: auto;
  margin-right: auto;
}

.single.site-no-sidebar-full .article-body .entry-content-row {
  width: 70%;
}

.page.site-no-sidebar-full .article-body .entry-content {
  width: 60%;
}

.single.site-no-sidebar-compact .article-body .entry-content-row,
.page.site-no-sidebar-compact .article-body .entry-content {
  width: 80%;
}

.article-body .entry-content p,
.inkora-dark-mode .article-body .entry-content pre p {
  color: var(--ink-color-2);
  font-family: var(--ink-paragraph-typo2-font-family);
  font-size: var(--ink-paragraph-typo2-font-size);
  font-weight: var(--ink-paragraph-typo2-font-weight);
  line-height: var(--ink-paragraph-typo2-line-height);
}

.wp-block-quote {
  margin: 0px;
  padding: 20px;
  background-color: var(--ink-primary-color);
  border-radius: 8px;
}

.article-body .entry-content .wp-block-quote p {
  color: var(--ink-color-4);
  font-family: var(--ink-secondary-font-family);
  font-size: 24px;
  font-weight: 400;
  line-height: 40px;
}

/*
=========================================
7.3 Post Navigation
=========================================
*/
.site-main .post-navigation {
  margin-bottom: 20px;
}

.post-navigation .nav-previous,
.post-navigation .nav-next {
  max-width: calc(50% - 50px);
}

.post-navigation .nav-links .nav-next {
  margin-left: auto;
}

.post-navigation .nav-links a {
  background-color: var(--ink-color-4);
  padding: 10px 20px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  transition:
    transform 0.3s linear,
    box-shadow 0.3s linear;
  color: #000000;
  font-family: var(--ink-breadcrumb-text-typo-font-family);
  font-size: var(--ink-breadcrumb-text-typo-font-size);
  font-weight: var(--ink-breadcrumb-text-typo-font-weight);
  line-height: var(--ink-breadcrumb-text-typo-line-height);
}

.post-navigation .nav-links i {
  font-size: var(--ink-breadcrumb-text-typo-font-size);
}

.post-navigation .nav-links a:hover {
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
}

.post-navigation .nav-previous:hover a {
  transform: translateX(-10px);
}

.post-navigation .nav-next:hover a {
  transform: translateX(10px);
}

.post-navigation .nav-next a {
  justify-content: flex-end;
}

/*
=========================================
7.4 Comments
=========================================
*/
.comments-area {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 20px;
  background-color: var(--ink-color-4);
  border-radius: 8px;
  transition: box-shadow 0.5s linear;
}

.comments-area:hover {
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
}

.comments-title,
.comment-reply-title {
  color: #000000;
  font-family: var(--ink-primary-font-family);
  font-size: 20px;
  font-weight: 500;
  line-height: normal;
  text-align: center;
}

.comment-reply-title {
  display: flex;
  gap: 10px;
  justify-content: center;
  align-items: center;
}

.comment-list {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.comments-area .comment {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 10px;
  background-color: #f4f4f4;
  border-radius: 4px;
}

.comment .comment-body {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.comment .comment-meta {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.comment .comment-author,
.comment .comment-author cite,
.comment .comment-metadata a,
#cancel-comment-reply-link {
  font-size: 16px;
  font-family: var(--ink-primary-font-family);
  line-height: normal;
  color: #000000;
  font-style: normal;
}

.comment .comment-author,
.comment .comment-author cite {
  font-weight: 500;
}

.comment .comment-metadata {
  font-weight: 400;
}

.comment a.comment-edit-link,
#cancel-comment-reply-link {
  color: var(--ink-primary-color);
  text-decoration: underline;
  text-underline-offset: 2px;
  opacity: 1;
}

.comment a.comment-edit-link:hover,
#cancel-comment-reply-link:hover,
.logged-in-as a:hover {
  animation: inkoraFadeOpacity 1s ease;
}

.comment-content {
  background-color: var(--ink-color-4);
  padding: 30px 20px 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-radius: 4px;
  position: relative;
}

.comment-content .avatar-wrap {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  position: absolute;
  left: 6px;
  top: -10px;
  box-shadow: 0 5px 10px var(--ink-box-shadow-color);
}

.comment-body:hover .comment-content .avatar-wrap::after {
  clip-path: inset(0 0 0 0);
}

.comment-content p {
  color: #000000;
  font-family: var(--ink-secondary-font-family);
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
}

.comment-reply-link {
  padding: 4px 8px;
  border-radius: 4px;
  background-color: transparent;
  color: var(--ink-primary-color);
  font-size: 14px;
  font-family: var(--ink-primary-font-family);
  font-weight: 400;
  line-height: normal;
  transition: background-color 0.3s ease;
}

.comment-reply-link:hover {
  background-color: var(--ink-reply-link-bg-color);
  color: var(--ink-primary-color);
}

.comment.depth-1 > .children,
.comment.depth-2 > .children {
  margin-left: 30px;
}

.comments-area .comment-respond {
  display: flex;
  flex-direction: column;
  gap: 10px;
  background-color: var(--ink-color-4);
  border-radius: 8px;
}

.comments-area .comment .comment-respond {
  padding: 10px;
}

.comment-form,
.wpcf7-form,
.wpcf7-form label {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.wpcf7-list-item label {
  flex-direction: row;
  gap: 4px;
}

.comment-notes,
.logged-in-as {
  margin-bottom: 10px;
}

.logged-in-as,
.logged-in-as a {
  text-align: center;
  color: #000000;
  font-family: var(--ink-primary-font-family);
  font-size: 18px;
  font-weight: 400;
  line-height: normal;
}

.logged-in-as a {
  text-decoration: underline;
  text-underline-offset: 2px;
  color: var(--ink-primary-color);
}

.comment-form-comment,
.comment-form-author,
.comment-form-email,
.comment-form-url {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.comment-form label,
.wpcf7-form label {
  color: var(--ink-color-2);
  font-family: var(--ink-primary-font-family);
  font-size: 16px;
  font-weight: 500;
  line-height: normal;
}

.comment-form textarea,
.comment-form input:not(input[type="submit"], input[type="checkbox"]) {
  width: 100%;
  padding: 10px;
  border-radius: 4px;
  color: var(--ink-color-2);
  font-family: var(--ink-primary-font-family);
  font-size: 14px;
  font-weight: 400;
  line-height: normal;
}

.single-comment-form--bordered .comment-form textarea,
.single-comment-form--bordered
  .comment-form
  input:not(input[type="submit"], input[type="checkbox"]) {
  border: 0.5px solid var(--ink-color-2);
}

.single-comment-form--non-bordered .comment-form textarea,
.single-comment-form--non-bordered
  .comment-form
  input:not(input[type="submit"], input[type="checkbox"]) {
  border: none;
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
}

.single-comment-form--left-bordered .comment-form textarea,
.single-comment-form--left-bordered
  .comment-form
  input:not(input[type="submit"], input[type="checkbox"]) {
  border: none;
  border-left: 0.5px solid var(--ink-color-2);
}

.single-comment-form--non-top-bordered .comment-form textarea,
.single-comment-form--non-top-bordered
  .comment-form
  input:not(input[type="submit"], input[type="checkbox"]) {
  border: 0.5px solid var(--ink-color-2);
  border-top: none;
}

.wpcf7-quiz-label,
.wpcf7-list-item-label,
.wpcf7-response-output,
input.wpcf7-file {
  color: var(--ink-color-2);
  font-family: var(--ink-primary-font-family);
  font-size: 14px;
  font-weight: 400;
  line-height: normal;
}

input::placeholder,
textarea::placeholder {
  color: var(--ink-color-2);
  font-size: 14px;
  font-style: italic;
  opacity: 1;
}

input[type="date"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
}

.comment-form-cookies-consent {
  display: flex;
  gap: 6px;
  margin-top: 10px;
}

.comment-form-cookies-consent input {
  height: 20px;
  width: 20px;
}

.comment-form-cookies-consent label {
  color: #000000;
  font-family: var(--ink-primary-font-family);
  font-size: 18px;
  font-weight: 400;
  line-height: normal;
}

.form-submit,
.wpcf7-form p:has(.wpcf7-submit) {
  align-self: center;
  width: max-content;
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  transition:
    transform 0.3s linear,
    box-shadow 0.3s linear;
}

.form-submit .submit,
.wpcf7-form p:has(.wpcf7-submit),
input.wpcf7-submit {
  padding: 10px 14px;
  background-color: var(--ink-primary-color);
  color: var(--ink-color-1);
  border: none;
  transition:
    background-color 0.3s ease,
    color 0.3s ease;
  font-family: var(--ink-button-typo1-font-family);
  font-size: var(--ink-button-typo1-font-size);
  font-weight: var(--ink-button-typo1-font-weight);
  line-height: var(--ink-button-typo1-line-height);
  cursor: pointer;
}

.wpcf7-form p:has(.wpcf7-submit) {
  transition:
    transform 0.3s linear,
    box-shadow 0.3s linear,
    background-color 0.3s ease,
    color 0.3s ease;
}

.form-submit:hover,
.wpcf7-form p:has(.wpcf7-submit):hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
}

.form-submit:hover .submit,
.wpcf7-form p:has(.wpcf7-submit):hover,
.wpcf7-form p:has(.wpcf7-submit):hover input.wpcf7-submit {
  background: var(--ink-color-4);
  border: none;
  color: #000000;
}

/*
=========================================
7.5 Related Posts Missed Section
=========================================
*/
.related-posts-missed-section {
  margin-top: 20px;
}

.site-left-sidebar .related-posts-missed-section,
.site-right-sidebar .related-posts-missed-section,
.site-no-sidebar-compact .related-posts-missed-section {
  width: 75%;
}

.site-left-sidebar .related-posts-wrap,
.site-right-sidebar .related-posts-wrap,
.site-no-sidebar-compact .related-posts-wrap {
  grid-template-columns: 1fr;
}

/*
=========================================
7.6 Single Layout Two
=========================================
*/
.single-blog-layout-single-two.single .post-thumbnail-wrap {
  position: relative;
  display: flex;
  flex-direction: column;
}

.single-blog-layout-single-two.single .post-thumbnail-wrap .wp-post-image {
  height: 520px;
  width: 100%;
  object-fit: cover;
}

.single-blog-layout-single-two.single .post-thumbnail-wrap .fig-meta {
  width: 100%;
  background: rgba(255, 255, 255, 0.6);
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  bottom: 20px;
}

.single-blog-layout-single-two.single .post-thumbnail-wrap .fig-meta-inner {
  width: 100%;
  max-width: var(--ink-site-max-width);
  padding: 10px var(--ink-site-horizontal-padding);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.single.single-has-no-thumbnail.single-blog-layout-single-two
  .post-thumbnail-wrap
  .fig-meta {
  position: static;
}

.single-blog-layout-single-two.single .breadcrumb-trail {
  min-width: 70%;
}

.single-blog-layout-single-two.single .post-thumbnail-wrap .post-caption {
  position: static;
  border-radius: 4px;
  text-decoration: underline;
  text-underline-offset: 2px;
  padding: 8px;
  background: rgba(255, 255, 255, 0.6);
  max-width: 100%;
  -webkit-line-clamp: unset;
  -webkit-box-orient: unset;
  line-clamp: unset;
}

/*
=========================================
8.0  Category Page
=========================================
*/
.archive-description,
.archive-description p {
  color: var(--ink-color-2);
  font-family: var(--ink-secondary-font-family);
  font-size: 16px;
  font-weight: 300;
  line-height: normal;
}

.archive-posts-stat {
  background-color: var(--ink-secondary-color);
  padding: 10px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: var(--ink-color-1);
  font-size: 18px;
  line-height: normal;
  position: absolute;
  right: 10px;
  top: -20px;
}

.stat-count {
  font-family: var(--ink-secondary-font-family);
  font-weight: 400;
}

.stat-text {
  font-family: var(--ink-primary-font-family);
  font-weight: 500;
}

/*
=========================================
9.0  No Results Page
=========================================
*/
.not-found .page-content {
  background-color: var(--ink-color-4);
  border-radius: 8px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.not-found .page-content a {
  text-decoration: underline;
  text-underline-offset: 2px;
  color: var(--ink-primary-color);
}

.search-form {
  align-self: center;
  width: 100%;
}

.search-form label {
  flex: 1;
}

/*
=========================================
10.0  404 Page
=========================================
*/
.error404 .site-main,
.error404 .page-header {
  width: 100%;
}

.error-404 {
  display: flex;
  flex-direction: column;
  gap: var(--ink-site-vertical-gap);
}

.useful-widgets-wrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  row-gap: 30px;
  column-gap: 20px;
}

.useful-widgets-wrap .widget {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 20px;
  border-radius: 8px;
  background-color: var(--ink-color-4);
}

.useful-widgets-wrap .widget-title,
.useful-widgets-wrap .widgettitle {
  font-family: var(--ink-widget-title-typo-font-family);
  font-size: var(--ink-widget-title-typo-font-size);
  font-weight: var(--ink-widget-title-typo-font-weight);
  line-height: var(--ink-widget-title-typo-line-height);
  color: var(--ink-color-2);
}

.useful-widgets-wrap p,
.useful-widgets-wrap select {
  color: var(--ink-color-2);
  font-family: var(--ink-widget-post-content-typo2-font-family);
  font-size: var(--ink-widget-post-content-typo2-font-size);
  font-weight: var(--ink-widget-post-content-typo2-font-weight);
  line-height: var(--ink-widget-post-content-typo2-line-height);
}

.useful-widgets-wrap select {
  padding: 6px 10px;
}

/*
=========================================
11.0 Contact form 
=========================================
*/
.wpcf7-form p:has(.wpcf7-submit) {
  display: flex;
  gap: 10px;
  align-items: center;
}

input.wpcf7-submit {
  padding: 0;
}

.wpcf7-spinner {
  display: none;
  margin: 0px;
  height: var(--ink-button-typo1-font-size);
  width: var(--ink-button-typo1-font-size);
}

.wpcf7-spinner::before {
  transform-origin: 6px 6px;
  top: auto;
  left: auto;
}

.wpcf7-form.submitting .wpcf7-spinner {
  display: inline-block;
}

input:not(
    input[type="file"],
    input[type="submit"],
    input[type="checkbox"],
    input[type="radio"]
  ):focus,
select:focus,
textarea:focus,
.single-comment-form--bordered .comment-form textarea:focus,
.single-comment-form--bordered
  .comment-form
  input:not(input[type="submit"], input[type="checkbox"]):focus,
.single-comment-form--left-bordered .comment-form textarea:focus,
.single-comment-form--left-bordered
  .comment-form
  input:not(input[type="submit"], input[type="checkbox"]):focus,
.single-comment-form--non-top-bordered .comment-form textarea:focus,
.single-comment-form--non-top-bordered
  .comment-form
  input:not(input[type="submit"], input[type="checkbox"]):focus {
  outline: none;
  border-color: var(--ink-primary-color) !important;
}

input {
  accent-color: var(--ink-primary-color);
}

.wpcf7-not-valid-tip {
  font-family: var(--ink-primary-font-family);
  font-size: 14px;
  font-weight: 400;
  line-height: normal;
  font-style: italic;
}

.wpcf7-response-output {
  border-radius: 4px;
}

/*
=========================================
12.0 Theme mode toggle
=========================================
*/

#inkora-theme-mode-toggle {
  background: linear-gradient(to left, #f98f1d, #f3372d);
  border-radius: 8px;
  border: none;
  padding: 10px 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  transition: box-shadow 0.3s linear;
  position: fixed;
  right: 20px;
  bottom: 82px;
  z-index: 999;
  cursor: pointer;

  /* animation */
  transform: translateY(60px);
  opacity: 0;
  animation: inkoraButtonUp 1s ease forwards;
  animation-delay: 1s;
}

#inkora-theme-mode-toggle:hover {
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
}

/*
=========================================
13.0 Back to top button
=========================================
*/
#inkora-back-to-top {
  --progress: 0deg;
  position: fixed;
  right: 20px;
  bottom: 10px;
  z-index: 999;
  cursor: pointer;
  padding: 18px 16px;
  border-radius: 8px;
  border: 2px solid transparent;
  background:
    /* Button background */
    linear-gradient(var(--ink-color-2), var(--ink-color-2)) padding-box,
    /* Progress border */
    conic-gradient(
        from 0deg,
        var(--ink-primary-color) var(--progress),
        transparent 0deg
      )
      border-box;
  background-clip: padding-box, border-box;
  color: var(--ink-color-4);
  transition: box-shadow 0.3s linear;

  /* animation */
  transform: translateY(60px);
  opacity: 0;
  animation: inkoraButtonUp 1s ease forwards;
  animation-delay: 1s;
}

#inkora-back-to-top:hover {
  box-shadow: 0 10px 20px var(--ink-box-shadow-color);
}

#inkora-back-to-top i {
  font-size: 16px;
}

/*
=========================================
14.0 Dark mode
=========================================
*/
.inkora-dark-mode #inkora-theme-mode-toggle {
  flex-direction: row-reverse;
  background: var(--ink-color-2);
}

.inkora-dark-mode .inkora-logo-dark {
  display: block;
}

.inkora-dark-mode .inkora-logo-light {
  display: none;
}

body.custom-background.inkora-dark-mode.site-boxed,
.inkora-dark-mode .header-main-section,
.inkora-dark-mode .featured-post-item,
.inkora-dark-mode .blog-post-item,
.inkora-dark-mode .ymhm-post-item,
.inkora-dark-mode .related-posts-item,
.inkora-dark-mode .pagination li a,
.inkora-dark-mode .pagination li span,
.inkora-dark-mode .tag-list,
.inkora-dark-mode .read-more-btn,
.inkora-dark-mode .insta-images-block .swiper-button-wrap .swiper-button-prev,
.inkora-dark-mode .insta-images-block .swiper-button-wrap .swiper-button-next,
.inkora-dark-mode .slider-block .swiper-button-prev:hover,
.inkora-dark-mode .slider-block .swiper-button-next:hover,
.inkora-dark-mode .featured-section .swiper-button-prev:hover,
.inkora-dark-mode .featured-section .swiper-button-next:hover,
.inkora-dark-mode .entry-header,
.inkora-dark-mode .entry-footer,
.inkora-dark-mode .article-body,
.inkora-dark-mode .post-navigation .nav-links a,
.inkora-dark-mode .comments-area,
.inkora-dark-mode .comment-content,
.inkora-dark-mode .comments-area .comment-respond,
.inkora-dark-mode
  input:not(
    input[type="file"],
    input[type="submit"],
    input[type="checkbox"],
    input[type="radio"]
  ),
.inkora-dark-mode select,
.inkora-dark-mode textarea,
body.inkora-dark-mode:not(.home) .page-header,
.inkora-dark-mode .widget,
.inkora-dark-mode .wp-block-search,
.inkora-dark-mode .not-found .page-content,
.inkora-dark-mode .search-submit,
.inkora-dark-mode .header-off-canvas,
.inkora-dark-mode .nav-menu .menu-item:hover > a,
.inkora-dark-mode .nav-menu .menu-item.focus > a,
.inkora-dark-mode .nav-menu .current-menu-item a,
.inkora-dark-mode .nav-menu .current-menu-ancestor a,
.inkora-dark-mode .cats-tags-wrapper .inkora-tag-item,
.inkora-dark-mode .offcanvas-close {
  background: #000000;
}

.inkora-dark-mode .widget li::before {
  background: var(--ink-color-4);
}

.inkora-dark-mode.single-blog-layout-single-two.single
  .post-thumbnail-wrap
  .fig-meta,
.inkora-dark-mode.single-blog-layout-single-two.single
  .post-thumbnail-wrap
  .post-caption {
  background: rgba(0, 0, 0, 0.6);
}

.inkora-dark-mode .header-main-section.is-sticky {
  background: var(--ink-site-dark-sticky-header-bg);
}

.inkora-dark-mode .header-off-canvas,
.inkora-dark-mode .menu .sub-menu-inner {
  background: var(--ink-sub-menu-bg-color-dark-mode);
}

.inkora-dark-mode .top-header-section,
.inkora-dark-mode .site-footer,
.inkora-dark-mode .bottom-footer-section,
.inkora-dark-mode.single .blog-post-item,
.inkora-dark-mode.page .page {
  background: transparent;
}

.inkora-dark-mode .sub-menu::before {
  border-bottom-color: var(--ink-sub-menu-bg-color-dark-mode);
}

.inkora-dark-mode .menu .sub-menu .sub-menu::before {
  border-right-color: var(--ink-sub-menu-bg-color-dark-mode);
}

.inkora-dark-mode.single .blog-post-item,
.inkora-dark-mode .wp-block-search input[type="search"],
.inkora-dark-mode .search-form input[type="search"] {
  background-color: transparent;
}

body.inkora-dark-mode,
body.inkora-dark-mode.site-boxed .site,
body.custom-background.inkora-dark-mode,
body.custom-background.inkora-dark-mode.site-boxed .site,
.inkora-dark-mode .entry-footer-meta,
.inkora-dark-mode .form-submit:hover .submit,
.inkora-dark-mode .wpcf7-form p:has(.wpcf7-submit):hover,
.inkora-dark-mode .wpcf7-form p:has(.wpcf7-submit):hover input.wpcf7-submit,
.inkora-dark-mode .vcard.author a,
.inkora-dark-mode .widget ul,
.inkora-dark-mode .widget ol,
.inkora-dark-mode .wp-block-latest-comments,
.inkora-dark-mode .widget .wp-block-tag-cloud,
.inkora-dark-mode
  .wp-block-search__button-inside
  .wp-block-search__inside-wrapper,
.inkora-dark-mode .wp-block-search__no-button .wp-block-search__inside-wrapper,
.inkora-dark-mode
  .wp-block-search__button-only
  .wp-block-search__inside-wrapper,
.inkora-dark-mode .search-form,
.inkora-dark-mode .wp-block-search__button-outside input[type="search"],
.inkora-dark-mode .comments-area .comment {
  background: var(--ink-bg-dark-mode);
}

.inkora-dark-mode .slider-block .swiper-button-prev,
.inkora-dark-mode .slider-block .swiper-button-next,
.inkora-dark-mode .featured-section .swiper-button-prev,
.inkora-dark-mode .featured-section .swiper-button-next {
  background-color: #00000080;
}

.inkora-dark-mode .tag-list:hover,
.inkora-dark-mode .read-more-btn:hover {
  background-color: #000000e6;
}

.inkora-dark-mode .entry-content-row .read-time {
  background:
    linear-gradient(var(--ink-bg-dark-mode), var(--ink-bg-dark-mode))
      padding-box,
    conic-gradient(
        from 0deg,
        var(--ink-primary-color) var(--progress),
        var(--ink-color-2) var(--progress)
      )
      border-box;
}

.inkora-dark-mode textarea,
.inkora-dark-mode select,
.inkora-dark-mode
  input:not(
    input[type="file"],
    input[type="submit"],
    input[type="checkbox"],
    input[type="radio"]
  ),
.inkora-dark-mode.single.single-comment-form--bordered .comment-form textarea,
.inkora-dark-mode.single.single-comment-form--bordered
  .comment-form
  input:not(input[type="submit"], input[type="checkbox"]),
.inkora-dark-mode.single.single-comment-form--left-bordered
  .comment-form
  textarea,
.inkora-dark-mode.single.single-comment-form--left-bordered
  .comment-form
  input:not(input[type="submit"], input[type="checkbox"]),
.inkora-dark-mode.single.single-comment-form--non-top-bordered
  .comment-form
  textarea,
.inkora-dark-mode.single.ingle-comment-form--non-top-bordered
  .comment-form
  input:not(input[type="submit"], input[type="checkbox"]) {
  border-color: var(--ink-color-4);
}

.inkora-dark-mode textarea:focus,
.inkora-dark-mode select:focus,
.inkora-dark-mode
  input:not(
    input[type="file"],
    input[type="submit"],
    input[type="checkbox"],
    input[type="radio"]
  ):focus,
.inkora-dark-mode.single.single-comment-form--bordered
  .comment-form
  textarea:focus,
.inkora-dark-mode.single.single-comment-form--bordered
  .comment-form
  input:not(input[type="submit"], input[type="checkbox"]):focus,
.inkora-dark-mode.single.single-comment-form--left-bordered
  .comment-form
  textarea:focus,
.inkora-dark-mode.single.single-comment-form--left-bordered
  .comment-form
  input:not(input[type="submit"], input[type="checkbox"]):focus,
.inkora-dark-mode.single.single-comment-form--non-top-bordered
  .comment-form
  textarea:focus,
.inkora-dark-mode.single.ingle-comment-form--non-top-bordered
  .comment-form
  input:not(input[type="submit"], input[type="checkbox"]):focus {
  border-color: var(--ink-primary-color);
}

.inkora-dark-mode p,
.inkora-dark-mode a,
.inkora-dark-mode a:visited,
.inkora-dark-mode .insta-images-block .column-title,
.inkora-dark-mode .post-title a,
.inkora-dark-mode .wp-block-search input[type="search"],
.inkora-dark-mode .search-form input[type="search"],
.inkora-dark-mode .wp-block-search__button,
.inkora-dark-mode .search-form .search-submit,
.inkora-dark-mode .widget li,
.inkora-dark-mode .widget li a,
.inkora-dark-mode .widget li footer,
.inkora-dark-mode .widget li span,
.inkora-dark-mode .useful-widgets-wrap .widget-title,
.inkora-dark-mode .useful-widgets-wrap .widgettitle,
.inkora-dark-mode .pagination li span,
.inkora-dark-mode .pagination li a,
.inkora-dark-mode .slider-block .swiper-button-prev,
.inkora-dark-mode .slider-block .swiper-button-next,
.inkora-dark-mode .featured-section .swiper-button-prev,
.inkora-dark-mode .featured-section .swiper-button-next,
.inkora-dark-mode .insta-images-block .swiper-button-wrap .swiper-button-prev,
.inkora-dark-mode .insta-images-block .swiper-button-wrap .swiper-button-next,
.inkora-dark-mode.single .blog-post-item .entry-title,
.inkora-dark-mode.single .blog-post-item .entry-meta,
.inkora-dark-mode.single .blog-post-item .entry-meta a,
.inkora-dark-mode .entry-footer-meta span,
.inkora-dark-mode .entry-footer-meta span a,
.inkora-dark-mode .article-body .entry-content,
.inkora-dark-mode .article-body .entry-content p,
.inkora-dark-mode .post-navigation .nav-links a,
.inkora-dark-mode .comments-title,
.inkora-dark-mode .comment-reply-title,
.inkora-dark-mode .comment .comment-author,
.inkora-dark-mode .comment .comment-author cite,
.inkora-dark-mode .comment .comment-metadata a,
.inkora-dark-mode .logged-in-as,
.inkora-dark-mode .logged-in-as a,
.inkora-dark-mode .comment-form label,
.inkora-dark-mode .wpcf7-form label,
.inkora-dark-mode textarea,
.inkora-dark-mode input,
.inkora-dark-mode
  input:not(
    input[type="file"],
    input[type="submit"],
    input[type="checkbox"],
    input[type="radio"]
  ),
.inkora-dark-mode select,
.inkora-dark-mode .wpcf7-quiz-label,
.inkora-dark-mode .wpcf7-list-item-label,
.inkora-dark-mode .wpcf7-response-output,
input.wpcf7-file .inkora-dark-mode input::placeholder,
.inkora-dark-mode textarea::placeholder,
.inkora-dark-mode .comment-form-cookies-consent label,
.inkora-dark-mode .form-submit:hover .submit,
.inkora-dark-mode .wpcf7-form p:has(.wpcf7-submit):hover input.wpcf7-submit,
.inkora-dark-mode .archive-description,
.inkora-dark-mode .page-title,
.inkora-dark-mode .vcard.author a,
.inkora-dark-mode .breadcrumb-trail .trail-items,
.inkora-dark-mode .wp-block-heading,
.inkora-dark-mode .wp-block-search,
.inkora-dark-mode .wp-block-latest-comments,
.inkora-dark-mode.page .page .entry-title,
.inkora-dark-mode .offcanvas-toggle i,
.inkora-dark-mode .top-navigation ul a,
.inkora-dark-mode .top-navigation ul a:hover,
.inkora-dark-mode .social-item,
.inkora-dark-mode .site-info,
.inkora-dark-mode .site-info a:hover,
.inkora-dark-mode .sticky.no-thumbnail .post-content-wrap::after,
.inkora-dark-mode .introduction-section .title,
.inkora-dark-mode .introduction-section .description,
.inkora-dark-mode .cats-tags-wrapper .inkora-tag-item,
.inkora-dark-mode .cats-tags-wrapper .inkora-tag-item a,
.inkora-dark-mode .cats-tags-wrapper .inkora-cat-item a,
.inkora-dark-mode .ymhm-post-item .post-excerpt *,
.inkora-dark-mode .related-posts-item .post-excerpt *,
.inkora-dark-mode .entry-content-row .read-time,
.inkora-dark-mode.single .main-wrapper .post-caption,
.inkora-dark-mode.page .page .post-caption,
.inkora-dark-mode .item-arrow,
.inkora-dark-mode .offcanvas-close {
  color: var(--ink-color-4);
}

.inkora-dark-mode .nav-menu li a {
  color: var(--ink-color-1);
}

.inkora-dark-mode .comment a.comment-edit-link,
.inkora-dark-mode .comment-reply-link,
.inkora-dark-mode .post-title a:hover,
.inkora-dark-mode .entry-footer-meta .edit-link i,
.inkora-dark-mode .entry-footer-meta .edit-link a,
.inkora-dark-mode .entry-meta a:hover,
.inkora-dark-mode .breadcrumb-trail a:hover {
  color: var(--ink-primary-color);
}

.inkora-dark-mode input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(1);
}

.inkora-dark-mode .site-title a:hover {
  color: var(--ink-site-title-tagline-color-hover);
}