/*
 * Kibble Kingdom — Modern Skin v1.0
 * Geladen vom Kibble Webshop Connector (kk-modern.css).
 * Reines CSS-Reskin: keine Funktions- oder Strukturaenderungen.
 * Designsprache: "Schmiede-Glas" — dunkle Glasflaechen mit Gold-Hairline
 * und Glut-Schimmer, passend zu Wappen, Fraktur und Vulkaninsel-Artwork.
 */

:root{
  --kk-gold:#F4C464;
  --kk-gold-2:#CA9E67;
  --kk-ember:#FF9D45;
  --kk-ink:#1A1208;
  --kk-text:#F6EEDD;
  --kk-text-dim:#D8CCB4;
  --kk-glass:rgba(14,9,5,0.80);
  --kk-glass-soft:rgba(14,9,5,0.62);
  --kk-line:rgba(244,196,100,0.25);
  --kk-line-strong:rgba(244,196,100,0.55);
  --kk-radius:16px;
  --kk-radius-s:10px;
  --kk-shadow:0 14px 40px rgba(0,0,0,0.45);
  --kk-glow:0 18px 44px -16px rgba(255,157,69,0.40);
  --kk-ui-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

/* ============ 1) Grundpolitur ============ */
html{scroll-behavior:smooth;}
::selection{background:var(--kk-gold);color:var(--kk-ink);}
:focus-visible{outline:2px solid var(--kk-gold)!important;outline-offset:2px;border-radius:4px;}
body::-webkit-scrollbar{width:12px;}
body::-webkit-scrollbar-track{background:#120d07;}
body::-webkit-scrollbar-thumb{background:#4a3a1e;border-radius:8px;border:3px solid #120d07;}
body::-webkit-scrollbar-thumb:hover{background:var(--kk-gold-2);}

h1.elementor-heading-title,h2.elementor-heading-title{text-wrap:balance;letter-spacing:.015em;}

/* Inhalt der ersten Sektion unter der fixen Glas-Leiste freistellen
   (Artwork laeuft weiter unter den Header, nur der Text bekommt Luft) */
[data-elementor-type="single-page"] > .e-con:first-child,
[data-elementor-type="wp-page"] > .e-con:first-child,
[data-elementor-type="single-post"] > .e-con:first-child{
  padding-top:110px!important;
}
/* Gleiche Kopffreiheit fuer klassische Seiten (Shop/Spielerbereich/Admin);
   das Theme zieht main um ~126px unter den Header -> ausgleichen */
main.site-main{padding-top:170px;}

/* ============ 2) Header: Pergament-Balken -> kompakte Glas-Leiste ============ */
.elementor-location-header .elementor-sticky--active,
.elementor-location-header .elementor-sticky__spacer,
.elementor-location-header .e-con.e-parent{
  background:var(--kk-glass)!important;
  -webkit-backdrop-filter:blur(16px) saturate(1.15);
  backdrop-filter:blur(16px) saturate(1.15);
}
.elementor-location-header .elementor-sticky--active{
  border-bottom:1px solid var(--kk-line);
  box-shadow:0 10px 34px rgba(0,0,0,0.45);
}
.elementor-location-header .e-con.e-child,
.elementor-location-header .e-con-inner{background:transparent!important;}
.elementor-location-header img{
  max-height:64px!important;width:auto!important;
  filter:drop-shadow(0 4px 10px rgba(0,0,0,.55));
  transition:transform .18s ease;
}
.elementor-location-header img:hover{transform:scale(1.05);}
/* Navigation: ruhige, moderne Links mit Gold-Unterstrich */
.elementor-location-header .elementor-nav-menu a.elementor-item{
  font-family:var(--kk-ui-font);
  color:var(--kk-text)!important;
  font-weight:600;font-size:15px;letter-spacing:.04em;text-transform:uppercase;
  padding:10px 18px!important;
  background-image:linear-gradient(90deg,var(--kk-gold),var(--kk-ember));
  background-repeat:no-repeat;background-size:0% 2px;background-position:18px calc(100% - 6px);
  transition:color .18s ease,background-size .22s ease;
}
.elementor-location-header .elementor-nav-menu a.elementor-item:hover,
.elementor-location-header .elementor-nav-menu a.elementor-item.elementor-item-active{
  color:var(--kk-gold)!important;
  background-size:calc(100% - 36px) 2px;
}
/* Mobiles Menue: dunkles Panel statt Pergament */
.elementor-location-header nav.elementor-nav-menu--dropdown,
.elementor-location-header .elementor-nav-menu--dropdown ul.elementor-nav-menu{
  background:rgba(14,9,5,0.96)!important;
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  border:1px solid var(--kk-line);border-radius:0 0 var(--kk-radius-s) var(--kk-radius-s);
}
.elementor-location-header .elementor-nav-menu--dropdown ul.elementor-nav-menu li{background:transparent!important;}
.elementor-location-header .elementor-nav-menu--dropdown a.elementor-item,
.elementor-location-header .elementor-nav-menu--dropdown a.elementor-sub-item{
  font-family:var(--kk-ui-font);
  background:transparent!important;color:var(--kk-text)!important;
  font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  border-bottom:1px solid rgba(244,196,100,.10);
}
.elementor-location-header .elementor-nav-menu--dropdown a.elementor-item:hover,
.elementor-location-header .elementor-nav-menu--dropdown a.elementor-item.elementor-item-active,
.elementor-location-header .elementor-nav-menu--dropdown a.elementor-sub-item:hover{
  background:rgba(244,196,100,.14)!important;color:var(--kk-gold)!important;
}
.elementor-location-header .elementor-menu-toggle,
.elementor-location-header .elementor-menu-toggle i,
.elementor-location-header .elementor-menu-toggle svg{
  color:var(--kk-gold)!important;fill:var(--kk-gold)!important;background:transparent!important;
}

/* ============ 3) Buttons: einheitliches Gold, Glut beim Hover ============ */
.elementor-button,
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce #respond input#submit,.woocommerce a.added_to_cart,
.woocommerce button.button.alt,.checkout-button,
body .kkwc-buy,body .kkwc-admin-b{
  background:linear-gradient(160deg,var(--kk-gold) 0%,var(--kk-gold-2) 100%)!important;
  color:var(--kk-ink)!important;
  border:none!important;border-radius:12px!important;
  font-family:var(--kk-ui-font);font-weight:700!important;letter-spacing:.02em;
  box-shadow:0 6px 18px rgba(0,0,0,.35);
  transition:transform .16s ease,box-shadow .2s ease,filter .16s ease;
}
.elementor-button:hover,
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover,
body .kkwc-buy:hover:not([disabled]),body .kkwc-admin-card:hover .kkwc-admin-b{
  transform:translateY(-2px);
  box-shadow:0 10px 26px rgba(0,0,0,.4),var(--kk-glow);
  filter:brightness(1.06);
}
.elementor-button:active,.woocommerce a.button:active,body .kkwc-buy:active{transform:translateY(0);}
body .kkwc-buy[disabled]{background:#3d362b!important;color:#98907e!important;box-shadow:none;}

/* ============ 4) Schmiede-Glas-Karten (Connector-Komponenten) ============ */
body .kkwc-card,body .kkwc-item,body .kkwc-admin-card,body .kkse-addbox,
body .woocommerce-account .woocommerce{
  background:var(--kk-glass)!important;
  -webkit-backdrop-filter:blur(14px) saturate(1.1);
  backdrop-filter:blur(14px) saturate(1.1);
  border:1px solid var(--kk-line);
  border-radius:var(--kk-radius)!important;
  box-shadow:var(--kk-shadow)!important;
  color:var(--kk-text);
}
body .kkwc-item,body .kkwc-admin-card{
  transition:transform .18s ease,border-color .18s ease,box-shadow .22s ease;
}
body .kkwc-item:hover,body .kkwc-admin-card:hover{
  transform:translateY(-4px);
  border-color:var(--kk-line-strong);
  box-shadow:var(--kk-shadow),var(--kk-glow)!important;
}
body .kkwc-card h2,body .kkse-addbox h3,body .kkwc-admin-t{color:var(--kk-gold);}
body .kkwc-card p{color:var(--kk-text-dim);font-weight:500;}
body .kkwc-item-price{color:var(--kk-gold);}
body .kkwc-sponsor{
  background:linear-gradient(135deg,rgba(138,58,202,.25),rgba(244,196,100,.16))!important;
  border:1px solid var(--kk-line-strong);border-radius:var(--kk-radius-s);
}

/* Sektionstitel im Shop lesbar auf Artwork */
body .kkwc-sec-title{
  color:var(--kk-text)!important;
  font-size:1.6em;letter-spacing:.02em;
  text-shadow:0 2px 14px rgba(0,0,0,.9),0 0 2px rgba(0,0,0,.8)!important;
}
body .kkwc-empty,body .kkwc-note{color:var(--kk-text-dim)!important;text-shadow:0 1px 8px rgba(0,0,0,.9)!important;}

/* ============ 5) WooCommerce-Produktkacheln ============ */
.woocommerce ul.products li.product,.woocommerce-page ul.products li.product{
  background:var(--kk-glass)!important;
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border:1px solid var(--kk-line);border-radius:var(--kk-radius)!important;
  box-shadow:var(--kk-shadow)!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .22s ease;
}
.woocommerce ul.products li.product:hover{
  transform:translateY(-4px);border-color:var(--kk-line-strong);
  box-shadow:var(--kk-shadow),var(--kk-glow)!important;
}
.woocommerce ul.products li.product img{
  transition:transform .2s ease;
}
.woocommerce ul.products li.product:hover img{transform:scale(1.07);}
.woocommerce ul.products li.product .price{color:var(--kk-gold)!important;font-weight:700;}
.woocommerce .woocommerce-info,.woocommerce .woocommerce-message{
  background:var(--kk-glass)!important;border:1px solid var(--kk-line);
  border-top:3px solid var(--kk-gold)!important;border-radius:var(--kk-radius-s);
  color:var(--kk-text)!important;
}

/* ============ 6) Rechte Shop-Navigation ============ */
body .kkwc-nav{
  background:var(--kk-glass)!important;
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  border:1px solid var(--kk-line);border-right:none;
  box-shadow:-6px 10px 34px rgba(0,0,0,.5);
}
body .kkwc-nav a{font-family:var(--kk-ui-font);color:var(--kk-text);}
body .kkwc-nav a:hover{background:rgba(244,196,100,.12);color:var(--kk-gold);}
body .kkwc-nav a.kkwc-cur{background:linear-gradient(160deg,var(--kk-gold),var(--kk-gold-2));color:var(--kk-ink);}
body .kkwc-nav-head{color:var(--kk-gold);}

/* ============ 7) Formulare & Editor-Oberflaechen ============ */
body .kkwc-variant,body .kkse-filter,body .kkse-tbl input[type=number],body .kkse-tbl select,
body .kkse-addbox input[type=text],body .kkse-addbox input[type=number],
body .kkse-addbox select,body .kkse-addbox textarea,body .kkse-catname,
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,
.woocommerce form .form-row select{
  background:rgba(10,7,4,.78)!important;
  border:1px solid var(--kk-line)!important;border-radius:var(--kk-radius-s)!important;
  color:var(--kk-text)!important;
  font-family:var(--kk-ui-font);
  transition:border-color .15s ease,box-shadow .15s ease;
}
body .kkwc-variant:focus,body .kkse-filter:focus,
body .kkse-addbox input:focus,body .kkse-addbox select:focus,body .kkse-addbox textarea:focus,
.woocommerce form .form-row input.input-text:focus{
  outline:none!important;border-color:var(--kk-gold)!important;
  box-shadow:0 0 0 3px rgba(244,196,100,.22)!important;
}
body .kkse-tbl{background:var(--kk-glass)!important;border:1px solid var(--kk-line);border-radius:var(--kk-radius-s);}
body .kkse-tbl th{background:rgba(244,196,100,.12)!important;color:var(--kk-gold)!important;font-family:var(--kk-ui-font);letter-spacing:.05em;text-transform:uppercase;font-size:.78em!important;}
body .kkse-picker-box{background:rgba(14,9,5,.92)!important;border:1px solid var(--kk-line-strong);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);}

/* ============ 8) Cookie-Banner im gleichen Look ============ */
.cmplz-cookiebanner{
  background:var(--kk-glass)!important;
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  border:1px solid var(--kk-line)!important;border-radius:var(--kk-radius)!important;
  box-shadow:var(--kk-shadow)!important;color:var(--kk-text)!important;
}
.cmplz-cookiebanner .cmplz-title,.cmplz-cookiebanner .cmplz-message,.cmplz-cookiebanner .cmplz-links a{color:var(--kk-text)!important;}
.cmplz-cookiebanner .cmplz-btn{border-radius:var(--kk-radius-s)!important;font-family:var(--kk-ui-font);font-weight:700;}
.cmplz-cookiebanner .cmplz-btn.cmplz-accept{background:linear-gradient(160deg,var(--kk-gold),var(--kk-gold-2))!important;color:var(--kk-ink)!important;border:none!important;}
.cmplz-cookiebanner .cmplz-btn.cmplz-deny,.cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences{background:transparent!important;color:var(--kk-text)!important;border:1px solid var(--kk-line-strong)!important;}

/* ============ 9) Footer-Feinschliff ============ */
.elementor-location-footer{border-top:1px solid var(--kk-line);}

/* ============ 10) Ruecksichten ============ */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{transition:none!important;animation:none!important;}
}
@media (max-width:600px){
  .elementor-location-header img{max-height:48px!important;}
  body .kkwc-card{border-radius:12px!important;}
}