/*
Theme Name: Storefront Child
Theme URI: https://woocommerce.com/products/storefront/
Template: storefront
Author: Automattic
Author URI: https://woocommerce.com/
Description: Storefront is the perfect theme for your next WooCommerce project. Designed and developed by WooCommerce Core developers, it features a bespoke integration with WooCommerce itself plus many of the most popular customer facing WooCommerce extensions. There are several layout & color options to personalise your shop, multiple widget regions, a responsive design and much more. Developers will love its lean and extensible codebase making it a joy to customize and extend. Looking for a WooCommerce theme? Look no further!
Tags: e-commerce,two-columns,left-sidebar,right-sidebar,custom-background,custom-colors,custom-header,custom-menu,featured-images,full-width-template,threaded-comments,accessibility-ready,rtl-language-support,footer-widgets,sticky-post,theme-options,editor-style
Version: 4.6.2.1766996517
Updated: 2025-12-29 08:21:57

/* =========================================================
   Nebel-Fabrik – eBay Header (Dark + Beige) | KOMPAKT
   ========================================================= */

:root{
  --nf-text:#E2D2BC;
  --nf-accent:#CBB59A;
  --nf-bg:#000;
  --nf-pill:#fff;
  --nf-muted: rgba(226,210,188,.75);
}

/* Header Wrapper */
.nf-ebay-header{
  background: transparent;
  border-bottom: 1px solid rgba(203,181,154,.25);
}

/* Erste Zeile */
.nf-ebay-inner{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 18px 0px;
}

/* Logo verkleinern (sauber & stabil) */
.nf-ebay-logo .custom-logo-link{
  display:block;
  max-width:100px;   /* ← HIER steuerst du die Größe */
}

.nf-ebay-logo .custom-logo{
  width:100%;
  height:auto;
  max-width:150px;
}


/* "Stöbern in Kategorien" */
.nf-ebay-browse-btn{
  all: unset;
  display:flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
  color: var(--nf-muted);
  font-size:14px;
  line-height:1.5;
  transform: translateY(-12px); 
}
.nf-ebay-browse-btn:hover{ color: var(--nf-text); }
.nf-ebay-caret{ font-size:14px; transform: translateY(1px); }

/* Suchbereich */
.nf-ebay-searchwrap{ flex:1 1 auto; }

/* Form (WICHTIG: kein Abstand zwischen Input & Select!) */
.nf-ebay-search{
  display:flex;
  align-items:center;
  gap:0;                       /* ← zusammenkleben */
  position:relative;
}

/* sicherstellen: keine Margins, die Abstand erzeugen */
.nf-ebay-input,
.nf-ebay-select,
.nf-ebay-select select{
  margin:0 !important;
}

/* Lupe */
.nf-ebay-icon{
  position:absolute;
  left:16px;
  top:50%;
  transform:translateY(-50%);
  font-size:16px;
  color:#6b6b6b;
  pointer-events:none;
}

