.ally-tooltip,
.arrow::after {
    left: 100px;
    position: absolute;
    top: 100px;
    visibility: hidden;
}

.ally-tooltip {
    border-radius: 3px;
    border: 1px solid #DDD;
    box-shadow: 6px 5px 9px -9px #000;
    color: #FFF;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
    max-width: 400px;
    opacity: 0.9;
    padding: 10px 20px;
    text-align: center;
    z-index: 9999;
}

.ally-tooltip div:first-child {
    position: relative;
    white-space: nowrap;
    z-index: 2;
}

.ally-tooltip,
.ally-tooltip .ally-arrow::after {
    background-color: #000;
}

.ally-tooltip .ally-arrow {
    bottom: -16px;
    height: 16px;
    left: 50%;
    margin-left: -35px;
    overflow: hidden;
    position: absolute;
    width: 70px;
    pointer-events: none;
}

.ally-tooltip .ally-arrow.ally-arrow-top {
    bottom: auto;
    top: -16px;
}

.ally-tooltip .ally-arrow::after {
    border: 1px solid #000;
    box-shadow: 6px 5px 9px -9px #000;
    content: "";
    height: 25px;
    left: 21px;
    position: absolute;
    top: -20px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 25px;
    border-color: #FFF;
}

.ally-tooltip .ally-arrow-top::after {
    bottom: -20px;
    top: auto;
}

.ally-tooltip .ally-arrow-bottom {
    top: -16px;
}

.ally-tooltip .ally-arrow-bottom::after {
    bottom: -20px;
    top: auto;
}

.ally-tooltip .ally-arrow-left {
    left: 0;
    margin-left: -28px;
    top: calc(50% - 17px);
    height: 38px;
    width: 28px;
}

.ally-tooltip .ally-arrow-left::after {
    right: auto;
    top: 4px;
}

.ally-tooltip .ally-arrow-right {
    left: 100%;
    margin-left: 0;
    top: calc(50% - 18px);
    height: 38px;
    width: 14px;
}

.ally-tooltip .ally-arrow-right::after {
    left: -20px;
    top: 5px;
}

.ally-tooltip .ally-tooltip-under {
    background-color: #333;
    color: #FFF;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    margin-left: 16px;
}

.ally-helper-hidden-accessible {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/**
 * Copyright (c) 2016 "Fronteer LTD". All rights reserved.
 */

html {
    padding-bottom: 40px;
    padding-top: 20px;
}

body {
    color: #333;
}

/** Re-apply reset overrides from projects/common */
body h1,
body h2,
body h3,
body h4,
body h5,
body h6 {
    margin: 20px 0 10px;
}

h2,
h3 {
    font-size: 18px;
    font-weight: 300;
    margin-bottom: 0;
}

h3 {
    margin-top: 40px;
}

body a,
body a:focus,
body a:hover,
body a:visited {
    color: #337AB7;
}

body a:focus,
body a:hover {
    text-decoration: underline;
}

ul.nav.nav-tabs {
    margin-bottom: 10px;
}

[dir="rtl"] .nav {
    padding-right: 0;
}

[dir="rtl"] .nav-tabs > li {
    float: right;
}

.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}

/* Avoid contrast warnings */
.sr-only {
    background-color: #000;
    color: #FFF;
}

/* Avoid browser scrolling by focussing on hidden table rows */
.sr-only.sr-only-table-wrapper {
    height: 1px;
    overflow-y: auto;
}

/* Bootstrap vertical row alignment */

.inside-full-height {
    height: 100%;
    margin-bottom: 0;
    margin-top: 0;
}

.content {
    padding: 12px 3px;
}

.row-height {
    display: table;
    height: 100%;
    table-layout: fixed;
    width: 100%;
}

.col-height {
    display: table-cell;
    float: none;
    height: 100%;
}

.col-top {
    vertical-align: top;
}

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

.col-bottom {
    vertical-align: bottom;
}

@media (min-width: 480px) {
    .row-xs-height {
        display: table;
        table-layout: fixed;
        height: 100%;
        width: 100%;
    }

    .col-xs-height {
        display: table-cell;
        float: none;
        height: 100%;
    }

    .col-xs-top {
        vertical-align: top;
    }

    .col-xs-middle {
        vertical-align: middle;
    }

    .col-xs-bottom {
        vertical-align: bottom;
    }
}

@media (min-width: 768px) {
    .row-sm-height {
        display: table;
        height: 100%;
        table-layout: fixed;
        width: 100%;
    }

    .col-sm-height {
        display: table-cell;
        float: none;
        height: 100%;
    }

    .col-sm-top {
        vertical-align: top;
    }

    .col-sm-middle {
        vertical-align: middle;
    }

    .col-sm-bottom {
        vertical-align: bottom;
    }
}

@media (min-width: 992px) {
    .row-md-height {
        display: table;
        height: 100%;
        table-layout: fixed;
        width: 100%;
    }

    .col-md-height {
        display: table-cell;
        float: none;
        height: 100%;
    }

    .col-md-top {
        vertical-align: top;
    }

    .col-md-middle {
        vertical-align: middle;
    }

    .col-md-bottom {
        vertical-align: bottom;
    }
}

@media (min-width: 1200px) {
    .row-lg-height {
        display: table;
        height: 100%;
        table-layout: fixed;
        width: 100%;
    }

    .col-lg-height {
        display: table-cell;
        float: none;
        height: 100%;
    }

    .col-lg-top {
        vertical-align: top;
    }

    .col-lg-middle {
        vertical-align: middle;
    }

    .col-lg-bottom {
        vertical-align: bottom;
    }
}

.translate-cloak,
[data-ng-cloak] {
    display: none;
}

.ally-report-no-results {
    background-color: #F7F7F7;
    margin-top: 10px;
    padding: 15px 20px;
}

.ally-report-container {
    background-color: #F7F7F7;
    margin-top: 27px;
}

.ally-report-container.row {
    margin-left: 0;
    margin-right: 0;
}

/* DROPDOWNS */
.ally-report-select {
    display: flex;
    font-weight: 300;
    position: relative;
}

.ally-report-select.ally-report-select-primary {
    font-size: 18px;
    padding-left: 0;
}

.ally-report-select select {
    background-color: #FFF;
    border: 2px solid #FFF;
    border-radius: 5px;
    color: #666;
    cursor: pointer;
    display: block;
    line-height: normal;
    margin-top: 3px;
    margin-bottom: 3px;
    outline: none;
    padding: 4px 15px 4px 10px;
    -webkit-appearance: none;
    background-image: url(/static/down-arrow-svgrepo-com.b72f5bd00b5a75d584be.svg);
    background-repeat: no-repeat;
    background-position: top 10px right 12px;
    background-size: 8px;
}

[dir="rtl"] .ally-report-select select {
    padding-right: 10px;
    padding-left: 15px;
}

.ally-report-select:hover select,
.ally-report-select select:focus {
    border: 2px solid #335CAD;
    background-color: #F7F7F7;
    transition: border 250ms;
}

.ally-report-select.ally-report-select-primary select {
    background-color: #515151;
    border-color: #515151;
    color: #FFF;
    background-image: url(/static/arrow-down.5a7ed68e6c51c0e76f84.svg);
    background-repeat: no-repeat;
    background-position: top 10px right 12px;
    background-size: 8px;
}

.ally-report-select.ally-report-select-primary:hover select,
.ally-report-select.ally-report-select-primary select:focus {
    background-color: #333;
    border-color: #333;
}

.ally-report-select.ally-report-select-primary select:focus {
    outline: 2px solid #337AB7;
    outline-offset: 2px;
}

.ally-report-select option {
    background-color: #FFF;
    color: #333;
}

.ally-report-select.ally-report-select-primary option {
    font-size: 14px;
    height: 22px;
}

/* LISTS */

.ally-list-container h4 {
    font-size: 18px;
    font-weight: 300;
    margin-bottom: 30px;
    margin-top: 40px;
}

ul.ally-list {
    padding-left: 0;
}

[dir="rtl"] ul.ally-list {
    padding-right: 0;
    padding-left: unset;
}

ul.ally-list li {
    list-style-type: none;
    padding: 10px 20px;
}

ul.ally-list li:nth-child(odd) {
    background-color: #F7F7F7;
}

ul.ally-list.ally-list-links li:hover {
    background-color: #EBEBEB;
}

ul.ally-list.ally-list-links li a {
    color: inherit;
    text-decoration: none;
}

ul.ally-list.ally-list-links li:hover a,
ul.ally-list.ally-list-links li:hover a i {
    color: #006B9D;
}

ul.ally-list.ally-list-links li .ally-list-metadata {
    font-size: 17px;
}

@media (min-width: 768px) {
    ul.ally-list.ally-list-links li .ally-list-metadata {
        text-align: center;
    }
}

ul.ally-list.ally-list-links li .ally-list-metadata i {
    color: #444;
    margin-right: 7px;
}

[dir="rtl"] ul.ally-list.ally-list-links li .ally-list-metadata i {
    margin-right: unset;
    margin-left: 7px;
}

/* ACCESSIBILITY SCORE WITHIN LIST */

.ally-list-score {
    margin-left: 35px;
    position: relative;
}

[dir="rtl"] .ally-list-score {
    margin-left: unset;
    margin-right: 35px;
}

.ally-list-score::before {
    background-repeat: no-repeat;
    background-size: 22px auto;
    content: " ";
    height: 20px;
    left: -35px;
    position: absolute;
    top: 4px;
    width: 22px;
}

[dir="rtl"] .ally-list-score::before {
    left: unset;
    right: -35px;
}

.ally-list-score.ally-list-score-low::before {
    background-image: url(/static/ally-icon-indicator-low.1137c740643376301e4e.webp);
}

.ally-list-score.ally-list-score-medium::before {
    background-image: url(/static/ally-icon-indicator-medium.1cf42cd68c396246007a.webp);
}

.ally-list-score.ally-list-score-high::before {
    background-image: url(/static/ally-icon-indicator-high.c8cf6f9cf14dedd21956.webp);
}

/* A link that wraps a score indicator and launches the IF */

.ally-report-list-score-indicator {
    display: inline-block;
    margin-right: 6px;
    width: 24px;
}

[dir="rtl"] .ally-list-score-indicator {
    margin-right: unset;
    margin-left: 6px;
}

/* FORM CONTROL */

.form-control::-webkit-input-placeholder {
    color: #777;
}

/* Mozilla Firefox 4 to 18 */
.form-control:-moz-placeholder {
    color: #777;
}

/* Mozilla Firefox 19+ */
.form-control::-moz-placeholder {
    color: #777;
}

/* Internet Explorer 10-11 */
.form-control:-ms-input-placeholder {
    color: #777;
}

/* Microsoft Edge */
.form-control::-ms-input-placeholder {
    color: #777;
}

.form-control::placeholder {
    color: #777;
}

/* NAVIGATION */

.ally-report-tabs {
    font-size: 16px;
}

.ally-report-tabs > li {
    cursor: pointer;
}

/* PAGINATION */

.ally-pagination ul.pagination li a {
    background-color: #222;
    border: solid 2px #222;
    box-sizing: content-box;
    color: #FFF;
    font-size: 12px;
    margin: 0 2px;
    min-width: 20px;
    padding: 10px 5px;
    text-decoration: none;
}

.ally-pagination ul.pagination li a:hover {
    background-color: #FFF;
    color: #222;
    text-decoration: none;
}

.ally-pagination ul.pagination li:first-child a,
.ally-pagination ul.pagination li:last-child a {
    padding-left: 30px;
    padding-right: 30px;
}

.ally-pagination ul.pagination li.active a {
    background-color: #FFF;
    border: solid 2px #F3F3F3;
    color: #555;
    padding: 10px 5px;
}

.ally-pagination ul.pagination li.disabled a {
    background-color: #F3F3F3;
    border: solid 2px #F3F3F3;
    color: #555;
}

.ally-pagination ul.pagination li.paging-ellipsis a {
    background-color: transparent;
    border: solid 2px transparent;
    color: #333;
}

.ally-pagination ul.pagination li.paging-ellipsis a:hover {
    border: solid 2px #222;
}

/* SEVERITY ICONS */

#ally-report-issues-tabs .ally-report-severity-icon-severe,
.ally-report-severity-icon-severe,
.ally-report-severity-icon-severe:hover,
.ally-report-severity-icon-severe:focus {
    color: #D0011B;
}

#ally-report-issues-tabs .ally-report-severity-icon-major,
.ally-report-severity-icon-major,
.ally-report-severity-icon-major:hover,
.ally-report-severity-icon-major:focus {
    color: #E58100;
}

#ally-report-issues-tabs .ally-report-severity-icon-minor,
.ally-report-severity-icon-minor,
.ally-report-severity-icon-minor:hover,
.ally-report-severity-icon-minor:focus {
    color: #C1B528;
}

/* LOADING ICON */

@keyframes spin {
    100% {
        transform: rotate(360deg);
    }
}

.ally-report-loading {
    text-align: center;
}

.ally-report-loading img {
    animation: spin 1s linear infinite;
    height: 80px;
    margin: auto;
    opacity: 1;
    outline: none;
    transition: opacity 0.2s linear;
    width: 80px;
}

.ally-course-list-loading {
    height: 80px;
}

/* BUTTONS */

.btn {
    border-radius: 4px;
    margin: 0 10px;
    line-height: 24px;
    padding: 6px 15px;
}

.btn.btn-black {
    background-color: #474747;
    color: #FFF;
}

.btn.btn-black:focus,
.btn.btn-black:hover {
    background-color: #FFF;
    border: 1px solid #474747;
    color: #474747;
}

.btn.btn-white {
    background-color: #FFF;
    border: 1px solid #474747;
    color: #474747;
}

.btn.btn-white:focus,
.btn.btn-white:hover {
    background-color: #474747;
    color: #FFF;
}

.btn.btn-white svg {
    height: 24px;
    margin-right: 5px;
    vertical-align: bottom;
    width: 24px;
}

.btn.btn-white:focus svg > path,
.btn.btn-white:hover svg > path {
    fill: #FFF;
}

.ally-tooltip {
    font-weight: 400;
    max-width: 365px;
}

.ally-tooltip div:first-child {
    white-space: normal;
}

.nav > li.ally-report-tab-hidden {
    display: none;
}

.report-breadcrumbs {
    font-size: 16px;
    margin-bottom: 15px;
}

.report-breadcrumbs ol {
    list-style-type: none;
    padding: 0;
}

.report-breadcrumbs li {
    display: inline-block;
    margin: 0;
    padding: 0 10px 0 0;
    position: relative;
}

.report-breadcrumbs li:not(:first-child) {
    padding-left: 10px;
}

.report-breadcrumbs li::after {
    border-left: solid 1px #333;
    content: '';
    display: inline-block;
    height: 80%;
    right: -2px;
    position: absolute;
    top: 3px;
    transform: rotate(20deg);
    width: 1px;
}

.report-breadcrumbs li > a,
.report-breadcrumbs li > a:focus,
.report-breadcrumbs li > a:hover,
.report-breadcrumbs li > a:visited {
    text-decoration: underline;
}

.report-department-name {
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 40px;
}

.report-back {
    align-items: center;
    display: flex;
    margin: 0 0 30px 0;
}

.report-back svg path.arrow {
    fill: #337AB7;
}

.top-buttons {
    display: flex;
    flex-direction: row-reverse;
}

.top-buttons-overview {
    float: right;
}

.top-buttons breadcrumb {
    margin-right: auto;
    order: 3;
}

[dir="rtl"] .top-buttons breadcrumb {
    margin-left: auto;
    margin-right: 0;
}

.top-buttons client-onboard {
    margin-right: 8px;
    order: 2;
}

[dir="rtl"] .top-buttons client-onboard {
    margin-right: 0;
    margin-left: 8px;
}

.top-buttons .csv-export {
    order: 1;
}

@media (max-width: 600px) {
    .top-buttons {
        flex-direction: column-reverse;
        gap: 10px;
        margin-bottom: 20px;
    }

    .top-buttons .ally-breadcrumb {
        margin-bottom: 0;
    }
}

/**
 * Copyright (c) 2016 "Fronteer LTD". All rights reserved.
 */

/* GROUP BY DROPDOWN */

.ally-report-groupby-container {
    margin-top: 12px;
}

.ally-report-line-chart {
    display: inline-block;
    width: 100%;
}

.report-overview-heading {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

/* MATERIAL ICONS */

/* For most cases, aligning to the bottom of the line is sufficient, further aligning can be done
   through one-off rules that set position: relative; and offsets or through line-height adjustments. */
i.material-icons {
    vertical-align: bottom;
}

/* ACCESSIBILITY SCORE */

.ally-report-score-container {
    height: 350px;
    margin-top: 20px;
    position: relative;
}

/* SELECT TIME PERIOD */

.ally-report-period-container {
    margin-top: 45px;
    margin-bottom: 10px;
}

/* FOCUS STYLES FOR SELECT TIME PERIOD */

#ally-report-period:focus {
    outline: 2px solid #337AB7;
    outline-offset: 2px;
}

/* PIE CHARTS */

[dir="rtl"] .ally-report-pie {
    float: right;
}

.ally-report-pie-container {
    height: 400px;
    position: relative;
    text-align: center;
}

.ally-report-pie-title {
    font-size: 16px;
    font-weight: 400;
    left: 0;
    margin: 0;
    position: absolute;
    right: 0;
    top: 30px;
}

.ally-report-pie-footer {
    bottom: 20px;
    font-size: 14px;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 10;
}

.ally-report-pie-total {
    bottom: 30px;
    left: 0;
    position: absolute;
    right: 0;
    top: 30px;
}

