/* DataKITE additions on top of the shared i2B site.css */
.role-tab { min-height: 44px; padding: 0 20px; border-radius: 999px; border: 1px solid #CBD5E1; background: #ffffff; color: #071E55; font-weight: 600; font-size: 15px; cursor: pointer; }
.role-tab:hover { border-color: #1F4FD8; color: #1F4FD8; }
.role-tab[aria-selected="true"] { background: #071E55; border-color: #071E55; color: #ffffff; }
[data-role-panel][hidden] { display: none !important; }
[data-variant][hidden] { display: none !important; }
.menu-panel a.menulink { min-height: 24px; }
header nav a[aria-current="page"] { color: #8CC8FF !important; }

/* sticky "Book a demo" button on the landing page, phones only, hidden once the form is on screen */
.sticky-cta { display: none !important; }
@media (max-width: 720px) {
  .sticky-cta { display: inline-flex !important; position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 30; justify-content: center; box-shadow: 0 12px 32px rgba(11,31,58,.35); }
  .sticky-cta.is-hidden { display: none !important; }
}

/* dark theme */
html[data-theme="dark"] .role-tab { background: #132033; border-color: #2C4C99; color: #E6EDF7; }
html[data-theme="dark"] .role-tab[aria-selected="true"] { background: #FFB547; border-color: #FFB547; color: #071E55; }
html[data-theme="dark"] select { background-color: #132033 !important; color: #E6EDF7 !important; }

/* migrated WordPress pages and posts */
.post-body figure video { display: block; width: 100%; height: auto; max-height: 450px; object-fit: cover; border-radius: 14px; background: #071E55; }
.post-body figure:has(> blockquote) { margin: 0; }
.post-body blockquote cite { display: block; margin-top: 8px; font-size: 15px; font-style: normal; color: #475569; }
.post-body .dk-buttons { display: flex; flex-wrap: wrap; gap: 12px; }
.post-body .dk-buttons a.btn-primary { color: #ffffff; }
.post-body .dk-form { font-size: 16px; line-height: 1.5; color: #0F172A; }
.post-body .dk-form label { color: #071E55; }
.post-body .dk-form a { color: #1F4FD8; }
.post-body > div:not([style*="grid"]) > * + * { margin-top: 16px; }
@media (max-width: 960px) { aside[style*="sticky"] { position: static !important; } }
.search-page-form input[type="search"] { flex: 1 1 320px; }
html[data-theme="dark"] .post-body .dk-form { background: #132033 !important; border-color: #22395E !important; color: #E6EDF7; }
html[data-theme="dark"] .post-body .dk-form label { color: #E6EDF7; }
html[data-theme="dark"] .post-body blockquote cite { color: #A9B9DE; }
html[data-theme="dark"] .post-body .dk-buttons a.btn-primary { color: #071E55; }

/* ===== DataKITE colours over the shared i2B stylesheet (site.css keys some rules on i2B's exact colours) ===== */
a { color: #1F4FD8; }
a:hover { color: #173CA6; }
:focus-visible { outline-color: #FFB547; }
.navlink:hover, button[data-menu]:hover, button[data-menu][aria-expanded="true"] { color: #8CC8FF !important; }
.menulink:hover strong { color: #1F4FD8; }
.foot a:hover { color: #8CC8FF !important; }
.card-link:hover h3, .post:hover h3, .cap:hover h3 { color: #1F4FD8 !important; }
.faq-item summary::after { color: #1F4FD8; }
input:focus, textarea:focus, select:focus { border-color: #1F4FD8 !important; box-shadow: 0 0 0 3px rgba(31, 79, 216, .25); }
.btn-primary { background: #071E55; }
.btn-primary:hover { background: #10307A; }
.post-body th { background: #071E55; }
.form-done { background: #E8F0FF; }
.search-hit:hover strong, .search-kind { color: #1F4FD8; }
#theme-toggle:hover { border-color: #8CC8FF !important; color: #8CC8FF !important; }

/* dark theme: deep blue grounds instead of i2B's slate, and the recoloured inline values */
html[data-theme="dark"] body { background: #07122E; }
html[data-theme="dark"] [style*="background: #ffffff" i] { background-color: #07122E !important; }
html[data-theme="dark"] [style*="background: #F6F8FB" i] { background-color: #0C1A40 !important; }
html[data-theme="dark"] [style*="background: #EEF2F6" i] { background-color: #122352 !important; }
html[data-theme="dark"] [style*="background: #DCE8FF" i] { background-color: #13306E !important; }
html[data-theme="dark"] [style*="; color: #071E55" i], html[data-theme="dark"] [style^="color: #071E55" i] { color: #E6EDF7 !important; }
html[data-theme="dark"] [style*="; color: #1F4FD8" i], html[data-theme="dark"] [style^="color: #1F4FD8" i] { color: #8CC8FF !important; }
html[data-theme="dark"] [style*="; color: #173CA6" i], html[data-theme="dark"] [style^="color: #173CA6" i] { color: #8CC8FF !important; }
html[data-theme="dark"] [style*="solid #071E55" i] { border-color: #5A78C2 !important; }
html[data-theme="dark"] [style*="background: #FFB547" i] { color: #071E55 !important; }
html[data-theme="dark"] [aria-hidden="true"] [style*="background: #071E55" i], html[data-theme="dark"] [role="img"] [style*="background: #071E55" i] { background-color: #3A5BA8 !important; }
html[data-theme="dark"] polygon[fill="#DCE8FF"] { fill: #13306E; }
html[data-theme="dark"] circle[fill="#1F4FD8"] { fill: #8CC8FF; }
html[data-theme="dark"] a { color: #8CC8FF; }
html[data-theme="dark"] a:hover { color: #B9DCFF; }
html[data-theme="dark"] .btn-primary, html[data-theme="dark"] a.btn-primary { background: #FFB547; color: #071E55; }
html[data-theme="dark"] .card-link:hover h3, html[data-theme="dark"] .post:hover h3, html[data-theme="dark"] .cap:hover h3 { color: #8CC8FF !important; }
html[data-theme="dark"] .faq-item summary::after { color: #8CC8FF; }
html[data-theme="dark"] .form-done { background: #13306E; }
html[data-theme="dark"] input, html[data-theme="dark"] textarea, html[data-theme="dark"] select { background-color: #0C1A40 !important; }
html[data-theme="dark"] .faq-item, html[data-theme="dark"] .faq-item { background: #07122E; }

/* solution pages: hero dashboard on phones */
@media (max-width: 560px) {
  .sol-tile { font-size: 17px !important; white-space: normal !important; overflow-wrap: anywhere; }
  .sol-bar { grid-template-columns: 96px 1fr 48px !important; }
}

/* department overview (hub) pages: the original page text */
.hub-body { font-size: 17px; line-height: 1.7; color: #334155; }
.hub-body > * + * { margin-top: 18px; }
.hub-body h2, .hub-body h3, .hub-body h4 { font-family: Manrope, sans-serif; color: #071E55; line-height: 1.3; margin-bottom: 0; }
.hub-body h2 { font-size: 26px; } .hub-body h3 { font-size: 22px; }
.hub-body video { display: block; width: 100%; height: auto; max-height: 450px; object-fit: cover; border-radius: 14px; background: #071E55; }
.hub-body ul { padding-left: 22px; }
html[data-theme="dark"] .hub-body { color: #CDD8F0; }
html[data-theme="dark"] .hub-body h2, html[data-theme="dark"] .hub-body h3, html[data-theme="dark"] .hub-body h4 { color: #E6EDF7; }

/* COGS landing page: lead line per audience; hide the phone number on small phones to keep the header on one line */
[data-lead][hidden] { display: none !important; }
@media (max-width: 480px) { .lp-phone { display: none; } }

/* dark theme: dropdowns match the text boxes (their inline white background was being swapped for the page colour),
   and form buttons use the amber accent so they stand out on the dark form panel */
html[data-theme="dark"] form select[style], html[data-theme="dark"] form select { background-color: #0C1A40 !important; color: #E6EDF7 !important; }
html[data-theme="dark"] form button[type="submit"][style] { background: #FFB547 !important; color: #071E55 !important; }

.hub-body figure { margin: 0; }

/* forms: when a label wraps onto two lines, keep the boxes in each row lined up along the bottom */
form div[style*="grid"] { align-items: end; }
form div[style*="grid"] > label { justify-content: flex-end; }

/* phones: buttons grow to fit their text instead of letting it spill out of a fixed height */
@media (max-width: 720px) {
  button[style*="height:"]:not(#theme-toggle), a[style*="height:"], a[style*="min-height"], button[style*="min-height"] {
    height: auto !important; min-height: 48px; padding-top: 12px !important; padding-bottom: 12px !important;
    line-height: 1.3 !important; white-space: normal !important; text-align: center;
  }
}