/* Input */
.nf-ebay-input{
  flex:1 1 auto;
  height:48px;
  border:3px ;
  text-indent: 30px;
  border-right:0;              /* ← Verbindung zum Select */
  border-radius:999px 0 0 999px;
  background:var(--nf-pill);
  padding:0 16px 0 44px;
  font-size:16px;
  color:#111;
  outline:none;
}
.nf-ebay-input::placeholder{ color:#6b6b6b; opacity:1; }

/* Select (kompakt, klebt an Input) */
.nf-ebay-select{ position:relative; }

.nf-ebay-select select{
  height:48px;
  width:160px;
  border:3px ;
  border-left:0;               /* ← Verbindung zum Input */
  border-radius:0 999px 999px 0;
  background:var(--nf-pill);
  padding:0 40px 0 16px;
  font-size:16px;
  color:#6b6b6b;
  appearance:none;
  outline:none;
}

/* Dezente Innen-Trennlinie (wie eBay), ohne Lücke */
.nf-ebay-select::before{
  content:"";
  position:absolute;
  left:0;                      /* sitzt genau an der Naht */
  top:50%;
  transform:translateY(-50%);
  width:1px;
  height:26px;
  background: rgba(0,0,0,.12);
  pointer-events:none;
}

/* Dropdown-Pfeil */
.nf-ebay-select:after{
  content:"▾";
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  font-size:16px;
  color:#6b6b6b;
  pointer-events:none;
}

/* Button */
.nf-ebay-submit{
  height:48px;
  padding:0 26px;
  margin-left:10px;            /* Abstand NUR zum Button (wie eBay) */
  border-radius:999px;
  background:var(--nf-accent);
  color:#111;
  font-weight:900;
  font-size:18px;
  border:0;
  cursor:pointer;
}
.nf-ebay-submit:hover{ filter:brightness(.95); }

/* Erweitert */
.nf-ebay-advanced{
  margin-left:10px;
  font-size:14px;
  color:var(--nf-muted);
  text-decoration:none;
  white-space:nowrap;
}
.nf-ebay-advanced:hover{
  color:var(--nf-text);
  text-decoration:underline;
}

/* Navigation zweite Zeile */
.nf-ebay-nav{ 
	padding:0px 18px 6px; 
}
.nf-ebay-navlist{
  display:flex;
  gap:20px;
  list-style:none;
  margin:0;
  padding:0;
  overflow-x:auto;
  white-space:nowrap;
}
.nf-ebay-navlist a{
  font-size:15px;
  color:var(--nf-text);
  font-weight:600;
  text-decoration:none;
}
.nf-ebay-navlist a:hover{ color:var(--nf-accent); }

/* Mobil */
@media (max-width:900px){
  .nf-ebay-browse{ display:none; }
  .nf-ebay-select{ display:none; }
  .nf-ebay-input{
    border-right:3px solid var(--nf-accent);
    border-radius:999px;
  }
  .nf-ebay-advanced{ display:none; }
  .nf-ebay-submit{
    height:46px;
    font-size:16px;
    padding:0 22px;
    margin-left:10px;
  }
}


/* =========================================================
   Nebel-Fabrik – Startseite als eBay-Listing (Grid) | KOMPAKT NEU
   ========================================================= */

:root{
  --nf-text:#E2D2BC;
  --nf-accent:#CBB59A;
  --nf-pill:#fff;
}

/* Container */
.nf-home.nf-ebay-grid{
  max-width: 800px;
  margin: 0 auto;
}


/* Grid */
.nf-ebay-grid ul.products{
  list-style:none !important;
  padding:0 !important;
  margin:0 !important;

  display:grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important; /* kompakter */
}

/* Storefront Floats/Helper killen */
.nf-ebay-grid ul.products::before,
.nf-ebay-grid ul.products::after{
  content:none !important;
}

/* Kachel */
.nf-ebay-grid ul.products li.product{
  float:none !important;
  width:auto !important;
  margin:0 !important;
  clear:none !important;

  background: var(--nf-pill) !important;
  border-radius: 14px !important;
  padding: 8px !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.32) !important;
  position:relative !important;
  overflow:hidden;

  display:flex !important;
  flex-direction:column !important;
}

/* Responsive */
@media (max-width: 980px){
  .nf-ebay-grid ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 640px){
  .nf-ebay-grid ul.products{
    grid-template-columns: 1fr !important;
  }
}

/* Link/Thumbnail: kompakt + sauber */
.nf-ebay-grid ul.products li.product a{
  display:block;
  text-decoration:none !important;
  color:inherit;
}

.nf-ebay-grid ul.products li.product a img{
  width:50% !important;
  display:block !important;

  border-radius: 12px !important;
    margin: 0 auto 4px !important;

  aspect-ratio: 4 / 5;   /* wirkt kleiner als 1:1 */
  object-fit: cover;
}

/* Titel kompakt */
.nf-ebay-grid ul.products li.product .woocommerce-loop-product__title{
  font-size: 13px !important;
  line-height: 1.2 !important;
  color:#111 !important;
  margin: 0 0 6px !important;
  min-height: 32px;
}

/* Preis kompakt */
.nf-ebay-grid ul.products li.product .price{
  font-size: 18px !important;
  font-weight: 900 !important;
  color:#111 !important;
  margin: 2px 0 8px !important;
}

/* Kaufen-Button kompakt + rund */
.nf-ebay-grid ul.products li.product .button{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width: fit-content;

  margin-top:auto;
  padding: 8px 14px !important;
  border-radius: 999px !important;

  background: var(--nf-accent) !important;
  color:#111 !important;
  font-weight: 900 !important;
  font-size: 14px !important;

  text-decoration:none !important;
  border:0 !important;
  box-shadow:none !important;
}
.nf-ebay-grid ul.products li.product .button:hover{
  filter: brightness(.95);
}