.ally-report-pie-chart {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.ally-report-pie-highchart {
    height: 100%;
    width: 100%;
    display: block;
}

.ally-report-pie-highchart > .highcharts-container {
    width: 100% !important;
}

.ally-report-pie-content {
    height: 100%;
}

.ally-report-pie-total > .ally-report-pie-total-container {
    display: table;
    height: 100%;
    width: 100%;
}

.ally-report-pie-total > .ally-report-pie-total-container > .ally-report-pie-inner-circle {
    display: table-cell;
    vertical-align: middle;
}

.ally-report-pie-total > .ally-report-pie-total-container > .ally-report-pie-inner-circle > .ally-report-pie-total-number {
    font-size: 30px;
}

.ally-report-pie-total > .ally-report-pie-total-container > .ally-report-pie-inner-circle > .ally-report-pie-total-submessage {
    font-size: 16px;
}

.ally-report-pie-previous-total,
.ally-report-pie-percentage {
    font-weight: bold;
}

.ally-report-difference {
    margin-left: 10px;
    padding: 8px;
}

.ally-report-difference:hover {
    background-color: white;
    border-radius: 4px;
    border: 1px solid #808D96;
}

.ally-report-difference i {
    font-size: 16px;
    position: relative;
    top: 2px;
}

.ally-report-difference.ally-report-increase i {
    vertical-align: baseline;
}

.ally-report-difference.ally-report-decrease i {
    vertical-align: baseline;
}

.ally-report-difference.ally-report-same i {
    vertical-align: -1px;
}

/* ACCESSIBILITY ISSUES */

.ally-report-issues-tabs {
    margin-top: 30px;
}

.ally-report-issues-tabs li > a {
    border: 0;
    font-size: 16px;
    margin-right: 0;
    padding: 14px 25px;
}

.ally-report-issues-tabs li.active a {
    padding-bottom: 16px;
    padding-top: 16px;
}

.ally-report-issues-tabs li:first-child a {
    color: #16AFCB;
    height: 57px;
}

.ally-report-issues-tabs li:not(.active) a {
    border-bottom: 5px solid;
}

.ally-report-issues-tabs li > a i {
    margin-right: 5px;
}

.ally-report-issues-tabs li > a span.ally-report-issues-tab-text {
    color: #333;
}

.ally-report-issues-container .ally-report-issues {
    margin: 35px 0 0;
}

.ally-report-issues-container .ally-report-issues svg.ally-report-issues-arrow {
    fill: currentColor;
}

.ally-report-issues-container .ally-report-issues .ally-report-issue-title-heading {
    padding-left: 70px;
}

.ally-report-issues-content {
    font-weight: bold;
}

.ally-report-issues-number-container {
    display: flex;
}

.ally-report-issues-severity {
    flex-shrink: 0;
    font-size: 20px;
    margin-top: -5px;
    width: 40px;
}

.ally-report-issues-number {
    flex: 0 0 30px;
    width: 30px;
}

.ally-report-issues-number::after {
    content: ".";
}

.ally-report-issues-description {
    font-weight: normal;
}

.ally-report-issues-total {
    color: #535F68;
    font-size: 14px;
}

.ally-report-issues-counts-cell {
    display: flex;
}

.ally-report-issues-counts {
    color: #046D7A;
    font-weight: 700;
    min-width: 50px;
}

.ally-report-issues-bar {
    background-color: #47494C;
    height: 20px;
    margin-left: 30px;
}

@media (min-width: 768px) {
    .ally-report-issues-counts {
        margin-left: 20px;
        text-align: right;
    }
}

.highcharts-axis-labels {
    z-index: -1;
}

div.report-overview-tooltip-item {
    margin: 8px 12px 8px 12px;
}

.report-overview-tooltip-item > p {
    font-size: 14px;
    font-weight: 500;
}

[dir="rtl"] .report-overview-tooltip {
    text-align: right;
}

.report-overview-tooltip > p {
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    padding-left: 8px;
}

.report-overview-tooltip > svg {
    display: inline-block;
    margin-right: 5px;
    vertical-align: middle;
}

[dir="rtl"] .report-overview-tooltip > svg {
    margin-left: 5px;
}

.highcharts-legend {
    z-index: -1;
}

.report-overview-tooltip-item p {
    margin: 0 12px 6px 12px;
    font-weight: 500;
    font-size: 14px;
}

.report-overview-tooltip {
    display: flex;
    align-items: center;
    gap: 8px;
    line-height: 2.2;
    margin: 0 12px;
    flex-wrap: nowrap;
}

.report-overview-tooltip svg {
    width: 40px;
    height: 16px;
    flex-shrink: 0;
    display: block;
}

.tooltip-text {
    font-size: 14px;
}

input.highcharts-legend-checkbox[type=checkbox] {
    /* stylelint-disable-next-line */
    accent-color: #000;
}

input.highcharts-legend-checkbox[type=checkbox]:not(:checked) {
    /* stylelint-disable-next-line */
    accent-color: #000;
    border-color: #8C8C8C;
}

input.highcharts-legend-checkbox[type=checkbox]:hover {
    /* stylelint-disable-next-line */
    accent-color: #8C8C8C;
    cursor: pointer;
}

.ally-report-tabs li a:hover {
    background-color: #F3F3F3;
    color: #0374B5;
}

.hc-legend-proxies {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
}

.hc-legend-proxy-btn {
    position: absolute;
    pointer-events: auto;
    background: transparent;
    border: 2px solid transparent;
    padding: 0;
    margin: 0;
    line-height: 1;
}

.hc-legend-proxy-btn:focus {
    outline: none;
}

.hc-legend-proxy-btn:focus-visible {
    outline-offset: 1px;
    outline: 2px solid #0078D7;
    border-radius: 2px;
}

/**
 * Copyright (c) 2016 "Fronteer LTD". All rights reserved.
 */

.ally-breadcrumb {
    margin-bottom: 35px;
    display: inline-flex;
    width: max-content;
}

.ally-breadcrumb svg {
    font-size: 18px;
    font-weight: bold;
    left: -5px;
    position: relative;
    vertical-align: middle;
    fill: currentColor;
}

[dir="rtl"] {
    left: unset;
    right: -5px;
}

.ally-breadcrumb a:not(:first-child) i {
    margin-left: 3px;
}

.ally-breadcrumb a {
    padding: 2px 4px;
}

/**
 * Copyright (c) 2016 "Fronteer LTD". All rights reserved.
 */

.ally-report-course-heading {
    padding: 10px;
}

.ally-report-course-title {
    font-weight: 300;
    font-size: 20px;
    line-height: 1.4;
    margin: 0 180px 10px 0;
}

[dir="rtl"] .ally-report-course-title {
    margin-left: 180px;
    margin-right: 0;
}

.ally-report-course-title strong {
    display: block;
}

.ally-report-course-last-updated {
    font-size: 16px;
    font-weight: 300;
}

.ally-report-course-last-updated i {
    font-size: 20px;
    position: relative;
    top: -1px;
    vertical-align: middle;
}

.ally-report-course-last-updated .ally-if-warning {
    margin: 0;
}

.ally-report-course-info {
    font-size: 16px;
    margin-top: 20px;
}

.ally-report-course-info i.material-icons,
.ally-report-course-info svg {
    margin-right: 7px;
}

.ally-report-course-info svg.ally-report-course-info-launch {
    fill: currentColor;
    vertical-align: middle;
    width: 18px;
}

[dir="rtl"] .ally-report-course-info i.material-icons,
[dir="rtl"] .ally-report-course-info svg {
    margin-right: unset;
    margin-left: 7px;
}

.ally-report-course-info span + a {
    margin-left: 20px;
}

[dir="rtl"] .ally-report-course-info span + a {
    margin-left: unset;
    margin-right: 20px;
}

.ally-report-course-info a {
    display: inline-block;
    padding: 2px 4px;
}

.ally-report-course-item.ng-leave {
    opacity: 1;
    transition: 1s linear all;
}

.ally-report-course-item.ng-leave.ng-leave-active {
    opacity: 0;
}

.ally-course-items-all-items-fixed {
    padding: 50px 0;
}

.ally-course-items-all-items-fixed h4 {
    margin: 50px 0;
}

.ally-course-items-all-items-fixed .btn span {
    line-height: 24px;
}

/**
 * Copyright (c) 2016 "Fronteer LTD". All rights reserved.
 */

.ally-report-courses-filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 30px;
    margin-bottom: 30px;
}

.ally-report-courses-container {
    margin-bottom: 190px;
}

[dir=rtl] .ally-report-courses-filters .ally-report-select select {
    padding-left: 25px;
}

.ally-report-courses-code {
    font-weight: 300;
}

.ally-report-courses-title {
    font-weight: 500;
}

.ally-report-department-filter {
    margin-bottom: 30px;
    margin-top: 30px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.ally-report-department-filter .input-group,
.ally-report-department-filter .input-group-append {
    display: flex;
}

.ally-report-department-filter > div {
    padding-left: 0;
    margin-bottom: 0;
}

.ally-report-department-filter > div:last-child {
    padding-right: 0;
    max-width: 941px;
    width: 100%;
}

[dir="rtl"] .ally-report-department-filter > div {
    padding-left: 15px;
    padding-right: 0;
}

.ally-report-department-filter input {
    border: 1.3px solid #222;
    border-right-width: 0;
    height: 40px;
}

[dir="rtl"] .ally-report-department-filter input {
    border-right-width: 1.3px;
    border-left-width: 0;
    border-radius: 0 4px 4px 0 !important;
}

[dir="rtl"] #search {
    border-radius: 0 4px 4px 0;
}

.ally-report-department-filter input:focus {
    border: solid 1px #222;
    border-right-width: 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
}

[dir="rtl"] .ally-report-department-filter input:focus {
    border: solid 1px #222;
    border-right-width: 1.3px;
    border-left-width: 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
}

#ally-departments-search {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

[dir="rtl"] #ally-departments-search {
    border-radius: 4px 0 0 4px;
    margin-right: 0;
}

.ally-report-department-filter .btn.btn-default {
    background-color: #FFF;
    border: 1.3px solid #222;
    color: #222;
    height: 40px;
    margin-left: 0;
}

.ally-report-department-filter .btn.btn-default:hover {
    border-color: #222;
    background-color: #EEE;
    box-shadow: none;
    color: #222;
}

.ally-report-department-filter .btn.btn-default:focus {
    background-color: #222;
    border: solid 1px #222;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
    color: #EEE;
}

.ally-departments-search-icon {
    margin-top: 2px;
}

#ally-departments-search:focus .ally-departments-search-icon {
    fill: #FFF;
}

.ally-report-course-search .input-group,
.ally-report-course-search .input-group-append {
    display: flex;
}

.ally-report-department-filter .form-group {
    margin-bottom: 0;
}

.ally-report-courses-filters > div {
    padding-left: 0;
    margin-bottom: 0;
}

.ally-report-courses-filters > div:first-child {
    max-width: 941px;
    padding-right: 0;
}

[dir="rtl"] .ally-report-courses-filters > div {
    padding-left: 0;
    padding-right: 0;
}

.ally-report-course-search input {
    border: 1.3px solid #222;
    border-right-width: 0;
    height: 40px;
}

[dir="rtl"] .ally-report-course-search input {
    border-right-width: 1.3px;
    border-left-width: 0;
}

.ally-report-course-search input:focus {
    border: solid 1px #222;
    border-right-width: 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
}

[dir="rtl"] .ally-report-course-search input:focus {
    border: solid 1px #222;
    border-right-width: 1.3px;
    border-left-width: 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
}

.ally-report-course-search .form-group {
    margin-bottom: 0;
}

[dir="rtl"] #ally-report-courses-filter {
    border-radius: 0 4px 4px 0;
    margin-right: 0;
}

.ally-report-course-search .btn.btn-default {
    background-color: #FFF;
    border: 1.3px solid #222;
    color: #222;
    height: 40px;
    margin-left: 0;
}

.ally-report-course-search .btn.btn-default:hover {
    border-color: #222;
    background-color: #EEE;
    box-shadow: none;
    color: #222;
}

.ally-report-course-search .btn.btn-default:focus {
    background-color: #222;
    border: solid 1px #222;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
    color: #EEE;
}

.ally-courses-search-icon {
    margin-top: 2px;
}

#ally-courses-search:focus .ally-courses-search-icon {
    fill: #FFF;
}

#ally-courses-search {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

[dir="rtl"] #ally-courses-search {
    border-radius: 4px 0 0 4px;
    margin-right: 0;
}

/**
 * Copyright (c) 2016 "Fronteer LTD". All rights reserved.
 */

.ally-report-courses-with-issue-period-container {
    margin-top: 30px;
}

.ally-report-issues .ally-report-courses-deleted {
    color: #D0021B;
}

.ally-pagination ul.pagination {
    display: flex;
    justify-content: center;
}

[dir="rtl"] .ally-pagination li.pagination-prev > a {
    border-radius: 0 4px 4px 0;
}

[dir="rtl"] .ally-pagination li.pagination-next > a {
    border-radius: 4px 0 0 4px;
}

#report-departments-container {
    margin-bottom: 200px;
}

#report-departments-container h2 {
    color: #222;
    font-size: 24px;
    font-weight: bold;
    margin: 5px 0 30px 0;
}

#report-departments-container .report-breadcrumbs {
    font-size: 16px;
    margin-top: 35px;
}

.departments-loading {
    text-align: center;
}

.departments-loading > img {
    animation: spin 1s linear infinite;
    margin-top: 25px;
    width: 50px;
}

/**
 * Copyright (c) 2016 "Fronteer LTD". All rights reserved.
 */

.ally-report-issue-info-container {
    margin-top: 40px;
}

.ally-report-issue-info {
    padding: 25px 15px;
}

.ally-report-issue-info h3 {
    font-size: 20px;
    margin-top: 0;
}

.ally-report-issue-info p {
    margin-left: 40px;
    margin-top: 30px;
}

[dir="rtl"] .ally-report-issue-info p {
    margin-left: unset;
    margin-right: 40px;
}

.ally-report-issue-info-severity {
    float: left;
}

[dir="rtl"] .ally-report-issue-info-severity {
    float: right;
}

.ally-report-issue-info-title {
    display: block;
    margin-left: 40px;
}

[dir="rtl"] .ally-report-issue-info-title {
    margin-left: unset;
    margin-right: 40px;
}

.ally-report-issue-info-title > strong {
    font-weight: 500;
}

.ally-report-issue-info-title > span {
    display: block;
    font-weight: 300;
    margin-top: 3px;
}

.ally-report-issue-info-container .ally-report-issue-info-count-container {
    border-left: 10px solid #FFF;
    border-right: 10px solid #FFF;
    text-align: center;
}

@media (max-width: 767px) {
    .ally-report-issue-info-container .ally-report-issue-info-count-container {
        border-left: none;
        border-right: none;
        border-top: 10px solid #FFF;
    }
}

.ally-report-issue-info-count {
    font-size: 50px;
}

.ally-report-issue-info > p {
    white-space: pre-line;
}

/**
 * Copyright (c) 2016 "Fronteer LTD". All rights reserved.
 */

.ally-report-items-container .ally-report-items-type {
    float: left;
    line-height: 10px;
    position: relative;
    top: 15px;
}

.ally-report-items-container .ally-report-items-indent {
    margin-left: 45px;
}

.ally-report-items-container .ally-report-items-title {
    font-size: 15px;
}

.ally-report-items-container .ally-report-items-type-text {
    font-weight: bold;
}

.ally-report-items-container .ally-report-courses-deleted {
    color: #D0021B;
}

.ally-report-items-container .ally-report-courses-fixed {
    color: #D0021B;
}

@media (min-width: 768px) {
    .ally-report-items-container .ally-report-items-score {
        padding-right: 30px;
        text-align: right;
    }
}

.report-overview-container .ally-usage-heading {
    display: flex;
}

.ally-usage-container {
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: wrap;
    font-size: 18px;
    font-weight: normal;
    padding: 32px;
}

.ally-usage-container .dateinput::placeholder {
    font-weight: normal;
}

.ally-usage-container .dateinput:focus {
    border: 1px solid #222;
    border-radius: 4px;
    outline: none;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
}

.ally-usage-container .ally-usage-image {
    flex-grow: 1;
}

.ally-usage-container .ally-usage-info {
    flex-grow: 1;
}

@media (max-width: 700px) {
    .ally-usage-container {
        padding: 16px 16px 16px 0;
    }
}

.ally-usage-smaller-container {
    display: flex;
    justify-content: flex-end;
}

.ally-usage-smaller {
    font-size: 16px;
    padding-top: 16px;
    text-align: right;
}

button.ally-download {
    align-items: center;
    background-color: #000;
    border-radius: 4px;
    border: 1px solid #000;
    color: #FFF;
    display: flex;
    flex-direction: row;
    height: 40px;
    justify-content: center;
    line-height: 24px;
    margin: 20px 0 0 0;
    min-width: 263px;
    padding: 0 15px;
}

button.ally-download[disabled] {
    background-color: #666;
    border: 1px solid #666;
    pointer-events: none;
}

button.ally-download:visited {
    color: #FFF;
}

button.btn.ally-download {
    opacity: 1;
}

.ally-download-report-icon {
    background-repeat: no-repeat;
    display: inline-block;
    height: 24px;
    width: 24px;
    min-width: 24px;
}

.ally-download-report-white {
    background-image: url(/static/icon-download-white.573e113c8f5bd0cfc37f.svg);
}

button.ally-download:hover .ally-download-report-white,
button.ally-download:focus .ally-download-report-white {
    background-image: url(/static/icon-download-black.c567a8ffa23318cb6011.svg);
}

button.ally-download:hover,
button.ally-download:focus {
    border: 1px solid #000;
    background-color: #FFF;
    color: #000;
}

button.ally-download:hover[disabled],
a.ally-download:focus[disabled] {
    background-color: #666;
    color: #FFF;
}

.ally-download-report-grey {
    background-image: url(/static/icon-download-grey.f148043c445caec85929.svg);
}

.ally-download-report-black {
    background-image: url(/static/icon-download-black.c567a8ffa23318cb6011.svg);
}

button.ally-download img {
    animation: spin 1s linear infinite;
    height: 24px;
    min-width: 24px;
    opacity: 1;
    outline: none;
    transition: opacity 0.2s linear;
    width: 24px;
}

.ally-download-description {
    margin-left: 15px;
    margin-right: 15px;
}

button.ally-download i {
    margin-right: 5px;
}

.ally-usage-container .form-control {
    border-radius: 0;
}

.dd,
.mm,
.yyyy {
    width: 22px;
    padding: 0;
    margin-left: 3px;
    margin-right: 3px;
    text-align: center;
    border: 0;
    box-shadow: none;
    border-color: #FFF;
    outline-color: #FFF;
    color: #222;
    font-size: 14px;
    font-weight: bold;
}

.mm {
    width: 26px;
}

.yyyy {
    width: 40px;
}

span.separator-char {
    font-size: 20px;
    font-weight: 100;
    color: #666;
}

.ally-usage-container .form-control:hover,
.ally-usage-container .form-control:focus {
    border-color: #000;
}

.img-responsive {
    width: 100%;
    vertical-align: middle;
    border: 0;
    max-width: 600px;
}

.flex-container {
    display: flex;
}

.popup {
    position: absolute;
    z-index: 100;
}

.usage-date-from {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    min-width: 150px;
}

.usage-date-to {
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    min-width: 150px;
}

[dir="rtl"] .usage-date-to div[uib-datepicker] {
    right: 28px;
}

.item-start {
    align-self: flex-start;
}

.disable-wrap {
    display: flex;
    flex-direction: row;
    align-items: center;
    background: #FFF;
    border: solid 1px #000;
    border-radius: 4px;
    width: 100%;
}

.disable-wrap[disabled] {
    background: #EEE;
}

.range {
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #666;
}

.download-row-spacer {
    padding-top: 20px;
    margin-bottom: 32px;
}

.validation {
    position: absolute;
    z-index: 90;
}

