:root{
    --fc-button-text-color: #ffffff;
    --fc-button-bg-color: #2563eb;
    --fc-button-border-color: #2563eb;
    --fc-button-hover-bg-color: color-mix(in srgb, #2563eb 90%, black);
    --fc-button-hover-border-color: color-mix(in srgb, #2563eb 90%, black);
    --fc-button-active-bg-color: color-mix(in srgb, #2563eb 80%, black);
    --fc-button-active-border-color: color-mix(in srgb, #2563eb 80%, black);
    --fc-border-color: #a9b2c4;
    --fc-page-bg-color: #ffffff;
    --fc-neutral-bg-color: #f0f4fe;
    --fc-today-bg-color: color-mix(in srgb, #2563eb 10%, #f6f9fe);
    --fc-event-bg-color: #2563eb;
    --fc-event-border-color: #2563eb;
    --fc-event-text-color: #ffffff;
    --fc-list-event-hover-bg-color: #f0f4fe;
    --fc-non-business-color: color-mix(in srgb, #2563eb 5%, transparent);
    --at-color-background: #ffffff;
    --at-color-link: #2563eb;
    --at-color-primary: #2563eb;
    --at-color-accent: #eef3fd;
    --at-color-border: #a9b2c4;
    --at-color-destructive: #dc2626;
    --at-color-heading: #2563eb;
    --at-color-text: #0f172a;
    --at-color-foreground: #2563eb;
    --at-color-primary-foreground: #ffffff;
    --at-color-accent-foreground: #2563eb;
    --at-color-destructive-foreground: #ffffff;
    --at-color-link-hover-mix: #000000;
    --at-radius: 0rem;
    --at-tab-radius: 24px;
    --at-font-heading: Inter, system-ui, -apple-system, 'Segoe UI', sans-serif;
    --at-font-body: Inter, system-ui, -apple-system, 'Segoe UI', sans-serif;
    --at-font-tab: Inter, system-ui, -apple-system, 'Segoe UI', sans-serif;
    --at-font-heading-weight: 700;
    --at-font-heading-size: 30;
    --at-font-heading-align: left;
    --at-font-body-weight: 400;
    --at-font-body-size: 16;
    --at-font-body-align: left;
    --at-font-button: Inter, system-ui, -apple-system, 'Segoe UI', sans-serif;
    --at-font-button-weight: 600;
    --at-font-button-size: 15;
    --at-font-button-ls: 2.5;
    --at-color-card: #f6f9fe;
    --at-color-card-foreground: #2563eb;
    --at-color-popover: #f6f9fe;
    --at-color-popover-foreground: #2563eb;
    --at-color-secondary: #f0f4fe;
    --at-color-secondary-foreground: #2563eb;
    --at-color-muted: #f0f4fe;
    --at-color-muted-foreground: #546ea5;
    --at-color-input: #e0e9fc;
    --at-color-ring: #2563eb;
    --at-color-sidebar-bg: #f6f9fe;
    --at-color-sidebar-fg: #2563eb;
    --at-color-topbar-bg: #ffffff;
    --at-color-topbar-fg: #2563eb;
    --at-color-table-header-bg: #f0f4fe;
    --at-color-tab-panel-active: #2563eb;
    --at-color-tab-panel-active-foreground: #ffffff;
    --at-color-tab-panel-inactive: #f0f4fe;
    --at-color-tab-panel-inactive-foreground: #546ea5;
    --at-color-tab-panel-hover: #4c7fef;
    --at-color-tab-panel-hover-foreground: #1a1a1a;
    --at-color-status-success: #16a34a;
    --at-color-status-success-foreground: #ffffff;
    --at-color-status-warning: #d97706;
    --at-color-status-warning-foreground: #ffffff;
    --at-color-status-danger: #dc2626;
    --at-color-status-danger-foreground: #ffffff;
    --at-color-status-success-ink: #12823b;
    --at-color-status-warning-ink: #a85c05;
    --at-color-status-danger-ink: #dc2626;
    --at-color-destructive-ink: #dc2626;
    --at-color-progress-track: #dde7fc;
    --at-color-progress-fill: #2563eb;
    --at-color-control-border: #878e9d;
    --at-color-placeholder: #4f81ef;
    --at-color-status-info-fill: #0369a1;
    --at-color-status-info-fill-foreground: #ffffff;
    --at-color-status-success-fill: #157347;
    --at-color-status-success-fill-foreground: #ffffff;
    --at-color-status-warning-fill: #8f5f00;
    --at-color-status-warning-fill-foreground: #ffffff;
    --at-color-status-danger-fill: #b02a37;
    --at-color-status-danger-fill-foreground: #ffffff;
    --at-color-destructive-fill: #b02a37;
    --at-color-destructive-fill-foreground: #ffffff;
    --at-color-saturated-1: #087e9c;
    --at-color-saturated-2: #1678b4;
    --at-color-saturated-3: #356ad9;
    --at-color-saturated-4: #675cd5;
    --at-color-saturated-5: #884fc6;
    --at-color-pastel-1: #bbe6f6;
    --at-color-pastel-2: #c2e3fd;
    --at-color-pastel-3: #cedffe;
    --at-color-pastel-4: #d9dbfd;
    --at-color-pastel-5: #e4d7fa;
}

/**
 * Admin Tailwind → Theme-token map  (pd-tw-theme-*)
 * ────────────────────────────────────────────────────────────────────────────
 * The modern SkyForj / Perfex admin markup ships hard-coded Tailwind NEUTRAL
 * utility colours (tw-text-neutral-*, tw-border-neutral-*, tw-bg-white …) that
 * ignore the active admin theme — leaving grey text/borders that don't follow
 * the enabled theme labels. This dedicated, fully isolated sheet re-points the
 * neutral ramp at the active theme's OWN live tokens (--at-color-*), preserving
 * the light → dark hierarchy so every admin element follows the enabled theme.
 *
 * Rules:
 *  • NO !important — each selector is prefixed `html body` (0,0,2,2) so it beats
 *    Tailwind's single-class utilities (0,0,1,0) on specificity alone.
 *  • Only NEUTRAL / white greys are remapped. Semantic utilities (primary,
 *    warning, success, and deliberate white text/dark surfaces) are LEFT ALONE.
 *  • Tokens are the live CSS variables emitted by the compiled active theme, so
 *    switching theme repaints these in lockstep with everything else.
 */

/* ── Text ramp → theme text hierarchy ───────────────────────────────────── */
/* Subtle / secondary text → Muted Text */
html body .tw-text-neutral-400,
html body .tw-text-neutral-500 { color: var(--at-color-muted-foreground); }

/* Body text → General Text */
html body .tw-text-neutral-600,
html body .tw-text-neutral-700 { color: var(--at-color-text); }

/* Strong text → Headings */
html body .tw-text-neutral-800,
html body .tw-text-gray-900 { color: var(--at-color-heading); }

/* Placeholders → Muted Text */
html body .tw-placeholder-neutral-500::placeholder,
html body .tw-placeholder-neutral-600::placeholder { color: var(--at-color-muted-foreground); }

/* ── Hairlines / dividers → Border ──────────────────────────────────────── */
html body .tw-border-neutral-300 { border-color: var(--at-color-border); }
html body .tw-divide-neutral-300 > :not([hidden]) ~ :not([hidden]) { border-color: var(--at-color-border); }

/* ── Plain surfaces → Card / subtle surface ─────────────────────────────── */
html body .tw-bg-white { background-color: var(--at-color-card); }
html body .tw-bg-neutral-50,
html body .tw-bg-neutral-100,
html body .tw-bg-neutral-200 { background-color: var(--at-color-muted, var(--at-color-card)); }

/* ── Interactive states (hover / focus / group-hover) — same text ramp ──── */
/* Each selector mirrors Tailwind's escaped variant class + its pseudo, with the
   `html body` prefix so it wins on specificity (no !important). The dark hover
   surfaces (tw-bg-neutral-900 / -600) are deliberately NOT remapped — they pair
   with intentional white text, so retheming them would break contrast. */

/* Body-text hover / focus.
   NOTE: this admin build prefixes the group marker as `tw-group` (the variant
   utility stays `group-hover:`), so BOTH `.group:hover` and `.tw-group:hover`
   parents are remapped — without the `tw-group` form the icons fall back to
   Tailwind's near-black neutral-800 on hover and vanish on dark themes. */
html body .group:hover .group-hover\:tw-text-neutral-600,
html body .tw-group:hover .group-hover\:tw-text-neutral-600,
html body .hover\:tw-text-neutral-700:hover,
html body .focus\:tw-text-neutral-700:focus { color: var(--at-color-text); }

/* Strong-text hover / focus */
html body .hover\:tw-text-neutral-800:hover,
html body .focus\:tw-text-neutral-800:focus,
html body .group:hover .group-hover\:tw-text-neutral-800,
html body .tw-group:hover .group-hover\:tw-text-neutral-800 { color: var(--at-color-heading); }

/* Subtle hover surface */
html body .hover\:tw-bg-neutral-200:hover { background-color: var(--at-color-muted, var(--at-color-card)); }


/**
 * Customer Portal Theme — spending the workspace's colour labels on the
 * portal's own parts.
 *
 * RULES THIS FILE KEEPS
 * ---------------------------------------------------------------------
 *  - Not one colour is written here. Every single one is a label the
 *    workspace set in Theme Studio, so changing a label changes this page
 *    and nothing has to be edited twice.
 *  - Every label is used with its PAIRED text colour, never on its own.
 *    That pairing is what Theme Studio guarantees to be readable, so a
 *    surface and the words on it can never end up the same colour.
 *  - No !important, and no specificity tricks. This file is loaded after
 *    the platform's own stylesheets, so plain rules already win.
 *  - Nothing here is shared with any other tool. Only portal surfaces are
 *    named, and the admin's own screens are untouched.
 *
 * WHY EACH LABEL WAS CHOSEN
 * ---------------------------------------------------------------------
 * The portal is the same shape as the admin — a bar across the top, a
 * page behind it, panels on the page — so each part takes the label that
 * already governs the same part in the admin. A customer looking at the
 * portal and a member of staff looking at the admin then see one brand,
 * not two that nearly match.
 *
 * Fallbacks are given on every label. If a workspace is mid-upgrade and a
 * label has not been written yet, the portal keeps the platform's own
 * colour for that one part rather than painting it with nothing.
 */

/* ── The page itself ─────────────────────────────────────────────────── */
body {
    background-color: var(--at-color-background, #ffffff);
    color: var(--at-color-foreground, #0f172a);
}

h1, h2, h3, h4, h5, h6,
.section-heading {
    color: var(--at-color-heading, var(--at-color-foreground, #0f172a));
}

/* Links take the Link label, not Primary — a workspace can set a link
   colour that differs from its brand colour, and on the portal that
   choice matters more than anywhere else. */
a {
    color: var(--at-color-link, var(--at-color-primary, #2563eb));
}

hr {
    border-top-color: var(--at-color-border, #c1c7cf);
}

/* ── The bar across the top ──────────────────────────────────────────── */
.navbar.navbar-default,
.navbar.navbar-default.header {
    background-color: var(--at-color-topbar-bg, var(--at-color-card, #ffffff));
    border-color: var(--at-color-border, #c1c7cf);
}
.navbar.navbar-default .navbar-brand,
.navbar.navbar-default .navbar-nav > li > a,
.navbar.navbar-default .navbar-text {
    color: var(--at-color-topbar-fg, var(--at-color-foreground, #0f172a));
}
/* Hover and the page you are on both lift off the bar using the Muted
   pair, which Theme Studio keeps readable against the bar on light and
   dark themes alike. */
.navbar.navbar-default .navbar-nav > li > a:hover,
.navbar.navbar-default .navbar-nav > li > a:focus,
.navbar.navbar-default .navbar-nav > .active > a,
.navbar.navbar-default .navbar-nav > .active > a:hover,
.navbar.navbar-default .navbar-nav > .active > a:focus,
.navbar.navbar-default .navbar-nav > .open > a,
.navbar.navbar-default .navbar-nav > .open > a:hover,
.navbar.navbar-default .navbar-nav > .open > a:focus {
    background-color: var(--at-color-muted, #f1f5f9);
    color: var(--at-color-muted-foreground, #5c6b81);
}
/* The three bars of the phone menu button are borders, not text, so they
   need saying separately or they stay the platform's grey. */
.navbar.navbar-default .navbar-toggle {
    border-color: var(--at-color-border, #c1c7cf);
}
.navbar.navbar-default .navbar-toggle .icon-bar {
    background-color: var(--at-color-topbar-fg, var(--at-color-foreground, #0f172a));
}
.navbar.navbar-default .navbar-toggle:hover,
.navbar.navbar-default .navbar-toggle:focus {
    background-color: var(--at-color-muted, #f1f5f9);
}
.navbar.navbar-default .navbar-collapse,
.navbar.navbar-default .navbar-form {
    border-color: var(--at-color-border, #c1c7cf);
}

/* ── Menus that drop down ────────────────────────────────────────────── */
.dropdown-menu {
    background-color: var(--at-color-popover, var(--at-color-card, #ffffff));
    border-color: var(--at-color-border, #c1c7cf);
}
.dropdown-menu > li > a {
    color: var(--at-color-popover-foreground, var(--at-color-card-foreground, #0f172a));
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
    background-color: var(--at-color-muted, #f1f5f9);
    color: var(--at-color-muted-foreground, #5c6b81);
}
.dropdown-menu .divider {
    background-color: var(--at-color-border, #c1c7cf);
}

/* ── The row of links under the bar ──────────────────────────────────── */
.submenu.customer-top-submenu {
    border-bottom-color: var(--at-color-border, #c1c7cf);
}
.submenu.customer-top-submenu > li > a {
    color: var(--at-color-muted-foreground, #5c6b81);
}
.submenu.customer-top-submenu > li > a:hover,
.submenu.customer-top-submenu > li > a:focus,
.submenu.customer-top-submenu > li.active > a {
    color: var(--at-color-foreground, #0f172a);
}

/* ── Panels — the boxes everything sits in ───────────────────────────── */
.panel_s,
.panel {
    background-color: var(--at-color-card, #ffffff);
    color: var(--at-color-card-foreground, #0f172a);
    border-color: var(--at-color-border, #c1c7cf);
}
.panel_s .panel-heading,
.panel .panel-heading {
    background-color: var(--at-color-card, #ffffff);
    color: var(--at-color-heading, var(--at-color-card-foreground, #0f172a));
    border-bottom-color: var(--at-color-border, #c1c7cf);
}
/* The body of a panel needs the fill saying as well as the text. The
   platform paints .panel-body white in its own right, so setting only the
   text colour here left pale words on a white block inside an otherwise
   dark card — the panel looked themed and the words inside it vanished. */
.panel-body,
.panel_s .panel-body,
.panel .panel-body {
    background-color: var(--at-color-card, #ffffff);
    color: var(--at-color-card-foreground, #0f172a);
}
/* Anything that writes its own label inside a panel follows the panel,
   not the page — on most themes the two match, but on a card that is a
   different shade from the page they must not drift apart. */
.panel-body label,
.panel-body .control-label,
.panel-body .checkbox label,
.panel-body .radio label {
    color: var(--at-color-card-foreground, #0f172a);
}
.panel_s .panel-footer,
.panel .panel-footer {
    background-color: var(--at-color-muted, #f1f5f9);
    color: var(--at-color-muted-foreground, #5c6b81);
    border-top-color: var(--at-color-border, #c1c7cf);
}
.well {
    background-color: var(--at-color-muted, #f1f5f9);
    color: var(--at-color-muted-foreground, #5c6b81);
    border-color: var(--at-color-border, #c1c7cf);
}

/* ── Tables — invoices, estimates, projects, tickets ─────────────────── */
.table > thead > tr > th {
    background-color: var(--at-color-table-header-bg, var(--at-color-muted, #f1f5f9));
    color: var(--at-color-muted-foreground, #5c6b81);
    border-bottom-color: var(--at-color-border, #c1c7cf);
}
.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td {
    color: var(--at-color-card-foreground, #0f172a);
    border-top-color: var(--at-color-border, #c1c7cf);
}
.table-bordered,
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
    border-color: var(--at-color-border, #c1c7cf);
}
/* Striping and hover both use Muted, so a row that is picked out still
   reads with the same text colour rather than needing its own. */
.table-striped > tbody > tr:nth-of-type(odd),
.table-hover > tbody > tr:hover {
    background-color: var(--at-color-muted, #f1f5f9);
}

/* AN EDGE, NOT A LOUDER FILL — see /contrast-shape-on-card.html.
   Muted and Card are near-neighbours by design, which is right for a panel on
   a page and wrong the moment a Muted shape is drawn ON a Card. Measured across
   all 66 presets the two sit within 1.15:1, and on three of them they are
   EXACTLY the same colour — so on those the striping simply is not there and
   the eye has nothing to follow across a wide row.
   A hairline in the theme's own Border colour, on the row rather than around
   it, is what a table wants: it keeps the theme's hue and moves only as far as
   it must, which is the rule every other study settled on. The hover state is
   deliberately left alone — it is transient, and an edge that appears under the
   pointer reads as a glitch rather than as structure. */
.table-striped > tbody > tr:nth-of-type(odd) > td {
    border-bottom: 1px solid var(--at-color-border, #c1c7cf);
}

/* ── Buttons ─────────────────────────────────────────────────────────── */
.btn-primary {
    background-color: var(--at-color-primary, #2563eb);
    border-color: var(--at-color-primary, #2563eb);
    color: var(--at-color-primary-foreground, #ffffff);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    /* Darkened from the brand colour itself rather than given a second
       label, so a workspace only ever picks one brand colour and the
       pressed state follows it automatically. */
    background-color: color-mix(in srgb, var(--at-color-primary, #2563eb) 85%, var(--at-color-link-hover-mix, #000000));
    border-color: color-mix(in srgb, var(--at-color-primary, #2563eb) 85%, var(--at-color-link-hover-mix, #000000));
    color: var(--at-color-primary-foreground, #ffffff);
}
.btn-default {
    background-color: var(--at-color-secondary, #f1f5f9);
    border-color: var(--at-color-border, #c1c7cf);
    color: var(--at-color-secondary-foreground, #0f172a);
}
.btn-default:hover,
.btn-default:focus,
.btn-default:active {
    background-color: var(--at-color-muted, #f1f5f9);
    color: var(--at-color-muted-foreground, #5c6b81);
    border-color: var(--at-color-border, #c1c7cf);
}
.btn-danger {
    background-color: var(--at-color-destructive, #dc2626);
    border-color: var(--at-color-destructive, #dc2626);
    color: var(--at-color-destructive-foreground, #ffffff);
}
.btn-success {
    background-color: var(--at-color-status-success, #0d843a);
    border-color: var(--at-color-status-success, #0d843a);
    color: var(--at-color-status-success-foreground, #ffffff);
}
.btn-warning {
    background-color: var(--at-color-status-warning, #b6640c);
    border-color: var(--at-color-status-warning, #b6640c);
    color: var(--at-color-status-warning-foreground, #ffffff);
}
.btn-info {
    background-color: var(--at-color-status-info, var(--at-color-accent, #e2e8f0));
    border-color: var(--at-color-status-info, var(--at-color-accent, #e2e8f0));
    color: var(--at-color-status-info-foreground, var(--at-color-accent-foreground, #0f172a));
}

/* ── Things people type into ─────────────────────────────────────────── */
/* Exactly the pairing the admin uses for a field — Input for the fill,
   Card-Text for what is typed, Border for the edge — so a form looks the
   same to a customer as the same form does to staff.

   The element is named alongside the class on purpose. The platform's own
   stylesheets reach these fields with `input.form-control`, which carries
   more weight than a class on its own; matching that weight is what lets
   the workspace's own colour through, with nothing marked important. */
.form-control,
input.form-control,
textarea.form-control,
select.form-control,
input[type="file"].form-control {
    background-color: var(--at-color-input, var(--at-color-card, #ffffff));
    color: var(--at-color-card-foreground, #0f172a);
    border-color: var(--at-color-border, #c1c7cf);
}
.form-control:focus,
input.form-control:focus,
textarea.form-control:focus,
select.form-control:focus {
    border-color: var(--at-color-ring, var(--at-color-primary, #2563eb));
    outline: none;
}
/* Placeholder text is a hint, so it takes the muted text colour — the one
   Theme Studio already keeps readable but quiet. */
.form-control::placeholder {
    color: var(--at-color-muted-foreground, #5c6b81);
}
label,
.control-label {
    color: var(--at-color-foreground, #0f172a);
}
.help-block,
.text-muted {
    color: var(--at-color-muted-foreground, #5c6b81);
}

/* The dropdown the platform builds over a <select>.
 *
 * It is a wrapper carrying the field's own styling with a button sitting
 * inside it, and that button arrives with a near-white fill of its own.
 * On a dark theme the field went dark, the button inside it stayed pale,
 * and the chosen option was written in light text on top of it — so the
 * one thing the control exists to show was the one thing unreadable.
 *
 * The button is made to disappear into the field instead: no fill of its
 * own, no border, and every layer of text inside it following the field.
 * One field, one colour, on every theme.
 */
.bootstrap-select > .btn.dropdown-toggle,
.bootstrap-select > .btn.dropdown-toggle:hover,
.bootstrap-select > .btn.dropdown-toggle:focus,
.bootstrap-select > .btn.dropdown-toggle:active {
    background-color: transparent;
    border-color: transparent;
    color: var(--at-color-card-foreground, #0f172a);
    box-shadow: none;
}
.bootstrap-select .filter-option,
.bootstrap-select .filter-option-inner,
.bootstrap-select .filter-option-inner-inner,
.bootstrap-select > .btn.dropdown-toggle .caret {
    color: inherit;
}
/* The list it opens is a popover, so it takes the popover pair. */
.bootstrap-select .dropdown-menu li a {
    color: var(--at-color-popover-foreground, var(--at-color-card-foreground, #0f172a));
}
.bootstrap-select .dropdown-menu li.selected a,
.bootstrap-select .dropdown-menu li a:hover {
    background-color: var(--at-color-muted, #f1f5f9);
    color: var(--at-color-muted-foreground, #5c6b81);
}

/* ── Small coloured pills ────────────────────────────────────────────── */
.badge {
    background-color: var(--at-color-primary, #2563eb);
    color: var(--at-color-primary-foreground, #ffffff);
}
.label-success { background-color: var(--at-color-status-success, #0d843a); color: var(--at-color-status-success-foreground, #ffffff); }
.label-warning { background-color: var(--at-color-status-warning, #b6640c); color: var(--at-color-status-warning-foreground, #ffffff); }
.label-danger  { background-color: var(--at-color-destructive, #dc2626);    color: var(--at-color-destructive-foreground, #ffffff); }
.label-default { background-color: var(--at-color-muted, #f1f5f9);          color: var(--at-color-muted-foreground, #5c6b81); border: 1px solid var(--at-color-border, #c1c7cf); }

/* ── Messages across the top of a page ───────────────────────────────── */
.alert-success { background-color: var(--at-color-status-success, #0d843a); color: var(--at-color-status-success-foreground, #ffffff); border-color: var(--at-color-status-success, #0d843a); }
.alert-warning { background-color: var(--at-color-status-warning, #b6640c); color: var(--at-color-status-warning-foreground, #ffffff); border-color: var(--at-color-status-warning, #b6640c); }
.alert-danger  { background-color: var(--at-color-destructive, #dc2626);    color: var(--at-color-destructive-foreground, #ffffff);    border-color: var(--at-color-destructive, #dc2626); }
.alert-info    { background-color: var(--at-color-status-info, var(--at-color-accent, #e2e8f0)); color: var(--at-color-status-info-foreground, var(--at-color-accent-foreground, #0f172a)); border-color: var(--at-color-status-info, var(--at-color-accent, #e2e8f0)); }
/* An alert carries a link and sometimes a close cross; both must follow
   the alert's own text colour or they vanish into the fill. */
.alert-success a, .alert-warning a, .alert-danger a, .alert-info a,
.alert .close {
    color: inherit;
}

/* ── The search band above the help articles ─────────────────────────── */
/* A wide band with a heading sitting on it. It arrives with a pale fill
   of its own, so on a dark theme the heading — which does follow the
   theme — was written in near-white on near-white. The band takes the
   Muted pair, which is the label meant for a quiet panel behind text. */
.jumbotron,
.kb-search-jumbotron {
    background-color: var(--at-color-muted, #f1f5f9);
    color: var(--at-color-muted-foreground, #5c6b81);
    /* An edge, not a louder fill (/contrast-shape-on-card.html). This band is
       the widest Muted-on-Card shape on the whole portal, so it is the one that
       looks most broken on the presets where the two colours coincide — the
       heading simply floats with no band behind it. */
    border: 1px solid var(--at-color-border, #c1c7cf);
}
.jumbotron h1, .jumbotron h2, .jumbotron h3,
.jumbotron p,
.kb-search-heading {
    color: var(--at-color-muted-foreground, #5c6b81);
}
/* The magnifier sits on top of the field, not the band, so it follows
   what is typed rather than the band behind it. */
.kb-search-icon,
.form-control-feedback {
    color: var(--at-color-card-foreground, #0f172a);
}

/* ── The line along the bottom ───────────────────────────────────────── */
.footer {
    background-color: var(--at-color-card, #ffffff);
    color: var(--at-color-muted-foreground, #5c6b81);
    border-top-color: var(--at-color-border, #c1c7cf);
}
.footer a,
.copyright-footer,
.terms-and-conditions-footer,
.gdpr-footer {
    color: var(--at-color-muted-foreground, #5c6b81);
}

/* ── Typefaces ───────────────────────────────────────────────────────── */
/* The workspace's chosen faces, same as the admin. Left as inherit-safe
   fallbacks so a theme that sets no font changes nothing at all. */
body {
    font-family: var(--at-font-body, inherit);
}
h1, h2, h3, h4, h5, h6,
.section-heading {
    font-family: var(--at-font-heading, inherit);
}

/* ── The Login button, on every signed-out portal page ───────────────────
   The platform theme pins it with `background:#2563eb !important` and
   `color:#fff !important` — a fixed brand blue that knows nothing about any
   workspace. A customer arriving at the Knowledge Base, the login page, the
   register page or the terms page therefore saw the tenant's own branding
   beside a stock blue button, on every preset that is not blue.

   An !important cannot be beaten by specificity, so this is the only shape
   that works — and it forwards the Theme Studio's "Default" button card rather
   than naming a colour, using the same three variables that card publishes for
   the file-picker control. The card stays the single source of truth; this only
   carries its answer past a rule that would not otherwise yield. Fallbacks are
   the tokens that card is seeded with.

   Hover derives from the same value with a filter rather than a second colour,
   so the pressed state can never drift away from the resting one on any preset.
   The theme file itself is the platform's and is not edited. */
.navbar-default .navbar-nav > li.customers-nav-item-login > a {
    background: var(--pd-cd-btn-default-bg, var(--at-color-primary, #2563eb)) !important;
    color: var(--pd-cd-btn-default-color, var(--at-color-primary-foreground, #ffffff)) !important;
    border: 1px solid var(--pd-cd-btn-default-border, var(--at-color-primary, #2563eb)) !important;
}
.navbar-default .navbar-nav > li.customers-nav-item-login > a:hover,
.navbar-default .navbar-nav > li.customers-nav-item-login > a:active,
.navbar-default .navbar-nav > li.customers-nav-item-login > a:focus {
    background: var(--pd-cd-btn-default-bg, var(--at-color-primary, #2563eb)) !important;
    color: var(--pd-cd-btn-default-color, var(--at-color-primary-foreground, #ffffff)) !important;
    filter: brightness(0.92);
}


/**
 * Customer Portal Shell — the one layout every portal page is built from.
 *
 * WHY THIS IS SHARED, WHEN NOTHING ELSE IS
 * ---------------------------------------------------------------------
 * Every other tool on this platform keeps its own DOM, classes and styling
 * so nothing can leak between them. This file is the deliberate exception,
 * agreed as a SINGLE SOURCE OF TRUTH: a customer's portal is one product to
 * the person using it, and six engines each keeping a private copy of the
 * same page furniture is six copies that drift the first time one is
 * missed. The card padding is changed here, once, and every page follows.
 *
 * It belongs to the portal theme layer, which already owns the portal's own
 * surfaces — the bar across the top, the help search band, the tabs.
 *
 * WHAT BELONGS IN HERE
 * ---------------------------------------------------------------------
 * Only furniture that more than one page needs: the page's own heading, a
 * section, a card, a field, a table, a row of figures, an empty state, a
 * save bar. Anything that belongs to ONE engine — Collect's money colouring,
 * Bond's photo control — stays in that engine's own stylesheet under its
 * own name. If it is only used once, it does not belong here.
 *
 * NOT ONE COLOUR IS DECIDED HERE
 * ---------------------------------------------------------------------
 * Headings, labels, links and paragraphs are left entirely to Theme Studio,
 * which paints them with a weight no class can beat — fighting it would be
 * pointless and wrong, because leaving it alone is what lets a re-labelling
 * in Theme Studio reach these pages. Surfaces prefer Theme Studio's own
 * compiled Card binding and fall back to the theme's Card labels, so a card
 * here matches a card anywhere else in the workspace.
 *
 * ⚠ A `<p>` is painted with the body-text label, so quiet paragraphs need
 * `class="text-muted"` alongside their own class — Theme Studio's muted rule
 * is emitted after its paragraph rule and wins. Without it every hint and
 * note quietly renders at full strength.
 *
 * MOBILE FIRST. The base rules are the phone. Everything after is a
 * min-width query on a Bootstrap tier — 576 / 768 / 992 / 1200. There is
 * not one max-width query in this file, and no !important anywhere.
 *
 * Namespace: sfp-* — grep-verified unused before it was written.
 */

/* ── The page ────────────────────────────────────────────────────────── */
/* Full width, with the same gutter the platform's own column would give.
   Portal views sit straight inside the theme's row, whose negative margins
   cancel the container's padding — without this the content touches the
   edge of a phone screen. The container caps itself, so a large monitor
   never spreads the content uncomfortably wide. */
.sfp {
    padding: 0 15px;
}

.sfp-head { margin: 0 0 20px; }

.sfp-title {
    margin: 0;
    font-weight: 700;
    font-size: clamp(20px, 1.05rem + 0.55vw, 26px);
    line-height: 1.25;
}
/* A measure, so a sentence never runs the full width of a big monitor and
   becomes hard to track back to. */
.sfp-sub {
    margin: 8px 0 0;
    max-width: 68ch;
    font-size: 14px;
    line-height: 1.55;
}

/* Something somebody needs to know before they try. A div rather than a
   paragraph on purpose: Theme Studio paints every paragraph with the
   body-text label, and this sits on the Info panel rather than on the page,
   so it takes the Info pair — which the theme guarantees reads together. */
.sfp-notice {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 20px;
    padding: 12px 14px;
    border-radius: 12px;
    background: var(--at-color-status-info-fill, var(--at-color-muted, #f1f5f9));
    color: var(--at-color-status-info-fill-foreground, var(--at-color-muted-foreground, #5c6b81));
    font-size: 13px;
    line-height: 1.5;
}
.sfp-notice-icon { margin-top: 2px; flex: 0 0 auto; }
.sfp-notice-text { min-width: 0; }

/* ── Figures across the top ──────────────────────────────────────────── */
/* Auto-fit, so the row decides its own column count from the space it has
   rather than from a set of widths guessed in advance. */
.sfp-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
    gap: 12px;
    margin: 0 0 20px;
}
.sfp-stat {
    min-width: 0;
    padding: 16px 18px;
    border: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
    border-radius: 14px;
    background: var(--pd-cd-card-bg, var(--at-color-card, #ffffff));
    color: var(--at-color-card-foreground, #0f172a);
}
.sfp-stat-num {
    display: block;
    font-size: clamp(20px, 1rem + 0.7vw, 26px);
    font-weight: 800;
    line-height: 1.15;
    overflow-wrap: anywhere;
}
.sfp-stat-lbl {
    display: block;
    margin-top: 5px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
}
/* Something that wants attention gets a coloured edge, never a coloured
   fill — a whole panel in the alert colour shouts at somebody who may
   simply not have opened the email yet. */
.sfp-stat-alert { border-color: var(--at-color-status-warning, #b6640c); }

/* ── Filters and the row they sit in ─────────────────────────────────── */
.sfp-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin: 0 0 16px;
}
.sfp-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
}
.sfp-filter {
    display: inline-flex;
    align-items: center;
    /* A filter may carry a count beside its name. Laying it out as a flex row
       swallows the plain space that used to separate them, so the gap is
       stated rather than left to a text node that is no longer there — which
       is how "All" and "3" ended up printed as "All3". */
    gap: 6px;
    min-height: 44px;
    padding: 0 14px;
    border: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
    border-radius: 999px;
    background: transparent;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
}
.sfp-filter:hover,
.sfp-filter:focus {
    border-color: var(--at-color-ring, var(--at-color-primary, #2563eb));
    text-decoration: none;
}
/* The one you are looking at. An edge in the link's own colour, so it can
   never be a colour that fails to read against what is behind it. */
.sfp-filter.active { border-color: currentColor; }

.sfp-spacer { margin-left: auto; }

/* ── Sections ────────────────────────────────────────────────────────── */
/* One per thing being changed or shown. On a phone the explanation stacks
   above its card, in reading order. */
.sfp-secs {
    display: grid;
    gap: 20px;
}
.sfp-sec {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    align-items: start;
}
.sfp-sec-head { min-width: 0; }
.sfp-sec-title {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
}
.sfp-sec-note {
    margin: 6px 0 0;
    font-size: 13px;
    line-height: 1.5;
}
.sfp-sec-body {
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
    border-radius: 14px;
    background: var(--pd-cd-card-bg, var(--at-color-card, #ffffff));
    /* The Card pair, kept together. Headings, labels, links and paragraphs
       in here are painted by Theme Studio and win over this on their own;
       it is here so any plain writing that is not one of those still takes
       the colour that belongs with this surface. */
    color: var(--at-color-card-foreground, #0f172a);
}
/* A card that saves on its own carries its own button, inside itself, so
   there is never a question of which button saves what. */
.sfp-sec-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
}
.sfp-sec-actions-note {
    margin: 0;
    margin-right: auto;
    font-size: 12px;
    line-height: 1.5;
}

/* A card with nothing alongside it — a list page, where there is no
   explanation to put in a left-hand column. */
.sfp-panel {
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
    border-radius: 14px;
    background: var(--pd-cd-card-bg, var(--at-color-card, #ffffff));
    color: var(--at-color-card-foreground, #0f172a);
}

/* ── Fields ──────────────────────────────────────────────────────────── */
.sfp-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
}
.sfp-field { min-width: 0; }
.sfp-field-wide { grid-column: 1 / -1; }

.sfp-field label {
    display: block;
    margin: 0 0 6px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
}
/* Comfortable to hit with a thumb, and the same height whichever kind of
   field it is, so a row of them lines up. */
.sfp-field .form-control {
    width: 100%;
    max-width: 100%;
    min-height: 44px;
    border-radius: 10px;
}
.sfp-textarea {
    min-height: 104px;
    resize: vertical;
}
/* The platform's own focus rule removes the outline and moves the edge
   colour only, which is easy to miss. The plain edge is set first, so a
   browser without color-mix still shows the moved edge and loses nothing. */
.sfp-field .form-control:focus {
    border-color: var(--at-color-ring, var(--at-color-primary, #2563eb));
}
@supports (background: color-mix(in srgb, red 50%, transparent)) {
    .sfp-field .form-control:focus {
        box-shadow: 0 0 0 3px color-mix(in srgb, var(--at-color-ring, var(--at-color-primary, #2563eb)) 26%, transparent);
    }
}
.sfp-hint {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.45;
}
/* A field somebody may read but not change should LOOK it, rather than look
   broken when it refuses to take a keystroke — so the fill quietens and the
   cursor stops pretending, but the writing keeps the field's own colour.
   Dimming the value would drop it to 3.64:1 on one shipped theme, and an
   address is content somebody came to the page to read. */
.sfp-field input[readonly],
.sfp-field textarea[readonly],
.sfp-field select[disabled] {
    background-color: var(--at-color-muted, #f1f5f9);
    color: var(--at-color-card-foreground, #0f172a);
    cursor: default;
    /* An edge, not a louder fill (/contrast-shape-on-card.html): a Muted fill
       on a Card is within 1.15:1 on every preset and identical on three, so a
       read-only field had no shape at all. Border keeps the theme's own hue. */
    border: 1px solid var(--at-color-border, #c1c7cf);
}

/* Whatever else the workspace asks its customers for. The platform builds
   that markup itself, so it is given room and otherwise left alone — the
   section's padding is wider than the row's own pull, which is what keeps it
   lined up with the fields above without a single override. */
.sfp-custom { min-width: 0; }

/* ── Things to tick ──────────────────────────────────────────────────── */
.sfp-opts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
    gap: 2px 14px;
}
/* A whole row is the target, not the small square — easier for everyone and
   necessary on a phone. */
.sfp-opt {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 44px;
    margin: 0;
    padding: 8px 10px;
    border: 1px solid transparent;
    border-radius: 10px;
    font-weight: 500;
    line-height: 1.4;
    cursor: pointer;
}
/* Hover and keyboard focus show an edge rather than a fill: an edge cannot
   make the writing on top of it unreadable on any theme. */
.sfp-opt:hover,
.sfp-opt:focus-within {
    border-color: var(--at-color-ring, var(--at-color-primary, #2563eb));
}
.sfp-opt input { flex: 0 0 auto; width: 16px; height: 16px; margin: 0; }
.sfp-opt-text { min-width: 0; }

/* ── Facts about one thing ───────────────────────────────────────────── */
/* Name and value, in pairs. Used wherever a page shows ONE thing rather
   than a list of them — a subscription, a ticket, an invoice. A grid, so
   the values line up down the page; on a phone the name sits above its
   value, because two columns inside 300px squeezes both. */
.sfp-facts {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px 18px;
    margin: 0;
}
.sfp-facts > div { display: grid; gap: 2px; min-width: 0; }
.sfp-facts dt {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    line-height: 1.4;
    color: var(--at-color-muted-foreground, #5c6b81);
}
.sfp-facts dd {
    margin: 0;
    font-size: 14px;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

/* ── Lists of things ─────────────────────────────────────────────────── */
/* PHONE FIRST, and this is the important part: a table is not a table here.
   Each row becomes its own labelled card, because a five-column table on a
   phone is either unreadable or something the whole page has to scroll
   sideways for. Every cell carries its column name in `data-label`, which
   is what makes the card version possible without a second copy of the
   markup. From 768px up it becomes a real table again. */
.sfp-table-wrap { min-width: 0; }
.sfp-table { width: 100%; border-collapse: collapse; }
.sfp-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}
.sfp-table, .sfp-table tbody, .sfp-table tr, .sfp-table td { display: block; width: 100%; }
.sfp-table tr {
    margin-bottom: 12px;
    border: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
    border-radius: 14px;
    background: var(--pd-cd-card-bg, var(--at-color-card, #ffffff));
    overflow: hidden;
}
.sfp-table td {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 11px 14px;
    text-align: right;
    color: var(--at-color-card-foreground, #0f172a);
    /* PHONE ONLY. In a card the value has a narrow column to itself, so a
       long reference or an email address has to be allowed to break or it
       pushes the card wider than the screen. In a real table it must NOT:
       letting a date break gives "01 Aug 202 / 6", and the column it was
       trying to protect ends up narrower still. Undone at 768. */
    overflow-wrap: anywhere;
}
/* Only where a label was actually given. A cell whose view forgot one used
   to render an empty box and squash the value against the right-hand edge;
   now it simply reads as a plain left-aligned line, which is wrong-ish but
   never looks broken. The checker in saved_scripts finds the missing ones. */
.sfp-table td:not([data-label]) {
    justify-content: flex-start;
    text-align: left;
}
.sfp-table td[data-label]::before {
    content: attr(data-label);
    flex: 0 0 auto;
    text-align: left;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--at-color-muted-foreground, #5c6b81);
}
.sfp-table tr td:last-child { border-bottom: 0; }
/* Somebody or something no longer active is shown quieter, not hidden. */
.sfp-row-quiet td { color: var(--at-color-muted-foreground, #5c6b81); }

.sfp-ref { font-weight: 700; }

/* WHAT SOMEBODY ACTUALLY TAPS IN A LIST. The invoice number, the ticket
   subject — these are the whole point of the row, and left to themselves
   they are the height of the writing, about 17px. That is fine for a mouse
   and far too small for a thumb, so up to the desktop tier the link is
   given a proper target and the row's own padding is eased back so it does
   not become a chunky row for the sake of it. From 992px up it goes back to
   being ordinary writing, where a pointer is doing the work. */
.sfp-table td a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
}
.sfp-num { font-variant-numeric: tabular-nums; }

/* A small round label — a status, a marker beside a name. Tinted rather
   than filled, with its writing in the theme's own quiet colour, which is
   the rule the theme studies settled on for anything that only exists in
   relation to what is around it.

   ⚠ IT CARRIES AN EDGE, AND HAS TO. Measured across all 66 shipped themes,
   the Muted surface sits within 1.15:1 of the Card it is drawn on, and on
   three of them the two are the same colour — so a chip relying on its FILL
   to be seen is a chip with no shape at all, just small capitals floating
   in a row. The edge is what makes it read as a badge. See the study
   "A shape drawn on a card". */
.sfp-tag {
    display: inline-block;
    white-space: nowrap;
    border: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
    padding: 2px 9px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;
    background: var(--at-color-muted, #f1f5f9);
    color: var(--at-color-muted-foreground, #5c6b81);
}

/* ── A list of things you can open ───────────────────────────────────── */
/* An article, a project, an app, a course — a title, a line about it, and
   the whole card is the link. A bigger target is easier for everyone and
   essential on a phone.
   ⚠ THE NAME CONTAINS "btn" ON PURPOSE. The portal paints every link with a
   rule far heavier than any class, which would wipe out the title and the
   summary inside the card — and the one thing that rule excludes is anything
   with "btn" in its class name. Renaming it breaks the card. */
.sfp-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
    gap: 14px;
}
.sfp-cardbtn {
    display: block;
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
    border-radius: 14px;
    background: var(--pd-cd-card-bg, var(--at-color-card, #ffffff));
    color: var(--at-color-card-foreground, #0f172a);
    text-decoration: none;
    transition: border-color .14s ease, transform .14s ease;
}
.sfp-cardbtn:hover,
.sfp-cardbtn:focus {
    border-color: var(--at-color-ring, var(--at-color-primary, #2563eb));
    text-decoration: none;
    color: var(--at-color-card-foreground, #0f172a);
    transform: translateY(-2px);
}
/* A card may lead with a picture of what it is — a chart type, an app, a
   kind of document. Sized in ems so it grows with the writing beside it. */
.sfp-card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4em;
    height: 2.4em;
    margin-bottom: 12px;
    border-radius: 10px;
    background: var(--at-color-muted, #f1f5f9);
    border: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
    font-size: 15px;
}
.sfp-card-title {
    display: block;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}
.sfp-card-note {
    display: block;
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.5;
}
.sfp-card-go {
    display: inline-block;
    margin-top: 10px;
    font-size: 12px;
    font-weight: 600;
}
@media (prefers-reduced-motion: reduce) {
    .sfp-cardbtn { transition: none; }
    .sfp-cardbtn:hover, .sfp-cardbtn:focus { transform: none; }
}

/* ── Going back ──────────────────────────────────────────────────────── */
.sfp-back {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 44px;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 600;
}

/* ── Something written to be read ────────────────────────────────────── */
/* A shared document, a ticket's messages. A measure it can be read at, and
   media that can never push the page wider than the screen. */
.sfp-prose {
    max-width: 76ch;
    font-size: 15px;
    line-height: 1.65;
    overflow-wrap: anywhere;
}
.sfp-prose h1, .sfp-prose h2, .sfp-prose h3 { margin: 24px 0 8px; line-height: 1.3; }
.sfp-prose > :first-child { margin-top: 0; }
.sfp-prose p { margin: 0 0 12px; }
.sfp-prose ul, .sfp-prose ol { margin: 0 0 12px; padding-inline-start: 22px; }
.sfp-prose img, .sfp-prose video, .sfp-prose iframe { max-width: 100%; height: auto; }
.sfp-prose pre { padding: 12px 14px; border-radius: 10px; overflow-x: auto; background: var(--at-color-muted, #f1f5f9); }
.sfp-prose code { padding: 1px 5px; border-radius: 5px; background: var(--at-color-muted, #f1f5f9); font-size: .92em; }
.sfp-prose pre code { padding: 0; background: none; }
.sfp-prose blockquote {
    margin: 0 0 12px;
    padding-inline-start: 14px;
    border-inline-start: 2px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
}
.sfp-prose table { width: 100%; border-collapse: collapse; margin: 0 0 12px; }
.sfp-prose th, .sfp-prose td {
    text-align: start;
    padding: 8px 10px;
    border-bottom: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
}

/* ── Nothing to show ─────────────────────────────────────────────────── */
.sfp-empty {
    padding: 44px 20px;
    text-align: center;
    border: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
    border-radius: 14px;
    background: var(--pd-cd-card-bg, var(--at-color-card, #ffffff));
    color: var(--at-color-muted-foreground, #5c6b81);
}
.sfp-empty .fa-solid,
.sfp-empty .fa-regular { font-size: 30px; opacity: .5; }
.sfp-empty p { margin: 12px 0 0; }

/* ── Saving ──────────────────────────────────────────────────────────── */
.sfp-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
}
.sfp-bar-note {
    margin: 0;
    margin-right: auto;
    font-size: 13px;
    line-height: 1.5;
}
.sfp-submit {
    width: 100%;
    min-height: 44px;
    padding-left: 22px;
    padding-right: 22px;
    border-radius: 10px;
    font-weight: 600;
}

/* ── Odds and ends ───────────────────────────────────────────────────── */
.sfp-note {
    margin: 0;
    max-width: 68ch;
    font-size: 13px;
    line-height: 1.55;
}
.sfp-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    font-size: 14px;
    font-weight: 600;
}
.sfp-secs-next { margin-top: 26px; }

/* ── 576px and up — a phone on its side, and small tablets ──────────── */
@media (min-width: 576px) {
    .sfp-sec-body,
    .sfp-panel { padding: 20px; }
    .sfp-facts { grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)); }
    .sfp-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sfp-submit { width: auto; }
}

/* ── 768px and up — a list becomes a real table again ────────────────── */
@media (min-width: 768px) {
    .sfp-head { margin-bottom: 24px; }
    .sfp-secs { gap: 24px; }
    .sfp-sec-body,
    .sfp-panel { padding: 22px; }

    .sfp-table-wrap {
        overflow-x: auto;
        border: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
        border-radius: 14px;
        background: var(--pd-cd-card-bg, var(--at-color-card, #ffffff));
    }
    /* A table inside a card does not need a second edge around itself. */
    .sfp-panel > .sfp-table-wrap,
    .sfp-sec-body > .sfp-table-wrap {
        border: 0;
        border-radius: 0;
        background: transparent;
    }
    .sfp-table { display: table; }
    .sfp-table thead {
        position: static;
        width: auto;
        height: auto;
        clip: auto;
        clip-path: none;
        display: table-header-group;
    }
    .sfp-table tbody { display: table-row-group; }
    .sfp-table tr {
        display: table-row;
        margin-bottom: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
    }
    .sfp-table th {
        padding: 11px 14px;
        text-align: left;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .04em;
        white-space: nowrap;
        color: var(--at-color-muted-foreground, #5c6b81);
        background: var(--at-color-table-header-bg, var(--at-color-muted, #f1f5f9));
        border-bottom: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
    }
    .sfp-table td {
        display: table-cell;
        text-align: left;
        vertical-align: middle;
        /* Eased back, because a row here already carries a 44px link inside
           it — see the note beside `.sfp-table td a`. Put back at 992. */
        padding: 4px 14px;
        border-bottom: 1px solid var(--pd-cd-card-border, var(--at-color-border, #c1c7cf));
    }
    /* Matched with the attribute, exactly as the base rule is. Without it
       this reset is the weaker of the two and every column keeps its label
       printed beside the value — a table with its own headings AND a label
       on every cell, which is what happened the first time. */
    .sfp-table td[data-label]::before { content: none; }
    .sfp-table td { overflow-wrap: normal; }
    /* Dates, money and statuses read as one thing and should not be broken
       up to make room for a column that can simply take the space instead. */
    .sfp-table td.sfp-num,
    .sfp-table td.sfp-nowrap { white-space: nowrap; }
    .sfp-table tbody tr:last-child td { border-bottom: 0; }
    .sfp-table th.sfp-num,
    .sfp-table td.sfp-num { text-align: right; }

    /* WHO GETS THE LEFTOVER WIDTH. A table sized automatically hands spare
       space out as it sees fit, and browsers hand a surprising amount of it
       to the first column — a statement ended up with a 751px Date column
       and an 86px Entry column, so "Invoice INV-0001" wrapped onto three
       lines beside an acre of nothing.
       Asking for 1% is the long-standing way of saying "take only what you
       need": a column can never actually be 1% of the table, so it settles
       at its content width and everything left over goes to the columns that
       can genuinely use it — the subject, the name, the description. */
    .sfp-table th.sfp-num,
    .sfp-table td.sfp-num,
    .sfp-table th.sfp-nowrap,
    .sfp-table td.sfp-nowrap { width: 1%; }
}

/* ── 992px and up — the explanation moves alongside the fields ───────── */
@media (min-width: 992px) {
    /* A pointer is doing the work from here, so a link in a list goes back
       to being ordinary writing and the row takes its proper padding. */
    .sfp-table td a {
        display: inline;
        min-height: 0;
    }
    .sfp-table td { padding: 13px 14px; }

    .sfp-sec {
        grid-template-columns: minmax(200px, 250px) minmax(0, 1fr);
        gap: 28px;
    }
    .sfp-sec-head { padding-top: 2px; }
    .sfp-sec-body,
    .sfp-panel { padding: 24px; }
}

/* ── 1200px and up ───────────────────────────────────────────────────── */
@media (min-width: 1200px) {
    .sfp-secs { gap: 26px; }
    .sfp-sec {
        grid-template-columns: minmax(240px, 290px) minmax(0, 1fr);
        gap: 32px;
    }
}


/**
 * Customer Portal Tabs — the shape of the bar across the top.
 *
 * WHAT THIS FILE DOES, AND ONLY THIS
 * ---------------------------------------------------------------------
 * Room for the icon beside each label, a comfortable target to tap, and a
 * mark under the tab somebody is on. Shape and spacing — nothing else.
 *
 * NOT ONE COLOUR IS WRITTEN HERE. The bar's own colours, the tab colours
 * and the current-tab colours are already Theme Studio's, on its "Top Bar
 * Text" and "Top Bar — Current" cards. The mark under the current tab is
 * drawn in `currentColor`, which means the link's own colour, whatever
 * Theme Studio has decided that is — so it follows a re-labelling on its
 * own, and can never be a colour that fails to read against the bar,
 * because it IS the colour of the writing next to it.
 *
 * MOBILE FIRST. The base rules are the stacked menu a phone shows. The
 * bar only becomes a row of tabs at 768px, which is where the platform's
 * own menu stops collapsing — so the two agree by construction rather than
 * by a number picked to look right.
 *
 * NO !important, and every rule is scoped to the customer area's own bar.
 */

/* ── The tabs themselves ─────────────────────────────────────────────── */
/* The photo menu at the end is not a tab and is left alone. */
.navbar.navbar-default .navbar-nav > li:not(.customers-nav-item-profile) > a {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;          /* comfortable under a thumb */
    font-weight: 600;

    /* Phone: the menu is a stacked list, so the mark for the current one
       belongs down its leading edge. The space is reserved on every tab,
       not added to the current one, or the text would shift sideways as
       you moved between pages. */
    border-left: 3px solid transparent;
}

.navbar.navbar-default .navbar-nav > li:not(.customers-nav-item-profile) > a > i {
    flex: 0 0 auto;
    width: 1.15em;             /* one column, so every label starts in line */
    font-size: 0.95em;
    text-align: center;
}

/* The tab you are on. `currentColor` and nothing else — see the note above. */
.navbar.navbar-default .navbar-nav > li.active:not(.customers-nav-item-profile) > a,
.navbar.navbar-default .navbar-nav > li.active:not(.customers-nav-item-profile) > a:hover,
.navbar.navbar-default .navbar-nav > li.active:not(.customers-nav-item-profile) > a:focus {
    border-left-color: currentColor;
}

/* ── 768px and up — the bar becomes a row of tabs ────────────────────── */
/* This is the width at which the platform's own menu stops collapsing. */
@media (min-width: 768px) {
    .navbar.navbar-default .navbar-nav > li:not(.customers-nav-item-profile) > a {
        justify-content: center;
        border-left: 0;
        /* Reserved on every tab, for the same reason as above: nothing may
           move by two pixels as somebody changes page. */
        border-bottom: 2px solid transparent;
        border-radius: 8px 8px 0 0;
    }

    .navbar.navbar-default .navbar-nav > li.active:not(.customers-nav-item-profile) > a,
    .navbar.navbar-default .navbar-nav > li.active:not(.customers-nav-item-profile) > a:hover,
    .navbar.navbar-default .navbar-nav > li.active:not(.customers-nav-item-profile) > a:focus {
        border-left-color: transparent;
        border-bottom-color: currentColor;
    }
}

/* ── 992px and up — a little more room around each label ─────────────── */
@media (min-width: 992px) {
    .navbar.navbar-default .navbar-nav > li:not(.customers-nav-item-profile) > a {
        gap: 9px;
    }
}


/* ═══════════════════════════════════════════════════════════════════════
   GROUPED TABS

   Four things across the top, with the rest tucked under them. The bar is
   drawn by pd_portal_tabs_boot.php through the platform's own opening hook,
   because the customer theme prints a flat list and has never read the
   `children` the platform's menu carries — and that theme folder cannot be
   edited, being replaced on update and renamed when white-labelled.

   The platform's own flat copies of everything re-drawn above are put away
   here, matched on the mark the same file leaves on them. An entry nothing
   speaks for is never marked, so it is never hidden: a new engine's tab
   simply follows the groups, out in the open.

   Still not one colour. The dropdown is the platform's own, so Theme
   Studio's dropdown cards paint it exactly as they paint the photo menu.
   ═══════════════════════════════════════════════════════════════════════ */

/* The flat originals of the entries the grouped bar re-draws. */
.navbar.navbar-default .navbar-nav > li[data-pdtab-grouped] {
    display: none;
}

/* A group's own tab wears the same shape as a plain one. The rules above
   reach it already — they are written for every li that is not the photo
   menu — so all that is needed here is room for the little arrow. */
.navbar.navbar-default .navbar-nav > li.pdtab-group > a > .caret {
    margin-left: 2px;
    flex: 0 0 auto;
}

/* Inside an open group. Comfortable to tap, and the icon sits in the same
   column as every other so the labels line up. */
.navbar.navbar-default .navbar-nav .dropdown-menu > li.pdtab-child > a {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 44px;
    font-weight: 500;
}
.navbar.navbar-default .navbar-nav .dropdown-menu > li.pdtab-child > a > i {
    flex: 0 0 auto;
    width: 1.15em;
    font-size: 0.95em;
    text-align: center;
}

/* The page you are on, seen from inside its group. An edge on the leading
   side rather than a fill, in the link's own colour — so it can never be a
   colour that fails to read, and never needs one writing here. */
.navbar.navbar-default .navbar-nav .dropdown-menu > li.pdtab-child > a {
    border-left: 3px solid transparent;
}
.navbar.navbar-default .navbar-nav .dropdown-menu > li.pdtab-child.active > a {
    border-left-color: currentColor;
}

/* ── 768px and up ────────────────────────────────────────────────────── */
@media (min-width: 768px) {
    /* A group opens as a real panel here, so it gets a little breathing
       room of its own; on a phone it stays part of the stacked list, which
       is the platform's own behaviour and the right one. */
    .navbar.navbar-default .navbar-nav > li.pdtab-group > .dropdown-menu {
        min-width: 220px;
        padding-top: 6px;
        padding-bottom: 6px;
    }
}

/* ═══════════════════════════════════════════════════════════════════════
   THE LANGUAGE LIST, OPENING THE RIGHT WAY

   The photo menu sits hard against the right-hand edge of the page, and the
   list of languages inside it was flying out to the RIGHT — off the screen
   by about 46px on a 1440 monitor, which put a sideways scrollbar on the
   whole page. Chasing the menu with the pointer then closed it, so the list
   could not be reached at all.

   It now opens to the LEFT, back across the page it came from, where there
   is always room. Everything else about it is untouched.

   Matched with enough weight to beat the platform's own two rules for this
   (`.dropdown-submenu > .dropdown-menu` and its pull-left variant) without
   an !important — this is scoped to the customer bar, which those are not.

   ⚠ Only above 768px. Below that the whole bar collapses into a stacked
   list where nothing flies out at all, and forcing a side onto it there
   would push the languages off the LEFT edge instead.
   ═══════════════════════════════════════════════════════════════════════ */
@media (min-width: 768px) {
    .navbar.navbar-default .navbar-nav .dropdown-submenu > .dropdown-menu {
        left: auto;
        right: 100%;
        margin-left: 0;
        margin-right: -1px;
    }

    /* A long list should never run past the bottom of the screen either.
       It keeps its own scrolling; this simply stops it being taller than
       the window it has to fit in. */
    .navbar.navbar-default .navbar-nav .dropdown-submenu > .dropdown-menu {
        max-height: min(500px, 70vh);
    }
}


/* ═══════════════════════════════════════════════════════════════════════
   A QUIETER BAR  (2026-08-24)

   WHY IT CHANGED. The tab you were on sat in a hard grey rectangle, and
   pointing at any tab drew the same rectangle. Every current design system
   worth copying — Linear, Vercel, Raycast, Attio — has moved the other way:
   nothing is filled, the thing you are on is simply full-strength writing
   with a hairline under it, and pointing at something brings a line in
   rather than switching a box on. Restraint, not decoration.

   HOW IT IS DONE. Styling only. No element is added to the bar and no
   script runs — which is exactly why the previous attempt failed: it hung a
   real list item on the end of the menu, which widened the row and left an
   unplaced circle sitting in the gap. There is nothing here to place.

   COLOUR. Still nothing decided here. The line is `currentColor`, so it is
   the colour of the writing beside it and can never fail to read against the
   bar. The one colour named below is `--at-color-topbar-fg` — the token the
   theme already uses for a normal tab — put back on the current tab because
   the fill it used to sit on has gone. Pairing topbar text with the topbar
   background is the pair Theme Studio itself guarantees, on every preset.

   ⚠ 768px AND UP ONLY. Below that the platform collapses the bar into a
   stacked list, where the leading-edge mark this file already draws is the
   right answer and is left alone.
   ═══════════════════════════════════════════════════════════════════════ */

@media (min-width: 768px) {
    /* ⚠ THE GREY FILL IS NOT TOUCHED HERE, ON PURPOSE.
       It looks like a leftover. It is not: it is Theme Studio's own
       "Top Bar — Current" card, seeded to the Muted pair, and a workspace can
       change it. Out-specifying it from this file would take the bar away from
       that card for good — re-label it in Theme Studio afterwards and nothing
       would happen. So the fill stays a setting, and this file adds only the
       things Theme Studio has no card for: where the line sits and how it
       moves. If the boxless look is wanted, that is a change to the card, not
       to this stylesheet. */

    /* ⚠ THE SIGN-IN PILL IS EXCLUDED FROM THE LINE, AND HAS TO BE.
       On the signed-out pages the theme turns that one entry into a rounded
       brand-filled button and forces its writing white with !important. The
       line below is drawn in `currentColor`, so on that pill it would be a
       WHITE bar — sitting two pixels BELOW a rounded button, i.e. outside the
       shape, on the white bar behind it. Invisible, and geometrically wrong
       even if it were not. It is a button, not a tab; it does not want a tab's
       underline. */

    /* The line itself. It lives on a pseudo-element, so nothing is added to
       the page, and it grows out from the middle rather than blinking on.
       The 2px the file already reserves as a transparent bottom border stays
       reserved, so nothing on the bar ever moves by a pixel. */
    .navbar.navbar-default .navbar-nav > li:not(.customers-nav-item-profile) > a {
        position: relative;
    }

    .navbar.navbar-default .navbar-nav > li:not(.customers-nav-item-profile):not(.customers-nav-item-login) > a::after {
        content: "";
        position: absolute;
        bottom: -2px;              /* sits in the reserved border track */
        left: 50%;
        right: 50%;
        height: 2px;
        border-radius: 2px;
        background-color: currentColor;
        opacity: 0;
        transition:
            left    170ms cubic-bezier(0.4, 0, 0.2, 1),
            right   170ms cubic-bezier(0.4, 0, 0.2, 1),
            opacity 170ms ease;
        pointer-events: none;
    }

    /* Pointing at a tab, or reaching it with the keyboard: the line arrives
       from the centre, and stays a little softer than the real thing so the
       two can never be confused. */
    .navbar.navbar-default .navbar-nav > li:not(.customers-nav-item-profile):not(.customers-nav-item-login) > a:hover::after,
    .navbar.navbar-default .navbar-nav > li:not(.customers-nav-item-profile):not(.customers-nav-item-login) > a:focus::after,
    .navbar.navbar-default .navbar-nav > li.open:not(.customers-nav-item-profile):not(.customers-nav-item-login) > a::after {
        left: 14px;
        right: 14px;
        opacity: 0.45;
    }

    /* The page you are actually on. Full strength, and already there. */
    .navbar.navbar-default .navbar-nav > li.active:not(.customers-nav-item-profile):not(.customers-nav-item-login) > a::after {
        left: 14px;
        right: 14px;
        opacity: 1;
    }

    /* The old border-drawn mark is retired — the line above replaces it, and
       two marks saying the same thing is exactly the clutter being removed.
       The transparent border stays: it is what reserves the space. */
    .navbar.navbar-default .navbar-nav > li.active:not(.customers-nav-item-profile) > a,
    .navbar.navbar-default .navbar-nav > li.active:not(.customers-nav-item-profile) > a:hover,
    .navbar.navbar-default .navbar-nav > li.active:not(.customers-nav-item-profile) > a:focus {
        border-bottom-color: transparent;
    }
}

/* ── A panel arriving ────────────────────────────────────────────────── */
/*
 * It used to appear instantly, which is the one thing that reads as old on
 * an otherwise tidy bar. It now fades up four pixels.
 *
 * ⚠ WHY visibility AND NOT display. Nothing can animate out of
 * `display:none`. The panel therefore stays laid out and is hidden with
 * `visibility`, which can be held back until the fade has finished. It is
 * absolutely positioned, so nothing on the page moves because of this, and
 * `visibility:hidden` cannot be clicked — a closed panel is as unreachable
 * as it ever was.
 *
 * OURS ONLY. The photo menu and the language list belong to the platform
 * and behave exactly as they always have.
 */
@media (min-width: 768px) {
    .navbar.navbar-default .navbar-nav > li.pdtab-group > .dropdown-menu {
        display: block;
        visibility: hidden;
        opacity: 0;
        transform: translateY(-4px);
        transition:
            opacity    150ms ease,
            transform  150ms cubic-bezier(0.4, 0, 0.2, 1),
            visibility 0s linear 150ms;
    }

    .navbar.navbar-default .navbar-nav > li.pdtab-group.open > .dropdown-menu {
        visibility: visible;
        opacity: 1;
        transform: translateY(0);
        transition:
            opacity    150ms ease,
            transform  150ms cubic-bezier(0.4, 0, 0.2, 1),
            visibility 0s linear 0s;
    }
}

/* ── Anybody who would rather things did not move ────────────────────── */
/* All of it still WORKS — the line still marks the right tab and the panel
   still opens. It arrives instead of travelling. */
@media (prefers-reduced-motion: reduce) {
    .navbar.navbar-default .navbar-nav > li:not(.customers-nav-item-profile):not(.customers-nav-item-login) > a::after,
    .navbar.navbar-default .navbar-nav > li.pdtab-group > .dropdown-menu,
    .navbar.navbar-default .navbar-nav > li.pdtab-group.open > .dropdown-menu {
        transition: none;
    }
    .navbar.navbar-default .navbar-nav > li.pdtab-group > .dropdown-menu {
        transform: none;
    }
}


/* ── The phone menu button, big enough to hit ─────────────────────────── */
/*
 * Measured at 44 wide by 34 TALL on a phone — ten pixels under the floor a
 * thumb needs. It is the one control on the whole bar at that width, so it
 * is the last one that should be fiddly.
 *
 * ⚠ ITS COLOUR IS FINE. A contrast checker calls this button black-on-black,
 * which is a false positive: the three bars are FILLED SHAPES, not writing,
 * so a reader that takes an element's own background as its backdrop compares
 * the bar with itself. Measured properly the bars come out near-black on the
 * white bar behind them — about seventeen to one. Nothing here changes a
 * colour, and the "Mobile Menu Button" card in Theme Studio still owns it.
 *
 * Base layer on purpose: the button only exists below 768px, which is the
 * width the platform stops collapsing at, so this needs no query of its own.
 */
.navbar.navbar-default .navbar-toggle {
    min-height: 44px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* ⚠ AND PUT IT AWAY AGAIN ABOVE 768. Giving the button `display: flex` to
   centre its bars overrode the platform's own `display: none` at tablet width
   and up, so the phone menu button appeared on desktop beside the full row of
   tabs. Saying `none` here explicitly restores exactly what the platform does,
   at exactly the width it does it — the same 768 the rest of this file turns
   on at, so the two can never disagree. */
@media (min-width: 768px) {
    .navbar.navbar-default .navbar-toggle {
        display: none;
    }
}


/* Component Designer — generated 2026-09-01T20:18:48Z */

html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-default, html:not(#__pdcd_) body:not(#__pdcd_) .btn.emblem-btn-primary, html:not(#__pdcd_) body:not(#__pdcd_) .tbeng-ring-back, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-fbtn.is-on, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-fbtn.is-on, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-fbtn.is-on, html:not(#__pdcd_) body:not(#__pdcd_) .acd-btn-primary, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-portal-btn, html:not(#__pdcd_) body:not(#__pdcd_) .threads-new-btn, html:not(#__pdcd_) body:not(#__pdcd_) .threads-filter-active, html:not(#__pdcd_) body:not(#__pdcd_) .books-btn-primary, html:not(#__pdcd_) body:not(#__pdcd_) .books-upload-label {
    background-color: #2563eb;
    border-color: #2563eb;
    color: #ffffff;
}
:root {
    --pd-cd-btn-default-bg: #2563eb;
    --pd-cd-btn-default-color: #ffffff;
    --pd-cd-btn-default-border: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-default:hover, html:not(#__pdcd_) body:not(#__pdcd_) .btn.emblem-btn-primary:hover, html:not(#__pdcd_) body:not(#__pdcd_) .tbeng-ring-back:hover, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-fbtn.is-on:hover, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-fbtn.is-on:hover, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-fbtn.is-on:hover, html:not(#__pdcd_) body:not(#__pdcd_) .acd-btn-primary:hover, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-portal-btn:hover, html:not(#__pdcd_) body:not(#__pdcd_) .threads-new-btn:hover, html:not(#__pdcd_) body:not(#__pdcd_) .threads-filter-active:hover, html:not(#__pdcd_) body:not(#__pdcd_) .books-btn-primary:hover, html:not(#__pdcd_) body:not(#__pdcd_) .books-upload-label:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-default:focus, html:not(#__pdcd_) body:not(#__pdcd_) .btn.emblem-btn-primary:focus, html:not(#__pdcd_) body:not(#__pdcd_) .tbeng-ring-back:focus, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-fbtn.is-on:focus, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-fbtn.is-on:focus, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-fbtn.is-on:focus, html:not(#__pdcd_) body:not(#__pdcd_) .acd-btn-primary:focus, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-portal-btn:focus, html:not(#__pdcd_) body:not(#__pdcd_) .threads-new-btn:focus, html:not(#__pdcd_) body:not(#__pdcd_) .threads-filter-active:focus, html:not(#__pdcd_) body:not(#__pdcd_) .books-btn-primary:focus, html:not(#__pdcd_) body:not(#__pdcd_) .books-upload-label:focus,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-default:active, html:not(#__pdcd_) body:not(#__pdcd_) .btn.emblem-btn-primary:active, html:not(#__pdcd_) body:not(#__pdcd_) .tbeng-ring-back:active, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-fbtn.is-on:active, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-fbtn.is-on:active, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-fbtn.is-on:active, html:not(#__pdcd_) body:not(#__pdcd_) .acd-btn-primary:active, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-portal-btn:active, html:not(#__pdcd_) body:not(#__pdcd_) .threads-new-btn:active, html:not(#__pdcd_) body:not(#__pdcd_) .threads-filter-active:active, html:not(#__pdcd_) body:not(#__pdcd_) .books-btn-primary:active, html:not(#__pdcd_) body:not(#__pdcd_) .books-upload-label:active {
    background-color: color-mix(in srgb, #2563eb 75%, black);
    border-color: color-mix(in srgb, #2563eb 75%, black);
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-default:visited, html:not(#__pdcd_) body:not(#__pdcd_) .btn.emblem-btn-primary:visited, html:not(#__pdcd_) body:not(#__pdcd_) .tbeng-ring-back:visited, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-fbtn.is-on:visited, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-fbtn.is-on:visited, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-fbtn.is-on:visited, html:not(#__pdcd_) body:not(#__pdcd_) .acd-btn-primary:visited, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-portal-btn:visited, html:not(#__pdcd_) body:not(#__pdcd_) .threads-new-btn:visited, html:not(#__pdcd_) body:not(#__pdcd_) .threads-filter-active:visited, html:not(#__pdcd_) body:not(#__pdcd_) .books-btn-primary:visited, html:not(#__pdcd_) body:not(#__pdcd_) .books-upload-label:visited {
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-default:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .btn.emblem-btn-primary:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .tbeng-ring-back:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-fbtn.is-on:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-fbtn.is-on:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-fbtn.is-on:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .acd-btn-primary:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-portal-btn:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .threads-new-btn:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .threads-filter-active:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .books-btn-primary:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .books-upload-label:visited:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-default:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .btn.emblem-btn-primary:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .tbeng-ring-back:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-fbtn.is-on:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-fbtn.is-on:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-fbtn.is-on:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .acd-btn-primary:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-portal-btn:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .threads-new-btn:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .threads-filter-active:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .books-btn-primary:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .books-upload-label:visited:focus {
    background-color: color-mix(in srgb, #2563eb 75%, black);
    border-color: color-mix(in srgb, #2563eb 75%, black);
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-primary, html:not(#__pdcd_) body:not(#__pdcd_) .books-btn {
    background-color: #ffffff;
    border-color: #2563eb;
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-primary:hover, html:not(#__pdcd_) body:not(#__pdcd_) .books-btn:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-primary:focus, html:not(#__pdcd_) body:not(#__pdcd_) .books-btn:focus,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-primary:active, html:not(#__pdcd_) body:not(#__pdcd_) .books-btn:active {
    background-color: color-mix(in srgb, #ffffff 90%, black);
    border-color: color-mix(in srgb, #ffffff 90%, black);
    color: #1f2937;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-primary:visited, html:not(#__pdcd_) body:not(#__pdcd_) .books-btn:visited {
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-primary:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .books-btn:visited:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-primary:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .books-btn:visited:focus {
    background-color: color-mix(in srgb, #ffffff 90%, black);
    border-color: color-mix(in srgb, #ffffff 90%, black);
    color: #1f2937;
}

html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-info {
    background-color: transparent;
    border-color: #2563eb;
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-info:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-info:focus,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-info:active {
    background-color: #eef3fd;
    border-color: #eef3fd;
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-info:visited {
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-info:visited:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-info:visited:focus {
    background-color: #eef3fd;
    border-color: #eef3fd;
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-success, html:not(#__pdcd_) body:not(#__pdcd_) .btn.emblem-btn-success {
    background-color: #157347;
    border-color: #ffffff;
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-success:hover, html:not(#__pdcd_) body:not(#__pdcd_) .btn.emblem-btn-success:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-success:focus, html:not(#__pdcd_) body:not(#__pdcd_) .btn.emblem-btn-success:focus,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-success:active, html:not(#__pdcd_) body:not(#__pdcd_) .btn.emblem-btn-success:active {
    background-color: color-mix(in srgb, #157347 90%, black);
    border-color: color-mix(in srgb, #157347 90%, black);
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-success:visited, html:not(#__pdcd_) body:not(#__pdcd_) .btn.emblem-btn-success:visited {
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-success:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .btn.emblem-btn-success:visited:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-success:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .btn.emblem-btn-success:visited:focus {
    background-color: color-mix(in srgb, #157347 90%, black);
    border-color: color-mix(in srgb, #157347 90%, black);
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-warning {
    background-color: #8f5f00;
    border-color: #ffffff;
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-warning:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-warning:focus,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-warning:active {
    background-color: color-mix(in srgb, #8f5f00 90%, black);
    border-color: color-mix(in srgb, #8f5f00 90%, black);
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-warning:visited {
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-warning:visited:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-warning:visited:focus {
    background-color: color-mix(in srgb, #8f5f00 90%, black);
    border-color: color-mix(in srgb, #8f5f00 90%, black);
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-danger {
    background-color: #b02a37;
    border-color: #ffffff;
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-danger:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-danger:focus,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-danger:active {
    background-color: #df8b2b;
    border-color: #df8b2b;
    color: #2d3643;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-danger:visited {
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-danger:visited:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-danger:visited:focus {
    background-color: #df8b2b;
    border-color: #df8b2b;
    color: #2d3643;
}

html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-link {
    background-color: transparent;
    border-color: transparent;
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-link:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-link:focus,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-link:active {
    background-color: color-mix(in srgb, transparent 85%, black);
    border-color: color-mix(in srgb, transparent 85%, black);
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-link:visited {
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-link:visited:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .btn.btn-link:visited:focus {
    background-color: color-mix(in srgb, transparent 85%, black);
    border-color: color-mix(in srgb, transparent 85%, black);
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) h1:not(.tw-text-white):not(.email-template-heading), html:not(#__pdcd_) body:not(#__pdcd_) h2:not(.tw-text-white):not(.email-template-heading), html:not(#__pdcd_) body:not(#__pdcd_) h3:not(.tw-text-white):not(.email-template-heading), html:not(#__pdcd_) body:not(#__pdcd_).customers .section-heading {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) h4:not(.tw-text-white):not(.email-template-heading), html:not(#__pdcd_) body:not(#__pdcd_) h5:not(.tw-text-white):not(.email-template-heading), html:not(#__pdcd_) body:not(#__pdcd_) h6:not(.tw-text-white):not(.email-template-heading) {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_), html:not(#__pdcd_) body:not(#__pdcd_) p, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-gname, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-gname, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-rlabel, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-rlabel, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-head, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-head, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-title, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-mod-name, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-page-label, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-item-head, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-global-label {
    color: #2563eb;
}
:root {
    --pd-cd-body-text: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .text-muted, html:not(#__pdcd_) body:not(#__pdcd_) .help-block, html:not(#__pdcd_) body:not(#__pdcd_) a.text-muted:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]), html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-fbtn:not(.is-on), html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-fbtn:not(.is-on), html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-fbtn:not(.is-on), html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-count, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-count, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-count, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-result, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-result, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-result, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-sub, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-sub, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-sub, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-note, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-note, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-gid, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-gid, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-rid, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-rid, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-gsection, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-rwhat, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-rwhere, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-state, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-state, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-state, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-expand, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-expand, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-legend-item, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-chevron, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-mod-slug, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-page-id, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-page-parent, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-empty, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-global-hint, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-gicon, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-gicon, html:not(#__pdcd_) body:not(#__pdcd_) .sfp-facts dt, html:not(#__pdcd_) body:not(#__pdcd_) .sfp-row-quiet td, html:not(#__pdcd_) body:not(#__pdcd_) .sfp-empty, html:not(#__pdcd_) body:not(#__pdcd_) .sfp-table td[data-label]::before, html:not(#__pdcd_) body:not(#__pdcd_) .acd-muted, html:not(#__pdcd_) body:not(#__pdcd_) .acd-empty, html:not(#__pdcd_) body:not(#__pdcd_) .acd-gm-stat, html:not(#__pdcd_) body:not(#__pdcd_) .bpp-pct, html:not(#__pdcd_) body:not(#__pdcd_) .threads-conv-snippet, html:not(#__pdcd_) body:not(#__pdcd_) .threads-conv-time, html:not(#__pdcd_) body:not(#__pdcd_) .threads-conv-muted, html:not(#__pdcd_) body:not(#__pdcd_) .threads-empty, html:not(#__pdcd_) body:not(#__pdcd_) .threads-placeholder, html:not(#__pdcd_) body:not(#__pdcd_) .threads-thread-sub, html:not(#__pdcd_) body:not(#__pdcd_) .threads-search-result small, html:not(#__pdcd_) body:not(#__pdcd_) .pd-prj-empty-text, html:not(#__pdcd_) body:not(#__pdcd_) .pd-prj-empty-icon, html:not(#__pdcd_) body:not(#__pdcd_) .pd-prj-no-home, html:not(#__pdcd_) body:not(#__pdcd_) .pd-prj-modal-help, html:not(#__pdcd_) body:not(#__pdcd_) .pd-prj-modal-note, html:not(#__pdcd_) body:not(#__pdcd_) .pd-dash-blank {
    color: #546ea5;
}
:root {
    --pd-cd-muted-text: #546ea5;
}

html:not(#__pdcd_) body:not(#__pdcd_) a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]) {
    color: #2563eb;
}
:root {
    --pd-cd-link-text: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):hover,
html:not(#__pdcd_) body:not(#__pdcd_) a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):focus,
html:not(#__pdcd_) body:not(#__pdcd_) a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):active {
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):visited {
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):visited:hover,
html:not(#__pdcd_) body:not(#__pdcd_) a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):visited:focus {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) #header, html:not(#__pdcd_) body:not(#__pdcd_).customers .navbar.navbar-default.header, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-topbar {
    background-color: #ffffff;
    border-color: #a9b2c4;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-sidebar {
    background-color: #f6f9fe;
    border-color: transparent;
}

html:not(#__pdcd_) body:not(#__pdcd_) #wrapper, html:not(#__pdcd_) body:not(#__pdcd_) .content, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-page {
    background-color: #ffffff;
    border-color: transparent;
}

html:not(#__pdcd_) body:not(#__pdcd_) #sfj-pa-grid, html:not(#__pdcd_) body:not(#__pdcd_) #sfj-pat-grid, html:not(#__pdcd_) body:not(#__pdcd_) #sfj-paf-grid, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-accordion, html:not(#__pdcd_) body:not(#__pdcd_) .panel_s, html:not(#__pdcd_) body:not(#__pdcd_) .panel_s > .panel-body, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-setc-card, html:not(#__pdcd_) body:not(#__pdcd_) .acd-panel, html:not(#__pdcd_) body:not(#__pdcd_) .acd-card, html:not(#__pdcd_) body:not(#__pdcd_) .bconn-card, html:not(#__pdcd_) body:not(#__pdcd_) .bcn-block, html:not(#__pdcd_) body:not(#__pdcd_) .bond-card, html:not(#__pdcd_) body:not(#__pdcd_) .bond-toolbar, html:not(#__pdcd_) body:not(#__pdcd_) .bond-360-head, html:not(#__pdcd_) body:not(#__pdcd_) .bond-note-item, html:not(#__pdcd_) body:not(#__pdcd_) .bp-health-strip, html:not(#__pdcd_) body:not(#__pdcd_) .bp-phase-row, html:not(#__pdcd_) body:not(#__pdcd_) .bp-dep-row, html:not(#__pdcd_) body:not(#__pdcd_) .bp-baseline-row, html:not(#__pdcd_) body:not(#__pdcd_) .bpg-phase, html:not(#__pdcd_) body:not(#__pdcd_) .chase-panel, html:not(#__pdcd_) body:not(#__pdcd_) .chase-lead-panel, html:not(#__pdcd_) body:not(#__pdcd_) .collect-card, html:not(#__pdcd_) body:not(#__pdcd_) .cp-card, html:not(#__pdcd_) body:not(#__pdcd_) .cpx-card, html:not(#__pdcd_) body:not(#__pdcd_) .cpx-opp-card, html:not(#__pdcd_) body:not(#__pdcd_) .dd-card, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-card, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-brand-card, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-asset-card, html:not(#__pdcd_) body:not(#__pdcd_) .flowx-tpl-card, html:not(#__pdcd_) body:not(#__pdcd_) .flowx-approval-row, html:not(#__pdcd_) body:not(#__pdcd_) .fs-panel, html:not(#__pdcd_) body:not(#__pdcd_) .harvest-card, html:not(#__pdcd_) body:not(#__pdcd_) .harvest-lead-panel, html:not(#__pdcd_) body:not(#__pdcd_) .harvest-step, html:not(#__pdcd_) body:not(#__pdcd_) .kiosk-card, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-card, html:not(#__pdcd_) body:not(#__pdcd_) .line-card, html:not(#__pdcd_) body:not(#__pdcd_) .nurture-card, html:not(#__pdcd_) body:not(#__pdcd_) .nurture-subnav, html:not(#__pdcd_) body:not(#__pdcd_) .proxy-card, html:not(#__pdcd_) body:not(#__pdcd_) .radar-card, html:not(#__pdcd_) body:not(#__pdcd_) .relay-card, html:not(#__pdcd_) body:not(#__pdcd_) .roster-card, html:not(#__pdcd_) body:not(#__pdcd_) .rw-panel, html:not(#__pdcd_) body:not(#__pdcd_) .sage-card, html:not(#__pdcd_) body:not(#__pdcd_) .sage-settings-card, html:not(#__pdcd_) body:not(#__pdcd_) .sage-health-card, html:not(#__pdcd_) body:not(#__pdcd_) .sfaic-fieldset, html:not(#__pdcd_) body:not(#__pdcd_) .sfaic-res-provider-panel, html:not(#__pdcd_) body:not(#__pdcd_) .sfdplc-card, html:not(#__pdcd_) body:not(#__pdcd_) .threads-panel, html:not(#__pdcd_) body:not(#__pdcd_) .threads-shell, html:not(#__pdcd_) body:not(#__pdcd_) .verdict-card, html:not(#__pdcd_) body:not(#__pdcd_) .warden-panel, html:not(#__pdcd_) body:not(#__pdcd_) .warden-ev-frameworks, html:not(#__pdcd_) body:not(#__pdcd_) .warden-ev-item, html:not(#__pdcd_) body:not(#__pdcd_) .wrap-panel, html:not(#__pdcd_) body:not(#__pdcd_) .beacon-stat, html:not(#__pdcd_) body:not(#__pdcd_) .books-card, html:not(#__pdcd_) body:not(#__pdcd_) .books-stat, html:not(#__pdcd_) body:not(#__pdcd_) .bp-tile-plain, html:not(#__pdcd_) body:not(#__pdcd_) .bp-digest-item, html:not(#__pdcd_) body:not(#__pdcd_) .bp-ai-preview, html:not(#__pdcd_) body:not(#__pdcd_) .collect-stat, html:not(#__pdcd_) body:not(#__pdcd_) .collect-seq, html:not(#__pdcd_) body:not(#__pdcd_) .cpx-tile, html:not(#__pdcd_) body:not(#__pdcd_) .cpx-disc-card, html:not(#__pdcd_) body:not(#__pdcd_) .craftx-preview-block, html:not(#__pdcd_) body:not(#__pdcd_) .craftx-assistant, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-brand-hero, html:not(#__pdcd_) body:not(#__pdcd_) .fjk-card, html:not(#__pdcd_) body:not(#__pdcd_) .fjk-stats, html:not(#__pdcd_) body:not(#__pdcd_) .fjb-editor, html:not(#__pdcd_) body:not(#__pdcd_) .harvest-subnav, html:not(#__pdcd_) body:not(#__pdcd_) .insight-tile-chip, html:not(#__pdcd_) body:not(#__pdcd_) .kiosk-stat, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-stat, html:not(#__pdcd_) body:not(#__pdcd_) .line-stat, html:not(#__pdcd_) body:not(#__pdcd_) .lns-panel, html:not(#__pdcd_) body:not(#__pdcd_) .lns-collection-tile, html:not(#__pdcd_) body:not(#__pdcd_) .proxy-builder-step, html:not(#__pdcd_) body:not(#__pdcd_) .radar-rv-content, html:not(#__pdcd_) body:not(#__pdcd_) .relay-pipe, html:not(#__pdcd_) body:not(#__pdcd_) .sage-registry-strip, html:not(#__pdcd_) body:not(#__pdcd_) .shp-panel, html:not(#__pdcd_) body:not(#__pdcd_) .sourcer-panel, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-card, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-board-card, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-toolbar, html:not(#__pdcd_) body:not(#__pdcd_) .talent-panel, html:not(#__pdcd_) body:not(#__pdcd_) .talent-appr-preview, html:not(#__pdcd_) body:not(#__pdcd_) .talent-lead-panel, html:not(#__pdcd_) body:not(#__pdcd_) .warden-lead-panel, html:not(#__pdcd_) body:not(#__pdcd_) .warden-appr-preview, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-portal-column, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-portal-card, html:not(#__pdcd_) body:not(#__pdcd_) .threads-sidebar, html:not(#__pdcd_) body:not(#__pdcd_) .threads-thread-head, html:not(#__pdcd_) body:not(#__pdcd_) .threads-search-results {
    background-color: #f6f9fe !important;
    border-color: #a9b2c4 !important;
}
:root {
    --pd-cd-card-bg: #f6f9fe;
    --pd-cd-card-border: #a9b2c4;
}

html:not(#__pdcd_) body:not(#__pdcd_) .control-label, html:not(#__pdcd_) body:not(#__pdcd_) label {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .table > thead > tr > th, html:not(#__pdcd_) body:not(#__pdcd_) .cmoney-table > thead > tr > th, html:not(#__pdcd_) body:not(#__pdcd_) .pxm-table > thead > tr > th, html:not(#__pdcd_) body:not(#__pdcd_) .pxc-table > thead > tr > th, html:not(#__pdcd_) body:not(#__pdcd_) .sfp-table th {
    background-color: #f0f4fe;
    border-color: #a9b2c4;
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .table > tbody > tr > td, html:not(#__pdcd_) body:not(#__pdcd_) table.bond-table > tbody > tr > td, html:not(#__pdcd_) body:not(#__pdcd_) .cmoney-table > tbody > tr > td, html:not(#__pdcd_) body:not(#__pdcd_) .pxm-table > tbody > tr > td, html:not(#__pdcd_) body:not(#__pdcd_) .pxc-table > tbody > tr > td, html:not(#__pdcd_) body:not(#__pdcd_).customers .table > tfoot > tr > td, html:not(#__pdcd_) body:not(#__pdcd_).customers .table-hover > tbody > tr:hover > td, html:not(#__pdcd_) body:not(#__pdcd_) .sfp-table td {
    background-color: #f6f9fe;
    border-color: #a9b2c4;
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .nav-tabs:not(.nav-tabs-horizontal) > li > a:not(.btn):not(.label):not(.badge):not(.dropdown-toggle), html:not(#__pdcd_) body:not(#__pdcd_) .emblem-tab {
    background-color: #f0f4fe;
    border-color: #878e9d;
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .nav-tabs:not(.nav-tabs-horizontal) > li > a:not(.btn):not(.label):not(.badge):not(.dropdown-toggle):hover, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-tab:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .nav-tabs:not(.nav-tabs-horizontal) > li > a:not(.btn):not(.label):not(.badge):not(.dropdown-toggle):focus, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-tab:focus,
html:not(#__pdcd_) body:not(#__pdcd_) .nav-tabs:not(.nav-tabs-horizontal) > li > a:not(.btn):not(.label):not(.badge):not(.dropdown-toggle):active, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-tab:active {
    background-color: #0b36a3;
    border-color: #0b36a3;
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .nav-tabs:not(.nav-tabs-horizontal) > li.active > a:not(.btn):not(.label):not(.badge), html:not(#__pdcd_) body:not(#__pdcd_) .nav-tabs:not(.nav-tabs-horizontal) > li.active > a:not(.btn):not(.label):not(.badge):hover, html:not(#__pdcd_) body:not(#__pdcd_) .nav-tabs:not(.nav-tabs-horizontal) > li.active > a:not(.btn):not(.label):not(.badge):focus, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-tab.is-on, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-tab.is-on:hover, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-tab.is-on:focus {
    background-color: #0b36a3;
    border-color: #0b36a3;
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .nav-tabs:not(.nav-tabs-horizontal) > li > a:not(.btn):not(.label):not(.badge):not(.dropdown-toggle):visited, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-tab:visited {
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .nav-tabs:not(.nav-tabs-horizontal) > li > a:not(.btn):not(.label):not(.badge):not(.dropdown-toggle):visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-tab:visited:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .nav-tabs:not(.nav-tabs-horizontal) > li > a:not(.btn):not(.label):not(.badge):not(.dropdown-toggle):visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-tab:visited:focus {
    background-color: #0b36a3;
    border-color: #0b36a3;
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .nav-tabs:not(.nav-tabs-horizontal) > li.active > a:not(.btn):not(.label):not(.badge):visited, html:not(#__pdcd_) body:not(#__pdcd_) .nav-tabs:not(.nav-tabs-horizontal) > li.active > a:not(.btn):not(.label):not(.badge):hover:visited, html:not(#__pdcd_) body:not(#__pdcd_) .nav-tabs:not(.nav-tabs-horizontal) > li.active > a:not(.btn):not(.label):not(.badge):focus:visited, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-tab.is-on:visited, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-tab.is-on:hover:visited, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-tab.is-on:focus:visited {
    background-color: #0b36a3;
    border-color: #0b36a3;
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu, html:not(#__pdcd_) body:not(#__pdcd_) .acd-contact-results, html:not(#__pdcd_) body:not(#__pdcd_) .bp-wl-pop, html:not(#__pdcd_) body:not(#__pdcd_) .fjb-expr-panel, html:not(#__pdcd_) body:not(#__pdcd_) .kiosk-cs-results, html:not(#__pdcd_) body:not(#__pdcd_) .recall-rel-results, html:not(#__pdcd_) body:not(#__pdcd_) .relay-rel-results, html:not(#__pdcd_) body:not(#__pdcd_) .sourcer-pop, html:not(#__pdcd_) body:not(#__pdcd_) .threads-dropdown-menu, html:not(#__pdcd_) body:not(#__pdcd_) .wrap-pop {
    background-color: #f6f9fe;
    border-color: #a9b2c4;
}
html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu > li > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]), html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu > li > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):visited {
    color: #2563eb;
}
:root {
    --pd-cd-dropdown-open-bg: #f6f9fe;
    --pd-cd-dropdown-open-color: #2563eb;
    --pd-cd-dropdown-open-border: #a9b2c4;
}
html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu > li > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):hover, html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu > li > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):focus, html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu > li > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):active {
    background-color: #2563eb;
    border-color: #2563eb;
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu > li.active > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]), html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu > li.active > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):hover, html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu > li.active > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):focus, html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu > li.selected > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]), html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu > li.selected > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):hover, html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu > li.selected > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):focus {
    background-color: #2563eb;
    border-color: #2563eb;
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]), html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li > span:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]) {
    background-color: #f6f9fe;
    border-color: #878e9d;
    color: #2563eb;
}
:root {
    --pd-cd-num-bg: #f6f9fe;
    --pd-cd-num-color: #2563eb;
    --pd-cd-num-border: #878e9d;
}
html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):hover, html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li > span:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):hover,
html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):focus, html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li > span:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):focus,
html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):active, html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li > span:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):active {
    background-color: #2563eb;
    border-color: #2563eb;
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li.active > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]), html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li.active > span:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]), html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li.active > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):hover, html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li.active > span:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):hover {
    background-color: #2563eb;
    border-color: #2563eb;
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):visited, html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li > span:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):visited {
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li > span:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):visited:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li > span:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):visited:focus {
    background-color: #2563eb;
    border-color: #2563eb;
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li.active > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):visited, html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li.active > span:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):visited, html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li.active > a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):hover:visited, html:not(#__pdcd_) body:not(#__pdcd_) .pagination > li.active > span:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]):hover:visited {
    background-color: #2563eb;
    border-color: #2563eb;
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .breadcrumb {
    background-color: #f6f9fe;
}
html:not(#__pdcd_) body:not(#__pdcd_) .breadcrumb, html:not(#__pdcd_) body:not(#__pdcd_) .breadcrumb > li + li:before {
    color: #546ea5;
}


html:not(#__pdcd_) body:not(#__pdcd_) .tooltip-inner {
    background-color: #2563eb;
    color: #ffffff;
}


html:not(#__pdcd_) body:not(#__pdcd_) .table i:not(.btn *):not(.label *):not(.badge *), html:not(#__pdcd_) body:not(#__pdcd_) .table .fa:not(.btn *):not(.label *):not(.badge *) {
    color: #2563eb;
}



html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu a, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu .menu-text, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu li > a, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item .pd-cd-cnv-mock-menu-text {
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu li > a:hover, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu li > a:focus, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu li > a:hover .menu-text, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu li > a:focus .menu-text, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item:hover .pd-cd-cnv-mock-menu-text, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item.is-hover .pd-cd-cnv-mock-menu-text {
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu a:visited, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu .menu-text:visited, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu li > a:visited, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item:visited, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item .pd-cd-cnv-mock-menu-text:visited {
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu a:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu .menu-text:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu li > a:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item .pd-cd-cnv-mock-menu-text:visited:hover,
html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu a:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu .menu-text:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu li > a:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item .pd-cd-cnv-mock-menu-text:visited:focus {
    background-color: #2563eb;
    border-color: #2563eb;
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu li.active > a:visited, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu li.active > a .menu-text:visited, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item.is-active:visited, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item.is-active .pd-cd-cnv-mock-menu-text:visited {
    background-color: #2563eb;
    border-color: #2563eb;
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) #header .navbar-nav > li > a, html:not(#__pdcd_) body:not(#__pdcd_) #header .navbar-nav > li > a > svg, html:not(#__pdcd_) body:not(#__pdcd_) #header .navbar-nav > li > a > svg path, html:not(#__pdcd_) body:not(#__pdcd_) #header .navbar-nav > li > a > i, html:not(#__pdcd_) body:not(#__pdcd_) #header .navbar-nav > li > a > .fa, html:not(#__pdcd_) body:not(#__pdcd_) #header .navbar-nav.navbar-right > li > a > span > i, html:not(#__pdcd_) body:not(#__pdcd_) #header .navbar-nav.navbar-right > li > a > span > .fa, html:not(#__pdcd_) body:not(#__pdcd_) #header #top_search_button button > i, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-topbar-icons > i, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-topbar-icons .pd-cd-cnv-mock-user > i {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) #search_input, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-search {
    background-color: #e0e9fc;
    border-color: #a9b2c4;
}
html:not(#__pdcd_) body:not(#__pdcd_) #search_input, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-search > input {
    color: #245cd5;
}
html:not(#__pdcd_) body:not(#__pdcd_) #search_input::placeholder, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-search > input::placeholder {
    color: #2960d6;
}

html:not(#__pdcd_) body:not(#__pdcd_) .panel.panel-default, html:not(#__pdcd_) body:not(#__pdcd_) .well, html:not(#__pdcd_) body:not(#__pdcd_) .panel.panel-default > .panel-body, html:not(#__pdcd_) body:not(#__pdcd_).customers .panel, html:not(#__pdcd_) body:not(#__pdcd_).customers .panel > .panel-body, html:not(#__pdcd_) body:not(#__pdcd_).customers .panel > .panel-heading, html:not(#__pdcd_) body:not(#__pdcd_).customers .panel > .panel-footer {
    background-color: #f6f9fe !important;
    border-color: #a9b2c4 !important;
}

html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .modal-header {
    background-color: #2563eb;
    border-color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .modal-header .modal-title, html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .modal-header > .close {
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .modal-content > .modal-body, html:not(#__pdcd_) body:not(#__pdcd_) .acd-modal-box, html:not(#__pdcd_) body:not(#__pdcd_) .bond-modal-box {
    background-color: #f6f9fe;
    border-color: #a9b2c4;
}
html:not(#__pdcd_) body:not(#__pdcd_) .modal-content > .modal-body p {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .btn.btn-default, html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .btn.btn-primary {
    background-color: #2563eb;
    border-color: #2563eb;
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .btn.btn-default:hover, html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .btn.btn-primary:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .btn.btn-default:focus, html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .btn.btn-primary:focus,
html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .btn.btn-default:active, html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .btn.btn-primary:active {
    background-color: color-mix(in srgb, #2563eb 90%, black);
    border-color: color-mix(in srgb, #2563eb 90%, black);
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .btn.btn-default:visited, html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .btn.btn-primary:visited {
    color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .btn.btn-default:visited:hover, html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .btn.btn-primary:visited:hover,
html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .btn.btn-default:visited:focus, html:not(#__pdcd_) body:not(#__pdcd_) .modal-content .btn.btn-primary:visited:focus {
    background-color: color-mix(in srgb, #2563eb 90%, black);
    border-color: color-mix(in srgb, #2563eb 90%, black);
    color: #ffffff;
}


html:not(#__pdcd_) body:not(#__pdcd_) .popover .popover-title {
    background-color: #f6f9fe;
    border-color: #a9b2c4;
}
html:not(#__pdcd_) body:not(#__pdcd_) .popover .popover-title {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .popover .popover-content {
    background-color: #f6f9fe;
    border-color: #a9b2c4;
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .popover {
    border-color: #a9b2c4;
}

html:not(#__pdcd_) body:not(#__pdcd_) .content h1:not(.tw-text-white) > i, html:not(#__pdcd_) body:not(#__pdcd_) .content h1:not(.tw-text-white) > .fa, html:not(#__pdcd_) body:not(#__pdcd_) .content h2:not(.tw-text-white) > i, html:not(#__pdcd_) body:not(#__pdcd_) .content h2:not(.tw-text-white) > .fa, html:not(#__pdcd_) body:not(#__pdcd_) .content h3:not(.tw-text-white) > i, html:not(#__pdcd_) body:not(#__pdcd_) .content h3:not(.tw-text-white) > .fa, html:not(#__pdcd_) body:not(#__pdcd_) .content h4:not(.tw-text-white) > i, html:not(#__pdcd_) body:not(#__pdcd_) .content h4:not(.tw-text-white) > .fa, html:not(#__pdcd_) body:not(#__pdcd_) .panel-heading > i, html:not(#__pdcd_) body:not(#__pdcd_) .panel-heading > .fa, html:not(#__pdcd_) body:not(#__pdcd_) .panel-heading > h3 > i, html:not(#__pdcd_) body:not(#__pdcd_) .panel-heading > h3 > .fa, html:not(#__pdcd_) body:not(#__pdcd_) .panel-heading > h4 > i, html:not(#__pdcd_) body:not(#__pdcd_) .panel-heading > h4 > .fa, html:not(#__pdcd_) body:not(#__pdcd_) .alert > i, html:not(#__pdcd_) body:not(#__pdcd_) .alert > .fa, html:not(#__pdcd_) body:not(#__pdcd_) .modal-content > .modal-header .modal-title > i, html:not(#__pdcd_) body:not(#__pdcd_) .modal-content > .modal-header .modal-title > .fa, html:not(#__pdcd_) body:not(#__pdcd_) .modal-header > i, html:not(#__pdcd_) body:not(#__pdcd_) .modal-header > .fa, html:not(#__pdcd_) body:not(#__pdcd_) .panel-heading > a > i, html:not(#__pdcd_) body:not(#__pdcd_) .panel-heading > a > .fa, html:not(#__pdcd_) body:not(#__pdcd_) .popover-title > i, html:not(#__pdcd_) body:not(#__pdcd_) .popover-title > .fa, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-page-icon {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li:not(.active) > a .menu-icon, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item > .pd-cd-cnv-mock-menu-icon:not(.pd-cd-cnv-mock-menu-icon--active):not(.pd-cd-cnv-mock-menu-icon--hover) {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li:not(.active) > a:hover .menu-icon, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li:not(.active) > a:focus .menu-icon, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-icon--hover {
    color: #103889;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li.active > a, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li.active > a .menu-text, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item.is-active .pd-cd-cnv-mock-menu-text.pd-cd-cnv-mock-menu-text--active {
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li.active > a .menu-icon, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li.active > a .arrow, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li.active > a .sk-omse-gcaret, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-icon--active, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-caret {
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li.active > a, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item.is-active {
    background-color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li.active > a, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-indicator {
    border-color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li:not(.active) > a:hover, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li:not(.active) > a:focus, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item.is-hover, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-item:not(.is-active):hover {
    background-color: color-mix(in srgb, #2563eb 18%, transparent);
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li > ul.nav-second-level > li > a, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li > ul.nav-second-level > li > a > .sub-menu-text, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-submenu-item:not(.is-hover):not(.is-active) .pd-cd-cnv-mock-submenu-text {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li > ul.nav-second-level > li:not(.active) > a:hover, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li > ul.nav-second-level > li:not(.active) > a:focus, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li > ul.nav-second-level > li:not(.active) > a:hover > .sub-menu-text, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li > ul.nav-second-level > li:not(.active) > a:focus > .sub-menu-text, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-submenu-item.is-hover .pd-cd-cnv-mock-submenu-text {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li > ul.nav-second-level > li.active > a, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li > ul.nav-second-level > li.active > a > .sub-menu-text, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-submenu-item.is-active .pd-cd-cnv-mock-submenu-text {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu .badge, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-badge {
    background-color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu .badge, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-badge {
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li.header, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li.menu-header, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-section {
    color: #546ea5;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > li.divider, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu > hr, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-separator {
    background-color: #a9b2c4;
    border-color: #a9b2c4;
}

html:not(#__pdcd_) body:not(#__pdcd_).mini-sidebar aside.sidebar #side-menu .menu-text, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-collapsed-text {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_).mini-sidebar aside.sidebar #side-menu > li > a .menu-icon, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-collapsed-icon {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar::-webkit-scrollbar-thumb, html:not(#__pdcd_) body:not(#__pdcd_) aside.sidebar #side-menu::-webkit-scrollbar-thumb, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-menu-scrollbar-thumb {
    background-color: #f0f4fe;
}

html:not(#__pdcd_) body:not(#__pdcd_) input.form-control:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not([type="submit"]):not([type="button"]):not([type="reset"]), html:not(#__pdcd_) body:not(#__pdcd_) input.emblem-input, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-portal-input {
    background-color: #e0e9fc;
    border-color: #878e9d;
    color: #245cd5;
}
:root {
    --pd-cd-input-bg: #e0e9fc;
    --pd-cd-input-text: #245cd5;
    --pd-cd-input-border: #878e9d;
}
html:not(#__pdcd_) body:not(#__pdcd_) input.form-control:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not([type="submit"]):not([type="button"]):not([type="reset"])::placeholder, html:not(#__pdcd_) body:not(#__pdcd_) input.emblem-input::placeholder, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-portal-input::placeholder {
    color: #2960d6;
}

html:not(#__pdcd_) body:not(#__pdcd_) select.form-control {
    background-color: #e0e9fc;
    border-color: #878e9d;
    color: #245cd5;
}
html:not(#__pdcd_) body:not(#__pdcd_) select.form-control::placeholder {
    color: #2960d6;
}

html:not(#__pdcd_) body:not(#__pdcd_) textarea.form-control {
    background-color: #e0e9fc;
    border-color: #878e9d;
    color: #245cd5;
}
html:not(#__pdcd_) body:not(#__pdcd_) textarea.form-control::placeholder {
    color: #2960d6;
}

html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-status-trigger, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-pill-normalised {
    background-color: #ffffff;
    border-color: #2563eb;
    color: #2563eb;
}
:root {
    --pd-cd-dropdown-default-bg: #ffffff;
    --pd-cd-dropdown-default-color: #2563eb;
    --pd-cd-dropdown-default-border: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .onoffswitch-label, html:not(#__pdcd_) body:not(#__pdcd_) .bond-slider, html:not(#__pdcd_) body:not(#__pdcd_) .roster-slider, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-slider, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-slider, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-slider, html:not(#__pdcd_) body:not(#__pdcd_) .rw-switch-slider, html:not(#__pdcd_) body:not(#__pdcd_) .bconn-switch-track, html:not(#__pdcd_) body:not(#__pdcd_) .shield-switch label {
    background-color: #a9b2c4;
    border-color: #878e9d;
}
html:not(#__pdcd_) body:not(#__pdcd_) .onoffswitch-label::before, html:not(#__pdcd_) body:not(#__pdcd_) .bond-slider::before, html:not(#__pdcd_) body:not(#__pdcd_) .roster-slider::before, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-slider::before, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-slider::before, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-slider::before, html:not(#__pdcd_) body:not(#__pdcd_) .rw-switch-slider::before, html:not(#__pdcd_) body:not(#__pdcd_) .bconn-switch-track::after, html:not(#__pdcd_) body:not(#__pdcd_) .shield-switch label::after {
    background-color: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .onoffswitch-checkbox:checked + .onoffswitch-label, html:not(#__pdcd_) body:not(#__pdcd_) .bond-switch input:checked + .bond-slider, html:not(#__pdcd_) body:not(#__pdcd_) .roster-switch input:checked + .roster-slider, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-switch input:checked + .sfj-pa-slider, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-switch input:checked + .sfj-pat-slider, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-switch input:checked + .sfj-paf-slider, html:not(#__pdcd_) body:not(#__pdcd_) .rw-switch input:checked + .rw-switch-slider, html:not(#__pdcd_) body:not(#__pdcd_) .bconn-switch input:checked + .bconn-switch-track, html:not(#__pdcd_) body:not(#__pdcd_) .shield-switch input:checked + label {
    background-color: #2563eb;
    border-color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .onoffswitch-checkbox:checked + .onoffswitch-label::before, html:not(#__pdcd_) body:not(#__pdcd_) .bond-switch input:checked + .bond-slider::before, html:not(#__pdcd_) body:not(#__pdcd_) .roster-switch input:checked + .roster-slider::before, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-switch input:checked + .sfj-pa-slider::before, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-switch input:checked + .sfj-pat-slider::before, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-switch input:checked + .sfj-paf-slider::before, html:not(#__pdcd_) body:not(#__pdcd_) .rw-switch input:checked + .rw-switch-slider::before, html:not(#__pdcd_) body:not(#__pdcd_) .bconn-switch input:checked + .bconn-switch-track::after, html:not(#__pdcd_) body:not(#__pdcd_) .shield-switch input:checked + label::after {
    background-color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .badge:not(.bg-success):not(.bg-warning):not(.bg-danger):not(.bg-info), html:not(#__pdcd_) body:not(#__pdcd_) .emblem-status, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-badge, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pat-badge, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-paf-badge, html:not(#__pdcd_) body:not(#__pdcd_) .sfp-tag, html:not(#__pdcd_) body:not(#__pdcd_) .acd-chip-muted {
    background-color: #f0f4fe;
    color: #546ea5;
}

html:not(#__pdcd_) body:not(#__pdcd_) .label-default {
    background-color: #f0f4fe;
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .label-primary {
    background-color: #2563eb;
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .label-success, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-dot-tenant, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-status-approved, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-status-active, html:not(#__pdcd_) body:not(#__pdcd_) .line-label-active, html:not(#__pdcd_) body:not(#__pdcd_) .line-label-product, html:not(#__pdcd_) body:not(#__pdcd_) .acd-chip-status.acd-chip-published, html:not(#__pdcd_) body:not(#__pdcd_) .acd-chip-status.acd-chip-completed, html:not(#__pdcd_) body:not(#__pdcd_) .beacon-badge-sent, html:not(#__pdcd_) body:not(#__pdcd_) .beacon-badge-sub-subscribed, html:not(#__pdcd_) body:not(#__pdcd_) .bond-health.good, html:not(#__pdcd_) body:not(#__pdcd_) .bond-sentiment.positive, html:not(#__pdcd_) body:not(#__pdcd_) .bond-cap.is-live, html:not(#__pdcd_) body:not(#__pdcd_) .collect-label-on, html:not(#__pdcd_) body:not(#__pdcd_) .collect-label-cn-2, html:not(#__pdcd_) body:not(#__pdcd_) .cpx-kind-pitch, html:not(#__pdcd_) body:not(#__pdcd_) .cpx-mom-rising, html:not(#__pdcd_) body:not(#__pdcd_) .cpx-st-enabled, html:not(#__pdcd_) body:not(#__pdcd_) .craftx-chip-ok, html:not(#__pdcd_) body:not(#__pdcd_) .flowx-status-active, html:not(#__pdcd_) body:not(#__pdcd_) .flowx-status-completed, html:not(#__pdcd_) body:not(#__pdcd_) .harvest-chip.ok, html:not(#__pdcd_) body:not(#__pdcd_) .insight-pill-on, html:not(#__pdcd_) body:not(#__pdcd_) .kiosk-badge-on, html:not(#__pdcd_) body:not(#__pdcd_) .kiosk-badge-paid, html:not(#__pdcd_) body:not(#__pdcd_) .kiosk-badge-completed, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-pill-ok, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-pill-astatus-active, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-jstatus-posted, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-astatus-posted, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-fil-approved, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-fil-filed, html:not(#__pdcd_) body:not(#__pdcd_) .nurture-chip.ok, html:not(#__pdcd_) body:not(#__pdcd_) .pe-cap-badge, html:not(#__pdcd_) body:not(#__pdcd_) .radar-chip-ok, html:not(#__pdcd_) body:not(#__pdcd_) .recall-status-ready, html:not(#__pdcd_) body:not(#__pdcd_) .recall-sentiment-positive, html:not(#__pdcd_) body:not(#__pdcd_) .relay-status-won, html:not(#__pdcd_) body:not(#__pdcd_) .roster-chip.ok, html:not(#__pdcd_) body:not(#__pdcd_) .roster-attr-band.band-low, html:not(#__pdcd_) body:not(#__pdcd_) .rw-risk-safe, html:not(#__pdcd_) body:not(#__pdcd_) .sage-pill-ok, html:not(#__pdcd_) body:not(#__pdcd_) .sourcer-chip-ordered, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-chip-success, html:not(#__pdcd_) body:not(#__pdcd_) .verdict-risk-good, html:not(#__pdcd_) body:not(#__pdcd_) .wrap-chip-approved, html:not(#__pdcd_) body:not(#__pdcd_) .wrap-chip-delivered {
    background-color: #157347;
    border-color: #ffffff;
    border-style: solid;
    border-width: 1px;
    color: #ffffff;
}
:root {
    --pd-cd-badge-success-bg: #157347;
    --pd-cd-badge-success-text: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .label-warning, html:not(#__pdcd_) body:not(#__pdcd_) .sfj-pa-dot-internal, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-status-identity, html:not(#__pdcd_) body:not(#__pdcd_) .emblem-status-ready, html:not(#__pdcd_) body:not(#__pdcd_) .acd-chip-status.acd-chip-draft, html:not(#__pdcd_) body:not(#__pdcd_) .bconn-status-pending, html:not(#__pdcd_) body:not(#__pdcd_) .bond-health.warm, html:not(#__pdcd_) body:not(#__pdcd_) .bond-urg.soon, html:not(#__pdcd_) body:not(#__pdcd_) .bp-wl-busy, html:not(#__pdcd_) body:not(#__pdcd_) .collect-label-cn-1, html:not(#__pdcd_) body:not(#__pdcd_) .collect-label-paused, html:not(#__pdcd_) body:not(#__pdcd_) .cpx-kind-price, html:not(#__pdcd_) body:not(#__pdcd_) .cpx-st-suspended, html:not(#__pdcd_) body:not(#__pdcd_) .craftx-chip-warn, html:not(#__pdcd_) body:not(#__pdcd_) .dd-flag-draft, html:not(#__pdcd_) body:not(#__pdcd_) .flowx-status-paused, html:not(#__pdcd_) body:not(#__pdcd_) .flowx-status-waiting, html:not(#__pdcd_) body:not(#__pdcd_) .harvest-chip.warm, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-astatus-draft, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-fil-awaiting_signoff, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-jstatus-draft, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-pill-astatus-fully_depreciated, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-pill-medium, html:not(#__pdcd_) body:not(#__pdcd_) .nurture-chip.band-warm, html:not(#__pdcd_) body:not(#__pdcd_) .pd-blog-pnl-pill-sched, html:not(#__pdcd_) body:not(#__pdcd_) .radar-sig-mid, html:not(#__pdcd_) body:not(#__pdcd_) .recall-status-processing, html:not(#__pdcd_) body:not(#__pdcd_) .roster-chip.warn, html:not(#__pdcd_) body:not(#__pdcd_) .rw-pv-badge, html:not(#__pdcd_) body:not(#__pdcd_) .rw-risk-moderate, html:not(#__pdcd_) body:not(#__pdcd_) .sage-pill-warn, html:not(#__pdcd_) body:not(#__pdcd_) .sprint-chip-warning, html:not(#__pdcd_) body:not(#__pdcd_) .verdict-flag-warning, html:not(#__pdcd_) body:not(#__pdcd_) .verdict-flag-sev, html:not(#__pdcd_) body:not(#__pdcd_) .verdict-risk-warning {
    background-color: #8f5f00;
    border-color: #ffffff;
    border-style: solid;
    border-width: 1px;
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .label-danger {
    background-color: #b02a37;
    border-color: #ffffff;
    border-style: solid;
    border-width: 1px;
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info {
    background-color: #eef3fd;
    border-color: #eef3fd;
}
html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]), html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info p, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info h1, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info h2, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info h3, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info h4, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info h5, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info h6, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info strong, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info b, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info em, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info small, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info li, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info > i, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-info > .fa {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success {
    background-color: #157347;
    border-color: #ffffff;
    border-style: solid;
    border-width: 1px;
}
html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]), html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success p, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success h1, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success h2, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success h3, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success h4, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success h5, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success h6, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success strong, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success b, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success em, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success small, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success li, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success > i, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-success > .fa {
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning {
    background-color: #8f5f00;
    border-color: #ffffff;
    border-style: solid;
    border-width: 1px;
}
html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]), html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning p, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning h1, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning h2, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning h3, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning h4, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning h5, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning h6, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning strong, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning b, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning em, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning small, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning li, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning > i, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-warning > .fa {
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger {
    background-color: #b02a37;
    border-color: #ffffff;
    border-style: solid;
    border-width: 1px;
}
html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger a:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]), html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger p, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger h1, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger h2, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger h3, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger h4, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger h5, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger h6, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger strong, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger b, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger em, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger small, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger li, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger > i, html:not(#__pdcd_) body:not(#__pdcd_) .alert.alert-danger > .fa {
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .breadcrumb > li.active {
    color: #546ea5;
}

html:not(#__pdcd_) body:not(#__pdcd_) input[type="checkbox"]:not(.onoffswitch-checkbox) {
    background-color: transparent;
    border-color: #a9b2c4;
}
html:not(#__pdcd_) body:not(#__pdcd_) input[type="checkbox"]:not(.onoffswitch-checkbox):checked {
    background-color: #2563eb;
    border-color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) input[type="checkbox"]:not(.onoffswitch-checkbox):checked::after {
    border-color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .panel-heading, html:not(#__pdcd_) body:not(#__pdcd_) .fb-folder-toolbar {
    background-color: #2563eb;
    border-color: #2563eb;
    color: #ffffff;
}
:root {
    --pd-cd-panelhead-bg: #2563eb;
    --pd-cd-panelhead-color: #ffffff;
    --pd-cd-panelhead-border: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .top_stats_wrapper {
    background-color: #ffffff;
    border-color: #a9b2c4;
}

html:not(#__pdcd_) body:not(#__pdcd_) .sidebar-user-profile .profile, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-userprofile {
    background-color: #f6f9fe;
    border-color: #a9b2c4;
}

html:not(#__pdcd_) body:not(#__pdcd_) .sidebar-user-profile .profile .tw-font-semibold, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-userprofile-name {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .sidebar-user-profile .profile .tw-text-sm, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-userprofile-email {
    color: #546ea5;
}

html:not(#__pdcd_) body:not(#__pdcd_) .horizontal-scrollable-tabs .nav-tabs-horizontal {
    background-color: #2563eb;
    border-color: #a9b2c4;
}
html:not(#__pdcd_) body:not(#__pdcd_) .horizontal-scrollable-tabs .nav-tabs-horizontal > li > a:not(.btn):not(.label):not(.badge), html:not(#__pdcd_) body:not(#__pdcd_) .horizontal-scrollable-tabs .nav-tabs-horizontal > li.active > a:not(.btn):not(.label):not(.badge) {
    color: #ffffff;
}
:root {
    --pd-cd-fulltabs-bg: #2563eb;
    --pd-cd-fulltabs-divider: #a9b2c4;
}
html:not(#__pdcd_) body:not(#__pdcd_) .horizontal-scrollable-tabs .nav-tabs-horizontal > li > a:not(.btn):not(.label):not(.badge):hover, html:not(#__pdcd_) body:not(#__pdcd_) .horizontal-scrollable-tabs .nav-tabs-horizontal > li > a:not(.btn):not(.label):not(.badge):focus, html:not(#__pdcd_) body:not(#__pdcd_) .horizontal-scrollable-tabs .nav-tabs-horizontal > li.active > a:not(.btn):not(.label):not(.badge):hover, html:not(#__pdcd_) body:not(#__pdcd_) .horizontal-scrollable-tabs .nav-tabs-horizontal > li.active > a:not(.btn):not(.label):not(.badge):focus {
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .horizontal-scrollable-tabs .nav-tabs-horizontal.pd-cd-fulltabs2, html:not(#__pdcd_) body:not(#__pdcd_) .roster-subnav {
    background-color: #f6f9fe;
    border-color: #a9b2c4;
}
html:not(#__pdcd_) body:not(#__pdcd_) .horizontal-scrollable-tabs .nav-tabs-horizontal.pd-cd-fulltabs2 > li > a:not(.btn):not(.label):not(.badge), html:not(#__pdcd_) body:not(#__pdcd_) .roster-subnav-item {
    color: #546ea5;
}
:root {
    --pd-cd-fulltabs2-bg: #f6f9fe;
    --pd-cd-fulltabs2-ink: #546ea5;
    --pd-cd-fulltabs2-edge: #a9b2c4;
    --pd-cd-fulltabs2-active-bg: #2563eb;
    --pd-cd-fulltabs2-active-ink: #ffffff;
}
html:not(#__pdcd_) body:not(#__pdcd_) .horizontal-scrollable-tabs .nav-tabs-horizontal.pd-cd-fulltabs2 > li.active > a:not(.btn):not(.label):not(.badge), html:not(#__pdcd_) body:not(#__pdcd_) .roster-subnav-item.active {
    background-color: #2563eb;
    border-color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .horizontal-scrollable-tabs .nav-tabs-horizontal.pd-cd-fulltabs2 > li.active > a:not(.btn):not(.label):not(.badge), html:not(#__pdcd_) body:not(#__pdcd_) .roster-subnav-item.active {
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_):not(.customers) .acd-tabs, html:not(#__pdcd_) body:not(#__pdcd_) .bconn-subnav, html:not(#__pdcd_) body:not(#__pdcd_) .bond-subnav, html:not(#__pdcd_) body:not(#__pdcd_) .books-subnav, html:not(#__pdcd_) body:not(#__pdcd_) .collect-subnav, html:not(#__pdcd_) body:not(#__pdcd_) .cpx-subnav, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-subnav, html:not(#__pdcd_) body:not(#__pdcd_) .lns-subnav, html:not(#__pdcd_) body:not(#__pdcd_) .line-subnav, html:not(#__pdcd_) body:not(#__pdcd_) .proxy-subnav, html:not(#__pdcd_) body:not(#__pdcd_) .radar-subnav, html:not(#__pdcd_) body:not(#__pdcd_) .sage-subnav, html:not(#__pdcd_) body:not(#__pdcd_) .verdict-subnav, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-fulltabs3-subnav {
    background-color: transparent;
    border-color: #a9b2c4;
}
html:not(#__pdcd_) body:not(#__pdcd_) .acd-tabs a.acd-tab:not(.btn):not(.label):not(.badge):not([class*="btn"]), html:not(#__pdcd_) body:not(#__pdcd_) .bconn-subnav-item, html:not(#__pdcd_) body:not(#__pdcd_) .bond-subnav-item, html:not(#__pdcd_) body:not(#__pdcd_) .books-subnav-item, html:not(#__pdcd_) body:not(#__pdcd_) .collect-subnav-item, html:not(#__pdcd_) body:not(#__pdcd_) .cpx-subnav-item, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-subnav-item, html:not(#__pdcd_) body:not(#__pdcd_) .lns-subnav-item, html:not(#__pdcd_) body:not(#__pdcd_) .line-subnav-item, html:not(#__pdcd_) body:not(#__pdcd_) .proxy-subnav-item, html:not(#__pdcd_) body:not(#__pdcd_) .radar-subnav-item, html:not(#__pdcd_) body:not(#__pdcd_) .sage-subnav-item, html:not(#__pdcd_) body:not(#__pdcd_) .verdict-subnav-item, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-fulltabs3-subnav-item {
    color: #546ea5;
}
html:not(#__pdcd_) body:not(#__pdcd_) .acd-tabs a.acd-tab:not(.btn):not(.label):not(.badge):not([class*="btn"]):not(.acd-tab-active):hover, html:not(#__pdcd_) body:not(#__pdcd_) .acd-tabs a.acd-tab:not(.btn):not(.label):not(.badge):not([class*="btn"]):not(.acd-tab-active):focus, html:not(#__pdcd_) body:not(#__pdcd_) .bconn-subnav-item:not(.active):hover, html:not(#__pdcd_) body:not(#__pdcd_) .bconn-subnav-item:not(.active):focus, html:not(#__pdcd_) body:not(#__pdcd_) .bond-subnav-item:not(.is-active):hover, html:not(#__pdcd_) body:not(#__pdcd_) .bond-subnav-item:not(.is-active):focus, html:not(#__pdcd_) body:not(#__pdcd_) .books-subnav-item:not(.active):hover, html:not(#__pdcd_) body:not(#__pdcd_) .books-subnav-item:not(.active):focus, html:not(#__pdcd_) body:not(#__pdcd_) .collect-subnav-item:not(.active):hover, html:not(#__pdcd_) body:not(#__pdcd_) .collect-subnav-item:not(.active):focus, html:not(#__pdcd_) body:not(#__pdcd_) .cpx-subnav-item:not(.active):hover, html:not(#__pdcd_) body:not(#__pdcd_) .cpx-subnav-item:not(.active):focus, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-subnav-item:not(.active):hover, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-subnav-item:not(.active):focus, html:not(#__pdcd_) body:not(#__pdcd_) .lns-subnav-item:not(.active):hover, html:not(#__pdcd_) body:not(#__pdcd_) .lns-subnav-item:not(.active):focus, html:not(#__pdcd_) body:not(#__pdcd_) .line-subnav-item:not(.active):hover, html:not(#__pdcd_) body:not(#__pdcd_) .line-subnav-item:not(.active):focus, html:not(#__pdcd_) body:not(#__pdcd_) .proxy-subnav-item:not(.active):hover, html:not(#__pdcd_) body:not(#__pdcd_) .proxy-subnav-item:not(.active):focus, html:not(#__pdcd_) body:not(#__pdcd_) .radar-subnav-item:not(.active):hover, html:not(#__pdcd_) body:not(#__pdcd_) .radar-subnav-item:not(.active):focus, html:not(#__pdcd_) body:not(#__pdcd_) .sage-subnav-item:not(.active):hover, html:not(#__pdcd_) body:not(#__pdcd_) .sage-subnav-item:not(.active):focus, html:not(#__pdcd_) body:not(#__pdcd_) .verdict-subnav-item:not(.active):hover, html:not(#__pdcd_) body:not(#__pdcd_) .verdict-subnav-item:not(.active):focus, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-fulltabs3-subnav-item:not(.active):hover, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-fulltabs3-subnav-item:not(.active):focus {
    background-color: #f0f4fe;
    border-color: #f0f4fe;
}
html:not(#__pdcd_) body:not(#__pdcd_) .acd-tabs a.acd-tab:not(.btn):not(.label):not(.badge):not([class*="btn"]).acd-tab-active, html:not(#__pdcd_) body:not(#__pdcd_) .bconn-subnav-item.active, html:not(#__pdcd_) body:not(#__pdcd_) .bond-subnav-item.is-active, html:not(#__pdcd_) body:not(#__pdcd_) .books-subnav-item.active, html:not(#__pdcd_) body:not(#__pdcd_) .collect-subnav-item.active, html:not(#__pdcd_) body:not(#__pdcd_) .cpx-subnav-item.active, html:not(#__pdcd_) body:not(#__pdcd_) .ledger-subnav-item.active, html:not(#__pdcd_) body:not(#__pdcd_) .lns-subnav-item.active, html:not(#__pdcd_) body:not(#__pdcd_) .line-subnav-item.active, html:not(#__pdcd_) body:not(#__pdcd_) .proxy-subnav-item.active, html:not(#__pdcd_) body:not(#__pdcd_) .radar-subnav-item.active, html:not(#__pdcd_) body:not(#__pdcd_) .sage-subnav-item.active, html:not(#__pdcd_) body:not(#__pdcd_) .verdict-subnav-item.active, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-fulltabs3-subnav-item.active {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .panel-heading:has(> .panel-title > a[data-toggle="collapse"]), html:not(#__pdcd_) body:not(#__pdcd_) .panel-heading:has(> a[data-toggle="collapse"]), html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-collapse {
    background-color: transparent;
    border-color: transparent;
}
html:not(#__pdcd_) body:not(#__pdcd_) .panel-title > a[data-toggle="collapse"]:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]), html:not(#__pdcd_) body:not(#__pdcd_) .panel-heading > a[data-toggle="collapse"]:not(.btn):not(.label):not(.badge):not([class*="-subnav"]):not([class*="btn"]), html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-collapse-link {
    color: #2563eb;
}
html:not(#__pdcd_) body:not(#__pdcd_) .panel-title > a[data-toggle="collapse"] > i, html:not(#__pdcd_) body:not(#__pdcd_) .panel-title > a[data-toggle="collapse"] > .fa, html:not(#__pdcd_) body:not(#__pdcd_) .panel-heading > a[data-toggle="collapse"] > i, html:not(#__pdcd_) body:not(#__pdcd_) .panel-heading > a[data-toggle="collapse"] > .fa, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-mock-collapse-ico {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .badge.bg-success {
    background-color: #157347;
    border-color: #ffffff;
    border-style: solid;
    border-width: 1px;
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .badge.bg-warning {
    background-color: #8f5f00;
    border-color: #ffffff;
    border-style: solid;
    border-width: 1px;
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .badge.bg-danger {
    background-color: #b02a37;
    border-color: #ffffff;
    border-style: solid;
    border-width: 1px;
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) .badge.bg-info {
    background-color: #0369a1;
    border-color: #ffffff;
    border-style: solid;
    border-width: 1px;
    color: #ffffff;
}

html:not(#__pdcd_) body:not(#__pdcd_) canvas.chart, html:not(#__pdcd_) body:not(#__pdcd_) canvas.payments-chart-dashboard, html:not(#__pdcd_) body:not(#__pdcd_) canvas.chartjs-render-monitor {
    color: #2563eb;
}
:root {
    --pd-cd-chart-text: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .progress, html:not(#__pdcd_) body:not(#__pdcd_) .bpp-bar {
    background-color: #dde7fc;
}

html:not(#__pdcd_) body:not(#__pdcd_) .progress-bar, html:not(#__pdcd_) body:not(#__pdcd_) .bpp-bar-fill {
    background-color: #2563eb;
    color: #f6f9fe;
}

html:not(#__pdcd_) body:not(#__pdcd_) .dd-code {
    background-color: #f6f9fe;
    border-color: #a9b2c4;
}
html:not(#__pdcd_) body:not(#__pdcd_) .dd-code, html:not(#__pdcd_) body:not(#__pdcd_) .dd-code code {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu > li > a i, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-dropdown-open .pd-cd-cnv-dd-icon {
    color: inherit;
}
html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu > li > a:hover i, html:not(#__pdcd_) body:not(#__pdcd_) .dropdown-menu > li > a:focus i, html:not(#__pdcd_) body:not(#__pdcd_) .pd-cd-cnv-dropdown-open .pd-cd-cnv-dd-icon--hover {
    color: inherit;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .navbar.navbar-default .navbar-brand, html:not(#__pdcd_) body:not(#__pdcd_).customers .navbar.navbar-default .navbar-nav > li > a, html:not(#__pdcd_) body:not(#__pdcd_).customers .navbar.navbar-default .navbar-text {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .navbar.navbar-default .navbar-nav > li > a:hover, html:not(#__pdcd_) body:not(#__pdcd_).customers .navbar.navbar-default .navbar-nav > li > a:focus, html:not(#__pdcd_) body:not(#__pdcd_).customers .navbar.navbar-default .navbar-nav > .active > a, html:not(#__pdcd_) body:not(#__pdcd_).customers .navbar.navbar-default .navbar-nav > .open > a {
    background-color: transparent;
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .navbar.navbar-default .navbar-toggle .icon-bar {
    background-color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .navbar.navbar-default .navbar-toggle:hover, html:not(#__pdcd_) body:not(#__pdcd_).customers .navbar.navbar-default .navbar-toggle:focus {
    background-color: #f0f4fe;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers hr, html:not(#__pdcd_) body:not(#__pdcd_).customers .submenu.customer-top-submenu, html:not(#__pdcd_) body:not(#__pdcd_).customers .navbar.navbar-default .navbar-toggle, html:not(#__pdcd_) body:not(#__pdcd_).customers .navbar.navbar-default .navbar-collapse, html:not(#__pdcd_) body:not(#__pdcd_).customers .navbar.navbar-default .navbar-form {
    border-color: #a9b2c4;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .dropdown-menu .divider {
    background-color: #a9b2c4;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #f0f4fe;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .form-control::placeholder {
    color: #546ea5;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .form-control:focus, html:not(#__pdcd_) body:not(#__pdcd_).customers input.form-control:focus, html:not(#__pdcd_) body:not(#__pdcd_).customers textarea.form-control:focus, html:not(#__pdcd_) body:not(#__pdcd_).customers select.form-control:focus {
    border-color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers input[type="file"].form-control {
    background-color: #e0e9fc;
    border-color: #a9b2c4;
    color: #245cd5;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .bootstrap-select .dropdown-menu li a {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .bootstrap-select .dropdown-menu li.selected a, html:not(#__pdcd_) body:not(#__pdcd_).customers .bootstrap-select .dropdown-menu li a:hover {
    background-color: #f0f4fe;
    color: #546ea5;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .alert .close {
    color: #546ea5;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .kb-search-icon, html:not(#__pdcd_) body:not(#__pdcd_).customers .form-control-feedback {
    color: #2563eb;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .submenu.customer-top-submenu > li > a {
    color: #546ea5 !important;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .submenu.customer-top-submenu > li.active > a, html:not(#__pdcd_) body:not(#__pdcd_).customers .submenu.customer-top-submenu > li > a:hover, html:not(#__pdcd_) body:not(#__pdcd_).customers .submenu.customer-top-submenu > li > a:focus {
    color: #2563eb !important;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .footer, html:not(#__pdcd_) body:not(#__pdcd_).customers .gdpr-footer {
    background-color: #f6f9fe;
    border-color: #a9b2c4;
    color: #546ea5;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .footer a, html:not(#__pdcd_) body:not(#__pdcd_).customers .copyright-footer, html:not(#__pdcd_) body:not(#__pdcd_).customers .terms-and-conditions-footer {
    color: #546ea5;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .kb-search-jumbotron {
    background-color: #f0f4fe;
    border-color: transparent;
    color: #546ea5;
}

html:not(#__pdcd_) body:not(#__pdcd_).customers .kb-search-heading, html:not(#__pdcd_) body:not(#__pdcd_).customers .jumbotron h1, html:not(#__pdcd_) body:not(#__pdcd_).customers .jumbotron h2, html:not(#__pdcd_) body:not(#__pdcd_).customers .jumbotron h3, html:not(#__pdcd_) body:not(#__pdcd_).customers .jumbotron p {
    color: #546ea5;
}