/* Herz kleiner */
.nf-ebay-grid ul.products li.product:before{
  content:"♡";
  position:absolute;
  top:10px;
  right:10px;
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,.92);
  border-radius: 999px;
  font-size: 16px;
  color:#111;
  box-shadow: 0 6px 14px rgba(0,0,0,.16);
}

/* Pagination */
.nf-grid-pagination{ margin-top: 18px; }
.nf-grid-pagination .page-numbers{
  display:inline-block;
  padding: 7px 11px;
  margin: 0 6px 6px 0;
  border-radius: 10px;
  background: rgba(203,181,154,.15);
  color: var(--nf-text);
  text-decoration:none;
}
.nf-grid-pagination .current{
  background: var(--nf-accent);
  color:#111;
}

/* =========================================================
   Listing: Lieferzeit / MwSt / Versand ausblenden (Grid only)
   ========================================================= */

/* Lieferzeit */
.nf-ebay-grid .delivery-time,
.nf-ebay-grid .lieferzeit,
.nf-ebay-grid .product-delivery-time,
.nf-ebay-grid .wc-gzd-delivery-time,
.nf-ebay-grid .woocommerce-delivery-time,
.nf-ebay-grid span[class*="delivery"],
.nf-ebay-grid p[class*="delivery"],
.nf-ebay-grid span[class*="liefer"],
.nf-ebay-grid p[class*="liefer"]{
  display:none !important;
}

/* MwSt */
.nf-ebay-grid .tax-info,
.nf-ebay-grid .wc-gzd-tax-info,
.nf-ebay-grid .woocommerce-tax-info{
  display:none !important;
}

/* Versandkosten */
.nf-ebay-grid .shipping-costs-info,
.nf-ebay-grid .wc-gzd-shipping-costs-info{
  display:none !important;
}

/* =========================================================
   Nebel-Fabrik – Topbar (edel, kompakt, eBay-like)
   ========================================================= */

.nf-topbar{
  background: transparent;
  border-top: 1px solid rgba(203,181,154,.35);     /* beige Linie oben */
  border-bottom: 1px solid rgba(203,181,154,.35);  /* beige Linie unten */
}

/* Innenlayout */
.nf-topbar-inner{
  max-width:1200px;
  margin:0 auto;

  padding:6px 10px;          /* <<< HÖHE REDUZIERT */
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:nowrap;
}

/* Begrüßung links */
.nf-topbar-left{
  flex:0 0 auto;
  font-size:13px;            /* minimal kleiner */
  color: var(--nf-text);
  white-space:nowrap;
}

/* Menü rechts */
.nf-topbar-nav{
  display:flex;
  align-items:center;
  gap:16px;                  /* etwas enger */
  white-space:nowrap;
}

.nf-topbar-link{
  font-size:13px;
  color: var(--nf-text);
  text-decoration:none;
}
.nf-topbar-link:hover{
  color: var(--nf-accent);
  text-decoration:underline;
}

/* Icons ganz rechts */
.nf-topbar-icons{
  display:flex;
  align-items:center;
  gap:10px;
}

.nf-topbar-icon{
  font-size:17px;
  line-height:1;
  color: var(--nf-accent);
  text-decoration:none;
}

/* Mobil: Begrüßung ausblenden */
@media (max-width:900px){
  .nf-topbar-left{
    display:none;
  }
}
/* Storefront Header-Abstand killen */
.site-header{
  margin-top: 0 !important;
  padding-top: 0 !important;
}
/* Volle Breite für die Linie unter Zeile 2 */
.nf-ebay-header{
  border-bottom: none; /* alte Linie weg */
}

/* Neue Fullwidth-Linie */
.nf-ebay-header::after{
  content:"";
  display:block;
  width:100vw;                /* volle Viewport-Breite */
  height:1px;
  background: rgba(203,181,154,.35);
  position: relative;
  left:50%;
  transform: translateX(-50%);
}

/* =========================================================
   Nebel-Fabrik – Abstand Linie -> Grid wirklich killen (Startseite)
   ========================================================= */

