/*
Theme Name: Modellbau Beschriftung
Theme URI: https://modellbau-beschriftung.de
Description: Child Theme für den WooCommerce-Nachbau des bisherigen Shopify-Shops.
Author: Modellbau & Beschriftung
Template: generatepress
Version: 0.1.0
Text Domain: modellbau-gp-child
*/

/* =========================================================
   Grundsystem – aus dem gesicherten Shopify-Theme übertragen
   ========================================================= */

:root{
  --mb-bg:#ffffff;
  --mb-text:#333333;
  --mb-heading:#111111;
  --mb-header:#000000;
  --mb-border:#1f4747;
  --mb-accent:#a26b25;
  --mb-green:#8fc900;
  --mb-radius:0px;
  --mb-container:1200px;
}

/* Typografie */
body,
button,
input,
select,
textarea{
  font-family:"Lato", Arial, sans-serif;
  font-size:14px;
  line-height:1.5;
  color:var(--mb-text);
}

h1,h2,h3,h4,h5,h6,
.site-branding,
.main-navigation,
.woocommerce-loop-product__title,
.woocommerce div.product .product_title{
  font-family:"Fjalla One", Impact, sans-serif;
  font-weight:400;
  color:var(--mb-heading);
}

h1{font-size:26px;line-height:1.15;}
h2{font-size:24px;line-height:1.2;}
h3{font-size:20px;line-height:1.25;}

/* Container */
.grid-container,
.site.grid-container{
  max-width:var(--mb-container);
}

/* Header – schwarzer Shopify-Look */
.site-header{
  background:var(--mb-header);
  color:#fff;
}
.site-header .inside-header{
  min-height:80px;
  padding-top:10px;
  padding-bottom:10px;
}
.site-logo img{
  max-width:90px;
  height:auto;
}
.main-navigation,
.main-navigation .main-nav ul li a,
.main-navigation .menu-toggle{
  background:var(--mb-header);
  color:#fff;
}
.main-navigation .main-nav ul li a{
  font-family:"Fjalla One", Impact, sans-serif;
  font-size:14px;
  letter-spacing:.01em;
}
.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li:focus > a,
.main-navigation .main-nav ul li[class*="current-menu-"] > a{
  background:#111;
  color:#fff;
}
.main-navigation ul ul{
  background:#fff;
  border:1px solid var(--mb-border);
}
.main-navigation .main-nav ul ul li a{
  background:#fff;
  color:#111;
  font-family:"Lato", Arial, sans-serif;
  font-size:16px;
}
.main-navigation .main-nav ul ul li:hover > a{
  background:#f5f5f5;
  color:#111;
}

/* Seitenfläche */
.site-content{
  padding-top:30px;
  padding-bottom:40px;
}

/* Buttons – bewusst schlicht wie im Shopify-Theme */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"],
a.button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce div.product form.cart .button{
  background:#000;
  color:#fff;
  border:0;
  border-radius:0;
  font-family:"Fjalla One", Impact, sans-serif;
  font-weight:400;
  font-size:14px;
  line-height:1.2;
  padding:12px 18px;
}
button:hover,
a.button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce div.product form.cart .button:hover{
  background:#222;
  color:#fff;
}

