/* Без сірих задніх підкладок: картки й секції лишаються на чорному фоні */
.c-page-content .c-page__content,
.c-page-content .c-page__content .c-tabs-item__content,
.c-page-content .c-page__content .page-listing-item,
.c-page-content .c-page__content .item-summary,
.c-page-content .c-page__content .page-item-detail,
.c-page-content .c-page__content .row {
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Чорний фон сторінок і прозорі блоки тайтлів */
html,
body,
#page,
.wrap {
  background-color: #000 !important;
  background-image: none !important;
}

.site-content,
.c-page-content,
.c-page-content .profile-manga {
  background-color: #000 !important;
  background-image: none !important;
}

@media (max-width: 767px) {
  .single-wp-manga .manhva-description-empty {
    min-height: 72px;
    padding: 16px !important;
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 12px;
    color: rgba(255, 255, 255, .62);
    font-size: 13px;
    line-height: 1.5;
  }
}

/* Суцільний чорний низ сайту на всіх сторінках. Madara розділяє футер
   на кілька вкладених зон, тому прибираємо сірий фон на кожній із них. */
.site-footer,
.site-footer .c-footer,
.site-footer .c-footer-sidebar,
.site-footer .c-footer__top,
.site-footer .c-footer__bottom,
.site-footer .footer__top,
.site-footer .footer__bottom,
.site-footer .footer-area,
.site-footer .bottom-footer,
.site-footer .copyright,
.site-footer .copyright-area {
  background-color: #000 !important;
  background-image: none !important;
}

/* Madara adds a white 10px bottom border to the footer. On a short mobile
   viewport it becomes a visible strip above the fixed navigation. */
.site-footer {
  border-bottom: 0 !important;
}

/* Не показувати початковий Slick-стиль, поки карусель переводиться у
   вільну горизонтальну стрічку. Місце секції зберігається без стрибка. */
html.manhva-carousel-preparing body.home .popular-slider .slider__container:not(.free-manga-strip) {
  visibility: hidden !important;
}

/* Останні оновлення: 24 картки заповнюють кожен ряд у всіх контрольних
   точках — 3, 4 або 6 колонок. */
body.home #loop-content {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 20px 12px !important;
  margin: 0 !important;
}

body.home #loop-content > .page-listing-item,
body.home #loop-content > .page-listing-item > .row {
  display: contents !important;
}

body.home #loop-content .page-listing-item .row > * {
  width: auto !important;
  max-width: none !important;
  flex: 0 0 auto !important;
  padding: 0 !important;
  margin: 0 !important;
}

@media (max-width: 1099px) {
  body.home #loop-content {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 767px) {
  body.home #loop-content {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 18px 8px !important;
  }
}

.c-page-content .profile-manga .summary_image,
.c-page-content .profile-manga .summary_content,
.c-page-content .profile-manga .post-content_item,
.c-page-content .profile-manga .post-title,
.c-page-content .page-listing-item .item-summary,
.c-page-content .page-listing-item .item-thumb,
.c-page-content .c-page__content .tab-content-wrap,
.c-page-content .c-page__content .page-listing-item {
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}


/* Прибираємо всі залишкові сірі підкладки на головній та у тайтлах */
.profile-manga {
  background-color: #000 !important;
  background-image: none !important;
}
.profile-manga .summary_image {
  background-color: transparent !important;
  background-image: none !important;
}

/* Прозорий інформаційний блок тайтла */
.profile-manga .summary_content {
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}


