/* Kopf und Fuss in Anthrazit wie priamond.de. NOVA laedt sein CSS spaeter nach, deshalb !important. */
#jtl-nav-wrapper{background:#323232!important;box-shadow:none!important;border:0!important}
#jtl-nav-wrapper,#jtl-nav-wrapper>.container-fluid{display:flow-root;height:auto!important;min-height:0}
#main-wrapper{clear:both}
#jtl-nav-wrapper a,#jtl-nav-wrapper button,#jtl-nav-wrapper .nav-link,#jtl-nav-wrapper i,#jtl-nav-wrapper .fa,#jtl-nav-wrapper .fas,#jtl-nav-wrapper .far{color:#fff!important}
#jtl-nav-wrapper .dropdown-menu,#jtl-nav-wrapper .dropdown-menu a,#jtl-nav-wrapper .dropdown-menu button,#jtl-nav-wrapper .dropdown-menu i{color:#353333!important}
#jtl-nav-wrapper .dropdown-menu a.btn-primary,#jtl-nav-wrapper .dropdown-menu button.btn-primary{color:#fff!important}
#jtl-nav-wrapper .navbar-toggler-icon,#jtl-nav-wrapper .navbar-toggler-icon::before,#jtl-nav-wrapper .navbar-toggler-icon::after{border-color:#fff!important;background-color:#fff!important;color:#fff!important}
#jtl-nav-wrapper .navbar-brand{display:flex;align-items:center;padding:20px 0!important;margin:0 8px!important}
#jtl-nav-wrapper #shop-logo{display:block;width:min(54vw,300px);height:auto!important;max-height:none!important;max-width:none!important}
/* Tablet und Desktop: keine weisse Leiste ueber dem Kopf, helle Suche mittig. */
.topbar-wrapper{display:none!important}
@media (min-width:992px){
  #jtl-nav-wrapper .navbar-brand{margin-left:72px!important}
  /* Menue als schmale zweite Zeile, damit es Logo und Suche nicht bedraengt. */
  #jtl-nav-wrapper>.container-fluid{padding-top:8px;padding-bottom:34px}
  #jtl-nav-wrapper #mainNavigation{position:absolute!important;left:0;right:0;bottom:0;display:flex!important;height:42px!important;justify-content:center}
  #jtl-nav-wrapper #mainNavigation .nav-mobile-body{width:auto}
  #jtl-nav-wrapper #mainNavigation .navbar-nav{display:flex;flex-direction:row;gap:12px;height:41px;align-items:center;overflow:visible}
  #jtl-nav-wrapper #mainNavigation .nav-item{height:auto}
  #jtl-nav-wrapper #mainNavigation .nav-link{padding:8px 14px!important;font-size:15px;font-weight:600;line-height:1.2}
  #jtl-nav-wrapper .nav-link::before{border-color:#FF0000!important}
  /* Die Kategorien liegen unter einem Eintrag, sonst sprengen sie die Zeile. */
  #jtl-nav-wrapper #mainNavigation,#jtl-nav-wrapper #mainNavigation .nav-mobile-body,#jtl-nav-wrapper #mainNavigation .nav-scrollbar,#jtl-nav-wrapper #mainNavigation .nav-scrollbar-inner{overflow:visible!important}
  .pa-produkte{position:relative}
  .pa-produkte-knopf{border:0;background:none;cursor:pointer}
  .pa-produkte-knopf::after{content:'';display:inline-block;width:7px;height:7px;margin:0 2px 3px 8px;border-right:2px solid;border-bottom:2px solid;transform:rotate(45deg)}
  .pa-produkte-liste{display:none;position:absolute;top:100%;left:50%;z-index:1040;width:340px;margin:0;padding:10px;list-style:none;transform:translateX(-50%);background:#323232;border-radius:0 0 14px 14px;box-shadow:0 12px 28px rgba(0,0,0,.3)}
  .pa-produkte:hover .pa-produkte-liste,.pa-produkte:focus-within .pa-produkte-liste{display:block}
  #jtl-nav-wrapper #mainNavigation .pa-produkte-liste>li{display:block;width:100%}
  #jtl-nav-wrapper #mainNavigation .pa-produkte-liste .nav-link{display:block;padding:9px 12px!important;border-radius:8px;white-space:normal}
  #jtl-nav-wrapper #mainNavigation .pa-produkte-liste .nav-link:hover{background:rgba(255,255,255,.12)}
  #jtl-nav-wrapper #mainNavigation .pa-produkte-liste .nav-link::before,#jtl-nav-wrapper #mainNavigation .pa-produkte-liste .nav-link::after{display:none!important}
  #jtl-nav-wrapper #mainNavigation .pa-produkte-liste .dropdown-menu{display:none!important}
  /* Alle Symbole gleich gross und auf einer Linie. */
  #jtl-nav-wrapper #shop-nav{align-items:center!important}
  #jtl-nav-wrapper #shop-nav>li:not(.search){display:flex!important;align-items:center!important}
  #jtl-nav-wrapper #shop-nav>li:not(.search)>a{display:flex!important;align-items:center!important;gap:8px;padding:8px 12px!important}
  #jtl-nav-wrapper #shop-nav>li:not(.search)>a i,#jtl-nav-wrapper #shop-nav>li:not(.search)>a .fas,#jtl-nav-wrapper #shop-nav>li:not(.search)>a .far,#jtl-nav-wrapper #shop-nav>li:not(.search)>a .fa{font-size:24px!important;line-height:1!important;margin:0!important}
  #jtl-nav-wrapper .cart-icon-dropdown-price{font-size:17px!important}
  #jtl-nav-wrapper .search-wrapper{position:absolute!important;top:53px!important;left:50vw!important;right:auto!important;transform:translate(-50%,-50%)!important;width:min(32vw,460px)!important;min-width:0!important;max-width:none!important;margin:0!important;float:none!important}
  @media (max-width:1279.98px){#jtl-nav-wrapper #shop-logo{width:230px}#jtl-nav-wrapper .search-wrapper{left:44vw!important;width:220px!important}}
  #jtl-nav-wrapper .search-wrapper form,#jtl-nav-wrapper .search-wrapper .form-icon,#jtl-nav-wrapper .search-wrapper .input-group{display:flex;width:100%!important;max-width:none!important}
  /* Das Vorschlags-Skript von NOVA packt das Feld nach dem Laden in .twitter-typeahead. */
  #jtl-nav-wrapper .search-wrapper .input-group{flex-wrap:nowrap!important}
  #jtl-nav-wrapper .search-wrapper .twitter-typeahead{display:flex!important;flex:1 1 auto!important;width:auto!important;min-width:0!important}
  #jtl-nav-wrapper .search-wrapper .form-control{flex:1 1 auto;width:100%!important;background:#fff!important;border:0!important;border-radius:22px 0 0 22px!important;color:#353333!important;box-shadow:none!important}
  #jtl-nav-wrapper .search-wrapper .btn{background:#fff!important;border:0!important;border-radius:0 22px 22px 0!important;box-shadow:none!important}
  #jtl-nav-wrapper .search-wrapper .btn,#jtl-nav-wrapper .search-wrapper .btn i{color:#353333!important}
}
/* Das Handy-Menue liegt im Kopf, ist aber weiss. */
@media (max-width:991.98px){
  /* Menue und Konto links, Warenkorb rechts, Logo in der Mitte. In der Kasse gibt es kein Menue, dort bleibt das Logo links. Sprache gibt es nur eine. */
  #jtl-nav-wrapper:has(#burger-menu) .toggler-logo-wrapper,#jtl-nav-wrapper:has(#burger-menu) #logo{position:static!important}
  #jtl-nav-wrapper:has(#burger-menu) .navbar-brand{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);margin:0!important;padding:0!important}
  #jtl-nav-wrapper:has(#burger-menu) #shop-logo{width:min(47vw,300px)}
  #jtl-nav-wrapper:has(#burger-menu) .account-icon-dropdown{position:absolute;top:50%;left:58px;transform:translateY(-50%);z-index:2}
  #jtl-nav-wrapper:has(#burger-menu) .cart-icon-dropdown{margin-right:22px}
  /* Das Konto-Fenster richtet sich nach dem Symbol links und laeuft sonst aus dem Bild. */
  #jtl-nav-wrapper:has(#burger-menu) .account-icon-dropdown .dropdown-menu{position:absolute!important;top:calc(100% + 8px)!important;left:-46px!important;right:auto!important;width:calc(100vw - 24px)!important;max-width:420px;min-width:0!important;transform:none!important}
  #jtl-nav-wrapper:has(#burger-menu)>.container-fluid{padding-top:14px;padding-bottom:14px}
  #jtl-nav-wrapper .language-dropdown{display:none!important}
  #jtl-nav-wrapper #mainNavigation,#jtl-nav-wrapper #mainNavigation .nav-mobile-header,#jtl-nav-wrapper #mainNavigation .nav-mobile-body{background:#fff!important}
  #jtl-nav-wrapper #mainNavigation a,#jtl-nav-wrapper #mainNavigation button,#jtl-nav-wrapper #mainNavigation span,#jtl-nav-wrapper #mainNavigation i,#jtl-nav-wrapper #mainNavigation .nav-link,#jtl-nav-wrapper #mainNavigation .fa,#jtl-nav-wrapper #mainNavigation .fas,#jtl-nav-wrapper #mainNavigation .far{color:#353333!important}
  #jtl-nav-wrapper #mainNavigation .navbar-toggler-icon,#jtl-nav-wrapper #mainNavigation .navbar-toggler-icon::before,#jtl-nav-wrapper #mainNavigation .navbar-toggler-icon::after{border-color:#353333!important;background-color:#353333!important}
  #jtl-nav-wrapper #mainNavigation .badge{color:#fff!important}
}
#footer{margin-top:0!important;padding:0!important;border-top:3px solid #FF0000;background:#323232!important;color:#CCCCCC!important}
#footer a,#footer a:not(.btn),#footer a:not(.btn):visited{color:#fff!important}
#footer .container{max-width:1120px}
.pa-fuss{padding:36px 0 20px}
.pa-fuss nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 28px}
.pa-fuss nav a{font-size:15px;font-weight:500;line-height:32px;text-decoration:none!important}
@media (hover:hover){#footer .pa-fuss nav a:not(.btn):hover{color:#FF0000!important}}
@media (hover:none){#footer .pa-fuss nav a:not(.btn):hover{color:#fff!important}}
#footer .small,#footer .footnote-vat{color:#BEBEBE!important}
#copyright,#footer .copyright,#footer .footer-copyright{background:#2A2A2A!important;color:#BEBEBE!important}
/* Kontakt: Handy per WhatsApp, Desktop per Formular, weil WhatsApp Web dort eine Anmeldung verlangt. Im Auftrag stoert der Knopf. */
.pa-whatsapp,.pa-kontakt{position:fixed;right:20px;bottom:88px;z-index:1030;display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;box-shadow:0 4px 14px rgba(0,0,0,.28)}
.pa-whatsapp{background:#25D366}
.pa-modus{border:0;background:none;color:inherit;cursor:pointer;font:inherit}
.pa-modus-eintrag{display:none!important}
@media (min-width:992px){.pa-modus-eintrag{display:flex!important}#jtl-nav-wrapper .pa-modus-eintrag .pa-modus{display:flex;align-items:center;padding:8px 12px!important}#jtl-nav-wrapper .pa-modus-eintrag .pa-modus .fas{font-size:24px!important;line-height:1}#jtl-nav-wrapper .navbar-brand{position:relative;top:8px}}
@media (max-width:991.98px){.pa-produkte,.pa-produkte-liste{display:contents}.pa-produkte-knopf{display:none!important}}
.pa-anruf{position:fixed;right:20px;bottom:150px;z-index:1030;display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background:#323232;box-shadow:0 4px 14px rgba(0,0,0,.25);font-size:20px}
#footer a.pa-anruf:not(.btn){color:#fff!important}
@media (hover:hover){.pa-anruf{display:none}}
body:has(#priamondApp) .pa-anruf{bottom:82px}
body:has(#auftrag:not([hidden])) .pa-anruf,html.pa-bauen .pa-anruf{display:none}
.pa-telefon{display:none!important}
.pa-telefon-nummer{display:none;font-size:16px;font-weight:600;white-space:nowrap}
@media (min-width:992px){.pa-telefon{display:flex!important}}
@media (min-width:1280px){.pa-telefon-nummer{display:inline}}
.pa-kontakt{display:none;background:#323232}
#footer a.pa-whatsapp:not(.btn),#footer a.pa-kontakt:not(.btn){color:#fff!important}
@media (hover:hover){.pa-whatsapp{display:none}.pa-kontakt{display:flex}}
body:has(#priamondApp) .pa-whatsapp,body:has(#priamondApp) .pa-kontakt{bottom:20px}
body:has(#auftrag:not([hidden])) .pa-whatsapp,body:has(#auftrag:not([hidden])) .pa-kontakt{display:none}
/* Dunkle Geraeteeinstellung: Inhalte der Kopf-Fenster. Der Rest steht in dunkel.css. */
html.pa-dunkel #jtl-nav-wrapper .dropdown-menu,html.pa-dunkel #jtl-nav-wrapper .dropdown-menu a,html.pa-dunkel #jtl-nav-wrapper .dropdown-menu button,html.pa-dunkel #jtl-nav-wrapper .dropdown-menu i{color:#E6E6E6!important}
html.pa-dunkel #jtl-nav-wrapper .dropdown-menu{background:#262626!important}
html.pa-dunkel .alert{background:#262626!important;color:#E6E6E6!important}

@media (max-width:991.98px){
html.pa-dunkel #jtl-nav-wrapper #mainNavigation,html.pa-dunkel #jtl-nav-wrapper #mainNavigation .nav-mobile-header,html.pa-dunkel #jtl-nav-wrapper #mainNavigation .nav-mobile-body{background:#1E1E1E!important}
html.pa-dunkel #jtl-nav-wrapper #mainNavigation a,html.pa-dunkel #jtl-nav-wrapper #mainNavigation button,html.pa-dunkel #jtl-nav-wrapper #mainNavigation span,html.pa-dunkel #jtl-nav-wrapper #mainNavigation i,html.pa-dunkel #jtl-nav-wrapper #mainNavigation .nav-link,html.pa-dunkel #jtl-nav-wrapper #mainNavigation .fa,html.pa-dunkel #jtl-nav-wrapper #mainNavigation .fas,html.pa-dunkel #jtl-nav-wrapper #mainNavigation .far{color:#E6E6E6!important}
html.pa-dunkel #jtl-nav-wrapper #mainNavigation .navbar-toggler-icon,html.pa-dunkel #jtl-nav-wrapper #mainNavigation .navbar-toggler-icon::before,html.pa-dunkel #jtl-nav-wrapper #mainNavigation .navbar-toggler-icon::after{border-color:#E6E6E6!important;background-color:#E6E6E6!important}
}

/* Dunkel: Kaesten und Formulare, die NOVA hell setzt oder per Skript nachzieht. */
html.pa-dunkel .card,html.pa-dunkel .card-gray,html.pa-dunkel .card-body,html.pa-dunkel .card-header,html.pa-dunkel .card-footer,html.pa-dunkel .list-group-item,html.pa-dunkel .modal-content,html.pa-dunkel .bg-white,html.pa-dunkel .bg-light,html.pa-dunkel .cart-summary .card{background-color:#262626!important;color:#E6E6E6!important}
html.pa-dunkel .stepper,html.pa-dunkel .stepper .step,html.pa-dunkel .step-content,html.pa-dunkel .smoothscroll-top,html.pa-dunkel .dropdown-footer,html.pa-dunkel .dropdown-body,html.pa-dunkel .dropdown-menu>*{background-color:#262626!important;color:#E6E6E6!important}
html.pa-dunkel .step-text,html.pa-dunkel .stepper a{color:#E6E6E6!important}
html.pa-dunkel .card *,html.pa-dunkel .modal-content *{color:inherit}
html.pa-dunkel #main-wrapper a:not(.btn),html.pa-dunkel #main-wrapper .btn-link{color:#E6E6E6!important}
html.pa-dunkel .required-star{color:#FF8A8A!important}
html.pa-dunkel .card .btn-primary{color:#fff!important}
html.pa-dunkel #main-wrapper .form-control,html.pa-dunkel #main-wrapper select,html.pa-dunkel #main-wrapper textarea{background-color:#2C2C2C!important;border-color:#555!important;color:#E6E6E6!important}
html.pa-dunkel #main-wrapper .form-control::placeholder{color:#A8A8A8!important}
html.pa-dunkel .label-slide .form-group label,html.pa-dunkel .label-slide .form-group label::after,html.pa-dunkel .label-slide .form-group label::before{background:transparent!important;color:#CFCFCF!important}
html.pa-dunkel #jtl-nav-wrapper .search-wrapper .form-control{background:#fff!important;color:#353333!important}
html.pa-dunkel #jtl-nav-wrapper .search-wrapper .form-control::placeholder{color:#6B6B6B!important}
html.pa-dunkel .text-muted,html.pa-dunkel .small,html.pa-dunkel small{color:#BEBEBE!important}
html.pa-dunkel hr,html.pa-dunkel .table td,html.pa-dunkel .table th{border-color:#444!important}
html.pa-dunkel .table{color:#E6E6E6!important}
/* Kasse: Angaben nutzen auf dem Handy die volle Zeile, Beschriftung links, Wert rechts. */
@media (max-width:991.98px){
  .pa-fuss nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));justify-content:stretch;width:100%;gap:4px 16px}
  .pa-fuss nav a{line-height:40px}
  .checkout-items-item .checkout-items-item-vat,.checkout-items-item .checkout-items-item-price-single,.checkout-items-item .checkout-items-item-quantity,.checkout-items-item .price-col{flex:0 0 100%!important;max-width:100%!important;margin-left:0!important;display:flex;justify-content:space-between}
  .checkout-items-item .price-col{justify-content:flex-end}
  .checkout-items-item .checkout-items-item-main{flex:1 1 0!important;max-width:none!important;margin-left:0!important}
}
