/*
Theme Name: Twenty Twenty-Five
Theme URI: https://wordpress.org/themes/twentytwentyfive/
Author: the WordPress team
Author URI: https://wordpress.org
Description: Twenty Twenty-Five emphasizes simplicity and adaptability. It offers flexible design options, supported by a variety of patterns for different page types, such as services and landing pages, making it ideal for building personal blogs, professional portfolios, online magazines, or business websites. Its templates cater to various blog styles, from text-focused to image-heavy layouts. Additionally, it supports international typography and diverse color palettes, ensuring accessibility and customization for users worldwide.
Requires at least: 6.7
Tested up to: 6.7
Requires PHP: 7.2
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfive
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */

:where(.wp-site-blocks *:focus){
  outline-width: 0;
  outline-style: none! important;
  outline-color: transparent;
}
 
a {
	text-decoration-thickness: 1px !important;
	text-underline-offset: .1em;
}

/* Focus styles */
:where(.wp-site-blocks *:focus) {
	outline-width: 2px;
	outline-style: solid;
}

/* Increase the bottom margin on submenus, so that the outline is visible. */
.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) {
	margin-bottom: 3px;
}

/* Increase the outline offset on the parent menu items, so that the outline does not touch the text. */
.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content {
	outline-offset: 4px;
}

/* Remove outline offset from the submenus, otherwise the outline is visible outside the submenu container. */
.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	outline-offset: 0;
}

/*
 * Progressive enhancement to reduce widows and orphans
 * https://github.com/WordPress/gutenberg/issues/55190
 */
h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p {
	text-wrap: pretty;
}

/*
 * Change the position of the more block on the front, by making it a block level element.
 * https://github.com/WordPress/gutenberg/issues/65934
*/
.more-link {
	display: block;
}

/* Сітка: центр і відступи */
ul.products.columns-4 {
  justify-content: center;
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  padding: 20px 0;
}

/* Прибрано зайвий margin/float від теми */
ul.products li.product-category.product {
  float: none !important;
  margin: 0 !important;
}



/* Виправлення обгортки WooCommerce акаунту */
.woocommerce-account .woocommerce-MyAccount-navigation {
  float: none;
  width: auto;
}

/* ✅ Плитки меню */
.woocommerce-MyAccount-navigation ul {
  display: flex;
  flex-direction: column;
  gap: 2px; /* 🔹 менші відступи між пунктами */
  padding: 0;
  margin: 0;
  list-style: none;
}

.woocommerce-MyAccount-navigation li a {
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 12px 16px;
  border-radius: 10px;
  background-color: #ffffff;
  text-decoration: none;
  font-weight: 500;
  font-size: 15px;
  color: #1a1a1a;
  box-shadow: 0 1px 4px rgba(0,0,0,0.15);
  transition: all 0.2s ease;
  width: 100%;
}

/* 🔹 Щоб текст не обрізався */
.woocommerce-MyAccount-navigation li {
  width: 100%;
}

/* 🌟 Активний пункт */
.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation li a:hover {
  background-color: #007cba;
  color: #fff;
}

/* 🎯 Іконки */
.woocommerce-MyAccount-navigation li a::before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  background-size: contain;
  background-repeat: no-repeat;
  flex-shrink: 0;
  filter: brightness(0) saturate(100%) invert(30%) sepia(98%) saturate(1500%) hue-rotate(180deg);
}

.woocommerce-MyAccount-navigation li.is-active a::before,
.woocommerce-MyAccount-navigation li a:hover::before {
  filter: invert(1);
}

.woocommerce-account .woocommerce-MyAccount-navigation li
 {
  list-style: none;
  padding: 5px 0;
}