/* Картки тайтлів: назва під обкладинкою, без зайвих деталей */
.c-page-content .page-item-detail .item-thumb {
  float: none !important;
  margin: 0 0 10px !important;
}
.c-page-content .page-item-detail .item-summary {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
.c-page-content .page-item-detail .item-summary .author,
.c-page-content .page-item-detail .item-summary .rating,
.c-page-content .page-item-detail .item-summary .list-chapter,
.c-page-content .page-item-detail .c-new-tag {
  display: none !important;
}

/* Компактні картки тайтлів */
.c-page-content .page-item-detail .post-title h3 {
  font-size: 70% !important;
  line-height: 1.25 !important;
}

.c-page-content .item-thumb,
.c-page-content .item-thumb a,
.c-page-content .item-thumb img {
  border-radius: 10px !important;
  overflow: hidden !important;
}

/* Показники на обкладинках: перегляди зверху, рейтинг знизу. */
.manhva-title-card-metrics {
  display: none;
}

.manhva-title-card-adult-badge {
  display: none;
}

.item-thumb,
.item-thumb > a,
.slider__thumb_item,
.slider__thumb_item > a {
  position: relative;
}

.item-thumb > a,
.slider__thumb_item > a {
  display: block;
}

.item-thumb .manhva-title-card-adult-badge,
.slider__thumb_item .manhva-title-card-adult-badge {
  position: absolute;
  z-index: 5;
  top: 6px;
  left: 6px;
  display: inline-flex;
  min-height: 22px;
  align-items: center;
  padding: 4px 7px;
  border: 0;
  border-radius: 6px;
  background: rgba(202, 30, 60, .9);
  box-shadow: 0 3px 10px rgba(0, 0, 0, .3);
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  pointer-events: none;
}

.item-thumb .manhva-title-card-metrics,
.slider__thumb_item .manhva-title-card-metrics {
  position: absolute;
  z-index: 4;
  inset: 0;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 4px;
  padding: 0 6px 6px;
  border-radius: inherit;
  pointer-events: none;
}

.item-thumb .manhva-title-card-metric,
.slider__thumb_item .manhva-title-card-metric {
  box-sizing: border-box;
  display: inline-flex;
  min-height: 21px;
  align-items: center;
  gap: 4px;
  padding: 4px 6px;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 6px;
  background: rgba(8, 10, 16, .64);
  box-shadow: 0 3px 10px rgba(0, 0, 0, .22);
  color: #fff;
  font-size: 9px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.item-thumb .manhva-title-card-metric svg,
.slider__thumb_item .manhva-title-card-metric svg {
  width: 12px;
  height: 12px;
  flex: 0 0 12px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.item-thumb .manhva-title-card-metric--rating svg,
.slider__thumb_item .manhva-title-card-metric--rating svg {
  fill: currentColor;
  stroke: none;
}

@media (max-width: 767px) {
  .item-thumb .manhva-title-card-metrics,
  .slider__thumb_item .manhva-title-card-metrics {
    gap: 3px;
    padding: 0 4px 4px;
  }

  .item-thumb .manhva-title-card-metric,
  .slider__thumb_item .manhva-title-card-metric {
    min-height: 17px;
    gap: 3px;
    padding: 2px 4px;
    border-radius: 4px;
    font-size: 8px;
  }

  .item-thumb .manhva-title-card-metric svg,
  .slider__thumb_item .manhva-title-card-metric svg {
    width: 10px;
    height: 10px;
    flex-basis: 10px;
  }
}


/* Назви карток на 30% менші */
.c-page-content .page-item-detail .post-title h3 {
  font-size: 70% !important;
  line-height: 1.25 !important;
}

/* Заокруглення всіх обкладинок */
.c-page-content .item-thumb,
.c-page-content .item-thumb a,
.c-page-content .item-thumb img {
  border-radius: 10px !important;
  overflow: hidden !important;
}

/* Лише телефон: головна сторінка по 3 картки */
@media (max-width: 767px) {
  /* На телефоні основний блок займає всю ширину */
  body.home .main-col.col-md-8.col-sm-8 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }

  /* Сайдбар на телефоні ховаємо, на ПК він лишається */
  body.home .sidebar-col {
    display: none !important;
  }

  /* Три картки в ряд саме на головній */
  body.home .page-listing-item .row {
    display: flex !important;
    flex-wrap: wrap !important;
  }

  body.home .page-listing-item .row > .col-12.col-md-6 {
    width: 33.333% !important;
    max-width: 33.333% !important;
    flex: 0 0 33.333% !important;
    padding: 0 5px !important;
  }
}


/* Телефон: три картки в ряд у категоріях */
@media (max-width: 767px) {
  body.archive.wp-manga-page .main-col {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }

  body.archive.wp-manga-page .sidebar-col {
    display: none !important;
  }

  body.archive.wp-manga-page #loop-content {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 18px 8px !important;
  }

  body.archive.wp-manga-page #loop-content > .page-listing-item,
  body.archive.wp-manga-page #loop-content .auto-col {
    width: auto !important;
    margin: 0 !important;
    float: none !important;
  }

  body.archive.wp-manga-page .item-thumb,
  body.archive.wp-manga-page .item-thumb a,
  body.archive.wp-manga-page .item-thumb img {
    width: 100% !important;
  }
}

