/* Wordpress */

ul.wp-block-list{
  /*margin-left: 10px !important;*/
}



/* WooCommerce - przycisk "Dodaj do koszyka" */
.wc-block-components-product-button__button {
    transition: background-color 0.25s ease;
}

.wc-block-components-product-button__button:hover {
   /* background-color: #4a4a4a !important;*/
    background-color: rgb(193, 193, 193) !important;
    /*color: #dddddd !important;*/
    /*border: #111111 solid 1px !important;*/
    /*transition: background-color 0.25s ease;*/
    /*transition: background-color 0.45s ease;*/
    transition: all 0.25s ease;
}

.wc-block-components-product-button__button:focus-visible {
    outline: 2px solid #111111;
    outline-offset: 3px;
}

/* WooCommerce - linia oddzielająca */
.wp-block-woocommerce-product-details.is-style-minimal ul.tabs.wc-tabs::after, html body .wp-block-woocommerce-product-details.is-style-minimal ul.tabs.wc-tabs::before{
    content: " ";
  display: table;
}



/* WooCommerce - delikatne powiększenie zdjęcia produktu */
.wc-block-components-product-image {
    overflow: hidden;
}

.wc-block-components-product-image img {
    transition: transform 0.4s ease;
}

.wc-block-components-product-image:hover img {
    transform: scale(1.05);
}




/**
***   Select box dla sortowania woocommerce 
**/
/* 1. Główny kontener - pozycjonowanie i reset marginesów */
.wp-block-woocommerce-catalog-sorting {
  position: relative;
  display: inline-block;
  min-width: 240px;
  margin: 15px 0;
}

.wp-block-woocommerce-catalog-sorting form {
  margin: 0;
  padding: 0;
}

/* 2. Stylowanie samego elementu <select> */
.wp-block-woocommerce-catalog-sorting select.orderby {
  /* Reset domyślnego wyglądu przeglądarki */
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  width: 100%;
  font-family: inherit;
  background-color: #ffffff;
  
  /* Obramowanie i zaokrąglenie w stylu nowoczesnych interfejsów (np. Tailwind) */
  border: 1px solid #e5e7eb;
  border-radius: 3px;
  
  /* Przestrzeń wewnątrz (duży prawy padding na nową strzałkę) */
  padding: 8px 8px 8px 12px;
  
  /* Subtelny cień */
  box-shadow: 0 1px 3px 0 rgba(100, 100, 100, 0.05), 0 1px 2px -1px rgba(100, 100, 100, 0.05);
  
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}

/* 3. Efekty najechania (Hover) i aktywacji (Focus) */
.wp-block-woocommerce-catalog-sorting select.orderby:hover {
  border-color: #d1d5db;
  background-color: #f9fafb;
}

.wp-block-woocommerce-catalog-sorting select.orderby:focus {
  outline: none;
  border-color: #9d9d9d; /* Nowoczesny kolor indygo / fiolet */
  box-shadow: 10 10 10 4px rgba(157, 157, 157, 0.15);
  /*box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.15);*/
}

/* 4. Dodanie własnej, minimalistycznej strzałki SVG */
.wp-block-woocommerce-catalog-sorting form::after {
 
    content: "";
    position: absolute;

    top: 35%;
    right: 1rem;

    width: 7px;
    height: 7px;

    border-right: 1px solid #949494;
    border-bottom: 1px solid #949494;

    transform: translateY(-70%) rotate(45deg);

    pointer-events: none;
  transition: transform 0.2s ease;
}



.wp-block-navigation-item__content {
    text-decoration: none;
    transition: opacity 0.25s ease;
}

.wp-block-navigation-item__content:hover {
    text-decoration: none;
    opacity: 0.55;
}

.wp-block-navigation-item__content:focus-visible {
    outline: 2px solid #111111;
    outline-offset: 4px;
}