/** * HMRC Badge widget. * * "Recognised by HMRC" trust badge — Sky Gift Aid is listed on GOV.UK as a * recognised Charities Online commercial software supplier. Text-only, no HMRC * crest (recognised suppliers aren't licensed to display the Crown logo). * * Styles: Footer (compact pill) / Full (large pill) / Banner (wide banner). * Theme: Light (default) / Dark / Auto — Auto follows the site's colour mode, * which toggles by adding `.dark` to (and ). * Elementor style controls override these defaults per-instance. */ .skyweb-hmrc-wrap{display:flex;justify-content:flex-start} /* ============================ Base pill ============================ */ .skyweb-hmrc{ display:inline-flex; align-items:center; gap:11px; padding:10px 16px; background:#ffffff; border:1px solid #d7e2dc; border-radius:12px; text-decoration:none; line-height:1.25; box-shadow:0 1px 2px rgba(16,50,40,.06); font-family:inherit; transition:box-shadow .15s ease,border-color .15s ease; } .skyweb-hmrc:hover{border-color:#0e6b4d;box-shadow:0 3px 10px rgba(14,107,77,.16)} .skyweb-hmrc__mark{color:#0e6b4d;display:flex;flex:0 0 auto} .skyweb-hmrc__mark svg{width:22px;height:22px;display:block} .skyweb-hmrc__text{display:flex;flex-direction:column;text-align:left} .skyweb-hmrc__lead{font-size:13px;font-weight:700;color:#123f2f;letter-spacing:.01em} .skyweb-hmrc__sub{font-size:11px;color:#5a7268;margin-top:1px} /* Full — larger pill. */ .skyweb-hmrc--full{padding:14px 20px;gap:13px} .skyweb-hmrc--full .skyweb-hmrc__mark svg{width:26px;height:26px} .skyweb-hmrc--full .skyweb-hmrc__lead{font-size:15px} .skyweb-hmrc--full .skyweb-hmrc__sub{font-size:12px} /* ============================== Banner ============================= */ .skyweb-hmrc--banner{ display:flex; align-items:center; gap:14px; width:100%; padding:14px 18px; background:#f2f8f5; border:1px solid #cbe6da; border-left:4px solid #0e6b4d; border-radius:10px; box-shadow:none; } .skyweb-hmrc--banner:hover{border-color:#cbe6da;box-shadow:0 2px 8px rgba(14,107,77,.10)} .skyweb-hmrc--banner .skyweb-hmrc__body{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;text-align:left} .skyweb-hmrc--banner .skyweb-hmrc__lead{font-size:14px} .skyweb-hmrc--banner .skyweb-hmrc__desc{font-size:13px;color:#33574a;margin-top:2px;line-height:1.4} .skyweb-hmrc--banner .skyweb-hmrc__cta{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:600;color:#0e6b4d;white-space:nowrap} .skyweb-hmrc--banner .skyweb-hmrc__cta svg{width:13px;height:13px;display:block} @media (max-width:560px){ .skyweb-hmrc--banner{flex-wrap:wrap} .skyweb-hmrc--banner .skyweb-hmrc__cta{width:100%;padding-left:36px} } /* ===================== Dark appearance ============================= * Applies to the explicit Dark theme AND to Auto when the site is in * dark mode (`.dark` on or ). Manual colour controls win. */ .skyweb-hmrc--dark, html.dark .skyweb-hmrc--auto, body.dark .skyweb-hmrc--auto{background:#10241d;border-color:#24463b} .skyweb-hmrc--dark .skyweb-hmrc__lead, html.dark .skyweb-hmrc--auto .skyweb-hmrc__lead, body.dark .skyweb-hmrc--auto .skyweb-hmrc__lead{color:#eaf5f0} .skyweb-hmrc--dark .skyweb-hmrc__sub, html.dark .skyweb-hmrc--auto .skyweb-hmrc__sub, body.dark .skyweb-hmrc--auto .skyweb-hmrc__sub{color:#8fb3a6} .skyweb-hmrc--dark .skyweb-hmrc__mark, html.dark .skyweb-hmrc--auto .skyweb-hmrc__mark, body.dark .skyweb-hmrc--auto .skyweb-hmrc__mark{color:#4cc79c} .skyweb-hmrc--dark:hover, html.dark .skyweb-hmrc--auto:hover, body.dark .skyweb-hmrc--auto:hover{border-color:#4cc79c;box-shadow:0 3px 12px rgba(0,0,0,.4)} /* Banner dark specifics (left rule, description + CTA colours). */ .skyweb-hmrc--banner.skyweb-hmrc--dark, html.dark .skyweb-hmrc--banner.skyweb-hmrc--auto, body.dark .skyweb-hmrc--banner.skyweb-hmrc--auto{border-left-color:#4cc79c} .skyweb-hmrc--banner.skyweb-hmrc--dark .skyweb-hmrc__desc, html.dark .skyweb-hmrc--banner.skyweb-hmrc--auto .skyweb-hmrc__desc, body.dark .skyweb-hmrc--banner.skyweb-hmrc--auto .skyweb-hmrc__desc{color:#8fb3a6} .skyweb-hmrc--banner.skyweb-hmrc--dark .skyweb-hmrc__cta, html.dark .skyweb-hmrc--banner.skyweb-hmrc--auto .skyweb-hmrc__cta, body.dark .skyweb-hmrc--banner.skyweb-hmrc--auto .skyweb-hmrc__cta{color:#4cc79c}