/* 1) Falls deine Fullwidth-Linie als ::after-Block Platz nach unten macht */
.home .nf-ebay-header::after{
  margin: 0 !important;
}

/* 2) Falls der Content-Wrapper Luft gibt (Storefront / Col-Full) */
.home #content,
.home #content .col-full,
.home .site-content,
.home .site-content .col-full{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* 3) Falls dein Grid-Container selbst oben Abstand hat */
.home .nf-home.nf-ebay-grid{
  margin-top: 18px !important;   /* stell hier ein: 0–12px */
  padding-top: 0 !important;
}


/* =========================================================
   Nebel-Fabrik – eBay-Grid auf ALLE Produktlisten (Shop + Kategorien)
   ========================================================= */

/* Zielbereiche: Startseite-Grid ODER WooCommerce-Archive */
.nf-ebay-grid ul.products,
.woocommerce ul.products,
.post-type-archive-product ul.products,
.tax-product_cat ul.products,
.tax-product_tag ul.products{
  list-style:none !important;
  padding:0 !important;
  margin:0 !important;

  display:grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

/* Floats killen */
.nf-ebay-grid ul.products::before,
.nf-ebay-grid ul.products::after,
.woocommerce ul.products::before,
.woocommerce ul.products::after{
  content:none !important;
}

.nf-ebay-grid ul.products li.product,
.woocommerce ul.products li.product{
  float:none !important;
  width:auto !important;
  margin:0 !important;
  clear:none !important;

  background: var(--nf-pill) !important;
  border-radius: 14px !important;
  padding: 8px !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.32) !important;
  position:relative !important;
  overflow:hidden;

  display:flex !important;
  flex-direction:column !important;
}

/* Responsive */
@media (max-width:980px){
  .nf-ebay-grid ul.products,
  .woocommerce ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width:640px){
  .nf-ebay-grid ul.products,
  .woocommerce ul.products{
    grid-template-columns: 1fr !important;
  }
}

/* Bilder (ACHTUNG: wenn du im Shop nicht 50% willst, sag’s) */
.nf-ebay-grid ul.products li.product a img,
.woocommerce ul.products li.product a img{
  width:50% !important;
  display:block !important;
  margin: 0 auto 4px !important;

  border-radius: 12px !important;
  aspect-ratio: 4 / 5;
  object-fit: cover;
}

/* Titel */
.nf-ebay-grid ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size: 13px !important;
  line-height: 1.2 !important;
  color:#111 !important;
  margin: 0 0 6px !important;
  min-height: 32px;
}

/* Preis */
.nf-ebay-grid ul.products li.product .price,
.woocommerce ul.products li.product .price{
  font-size: 18px !important;
  font-weight: 900 !important;
  color:#111 !important;
  margin: 2px 0 8px !important;
}

/* Button */
.nf-ebay-grid ul.products li.product .button,
.woocommerce ul.products li.product .button{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width: fit-content;

  margin-top:auto;
  padding: 8px 14px !important;
  border-radius: 999px !important;
  background: var(--nf-accent) !important;
  color:#111 !important;
  font-weight: 900 !important;
  font-size: 14px !important;

  text-decoration:none !important;
  border:0 !important;
  box-shadow:none !important;
}

/* Herz */
.nf-ebay-grid ul.products li.product:before,
.woocommerce ul.products li.product:before{
  content:"♡";
  position:absolute;
  top:10px;
  right:10px;
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,.92);
  border-radius: 999px;
  font-size: 16px;
  color:#111;
  box-shadow: 0 6px 14px rgba(0,0,0,.16);
}

/* Lieferzeit/MwSt/Versand auch im Shop ausblenden */
.woocommerce .delivery-time,
.woocommerce .lieferzeit,
.woocommerce .product-delivery-time,
.woocommerce .wc-gzd-delivery-time,
.woocommerce .woocommerce-delivery-time,
.woocommerce .tax-info,
.woocommerce .wc-gzd-tax-info,
.woocommerce .woocommerce-tax-info,
.woocommerce .shipping-costs-info,
.woocommerce .wc-gzd-shipping-costs-info{
  display:none !important;
}

/* =========================================================
   Nebel-Fabrik – Shop Clean-Up (Storefront)
   Entfernt alles „Shop-UI-Geraffel“
   ========================================================= */