/* Телефон: головна сторінка — 3 картки в ряд */
@media (max-width: 767px) {
  body.page-id-373 .main-col,
  body.page-id-373 .main-col-inner {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }

  body.page-id-373 .sidebar-col {
    display: none !important;
  }

  body.page-id-373 #loop-content .page-listing-item .row {
    display: flex !important;
    flex-wrap: wrap !important;
  }

  body.page-id-373 #loop-content .page-listing-item .row > .col-12.col-md-6 {
    width: 33.333% !important;
    max-width: 33.333% !important;
    flex: 0 0 33.333% !important;
    padding: 0 5px !important;
  }

  body.page-id-373 .page-item-detail .item-thumb,
  body.page-id-373 .page-item-detail .item-thumb a,
  body.page-id-373 .page-item-detail .item-thumb img {
    width: 100% !important;
  }
}

/* ==================================================
   Сторінка тайтла: чистий блок інформації
   ================================================== */
.single-wp-manga .profile-manga .manhva-hide-rating-info,
.single-wp-manga .profile-manga .manhva-hide-rank-info {
  display: none !important;
}

/* Жанри без обрізання та трьох крапок */
.single-wp-manga .profile-manga .genres-content,
.single-wp-manga .profile-manga .genres-content a {
  max-height: none !important;
  height: auto !important;
  overflow: visible !important;
  white-space: normal !important;
  text-overflow: clip !important;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
}

@media (min-width: 768px) {
  /* Більша відстань між назвами полів та значеннями */
  .single-wp-manga .profile-manga .post-content {
    width: calc(100% - 250px) !important;
    padding-right: 32px !important;
    vertical-align: top !important;
  }

  .single-wp-manga .profile-manga .post-content
  > .post-content_item > .summary-heading {
    width: 145px !important;
    padding-right: 22px !important;
    vertical-align: top !important;
  }

  .single-wp-manga .profile-manga .post-content
  > .post-content_item > .summary-content {
    width: calc(100% - 145px) !important;
    vertical-align: top !important;
  }

  /* Випуск і Статус — один стовпчик праворуч */
  .single-wp-manga .profile-manga .post-status {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 250px !important;
    padding-left: 30px !important;
    vertical-align: top !important;
  }

  .single-wp-manga .profile-manga .post-status
  > .post-content_item {
    display: flex !important;
    width: 100% !important;
    margin-bottom: 12px !important;
  }

  .single-wp-manga .profile-manga .post-status
  > .post-content_item > .summary-heading {
    flex: 0 0 95px !important;
    width: 95px !important;
    padding-right: 16px !important;
  }

  .single-wp-manga .profile-manga .post-status
  > .post-content_item > .summary-content {
    flex: 1 1 auto !important;
    width: auto !important;
  }

  .single-wp-manga .profile-manga .post-status > .manga-action {
    width: 100% !important;
  }
}

@media (max-width: 767px) {
  /* Рік уже показано поряд із типом під обкладинкою */
  .single-wp-manga .description-summary .manhva-release-info {
    display: none !important;
  }

  .single-wp-manga .description-summary .genres-content {
    display: block !important;
    max-height: none !important;
    overflow: visible !important;
  }
}


/* ==================================================
   Виправлення інформації тайтла: Рік, Статус, оцінка
   ================================================== */

/* Прибираємо лише напис, зірки голосування залишаються */
.single-wp-manga .post-rating .user-rating {
  font-size: 0 !important;
}

.single-wp-manga .post-rating .user-rating .ratings_stars {
  font-size: 24px !important;
}

