/* Bayern Krimi Dinner – Metall-Oberflaechen
   Bronze im Ruhezustand, Rauten-Blau beim Darueberfahren.
   Beide Platten stammen aus dem Wappenloewen. */

.btn:not(.btn-ghost),
a.cta,
form button,
button[type="submit"]{
  position:relative;
  isolation:isolate;
  background-color:#4e473c !important;
  background-image:
    linear-gradient(104deg,rgba(233,220,196,0) 14%,rgba(233,220,196,.20) 33%,rgba(233,220,196,.07) 44%,rgba(233,220,196,0) 60%),
    linear-gradient(180deg,rgba(233,220,196,.07) 0%,rgba(32,28,21,0) 36%,rgba(32,28,21,.20) 100%),
    url("/bkd-assets/img/metall-gen.jpg") !important;
  background-size:auto,auto,100% 100% !important;
  background-repeat:no-repeat,no-repeat,no-repeat !important;
  color:#f7f3ea !important;
  border:1px solid rgba(32,28,21,.45);
  text-shadow:0 1px 2px rgba(16,12,6,.6);
  box-shadow:inset 0 1px 0 rgba(233,220,196,.5),0 3px 9px -4px rgba(20,15,8,.45);
  transition:box-shadow .2s ease,transform .2s ease;
}

.btn:not(.btn-ghost)::after,
a.cta::after,
form button::after,
button[type="submit"]::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  background-color:#2f4959;
  background-image:
    linear-gradient(104deg,rgba(233,220,196,0) 30%,rgba(233,220,196,.22) 50%,rgba(233,220,196,.07) 62%,rgba(233,220,196,0) 78%),
    linear-gradient(180deg,rgba(233,220,196,.07) 0%,rgba(32,28,21,0) 36%,rgba(32,28,21,.20) 100%),
    url("/bkd-assets/img/metall-blau.jpg");
  background-size:auto,auto,100% 100%;
  background-repeat:no-repeat,no-repeat,no-repeat;
  opacity:0;
  transition:opacity .38s ease;
}

.btn:not(.btn-ghost):hover::after,
a.cta:hover::after,
form button:hover::after,
button[type="submit"]:hover::after{opacity:1}

.btn:not(.btn-ghost):hover,
a.cta:hover,
form button:hover,
button[type="submit"]:hover{
  border-color:rgba(20,34,45,.5);
  text-shadow:0 1px 2px rgba(10,20,28,.65);
  box-shadow:inset 0 1px 0 rgba(233,220,196,.55),0 6px 16px -6px rgba(16,26,34,.5);
}

/* Termin-Karten "auf Tour": ebenfalls Metall, Blau beim Darueberfahren */
#tournee .pcard{
  position:relative;
  isolation:isolate;
  background-color:#4e473c !important;
  background-image:
    linear-gradient(104deg,rgba(233,220,196,0) 16%,rgba(233,220,196,.14) 34%,rgba(233,220,196,.05) 46%,rgba(233,220,196,0) 62%),
    linear-gradient(180deg,rgba(233,220,196,.06) 0%,rgba(32,28,21,0) 38%,rgba(32,28,21,.22) 100%),
    url("/bkd-assets/img/metall-gen.jpg") !important;
  background-size:auto,auto,100% 100% !important;
  background-repeat:no-repeat,no-repeat,no-repeat !important;
  border-color:rgba(32,28,21,.5) !important;
  box-shadow:inset 0 1px 0 rgba(233,220,196,.35),0 14px 34px -22px rgba(10,8,4,.7);
}

#tournee .pcard::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  background-color:#2f4959;
  background-image:
    linear-gradient(104deg,rgba(233,220,196,0) 30%,rgba(233,220,196,.16) 50%,rgba(233,220,196,.05) 62%,rgba(233,220,196,0) 78%),
    linear-gradient(180deg,rgba(233,220,196,.06) 0%,rgba(32,28,21,0) 38%,rgba(32,28,21,.22) 100%),
    url("/bkd-assets/img/metall-blau.jpg");
  background-size:auto,auto,100% 100%;
  background-repeat:no-repeat,no-repeat,no-repeat;
  opacity:0;
  transition:opacity .4s ease;
}

#tournee .pcard:hover::after{opacity:1}
#tournee .pcard:hover{border-color:rgba(20,34,45,.55) !important}

/* Auf Metall braucht die Schrift mehr Gewicht und Helligkeit */
#tournee .pcard .st{
  font-size:23px !important;
  font-weight:700 !important;
  color:#fbf8f1 !important;
  line-height:1.2;
  text-shadow:0 1px 2px rgba(12,10,6,.5);
}
#tournee .pcard .mt{
  font-size:15.5px !important;
  color:#ded7c9 !important;
  margin-top:5px;
  text-shadow:0 1px 2px rgba(12,10,6,.45);
}
#tournee .pcard .av{
  font-size:12.5px !important;
  font-weight:700 !important;
  color:#cdc4b2 !important;
  margin-top:8px;
}
#tournee .pcard .dw{font-size:12px !important;font-weight:700 !important;color:#e2d9c4 !important}
#tournee .pcard .dd{font-size:36px !important;font-weight:700 !important;color:#fbf8f1 !important;
  text-shadow:0 1px 3px rgba(12,10,6,.55)}
#tournee .pcard .dm{font-size:12px !important;font-weight:700 !important;color:#ded7c9 !important}
#tournee .pcard .date{border-right-color:rgba(233,220,196,.32) !important}

/* Schlagzeile zum Stück (Untertitel aus dem Ticketshop) */
.pcard .sub{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-style:italic;
  font-size:18px;
  line-height:1.35;
  color:#5c554b;
  margin-top:3px;
}
#tournee .pcard .sub{
  color:#e7dfcc;
  font-size:19px;
  text-shadow:0 1px 2px rgba(12,10,6,.5);
}
#tournee .pcard.sold .sub{opacity:.55}

/* Ausverkauft: deutlich rot, als Kennfeld (auf Metall ist reine rote Schrift zu kontrastarm) */
.pcard .av.av-sold,
#tournee .pcard .av.av-sold{
  display:inline-block;
  background:#8c1f14;
  color:#ffe6e1 !important;
  font-weight:800 !important;
  font-size:12px !important;
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:4px 11px;
  border-radius:4px;
  border:1px solid rgba(255,180,168,.35);
  text-shadow:none;
  margin-top:9px;
}
#tournee .pcard.sold .st,#tournee .pcard.sold .date{opacity:.62}
.btn.is-sold{border-color:rgba(140,31,20,.55) !important;color:#e8b0a8 !important}
@media(max-width:560px){
  #tournee .pcard .st{font-size:21px !important}
  #tournee .pcard .sub{font-size:17.5px}
  #tournee .pcard .dd{font-size:32px !important}
}