.validation-container {
    border-radius: 4px;
    border: solid 1px #F5C6CB;
    background-color: #F8D7DA;
    font-size: 14px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #721C24;
    padding: 16px;
    min-width: 264px;
}

.validation-error,
.disable-wrap.validation-error {
    border: solid 1px #D0011B;
}

.error-message {
    align-items: center;
    border-radius: 4px;
    border: solid 1px #AF0216;
    background-color: #F8D7DA;
    color: #000;
    display: flex;
    justify-content: center;
    max-width: 480px;
    padding: 16px 24px;
}

.error-description {
    flex-grow: 4;
}

button.close {
    font-size: 50px;
    opacity: 1;
    padding: 0 0 7px 0;
    text-shadow: none;
}

.close:focus,
.close:hover {
    color: #666;
    opacity: 1;
}

/* A scrollbar appears in the containing frame when the page is too small.
   Adding this spacer increases the page height and removes the scrollbar. */
.spacer {
    height: 300px;
}

input[type="date"] {
    padding: 11px 16px;
}

input[type="date"].popup {
    background: transparent;
}

div.usage-date-from {
    margin-right: 35px;
}




h1, h2, h3, h4, h5, h6 {
    margin: 0;
}

a,
a:hover,
a:focus,
a:visited {
    color: inherit;
    text-decoration: none;
}

.sr-only {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

[dir="rtl"] .rtl-mirror-x {
    transform: scaleX(-1);
}



@keyframes spin {
    100% {
        transform: rotate(360deg);
    }
}

.loading {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
}

.loading > svg-icon {
    display: flex;
    height: 100%;
    width: 100%;
}

.loading svg {
    animation: spin 1s linear infinite;
    margin: auto;
    opacity: 1;
    outline: none;
    stroke: #333;
    transition: opacity 0.2s linear;
    width: 70px;
}


@keyframes spin {
    100% {
        transform: rotate(360deg);
    }
}

.loading {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
}

.loading > svg-icon {
    display: flex;
    height: 100%;
    width: 100%;
}

.loading svg {
    animation: spin 1s linear infinite;
    margin: auto;
    opacity: 1;
    outline: none;
    stroke: #333;
    transition: opacity 0.2s linear;
    width: 70px;
}


.ally-note {
    align-items: center;
    display: flex;
}

.ally-note svg {
    width: 22px;
}

.ally-note .ally-note-text {
    border-left: 5px solid #222;
    margin: 0 0 0 15px;
    padding: 2px 0 2px 15px;
}

[dir="rtl"] .ally-note .ally-note-text {
    border-left: 0;
    border-right: 5px solid #222;
    margin: 0 15px 0 0;
    padding: 2px 15px 2px 0;
}

.ally-note .ally-note-text :first-child {
    margin-top: 0;
}

.ally-note .ally-note-text :last-child {
    margin-bottom: 0;
}

.ngx-pagination {
	margin-left: 0;
	margin-bottom: 1rem;
}

.ngx-pagination::before,
.ngx-pagination::after {
	content: ' ';
	display: table;
}

.ngx-pagination::after {
	clear: both;
}

.ngx-pagination li {
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	margin-right: 0.0625rem;
	border-radius: 0;
}

.ngx-pagination li {
	display: inline-block;
}

.ngx-pagination a,
.ngx-pagination button {
	color: #0a0a0a;
	display: block;
	padding: 0.1875rem 0.625rem;
	border-radius: 0;
}

.ngx-pagination a:hover,
.ngx-pagination button:hover {
	background: #e6e6e6;
}

.ngx-pagination .current {
	padding: 0.1875rem 0.625rem;
	background: #2199e8;
	color: #fefefe;
	cursor: default;
}

.ngx-pagination .disabled {
	padding: 0.1875rem 0.625rem;
	color: #cacaca;
	cursor: default;
}

.ngx-pagination .disabled:hover {
	background: transparent;
}

.ngx-pagination a,
.ngx-pagination button {
	cursor: pointer;
}

.ngx-pagination .pagination-previous a::before,
.ngx-pagination .pagination-previous.disabled::before {
	content: '«';
	display: inline-block;
	margin-right: 0.5rem;
}

.ngx-pagination .pagination-next a::after,
.ngx-pagination .pagination-next.disabled::after {
	content: '»';
	display: inline-block;
	margin-left: 0.5rem;
}

.ngx-pagination .pagination-previous-label,
.ngx-pagination .pagination-next-label {
    display: inline;
}

.ngx-pagination .pagination-previous-icon,
.ngx-pagination .pagination-next-icon {
    display: none;
    font-size: 34px;
}

.ngx-pagination .show-for-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
}

.ngx-pagination .small-screen {
	display: none;
}

@media screen and (max-width: 320px) {
    .ngx-pagination .pagination-previous-label,
    .ngx-pagination .pagination-next-label {
        display: none;
    }

    .ngx-pagination .pagination-previous-icon,
    .ngx-pagination .pagination-next-icon {
        display: inline;
    }
}

last-crawl .last-crawl-date {
    display: block;
    font-weight: bold;
}

last-crawl .ally-if-warning {
    align-items: center;
    display: flex;
    margin: 30px 0;
}

last-crawl .ally-note-text,
last-crawl .ally-note p {
    font-size: 14px;
    font-weight: 400;
    margin-top: 2px;
}


.ally-download-csv {
    display: flex;
    gap: 4px;
    align-items: center;
    background-color: #222;
    color: #FFF;
    border: 1px solid #222;
    border-radius: 4px;
    font-size: 14px;
    min-width: 111px;
    min-height: 38px;
    padding-left: 20px;
    padding-right: 20px;
    margin-right: 0;
    line-height: 24px;
}

.ally-download-csv-report-icon {
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
    min-width: 24px;
}

.ally-report-menu-dialog-icon {
    background-repeat: no-repeat;
    height: 24px;
    min-width: 24px;
    width: 24px;
}

.ally-report-menu-dialog-button-white {
    background-color: #FFF;
    color: #222;
}

.ally-report-menu-dialog-button .ally-dropdown-report-icon {
    background-image: url(/static/arrow-down-white.1f79317154c3410648d0.svg);
    background-position-x: 7px;
    height: 8px;
    min-width: 24px;
    width: 10px;
}

.ally-report-menu-dialog-button .ally-dropdown-report-icon-up {
    background-image: url(/static/dropdown-arrow-up.8f847f582b51d5c5aef2.svg);
    background-size: 12px;
    background-position: top 2px right 6px;
}

.ally-report-menu-dialog-button:hover .ally-dropdown-report-icon-down {
    background-image: url(/static/arrow-down-black.6cea8272cf107a9398bc.svg);
}

.ally-download-csv-report-white {
    background-image: url(/static/icon-download-white.573e113c8f5bd0cfc37f.svg);
}

.ally-download-csv-report-black {
    background-image: url(/static/icon-download-black.f18b78f49e61f4eebe3f.svg);
}

.ally-download-csv-report-grey {
    background-image: url(/static/icon-download-grey.f148043c445caec85929.svg);
}

button.ally-download-csv img {
    animation: spin 1s linear infinite;
    height: 24px;
    min-width: 24px;
    opacity: 1;
    outline: none;
    transition: opacity 0.2s linear;
    width: 24px;
    margin-right: 4px;
}

[dir="rtl"] .ally-download-csv {
    right: unset;
    left: 15px;
}

.ally-download-csv:focus {
    background-color: #222;
    color: #FFF;
    outline: 2px solid #337AB7;
    outline-offset: 2px;
}

.ally-download-csv:hover {
    background-color: #FFF;
    color: #222;
}

.ally-download-csv:hover .ally-download-csv-report-icon {
    background-image: url(/static/icon-download-black.f18b78f49e61f4eebe3f.svg);
}

.ally-download-csv:disabled {
    background-color: #4E4E4E;
    color: #CDD2D5;
}

.ally-report-menu-dialog-button-white:focus {
    background-color: #FFF;
    color: #222;
    border: 1px solid #00AAEF;
    outline: none;
    box-shadow: 0 0 0 2px rgba(0, 170, 239, 0.5);
}

.ally-report-api-token-dialog {
    margin-top: 3px;
    margin-right: 15px;
    background-color: #FFFFFF;
    border: 1px solid #CDCDCD;
    border-radius: 4px;
    box-shadow: 0 4px 4px 0 #DADADA;
    padding: 40px 32px;
    width: 432px;
    font-weight: 400;
}

.ally-report-api-token-dialog div {
    display: flex;
    line-height: 29px;
}

.ally-report-api-token-dialog h1 {
    font-size: 24px;
    color: #000000;
    margin: 0 0 16px;
    font-weight: 400;
}

.ally-report-api-token-dialog p {
    font-size: 14px;
    color: #333333;
    margin: 0;
    line-height: 18px;
}

.ally-report-api-token-dialog .close-dialog-button {
    right: 0;
    justify-content: flex-end;
    justify-self: right;
    background: none;
    border: none;
    margin: 0 0 0 auto;
    padding: 0;
    height: 21px;
}

[dir="rtl"] .ally-report-api-token-dialog .close-dialog-button {
    left: 0;
    justify-content: flex-start;
    margin: 0 auto 0 0;
    justify-self: left;
}

.ally-report-api-token-dialog .close-dialog-button img {
    width: 21px;
    height: 21px;
}


.ally-report-api-token-dialog .ally-report-api-token {
    margin-top: 24px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ally-report-api-token-dialog .ally-report-api-token img {
    animation: none;
}

.ally-report-api-token-dialog .ally-report-api-token p {
    display: flex;
    gap: 8px;
    width: 100%;
    padding: 9px;
    vertical-align: middle;
    border: #333333 1px solid;
    background-color: #F7F7F7;
    white-space: nowrap;
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.ally-report-api-token-dialog .ally-report-api-token p::-webkit-scrollbar {
    display: none;
    width: 0 !important;
}

[dir="ltr"] .ally-report-api-token-dialog .ally-report-api-token p {
    border-right: none;
    border-radius: 3px 0 0 3px;
    clip-path: inset(-4px 0px -4px -4px);
}

[dir="rtl"] .ally-report-api-token-dialog .ally-report-api-token p {
    border-left: none;
    border-radius: 0 3px 3px 0;
    clip-path: inset(-4px -4px -4px 0px);
}

.ally-report-api-token-dialog .ally-report-api-token-setup-text {
    margin-top: 8px;
}

.ally-report-api-token-dialog .ally-report-api-token-setup-text a {
    text-decoration: underline;
}

.ally-report-api-token-dialog .ally-report-api-token-setup-text a:hover {
    color: #23527C;
}

.ally-report-api-token-dialog .ally-report-api-token .ally-copy-token-button {
    min-width: unset;
    z-index: 1;
    border: #333333 1px solid;
    white-space: nowrap;
    border-radius: 0 3px 3px 0;
}

[dir="rtl"] .ally-report-api-token-dialog .ally-report-api-token .ally-copy-token-button {
    border-radius: 3px 0 0 3px;
}

[dir="ltr"] .ally-report-api-token-dialog .ally-report-api-token .ally-copy-token-button:disabled {
    border-left: none;
}

[dir="rtl"] .ally-report-api-token-dialog .ally-report-api-token .ally-copy-token-button:disabled {
    border-right: none;
}

.ally-report-api-token-dialog .ally-if-token-generation-error-message {
    background-color: #F9DFE2;
    border-radius: 0 0 3px 3px;
    color: #222;
    display: block;
    padding: 10px 20px;
    width: 100%;
}

.ally-report-api-token-dialog .ally-report-api-token .spinning {
    height: 18px;
    animation-name: spin;
    animation-duration: 1000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.ally-report-api-token-dialog .ally-report-api-token .ally-if-has-error {
    border-color: #D0011B;
    box-shadow: 0 0 4px 0 #A66F75;
}

dialog {
    position: fixed;
    z-index: 3;
    margin: 3px 15px 0 auto;
    padding: 0;
    border: 1px solid #cdcdcd;
    border-radius: 2px;
    box-shadow: 0 1px 0 rgba(0,0,0,.06);
    font-size: 16px;
}

.ally-report-menu-dialog-selection button {
    position: relative;
    background: #FFFFFF;
    border: none;
    width: 100%;
    padding: 8px 12px;
    margin: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
}

.ally-report-menu-dialog-selection button:hover {
    background-color: #222222;
    color: #FFFFFF;
}

.ally-report-menu-dialog-selection button:focus {
    z-index: 1;
    padding: 7px 11px;
    border: 1px solid #00AAEF;
    outline: none;
    box-shadow: 0 0 0 2px rgba(0, 170, 239, 0.5);
}

.ally-report-menu-dialog-icon {
    background-repeat: no-repeat;
    height: 24px;
    min-width: 24px;
    width: 24px;
}

.ally-report-menu-dialog-selection button .ally-download-csv-icon {
    background-image: url(/static/icon-download-black.f18b78f49e61f4eebe3f.svg);
}

.ally-report-menu-dialog-selection button .ally-connect-icon {
    background-image: url(/static/link-black.b02b2c810b46d9c93be8.svg);
}

.ally-report-menu-dialog-selection button:hover .ally-download-csv-icon {
    background-image: url(/static/icon-download-white.573e113c8f5bd0cfc37f.svg);
}

.ally-report-menu-dialog-selection button:hover .ally-connect-icon {
    background-image: url(/static/link-white.54e3239a7a37c43b666a.svg);
}

.ally-report-download-csv-dialog {
    background-color: #FFFFFF;
    border: 1px solid #CDCDCD;
    border-radius: 4px;
    box-shadow: 0 4px 4px 0 #DADADA;
    padding: 40px 32px;
    width: 476px;
    height: 401px;
    font-weight: 400;
    z-index: 1000;
}

.ally-report-download-csv-dialog .ally-report-download-csv-dialog-heading {
    display: flex;
}

.ally-report-download-csv-dialog h1 {
    font-size: 24px;
    color: #000000;
    margin: 0 0 24px;
}

.ally-report-download-csv-dialog .close-dialog-button {
    justify-self: right;
    background: none;
    border: none;
    margin: 0 0 0 auto;
    padding: 0;
    height: 21px;
}

.ally-report-download-csv-dialog .close-dialog-button img {
    width: 21px;
    height: 21px;
}

.flex-container {
    display: flex;
}

.flex-container-download {
    display: flex;
    justify-content: flex-end;
    padding: 7px 0 0;
}

.csv-date-from,
.csv-date-to {
    min-width: 150px;
}

div.csv-date-from,
div.csv-date-to {
    margin: 0px 67px 0 0;
}


.ally-csv-container {
    font-size: 18px;
}

.range {
    font-size: 14px;
    font-weight: 500;
    color: #666;
}

button.ally-download {
    align-items: center;
    background-color: #000;
    border-radius: 4px;
    border: 1px solid #000;
    color: #FFF;
    display: flex;
    flex-direction: row;
    height: 35px;
    justify-content: center;
    line-height: 24px;
    min-width: 150px;
    padding: 0 15px;
}

.ally-download p {
    margin: 3px;
}

.ally-report-download-csv-dialog-radio-options {
    margin: 0 0 24px;
}

.csv-radio-options {
    flex-direction: column;
    width: 141px;
}

.csv-radio-options label:nth-of-type(1) {
    margin-bottom: 16px;
    font-weight: 400;
}

.csv-radio-options label:nth-of-type(2) {
    margin-bottom: 24px;
    font-weight: 400;
}

label {
    font-size: 14px;
}

.ally-report-download-csv-dialog .mat-form-field {
    width: 193px;
}

.ally-report-download-csv-dialog .mat-input-element {
    height: 17px;
}

.ally-report-download-csv-dialog .mat-form-field-appearance-outline .mat-form-field-flex {
    margin-right: 24px
}

.ally-report-download-csv-dialog .mat-form-field-wrapper {
    padding-bottom: 0px;
}

input[type=radio] {
    line-height: normal;
    margin: 4px 5px 0px;
}

.ally-report-download-csv-dialog-icon {
    background-repeat: no-repeat;
    height: 24px;
    min-width: 24px;
    width: 24px;
}

.ally-report-download-csv-dialog button .ally-download-csv-icon {
    background-image: url(/static/icon-download-white.573e113c8f5bd0cfc37f.svg);
}

.ally-report-download-csv-dialog button:hover .ally-download-csv-icon,
.ally-report-download-csv-dialog button:focus .ally-download-csv-icon {
    background-image: url(/static/icon-download-black.f18b78f49e61f4eebe3f.svg);
}

p#ally-report-download-csv-dialog-all-data {
    margin-bottom: 29px;
}

p#csvDateFrom, p#csvDateTo {
    margin: 4px;
}

.csv-radio-options label input[type="radio"]:focus-visible {
    outline: 2px solid #0260d1;
    outline-offset: 2px;
    border-radius: 50%;
}


.mat-form-field.mat-form-field-type-mat-input.mat-form-field-appearance-outline .mat-form-field-outline,
.mat-form-field.mat-form-field-type-mat-input.mat-form-field-appearance-outline.mat-focused .mat-form-field-outline-thick,
.mat-datepicker-content .mat-calendar-previous-button,
.mat-icon-button,
button.mat-focus-indicator.mat-icon-button svg {
    color: black;
}

.mat-form-field.mat-form-field-type-mat-input.mat-form-field-appearance-outline .mat-form-field-outline {
    border-width: thin;
    top: 0;
}

.mat-form-field.mat-form-field-type-mat-input.mat-form-field-appearance-outline.mat-focused .mat-form-field-outline-thick {
    border: 1px solid #222;
    border-radius: 7px;
    outline: none;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.35);
}

.mat-icon-button.cdk-focused.cdk-keyboard-focused,
.mat-button.cdk-focused.cdk-keyboard-focused,
.mat-calendar-body-cell-content.mat-calendar-body-selected,
.mat-calendar-body-cell-contentcdk-keyboard-focused {
    background-color: black;
}

.mat-icon-button.cdk-focused.cdk-keyboard-focused,
.mat-button.cdk-focused.cdk-keyboard-focused,
.mat-calendar-body-cell-content.mat-calendar-body-selected,
button.mat-focus-indicator.mat-icon-button.cdk-focused.cdk-keyboard-focused svg {
    color: white;
}

.mat-calendar-period-button.mat-button.cdk-focused.cdk-keyboard-focused .mat-calendar-arrow {
    border-top-color: white;
}

.mat-button .mat-button-wrapper .mat-calendar-arrow {
    border-top-color: black;
}

.mat-calendar-body-cell.mat-focus-indicator .mat-calendar-body-cell-content,
.mat-datepicker-content .mat-calendar-previous-button,
.mat-datepicker-content .mat-calendar-next-button,
button.mat-focus-indicator.mat-icon-button.mat-button-base,
.mat-icon-button.cdk-focused.cdk-keyboard-focused,
.mat-button.cdk-focused.cdk-keyboard-focused,
button.mat-calendar-period-button,
.mat-icon-button {
    border-radius: 0;
}