/* Іконки по кожному пункту */
.woocommerce-MyAccount-navigation-link--dashboard a::before {
  background-image: url("data:image/svg+xml,%3Csvg fill='none' stroke='%23000' stroke-width='1.8' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M3 9.75L12 3l9 6.75v10.5a.75.75 0 01-.75.75H3.75A.75.75 0 013 20.25V9.75z'/%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M9 21V9h6v12'/%3E%3C/svg%3E");
}
.woocommerce-MyAccount-navigation-link--orders a::before {
  background-image: url("data:image/svg+xml,%3Csvg fill='none' stroke='%23000' stroke-width='1.8' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M21 16V8a2 2 0 00-2-2h-4l-2-2h-2L9 6H5a2 2 0 00-2 2v8a2 2 0 002 2h14a2 2 0 002-2z'/%3E%3C/svg%3E");
}
.woocommerce-MyAccount-navigation-link--downloads a::before {
  background-image: url("data:image/svg+xml,%3Csvg fill='none' stroke='%23000' stroke-width='1.8' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M4.5 20.25h15m-7.5-3V3.75m0 13.5L12.75 15M12 17.25l-.75-.75'/%3E%3C/svg%3E");
}
.woocommerce-MyAccount-navigation-link--edit-address a::before {
  background-image: url("data:image/svg+xml,%3Csvg fill='none' stroke='%23000' stroke-width='1.8' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M12 11.25a1.5 1.5 0 100-3 1.5 1.5 0 000 3zM12 3.75C8.25 3.75 6 6.75 6 9.75c0 5.25 6 10.5 6 10.5s6-5.25 6-10.5c0-3-2.25-6-6-6z'/%3E%3C/svg%3E");
}
.woocommerce-MyAccount-navigation-link--edit-account a::before {
  background-image: url("data:image/svg+xml,%3Csvg fill='none' stroke='%23000' stroke-width='1.8' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15.75 8.25a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.5 20.25a8.25 8.25 0 0115 0'/%3E%3C/svg%3E");
}
.woocommerce-MyAccount-navigation-link--customer-logout a::before {
  background-image: url("data:image/svg+xml,%3Csvg fill='none' stroke='%23000' stroke-width='1.8' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15.75 9V5.25A2.25 2.25 0 0013.5 3H6.75A2.25 2.25 0 004.5 5.25v13.5A2.25 2.25 0 006.75 21h6.75a2.25 2.25 0 002.25-2.25V15M19.5 12h-6m6 0l-1.5 1.5m1.5-1.5l-1.5-1.5'/%3E%3C/svg%3E");
}


/* Форма логінування */

/* ===== Обгортка форми ===== */
.woocommerce form.woocommerce-form-login,
.woocommerce form.woocommerce-form-register,
.woocommerce form.woocommerce-ResetPassword {
  border: 1px solid #e5e5e5;
  padding: 30px;
  border-radius: 12px;
  max-width: 480px;
  margin: 40px auto;
  background: #fff;
  box-shadow: 0 6px 16px rgba(0,0,0,0.03);
}

/* ===== Заголовок ===== */
.woocommerce form h2 {
  font-size: 1.5rem;
  margin-bottom: 24px;
  text-align: center;
}

/* ===== Поля ===== */
.woocommerce form .form-row input.input-text {
  width: 100%;
  padding: 12px 14px;
  border-radius: 8px;
  border: 1px solid #ccc;
  transition: border 0.2s;
  background-color: #f8faff;
}

.woocommerce form .form-row input.input-text:focus {
  border-color: #007cba;
  outline: none;
  background-color: #fff;
}

/* ===== Кнопка ===== */
.woocommerce form button.button {
  background-color: #007cba;
  color: white;
  padding: 12px 24px;
  border-radius: 8px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: background 0.2s ease;
  margin-top: 10px;
}

.woocommerce form button.button:hover {
  background-color: #005f94;
}

/* ===== Пам'ятати мене / лінк ===== */
.woocommerce form .woocommerce-form__label-for-checkbox {
  display: flex;
  align-items: center;
  margin-top: 16px;
}