/* ПК: Рік і Статус разом з іншими полями, не в правій колонці */
@media (min-width: 768px) {
  .single-wp-manga .profile-manga .post-content {
    width: calc(100% - 250px) !important;
  }

  .single-wp-manga .profile-manga .post-content
  > .manhva-release-info,
  .single-wp-manga .profile-manga .post-content
  > .manhva-status-info {
    display: block !important;
    width: 100% !important;
  }

  .single-wp-manga .profile-manga .post-status {
    display: inline-block !important;
    width: 250px !important;
  }
}

/* Телефон: Рік вже показаний біля типу під обкладинкою */
@media (max-width: 767px) {
  .single-wp-manga .manhva-release-info {
    display: none !important;
  }
}







/* ==================================================
   Сторінка тайтла — оформлення для ПК
   ================================================== */

@media (min-width: 768px) {

  /* Прибрати навігаційні шляхи на всіх сторінках */
  .c-breadcrumb-wrapper,
  .c-breadcrumb,
  .site-content .breadcrumbs {
    display: none !important;
  }

  /* Обкладинка та інформація починаються на одному рівні */
  .single-wp-manga .profile-manga .tab-summary {
    display: flex !important;
    align-items: flex-start !important;
    gap: 34px !important;
  }

  /* Збільшена приблизно на 30% обкладинка */
  .single-wp-manga .profile-manga .summary_image {
    float: none !important;
    flex: 0 0 255px !important;
    width: 255px !important;
    max-width: 255px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .single-wp-manga .profile-manga .summary_image a,
  .single-wp-manga .profile-manga .summary_image img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    border-radius: 16px !important;
    overflow: hidden !important;
  }

  /* Права частина починається рівно від верху обкладинки */
  .single-wp-manga .profile-manga .summary_content_wrap {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    vertical-align: top !important;
  }

  /* Назва над рейтингом та інформацією */
  .single-wp-manga .profile-manga
  .summary_content_wrap > .post-title {
    display: block !important;
    width: 100% !important;
    margin: 0 0 5px !important;
    padding: 0 !important;
    text-align: left !important;
  }

  .single-wp-manga .profile-manga
  .summary_content_wrap > .post-title h1,
  .single-wp-manga .profile-manga
  .summary_content_wrap > .post-title h3 {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 28px !important;
    line-height: 1.2 !important;
  }

  /* Тип та рік під назвою */
  .single-wp-manga .manhva-desktop-meta {
    margin: 0 0 14px !important;
    color: rgba(255, 255, 255, .72) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
  }

/* Не дублювати Тип і Рік у розділі «Опис» */
.single-wp-manga .manhva-type-info,
.single-wp-manga .manhva-release-info {
  display: none !important;
}

/* Рік прибираємо з опису на ПК і телефоні */
.single-wp-manga .manhva-release-info {
  display: none !important;
}

  /* Рейтинг під типом і роком */
  .single-wp-manga .profile-manga .post-rating {
    display: block !important;
    width: 100% !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
  }

  /* ПК: рейтинг без стрибків сторінки при наведенні */
@media (min-width: 768px) {
  .single-wp-manga .profile-manga .post-rating,
  .single-wp-manga .profile-manga .post-rating:hover {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
    line-height: 36px !important;
    overflow: visible !important;
  }

  .single-wp-manga .post-rating .post-total-rating,
  .single-wp-manga .post-rating .user-rating,
  .single-wp-manga .post-rating:hover .post-total-rating,
  .single-wp-manga .post-rating:hover .user-rating {
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 36px !important;
    white-space: nowrap !important;
    vertical-align: top !important;
    transform: none !important;
  }

  .single-wp-manga .post-rating .ratings_stars,
  .single-wp-manga .post-rating .ratings_stars:hover,
  .single-wp-manga .post-rating .ratings_stars.rating_current,
  .single-wp-manga .post-rating .ratings_stars.rating_current:hover {
    display: inline-block !important;
    width: 30px !important;
    height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 30px !important;
    line-height: 36px !important;
    vertical-align: top !important;
    transform: none !important;
    scale: 1 !important;
  }

  .single-wp-manga .post-rating .score {
    display: inline-block !important;
    height: 36px !important;
    line-height: 36px !important;
    vertical-align: top !important;
  }

  /* Приховати лише напис «Ваша оцінка» */
  .single-wp-manga .post-rating .user-rating {
    font-size: 0 !important;
  }

  .single-wp-manga .post-rating
  .user-rating .ratings_stars {
    font-size: 30px !important;
  }
}
	
	
	
	
	/* Телефон: прибрати дубль поля «Тип» з вкладки «Опис» */
@media (max-width: 767px) {
  body.single-wp-manga .manhva-type-info {
    display: none !important;
  }
}
	
	
	
	
/* ==================================================
   ПК: кнопка читання та сині значки дій
   Без перенесення елементів
   ================================================== */

@media (min-width: 768px) {



  /*
   * Повернути блок коментарів і закладок
   * до звичайного прозорого вигляду.
   */
  .single-wp-manga .profile-manga .manga-action {
    display: flex !important;
    width: 100% !important;
    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .single-wp-manga .profile-manga
  .manga-action .count-comment,

  .single-wp-manga .profile-manga
  .manga-action .add-bookmark {
    display: flex !important;
    flex: 1 1 50% !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 105px !important;
    margin: 0 !important;
    padding: 10px 6px !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    box-shadow: none !important;

    color: #fff !important;
    text-align: center !important;
  }

  /* Залишити розділювальну лінію між діями */
  .single-wp-manga .profile-manga
  .manga-action .count-comment {
    border-right: 1px solid rgba(255, 255, 255, .35) !important;
  }

  /* Сині самі значки, без рамки навколо */
  .single-wp-manga .profile-manga
  .manga-action .action_icon,

  .single-wp-manga .profile-manga
  .manga-action .action_icon a,

  .single-wp-manga .profile-manga
  .manga-action .action_icon i {
    margin-bottom: 6px !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;

    color: #4267ff !important;
    font-size: 28px !important;
  }

  /* Синій значок також при наведенні */
  .single-wp-manga .profile-manga
  .manga-action .action_icon:hover,

  .single-wp-manga .profile-manga
  .manga-action .action_icon a:hover,

  .single-wp-manga .profile-manga
  .manga-action .action_icon i:hover {
    color: #7890ff !important;
  }

  /* Текст не отримує синьої підкладки */
  .single-wp-manga .profile-manga
  .manga-action .action_detail,

  .single-wp-manga .profile-manga
  .manga-action .action_detail a {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;

    color: #fff !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    text-align: center !important;
  }
}
	
	
	
	
	

	
	
}	





	
	
	
/* Проміжна ширина ПК: нормальна адаптивна розмітка */
@media (min-width: 768px) and (max-width: 1100px) {

  .single-wp-manga .profile-manga .tab-summary {
    display: flex !important;
    align-items: flex-start !important;
    gap: 20px !important;
  }

  .single-wp-manga .profile-manga .summary_image {
    flex: 0 0 255px !important;
    width: 255px !important;
    max-width: 255px !important;
  }

  .single-wp-manga .profile-manga .summary_content_wrap {
    display: flex !important;
    flex: 1 1 0 !important;
    flex-wrap: wrap !important;
    align-content: flex-start !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    overflow: visible !important;
  }

  .single-wp-manga .profile-manga .post-title,
  .single-wp-manga .profile-manga .manhva-desktop-meta,
  .single-wp-manga .profile-manga .post-rating,
  .single-wp-manga .profile-manga .summary_content,
  .single-wp-manga .profile-manga .post-status {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    float: none !important;
  }

  /* Прибираємо зайве зміщення вправо */
  .single-wp-manga .profile-manga .summary_content {
    left: 0 !important;
    padding: 20px 0 10px !important;
  }

  .single-wp-manga .profile-manga .summary_content .post-content {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  /* Ховаємо дубль типу та року всередині інформації */
  .single-wp-manga .manhva-type-info,
  .single-wp-manga .manhva-release-info,
  .single-wp-manga .manhva-hide-rating-info,
  .single-wp-manga .manhva-hide-rank-info {
    display: none !important;
  }

  /* Два нормальні стовпчики інформації */
  .single-wp-manga
  .post-content_item:not(.manhva-type-info):not(.manhva-release-info):not(.manhva-hide-rating-info):not(.manhva-hide-rank-info) {
    display: grid !important;
    grid-template-columns: 100px minmax(0, 1fr) !important;
    column-gap: 14px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .single-wp-manga .post-content_item .summary-heading,
  .single-wp-manga .post-content_item .summary-content {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    float: none !important;
  }

  .single-wp-manga .post-content_item .summary-content {
    word-break: normal !important;
    overflow-wrap: break-word !important;
    white-space: normal !important;
  }

  .single-wp-manga .profile-manga .post-status {
    margin-top: 14px !important;
    padding-left: 0 !important;
  }

  .single-wp-manga .profile-manga .manga-action {
    width: 100% !important;
    margin: 0 !important;
    justify-content: flex-start !important;
  }
}
	
	
	
	
	
/* =========================================
   КНОПКИ У СТИЛІ ВКЛАДОК ТАЙТЛА
   ========================================= */

:root {
  --primary-color: #4267ff !important;
  --button-hover-color: #5275ff !important;
  --button-radius: 18px;
}

/* Основні кнопки */
.c-btn.c-btn_style-1,
html body.single-wp-manga a.manhva-main-read-button,
button[type="submit"],
input[type="submit"],
input[type="button"] {
  min-height: 38px !important;
  padding: 8px 12px !important;

  border: 2px solid #4267ff !important;
  border-radius: 18px !important;

  background:
    radial-gradient(
      circle at 30% 20%,
      #364ce5,
      #152877 65%,
      #10173a
    ) !important;

  color: #fff !important;

  font-family: Poppins, sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 19.5px !important;
  letter-spacing: normal !important;
  text-align: center !important;

  box-shadow:
    0 0 18px rgba(51, 91, 255, 0.42) !important;

  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    filter 0.2s ease !important;
}

/* Наведення */
.c-btn.c-btn_style-1:hover,
html body.single-wp-manga a.manhva-main-read-button:hover,
button[type="submit"]:hover,
input[type="submit"]:hover,
input[type="button"]:hover {
  border-color: #7190ff !important;
  color: #fff !important;

  background:
    radial-gradient(
      circle at 30% 20%,
      #4963ff,
      #1c369b 65%,
      #131d4b
    ) !important;

  box-shadow:
    0 0 22px rgba(66, 103, 255, 0.58) !important;

  filter: brightness(1.06);
}

/* Натискання */
.c-btn.c-btn_style-1:active,
html body.single-wp-manga a.manhva-main-read-button:active,
button[type="submit"]:active,
input[type="submit"]:active,
input[type="button"]:active {
  filter: brightness(0.92);
  box-shadow:
    0 0 12px rgba(51, 91, 255, 0.38) !important;
}






/* «Схоже» — один тайтл у ряд на ПК і телефоні */
body.single-wp-manga
.related-manga.manhva-related-in-sidebar
> div[class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    float: none !important;
}







/* Чорна смуга, у якій розміщений пошук */
.mgs {
    background: #000 !important;
}







/* ==================================================
   ЧИТАЛКА: приховати всю штатну навігацію Madara
   Залишаються зображення, меню нашого плагіна
   та стандартні коментарі
   ================================================== */

/* Назва розділу й шлях над зображеннями */
body:has(.reading-content) .chapter-heading,
body:has(.reading-content) .entry-header,
body:has(.reading-content) .c-breadcrumb-wrapper,
body:has(.reading-content) .c-breadcrumb,
body:has(.reading-content) .breadcrumb {
    display: none !important;
}

/* Верхня та нижня навігація Madara */
body:has(.reading-content) #manga-reading-nav-head,
body:has(.reading-content) #manga-reading-nav-foot,
body:has(.reading-content) .manga-reading-nav-head,
body:has(.reading-content) .manga-reading-nav-foot,
body:has(.reading-content) .c-select-bottom,
body:has(.reading-content) .selectpicker_chapter,
body:has(.reading-content) .reading-navigation,
body:has(.reading-content) .chapter-navigation,
body:has(.reading-content) .wp-manga-nav {
    display: none !important;
}

/* Назва тайтла і кнопки після останнього зображення */
body:has(.reading-content) .reading-content + .select-view,
body:has(.reading-content) .reading-content ~ .select-view,
body:has(.reading-content) .reading-content ~ .c-select-bottom,
body:has(.reading-content) .reading-content ~ .chapter-navigation {
    display: none !important;
}

/* Прибрати лише заголовок MANGA DISCUSSION */
body:has(.reading-content) #manga-discussion > .c-blog__heading,
body:has(.reading-content) .manga-discussion > .c-blog__heading,
body:has(.reading-content) .manga-discussion-heading {
    display: none !important;
}

/* Прибрати порожнє місце над зображеннями */
body:has(.reading-content) .reading-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Читалка: прибрати штатну назву глави та шлях зверху */
body.wp-manga-chapter .chapter-heading,
body.wp-manga-chapter .c-breadcrumb-wrapper {
  display: none !important;
}

/* Читалка: приховати назву розділу */
body.wp-manga-page #chapter-heading {
    display: none !important;
}

/* Приховати назву розділу в хлібних крихтах */
body.wp-manga-page .c-breadcrumb {
    display: none !important;
}



/* Ховаємо верхню панель, але залишаємо її функціональною */.c-header__top {    position: absolute !important;    left: -10000px !important;    top: -10000px !important;    width: 1px !important;    height: 1px !important;    overflow: hidden !important;    opacity: 0 !important;}


/* Приховати дату публікації на всіх звичайних сторінках */
body.page .entry-meta {
    display: none !important;
}




/* ПК: кожен рівень створює нову сходинку */
#madara-comments .comment-list .children {
  margin-left: 48px !important;
  padding-left: 0 !important;
}

@media (max-width: 767px) {
  /* На телефоні залишається одна сходинка */
  #madara-comments .comment-list > li.comment > .children {
    margin-left: 28px !important;
    padding-left: 0 !important;
  }

  /* Глибші відповіді більше не зміщуються */
  #madara-comments .comment-list > li.comment > .children .children {
    margin-left: 0 !important;
    padding-left: 0 !important;
  }

  #madara-comments .comment-list > li.comment > .children .children::before {
    display: none !important;
  }
}