.mat-datepicker-content .mat-calendar-next-button,
.mat-datepicker-content .mat-calendar-previous-button,
.mat-calendar-body-disabled .mat-calendar-body-today.mat-calendar-body-cell-content,
button.mat-calendar-period-button {
    border-style: solid;
    border-width: thin;
    border-color: transparent;
}

.mat-datepicker-content .mat-calendar-next-button:hover,
.mat-datepicker-content .mat-calendar-previous-button:hover,
button.mat-calendar-period-button:hover {
    border-color: black;
}

.mat-calendar-body-today:not(.mat-calendar-body-selected) {
    border-color: white;
}

.cdk-keyboard-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected),
.cdk-program-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected),
.mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected),
.mat-datepicker-content .mat-calendar-next-button:hover div.mat-button-focus-overlay,
.mat-datepicker-content .mat-calendar-previous-button:hover div.mat-button-focus-overlay,
.mat-calendar-period-button:hover div.mat-button-focus-overlay {
    background-color: white;
    border-color: black;
}

.mat-form-field-appearance-outline .mat-form-field-wrapper .mat-form-field-flex {
    padding: 0 0 0 16px;
}

.mat-form-field-appearance-outline .mat-form-field-infix {
    margin: 3px 0;
    padding: 0;
    bottom: 10px;
}

.mat-form-field .mat-form-field-suffix .mat-datepicker-toggle button.mat-icon-button {
    bottom: 5px;
    width: 59px;
}

.mat-form-field-appearance-outline.mat-form-field-can-float .mat-form-field-outline-thick .mat-form-field-outline-start,
.mat-form-field-appearance-outline.mat-form-field-can-float .mat-form-field-outline-thick .mat-form-field-outline-end,
.mat-form-field-appearance-outline.mat-form-field-can-float .mat-form-field-outline-thick .mat-form-field-outline-gap,
.mat-datepicker-content .mat-calendar-next-button:hover,
.mat-datepicker-content .mat-calendar-previous-button:hover,
.mat-calendar-period-button:hover {
    border-width: 1px;
}

.mat-focus-indicator.mat-icon-button.mat-button-base.cdk-focused.cdk-program-focused div.mat-button-focus-overlay {
    background: transparent;
}