.woocommerce form .woocommerce-LostPassword.lost_password {
  margin-top: 16px;
  text-align: right;
}

.woocommerce .woocommerce-LostPassword a {
  color: #007cba;
  text-decoration: underline;
}

/* ===== Помітки ===== */
.woocommerce-form__label,
.woocommerce-form-row label {
  font-weight: 500;
  margin-bottom: 8px;
  display: block;
  color: #333;
}

.woocommerce-form-row {
  margin-bottom: 20px;
}

/* === Контейнер правої частини (вміст акаунту) === */
.woocommerce-MyAccount-content {
  background: #fff;
  border-radius: 12px;
  padding: 30px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.15);
  font-size: 16px;
  line-height: 1.6;
  color: #222;
}

/* === Заголовки в середині (наприклад "Змінити адресу") === */
.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
  font-size: 1.6rem;
  margin-bottom: 20px;
  font-weight: 600;
  color: #111;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* === Таблиця замовлень / адрес тощо === */
.woocommerce-MyAccount-content table.my_account_orders,
.woocommerce-MyAccount-content address {
  width: 100%;
  border: 1px solid #eee;
  border-radius: 8px;
  padding: 20px;
  background: #f9f9f9;
  box-sizing: border-box;
  margin-bottom: 24px;
}

/* === Кнопки в акаунті === */
.woocommerce-MyAccount-content .button,
.woocommerce-MyAccount-content .woocommerce-button {
  background-color: #007cba;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 10px 18px;
  font-weight: 600;
  transition: background 0.2s ease;
}

.woocommerce-MyAccount-content .button:hover,
.woocommerce-MyAccount-content .woocommerce-button:hover {
  background-color: #005f94;
}

/* === Вирівнювання параграфів, посилань === */
.woocommerce-MyAccount-content p {
  margin-bottom: 16px;
}

.woocommerce-MyAccount-content a {
  color: #007cba;
  text-decoration: underline;
}

.woocommerce-MyAccount-content a:hover {
  text-decoration: none;
}

/* === Форма редагування профілю === */
.woocommerce-EditAccountForm input.input-text,
.woocommerce-Address input.input-text,
.woocommerce form input[type="text"],
.woocommerce form input[type="email"],
.woocommerce form input[type="password"] {
  width: 100%;
  padding: 10px 14px;
  border-radius: 8px;
  border: 1px solid #ccc;
  background: #f9f9f9;
  transition: 0.2s;
  margin-bottom: 15px;
}

.woocommerce form input:focus {
  border-color: #007cba;
  background: #fff;
  outline: none;
}

/* Відновлення сітки категорій WooCommerce */
ul.products.columns-3,
ul.products.columns-4,
ul.products {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
  padding: 0;
  margin: 0;
  list-style: none;

  justify-content: center;
}

ul.products li.product-category,
ul.products li.product {
  width: calc(33.333% - 22px); /* Для 3 колонок */
  box-sizing: border-box;
}

/* Адаптація для мобільних пристроїв */
@media (max-width: 768px) {
  ul.products li.product-category,
  ul.products li.product {
    width: 100%;
  }
}


