/* Dyslexia West Midlands — theme additions on top of the site's own webflow.css */

/* Fixed header sits under the WordPress admin bar for logged-in editors. */
body.admin-bar .section.navbar { top: 32px; }
@media screen and (max-width: 782px) {
  body.admin-bar .section.navbar { top: 46px; }
}

/* webflow.css styles every <ul> as a padded vertical flex column and colours every link teal.
   The WordPress admin bar is built from lists and links, so undo both inside it only. */
#wpadminbar ul,
#wpadminbar ol {
  display: block;
  flex-flow: initial;
  gap: 0;
  margin: 0;
  padding: 0;
}
#wpadminbar a { background-color: transparent; }

/* Forms keep Webflow's own form-wrapper spacing (.w-form) now that they are wired to WordPress/Mailchimp instead. */
:where(.dwm-form) { margin: 0 0 15px; } /* zero specificity, so component classes like .contact-form-block still win, as they did over .w-form */

/* FAQ answers start collapsed; site.js animates their height open and closed. */
.w-mod-js .w-dropdown[data-hover="false"] > .w-dropdown-list:not(.w--open) { height: 0; }

/* Lottie icons render their SVG to fill the slot. */
[data-animation-type="lottie"] svg { display: block; width: 100%; height: 100%; }

/* PM Suite wraps editable values in spans; keep them layout-transparent inside Webflow components. */
.pmve-editable { display: inline; }
.w-button > .pmve-editable, .button > .pmve-editable { color: inherit; }

/* Bottom bar: copyright on the left, "Website by Pure Marketing" on the right,
   lined up with the footer content above; stacks and centres on narrow screens. */
.imprint .imprint-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 24px;
  width: 92%;
  max-width: 1400px;
  margin: 0 auto;
  text-align: left;
}
@media screen and (max-width: 479px) {
  .imprint .imprint-row { justify-content: center; text-align: center; }
}

/* "Website by Pure Marketing" credit. */
.imprint .footer-credit {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  vertical-align: top;
  text-decoration: none !important;
  border: 0 !important;
  box-shadow: none !important;
}
.imprint .footer-credit-logo {
  height: 1.15em; /* sits within the imprint's own line height */
  width: auto;
  display: block;
  filter: brightness(0) invert(1);
}

/* Location pages and Areas we cover: the services and town lists read as normal bullet lists. */
.left-panel .w-richtext ul { display: block; padding-left: 20px; }
.left-panel .w-richtext ul li { margin-bottom: 8px; }
.left-panel .divider > img { display: block; width: 100%; height: auto; margin-bottom: 24px; }

/* Pay online page */
.pay-demo-note {
  margin-bottom: 24px;
  padding: 16px 20px;
  border-radius: 8px;
  background: #fff4cc;
  border: 1px solid #f0d36b;
  font-size: 16px;
  line-height: 1.5;
}
.pay-grid { margin-top: 24px; margin-bottom: 40px; }
.pay-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  margin: 0;
}
.pay-card-title { margin-top: 0; margin-bottom: 8px; }
.pay-card-price { font-size: 32px; font-weight: 800; line-height: 1.1; margin-bottom: 12px; }
.pay-card-text { flex: 1; margin-bottom: 20px; }
.pay-card-buttons { display: flex; flex-direction: column; gap: 10px; }
.pay-card-buttons .button { margin: 0; text-align: center; }
.pay-card-buttons .pay-klarna { background-color: #ffb3c7; color: #17120f; }
.pay-card-buttons .pay-paypal { background-color: #ffc439; color: #003087; }
.pay-card-buttons .pay-klarna:hover,
.pay-card-buttons .pay-paypal:hover { filter: brightness(0.95); }