.mat-button,
.mat-fab,
.mat-flat-button,
.mat-icon-button,
.mat-mini-fab,
.mat-raised-button,
.mat-stroked-button,
.mat-calendar {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Can be hidden only if it occupies entire row.
   Otherwise the days will be rendered incorrectly.
   https://dev.azure.com/AnthologyInc-01/Ally/_workitems/edit/2476754
 */
.mat-calendar-body-label[colspan="7"] {
    display: none;
}

.mat-calendar-body-label {
    visibility: hidden;
}

.mat-calendar-body-cell.mat-focus-indicator.mat-calendar-body-disabled .mat-calendar-body-today:not(.mat-calendar-body-selected),
.mat-calendar-body-cell.mat-calendar-body-disabled .mat-calendar-body-cell-content,
.mat-calendar-table-header th,
.mat-datepicker-content .mat-calendar-next-button[disabled],
.mat-datepicker-content .mat-calendar-previous-button[disabled] {
    color: #666;
}

input.mat-input-element {
    font-size: 14px;
}

.ally-notification {
    display: flex;
    background-color: #EBEBEB;
    color: #000;
    padding: 18px 26px 16px;
    margin-bottom: 17px;
}

.ally-notification-body {
    display: block;
    font-size: 14px;
    color: #333;
    line-height: 20px;
}

.ally-notification-small img,
.ally-notification .ally-notification-icon-container img {
    width: 32px;
    height: 32px;
    line-height: 32px;
}

.ally-notification .spinning {
    animation-name: spin;
    animation-duration: 1000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.dialog-button,
.dialog-button:active,
.dialog-button:disabled,
.dialog-button:focus,
.dialog-button:hover,
.dialog-button:visited {
    display: inline-flex;
    align-items: center;
    background-color: #222;
    color: #FFF;
    font-size: 14px;
    border-radius: 4px;
    line-height: 24px;
    min-height: 38px;
    padding-left: 20px;
    padding-right: 20px;
    text-align: center;
    border: 1px solid #222;
}

.dialog-button:active,
.dialog-button:hover {
    background-color: #FFF;
    color: #222;
}

.dialog-button:focus {
    border: 1px solid #00AAEF;
    outline: none;
    box-shadow: 0 0 0 2px rgba(0, 170, 239, 0.5);
}

.dialog-button.black,
.dialog-button.black:visited {
    margin-left: 8px;
    color: #FFF;
    background-color: #222;
}

[dir="rtl"] .dialog-button.black,
[dir="rtl"] .dialog-button.black:visited {
    margin-right: 8px;
}

.dialog-button.black:active,
.dialog-button.black:hover {
    background-color: #FFF;
    color: #222;
}

.dialog-button.black:focus {
    border: 1px solid #00AAEF;
    outline: none;
    box-shadow: 0 0 0 2px rgba(0, 170, 239, 0.5);
}

.dialog-button:disabled {
    background-color: #4E4E4E;
    border-color: #222;
    color: #CDD2D5;
    cursor: not-allowed;
}

.dialog-button > i + span {
    margin-left: 5px;
}

.ally-notification .ally-notification-icon-container {
    min-width: 32px;
    margin-right: 22px;
    margin-left: 0;
}

[dir="rtl"] .ally-notification .ally-notification-icon-container {
    margin-left: 22px;
    margin-right: 0;
}

.ally-notification .ally-notification-head {
    display: flex;
    align-items: center;
    margin-top: 6px;
    margin-bottom: 16px;
    line-height: 32px;
}

.ally-notification .ally-notification-body {
    margin-bottom: 16px;
    line-height: 20px;
    margin-left: 0;
    display: block;
}

.ally-notification .ally-notification-head h2 {
    font-size: 18px;
    font-weight: bold;
    margin: 0;
}

.ally-notification-content {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.ally-additional-help {
    display: flex;
    background: none;
    padding: 0;
    border: none;

    width: fit-content;
    width: -moz-fit-content;
    text-decoration: none;
    color: #333;
    margin: 16px 0 0 0;
}

@media (min-width: 768px) {
    .ally-notification-content {
        flex-direction: row;
        justify-content: space-between;
    }

    .ally-additional-help {
        margin: 12px 0;
        align-self: end;
    }
}

.ally-additional-help > span {
    font-weight: 600;
    margin-left: 4px;
    margin-right: 4px;
    vertical-align: middle;
    text-decoration: underline;
}

.ally-additional-help > img {
    margin: 0 4px;
    vertical-align: middle;
}

.ally-additional-help:focus {
    border: 1px solid #00AAEF;
    outline: none;
    box-shadow: 0 0 0 2px rgba(0, 170, 239, 0.5);
}

[dir="rtl"] .ally-additional-help {
    flex-direction: row-reverse;
}
[dir="rtl"] .ally-additional-help > img {
    transform: scaleX(-1);
}

.ally-notification-small {
    display: flex;
}

.ally-notification-small .ally-notification-body {
    line-height: 32px;
    margin-left: 22px;
    margin-top: auto;
    margin-bottom: auto;
    display: flex;
    width: 100%;
}

[dir="rtl"] .ally-notification-small .ally-notification-body {
    margin-left: 0;
    margin-right: 22px;
}

.ally-notification-small .ally-notification-body p {
    margin: 0;
}

.ally-notification-small .ally-notification-body button {
    right: 0;
    justify-content: flex-end;
    justify-self: right;
    background: none;
    border: none;
    margin: 0 0 0 auto;
    padding: 0;
}

[dir="rtl"] .ally-notification-small .ally-notification-body button {
    left: 0;
    justify-content: flex-start;
    margin: 0 auto 0 0;
    justify-self: left;
}

.ally-notification-small .ally-notification-body button img {
    width: 20px;
    height: 20px;
}


.ally-error-message {
    align-items: center;
    border-radius: 4px;
    background-color: #FADFE2;
    color: #000;
    display: flex;
    justify-content: center;
    flex-direction: row;
    padding: 10px 12px;
    margin-bottom: 10px;
}

.ally-error-message img {
    padding-left: 4px;
    padding-right: 8px;
}

.ally-error-message button {
    background-color: inherit;
    border: none;
    width: 14px;
    padding-right: 20px;
}

.ally-error-message button img {
    padding: 0;
    display: block;
}

table.ir-list {
    border-spacing: 0;
    border-collapse: collapse;
    width: 100%;
}

table.ir-list thead {
    color: #555;
    font-size: 14px;
    font-weight: normal;
    text-decoration: none;
}

table.ir-list thead .ir-list-fixed,
table.ir-list thead .ir-list-fixed {
    min-width: 125px;
}

table.ir-list thead .ir-list-flex,
table.ir-list thead .ir-list-flex {
    width: 90%;
}

table.ir-list button {
    background: none;
    border: none;
    color: inherit;
    cursor: pointer;
    display: flex;
    font: inherit;
    font-weight: normal;
    outline: inherit;
    padding: 0;
    width: 100%;
}

table.ir-list thead > * {
    padding-bottom: 15px;
    padding-top: 5px;
}

table.ir-list thead button > svg-icon {
    display: inline-block;
    visibility: hidden;
    width: 15px;
}

table.ir-list thead button svg > path {
    fill: #555;
}

table.ir-list thead button:focus > span,
table.ir-list thead button:hover > span {
    text-decoration: underline;
}

table.ir-list thead button.selected > svg-icon {
    visibility: visible;
}

table.ir-list thead button.selected > span {
    color: #222;
}

table.ir-list thead button.selected svg > path {
    fill: #222;
}

table.ir-list tbody td,
table.ir-list tbody th {
    font-weight: normal;
    padding: 20px;
    text-align: left;
}

[dir="rtl"] table.ir-list tbody td,
[dir="rtl"] table.ir-list tbody th {
    text-align: right;
}

table.ir-list tbody td[tabindex="0"],
table.ir-list tbody th[tabindex="0"] {
    cursor: pointer;
}

table.ir-list tbody tr th:first-of-type {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

table.ir-list tbody tr td:last-of-type {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

/* Set a background color on the row as the tr elements their display gets set to flex on mobile views */
table.ir-list tbody tr:nth-of-type(odd),
table.ir-list tbody tr:nth-of-type(odd) td ,
table.ir-list tbody tr:nth-of-type(odd) th {
    background-color: #F7F7F7;
}

table.ir-list tbody tr:hover,
table.ir-list tbody tr:hover td,
table.ir-list tbody tr:hover th,
table.ir-list tbody tr.ir-list-item.ir-list-item-focus,
table.ir-list tbody tr.ir-list-item.ir-list-item-focus td,
table.ir-list tbody tr.ir-list-item.ir-list-item-focus th  {
    background-color: #ECEDED;
}

table.ir-list .ir-list-item.ir-list-item-clickable {
    cursor: pointer;
}

/** List of items component */

table.ir-list tbody tr.ir-list-header,
table.ir-list tbody tr.ir-list-item {
    font-size: 14px;
    width: 100%;
}

@media only screen and (max-width: 200px) {
    .ir-list-header,
    .ir-list-item {
        align-items: flex-start;
        flex-direction: column;
    }
}

.ir-list-header {
    color: #555;
    font-size: 14px;
    font-weight: normal;
    text-decoration: none;
}

.ir-list-header > *,
.ir-list-item > a > * {
    flex: 0 0 auto;
    text-align: left;
}

[dir="rtl"] .ir-list-header > *,
[dir="rtl"] .ir-list-item > a > * {
    text-align: unset;
}

.ir-list-header > * {
    padding-bottom: 15px;
    padding-top: 5px;
}

.ir-list-header > span[role="columnheader"] > button {
    background: none;
    border: none;
    color: inherit;
    cursor: pointer;
    display: flex;
    font: inherit;
    outline: inherit;
    padding: 0;
    width: 100%;
}

.ir-list-header > span[role="columnheader"] > button > svg-icon {
    display: inline-block;
    visibility: hidden;
    width: 15px;
}

.ir-list-header > span[role="columnheader"] > button svg > path {
    fill: #555;
}

.ir-list-header > span[role="columnheader"] > button:focus > span,
.ir-list-header > span[role="columnheader"] > button:hover > span {
    text-decoration: underline;
}

.ir-list-header > span[role="columnheader"] > button.selected > svg-icon {
    visibility: visible;
}

.ir-list-header > span[role="columnheader"] > button.selected > span {
    color: #222;
}

.ir-list-header > span[role="columnheader"] > button.selected svg > path {
    fill: #222;
}

.ir-list-header > *:first-child {
    margin-left: 0;
}

.ir-list-item > a {
    display: flex;
    padding: 20px 0;
    width: 100%;
}

.ir-list-item > a > * {
    margin-left: 16px;
}

[dir="rtl"] .ir-list-item > a > * {
    margin-left: unset;
    margin-right: 16px;
}

.ir-list-item > a > *:last-child,
.ir-list-header > *:last-child {
    margin-left: 0px;
    margin-right: 16px;
}

[dir="rtl"] .ir-list-item > a > *:last-child,
[dir="rtl"] .ir-list-header > *:last-child {
    margin-left: 16px;
    margin-right: 0px;
}


/** Pagination component */

pagination-template {
    display: block;
    position: relative;
    text-align: center;
    width: 100%;
}

pagination-template .ngx-pagination {
    display: inline-block;
    margin-top: 40px;
    padding: 0;
}

pagination-template .ngx-pagination .pagination-next a::after,
pagination-template .ngx-pagination .pagination-next.disabled::after,
pagination-template .ngx-pagination .pagination-previous a::before,
pagination-template .ngx-pagination .pagination-previous.disabled::before {
    display: none;
}

pagination-template .ngx-pagination li {
    margin: 2px;
    text-align: center;
}

pagination-template .ngx-pagination li:first-child {
    margin-left: 0;
}

[dir="rtl"] pagination-template .ngx-pagination li:first-child {
    margin-left: unset;
    margin-right: 0;
}

pagination-template .ngx-pagination li:last-child {
    margin-right: 0;
}

[dir="rtl"] pagination-template .ngx-pagination li:last-child {
    margin-left: 0;
    margin-right: unset;
}

pagination-template .ngx-pagination li.current,
pagination-template .ngx-pagination li.disabled,
pagination-template .ngx-pagination li a,
pagination-template .ngx-pagination li a:hover {
    border: solid 2px #222;
    box-sizing: content-box;
    color: #555;
    font-size: 12px;
    line-height: 35px;
    min-width: 20px;
    padding: 0 5px;
}

pagination-template .ngx-pagination li a {
    background-color: #222;
    color: #FFF;
}

pagination-template .ngx-pagination li a:focus,
pagination-template .ngx-pagination li a:hover {
    background-color: #FFF;
    color: #222;
    text-decoration: none;
}

pagination-template .ngx-pagination li.current {
    background-color: #FFF;
    border-color: #F3F3F3;
    color: #555;
}

pagination-template .ngx-pagination li.ellipsis {
    overflow: inherit;
}

pagination-template .ngx-pagination li.ellipsis a,
pagination-template .ngx-pagination li.ellipsis a:hover {
    background: none;
    border-color: transparent;
    color: inherit;
}

pagination-template .ngx-pagination li.ellipsis a:focus,
pagination-template .ngx-pagination li.ellipsis a:hover {
    border-color: #222;
}

pagination-template .ngx-pagination li.pagination-next.disabled,
pagination-template .ngx-pagination li.pagination-previous.disabled,
pagination-template .ngx-pagination li.pagination-next a,
pagination-template .ngx-pagination li.pagination-next a:hover,
pagination-template .ngx-pagination li.pagination-previous a,
pagination-template .ngx-pagination li.pagination-previous a:hover {
    padding: 0 35px;
    width: auto;
}

pagination-template .ngx-pagination li.pagination-next.disabled,
pagination-template .ngx-pagination li.pagination-previous.disabled {
    background-color: #F3F3F3;
    border-color: #F3F3F3;
}

pagination-template .ngx-pagination li.pagination-next.disabled,
pagination-template .ngx-pagination li.pagination-next a {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

pagination-template .ngx-pagination li.pagination-previous.disabled,
pagination-template .ngx-pagination li.pagination-previous a {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

@media (max-width: 575px) {
    pagination-template .ngx-pagination li.pagination-next.disabled,
    pagination-template .ngx-pagination li.pagination-previous.disabled,
    pagination-template .ngx-pagination li.pagination-next a,
    pagination-template .ngx-pagination li.pagination-next a:hover,
    pagination-template .ngx-pagination li.pagination-previous a,
    pagination-template .ngx-pagination li.pagination-previous a:hover {
        padding: 0 5px;
    }
}

table.ir-departments-list tbody td.ir-list-fixed {
    min-width: 100px;
}

#ir-departments-list-header-name {
    padding-right: 10px;
}

table.ir-departments-list tbody th.ir-departments-list-department-name {
    font-size: 14px;
    font-weight: bold;
    min-width: 350px;
    padding: 20px;
}

table.ir-departments-list tbody td.ir-departments-list-department-report-partition,
table.ir-departments-list tbody td.ir-departments-list-department-report-items,
table.ir-departments-list tbody td.ir-departments-list-department-report-score {
    min-width: 100px;
}

table.ir-departments-list tbody td.ir-departments-list-controls {
    text-align: right;
}

.ir-departments-list-department-report {
    max-width: 400px;
    min-width: 315px;
}

.ir-departments-list-department-report > div {
    font-size: 14px;
    line-height: 24px;
    min-width: 100px;
    width: 33%;
}

table.ir-departments-list i,
table.ir-departments-list img {
    margin-right: 10px;
    outline-offset: 2px;
}

table.ir-departments-list img {
    width: 18px;
}

.ir-departments-list-department-report-score {
    padding-left: 30px;
}

.ir-departments-list-department-report-score .feedback-score-indicator {
    display: flex;
}

.ir-departments-list-department-report-score .feedback-score-indicator img {
    margin-left: 0px;
}

@media only screen and (max-width: 1024px) {
    table.ir-departments-list tbody tr.ir-list-item {
        display: block;
        padding: 20px;
        width: 110%;
    }

    table.ir-departments-list tbody td {
        display: inline-block;
        padding: 0;
    }

    table.ir-departments-list tbody th.ir-departments-list-department-name {
        display: block;
        padding: 0 0 10px 0;
        width: 100%;
    }

    table.ir-departments-list tbody td.ir-departments-list-department-report-partition,
    table.ir-departments-list tbody td.ir-departments-list-department-report-items,
    table.ir-departments-list tbody td.ir-departments-list-department-report-score {
        width: 13%;
    }

    table.ir-departments-list tbody td.ir-departments-list-controls {
        text-align: right;
        width: 36%;
    }

    table.ir-departments-list tbody td.ir-departments-list-report-view {
        width: 20%;
    }
}

@media only screen and (max-width: 768px) {

    table.ir-departments-list tbody td.ir-departments-list-department-report-partition,
    table.ir-departments-list tbody td.ir-departments-list-department-report-items,
    table.ir-departments-list tbody td.ir-departments-list-department-report-score {
        padding-bottom: 10px;
        width: 33%;
    }

    table.ir-departments-list tbody td.ir-departments-list-controls {
        padding-right: 15px;
        width: 70%;
    }

    table.ir-departments-list tbody td.ir-departments-list-report-view {
        width: 20%;
    }

    table.ir-departments-list .btn {
        margin-left: 2px;
        margin-right: 2px;
        padding-left: 8px;
        padding-right: 8px;
    }

    .ir-departments-list-department-report > div {
        min-width: unset;
    }
}

.tooltip {
    position: absolute;
    background: #4a4a4a;
    color: #fff;
    padding: 4px 8px;       /* Some padding for readability */
    font-size: 12px;
    white-space: normal;     /* Allow text to wrap */
    max-width: 250px;        /* Adjust max width as needed */
    line-height: 1.4;        /* Optional: spacing between lines */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s;
    margin-top: 10px;
    border-radius: 4px;      /* Optional: rounded corners */
    z-index: 1000;           /* Ensure tooltip appears above other elements */
}
  
.tooltip-trigger:focus + .tooltip {
    opacity: 1;
    visibility: visible;
}
.tooltip-trigger:hover + .tooltip {
    visibility: hidden;
}
table.ir-list .ir-departments-list-report-view button,
table.ir-list .ir-departments-list-controls button {
    padding: 6px 15px;
    width: auto;
    display: inline-block;
    border: 1px solid #474747;
    line-height: 24px;
}


.feedback-score-meter {
    letter-spacing: 0.03em;
    overflow: hidden;
    position: relative;
}

/* Chart fill color. The SVG path segment with fill="none" represents the non-background segment */
.feedback-score-meter-level-low .feedback-score-meter-chart g.highcharts-series > path[fill="none"] {
    fill: #D0021B;
}

.feedback-score-meter-level-medium .feedback-score-meter-chart g.highcharts-series > path[fill="none"] {
    fill: #FB730A;
}

.feedback-score-meter-level-high .feedback-score-meter-chart g.highcharts-series > path[fill="none"] {
    fill: #AFCB27;
}

.feedback-score-meter-level-perfect .feedback-score-meter-chart g.highcharts-series > path[fill="none"] {
    fill: #60B700;
}

.feedback-score-meter-percent {
    bottom: 0;
    display: block;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 300;
    left: 0;
    line-height: .9;
    position: absolute;
    right: 0;
    text-align: center;
}


feedback-html-issue-navigator,
.feedback-html-issue-navigator-container,
.feedback-html-issue-navigator-preview-container .feedback-html-preview,
.feedback-html-issue-navigator-loading {
    height: 100%;
}

.feedback-html-issue-navigator-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.feedback-html-issue-navigator-preview-container {
    flex: 1;
    margin: auto;
    width: 100%;
}

.feedback-html-issue-navigator-loading {
    align-items: center;
    display: flex;
    justify-content: center;
}

.feedback-html-issue-navigator-timedout > img {
    margin-right: 25px;
    width: 80px;
}

/* ── Highlight container ── */
.ally-pdf-preview-page-highlights {
    bottom: 0;
    height: auto;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: auto;
    z-index: 20000;
}

/* ── Issue highlights (default red border) ── */
.ally-pdf-preview-page-highlights > div {
    background: transparent;
    border: 6px solid;
    border-image: repeating-linear-gradient(-45deg, #AF0216, #AF0216 3px, #FF919E 2px, #FF919E 5px) 5;
    border-radius: 2px;
    position: absolute;
}

/* ── Highlight number badge ── */
.ally-pdf-preview-page-highlights > div .ally-pdf-preview-page-highlights-number {
    background-color: #AF0216;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #FFF;
    display: none;
    font-size: 14px;
    left: -6px;
    min-width: 75px;
    padding: 10px;
    position: absolute;
    top: -46px;
}

[dir="rtl"] .ally-pdf-preview-page-highlights > div .ally-pdf-preview-page-highlights-number {
    left: unset;
    right: -6px;
}

.ally-pdf-preview-page-highlights > div .ally-pdf-preview-page-highlights-number.small {
    border-bottom-right-radius: 5px;
}

.ally-pdf-preview-page-highlights > div .ally-pdf-preview-page-highlights-number.active {
    display: block;
    font-weight: 500;
    z-index: 5;
}

/* ── Tag icon ── */
.tag-icon {
    width: 30px;
    height: 24px;
    vertical-align: middle;
    padding: 3px;
    float: left;
    margin-left: -34px;
    margin-top: -2px;
    border-radius: 2px;
}

.active-tag-icon {
    margin-top: -6px;
    margin-left: -39px;
}

/* ── Tag type color classes (sidebar panel colors) ── */
.ally-pdf-preview-page-highlights .h1,
.ally-pdf-preview-page-highlights .h2,
.ally-pdf-preview-page-highlights .h3 {
    /* background-color: #FFDFC2; */
    border: 2px solid #FB730A;
}

.ally-pdf-preview-page-highlights .paragraph {
    /* background-color: #CCF8FA; */
    border: 2px solid #0097A6;
}

.ally-pdf-preview-page-highlights .image {
    /* background-color: #FFF2CC; */
    border: 2px solid #997200;
}

.ally-pdf-preview-page-highlights .link {
    /* background-color: #FDE0EC; */
    border: 2px solid #BF417C;
}

.ally-pdf-preview-page-highlights .table {
    /* background-color: #EFE5F5; */
    border: 2px solid #5C3177;
}

.ally-pdf-preview-page-highlights .list {
    /* background-color: #C0DBFB; */
    border: 2px solid #1E5AC2;
}

.ally-pdf-preview-page-highlights .video {
    /* background-color: #DFF5C4; */
    border: 2px solid #6FA13D;
}

/* ── Tag highlight base (autotag) ── */
.ally-pdf-preview-page-highlights > div.tag-highlight {
    position: absolute;
    border-radius: 1px;
}

.tag-highlight .ally-pdf-preview-page-highlights-number {
    color: #fff;
}

/* ── Tag highlight borders by type ── */
.ally-pdf-preview-page-highlights > div.tag-highlight.h1,
.ally-pdf-preview-page-highlights > div.tag-highlight.h2,
.ally-pdf-preview-page-highlights > div.tag-highlight.h3 {
    border: 1px solid #FB730A;
    margin-top: 0px;
    z-index: 20000;
}

.ally-pdf-preview-page-highlights > div.tag-highlight.paragraph {
    border: 1px solid #0097A6;
}

.ally-pdf-preview-page-highlights > div.tag-highlight.image {
    border: 1px solid #997200;
}

.ally-pdf-preview-page-highlights > div.tag-highlight.link {
    border: 1px solid #BF417C;
}

.ally-pdf-preview-page-highlights > div.tag-highlight.table {
    border: 1px solid #5C3177;
}

.ally-pdf-preview-page-highlights > div.tag-highlight.list {
    border: 1px solid #1E5AC2;
}

.ally-pdf-preview-page-highlights > div.tag-highlight.video {
    border: 1px solid #6FA13D;
}

/* ── Hover highlight ── */
.ally-pdf-preview-page-highlights > div.tag-highlight.hover-highlight {
    border-width: 2px;
    border-style: solid;
}

/* ── Active highlight (animated border) ── */
.ally-pdf-preview-page-highlights > div.tag-highlight.active-highlight {
    border: 6px solid;
    border-image: repeating-linear-gradient(
        -45deg,
        var(--highlight-color),
        var(--highlight-color) 3px,
        color-mix(in srgb, var(--highlight-color) 40%, white) 3px,
        color-mix(in srgb, var(--highlight-color) 40%, white) 6px
    ) 5;
}

/* ── Dark background support ── */
.ally-pdf-preview-page-highlights > div.tag-highlight.dark-bg {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.85);
}

.tag-icon-wrapper {
    width: 30px;
    height: 24px;
    vertical-align: middle;
    padding: 3px;
    float: left;
    margin-left: -34px;
    margin-top: -2px;
    border-radius: 2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.tag-icon-wrapper.active-tag-icon {
    margin-top: -6px;
    margin-left: -39px;
}

.tag-icon-img {
    width: 100%;
    height: 100%;
    display: block;
}

.ally-pdf-preview-page-highlights > div.tag-highlight.dark-bg .tag-icon-img.dark-bg-icon {
    filter: brightness(0) invert(1);
}

@keyframes outline-fade-out {
    0% {
        outline: 2px solid #3daeff;
    }
    70% {
        outline: 2px solid #3daeff;
    }
    100% {
        outline: 2px solid rgba(61, 174, 255, 0);
    }
}

.ally-pdf-preview-page-highlights > div.tag-highlight.active-highlight.dark-bg {
    border: 2px solid var(--highlight-color);
    border-image: none;
    outline: 2px solid #3daeff;
    animation: outline-fade-out 3s ease-out forwards;
}

.ally-pdf-preview-page-highlights > div.tag-highlight.hover-highlight.dark-bg {
    border: 2px solid var(--highlight-color);
}
@keyframes spin {
    100% {
        transform: rotate(360deg);
    }
}

.ally-pdf-preview {
    align-self: stretch;
    flex-flow: row wrap;
    font-weight: 400;
    margin: 0;
    width: 100%;
    scrollbar-color: #888 transparent;
    scrollbar-width: thin;
    height: 100%;
    overflow: hidden;
}

.ally-pdf-preview .ally-spinner img {
    animation: spin 1s linear infinite;
    height: 80px;
    opacity: 1;
    outline: none;
    transition: opacity 0.2s linear;
    width: 80px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar {
    align-items: center;
    background-color: #222;
    display: flex;
    font-size: 14px;
    height: 68px;
    padding: 0 16px;
    justify-content: space-around;
}

.ally-pdf-preview .ally-pdf-preview-toolbar a,
.ally-pdf-preview .ally-pdf-preview-toolbar button {
    background-color: #222;
    color: #FFF;
    display: inline-block;
    height: 38px;
    padding: 0;
    text-decoration: none;
    width: 40px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar a:focus,
.ally-pdf-preview .ally-pdf-preview-toolbar a:hover,
.ally-pdf-preview .ally-pdf-preview-toolbar button:focus:enabled,
.ally-pdf-preview .ally-pdf-preview-toolbar button:hover:enabled {
    background-color: #FFF;
    border-radius: 3px;
    color: #222;
}

.ally-pdf-preview .ally-pdf-preview-toolbar button[disabled] {
    color: #8D8D8D;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-page-navigator {
    display: flex;
    align-items: center;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-page-navigator-total {
    padding: 0 7px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-page-navigator .ally-page-button {
    display: inline-block;
    min-width: 50px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-page-navigator .ally-if-page-only-one {
    margin: 0 5px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-page-navigator input {
    background: black;
    border: none;
    border-radius: 10%;
    height: 30px;
    margin: 0 12px;
    text-align: center;
    width: 40px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-page-navigator button {
    padding: 3px 0;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-page-navigator i {
    clear: both;
    font-size: 30px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights {
    align-items: center;
    display: flex;
    flex: 1;
    justify-content: center;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-loading img {
    display: inline;
    height: 30px;
    margin: 0 10px;
    width: 30px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-done {
    align-items: center;
    display: flex;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-done .ally-highlights-info {
    align-items: center;
    display: flex;
    flex-direction: row;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-count {
    background-color: #AF0216;
    border-radius: 3px;
    display: inline-block;
    font-weight: 500;
    margin: 0 5px;
    max-height: 32px;
    padding: 5px 10px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-description {
    display: inline-block;
    width: 150px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-navigator {
    display: flex;
    flex-direction: column;
    margin: 0 20px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-navigator button {
    background-color: #000;
    height: 33px;
    width: 36px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-navigator button[disabled] {
    background-color: #1B1B1B;
    color: #8D8D8D;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-navigator button i {
    font-size: 29px;
    line-height: 0.5;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-navigator button:focus:enabled.ally-highlights-previous,
.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-navigator button:hover:enabled.ally-highlights-previous {
    background-color: #FFF;
    border-radius: 0 0 3px 3px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-navigator button:focus:enabled.ally-highlights-next,
.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-navigator button:hover:enabled.ally-highlights-next {
    background-color: #FFF;
    border-radius: 3px 3px 0 0;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-navigator button.ally-highlights-previous {
    margin-bottom: 3px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-navigator .ally-highlights-previous i {
    transform: rotate(90deg);
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-navigator .ally-highlights-next i {
    border-radius: 0;
    transform: rotate(90deg);
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-zoom-preview {
    display: inline-flex;
    margin-right: 40px;
}

[dir="rtl"] .ally-pdf-preview .ally-pdf-preview-toolbar .ally-zoom-preview {
    margin-left: 40px;
    margin-right: 0;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-zoom-preview .ally-zoom-preview-out {
    margin: 0 5px;
}

.ally-pdf-preview .ally-pdf-preview-toolbar .ally-download-original button {
    padding-top: 2px;
}

.ally-pdf-preview #ally-pdf-preview-viewer {
    height: calc(100vh - 68px);
    margin: 0 auto;
    overflow: hidden;
}

.ally-pdf-preview #ally-pdf-preview-viewer .ally-pdf-preview-viewer-outer {
    height: 100%;
    overflow-y: auto;
    padding: 5px 30px;
    width: 100%;
}

.ally-pdf-preview::-webkit-scrollbar {
    width: 10px;
}

.ally-pdf-preview::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 5px;
}

.ally-pdf-preview::-webkit-scrollbar-thumb:hover {
    background: #555;
}

.ally-pdf-preview #ally-pdf-preview-viewer .ally-pdf-preview-viewer-inner {
    overflow-x: auto;
    overflow-y: hidden;
}

.ally-pdf-preview #ally-pdf-preview-viewer .ally-pdf-preview-page {
    margin: 10px auto;
    position: relative;
}

.ally-pdf-preview #ally-pdf-preview-viewer .ally-pdf-preview-page canvas {
    background-color: #FFF;
    height: 100%;
    width: 100%;
}

.pdf-canvas-wrapper {
    position: relative;
    display: inline-block;
}

.ally-pdf-preview #ally-pdf-preview-viewer .ally-pdf-preview-page .ally-pdf-preview-page-text {
    bottom: 0;
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    overflow: hidden;
    z-index: 20001;
}

.ally-pdf-preview #ally-pdf-preview-viewer .ally-pdf-preview-page .ally-pdf-preview-page-text > span {
    color: transparent;
    cursor: text;
    position: absolute;
    transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    white-space: pre;
    line-height: 1;
}

.ally-pdf-preview #ally-pdf-preview-viewer .ally-pdf-preview-page .ally-pdf-preview-page-text > div::selection {
    background-color: rgba(182, 215, 249, 0.6);
}

.ally-pdf-preview #ally-pdf-preview-viewer .ally-pdf-preview-page .ally-pdf-preview-page-text.hidden {
    display: none;
}

#ally-pdf-preview-viewer.hidden {
    visibility: hidden;
}

/* ── Tag processing overlay ── */
.ally-pdf-tag-processing-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 30000;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(255, 255, 255, 0.15);
}

.ally-pdf-tag-processing-spinner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    color: #333;
    font-size: 16px;
    font-weight: 500;
}

.ally-pdf-tag-processing-spinner img {
    width: 48px;
    height: 48px;
    animation: spin 1s linear infinite;
}

.ally-pdf-blur {
    filter: blur(3px);
    pointer-events: none;
    transition: filter 0.3s ease;
}

.ally-pdf-preview #ally-pdf-preview-viewer {
    height: calc(100vh - 68px);
    margin: 0 auto;
    overflow: hidden;
    position: relative;
}

.ally-pdf-preview.ally-pdf-preview-disabled {
    position: relative;
    pointer-events: none;
    opacity: 0.5;
    user-select: none;
}

.ally-pdf-preview.ally-pdf-preview-disabled .ally-pdf-preview-toolbar {
    pointer-events: none;
    opacity: 0.6;
}

/* Hide download button at 1300px wide */

@media only screen and (max-width: 1300px) {
    .ally-pdf-preview .ally-pdf-preview-toolbar .ally-download-original {
        display: none;
    }
}

@media only screen and (max-width: 1150px) {
    .ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-description {
        display: none;
    }
}

@media only screen and (max-width: 980px) {
    .ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-toggle {
        display: none;
    }
}

@media only screen and (max-width: 920px) {
    .ally-pdf-preview .ally-pdf-preview-toolbar .ally-page-navigator .ally-page-button button,
    .ally-pdf-preview .ally-pdf-preview-toolbar .ally-page-navigator span,
    .ally-pdf-preview .ally-pdf-preview-toolbar .ally-page-navigator-total {
        display: none;
    }

    .ally-pdf-preview .ally-pdf-preview-toolbar .ally-page-navigator .ally-page-selector {
        float: left;
        margin: 0;
    }
}

@media only screen and (max-width: 900px) {
    .ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights .ally-highlights-count {
        display: none;
    }

    .ally-pdf-preview .ally-pdf-preview-toolbar .ally-highlights {
        justify-content: left;
        margin-left: 24px;
    }
}

@media only screen and (max-width: 800px) {
    .ally-pdf-preview .ally-pdf-preview-toolbar .ally-page-navigator {
        display: inline-grid;
    }
}
powered-by-ally-footer {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000;
    width: 100%;
    min-height: 32px;
    z-index: 100;
}

powered-by-ally-footer::part(ally-icon) {
    width: 24px;
    height: 18px;
    margin-right: 12px;
}

powered-by-ally-footer::part(ally-link) {
    color: white;
    text-align: center;
    text-decoration: none;
}

powered-by-ally-footer::part(ally-link):hover {
    text-decoration: underline;
}


.feedback-preview-html,
.feedback-preview-html-loading {
    height: 100%;
    width: 100%
}

.feedback-preview-html iframe {
    background-color: #FFF;
    height: 100%;
    max-width: 100%;
    width: 1024px;
}
#wysiwyg-preview-iframe {
    background-color: #FFF;
    color: black;
    height: 100%;
    max-width: 100%;
    width: 1024px;
}

.feedback-preview-html-loading {
    align-items: center;
    display: flex;
    justify-content: center;
}


.feedback-preview-toolbar {
    background-color: #222;
    font-size: 14px;
    font-weight: 400;
    height: 68px;
    margin: 0;
    min-width: 324px;
    padding: 0 16px;
    position: relative;
    width: 100%;
}

.feedback-preview-toolbar button {
    background: transparent;
    border: none;
    border-radius: 3px;
    color: #FFF;
    padding: 10px;
}

.feedback-preview-toolbar button:disabled {
    color: #8D8D8D;
}

.feedback-preview-toolbar button:hover:not(:disabled),
.feedback-preview-toolbar button:focus:not(:disabled) {
    background: #FFF;
    color: #000;
}

.feedback-preview-highlights {
    display: flex;
    height: 100%;
    justify-content: center;
    margin: auto;
}

.feedback-preview-highlights-left,
.feedback-preview-highlights-center,
.feedback-preview-highlights-right {
    align-items: center;
    display: flex;
    flex-grow: 0;
    flex-shrink: 0;
}

.feedback-preview-highlights-left {
    flex-basis: 80px;
    justify-content: flex-end;
}

.feedback-preview-highlights-right {
    flex-basis: 120px;
}

.feedback-preview-highlights-center {
    flex-shrink: 0;
    text-align: center;
}

.feedback-preview-highlights-right {
    justify-content: flex-start;
}

.feedback-preview-highlights-loading,
.feedback-preview-highlights-count,
.feedback-preview-highlights-description,
.feedback-preview-highlights-navigator {
    display: inline-block;
}

.feedback-preview-highlights-count {
    margin-right: 10px;
    width: 45px;
}

.feedback-preview-highlights-loading > svg-icon {
    display: flex;
    height: 45px;
    margin: 0 5px;
    width: 45px;
}

.feedback-preview-highlights-loading svg {
    animation: spin 1s linear infinite;
    margin: auto;
    opacity: 1;
    outline: none;
    stroke: #CCC;
    transition: opacity 0.2s linear;
}

.feedback-preview-highlights-count > span {
    background-color: #af0216;
    border-radius: 3px;
    display: inline-block;
    font-weight: 500;
    margin: 0 5px;
    max-height: 32px;
    padding: 5px 10px;
}

.feedback-preview-highlights-description {
    max-width: 250px;
}

.feedback-preview-highlights-navigator {
    display: flex;
    flex-direction: column;
    flex-grow: 0;
    height: 100%;
    justify-content: space-between;
    margin: 0 15px;
}

.feedback-preview-highlights-navigator button {
    background-color: #000;
    padding: 5px;
}

.feedback-preview-highlights-navigator button i {
    transform: rotate(90deg);
}

.feedback-preview-highlights-toggle {
    flex-grow: 0;
    margin-left: 10px;
}

.feedback-preview-download {
    align-items: center;
    display: flex;
    height: 100%;
    position: absolute;
    right: 16px;
    top: 0;
}

@media only screen and (max-width: 1024px) {
    .feedback-preview-highlights-toggle {
        display: none;
    }
}

@media only screen and (max-width: 840px) {
    .feedback-preview-download {
        display: none;
    }

    .feedback-preview-highlights-left,
    .feedback-preview-highlights-center,
    .feedback-preview-highlights-right {
        flex-basis: content;
        flex-shrink: 1;
    }
}


.feedback-score-indicator img {
    margin-right: 10px;
}

[dir="rtl"] .feedback-score-indicator img {
    margin-left: 10px;
    margin-right: unset;
}

/* Specify CSS with the element selector first or the style won't be applied */
dialog.timeout-dialog {
    background-color: white;
    border-style: solid;
    border-width: 2px;
    border-color: #0A0A0A;
    border-radius: 8px;
    text-align: center;
    padding: 2rem;
    margin: auto;
}

dialog.timeout-dialog::backdrop {
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
}

dialog.timeout-dialog-text {
    margin-top: 1rem;
}

.ally-client-onboard {
    display: flex;
    align-items: center;
    background-color: #222;
    font-size: 14px;
    border-radius: 4px;
    color: #FFF;
    line-height: 24px;
    min-height: 38px;
    border: none;
    padding-left: 20px;
    padding-right: 20px;
    text-align: center;
    gap: 8px;
}

button.ally-client-onboard img {
    height: 24px;
    width: 24px;
    margin-right: 4px;
}

.ally-client-onboard:focus {
    background-color: #222;
    color: #FFF;
    border: 1px solid #00AAEF;
    outline: none;
    box-shadow: 0 0 0 2px rgba(0, 170, 239, 0.5);
}

.ally-client-onboard:hover {
    background-color: #FFF;
    color: #222;
    border: 1px solid #222;
}

.ally-client-onboard:hover > svg * {
    fill: #222;
}

.ally-client-onboard-in-progress {
    background-color: #4E4E4E;
    color: #CDD2D5;
    border: 1px solid #222;
    cursor: default;
}

.ally-client-onboard-in-progress > svg *,
.ally-client-onboard-in-progress:hover > svg * {
    fill: #CDD2D5;
}

.ally-client-onboard-in-progress:hover {
    background-color: #4E4E4E;
    color: #CDD2D5;
}

all-issues ol {
    list-style-type: none;
    padding: 0;
}

all-issues ol li {
    align-items: center;
    background: #F7F7F7;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 24px;
    position: relative;
    width: 100%;
    margin-bottom: 4px;
}

all-issues ol li:focus,
all-issues ol li:hover {
    background: #EEE;
}

all-issues ol li .ally-if-listed-issue {
    max-width: 300px;
}

all-issues ol li .ally-if-listed-issue > span:first-child {
    display: block;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 4px;
}

all-issues ol li .ally-if-tackle-issue i {
    font-size: 36px;
}

[dir="rtl"] all-issues ol li .ally-if-tackle-issue i {
    transform: scaleX(-1);
}

/* Guidance coming soon text */
all-issues ol li .ally-if-tackle-issue span {
    background-color: #FFF;
    border-radius: 6px;
    display: inline-block;
    padding: 10px 20px;
    text-align: center;
    word-wrap: break-word;
}

all-issues ol li .ally-if-guidance-coming-soon {
    text-align: right;
    width: 100%;
}

all-issues ol li .ally-if-guidance-coming-soon > span {
    background-color: #FFF;
    bottom: -16px;
    display: inline-block;
    margin: -8px;
    padding: 8px;
    position: relative;
    right: -16px;
}

all-issues .fix-here {
    background: #047FA9;
    color: white;
    width: fit-content;
    padding: 2px 12px;
    border-radius: 12px;
    margin-bottom: 4px;
    font-size: 12px;
    line-height: normal;
}


.ally-if-custom-help-instructor,
.ally-if-help-modal-expert-failed {
    margin-top: 25px;
}

.ally-if-custom-help-instructor,
.ally-if-custom-help-instructor-expert {
    background-color: white;
}

.ally-if-custom-help-instructor {
    overflow-wrap: break-word;
}

.ally-if-custom-help-instructor h2,
.ally-if-custom-help-instructor-expert h2 {
    font-weight: 500;
    font-size: 24px;
    line-height: 1.25;
    margin: 30px 0 20px;
}

.ally-if-custom-help-instructor h3 {
    font-size: 18px;
}

.ally-if-custom-help-instructor h4 {
    font-size: 14px;
    font-weight: 600;
}

.ally-if-custom-help-instructor h2 + p,
.ally-if-custom-help-instructor h3 + p {
    margin-top: 20px;
}

.ally-if-custom-help-instructor > *:first-child {
    margin-top: 0;
}

.ally-if-custom-help-instructor-expert .ally-if-textarea textarea {
    width: 100%;
}

.ally-if-custom-help-instructor-expert label {
    font-weight: 500;
    font-size: 24px;
    margin-bottom: 0;
}

help-footer {
    background-color: white;
}

help-footer div.ally-additional-help-instructor {
    margin-top: 30px;
    width: fit-content;
    width: -moz-fit-content;
}

help-footer div.ally-additional-help-instructor > a {
    text-decoration: none;
    color: #333;
    padding: 5px 5px 5px 0;
}

help-footer a > span {
    font-weight: 600;
    margin-left: 4px;
    vertical-align: middle;
    text-decoration: underline;
}

help-footer div.ally-additional-help-instructor svg-icon svg {
    margin: 0 4px;
    vertical-align: middle;;
}

/*
 * Mirror the help icon. Note that this is language dependent and does not apply to ALL rtl languages.
 * e.g. Hebrew does not flip question marks
 */
[lang*="ar"] help-footer div.ally-additional-help-instructor svg-icon svg {
    transform: scaleX(-1);
}

how-guidance {
    display: block;
    padding: 0 45px 30px;
}

how-guidance legend {
    border-bottom: 0;
    font-size: 14px;
    margin: 20px 0 10px;
}

how-guidance a,
how-guidance a:hover,
how-guidance a:focus,
how-guidance a:visited {
    color: #337ab7;
}

how-guidance all-issues-panel > p {
    margin-left: -20px;
}

how-guidance all-issues-panel all-issues ol {
    margin: 0 -40px 10px;
}

/* Buttons that look like wireframes */
.ally-if-wire {
    display: inline-block;
    position: relative;
    vertical-align: middle;
}

.ally-if-wire > button,

.ally-if-wire > button:hover,
.ally-if-wire input[type="button"],
.ally-if-wire input[type="button"]:focus,
.ally-if-wire input[type="button"]:hover {
    background-color: transparent;
    border: solid 1px #222;
    border-radius: 3px;
    color: #222;
    display: block;
    font-weight: 400;
    padding: 8px 20px;
    text-align: left;
}

.ally-if-wire > button:focus {
    outline: 2px solid #005FCC;
    outline-offset: 2px;
}

.ally-if-wire.ally-if-wire-inverse > button,
.ally-if-wire.ally-if-wire-inverse input[type="button"] {
    background-color: #222;
    border-color: transparent;
    color: #FFF;
}

.ally-if-wire > button:focus,
.ally-if-wire > button:hover {
    background-color: #222;
    border-color: transparent;
    color: #FFF;
}

.ally-if-wire.ally-if-wire-inverse > button:focus,
.ally-if-wire.ally-if-wire-inverse > button:hover,
.ally-if-wire.ally-if-wire-inverse > button[disabled="disabled"],
.ally-if-wire.ally-if-wire-inverse input[type="button"]:hover,
.ally-if-wire.ally-if-wire-inverse input[type="button"][disabled="disabled"] {
    background-color: transparent;
    border-color: #222;
    color: #222;
}

.ally-if-wire.ally-if-wire-inverse > button:focus-visible,
.ally-if-wire.ally-if-wire-inverse input[type="button"]:focus-visible {
    outline: 2px solid #005FCC;
    outline-offset: 2px;
}

.ally-if-wire > button[disabled],
.ally-if-wire > button[disabled]:focus,
.ally-if-wire > button[disabled]:hover {
    background-color: #F3F3F3;
    border-color: #F3F3F3;
    color: #666;
    cursor: not-allowed;
}

.ally-if-wire > button.tertiary-button {
    background-color: #EBEBEB;
    border-color: #EBEBEB;
    color: #222;
}

.ally-if-wire > button.tertiary-button:hover {
    background: #F7F7F7;
    border: 1px solid #222;
    color: #222;
}

.ally-if-wire > button.tertiary-button:focus,
.ally-if-wire > button.tertiary-button:focus-visible {
    background: #F7F7F7;
    border: 2px solid #00AAEF;
    box-shadow: 0 0 4px 0 #D9EAFC;
}

/* We need an inner container to do flex in firefox, so that we can visually vertically center the optional icon with
   the button text. However this div is only really necessary if we want an icon */
.ally-if-wire > button > div {
    -ms-flex-align: center;
    align-items: center;
    display: -ms-flexbox;
    display: flex;
}

/* Optional icon */
.ally-if-wire > button > div > i {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;

    /* Spacing between the icon and the label to the left. Don't use margin because that is being used to erase the
       internal spacing in material icons */
    padding-right: 10px;
}

[dir="rtl"] .ally-if-wire > button > div > i {
    padding-left: 10px;
    padding-right: unset;
}

.ally-if-wire > button > div > span {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

/* Button description */
.ally-if-wire > span {
    margin-top: 10px;
    position: absolute;
}

.ally-if-group-inline {
    display: inline-block;
    margin: 15px 0 20px 0;
}

.ally-if-group-inline .ally-if-wire:nth-child(2) {
    margin: 0 15px;
}

/* A button group that has a back link on the left and an optional button on the right */
.ally-if-back-next {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-top: 30px;
}

.ally-if-back-next .ally-if-wire {
    font-weight: 300;
}

.ally-if-back,
.ally-if-cancel {
    align-items: center;
    display: flex;
}

.ally-if-back i {
    margin-left: -5px;
}

[dir="rtl"] .ally-if-back i {
    transform: scaleX(-1);
}

.ally-if-back:hover,
.ally-if-cancel:hover {
    text-decoration: none;
}

.ally-if-back:focus span,
.ally-if-back:hover span,
.ally-if-cancel:focus span,
.ally-if-cancel:hover span {
    text-decoration: underline;
}

.ally-guidance-fix {
    padding-left: 5px;
}

.ally-guidance-fix > p {
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 21px;
}

.ally-guidance-fix > p:first-child {
    margin-top: 4px;
    margin-bottom: 32px;
}

.ally-guidance-fix > p:nth-child(2) {
    margin-bottom: 8px;
}

.ally-guidance-fix-apply {
    text-align: right;
}

/**
 * Copyright (c) 2016 "Fronteer LTD". All rights reserved.
 */

.ally-if-library-reference {
    margin-top: 35px;
}

.ally-if-library-reference label {
    display: block;
    font-weight: 500;
    margin-bottom: 5px;
}

.ally-if-library-reference input.url-input-invalid {
    border: solid 1px #B33;
}

.url-validity {
    background-color: rgb(255, 213, 213);
    margin: -20px auto 20px auto;
    padding: 12px;
}

.ally-if-library-reference input {
    border: solid 1px #9B9B9B;
    border-radius: 5px;
    display: block;
    font-weight: 400;
    margin-bottom: 20px;
    padding: 10px;
    width: 100%;
}

/* Left-aligned input fields (e.g. URLs) should still have their place holder aligned to the right in RTL languages */
[dir="rtl"] .ally-if-library-reference input[dir="ltr"]::placeholder {
    text-align: right;
}

upload .upload-drop {
    border: dashed 1px #9B9B9B;
    border-radius: 5px;
    padding: 25px;
    width: 100%;
}

upload .upload-drop-content {
    -ms-flex-align: center;
    align-items: center;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
}

upload .upload-drop i {
    font-size: 48px;
}

upload .upload-drop svg-icon svg {
    height: 48px;
    width: 48px;
}

upload .upload-progress-filename {
    display: block;
    font-weight: 500;
    margin: 10px 0;
    word-wrap: break-word;
}

upload progressbar bar.progress-bar {
    background-color: #222;
    border-radius: 5px;
    box-shadow: inset 0 0 3px #888;
    height: 25px;
    width: 0;
}

upload .warning-message {
    color: #dc3545;
    margin-top: 10px;
}

upload .upload-drop-browse {
    box-sizing: border-box;
    background-color: black;
    color: white;
    border: 1px solid black;
    border-radius: 2px;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 2px 4px;
    cursor: pointer;
    transition: background-color 0.1s ease, border 0.1s ease;
}

upload .upload-drop-browse:hover,
.upload-drop-browse:focus {
    background-color: white;
    color: black;
    border-radius: 2px;
    outline-offset: 2px;
    outline: 2px solid #005FCC;
}

ally-button button {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px 20px;
    height: 38px;
    border: 1px solid black;
    margin-bottom: 20px;
    transition: background-color 0.3s, color 0.3s;
    cursor: pointer;
    border-radius: 4px;
}

ally-button button:focus{
    outline: 2px solid #005FCC;
    outline-offset: 2px;
}

/* Secondary Button */
ally-button button.primary-button {
    color: white;
    background-color: black;
}

ally-button button.primary-button:hover{
    background-color: white;
    color: black ;
}

ally-button button.primary-button:focus {
    background-color: white;
    color: black ;
}

ally-button button.primary-button:disabled {
    color: #888888 ;
    border: none;
    background-color: #F0F0F0;
    cursor: not-allowed;
}

/* Secondary Button */
ally-button button.secondary-button {
    color: black;
    background-color: white;
}

ally-button button.secondary-button:hover {
    background-color: black;
    color: white;
}

ally-button button.secondary-button:focus {
    background-color: black;
    color: white;
}

ally-button button.secondary-button:disabled {
    background-color: lightgray;
    color: black;
}

.ally-text-input-box {
    line-height: 20px;
}

.ally-text-input-box label {
    display: block;
    height: 18px;
    font-size: 15px;
}

.input-container {
    position: relative;
    width: 100%;
}

textarea {
    width: 100%;
    padding: 4px 30px 4px 8px;
    box-sizing: border-box;
    resize: vertical;
}

.clear-button {
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    background-color: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s, filter 0.3s;
    width: 16px; 
    height: 16px;
    background-image: url(/static/ally-clear-text-button.d1355c6120e827073a42.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.clear-button:hover {
  background-image: url(/static/ally-black-clear-big.7db62a7311c960c75bd8.svg);
  filter: brightness(0.7);
}

.clear-button:focus {
    outline: 2px solid #005fcc;   
    outline-offset: 2px;          
}

.error-panel {
    background-color: #f8d7da;
    color: #721c24;
    padding: 8px;
    margin-top: -8px;
    margin-bottom: 1em;
    border: 1px solid #f5c6cb;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.error-message {
    display: flex;
    align-items: center;
}

.error-icon {
    width: 24px;
    height: 24px;
    margin-right: 16px;
}

#ally-if-generate-alt-text-button {
    margin-top: 16px;
    padding-top: 6px;
    padding-bottom: 6px;
    outline: none;
}

#ally-if-generate-alt-text-button:focus {
    outline: 2px solid #005fcc; /* Adjust color as needed */
    outline-offset: 2px;
}

#ally-if-generate-alt-text-button svg {
    margin-right: 4px;
}

#ally-if-generate-alt-text-button:hover svg {
    fill: white;
    color: white;
}

#ally-if-generate-alt-text-button[disabled] svg,
#ally-if-generate-alt-text-button[disabled]:hover svg {
    fill: #666;
    color: #666;
}

.ally-if-alt-text-button-loading {
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: center;
}

.loading-overlay {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    background: white;
    flex-grow: 1;
}

.ally-if-alt-text-button-loading-spinner {
    animation: spin 1s linear infinite;
    width: 20px;
    height: 20px;
}

.loading-overlay > .text-content {
    font-size: 13px;
    text-align: center;
}

.loading-overlay .loading-spinner {
    animation: spin 1s linear infinite;
    width: 24px;
    height: 24px;
    display: flex;
    background-color: transparent;
    position:relative;
    margin-bottom:20px;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.text-size{
    font-size: 14px;
}

/**
 * Copyright (c) 2016 "Fronteer LTD". All rights reserved.
 */
.ally-if-alternative-text-input-container {
    display: flex;
    flex-direction: column;
}

.ally-if-alternative-text label {
    font-size: 16px;
    margin-bottom: 5px;
}

.ally-if-alternative-text-message {
    border-radius: 0 0 3px 3px;
    color: #222;
    display: flex;
    gap: 8px;
    padding: 10px 20px;
    top: 5px;
    width: 100%;
}

.ally-if-alternative-text #ally-if-alternative-text-error-message {
    background-color: #F9DFE2;
}

.ally-if-alternative-text #ally-if-alternative-text-info-message {
    background-color: #D7F7FF;
}

.ally-if-alternative-text #ally-if-alternative-text-error-message button {
    padding: 0;
}

.ally-if-alternative-text form.ng-invalid .ally-if-textarea.ally-if-has-error {
    border-color: #D0011B;
    box-shadow: 0 0 4px 0 #A66F75;
}

.ally-if-textarea > textarea::placeholder {
    color: #666;
    font-size: 14px;
}

.ally-if-alternative-text hr {
    border-color: #9B9B9B;
    margin: 30px 0;
}

.ally-if-alternative-text .ally-if-alternative-text-remove {
    margin-top: 15px;
}

.ally-if-alternative-text .ally-if-alternative-text-decorative {
    margin-bottom: 65px;
}

.ally-if-alternative-text .ally-if-alternative-text-decorative > span {
    font-size: 16px;
    margin-right: 15px;
}

.ally-if-wire.ally-if-alternative-text-remove > button,
.ally-if-wire.ally-if-alternative-text-remove > button:focus,
.ally-if-wire.ally-if-alternative-text-remove > button:hover {
    background: none;
    color: inherit;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    letter-spacing: inherit;
}

.generating-text {
    border: none;
    height: 100%;
    padding: 10px;
    resize: none;
    width: 70%;
}

@keyframes moving-gradient {
    0% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.generating-text > div {
    background: linear-gradient(90deg, #A0A0A0 20%, #DADADA 25%, #DADADA 50%, #A0A0A0 55%, #A0A0A0 70%, #DADADA 75%, #DADADA 100%);
    background-size: 200% 100%;
    animation: moving-gradient 3s linear infinite;
    flex-shrink: 0;
    height: 18px;
    width: 90%;
    margin-bottom: 12px;
}


.trigger-autoTag-container {
    padding-top: 20px;
}

.trigger-autoTag-container p {
    font-size: 14px;
}

.trigger-autoTag-actions {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}

.issue-summary {
    background-color: #3E4043;
    color: #FFF;
    margin-left: -25px;
    margin-top: -30px;
    padding: 24px;
    width: 400px;
}

.issue-summary .issue-title p,
.issue-summary .issue-title h1 {
    font-size: 23px;
    margin-bottom: 12px;
    font-weight: 200;
    padding-top: 5px;
}

.trigger-autoTag-actions {
    padding-bottom: 20px;
}

.trigger-autoTag-actions ally-button button {
    margin-bottom: 0px;
}

.issue-panel .action-bar ally-button button {
    margin-bottom: 0px;
}

.panel-button .button-mean {
    background: #3E4043;
    border-radius: 4px;
    color: #FFF;
    font-weight: 400;
    padding: 8px 15px;
    width: 150px;
    border: 1px solid #FFF;
}

.panel-button .button-mean:hover,
.panel-button .button-mean:focus,
.panel-button .button-mean:focus-visible {
    background-color: #222;
    color: #FFF;
}

.trigger-ocr-processing {
    padding: 40px 20px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.trigger-ocr-processing h2 {
    font-size: 20px;
    font-weight: 600;
}

.trigger-ocr-processing ally-loading-spinner {
    margin-bottom: 20px;
}

.trigger-ocr-processing .load-spinner {
    margin-bottom: 20px;
    width: 25px;
    animation: rotate 2s linear infinite;
}

.trigger-ocr-processing p {
    font-size: 14px;
}

.issue-triangle {
    position: relative;
    height: 30px;
    background: transparent;
    margin-top: -40px;
}

.issue-triangle::after {
    border-bottom: 30px solid #3E4043;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    content: "";
    left: 48px;
    position: absolute;
    width: 0;
}

.issue-panel {
    background-color: #FFF;
    color: #222;
    margin-left: -25px;
    margin-top: -30px;
    padding: 24px;
    width: 400px;
}

.issue-triangle-white {
    position: relative;
    height: 30px;
    background: transparent;
    margin-top: -40px;
}

.issue-triangle-white::after {
    border-bottom: 30px solid #FFF;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    content: "";
    left: 48px;
    position: absolute;
    width: 0;
}

.issue-content {
    background: #FFF;
    padding: 12px;
}

/* Heading */
.issue-heading {
    margin: 0 0 16px 0;
    font-size: 24px;
    font-weight: 400;
    color: #333;
}

.issue-step {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 14px;
    line-height: 1.6;
    color: #333;
}

.issue-step-number {
    white-space: nowrap;
    font-weight: 400;
}

.issue-step-text {
    flex: 1;
}

.issue-step-image {
    margin-top: 8px;
    padding-bottom: 15px;
    max-width: 100%;
    border-radius: 4px;
}

.action-bar {
    display: flex;
    align-items: center;
    justify-content: space-between; /* key line */
    width: 100%;
    padding: 16px 0;
}

.back-btn {
    display: flex;
    align-items: center;
    background: none;
    border: none;
    padding-bottom: 20px;
    font-size: 16px;
    color: #333;
    cursor: pointer;
}

.back-icon {
    width: 14px;
    height: 14px;
    display: block;
}

.back-btn span {
    font-weight: 400;
}

.learn-how-btn-wrapper {
  display: inline-block;
  border: 1px solid black;   /* the visible border */
  transition: background-color 0.3s ease, color 0.3s ease, border 0.3s ease;
  height: 40px;
  margin-bottom: 25px;
  border-radius: 5px;
}

.learn-how-btn-wrapper:hover {
  background-color: black;
  color: white;
  border: 1px solid black;
}

.learn-how-btn-wrapper ally-button button {
  color: inherit; 
  background-color: transparent; 
  border: none;
  box-shadow: none;
}

#upload-message {
    margin-top: 20px;
}

.panel-button {
  display: flex;
  gap: 8px; /* optional spacing between buttons */
  align-items: flex-start; /* optional */
}

fix-pdf-ocr .trigger-ocr-container p {
    font-size: 14px;
}

fix-pdf-ocr .trigger-ocr-actions {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}

fix-pdf-ocr .trigger-ocr-processing {
    padding: 40px 20px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

fix-pdf-ocr .trigger-ocr-processing h2 {
    font-size: 20px;
    font-weight: 600;
}

fix-pdf-ocr .trigger-ocr-processing ally-loading-spinner {
    margin-bottom: 20px;
}

fix-pdf-ocr .trigger-ocr-processing .load-spinner {
    margin-bottom: 20px;
    width:25px;
    animation: rotate 2s linear infinite;
}

fix-pdf-ocr .trigger-ocr-processing p{
    font-size:14px;
}

fix-pdf-ocr .trigger-ocr-preview .trigger-ocr-actions {
    justify-content: space-between;
}

fix-pdf-ocr .trigger-ocr-preview p {
    font-size:14px;
}

fix-pdf-ocr .trigger-ocr-preview-warning {
    margin: 20px 0;
}

fix-pdf-ocr .trigger-ocr-download-options {
    margin: 20px 0;
}

fix-pdf-ocr .trigger-ocr-checkbox {
    align-items: center;
    cursor: pointer;
    display: flex;
    position: relative;
}

fix-pdf-ocr .trigger-ocr-checkbox input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 18px;
    height: 18px;
    border: 2px solid #000;
    border-radius: 4px;
    margin-right: 10px;
    position: relative;
    cursor: pointer;
    background-color: #fff;
    transition: all 0.2s ease;
    margin-top:1px;
}

fix-pdf-ocr .trigger-ocr-checkbox input[type="checkbox"]:hover {
    border-color: #333;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
}

fix-pdf-ocr .trigger-ocr-checkbox input[type="checkbox"]:checked {
    background-color: #fff;
    border-color: #000;
}

fix-pdf-ocr .trigger-ocr-checkbox input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    left: 4px;
    top: 0;
    width: 6px;
    height: 10px;
    border: solid #000;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

fix-pdf-ocr .trigger-ocr-checkbox input[type="checkbox"]:focus {
    outline: 2px solid #000;
    outline-offset: 2px;
}


/* General Styles */
.fix-pdf-title {
    font-family: Helvetica Neue, sans-serif;
    line-height: 20px;
}

.fix-pdf-title p {
    font-size: 14px;
}

/* Input Section */
.fix-pdf-title-input {
    width: 100%;
}

.fix-pdf-title-input label {
    display: block;
    height: 18px;
    font-size: 15px;
}

.fix-pdf-title-input input {
    width: 100%;
    margin-top: 5px;
    margin-bottom: 1em;
    padding: 8px;
    box-sizing: border-box;
}

/* Apply Fix Section */
.fix-pdf-title-apply {
    display: flex;
    justify-content: flex-end;
    text-align: right;
}

/* Separator and "Or" Section */
.fix-pdf-title-or {
    display: flex;
    justify-content: flex-start;
    margin-top: 32px;
    gap: 20px; /* Space between "Or" and the button */
}

.separator {
    width: 100%;
    height: 1px;
    background-color: grey;
    border: none;
}

.fix-pdf-title-or .or-text {
    font-size: 14px;
    line-height: 40px; /* Matches the button height for vertical centering */
}

/* Loading Spinner */
.loading-spinner {
    text-align: center;
    margin-top: 10px;
}

@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.loading-spinner img {
    animation: rotate 2s linear infinite;
}

.input-container {
    position: relative;
    width: 100%;
}

.input-container input {
    width: 100%;
    padding-right: 30px; /* Add space for the clear button */
    box-sizing: border-box;
}

back-button svg-icon svg {
    margin: -2px 7px 0 4px;
}

[dir="rtl"] back-button svg-icon svg {
    transform: scaleX(-1);
}

back-button .ally-if-wire button,
back-button .ally-if-wire button:hover,
back-button .ally-if-wire button:focus,
back-button .ally-if-wire button:visited {
    -ms-flex-align: center;
    align-items: center;
    background-color: unset;
    border: unset;
    border-radius: unset;
    color: #333;
    cursor: pointer;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-weight: 500;
    letter-spacing: .03em;
    padding: unset;
    text-decoration: none;
}

cancel-button a,
cancel-button a:hover,
cancel-button a:focus,
cancel-button a:visited {
    color: inherit;
    text-decoration: none;
}

#fix-broken-link-update-button:disabled {
    background-color: #4E4E4E;
    color: #CDD2D5;
    cursor: not-allowed;
}

.fix-broken-link-text-area {
    border: 2px solid #00AAEF;
    box-shadow: 0 0 4px 0 #D9EAFC;
}

.fix-broken-link-text-area-grey {
    color: #666;
    background-color: #EBEBEB;
}

#fix-broken-link-text {
    margin-bottom: 30px;
}

#fix-broken-link-text,
#fix-broken-link-url {
    height: 40px;
    display: flex;
    justify-content: center;
    background-color: #F7F7F7;
    border: 0;
    width: 100%;
    padding: 16px 10px 16px 10px;
    font-weight: 400;
    font-size: 14px;
    color: #4E4E4E;
    border-radius: 3px;
}

.fix-broken-link-error-border,
.fix-broken-link-error-border:focus,
.fix-broken-link-error-border:hover {
    border: 2px solid #D0021B;
    box-shadow: 0 0 4px 0 #A66F75;
}

.fix-broken-link-loading-border,
.fix-broken-link-loading-border .fix-broken-link-loading-border:hover {
    border: 2px solid #4E4E4E;
}

#ally-if-broken-link-url-update,
#ally-if-broken-link-url-update:focus,
#ally-if-broken-link-url-update:hover,
#ally-if-broken-link-url-update:focus-visible {
    border: none;
    outline: none;
}

.fix-broken-link-remove {
    margin-top: 16px;
}

label[for="ally-if-broken-link-url-update"] {
    color: #222;
    font-weight: 500;
    margin-bottom: 6px;
}

.quick-fix-message {
    display: flex;
    align-items: center;
    color: #222;
    padding: 10px 12px;
    width: 100%;
    gap: 8px;
}

.quick-fix-error-message {
    background-color: #FADFE2;
}

.quick-fix-loading-message {
    background-color: #F7F7F7;
}

.quick-fix-text-message {
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.spinning-message-icon {
    animation: spin 2s linear infinite;
}

.fix-contrast-options {
    padding-left: 5px;
}

.fix-contrast-label {
    border-bottom: none;
}

.fix-contrast-options > div {
    margin-bottom: 20px;
}

.fix-contrast-options-colors {
    display: flex;
}

.fix-contrast-options-colors button,
.fix-contrast-options-colors button:active,
.fix-contrast-options-colors button:focus,
.fix-contrast-options-colors button:hover {
    align-items: center;
    border: solid 1px #999;
    border-radius: 5px;
    color: #FFF;
    display: flex;
    height: 40px;
    justify-content: center;
    margin-right: 6px;
    width: 40px;
}

.fix-contrast-options-colors button:active,
.fix-contrast-options-colors button:focus,
.fix-contrast-options-colors button:hover {
    border-color: #FFF;
    outline: 3px solid #000;
    outline-offset: 2px;
}

.fix-contrast-options-colors button i {
    font-size: 32px;
}

.fix-contrast-options-fixall span {
    margin-left: 1rem;
    margin-bottom: 5px;
}

.fix-contrast-options-apply {
    text-align: right;
}

/*
What follows is a horrible workaround because we can't import the tooltip css from the shared library without
causing webpack to have a meltdown. This is a copy of the tooltip css from the shared library with the class names
 */

.ally-tooltip,
.arrow::after {
    left: 100px;
    position: absolute;
    top: 100px;
    visibility: hidden;
}

.ally-tooltip {
    border-radius: 3px;
    border: 1px solid #DDD;
    box-shadow: 6px 5px 9px -9px #000;
    color: #FFF;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
    max-width: 400px;
    opacity: 0.9;
    padding: 10px 20px;
    text-align: center;
    margin-left: 65px;
    z-index: 9999;
}

.ally-tooltip div:first-child {
    position: relative;
    white-space: nowrap;
    z-index: 2;
}

.ally-tooltip,
.ally-tooltip .ally-arrow::after {
    background-color: #000;
}

.ally-tooltip .ally-arrow {
    bottom: -16px;
    height: 16px;
    left: -14px;
    overflow: hidden;
    position: absolute;
    width: 70px;
    pointer-events: none;
}

.ally-tooltip .ally-arrow.ally-arrow-top {
    bottom: auto;
    top: -16px;
}

.ally-tooltip .ally-arrow::after {
    border: 1px solid #000;
    box-shadow: 6px 5px 9px -9px #000;
    content: "";
    height: 25px;
    left: 21px;
    position: absolute;
    top: -20px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 25px;
    border-color: #FFF;
}

.ally-tooltip .ally-arrow-top::after {
    bottom: -20px;
    top: auto;
}

.ally-tooltip .ally-arrow-bottom {
    top: -16px;
}

.ally-tooltip .ally-arrow-bottom::after {
    bottom: -20px;
    top: auto;
}

.ally-tooltip .ally-arrow-left {
    left: 0;
    margin-left: -28px;
    top: calc(50% - 17px);
    height: 38px;
    width: 28px;
}

.ally-tooltip .ally-arrow-left::after {
    right: auto;
    top: 4px;
}

.ally-tooltip .ally-arrow-right {
    left: 100%;
    margin-left: 0;
    top: calc(50% - 18px);
    height: 38px;
    width: 14px;
}

.ally-tooltip .ally-arrow-right::after {
    left: -20px;
    top: 5px;
}

.ally-tooltip .ally-tooltip-under {
    background-color: #333;
    color: #FFF;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    margin-left: 16px;
}

.ally-helper-hidden-accessible {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}



.fix-empty-headings-options {
    margin-bottom: 32px;
}

.fix-empty-headings-fixall {
    margin-bottom: 32px;
}

.fix-empty-headings-fixall span {
    margin-left: 1rem;
}

.fix-empty-headings-options input[type=radio] {
    vertical-align: -2px;
}



.fix-link-text-options {
    padding-left: 5px;
}

.fix-link-text-options label {
    display: block;
}

.fix-link-text-options-apply {
    text-align: right;
}

.fix-link-text-add-text {
    margin-left: 20px;
}

.fix-link-text-add-text input {
    margin-left: 1rem;
}

/* General Styles */

.fix-pdf-language p {
    font-size: 14px;
}

.fix-pdf-language-input label {
    display: block;
    height: 18px;
    font-size: 15px;
}

.fix-pdf-language-input select {
    width: 100%;
    margin-top: 5px;
    margin-bottom: 5px;
    box-sizing: border-box;
    padding: 8px;
    appearance: none;
    cursor: pointer;
    background-image: url(/static/dropdown-svgrepo-com.e7ed379f50d0bde3cace.svg);
    background-repeat: no-repeat;
    background-position: top 10px right 12px;
    background-size: 15px;
    border-radius: 4px;
}

/* Primary Button */
.fix-pdf-language-button {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px 20px;
    height: 38px;
    margin-bottom: 20px;
    background-color: black;
    border-radius: 4px;
    border-width: 1px;
    transition: background-color 0.3s, color 0.3s;
}

.fix-pdf-language-button div {
    display: flex;
    align-items: center;
    color: white;
    transition: color 0.3s;
}

.fix-pdf-language-button:hover{
    background-color: white;
}

.fix-pdf-language-button:focus{
    outline: 2px solid #005FCC;
    outline-offset: 2px;
}

.fix-pdf-language-button:hover div{
    color: black;
}

.fix-pdf-language-button:disabled{
    background-color: #F0F0F0;
    border: none;
    cursor: not-allowed;
}

.fix-pdf-language-button:disabled div{
    color: #888888;
}

.fix-pdf-language-button svg {
    display: flex;
    justify-content: flex-start;
    margin-top: 32px;
    gap: 20px; /* Space between "Or" and the button */
}

/* Apply Fix Section */
.fix-pdf-language-apply {
    display: flex;
    justify-content: flex-end;
    text-align: right;
}

/* Separator and "Or" Section */
.fix-pdf-language-or {
    display: flex;
    justify-content: flex-start;
    margin-top: 32px;
    gap: 32px; /* Space between "Or" and the button */
}

.fix-pdf-language-or .or-text {
    font-size: 14px;
    line-height: 40px; /* Matches the button height for vertical centering */
}

/* Loading Spinner */
.loading-spinner {
    position: absolute;
    width: 90%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.1);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
}

@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.loading-spinner img {
    animation: rotate 2s linear infinite;
    width: 20%;
    height: auto;

}

.fix-pdf-language-note{
    margin-top: 20px;
}


.fix-table-headers-options-fixall {
    margin-bottom: 32px;
}

.fix-table-headers-options-fixall span {
    margin-left: 1rem;
}

app-selector-panel ul.ally-if-apps {
    list-style: none;
    margin: 20px 0 10px;
    padding: 0;
}

app-selector-panel ul.ally-if-apps li {
    padding-bottom: 4px;
}

app-selector-panel ul.ally-if-apps a {
    text-decoration: none;
}

app-selector-panel ul.ally-if-apps a span {
    text-decoration: underline;
}

app-selector-panel ul.ally-if-apps a svg-icon svg {
    margin: 0 8px -1px;
}

[dir="rtl"] app-selector-panel ul.ally-if-apps a svg-icon svg {
    transform: scaleX(-1);
}

/* Bring the arrow inline with the link color */
app-selector-panel ul.ally-if-apps a svg-icon svg g g {
    fill: #337ab7;
}

/* The i18n translations contain a <i ... /> to render a file upload icon */
app-selector-panel .ally-if-with-download-url a i {
    font-size: 18px;
    vertical-align: middle;;
}


#ally-if-oops {
    background-color: #FFF;
    bottom: 0;
    padding: 80px 40px 40px;
    height: 100vh;
    top: 0;
    width: inherit;
}

#ally-if-oops img {
    position: absolute;
    width: 80px;
}

#ally-if-oops h1 {
    display: inline-block;
    font-weight: 200;
    margin: -10px 0 0 100px;
}

#ally-if-oops a {
    color: #337AB7;
    text-decoration: underline;
}

[dir="rtl"] #ally-if-oops h1 {
    margin: -10px 100px 0 0;
}

#ally-if-oops p {
    margin: 10px 0 0 100px;
    word-wrap: break-word;
}

[dir="rtl"] #ally-if-oops p {
    margin: 10px 100px 0 0;
    width: 220px;
}

#ally-if-oops button.close {
    color: #000;
}

#ally-if-oops button.close:hover {
    background-color: #222;
    border-radius: 4px;
    color: #FFF;
}

tailored-guidance-panel h3 {
    margin-bottom: 10px;
}

tailored-guidance-panel ol.ally-if-guidance-steps {
    padding-left: 20px;
}

[dir="rtl"] tailored-guidance-panel ol.ally-if-guidance-steps {
    padding-left: 0;
    padding-right: 20px;
}

[lang="ar"] tailored-guidance-panel ol.ally-if-guidance-steps {
    list-style-type: arabic-indic;
}

tailored-guidance-panel ol.ally-if-guidance-steps li {
    padding: 10px 0 0 15px;
}

[dir="rtl"] tailored-guidance-panel ol.ally-if-guidance-steps li {
    padding: 10px 15px 0 0;
}

tailored-guidance-panel .ally-if-wire.ally-if-how-to-button {
    display: block;
    margin: 20px 0px 20px;
}

tailored-guidance-panel .ally-if-guidance-steps .ally-if-warning {
    margin: 25px 0 15px -35px;
}

[dir="rtl"] tailored-guidance-panel .ally-if-guidance-steps .ally-if-warning {
    margin: 25px -35px 15px 0;
}

/* An illustration contained within a list item */
tailored-guidance-panel .ally-if-guidance-steps li figure {
    left: -34px;
    margin: 10px 0 0;
    position: relative;
    width: 310px;
}
[dir="rtl"] tailored-guidance-panel .ally-if-guidance-steps li figure {
    left: unset;
    right: -34px;
}

tailored-guidance-panel .ally-if-guidance-steps li figure.ally-if-docs-illustration > img {
    object-fit: contain;
    margin: 15px 0;
    max-width: 100%;
}

tailored-guidance-panel .ally-if-with-download-url a i {
    font-size: 18px;
}

tailored-guidance-panel .ally-if-guidance-steps li ul.ally-if-apps {
    list-style: none;
    margin: 20px 0 10px;
    padding: 0;
}

tailored-guidance-panel .ally-if-guidance-steps li ul.ally-if-apps li {
    padding-bottom: 4px;
}

tailored-guidance-panel .ally-if-guidance-steps li ul.ally-if-apps a {
    text-decoration: none;
}

tailored-guidance-panel .ally-if-guidance-steps li ul.ally-if-apps a span {
    text-decoration: underline;
}

tailored-guidance-panel .ally-if-guidance-steps li ul.ally-if-apps a svg-icon svg {
    margin: 0 8px -1px;
}

[dir="rtl"] tailored-guidance-panel .ally-if-guidance-steps li ul.ally-if-apps a svg-icon svg {
    transform: scaleX(-1);
}

/* Bring the arrow inline with the link color */
tailored-guidance-panel .ally-if-guidance-steps li ul.ally-if-apps a svg-icon svg g g {
    fill: #337ab7;
}

/* The i18n translations contain a <i ... /> to render a file upload icon */
tailored-guidance-panel .ally-if-guidance-steps li .ally-if-with-download-url a i {
    font-size: 18px;
    vertical-align: middle;;
}

tailored-guidance-panel ol.ally-if-guidance-steps ul li {
    padding: 0 0 0 0;
}

tailored-guidance-panel ol.ally-if-guidance-steps a i {
    font-size: 18px;
    vertical-align: bottom;
}

[dir="rtl"] tailored-guidance-panel ol.ally-if-guidance-steps ul li {
    padding: 0 0 0 0;
}


try-to-fix-another-flow-first note + p {
    margin-top: 30px;
}

try-to-fix-another-flow-first .ally-if-back-next {
    margin-top: 50px;
}

try-to-fix-another-flow-first .ally-if-wire.ally-if-wire-inverse > button {
    max-width: 210px;
}


try-to-fix-anyway-panel note + p {
    margin-top: 30px;
}

try-to-fix-anyway-panel .ally-if-back-next {
    margin-top: 50px;
}

try-to-fix-anyway-panel .ally-if-wire.ally-if-wire-inverse > button {
    max-width: 210px;
}

upload-panel upload .upload-container {
    margin: 30px 0 20px;
}

upload-panel .ally-if-alertbadge {
    align-items: center;
    background-color: #F9DFE2;
    border-radius: 5px;
    display: flex;
    padding: 15px;
    position: relative;
}

upload-panel .ally-if-alertbadge button {
    text-decoration: underline;
}

upload-panel .ally-if-alertbadge svg-icon.ally-if-alertbadge-warning svg {
    height: 34px;
    margin-right: 15px;
    vertical-align: middle;
    width: 34px;
}

upload-panel .ally-if-alertbadge svg-icon.ally-if-alertbadge-warning svg g {
    fill: #CF0B1B;
}

upload-panel .ally-if-alertbadge-content button {
    display: inline;
    margin: 0;
    padding: 0 0 0 5px;

    /** Ensure that the arrow doesn't obscure the button */
    position: relative;
    z-index: 2;
}

upload-panel .ally-if-alertbadge-moreinfo {
    background-color: #222;
    border-radius: 5px;
    box-shadow: -2px 2px 3px 1px rgba(0, 0, 0, 0.2);
    color: #FFF;
    margin-left: -15px;
    padding: 15px;
    position: absolute;
    top: 95%;
    z-index: 1;
}

upload-panel .ally-if-alertbadge-moreinfo button.ally-if-alertbadge-moreinfo-close,
upload-panel .ally-if-alertbadge-moreinfo button.ally-if-alertbadge-moreinfo-close:hover,
upload-panel .ally-if-alertbadge-moreinfo button.ally-if-alertbadge-moreinfo-close:focus {
    color: #FFF;
    margin: 0;
    padding-left: 0;
}

upload-panel .ally-if-alertbadge-moreinfo-arrowup {
    height: 15px;
    margin-left: -15px;
    position: absolute;
    text-align: center;
    top: 0;
    width: 100%;
}

upload-panel .ally-if-alertbadge-moreinfo-arrowup svg-icon svg {
    height: 35px;
    position: relative;
    top: -25px;
    width: 35px;
}

upload-panel .ally-if-alertbadge-moreinfo-arrowup svg-icon svg g {
    fill: #222;
}

.issue-panel {
    background-color: #FFF;
    color: #222;
    margin-left: -25px;
    margin-top: -30px;
    padding: 24px;
    width: 400px;
}

.issue-triangle-white {
    position: relative;
    height: 30px;
    background: transparent;
    margin-top: -40px;
}

.issue-triangle-white::after {
    border-bottom: 30px solid #FFF;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    content: "";
    left: 48px;
    position: absolute;
    width: 0;
}

.issue-content {
    background: #FFF;
    padding: 12px;
}

/* Heading */
.issue-heading {
    margin: 0 0 16px 0;
    font-size: 24px;
    font-weight: 400;
    color: #333;
}

.issue-step {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 14px;
    line-height: 1.6;
    color: #333;
}

.issue-step-number {
    white-space: nowrap;
    font-weight: 400;
}

.issue-step-text {
    flex: 1;
}

.issue-step-first-image {
    margin-top: 25px;
    padding-bottom: 25px;
    border-radius: 4px;
    width: 250px;
    height: 128px;
    margin-left: 50px;
}

.issue-step-second-image {
    margin-top: 25px;
    padding-bottom: 25px;
    border-radius: 4px;
    width: 198px;
    height: 109px;
    margin-left: 75px;
}

.action-bar {
    display: flex;
    align-items: center;
    justify-content: space-between; /* key line */
    width: 100%;
    padding: 16px 0;
}

.pdf-autotag-back-button {
    display: flex;
    align-items: center;
    background: none;
    border: none;
    font-size: 14px;
    color: #333;
    cursor: pointer;
}

.pdf-autotag-back-button:hover {
    font-size: 14px;
}

.approve-panel {
    background-color: #FFF;
    color: #222;
    margin-left: -25px;
    margin-top: -30px;
    padding: 24px;
    width: 400px;
}

.issue-approve-triangle {
    position: relative;
    height: 30px;
    background: transparent;
    margin-top: -40px;
}

.issue-approve-triangle::after {
    border-bottom: 30px solid #FFF;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    content: "";
    left: 48px;
    position: absolute;
    width: 0;
}

.pdf-approve-now {
    background: #FFF;
    padding: 12px;
}

.pdf-approve-now .pdf-approve-heading {
    margin: 0;
    font-size: 24px;
    font-weight: 300;
    color: #333;
}

.pdf-approve-guidance {
    font-size: 14px;
    line-height: 1.6;
    color: #222;
    padding-top: 10px;
}

.pdf-approve-guidance-item {
    padding-top: 15px;
}

.pdf-approval-guidance-text {
    font-family: Helvetica Neue, serif;
    flex: 1;
}

.action-bar-approve {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding-top: 30px;
}

.download-option {
    margin-top: 30px;
}

.download-text {
    font-family: Helvetica Neue, serif;
}

.download-checkbox {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
}

/* hide default checkbox */
.download-checkbox input {
    opacity: 0;
    position: absolute;
}

/* custom box */
.custom-checkbox {
    width: 18px;
    height: 18px;
    border: 2px solid #000;   /* thicker black border */
    background: #FFF;         /* white background */
    border-radius: 4px;
    position: relative;
}

/* black tick mark */
.download-checkbox input:checked + .custom-checkbox::after {
    border: solid #000;
    border-width: 0 2px 2px 0;
    content: "";
    height: 9px;
    left: 5px;
    position: absolute;
    top: 1px;
    transform: rotate(45deg);
    width: 5px;
}

.approve-separator {
    border: none;
    border-top: 1px solid #ccc;
    margin: 16px 0;
}

.download-checkbox input {
    position: absolute;
    width: 18px;
    height: 18px;
    opacity: 0;
    margin: 0;
    cursor: pointer;
}

.custom-checkbox {
    width: 18px;
    height: 18px;
    border: 2px solid #000;
    background: #FFF;
    border-radius: 4px;
    position: relative;
    flex-shrink: 0;
}

.download-checkbox input:focus-visible + .custom-checkbox {
    outline: 2px solid #1E5AC2;
    outline-offset: 2px;
}

.download-checkbox input:checked + .custom-checkbox::after {
    border: solid #000;
    border-width: 0 2px 2px 0;
    content: "";
    height: 9px;
    left: 5px;
    position: absolute;
    top: 1px;
    transform: rotate(45deg);
    width: 5px;
}

.review-container {
    width: 370px;
    padding: 5px;
    overflow-y: auto;
    font-family: Inter, Helvetica Neue, Arial, Helvetica, sans-serif;
}

.review-container .content-head {
    font-family: Helvetica Neue, sans-serif;
    font-size: 14px;
    padding-top: 15px;
}

.page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 18px;
    margin: 16px 0 8px;
    font-weight: 400;
    color: #333;
    border-bottom: 0;
    padding-bottom: 0;
}