/* Shop-Header: Titel & Beschreibung ausblenden */
.post-type-archive-product .woocommerce-products-header{
  display: none !important;
}

/* Sortierung & Ergebnisanzahl ausblenden */
.post-type-archive-product .woocommerce-ordering,
.post-type-archive-product .woocommerce-result-count{
  display: none !important;
}

/* Pagination (1 2 3 …) ausblenden */
.post-type-archive-product .woocommerce-pagination{
  display: none !important;
}

/* Rechte Sidebar (Storefront) entfernen */
#secondary,
.widget-area{
  display: none !important;
}

/* Content auf volle Breite ziehen */
#primary,
.content-area{
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}

/* =========================================================
   Shop: Grid nach oben ziehen
   ========================================================= */

/* Oberen Abstand des Main-Containers entfernen */
.post-type-archive-product .site-main{
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Content-Wrapper entschärfen */
.post-type-archive-product .content-area{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Falls Storefront unsichtbare Sortierung noch Platz reserviert */
.post-type-archive-product .storefront-sorting{
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Notices (oft leer, aber mit Abstand) */
.post-type-archive-product .woocommerce-notices-wrapper{
  margin: 0 !important;
  padding: 0 !important;
}
/* =========================================================
   Shop: Lieferzeit komplett ausblenden
   ========================================================= */

/* Germanized / DE-Plugins – alle gängigen Varianten */
.post-type-archive-product .delivery-time,
.post-type-archive-product .lieferzeit,
.post-type-archive-product .product-delivery-time,
.post-type-archive-product .wc-gzd-delivery-time,
.post-type-archive-product .woocommerce-delivery-time,
.post-type-archive-product span[class*="delivery"],
.post-type-archive-product p[class*="delivery"],
.post-type-archive-product span[class*="liefer"],
.post-type-archive-product p[class*="liefer"]{
  display: none !important;
}
/* =========================================================
   Shop: Preisschrift verkleinern
   ========================================================= */
.post-type-archive-product ul.products li.product .price,
.post-type-archive-product ul.products li.product .price span{
  font-size: 13px !important;
}
/* =========================================================
   Shop Grid: Kaufen + Angebot nebeneinander (clean)
   ========================================================= */

/* Button + Badge in einer Zeile */
.post-type-archive-product .nf-buy-row{
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Angebots-Badge */
.post-type-archive-product .nf-onsale-inline{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 6px 14px;
  border: 2px solid var(--nf-accent);   /* dunkles Beige */
  border-radius: 999px;                 /* rund wie Button */

  color: var(--nf-accent);
  font-weight: 900;
  font-size: 13px;
  line-height: 1;
  letter-spacing: 0.04em;

  background: transparent;
  white-space: nowrap;
}


/* =========================================================
   Nebel-Fabrik – Storefront Shop Layout FIX
   Filter LINKS, Grid RECHTS
   ========================================================= */

/* WICHTIG: Storefront-Wrapper neutralisieren */
.post-type-archive-product .content-area,
.post-type-archive-product #primary,
.post-type-archive-product .site-main{
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* JETZT greift das eigentliche Layout */
.post-type-archive-product .nf-shop-layout{
  display: grid !important;
  grid-template-columns: 260px 1fr;
  gap: 20px;
  align-items: start;
}

/* Filter links */
.post-type-archive-product .nf-shop-filters{
  order: 1;
}

/* Produkte rechts */
.post-type-archive-product .nf-shop-results{
  order: 2;
}

/* Rechte Storefront-Sidebar endgültig aus */
.post-type-archive-product #secondary,
.post-type-archive-product .widget-area{
  display: none !important;
}

/* Mobile: Filter oben */
@media (max-width: 980px){
  .post-type-archive-product .nf-shop-layout{
    grid-template-columns: 1fr;
  }

  .post-type-archive-product .nf-shop-filters{
    order: -1;
  }
}
/* =========================================================
   Filter-Sidebar: NUR auf der Startseite anzeigen
   ========================================================= */

/* Standard: Filter überall ausblenden */
.nf-shop-filters{
  display: none !important;
}

/* NUR auf der Startseite (Shop-Start) anzeigen */
.home .nf-shop-filters{
  display: block !important;
}