.hidden {
    display: none !important;
}

.force-wrap-text {
    word-wrap: break-word !important;
    white-space: normal !important;
}

strong, .strong {
    font-weight: 600 !important;
}

.tooltip-sm {
    min-width: 14px;
    min-height: 14px;
    display: inline-block;
}

.form-control-inline-block {
    width: auto !important;
    display: inline-block;
}

.error {
    color: #dc3545;
}

.va-middle {
    vertical-align: middle;
}

.usage-indicator {
    width: 100%; 
    border: 1px solid #eaeaea;
}

.total-usage-indicator {
    width: 100%;
    text-align: center;
}

.usage-indicator div {
    display: inline-block;
    padding: 0;
    margin: 0;
    height: 100%;
    color: #000000;
}

.usage-limit {
    border-right: 1px solid #eaeaea;
}

.usage-within-limit {
    background: linear-gradient(-135deg, #3ebfea 0%, #aef0ff 100%);
}

.usage-above-limit {
    background: linear-gradient(-135deg, #fff7ca 0%, #ffec80 100%);
}

.empty-row {
    color: #dddddd;
}

.subscription-inactive {
    opacity: 0.5;
}

.container-table-tiers {
    /* background: #f4f7fa; */
    border: 1px dashed #ccc;
    border-radius: 0.5em;
    padding: 1em;
    margin-bottom: 1.5em;
}

table.table-tiers td,
table.table-tiers th {
    padding: 0.5em;
}

table.table-subscription-quantities td,
table.table-subscription-quantities th {
    padding: 1.25em;
}

tbody td {
    vertical-align: baseline !important;
}

.break-word {
    word-wrap: break-word !important;
    word-break: break-word !important;
}

.quota-end-date {
    font-size: 0.9em;
}

.api-details .endpoint-details .endpoint-summary {
    color: #111;
}

.sign-up-alert {
    margin-bottom: 30px;
}


.subscribe-button {
    font-size: 110%;
    width: 70%;
}

.consent-notice {
    display: inline-block;
    width: 70%;
}

.checkout-public h5.product-name {
    font-weight: 600;
    font-size: 2em;
}

.checkout-public h5.product-name::after {
    top: 7px;
}

table.table-end-border {
    border-bottom: 1px solid #eaeaea;
}

.clr-field button {
    background-image: none !important;
    background-color: #FFF !important;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border-color: rgb(206, 212, 218) !important;
    border-right-width: 5px !important;
}

form .image-thumbnail {
    padding-bottom: 10px;
}

form .image-thumbnail img {
    height: 100px;
    width: 100px;
}

form .image-thumbnail .wrapper {
    display: inline-block;
    position: relative;
}

form .image-thumbnail .wrapper .remove {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
    color: red;
    font-size: 1.25em;
    background-color: #fff;
    line-height: 1px;
}

.fw-bold {
    font-weight: 700 !important;
}


.theme-color-demo {
    height: 5px;
    width: 8px;
    display: inline-block;
}

.theme-color-demo:first-child
{
    border-start-start-radius: 2px;
    border-end-start-radius: 2px;
}

.theme-color-demo:last-child
{
    border-start-end-radius: 2px;
    border-end-end-radius: 2px;
}

label.required::after {
    content: ' *';
    color: red;
}

/* .checkout-public a:not(.btn):not(.quantity-adjustment-modal-trigger) {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
} */

.checkout-public a:not(.btn):not(.quantity-adjustment-modal-trigger):hover {
    text-decoration: none;
}

.checkout-public .pricing-table tbody tr td {
    vertical-align: middle !important;
}

.checkout-public .pricing-table .price-name {
    color: black;
}

.checkout-public .pricing-table .product-free {
    text-align: center;
}

.checkout-public .pricing-table .product-free,
.details-header {
    color: black;
    font-size: 1rem;
}

.checkout-public .pricing-table .billing-period {
    font-size: 0.8rem;
    font-style: italic;
}

table.no-top-border > tbody > tr:first-child td {
    border-top: 0;
    padding-top: 0;
}

.pricing-table .quote-item-price {
    font-size: 1rem;
}

.table-totals, .table-totals td {
    border: 0 !important;
    padding: 0 !important;
    color: #000000;
    font-size: 1rem;
}

.table-totals td span.quote-item-price {
    font-size: 1.5rem;
}

.subscription-list .subscription-id {
    font-size: 0.8rem;
}

.subscription-list tbody tr td {
    vertical-align: middle !important;
}

.user-select-all {
    user-select: all;
}


.table td,
.table th {
  white-space: normal !important;
}


.visually-hidden,
.visually-hidden-focusable:not(:focus):not(:focus-within) {
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.visually-hidden:not(caption),
.visually-hidden-focusable:not(:focus):not(:focus-within):not(caption) {
  position: absolute !important;
}


.spinner-grow,
.spinner-border {
  display: inline-block;
  width: var(--bs-spinner-width);
  height: var(--bs-spinner-height);
  vertical-align: var(--bs-spinner-vertical-align);
  border-radius: 50%;
  animation: var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name);
}

@keyframes spinner-border {
  to {
    transform: rotate(360deg) /* rtl:ignore */;
  }
}
.spinner-border {
  --bs-spinner-width: 2rem;
  --bs-spinner-height: 2rem;
  --bs-spinner-vertical-align: -0.125em;
  --bs-spinner-border-width: 0.25em;
  --bs-spinner-animation-speed: 0.75s;
  --bs-spinner-animation-name: spinner-border;
  border: var(--bs-spinner-border-width) solid currentcolor;
  border-right-color: transparent;
}

.spinner-border-sm {
  --bs-spinner-width: 1rem;
  --bs-spinner-height: 1rem;
  --bs-spinner-border-width: 0.2em;
}

@keyframes spinner-grow {
  0% {
    transform: scale(0);
  }
  50% {
    opacity: 1;
    transform: none;
  }
}
.spinner-grow {
  --bs-spinner-width: 2rem;
  --bs-spinner-height: 2rem;
  --bs-spinner-vertical-align: -0.125em;
  --bs-spinner-animation-speed: 0.75s;
  --bs-spinner-animation-name: spinner-grow;
  background-color: currentcolor;
  opacity: 0;
}

.spinner-grow-sm {
  --bs-spinner-width: 1rem;
  --bs-spinner-height: 1rem;
}

@media (prefers-reduced-motion: reduce) {
  .spinner-border,
  .spinner-grow {
    --bs-spinner-animation-speed: 1.5s;
  }
}
.offcanvas, .offcanvas-xxl, .offcanvas-xl, .offcanvas-lg, .offcanvas-md, .offcanvas-sm {
  --bs-offcanvas-zindex: 1045;
  --bs-offcanvas-width: 400px;
  --bs-offcanvas-height: 30vh;
  --bs-offcanvas-padding-x: 1rem;
  --bs-offcanvas-padding-y: 1rem;
  --bs-offcanvas-color: var(--bs-body-color);
  --bs-offcanvas-bg: var(--bs-body-bg);
  --bs-offcanvas-border-width: var(--bs-border-width);
  --bs-offcanvas-border-color: var(--bs-border-color-translucent);
  --bs-offcanvas-box-shadow: var(--bs-box-shadow-sm);
  --bs-offcanvas-transition: transform 0.3s ease-in-out;
  --bs-offcanvas-title-line-height: 1.5;
}

.fs-08 {
    font-size: 0.8em !important;
}

.fs-15 {
    font-size: 1.5em !important;
}

.fs-20 {
    font-size: 2em !important;
}

.scope-item-any {
    font-weight: bold;
    font-size: 1.2em;
}

.scope-item-api {
    font-weight: bold;
}

.scope-item-endpoint {
    padding-left: 20px;
}

.scope-item-autoselected {
    opacity: 30%;
}

.scope-item-autoselected::before {
    content:"✓ ";
}

select.scope-select {
    resize: vertical;
}


.nav-align-top > .tab-content.background-none,
.nav-align-right > .tab-content.background-none,
.nav-align-bottom > .tab-content.background-none,
.nav-align-left > .tab-content.background-none, 
.tab-content > .tab-pane.background-none {
    background: none !important;
    box-shadow: none !important;
}

table.increase-spacing-3 > thead > tr:not(.collapsed) > th,
table.increase-spacing-3 > tbody > tr:not(.collapsed) > td,
tbody.increase-spacing-3 > tr:not(.collapsed) > td {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

table.increase-spacing-2 tr:not(.collapsed) td,
tbody.increase-spacing-2 tr:not(.collapsed) td {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

table.increase-spacing tr:not(.collapsed) td,
tbody.increase-spacing tr:not(.collapsed) td {
    padding-top: 3rem;
    padding-bottom: 3rem;
}

table.no-last-border tr:last-child td {
    border-bottom: 0;
}

input.checkout-link-url {
    font-size: 12px;
    font-family: Menlo, Consolas, monospace;
}

.text-condensed p {
    font-size: 0.85rem;
    margin-bottom: 0.3rem;
}

.checkout-public .card .card-header {
    border-bottom: var(--card-header-border-bottom);
}

.optgroup-mb-2 optgroup {
    margin-bottom: 0.5rem;
}

.help-on-top label {
    margin-bottom: 0 !important;
}

.help-on-top .help-text {
    margin-top: 0 !important;
    margin-bottom: 1rem !important;
}

.fs-small {
    font-size: 80% !important;
}


.card-header-border {
    border-bottom-width: 1px;
    padding-bottom: 0 !important;
    margin-bottom: 1rem;
}

.w-30 {
    width: 30% !important;
}

.w-35 {
    width: 35% !important;
}

.w-40 {
    width: 40% !important;
}

td.fitwidth, td.div sub {
    width: 1px;
    white-space: nowrap !important;
}


table.header-text-end tr td:first-child
{
    text-align: start;
}

.my-2rem {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

/* .checkout-public pre, .checkout-public pre code,  */
.checkout-public :not(pre) > code {
    white-space: pre-line;
}

.border-bottom-light {
    border-bottom: 1px solid #f1f1f166 !important;
}

.app-brand, .app-brand a, .app-brand a:hover {
    color: rgb(63, 57, 90);
    font-weight: 600;
}

.app-brand object {
    width: 36px;
}

.text-center-input input {
    text-align: center;
}

.text-monospace {
    font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.toggle-hidden-trigger-active {
    background-color: var(--bs-table-hover-bg);
}

.table-hover-with-hidden > tbody > tr:hover:not(.nohover) {
    background-color: rgba(0, 0, 0, 0.075);
}

.nopadding td {
padding: 0 !important;
}

.query-builder  option {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.query-builder .rules-group-container  {
    background-color: var(--bs-white) !important;
    border: 1px solid var(--bs-white) !important;
}

.white-space-preserve {
    white-space: preserve;
}

.showmore-button {
    cursor: pointer;
}

.docs-field-list table tr th,
.docs-field-list table tr td {
    padding-top: 0.1rem;
    padding-bottom: 0.1rem;
}


.docs-field-list table tr td:nth-child(2) {
    white-space: nowrap !important;
    text-align: center;
}

.docs-field-list table tr td:nth-child(1) {
    width: 1px;
    white-space: nowrap !important;
    padding-right: 0.5rem;
}

.docs-field-list table tr th:nth-child(2) {
    text-align: center;
}

.table-responsive.dropdown {
    padding-bottom: 100px;
    margin-bottom: -100px;
}

.invoice-totals {
    font-size: 1.2em;
    font-weight: 400;
    padding-bottom: 2rem;
}


.bellCount, .main-bellCount-U8uhA {
    top: 0 !important;
}

.modal-body .item-name,
.modal-body .quantity {
    font-size: 1.2rem;
    font-weight: 400;
    padding-left: 2rem;
}

.modal-body .quantity {
    font-size: 1rem;
    font-weight: 600;
    padding-right: 2rem;
}

.subscription-show-container .quote-item-price {
    font-size: 1rem;
}

.border-0-inner * {
    border: 0 !important;
}

.subscription-product-dashboard .card,
.checkout-public .card {
    margin-bottom: 1rem !important;
}

.accordion.search-form {
    box-shadow: var(--card-box-shadow);
}

.accordion.search-form .accordion-item.active {
    box-shadow: none;
}

/**
* User portal
*/

:root {
    --transparent: rgba(0, 0, 0, 0);

    --primary-color-rgb: 100 67 118;
    --primary-color: rgb(var(--primary-color-rgb) / 1);
    --primary-color-hover-rgb: 176 120 206;
    --primary-color-hover: rgba(var(--primary-color-hover-rgb));
    
    --secondary-color-rgb: 120 131 147;
    --secondary-color: rgb(var(--secondary-color-rgb) / 1);

    --dark-color-rgb: 32 47 63;
    --dark-color: rgb(var(--dark-color-rgb) / 1);

    --danger-color-rgb: 255 62 29;
    --danger-color: rgb(var(--danger-color-rgb) / 1);
    --danger-color-hover: #e6381a;

    --body-background-color: var(--bs-body-bg);
    --body-color: var(--bs-body-color);
    --body-font-family: var(--bs-body-font-family);
    --body-font-size: var(--bs-body-font-size);
    --body-font-weight: var(--bs-body-font-weight);


    --link-color: var(--primary-color);
    --link-color-hover: var(--primary-color-hover);

    --heading-color: var(--body-color);

    --card-background-color: #ffffff;
    --card-color: var(--body-color);
    --card-emphasis-color: #000000;
    --card-margin: 0 0 1rem 0;
    --card-box-shadow: 0 2px 6px 0 rgba(67, 89, 113, 0.12);
    --card-border-radius: 0.5rem;

    --card-header-border-bottom: 1px solid #f1f1f1;
    --card-header-margin: 0 0 1.5rem 0;
    
    --card-title-color: #566a7f;
    --card-divisor-color: #566a7f;


    --menu-background-color: var(--card-background-color);
    --menu-color: var(--card-color);

    --menu-app-brand-logo-url: url('/assets/images/logo_noemboss.svg');
    --menu-app-brand-name-content: attr(data-provider-name);
    --menu-app-brand-link-color: rgb(63, 57, 90);
    --menu-app-brand-link-color-hover: var(--menu-app-brand-link-color);

    --menu-header-color: #a1acb8;

    --menu-item-color: var(--card-color);
    --menu-item-color-hover: var(--card-color);
    --menu-item-background-color: var(--card-background-color);
    --menu-item-background-color-hover: var(--card-background-color);
    
    --menu-item-link-color: var(--menu-item-color);
    --menu-item-link-color-hover: var(--menu-item-color-hover);
    --menu-item-link-background-color: var(--menu-item-background-color);
    --menu-item-link-background-color-hover: rgba(67, 89, 113, 0.04);

    --menu-item-active-color: var(--link-color);
    --menu-item-active-color-hover: var(--link-color-hover);
    --menu-item-active-background-color: var(--card-background-color);
    --menu-item-active-background-color-hover: var(--card-background-color);

    --menu-item-active-link-color: var(--menu-item-active-color);
    --menu-item-active-link-color-hover: var(--menu-item-active-color-hover);
    --menu-item-active-link-background-color: rgba(105, 108, 255, 0.16);
    --menu-item-active-link-background-color-hover: rgba(105, 108, 255, 0.16);

    --menu-item-icon-color: var(--link-color);
    --menu-item-icon-color-hover: var(--link-color-hover);
    --menu-item-active-icon-color: var(--link-color);
    --menu-item-active-icon-color-hover: var(--link-color-hover);

    --menu-item-bullet-color: var(--primary-color);
    --menu-item-bullet-color-hover: var(--primary-color);

    
    --navbar-background-color: var(--card-background-color);
    --navbar-link-color: var(--card-color);
    --navbar-link-color-hover: var(--card-color);
    --navbar-box-shadow: var(--card-box-shadow);
    --navbar-dropdown-menu-box-shadow: 0 0.25rem 1rem rgba(161, 172, 184, 0.45);
    --navbar-border-radius: var(--card-border-radius);


    --table-header-color: var(--card-title-color);
    --table-header-border-bottom: 1px solid #d9dee3;
    --table-row-border: 1px solid #f1f1f166;


    --row-background-color-hover:rgba(67, 89, 113, 0.06);
    --row-color-hover:var(--body-color);


    --transaction-history-posting-positive: rgba(var(--bs-success-rgb), 1);
    --transaction-history-posting-negative: rgba(var(--bs-warning-rgb), 1);


    --button-color-default: #ffffff;

    --button-primary-color: var(--button-color-default);
    --button-primary-color-hover: var(--button-color-default);
    --button-primary-background-color: var(--primary-color);
    --button-primary-background-color-hover: var(--primary-color);
    --button-primary-border-color: var(--button-primary-background-color);

    --button-primary-outline-color: var(--button-primary-background-color);
    --button-primary-outline-color-hover: var(--button-primary-color-hover);
    --button-primary-outline-background-color: var(--button-primary-color);
    --button-primary-outline-background-color-hover: var(--button-primary-background-color-hover);
    --button-primary-outline-border-color: var(--button-primary-background-color);


    --button-secondary-color: var(--button-color-default);
    --button-secondary-color-hover: var(--button-color-default);
    --button-secondary-background-color: var(--secondary-color);
    --button-secondary-background-color-hover: var(--secondary-color);
    --button-secondary-border-color: var(--button-secondary-background-color);

    --button-secondary-outline-color: var(--button-secondary-background-color);
    --button-secondary-outline-color-hover: var(--button-secondary-color);
    --button-secondary-outline-background-color: var(--button-secondary-color);
    --button-secondary-outline-background-color-hover: var(--button-secondary-background-color);
    --button-secondary-outline-border-color: var(--button-secondary-background-color);


    --button-dark-color: var(--button-color-default);
    --button-dark-color-hover: var(--button-color-default);
    --button-dark-background-color: var(--dark-color);
    --button-dark-background-color-hover: var(--dark-color);
    --button-dark-border-color: var(--button-dark-background-color);

    --button-dark-outline-color: var(--button-dark-background-color);
    --button-dark-outline-color-hover: var(--button-dark-color);
    --button-dark-outline-background-color: var(--transparent);
    --button-dark-outline-background-color-hover: var(--button-dark-background-color);
    --button-dark-outline-border-color: var(--button-dark-background-color);


    --button-danger-color: var(--button-color-default);
    --button-danger-color-hover: var(--button-color-default);
    --button-danger-background-color: var(--danger-color);
    --button-danger-background-color-hover: var(--danger-color-hover);
    --button-danger-border-color: var(--button-danger-background-color);

    --button-danger-outline-color: var(--button-danger-background-color);
    --button-danger-outline-color-hover: var(--button-danger-color-hover);
    --button-danger-outline-background-color: var(--button-danger-color);
    --button-danger-outline-background-color-hover: var(--button-danger-background-color-hover);
    --button-danger-outline-border-color: var(--button-danger-background-color);

    --input-color: var(--card-color);
    --input-background-color: var(--card-background-color);
    --input-border-color: #d9dee3;
    --input-border-color-focus: var(--primary-color);
    --input-group-button-color: var(--input-color);
    --input-group-button-background-color: var(--input-background-color);


    --product-name-color: var(--card-title-color);


    --api-header-color: var(--card-title-color);
    --api-icon-color: var(--api-header-color);

    --modal-content-background-color: var(--card-background-color);


    --login-form-bullets-background: url("data:image/svg+xml,%3Csvg width='148px' height='148px' viewBox='0 0 148 148' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath d='M355,144 C356.104569,144 357,144.895431 357,146 C357,147.104569 356.104569,148 355,148 C353.895431,148 353,147.104569 353,146 C353,144.895431 353.895431,144 355,144 Z M382,144 C383.104569,144 384,144.895431 384,146 C384,147.104569 383.104569,148 382,148 C380.895431,148 380,147.104569 380,146 C380,144.895431 380.895431,144 382,144 Z M412,144 C413.104569,144 414,144.895431 414,146 C414,147.104569 413.104569,148 412,148 C410.895431,148 410,147.104569 410,146 C410,144.895431 410.895431,144 412,144 Z M442,144 C443.104569,144 444,144.895431 444,146 C444,147.104569 443.104569,148 442,148 C440.895431,148 440,147.104569 440,146 C440,144.895431 440.895431,144 442,144 Z M472,144 C473.104569,144 474,144.895431 474,146 C474,147.104569 473.104569,148 472,148 C470.895431,148 470,147.104569 470,146 C470,144.895431 470.895431,144 472,144 Z M499,144 C500.104569,144 501,144.895431 501,146 C501,147.104569 500.104569,148 499,148 C497.895431,148 497,147.104569 497,146 C497,144.895431 497.895431,144 499,144 Z M355,117 C356.104569,117 357,117.895431 357,119 C357,120.104569 356.104569,121 355,121 C353.895431,121 353,120.104569 353,119 C353,117.895431 353.895431,117 355,117 Z M382,117 C383.104569,117 384,117.895431 384,119 C384,120.104569 383.104569,121 382,121 C380.895431,121 380,120.104569 380,119 C380,117.895431 380.895431,117 382,117 Z M412,117 C413.104569,117 414,117.895431 414,119 C414,120.104569 413.104569,121 412,121 C410.895431,121 410,120.104569 410,119 C410,117.895431 410.895431,117 412,117 Z M442,117 C443.104569,117 444,117.895431 444,119 C444,120.104569 443.104569,121 442,121 C440.895431,121 440,120.104569 440,119 C440,117.895431 440.895431,117 442,117 Z M472,117 C473.104569,117 474,117.895431 474,119 C474,120.104569 473.104569,121 472,121 C470.895431,121 470,120.104569 470,119 C470,117.895431 470.895431,117 472,117 Z M499,117 C500.104569,117 501,117.895431 501,119 C501,120.104569 500.104569,121 499,121 C497.895431,121 497,120.104569 497,119 C497,117.895431 497.895431,117 499,117 Z M355,87 C356.104569,87 357,87.8954305 357,89 C357,90.1045695 356.104569,91 355,91 C353.895431,91 353,90.1045695 353,89 C353,87.8954305 353.895431,87 355,87 Z M382,87 C383.104569,87 384,87.8954305 384,89 C384,90.1045695 383.104569,91 382,91 C380.895431,91 380,90.1045695 380,89 C380,87.8954305 380.895431,87 382,87 Z M412,87 C413.104569,87 414,87.8954305 414,89 C414,90.1045695 413.104569,91 412,91 C410.895431,91 410,90.1045695 410,89 C410,87.8954305 410.895431,87 412,87 Z M442,87 C443.104569,87 444,87.8954305 444,89 C444,90.1045695 443.104569,91 442,91 C440.895431,91 440,90.1045695 440,89 C440,87.8954305 440.895431,87 442,87 Z M472,87 C473.104569,87 474,87.8954305 474,89 C474,90.1045695 473.104569,91 472,91 C470.895431,91 470,90.1045695 470,89 C470,87.8954305 470.895431,87 472,87 Z M499,87 C500.104569,87 501,87.8954305 501,89 C501,90.1045695 500.104569,91 499,91 C497.895431,91 497,90.1045695 497,89 C497,87.8954305 497.895431,87 499,87 Z M355,57 C356.104569,57 357,57.8954305 357,59 C357,60.1045695 356.104569,61 355,61 C353.895431,61 353,60.1045695 353,59 C353,57.8954305 353.895431,57 355,57 Z M472,57 C473.104569,57 474,57.8954305 474,59 C474,60.1045695 473.104569,61 472,61 C470.895431,61 470,60.1045695 470,59 C470,57.8954305 470.895431,57 472,57 Z M412,57 C413.104569,57 414,57.8954305 414,59 C414,60.1045695 413.104569,61 412,61 C410.895431,61 410,60.1045695 410,59 C410,57.8954305 410.895431,57 412,57 Z M499,57 C500.104569,57 501,57.8954305 501,59 C501,60.1045695 500.104569,61 499,61 C497.895431,61 497,60.1045695 497,59 C497,57.8954305 497.895431,57 499,57 Z M382,57 C383.104569,57 384,57.8954305 384,59 C384,60.1045695 383.104569,61 382,61 C380.895431,61 380,60.1045695 380,59 C380,57.8954305 380.895431,57 382,57 Z M442,57 C443.104569,57 444,57.8954305 444,59 C444,60.1045695 443.104569,61 442,61 C440.895431,61 440,60.1045695 440,59 C440,57.8954305 440.895431,57 442,57 Z M355,27 C356.104569,27 357,27.8954305 357,29 C357,30.1045695 356.104569,31 355,31 C353.895431,31 353,30.1045695 353,29 C353,27.8954305 353.895431,27 355,27 Z M382,27 C383.104569,27 384,27.8954305 384,29 C384,30.1045695 383.104569,31 382,31 C380.895431,31 380,30.1045695 380,29 C380,27.8954305 380.895431,27 382,27 Z M412,27 C413.104569,27 414,27.8954305 414,29 C414,30.1045695 413.104569,31 412,31 C410.895431,31 410,30.1045695 410,29 C410,27.8954305 410.895431,27 412,27 Z M442,27 C443.104569,27 444,27.8954305 444,29 C444,30.1045695 443.104569,31 442,31 C440.895431,31 440,30.1045695 440,29 C440,27.8954305 440.895431,27 442,27 Z M472,27 C473.104569,27 474,27.8954305 474,29 C474,30.1045695 473.104569,31 472,31 C470.895431,31 470,30.1045695 470,29 C470,27.8954305 470.895431,27 472,27 Z M499,27 C500.104569,27 501,27.8954305 501,29 C501,30.1045695 500.104569,31 499,31 C497.895431,31 497,30.1045695 497,29 C497,27.8954305 497.895431,27 499,27 Z M355,0 C356.104569,0 357,0.8954305 357,2 C357,3.1045695 356.104569,4 355,4 C353.895431,4 353,3.1045695 353,2 C353,0.8954305 353.895431,0 355,0 Z M382,0 C383.104569,0 384,0.8954305 384,2 C384,3.1045695 383.104569,4 382,4 C380.895431,4 380,3.1045695 380,2 C380,0.8954305 380.895431,0 382,0 Z M412,0 C413.104569,0 414,0.8954305 414,2 C414,3.1045695 413.104569,4 412,4 C410.895431,4 410,3.1045695 410,2 C410,0.8954305 410.895431,0 412,0 Z M442,0 C443.104569,0 444,0.8954305 444,2 C444,3.1045695 443.104569,4 442,4 C440.895431,4 440,3.1045695 440,2 C440,0.8954305 440.895431,0 442,0 Z M472,0 C473.104569,0 474,0.8954305 474,2 C474,3.1045695 473.104569,4 472,4 C470.895431,4 470,3.1045695 470,2 C470,0.8954305 470.895431,0 472,0 Z M499,0 C500.104569,0 501,0.8954305 501,2 C501,3.1045695 500.104569,4 499,4 C497.895431,4 497,3.1045695 497,2 C497,0.8954305 497.895431,0 499,0 Z' id='path-1'%3E%3C/path%3E%3C/defs%3E%3Cg id='📝-Pages' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Login---V2' transform='translate(-822.000000, -197.000000)'%3E%3Cg id='top-illustration' transform='translate(469.000000, 197.000000)'%3E%3Cuse fill='%23696cff' xlink:href='%23path-1'%3E%3C/use%3E%3Cuse fill-opacity='0.6' fill='%23FFFFFF' xlink:href='%23path-1'%3E%3C/use%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");

    
    /* misc */
    --text-muted-color: #a1acb8;
}

.user-portal body {
    font-family: var(--body-font-family);
    font-size: var(--body-font-size);
    font-weight: var(--body-font-weight);
    line-height: var(--bs-body-line-height);
    color: var(--body-color);
    text-align: var(--bs-body-text-align);
    background-color: var(--body-background-color);
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(67, 89, 113, 0);
}

.user-portal .card {
    color: var(--card-color);
    background-color: var(--card-background-color);
    margin: var(--card-margin);
    box-shadow: var(--card-box-shadow);
    border-radius: var(--card-border-radius);
}

.user-portal footer {
    color: var(--card-color);
    background-color: var(--card-background-color);
}

.user-portal .divider-subscription-details,
.user-portal .divider-product-details,
.checkout-public .divider-subscription-details,
.checkout-public .divider-product-details {
    margin: var(--card-margin);
}

.user-portal .card table {
    --bs-table-color-state: var(--card-color);
}

.user-portal .card table th {
    color: var(--table-header-color);
}

.user-portal table tr.border-bottom {
    border-bottom: var(--table-header-border-bottom) !important;
}

.user-portal .border-bottom-light,
.table:not(.table-borderless):not(.table-totals) > tbody:not(caption):not(.table-border-bottom-0) > * > *  {
    border-bottom: var(--table-row-border) !important;
}

.user-portal .card-header,
.checkout-public .card-header {
    margin: var(--card-header-margin);
    border: var(--card-header-border);
}

.user-portal .card-title {
    color: var(--card-title-color);
    margin-bottom: 0;
}

.user-portal .logo,
.card-body .logo {
    margin-right: 20px;
}

.user-portal .logo img,
.card-body .logo img {
    height: 100px;
    width: 100px;
}

/* .user-portal .product-name-container h5::after
{
    content: none !important;
} */

.user-portal .card-transaction-history .posting-positive {
    color: var(--transaction-history-posting-positive);
}

.user-portal .card-transaction-history .posting-negative {
    color:  var(--transaction-history-posting-negative);
}

.user-portal .text-muted {
    color: var(--text-muted-color) !important;
}

.user-portal ul.list-hover li:hover {
    background-color: var(--row-background-color-hover);
    color: var(--row-color-hover);
}

.user-portal .table-hover > tbody > tr:hover > * {
    --bs-table-color-state: var(--row-color-hover);
    --bs-table-bg-state: var(--row-background-color-hover);
}

.user-portal a {
    color: var(--link-color);
}

.user-portal a:hover {
    color: var(--link-color-hover);
}

.user-portal .btn-primary {
    color: var(--button-primary-color);
    background-color: var(--button-primary-background-color);
    border-color: var(--button-primary-border-color);
    box-shadow: 0 0.125rem 0.25rem 0 rgba(var(--button-primary-background-color), 0.4);
}

.user-portal .btn-primary.active, .user-portal .btn-primary:active
{
    color: var(--button-primary-color) !important;
    background-color: var(--button-primary-background-color) !important;
    border-color: var(--button-primary-border-color) !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(var(--button-primary-background-color), 0.4) !important;
}

.user-portal .btn-primary:hover, .user-portal .btn-primary.disabled {
    color: var(--button-primary-color) !important;
    background-color: var(--button-primary-background-color-hover) !important;
    border-color: var(--button-primary-border-color) !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(var(--button-primary-background-color), 0.4) !important;
}

.user-portal .btn-outline-primary {
    color: var(--button-primary-outline-color);
    background-color: var(--button-primary-outline-background-color);
    border-color: var(--button-primary-outline-border-color);
}

.user-portal .btn-outline-primary:hover {
    color: var(--button-primary-outline-color-hover) !important;
    background-color: var(--button-primary-outline-background-color-hover) !important;
    border-color: var(--button-primary-outline-border-color) !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(var(--button-primary-outline-border-color), 0.4) !important;
}

.user-portal .btn-secondary {
    color: var(--button-secondary-color);
    background-color: var(--button-secondary-background-color);
    border-color: var(--button-secondary-border-color);
    box-shadow: 0 0.125rem 0.25rem 0 rgba(var(--button-secondary-background-color), 0.4);
}

.user-portal .btn-secondary:hover {
    color: var(--button-secondary-color) !important;
    background-color: var(--button-secondary-background-color-hover) !important;
    border-color: var(--button-secondary-border-color) !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(var(--button-secondary-background-color), 0.4) !important;
}

.user-portal .btn-outline-secondary {
    color: var(--button-secondary-outline-color);
    background-color: var(--button-secondary-outline-background-color);
    border-color: var(--button-secondary-outline-border-color);
}

.user-portal .btn-outline-secondary:hover {
    color: var(--button-secondary-outline-color-hover) !important;
    background-color: var(--button-secondary-outline-background-color-hover) !important;
    border-color: var(--button-secondary-outline-border-color) !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(var(--button-secondary-outline-border-color), 0.4) !important;
}

.user-portal .btn-dark {
    color: var(--button-secondary-color);
    background-color: var(--button-dark-background-color);
    border-color: var(--button-dark-border-color);
    box-shadow: 0 0.125rem 0.25rem 0 rgba(var(--button-dark-background-color), 0.4);
}

.user-portal .btn-dark:hover {
    color: var(--button-dark-color) !important;
    background-color: var(--button-dark-background-color-hover) !important;
    border-color: var(--button-dark-border-color) !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(var(--button-dark-background-color), 0.4) !important;
}

.user-portal .btn-outline-dark {
    color: var(--button-dark-outline-color);
    background-color: var(--button-dark-outline-background-color);
    border-color: var(--button-dark-outline-border-color);
}

.user-portal .btn-outline-dark:hover {
    color: var(--button-dark-outline-color-hover) !important;
    background-color: var(--button-dark-outline-background-color-hover) !important;
    border-color: var(--button-dark-outline-border-color) !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(var(--button-dark-outline-border-color), 0.4) !important;
}

.user-portal .btn-danger {
    color: var(--button-danger-color);
    background-color: var(--button-danger-background-color);
    border-color: var(--button-danger-border-color);
    box-shadow: 0 0.125rem 0.25rem 0 rgba(var(--button-danger-background-color), 0.4);
}

.user-portal .btn-danger:hover {
    color: var(--button-danger-color) !important;
    background-color: var(--button-danger-background-color-hover) !important;
    border-color: var(--button-danger-border-color) !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(var(--button-danger-background-color), 0.4) !important;
}

.user-portal .btn-outline-danger {
    color: var(--button-danger-outline-color);
    background-color: var(--button-danger-outline-background-color);
    border-color: var(--button-danger-outline-border-color);
}

.user-portal .btn-outline-danger:hover {
    color: var(--button-danger-outline-color-hover) !important;
    background-color: var(--button-danger-outline-background-color-hover) !important;
    border-color: var(--button-danger-outline-border-color) !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(var(--button-danger-outline-background-color-hover), 0.4) !important;
}

.user-portal .text-primary {
    color: var(--primary-color) !important;
}

.user-portal .product-name {
    color: var(--product-name-color);
}

.user-portal .product-name > span,
.checkout-page .product-name > span,
.checkout-public .product-name > span,
.pricing-page .product-name > span,
.subscription-dashboard .product-name > span {
    display: inline-block;
    vertical-align: middle;
}

.user-portal .api-icon {
    color: var(--api-icon-color);
}

.user-portal .api-header h4 {
    color: var(--api-header-color);
}

/**
* Emphasis
*/

.user-portal .table-totals td, 
.user-portal .pricing-table .price-name,
.user-portal .pricing-table .product-free,
.user-portal .api-details .endpoint-details .endpoint-summary {
    color: var(--card-emphasis-color);
}


/**
* Navbar
*/
.user-portal .layout-navbar {
    box-shadow: var(--navbar-box-shadow);
}

.user-portal .layout-navbar .dropdown-menu {
    box-shadow: var(--navbar-dropdown-menu-box-shadow);
}

.user-portal .layout-navbar,
.user-portal .layout-navbar .dropdown-menu {
    background-color: var(--navbar-background-color) !important;
    border-radius: var(--navbar-border-radius);
}

.user-portal .layout-navbar .dropdown-menu {
    box-shadow: var(--navbar-dropdown-menu-box-shadow);
}

.user-portal .layout-navbar .nav-item > a.nav-link,
.user-portal .layout-navbar .dropdown-item {
    color: var(--navbar-link-color);
}

.user-portal .layout-navbar .nav-item > a.nav-link:hover,
.user-portal .layout-navbar .dropdown-item:hover {
    color: var(--navbar-link-color-hover);
}

/**
* Input
*/

.user-portal label {
    color: var(--card-color);
}

.user-portal input,
.user-portal form input,
.user-portal select,
.user-portal .input-group input,
.user-portal .form-control {
    color: var(--input-color);
    background-color: var(--input-background-color);
    border-color: var(--input-border-color) !important;
}

.user-portal input:-internal-autofill-selected,
.user-portal input:-webkit-autofill,
.user-portal input:-webkit-autofill,:hover
.user-portal input:-webkit-autofill:focus,
.user-portal input:-webkit-autofill:active,
.user-portal form input:-internal-autofill-selected,
.user-portal form input:-webkit-autofill,
.user-portal form input:-webkit-autofill,:hover
.user-portal form input:-webkit-autofill:focus,
.user-portal form input:-webkit-autofill:active,
.user-portal select:-internal-autofill-selected,
.user-portal select:-webkit-autofill,
.user-portal select:-webkit-autofill,:hover
.user-portal select:-webkit-autofill:focus,
.user-portal select:-webkit-autofill:active,
.user-portal form select:-internal-autofill-selected,
.user-portal form select:-webkit-autofill,
.user-portal form select:-webkit-autofill,:hover
.user-portal form select:-webkit-autofill:focus,
.user-portal form select:-webkit-autofill:active {
    color: var(--input-color) !important;
    -webkit-text-fill-color: var(--input-color);
    caret-color: var(--input-color);
}

.user-portal .input-group:focus-within .form-control, 
.user-portal .input-group:focus-within .input-group-text {
    border-color: var(--input-border-color-focus) !important;
}

.user-portal .input-group .input-group-text {
    background-color: var(--input-group-button-background-color);
    color: var(--input-group-button-color);
    border-color: var(--input-border-color) !important;
}

.user-portal .form-control:focus, .user-portal .form-select:focus {
    border-color: var(--input-border-color-focus) !important;
}

.user-portal .form-check-input:checked, .user-portal .form-check-input[type=checkbox]:indeterminate {
    background-color: var(--input-border-color-focus) !important;
}

/**
* Menu
*/

.user-portal .layout-menu {
    background-color: var(--menu-background-color) !important;
    color: var(--menu-color) !important;
}

.user-portal .layout-menu .app-brand,
.user-portal .layout-menu .app-brand .app-brand-link,
.user-portal .authentication-inner .app-brand {
    color: var(--menu-app-brand-link-color);
}

.user-portal .layout-menu .app-brand .app-brand-link:hover {
    color: var(--menu-app-brand-link-color-hover);
}

.user-portal .layout-menu .app-brand .app-brand-logo,
.user-portal .authentication-inner .app-brand .app-brand-logo,
.user-portal .pricing-page .app-brand-logo {
    content: var(--menu-app-brand-logo-url);
    max-height: 2rem;
}

.user-portal .layout-menu .app-brand .app-brand-name::before,
.user-portal .authentication-inner .app-brand .app-brand-name::before,
.user-portal .pricing-page .app-brand-name::before {
    content: var(--menu-app-brand-name-content);
}

.user-portal .layout-menu .menu-header {
    color: var(--menu-header-color);
}

.user-portal .layout-menu .menu-item {
    color: var(--menu-item-color);
    background-color: var(--menu-item-background-color);
    transition-duration: 0.3s;
    transition-property: color, background-color, left;
}

.user-portal .layout-menu .menu-item:hover {
    color: var(--menu-item-color-hover) !important;
    background-color: var(--menu-item-background-color-hover) !important;
}

.user-portal .layout-menu .menu-item .menu-link {
    color: var(--menu-item-link-color);
    background-color: var(--menu-item-link-background-color);
}

.user-portal .layout-menu .menu-item:hover .menu-link {
    color: var(--menu-item-link-color-hover) !important;
    background-color: var(--menu-item-link-background-color-hover) !important;
}

.user-portal .layout-menu .menu-item.active {
    color: var(--menu-item-active-color);
    background-color: var(--menu-item-active-background-color) !important;
    transition-duration: 0.3s;
    transition-property: color, background-color, left;
}

.user-portal .layout-menu .menu-item.active:hover {
    color: var(--menu-item-active-color-hover) !important;
    background-color: var(--menu-item-active-background-color-hover) !important;
}

.user-portal .layout-menu .menu-item.active .menu-link {
    color: var(--menu-item-active-link-color);
    background-color: var(--menu-item-active-link-background-color) !important;
    transition-duration: 0.3s;
    transition-property: color, background-color, left;
}

.user-portal .layout-menu .menu-item.active:hover .menu-link {
    color: var(--menu-item-active-link-color-hover) !important;
    background-color: var(--menu-item-active-link-background-color-hover) !important;
}

.user-portal .layout-menu .menu-item.active::before {
    background-color: var(--menu-item-bullet-color);
}

.user-portal .layout-menu .menu-item.active::before:hover {
    background-color: var(--menu-item-bullet-color-hover);
}

/* 
* Headings
*/
h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
    color: var(--heading-color);
}

/*
* Modal 
*/

.user-portal .modal-content {
    background-color: var(--modal-content-background-color);
}


.user-portal .authentication-wrapper.authentication-basic .authentication-inner:before {
    background-image: var(--login-form-bullets-background);
}

.user-portal .bg-primary {
    background-color: var(--primary-color) !important;
}

.minh-100 {
    min-height: 100%;;
}

input.number-no-arrows[type=number]::-webkit-inner-spin-button, 
input.number-no-arrows[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0; 
}


.form-check-inline {
    margin-right: 0;
}