.page-section:focus {
    outline: none;
}

.page-section:focus-visible {
    outline: 2px solid #005fcc;
    outline-offset: 2px;
    border-radius: 2px;
}

.block:focus {
    outline: none;
}

.block:focus-visible {
    outline: 2px solid #005fcc;
    outline-offset: 2px;
    border-radius: 3px;
}

.tag-count {
    font-size: 14px;
    color: #222222;
}

.block {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 14px;
    border-radius: 3px;
    border: 1px solid transparent;
    margin: 10px 0;
    background: #FFF;
    transition: border-width 0.15s ease;
    position: relative;
    padding-right: 40px;
    scroll-margin-top: 76px;
}

.block:hover {
    border-width: 2px;
}

.h1 {
    border: 1px solid #FB730A;
}

.h2 {
    border: 1px solid #FB730A;
}

.h3 {
    border: 1px solid #FB730A;
}

.paragraph {
    border: 1px solid #0097A6;
}

.link {
    border: 1px solid #BF417C;
}

.image {
    border: 1px solid #997200;
}

.table {
    border: 1px solid #5C3177;
}

.list {
    border: 1px solid #1E5AC2;
}

.video {
    border: 1px solid #6FA13D;
}

.block.active-tag {
    outline: 2px solid #00AAEF;
    outline-offset: 2px;
}