/* WooCommerce Archiv / Shop */
.woocommerce ul.products{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:30px;
  margin:0;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after{display:none;}
.woocommerce ul.products li.product{
  float:none!important;
  width:auto!important;
  margin:0!important;
  padding:0 0 13px;
  text-align:center;
  background:#fff;
}
.woocommerce ul.products li.product a img{
  width:100%;
  margin:0 0 12px;
  background:#fff;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:"Lato", Arial, sans-serif;
  font-size:17.5px;
  font-weight:400;
  line-height:1.3;
  padding:0;
  margin:0 0 5px;
  color:#111;
}
.woocommerce ul.products li.product .price{
  font-size:14px;
  color:#333;
  margin:0;
}
.woocommerce ul.products li.product .button{
  margin-top:10px;
}

/* Sale-Badge */
.woocommerce span.onsale{
  min-width:auto;
  min-height:auto;
  line-height:1;
  padding:7px 10px;
  border-radius:25px;
  background:#000;
  color:#fff;
  font-family:"Lato", Arial, sans-serif;
  font-size:11px;
  font-weight:400;
}

/* Produktdetail */
.woocommerce div.product div.images,
.woocommerce div.product div.summary{
  margin-bottom:35px;
}
.woocommerce div.product .product_title{
  font-size:31px;
  margin-bottom:12px;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price{
  font-size:20px;
  color:#222;
}
.woocommerce div.product form.cart{
  margin-top:20px;
}
.woocommerce div.product form.cart .variations th,
.woocommerce div.product form.cart .variations td{
  padding:6px 8px 6px 0;
  vertical-align:middle;
}
.woocommerce div.product form.cart .variations label{
  font-family:"Fjalla One", Impact, sans-serif;
  font-weight:400;
}
.woocommerce div.product .woocommerce-product-details__short-description,
.woocommerce div.product .woocommerce-Tabs-panel{
  font-size:14px;
  line-height:1.55;
}

/* Formulare */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
textarea,
select{
  border:1px solid #cfcfcf;
  border-radius:0;
  background:#fff;
  color:#222;
}

/* Warenkorb / Checkout */
.woocommerce table.shop_table{
  border:1px solid #ddd;
  border-radius:0;
}
.woocommerce-checkout #payment{
  background:#f6f6f6;
  border-radius:0;
}
.woocommerce-checkout #payment div.payment_box{
  background:#ececec;
}

/* Shopify-Leistungsleiste */
.mb-leistungsleiste{
  text-align:center;
  padding:10px;
  font-size:14px;
  line-height:2;
  color:#222;
  font-weight:400;
}
.mb-leistungsleiste .dot{color:var(--mb-green);}

/* Mobile */
@media (max-width: 768px){
  .woocommerce ul.products{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:22px;
  }
  .site-header .inside-header{min-height:70px;}
  .woocommerce div.product .product_title{font-size:26px;}
}
@media (max-width: 420px){
  .woocommerce ul.products{gap:16px;}
}


/* =========================================================
   v0.2 – WooCommerce Produktseite näher an Shopify
   ========================================================= */

/* Kein Blog-Sidebar auf Shop- und Produktseiten */
.woocommerce-page #right-sidebar,
.woocommerce-page #left-sidebar,
.single-product #right-sidebar,
.single-product #left-sidebar{
  display:none!important;
}

/* WooCommerce-Inhalt auf volle Breite */
.woocommerce-page #primary,
.single-product #primary{
  width:100%!important;
  float:none!important;
}
.woocommerce-page .content-area,
.single-product .content-area{
  width:100%!important;
}

/* Breitere Produktseite, weniger WordPress-Look */
.single-product .site-content{
  padding-top:28px;
}
.single-product .inside-article,
.post-type-archive-product .inside-article,
.tax-product_cat .inside-article{
  padding:0!important;
  background:transparent!important;
}

/* Breadcrumb dezenter */
.woocommerce .woocommerce-breadcrumb{
  font-size:12px;
  color:#777;
  margin:0 0 18px;
}
.woocommerce .woocommerce-breadcrumb a{
  color:#777;
  text-decoration:none;
}

/* Produktkopf 52/48 */
.single-product div.product{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  gap:44px;
  align-items:start;
}
.single-product div.product > .woocommerce-product-gallery,
.single-product div.product > .summary{
  float:none!important;
  width:auto!important;
  margin:0!important;
}
.single-product div.product > .woocommerce-tabs,
.single-product div.product > .related,
.single-product div.product > .upsells{
  grid-column:1 / -1;
}