/* === Великі картки категорій === */
ul.products li.product-category {
  position: relative;
  width: calc(33.333% - 22px);
  /* width: 100%; */
  max-width: 320px;
  margin: 20px;
  padding: 10px;

  overflow: hidden;
  transition: all 0.3s ease;
  /* background: #fff; */
  background: #000000;
  /* background: linear-gradient(90deg,rgba(0, 0, 0, 1) 0%, rgba(127, 0, 0, 1) 77%, rgba(205, 0, 0, 1) 100%); */


  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;

  border-radius: 12px;
  /* box-shadow: 7px 18px 5px rgba(0, 0, 0, 0.884); */
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

ul.products li.product-category:hover {
  /* transform: translateY(-5px); */
   box-shadow: 2px 12px 15px rgba(0, 0, 0, 0.6);
}

/* Мобільна адаптація */
@media (max-width: 768px) {
  ul.products li.product-category {
    width: 100%;
  }
}

/* === Картинка зверху, тільки верх заокруглений === */
ul.products li.product-category img {
  width: 100%;
  position: relative;
  height: auto;
  display: block;
  border-radius: 12px;
 
  object-fit: cover;
  transition: 0.3s ease;
  top: 10px!important;


  filter: grayscale(1) brightness(1.2);
  /* filter: brightness(1.5); */

  /* Приближуємо іконки */
  transform: scale(1.07);

  /* Multiple filters */
/* filter: contrast(165%) brightness(130%); */

/* filter: contrast(110%) brightness(130%); */
  /* Зменшуємо яскравість картинки */
  /* filter: brightness(1.2); */

  filter: blur(0px);
  
  /* Зменшуємо контрастність картинки */
  /* filter: contrast(0.9); */
  /* Зменшуємо насиченість картинки */
    /* filter: saturate(0.8); */
}


/* === При наведенні на картинку === */
ul.products li.product-category:hover img {
  filter: grayscale(0);
  /* Збільшуємо яскравість картинки */
  /* filter: brightness(1.5); */
  /* Збільшуємо контрастність картинки */
  filter: contrast(1.02);
  /* Збільшуємо насиченість картинки */
  filter: saturate(1.2);
  transform: scale(0.95);
}

/* === Блок назви окремо знизу — виглядає як продовження === */
ul.products li.product-category h2.woocommerce-loop-category__title {


  /* Позиціюємо текст внизу поверх картинки */
  position: absolute;
  
  /*
  bottom: 22px;
  left: 16px;
  right: 16px;
*/
 
/*
  bottom: 12px;
  left: 10px;
  right: 10px;
*/

  bottom: 0;
  left: 0;
  right: 0;

  text-transform: capitalize;
  margin: 0;
  padding: 8px 12px;

  /* background: rgba(0, 0, 0, 0.4); */

  background: #3d3d3d;

  /* Banderas style BG */
 
  /* background: linear-gradient(90deg,rgba(0, 0, 0, 1) 0%, rgba(127, 0, 0, 1) 77%, rgba(205, 0, 0, 1) 100%); */
 
  border-radius: 6px;
  text-shadow: 0 1px 3px rgba(0,0,0,0.4);

  /* відміняємо скругленя вгорі */
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  

  font-size: 1.1rem;
  font-weight: 600;
  /* background: #1a1a1ab3; */
  color: #fff;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  text-align: center;
  line-height: 1.4;

  display: block;
  /* width: 100%; */
  box-sizing: border-box;

  /* Основне для багаторядкового тексту */
  white-space: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
}


.woocommerce .products ul::after, .woocommerce .products ul::before, .woocommerce ul.products::after, .woocommerce ul.products::before { 
  content: none;
 } 

ul.products li.product-category h2.woocommerce-loop-category__title mark.count {
  background: none;
  color: #a8a0a0;
  font-weight: 400;
}

/* === Колір кількості товарів (білий) === */
ul.products li.product-category h2 mark.count {
  color: #ffffff;
  font-weight: 600;

  background-color: #3b0505;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 0.9rem;
  margin-left: 8px;
}

/* Скидаємо WooCommerce клас .first, щоб не псувало центрування */
ul.products li.first {
  margin-left: 0 !important;
  clear: none !important;
  margin-left: -30px!important;
}

ul.products {
  display: flex;
  flex-wrap: wrap;
  /* justify-content: center; ← це важливо для центрування */
  gap: 32px;
  padding: 0;
  list-style: none;
}


h1.wp-block-post-title{
  text-align: center;
}

.woocommerce .products ul::after, .woocommerce .products ul::before, .woocommerce ul.products::after, .woocommerce ul.products::before {
   content: none!important; 
}