/* ------------------------------------------
   ⚙️ Globale Variablen (Desktop-Defaults)
------------------------------------------ */
:root{
  /* NEU-Badge (unverändert) */
  --neu-size: clamp(3.4rem, 5vw, 6.6rem);
  --neu-top: -1rem;
  --neu-left: -.8rem;
  --neu-opacity: 1;

  /* Nicht vorrätig – Grafik-Ribbon */
  --nv-url: url("/wp-content/themes/7SachenManufaktur-child/assets/nv-badged.webp");
  --nv-size: clamp(120px, 70%, 300px);  /* Kantenlänge des Quadrats */
  --nv-right: 0px;                     /* Einzug von rechts (negativ = weiter ins Bild) */
  --nv-bottom: 0px;                     /* Abstand vom unteren Bildrand */
  --nv-shadow: 0;
  --nv-img-dim: .55;                     /* Bild abdunkeln (0–1) */
}

/* ------------------------------------------
   Basis
------------------------------------------ */

/* Badges sind unsichtbar, bis ein Status greift */
.tm-badge{ display:none; }

/* tm-thumb-wrap bildet den Positionsrahmen übers Bild */
.woocommerce ul.products li.product .tm-thumb-wrap{
  position: relative;
  display: block;
  /*overflow: hidden;*/
  line-height: 0;
}

/* ------------------------------------------
   🟢 NEU – Bild-Overlay oben links
------------------------------------------ */
.woocommerce ul.products li.product.new .tm-badge--neu{
  display: block;
  position: absolute;
  top: var(--neu-top);
  left: var(--neu-left);
  width: var(--neu-size);
  height: var(--neu-size);
  background-image: url("/wp-content/themes/7SachenManufaktur-child/assets/neu-badged.webp");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  z-index: 0;
  pointer-events: none;
  opacity: var(--neu-opacity);
  transition: opacity .2s ease-in;
}


/* ------------------------------------------
   🟢 Weihnachten – Bild-Overlay unten link
------------------------------------------ */
.tm-thumb-wrap.tm-cat--weihnachten .tm-badge--custom{
  display: block;
  position: absolute;
  bottom: var(--neu-top);
  left: var(--neu-left);
  width: var(--neu-size);
  height: var(--neu-size);
  background-image: url("/wp-content/themes/7SachenManufaktur-child/assets/weihnachten-badged.webp");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  z-index: 0;
  pointer-events: none;
  opacity: var(--neu-opacity);
  transition: opacity .2s ease-in;
}

/* ------------------------------------------
   🟢 Weihnachten – Bild-Overlay unten link
------------------------------------------ */
.tm-thumb-wrap.tm-cat--valentinstag .tm-badge--custom{
  display: block;
  position: absolute;
  bottom: var(--neu-top);
  left: var(--neu-left);
  width: var(--neu-size);
  height: var(--neu-size);
  background-image: url("/wp-content/themes/7SachenManufaktur-child/assets/love-badged.webp");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  z-index: 0;
  pointer-events: none;
  opacity: var(--neu-opacity);
  transition: opacity .2s ease-in;
}




/* ------------------------------------------
   🔴 Nicht vorrätig – Grafik-Ribbon unten rechts
------------------------------------------ */

/* Standardmäßig unsichtbar */
.tm-badge--nv { display:none; }


/* Sichtbar, wenn WooCommerce .outofstock setzt */
.woocommerce ul.products li.product.outofstock .tm-badge--nv{
  display:block;
  position:absolute;
  right: var(--nv-right);
  bottom: var(--nv-bottom);
  width: var(--nv-size);
  height: var(--nv-size);
  background-image: var(--nv-url);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  box-shadow: var(--nv-shadow);
  z-index:0;
  pointer-events:none;
}





/* Optional: Produktbild leicht abdunkeln
.woocommerce ul.products li.product.outofstock .tm-thumb-wrap img{
  opacity: var(--nv-img-dim);
}
 */
/* ------------------------------------------
   📱 Mobile-Optimierung (Breakpoints)
   -> passe nur die Variablen an
------------------------------------------ */

/* Tablet & kleine Laptops */
@media (max-width: 1024px){
  :root{
    /* NEU */
    --neu-size: clamp(3.6rem, 10vw, 5.2rem);
    --neu-top: -.9rem;
    --neu-left: -.6rem;
	--neu-opacity: 1;

    /* Nicht vorrätig – Grafik-Ribbon */
    --nv-size: clamp(120px, 70%, 280px);
    --nv-right: 0px;
    --nv-bottom: 0px;
    --nv-img-dim: .6;
  }
}

/* Smartphones */
@media (max-width: 768px){
  :root{
    /* NEU */
    --neu-size: clamp(4.2rem, 20vw, 15.2rem);
    --neu-top: 1rem;
    --neu-left: 1rem;
    --neu-opacity: 1;

    /* Nicht vorrätig – Grafik-Ribbon */
    --nv-size: clamp(140px, 70%, 280px);
    --nv-right: 0px;
    --nv-bottom: 0px;
    --nv-img-dim: .65;
  }
}


/*  Vorrätig */
.stock.in-stock {	
	color: #2e7d32;              /* sattes Grün */
  	font-weight: 600;
  	background-color: var(--hintergr-hell);
	padding: 2px 5px 2px;
	
}

/*  Ausverkauft */
.stock.out-of-stock {
  	color: #c62828;              /* warmes Rot */
  	font-weight: 600;
	background-color: var(--hintergr-hell);
	padding: 2px 5px 2px;
}

/*  Nachbestellung */
.stock.available-on-backorder {
  	color: #e0a800;              /* gold-gelb */
  	font-weight: 600;
	background-color: var(--hintergr-hell);
	padding: 2px 5px 2px;
}

.stock::before {
  content: "";
  font-size: 1.1em;
  vertical-align: middle;
}
.stock.in-stock::before { color: #2e7d32; }
.stock.out-of-stock::before { color: #c62828; }
.stock.available-on-backorder::before { color: #e0a800; }