/* Galerie */
.woocommerce div.product div.images .flex-control-thumbs{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  margin-top:10px;
}
.woocommerce div.product div.images .flex-control-thumbs li{
  width:auto!important;
  float:none!important;
  margin:0!important;
}
.woocommerce div.product div.images .flex-control-thumbs img{
  opacity:.72;
  border:1px solid #ddd;
}
.woocommerce div.product div.images .flex-control-thumbs img.flex-active,
.woocommerce div.product div.images .flex-control-thumbs img:hover{
  opacity:1;
  border-color:#111;
}

/* Produktinfo */
.woocommerce div.product .summary{
  padding-top:0;
}
.woocommerce div.product .product_title{
  font-size:36px;
  line-height:1.08;
  margin:0 0 14px;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price{
  font-size:22px;
  margin-bottom:22px;
}
.woocommerce div.product form.cart .variations{
  margin-bottom:12px;
}
.woocommerce div.product form.cart .variations th{
  width:80px;
  text-align:left;
}
.woocommerce div.product form.cart .variations select{
  min-width:220px;
  padding:10px 36px 10px 12px;
  border:1px solid #d5d5d5;
  background:#fff;
}
.woocommerce div.product form.cart div.quantity{
  margin-right:8px;
}
.woocommerce .quantity .qty{
  min-height:42px;
}
.woocommerce div.product form.cart .button{
  min-height:42px;
  padding:12px 22px;
  background:#6f6f6f;
}
.woocommerce div.product form.cart .button:hover{
  background:#111;
}

/* Produkt-Metadaten deutlich zurücknehmen */
.woocommerce div.product .product_meta{
  margin-top:18px;
  font-size:12px;
  color:#666;
}
.woocommerce div.product .product_meta > span{
  display:block;
  margin-bottom:3px;
}

/* Tabs weniger "WordPress", mehr Shopify */
.woocommerce div.product .woocommerce-tabs{
  margin-top:34px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs{
  padding:0!important;
  margin:0 0 24px!important;
  border-bottom:1px solid #ddd;
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before{
  display:none!important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  margin:0 24px 0 0!important;
  padding:0!important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{
  display:none!important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  padding:12px 0!important;
  font-family:"Lato",Arial,sans-serif;
  font-size:14px;
  font-weight:700;
  color:#666!important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{
  color:#111!important;
  border-bottom:2px solid #111;
}
.woocommerce div.product .woocommerce-tabs .panel{
  margin:0!important;
  padding:0!important;
}
.woocommerce div.product .woocommerce-tabs .panel h2:first-child{
  display:none;
}

/* Beschreibung typografisch näher am Shopify-Layout */
.woocommerce-Tabs-panel--description{
  max-width:980px;
}
.woocommerce-Tabs-panel--description p,
.woocommerce-Tabs-panel--description li{
  font-size:16px;
  line-height:1.6;
}

/* mobile */
@media (max-width:900px){
  .single-product div.product{
    grid-template-columns:1fr;
    gap:26px;
  }
  .single-product div.product > .woocommerce-tabs,
  .single-product div.product > .related,
  .single-product div.product > .upsells{
    grid-column:auto;
  }
  .woocommerce div.product .product_title{
    font-size:30px;
  }
}


/* =========================================================
   v0.3 – Produktseite kompakter und näher am Shopify-Look
   ========================================================= */

/* Gesamtbreite */
.single-product .grid-container{
  max-width:1320px;
}
.single-product .site-content{
  padding-left:28px;
  padding-right:28px;
}

/* Produktkopf: Bild etwas kompakter, Infobereich dichter */
.single-product div.product{
  grid-template-columns:minmax(0,1fr) minmax(420px,.92fr);
  gap:42px;
}

/* Bild nicht künstlich aufblähen */
.woocommerce div.product div.images img{
  width:100%;
  height:auto;
  object-fit:contain;
}

/* Titel und Preis näher am Shopify-Maßstab */
.woocommerce div.product .product_title{
  font-size:31px;
  line-height:1.06;
  letter-spacing:0;
  margin-bottom:14px;
  max-width:620px;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price{
  font-family:"Lato",Arial,sans-serif;
  font-size:18px;
  line-height:1.3;
  margin-bottom:26px;
}

/* Varianten kompakter */
.woocommerce div.product form.cart .variations{
  width:auto;
  margin-bottom:16px;
}
.woocommerce div.product form.cart .variations tr{
  display:grid;
  grid-template-columns:86px minmax(220px,1fr);
  align-items:center;
  gap:10px;
  margin-bottom:10px;
}
.woocommerce div.product form.cart .variations th,
.woocommerce div.product form.cart .variations td{
  display:block;
  width:auto!important;
  padding:0!important;
}
.woocommerce div.product form.cart .variations select{
  width:100%;
  min-width:0;
  max-width:280px;
  height:44px;
}

/* Menge + Warenkorb */
.woocommerce div.product form.cart .single_variation_wrap .woocommerce-variation-add-to-cart{
  display:flex;
  align-items:center;
  gap:8px;
}
.woocommerce div.product form.cart div.quantity{
  margin:0!important;
}
.woocommerce div.product form.cart .button{
  min-width:180px;
  background:#777;
}
.woocommerce div.product form.cart .button:not(.disabled):hover{
  background:#111;
}

/* PayPal-Expressbereich nicht über die ganze Spaltenbreite ziehen */
.single-product .ppcp-messages,
.single-product .ppcp-button-wrapper,
.single-product .paypal-buttons,
.single-product [id*="ppc-button"],
.single-product [class*="ppc-button"]{
  max-width:520px!important;
}
.single-product .ppcp-messages{
  margin-top:22px;
}

/* Produkt-Meta fast unsichtbar halten */
.woocommerce div.product .product_meta{
  max-width:560px;
  padding-top:4px;
  border-top:0;
  color:#777;
  font-size:11px;
}
.woocommerce div.product .product_meta a{
  color:#777;
}

/* Tabs/Details mit mehr Weißraum, ohne graue WooCommerce-Kästen */
.woocommerce div.product .woocommerce-tabs{
  margin-top:38px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs{
  border-bottom:1px solid #d9d9d9;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  margin-right:28px!important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  font-size:13px;
}

/* Shopify-artigere Beschreibung */
.woocommerce-Tabs-panel--description{
  max-width:1000px;
}
.woocommerce-Tabs-panel--description p{
  margin:0 0 18px;
}

/* Brotkrumen noch dezenter */
.woocommerce .woocommerce-breadcrumb{
  margin-bottom:14px;
}

/* Mobile */
@media (max-width:900px){
  .single-product .site-content{
    padding-left:18px;
    padding-right:18px;
  }
  .woocommerce div.product .product_title{
    font-size:28px;
  }
  .woocommerce div.product form.cart .variations tr{
    grid-template-columns:1fr;
    gap:5px;
  }
}


/* =========================================================
   v0.4 – Custom Header nach Shopify-Vorlage
   ========================================================= */

/* GeneratePress-Standardheader ausblenden */
.site-header,
.main-navigation{
  display:none!important;
}

/* Eigener Header */
.mb-custom-header{
  background:#fff;
  border-top:7px solid #000;
  border-bottom:1px solid #ececec;
  position:relative;
  z-index:50;
}
.mb-custom-header__inner{
  max-width:1180px;
  min-height:78px;
  margin:0 auto;
  padding:10px 22px 12px;
  display:grid;
  grid-template-columns:180px 1fr 180px;
  align-items:center;
  gap:20px;
}

/* SHOP ÖFFNEN */
.mb-shop-open{
  justify-self:start;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 22px;
  background:linear-gradient(to bottom,#b7db00 0%,#8fc900 100%);
  color:#111!important;
  border:1px solid #6f9600;
  border-bottom:4px solid #749a00;
  border-radius:7px;
  box-shadow:0 3px 6px rgba(0,0,0,.20);
  text-decoration:none!important;
  font-family:"Fjalla One",Impact,sans-serif;
  font-size:16px;
  letter-spacing:1px;
  line-height:1;
  white-space:nowrap;
}
.mb-shop-open:hover{
  transform:translateY(-1px);
  background:linear-gradient(to bottom,#c4e823 0%,#98cf00 100%);
  color:#111!important;
}
.mb-shop-open:active{
  transform:translateY(2px);
  border-bottom-width:2px;
}

/* Claim */
.mb-custom-header__claim{
  display:block;
  text-decoration:none!important;
  justify-self:center;
  text-align:center;
  font-family:"Fjalla One",Impact,sans-serif;
  font-size:19px;
  line-height:1.15;
  letter-spacing:.3px;
  color:#111;
  white-space:nowrap;
}
.mb-custom-header__claim strong{
  color:#749a00;
  font-weight:400;
}

/* Icons rechts */
.mb-header-actions{
  justify-self:end;
  display:flex;
  align-items:flex-start;
  gap:9px;
}
.mb-header-action{
  width:42px;
  min-width:42px;
  height:42px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid #d7d7d7;
  border-radius:6px;
  background:#fff;
  color:#111!important;
  text-decoration:none!important;
  box-shadow:0 1px 2px rgba(0,0,0,.05);
  transition:.18s ease;
}
.mb-header-action:hover{
  background:#f4f8e8;
  border-color:#749a00;
  box-shadow:0 4px 7px rgba(0,0,0,.14);
  transform:translateY(-2px);
}
.mb-header-action svg{
  width:28px;
  height:28px;
  display:block;
}
.mb-header-action__label{
  position:absolute;
  top:46px;
  left:50%;
  transform:translateX(-50%);
  font-family:"Fjalla One",Impact,sans-serif;
  font-size:9px;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.7px;
  white-space:nowrap;
  color:#111;
}
.mb-cart-count{
  position:absolute;
  top:-7px;
  right:-7px;
  min-width:18px;
  height:18px;
  padding:0 4px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#8fc900;
  border:1px solid #111;
  color:#111;
  font-family:"Lato",Arial,sans-serif;
  font-size:10px;
  font-weight:700;
}

/* Etwas Luft nach den Icon-Labels */
.mb-custom-header + .site{
  margin-top:10px;
}

/* dezente grüne Akzentlinie, die wir später weiterführen können */
.single-product .product_title::after,
.woocommerce-products-header__title::after{
  content:"";
  display:block;
  width:64px;
  height:3px;
  margin-top:12px;
  background:#9bc600;
}

/* Kategorie ausblenden – Daten bleiben intern */
.single-product .product_meta .posted_in{
  display:none!important;
}

/* responsive */
@media (max-width:900px){
  .mb-custom-header__inner{
    grid-template-columns:auto 1fr auto;
    min-height:68px;
    padding:8px 14px 10px;
    gap:10px;
  }
  .mb-shop-open{
    min-height:36px;
    padding:0 11px;
    font-size:11px;
    border-radius:5px;
  }
  .mb-custom-header__claim{
    font-size:14px;
    white-space:normal;
  }
  .mb-header-actions{
    gap:5px;
  }
  .mb-header-action{
    width:34px;
    min-width:34px;
    height:34px;
  }
  .mb-header-action svg{
    width:22px;
    height:22px;
  }
  .mb-header-action__label{
    display:none;
  }
}
@media (max-width:620px){
  .mb-custom-header__inner{
    grid-template-columns:auto 1fr;
  }
  .mb-custom-header__claim{
    text-align:right;
    font-size:12px;
  }
  .mb-header-actions{
    grid-column:1 / -1;
    justify-self:center;
    margin-top:2px;
  }
}


/* MB COLLECTION OVERFLOW FIX v1.0 */
.mb-topic-hero{width:100%!important;margin-left:0!important;margin-right:0!important;box-sizing:border-box!important}
/* MB COLLECTION OVERFLOW FIX END v1.0 */
