/* Bookzilla accessibility fixes (2026-10-26).
   Loaded after the Combined Design by the sandbox module bookzilla-a11y.php, so nothing in the older
   stylesheets is edited. Remove the module (or add ?bz_noa11y=1 to any address) to see a page without it.
   Contrast figures are WCAG ratios (4.5:1 needed for body text, 3:1 for large text). */

/* 1. One darker grey for small secondary text: #718198 was 3.7-4.0:1 on white and the pale surfaces, #5a6b82 is 4.6-5.4:1. */
html body.bookzilla-site.bookzilla-site { --bz-muted-2: #5a6b82; }
html body.bookzilla-site.bookzilla-site .bz-pagebody { --muted-2: #5a6b82; }

/* 2. Category bar: white links need a slightly deeper blue behind them (3.57:1 -> 4.7:1). Hover darkens instead of lightening. */
html body.bookzilla-site.bookzilla-site .bz-catnav { background: #1b7bab; background-color: #1b7bab; }
html body.bookzilla-site.bookzilla-site .bz-catnav .bz-wrap > a:hover,
html body.bookzilla-site.bookzilla-site nav.bz-catnav > .bz-wrap > a:not(.bz-is-sale):hover { background: rgba(8, 26, 51, 0.28); background-color: rgba(8, 26, 51, 0.28); }

/* 3. Brand blue text on the pale blue tint was 4.16:1; a slightly deeper brand blue is 4.7:1 (and 5.5:1 on white). */
html body.bookzilla-site.bookzilla-site .bz-combined-home .rf-grade.is-active,
html body.bookzilla-site.bookzilla-site .bz-combined-home .rf-grade:hover,
html body.bookzilla-site.bookzilla-site .bz-combined-home .service:not(.service--list) .eyebrow,
html body.bookzilla-site.bookzilla-site .bz-pagebody .bz-eyebrow:not(.bz-eyebrow--slide),
html body.bookzilla-site.bookzilla-site .bz-pagebody .bz-prose h2 .bz-num,
html body.bookzilla-site.bookzilla-site .bz-pagebody .bz-toc a.bz-on,
html body.bookzilla-site.bookzilla-site .bz-pagebody .bz-callout--blue a:not(.bz-btn),
html body.bookzilla-site.bookzilla-site .bz-pagebody .bz-prose .bz-callout--blue a:not(.bz-btn) { color: #1b67c8; }
html body.bookzilla-site.bookzilla-site .bz-pagebody .bz-band--orange .bz-eyebrow { color: #2a1a05; }

/* 4. White text on the yellow buttons was 1.78:1; navy is above 10:1. (The checkout stylesheet forces its white with !important, so this does too.) */
html body.bz-checkout #payment #place_order,
html body.bz-checkout #payment #place_order:hover,
html body.bz-checkout #payment #place_order:focus { color: #0b1f3a !important; }
html body.bookzilla-site.bookzilla-site .wc-address-book-address-default-label { color: #0b1f3a; }

/* 5. Required-field asterisk (4.48:1) and placeholder text (4.0:1) on the form pages and the newsletter box. */
html body.bookzilla-site.bookzilla-site .bz-pagebody .bz-req { color: #c62d25; }
html body .mailpoet_form ::placeholder,
html body .mailpoet_text::placeholder,
html body .bz-pagebody input::placeholder,
html body .bz-pagebody textarea::placeholder { color: #5a6b82; opacity: 1; }

/* 6. Breadcrumb links used WooCommerce's #767676 on the pale page background (4.2:1). */
html body.bookzilla-site.bookzilla-site .woocommerce-breadcrumb,
html body.bookzilla-site.bookzilla-site .woocommerce-breadcrumb a { color: #5a6b82; }
html body.bookzilla-site.bookzilla-site .woocommerce-breadcrumb a:hover { color: #0b2447; }

/* 7. Account dashboard: the e-Shop card lost its dark background, leaving white text on white. */
html body.bookzilla-site.bookzilla-site.bz-account .bz-acct__main .bz-apromo { background: linear-gradient(135deg, #0b2447, #123a6e); border-color: transparent; color: #fff; }
html body.bookzilla-site.bookzilla-site.bz-account .bz-acct__main .bz-apromo :is(h2, h3, p, strong) { color: #fff; }

/* 8. Footer phone numbers and e-mail: two stacked links were 17px tall and 22px apart; each is now a 24px target. */
html body .bz-foot a[href^="tel:"],
html body .bz-foot a[href^="mailto:"] { display: block; width: fit-content; min-height: 24px; line-height: 24px; }
html body .bz-foot a[href^="tel:"] + br { display: none; }

/* 9. Tick boxes in checkout and on the contact form: 24px targets (the checkout radios sit in full-width rows, so they stay as designed). */
html body.woocommerce-checkout .woocommerce-form__input-checkbox,
html body.woocommerce-checkout .input-checkbox,
html body.bz-checkout #payment .place-order input[type="checkbox"],
html body.bookzilla-site.bookzilla-site .bz-pagebody .bz-checkline input[type="checkbox"] { width: 24px; height: 24px; }

/* 10. Home slider dots: 24px buttons that draw the same small dot (the active dot is the same pill, 20px wide). */
html body.bookzilla-site.bookzilla-site .bz-combined-home .hero__dots { gap: 0; padding: 2px 9px; }
html body.bookzilla-site.bookzilla-site .bz-combined-home .hero__dot { position: relative; width: 24px; height: 24px; background: transparent; }
html body.bookzilla-site.bookzilla-site .bz-combined-home .hero__dot::before { content: ""; position: absolute; top: 50%; left: 50%; width: 9px; height: 9px; transform: translate(-50%, -50%); border-radius: 999px; background: rgba(255, 255, 255, 0.42); transition: width 0.2s ease, background-color 0.2s ease; }
html body.bookzilla-site.bookzilla-site .bz-combined-home .hero__dot[aria-current="true"] { width: 24px; background: transparent; }
html body.bookzilla-site.bookzilla-site .bz-combined-home .hero__dot[aria-current="true"]::before { width: 20px; background: var(--accent); }

/* 11. Leave room under the last footer row so the floating chat button never covers the links (phone and desktop). */
html body.bookzilla-site.bookzilla-site .bz-foot { padding-bottom: 96px; }

/* 12. Product activity box: the same look now that it is a plain list instead of a definition list. */
html body .bz-product-activity__metric .bz-pa-term { display: block; margin: 0 0 4px; padding: 0; color: #6b7280; font-size: 11px; font-weight: 800; letter-spacing: 0.04em; line-height: 1.2; text-transform: uppercase; }
html body .bz-product-activity__metric .bz-pa-desc { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 5px; margin: 0; padding: 0; line-height: 1.2; }

/* 13. e-Shop card warning line (shown to administrators when a file host cannot be reached): 3.7:1 -> 6.8:1. */
html body .bz-dcard__warn,
html body .bz-dcard__warn span { color: #7a4f0a; opacity: 1; }

/* 14. WooCommerce's show-password button was 22px; now 24px. */
html body .woocommerce form .show-password-input,
html body .show-password-input { min-width: 24px; min-height: 24px; width: 24px; height: 24px; }

/* Text for screen readers only. */
.bz-sr-only { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; border: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; }

/* 15. Wishlist button on a variable product before an option is chosen: the wishlist plugin fades it to 50% opacity (!important), which drops its label
       to about 3.3:1 on white. It is dimmed with the muted palette instead (label about 5:1): still plainly inactive (grey fill, muted label, no hover colour). */
html body.bookzilla-site.bookzilla-site.single-product div.product form.cart .tinvwl_add_to_wishlist_button.disabled-add-wishlist { opacity: 1 !important; background: var(--bz-surface); border-color: var(--bz-line); color: var(--bz-muted); }