/* КРОК 2: дата й час праворуч від ніка */
#madara-comments .comment-body > .block-right {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 10px;
  align-items: baseline;
}

/* Нік */
#madara-comments .comment-body > .block-right > .comment-author {
  grid-column: 1;
  grid-row: 1;
  margin: 0 !important;
}

#madara-comments .comment-author .heading {
  margin: 0 !important;
}

/* Дата і час */
#madara-comments .comment-body > .block-right > .comment-metadata {
  grid-column: 2;
  grid-row: 1;
  margin: 0 !important;
  padding: 0 !important;
  justify-self: start;
}

/* Текст залишається нижче */
#madara-comments .comment-body > .block-right > .comment-content {
  grid-column: 1 / -1;
  grid-row: 2;
}

#madara-comments .comment-metadata a {
  pointer-events: none;
  cursor: default;
  text-decoration: none !important;
}

/* Змінюємо лише окремий плагін лайк/дізлайк */
#madara-comments .cld-like-dislike-wrap {
  display: inline-flex !important;
  width: auto !important;
  max-width: 100%;
  align-items: center;
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
}

#madara-comments .cld-like-wrap,
#madara-comments .cld-dislike-wrap,
#madara-comments .cld-common-wrap {
  display: inline-flex !important;
  width: auto !important;
  align-items: center;
  gap: 5px;
  margin: 0 !important;
  padding: 0 !important;
}



