/*
Theme Name: Light Bite Shop
Theme URI: https://light-bite.de/
Author: LIGHT BITE
Description: Eigenes WooCommerce-Theme im Look der LIGHT-BITE-Landingpage.
Version: 1.0.0
Text Domain: light-bite-shop
*/

:root {
  --lb-berry: #94184e;
  --lb-hot: #e73779;
  --lb-rose: #f8b6d0;
  --lb-blush: #fff0f5;
  --lb-cream: #fffaf5;
  --lb-ink: #452039;
  --lb-soft: #f5eadf;
  --lb-line: rgba(148, 24, 78, .16);
  --lb-shadow: 0 24px 65px rgba(148, 24, 78, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--lb-cream); color: var(--lb-ink); font-family: Arial, Helvetica, sans-serif; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--lb-hot); outline-offset: 3px; }

.lb-announcement { background: var(--lb-berry); color: #fff; padding: 10px 5%; text-align: center; text-transform: uppercase; letter-spacing: 1.5px; font-size: 10px; }
.lb-header { position: sticky; top: 0; z-index: 30; height: 104px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 6%; background: rgba(255,250,245,.96); border-bottom: 1px solid var(--lb-line); backdrop-filter: blur(12px); }
.admin-bar .lb-header { top: 32px; }
.lb-logo { display: inline-flex; align-items: center; width: 180px; }
.lb-logo img { display: block; width: 180px; max-height: 86px; object-fit: contain; }
.lb-nav { display: flex; align-items: center; justify-content: center; gap: 30px; font-size: 12px; }
.lb-nav a:hover { color: var(--lb-hot); }
.lb-actions { justify-self: end; display: flex; align-items: center; gap: 11px; }
.lb-pill { display: inline-flex; align-items: center; gap: 8px; border: 1px solid rgba(148,24,78,.28); border-radius: 999px; padding: 12px 17px; color: var(--lb-berry); font-size: 11px; }
.lb-pill--filled { background: var(--lb-berry); border-color: var(--lb-berry); color: #fff; }
.lb-pill:hover { background: var(--lb-hot); border-color: var(--lb-hot); color: #fff; }
.lb-cart-count { display: grid; place-items: center; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px; background: #fff; color: var(--lb-berry); font-size: 9px; }
.lb-menu-toggle { display: none; border: 0; background: transparent; color: var(--lb-berry); font-size: 22px; }

.lb-container { width: min(1180px, 86%); margin-inline: auto; }
.lb-section { padding: 92px 0; }
.lb-kicker { display: block; margin-bottom: 20px; color: var(--lb-berry); font-size: 10px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; }
h1, h2, .woocommerce div.product .product_title { margin-top: 0; font-family: Georgia, serif; font-weight: 400; letter-spacing: -2.3px; line-height: 1.04; }
h1 { font-size: clamp(48px, 5.4vw, 78px); }
h2 { font-size: clamp(39px, 4.2vw, 61px); }
.lb-accent { color: var(--lb-hot); font-style: italic; }
.lb-button, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit { display: inline-flex; justify-content: center; align-items: center; min-height: 50px; padding: 14px 22px !important; border: 0 !important; border-radius: 7px !important; background: var(--lb-berry) !important; color: #fff !important; font-size: 12px !important; font-weight: 700 !important; box-shadow: 0 12px 25px rgba(148,24,78,.16); transition: .2s ease; }
.lb-button:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover, .woocommerce #respond input#submit:hover { transform: translateY(-2px); background: var(--lb-hot) !important; color: #fff !important; }

.lb-shop-hero { background: var(--lb-blush); padding: 80px 0 74px; overflow: hidden; }
.lb-shop-hero__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 8%; align-items: center; }
.lb-shop-hero p { max-width: 570px; font-size: 16px; line-height: 1.8; opacity: .82; }
.lb-shop-hero__visual { min-height: 460px; display: grid; place-items: center; position: relative; }
.lb-orbit { position: absolute; width: min(460px, 94%); aspect-ratio: 1; border-radius: 50%; background: var(--lb-rose); opacity: .62; }
.lb-shop-hero__visual img { position: relative; z-index: 1; width: min(430px, 92%); filter: drop-shadow(0 25px 35px rgba(69,32,57,.18)); }
.lb-benefits { display: flex; flex-wrap: wrap; gap: 18px 28px; margin: 30px 0; color: var(--lb-berry); font-size: 11px; }
.lb-benefits span::before { content: '✓'; margin-right: 7px; color: var(--lb-hot); font-weight: 700; }

.lb-shop-intro { display: grid; grid-template-columns: .72fr 1.28fr; gap: 8%; align-items: end; margin-bottom: 46px; }
.lb-shop-intro p { max-width: 590px; margin: 0; font-size: 14px; line-height: 1.8; opacity: .75; }
.lb-category-row { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 30px; }
.lb-category-row a { padding: 10px 15px; border: 1px solid var(--lb-line); border-radius: 999px; background: #fff; color: var(--lb-berry); font-size: 10px; }
.lb-category-row a:first-child, .lb-category-row a:hover { background: var(--lb-berry); color: #fff; }

.woocommerce ul.products { display: grid !important; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 24px !important; margin: 0 !important; }
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none !important; }
.woocommerce ul.products li.product { float: none !important; width: auto !important; margin: 0 !important; padding: 0 0 25px !important; border: 1px solid var(--lb-line); border-radius: 17px; background: #fff; overflow: hidden; box-shadow: 0 10px 36px rgba(148,24,78,.06); transition: .22s ease; }
.woocommerce ul.products li.product:hover { transform: translateY(-5px); box-shadow: var(--lb-shadow); }
.woocommerce ul.products li.product a img { width: 100%; aspect-ratio: 1/1.05; margin: 0 0 23px !important; object-fit: cover; background: var(--lb-blush); }
.woocommerce ul.products li.product .woocommerce-loop-product__title { padding: 0 22px !important; color: var(--lb-ink); font: 400 26px/1.13 Georgia, serif !important; }
.woocommerce ul.products li.product .price { padding: 0 22px; color: var(--lb-berry) !important; font-size: 17px !important; }
.woocommerce ul.products li.product .button { margin: 7px 22px 0 !important; }
.woocommerce span.onsale { min-width: auto; min-height: auto; padding: 8px 12px; border-radius: 999px; background: var(--lb-hot); line-height: 1; }

.lb-woocommerce { padding: 70px 0 100px; }
.lb-woocommerce .woocommerce-breadcrumb { margin-bottom: 38px; color: var(--lb-berry); font-size: 10px; }
.woocommerce div.product { display: flow-root; }
.woocommerce div.product div.images img { border-radius: 18px; background: var(--lb-blush); }
.woocommerce div.product .product_title { font-size: clamp(39px,4.2vw,60px); }
.woocommerce div.product p.price, .woocommerce div.product span.price { color: var(--lb-berry) !important; font: 400 30px Georgia, serif; }
.woocommerce div.product .woocommerce-product-details__short-description { font-size: 14px; line-height: 1.8; opacity: .78; }
.woocommerce .quantity .qty { min-height: 50px; border: 1px solid var(--lb-line); border-radius: 7px; }
.woocommerce div.product .woocommerce-tabs { padding-top: 55px; }
.woocommerce div.product .woocommerce-tabs ul.tabs { padding: 0 !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { border-color: var(--lb-line) !important; background: var(--lb-soft) !important; }
.woocommerce div.product .woocommerce-tabs .panel { font-size: 13px; line-height: 1.78; }
.woocommerce-message, .woocommerce-info { border-top-color: var(--lb-hot) !important; background: var(--lb-blush); }
.woocommerce-message::before, .woocommerce-info::before { color: var(--lb-hot) !important; }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form .form-row select { padding: 13px; border: 1px solid rgba(148,24,78,.25); border-radius: 7px; background: #fff; }
.woocommerce-checkout #payment { background: var(--lb-soft) !important; }
.woocommerce table.shop_table { border-color: var(--lb-line); border-radius: 12px; background: #fff; }

.lb-promise { background: var(--lb-rose); padding: 72px 0; }
.lb-promise__grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: 8%; align-items: center; }
.lb-promise img { width: min(330px, 88%); margin: auto; }
.lb-promise p { max-width: 650px; line-height: 1.8; opacity: .78; }

.lb-footer { padding: 58px 0 28px; background: #3f1831; color: #fff; text-align: center; }
.lb-footer img { width: 225px; max-height: 145px; object-fit: contain; }
.lb-footer__tagline { margin: 16px 0 28px; font-size: 10px; letter-spacing: 1.6px; text-transform: uppercase; }
.lb-footer nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 23px; font-size: 11px; }
.lb-footer nav a:hover { color: #ffb8d2; }
.lb-footer small { display: block; margin-top: 32px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.12); opacity: .58; font-size: 9px; }

@media (max-width: 900px) {
  .lb-header { grid-template-columns: 1fr auto; height: 80px; padding-inline: 5%; }
  .admin-bar .lb-header { top: 46px; }
  .lb-logo, .lb-logo img { width: 130px; max-height: 68px; }
  .lb-nav { display: none; position: absolute; top: 80px; inset-inline: 0; padding: 22px; background: var(--lb-cream); border-bottom: 1px solid var(--lb-line); flex-direction: column; }
  .lb-nav.is-open { display: flex; }
  .lb-menu-toggle { display: inline-block; }
  .lb-actions .lb-pill:not(.lb-pill--filled) { display: none; }
  .lb-shop-hero__grid, .lb-shop-intro, .lb-promise__grid { grid-template-columns: 1fr; }
  .lb-shop-hero { padding-top: 55px; }
  .lb-shop-hero__visual { min-height: 370px; margin-top: 20px; }
  .woocommerce ul.products { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 560px) {
  .lb-container { width: min(90%, 680px); }
  .lb-section, .lb-woocommerce { padding: 62px 0; }
  .lb-actions .lb-pill--filled { padding: 10px 13px; }
  .woocommerce ul.products { grid-template-columns: 1fr; }
  .woocommerce div.product div.images, .woocommerce div.product div.summary { float: none !important; width: 100% !important; }
}