/*
 Theme Name: Shop Isle Child
 Theme URI:
 Description: shop isle Child Theme
 Author: me
 Author URI: 
 Template: shop-isle
 Version: 1.0
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Tags: Theme Name Child Theme
*/

/*
You can start adding your own styles here. Use !important to overwrite styles if needed. */
.amazon-button:hover {
    background-color: #3fa043; /* Green */
    color: white;
}

.single-product div.product form.cart .button {
width: 100%;
}
/* Child Theme – Hover-Effekt vollständig deaktivieren und statischen Button erzwingen */
/* Hover-Effekte entfernen */
.shop-item:hover .shop-item-image:after {
    background: transparent !important; /* Overlay weg */
}

.shop-item-detail {
    position: relative !important;      /* direkt unter dem Bild */
    bottom: auto !important;
    opacity: 1 !important;              /* immer sichtbar */
    padding: 12px;
}

.shop-item-image {
    position: relative;
    overflow: hidden;
    cursor: pointer;                 /* zeigt Klickbarkeit */
}

.shop-item-image img {
    transition: transform 0.3s ease, filter 0.3s ease;
}

.shop-item:hover .shop-item-image img {
    transform: scale(1.05);         /* leicht vergrößern */
    filter: brightness(0.6);         /* Bild etwas abdunkeln */
}

/* ==============================================
   Hover-Overlay mit zentrierter Lupe
   ============================================== */

.shop-item::after {
    content: '';
    position: absolute;
    top: 30%;
    left: 50%;
    width: 64px;
    height: 64px;
    display: block;
    transform: translate(-50%, -50%);
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='14' cy='14' r='10' fill='none' stroke='%23bdbdbd' stroke-width='2'/><rect x='21' y='21' width='7' height='2' rx='1' fill='%23bdbdbd' transform='rotate(45 21 21)'/></svg>") no-repeat center center;
    background-size: contain;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none; /* verhindert, dass es Hover blockiert */
}

.shop-item:hover::after {
    opacity: 1;
}

.add-to-cart-button-wrap .button, ul.products li.product .product-button-wrap .add-to-cart-button-wrap .button {
    cursor: crosshair;
}

.product .product-button-wrap, .shop-item .product-button-wrap {
    cursor: crosshair;
}

.add-to-cart-button-wrap {
    background: #FF9900 !important;
}



.single-product div.product form.cart .button {
    width: 100% !important;
    }