/* ==================================================
   ЛІНІЇ ВКЛАДЕНИХ КОМЕНТАРІВ: ПК + ТЕЛЕФОН
   ================================================== */

/* Прибираємо стандартні або старі лінії */
#madara-comments .comment-list .children::before {
  display: none !important;
}

/* Коментар із відповідями стає основою для лінії */
#madara-comments .comment-list li.comment.parent {
  position: relative;
}

/* =========================
   ПК
   Аватарка: 56×56px
   ========================= */

#madara-comments .comment-list li.comment.parent::before {
  position: absolute;
  z-index: 0;

  /* 56px аватарка + 24px відступу */
  top: 80px;

  bottom: 0;

  /* Центр аватарки 56px */
  left: 28px;

  width: 2px;
  background: rgba(255, 255, 255, 0.22);
  content: "";
  pointer-events: none;
}

/* Коментарі й аватарки залишаються поверх лінії */
#madara-comments .comment-list li.comment > .comment-body {
  position: relative;
  z-index: 1;
}

/* =========================
   ТЕЛЕФОН
   Аватарка: 36×36px
   ========================= */

@media (max-width: 767px) {
  /* Вимикаємо лінії на всіх вкладених рівнях */
  #madara-comments .comment-list li.comment.parent::before {
    display: none;
  }

  /* Залишаємо одну лінію тільки на верхньому рівні */
  #madara-comments .comment-list > li.comment.parent::before {
    display: block;

    /* 36px аватарка + 24px відступу */
    top: 60px !important;

    /* Центр аватарки 36px */
    left: 18px !important;

    bottom: 0;
    width: 2px;
  }
}