.badge {
    display: inline-flex;
    align-items: center;
    color: #0A0A0A;
    gap: 12px;
    font-size: 15px;
    font-weight: 400;
    padding: 5px 8px;
    border-radius: 2px;
    width: fit-content;
}

.badge-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    margin-top: -2px;
}

.review-container .content {
    font-size: 14px;
    line-height: 18px;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.h1 .content {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #2C2C2C;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.h2 .content {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #2C2C2C;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* H3 */
.h3 .content {
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    color: #2C2C2C;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---------- PARAGRAPH ---------- */

.paragraph .content {
    font-size: 14px;
    line-height: 18px;
    color: #4A4A4A;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ---------- LINK ---------- */

.link .content {
    font-size: 14px;
    line-height: 18px;
    color: #2C2C2C;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

/* ---------- BADGE COLORS ---------- */

.h1 .badge {
    background-color: #FFDFC2;
    border: 2px solid #FB730A;
}

.h2 .badge {
    background-color: #FFDFC2;
    border: 2px solid #FB730A;
}

.h3 .badge {
    background-color: #FFDFC2;
    border: 2px solid #FB730A;
}

.paragraph .badge {
    background-color: #CCF8FA;
    border: 2px solid #0097A6;
}

.image .badge {
    background-color: #FFF2CC;
    border: 2px solid #997200;
}

.link .badge {
    background-color: #FDE0EC;
    border: 2px solid #BF417C;
}

.table .badge {
    background-color: #EFE5F5;
    border: 2px solid #5C3177;
}

.list .badge {
    background-color: #C0DBFB;
    border: 2px solid #1E5AC2;
}

.video .badge {
    background-color: #DFF5C4;
    border: 2px solid #6FA13D;
}

.approve-bar {
    position: sticky;
    bottom: 0;
    background: #F7F7F7;
    border-top: 1px solid #E0E0E0;
    margin-left: -20px;
    width: 395px;
}

/* Space between buttons */
.approve-inner {
    display: flex;
    justify-content: space-between;
    padding: 16px 20px;
}

.cancel-btn {
    padding: 8px 20px;
    border-radius: 4px;
    border: none;
    background: #FFF;
    color: #222;
    font-size: 14px;
    font-weight: 400;
}

.approve-btn {
    padding: 8px 24px;
    border-radius: 4px;
    border: none;
    background: #222;
    color: #FFF !important;
    font-size: 14px;
    font-weight: 400;
    height:38px;
}

.approve-btn .approve-icon{
    margin-right: 5px;
    margin-top: -3px;
}

.scrolling-percentage {
    display: inline-flex;
    align-items: center;
    color: #0A0A0A;
    gap: 12px;
    font-size: 15px;
    margin-left: 10px;
    font-weight: 400;
    padding: 5px 8px;
    border-radius: 2px;
    width: fit-content;
}

.tick-mark-icon {
    width: 16px;
    height: 16px;
}

.badge-icon-row {
  display: flex;
  align-items: center;
  gap: 6px;
}

.ally-if-docs-illustration {
  margin: 0;
} 

.back-left-arrow-icon {
    margin-right: 10px;
}

.menu-container {
  position: absolute;
  top: 8px;
  right: 8px;
  line-height: 0;
}

.menu-trigger {
  background: transparent;
  border: none;
  font-size: 18px;
  cursor: pointer;
  padding: 4px;           
  outline: none;
  line-height: 1;
}

.menu-dropdown {
  position: absolute;
  top: calc(100% - 4px);   
  right: 0;
  z-index: 1000;
  margin: 0;
}

.menu-dropdown ally-button,
.menu-dropdown ally-button button {
  display: block;
  white-space: nowrap;
  margin: 0;
}

.menu-dropdown ally-button {
  display: block;
}

.menu-dropdown ally-button button {
  display: flex;            
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  box-sizing: border-box;
  width: 160px;
  height: 38px;
  line-height: 1;
  justify-content: flex-start;
}


print-instructions {
    display: block;
    margin: 30px 0;
}

print-instructions a {
    margin: 0 5px;
}

print-instructions svg-icon svg {
    margin: 0 1px 0 2px;
    vertical-align: middle;
}


warning .ally-if-warning {
    align-items: center;
    display: flex;
    margin: 30px 0;
}

.ally-if-warning svg {
    width: 22px;
}

.ally-if-warning .ally-if-warning-text {
    border-left: 5px solid #222;
    margin: 0 0 0 15px;
    padding: 2px 0 2px 15px;
}

[dir="rtl"] .ally-if-warning .ally-if-warning-text {
    border-left: 0;
    border-right: 5px solid #222;
    margin: 0 15px 0 0;
    padding: 2px 15px 2px 0;
}

.ally-if-warning .ally-if-warning-text :first-child {
    margin-top: 0;
}

.ally-if-warning .ally-if-warning-text :last-child {
    margin-bottom: 0;
}

.ally-if-warning .ally-if-warning-text .code-example {
    margin-top: 10px;
    margin-bottom: 10px;
}