/* ===== DDWEDM brand theme for public pages ===== */
:root { --ddw-red:#d2141e; --ddw-red-dark:#a80f17; --ddw-ink:#1a1a1a; }

body { background:#f2f2f2; border-top:4px solid var(--ddw-red); }
.wrap { border-radius:6px; overflow:hidden; box-shadow:0 6px 24px rgba(0,0,0,.08); border:0; }

/* Dark header band carrying the DDW display logo */
.header {
  margin:-40px -40px 30px; padding:22px 40px; background:var(--ddw-ink);
  border-bottom:3px solid var(--ddw-red);
}
.header .logo a { display:inline-flex; align-items:center; text-decoration:none; }
.header .logo img { display:none; }
.header .logo a::before {
  content:""; display:block; width:170px; height:45px;
  background:url("https://www.ddw.net/wp-content/uploads/2026/05/zbd-01.png") left center / contain no-repeat;
}
.header .logo a::after {
  content:"EDM"; margin-left:10px; padding:3px 8px; border-radius:3px;
  background:var(--ddw-red); color:#fff; font-weight:800; font-style:italic; font-size:14px; letter-spacing:.5px;
}

/* Brand colour */
a { color:var(--ddw-red); text-decoration-color:rgba(210,20,30,.35); }
a:hover { color:var(--ddw-red-dark); }
h1, h2, h3, h4 { color:var(--ddw-ink); }
input:focus, select:focus { border-color:var(--ddw-red); box-shadow:0 0 0 3px rgba(210,20,30,.12); outline:none; }
input[type=checkbox], input[type=radio] { accent-color:var(--ddw-red); }
.button { background:var(--ddw-red); border-radius:4px; font-weight:600; }
.button:hover { background:var(--ddw-red-dark); }
.button.button-outline { background:#fff; border-color:var(--ddw-red); color:var(--ddw-red); }
.button.button-outline:hover { background:var(--ddw-red); color:#fff; }
.login button { background:var(--ddw-red); }
.login button:hover { background:var(--ddw-red-dark); }
.pg-page.pg-selected { color:var(--ddw-red); border-color:var(--ddw-red); }
::selection { background:rgba(210,20,30,.2); }

/* Footer: replace "powered by listmonk" */
footer.container { font-size:0; }
footer.container a { display:none; }
footer.container::after { content:"© DDW display · DDWEDM"; font-size:13px; color:#999; }

@media screen and (max-width:650px){
  .header { margin:-30px -30px 20px; padding:18px 30px; }
  .header .logo a::before { width:140px; height:37px; }
}