/* Приховати службові рядки форми коментарів на всьому сайті */
#reply-title,
.comment-reply-title,
.logged-in-as,
.comment-notes {
  display: none !important;
}

/* Архіви манґи: прибрати службові блоки Madara та вирівняти назву архіву. */
body.wp-manga-page.archive #main-sidebar .manga-history-widget,
body.wp-manga-page.archive .c-genres-block.archive-page {
  display: none !important;
}

/* Після прибирання історії не залишаємо під неї порожню третину сторінки. */
body.wp-manga-page.archive .c-page-content > .content-area > .container > .row > .main-col,
body.wp-manga-page.archive .c-page-content > .content-area > .container > .row > .main-col > .main-col-inner {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
}

body.wp-manga-page.archive .c-page-content > .content-area > .container > .row > .sidebar-col {
  display: none !important;
}

body.wp-manga-page.archive .c-page > .entry-header .entry-header_wrap {
  display: flex !important;
  width: 100% !important;
  justify-content: center !important;
}

body.wp-manga-page.archive .c-page > .entry-header .entry-title,
body.wp-manga-page.archive .c-page > .entry-header .entry-title .item-title {
  display: block !important;
  float: none !important;
  width: 100% !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
  margin-right: auto !important;
  margin-left: auto !important;
  text-align: center !important;
}

@media (min-width: 768px) {
  body.wp-manga-page.archive .c-blog__heading.style-2 .c-nav-tabs > span {
    display: none !important;
  }
}

/* Для гостей Madara додає однакове посилання входу біля кожного коментаря. */
#madara-comments a.comment-reply-login,
.comments-area a.comment-reply-login {
  display: none !important;
}

@media (max-width: 767px) {
  /* Розмір аватарок коментарів змінюємо лише на телефоні. */
  #madara-comments .comment-body > .block-left {
    width: 48px !important;
    min-width: 48px !important;
    flex: 0 0 48px !important;
    text-align: center !important;
  }

  #madara-comments .comment-avatar {
    display: grid !important;
    width: 48px !important;
    place-items: center !important;
  }

  #madara-comments .comment-avatar img.avatar {
    width: 44px !important;
    height: 44px !important;
    margin: 0 auto !important;
    object-fit: cover;
  }

  /* get_avatar() is wrapped by Avatar Frames. Keep that outer positioning
     plane locked to the same square as the mobile avatar; otherwise Madara's
     line box stretches the frame vertically and turns a round PNG oval. */
  #madara-comments .comment-avatar .mangarama-avatar-wrap--auto {
    display: block !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 auto !important;
    aspect-ratio: 1 / 1 !important;
    line-height: 0 !important;
  }

  #madara-comments .comment-avatar .mangarama-avatar-wrap--auto > .mangarama-premium-avatar {
    display: block !important;
    width: 44px !important;
    height: 44px !important;
  }

  #madara-comments .comment-list > li.comment.parent::before {
    top: 68px !important;
    left: 24px !important;
  }
}