/* Utility classes used to replace inline `style="..."` attributes so that
   the style-src CSP directive can eventually drop 'unsafe-inline'.
   See .github/skills/csp-unsafe-inline-removal/SKILL.md.

   This file must be linked LAST in the <head> of _Layout.cshtml so these
   rules can override DAERA.min.css, bootstrap, shared.css and kendo-govuk.css
   the same way the inline styles they replace used to. */

.chip-hidden { display: none; }
.chip-display-inline { display: inline; }
.chip-flex-center { display: flex; align-items: center; }

.chip-position-relative { position: relative; }
.chip-position-relative-z1000 { position: relative; z-index: 1000; }

.chip-float-right { float: right; }
.chip-overflow-auto { overflow: auto; }
.chip-italic { font-style: italic; }
.chip-text-right { text-align: right; }

.chip-padding-top-0 { padding-top: 0; }
.chip-padding-5 { padding: 5px; }
.chip-padding-5-15 { padding: 5px 15px; }
.chip-margin-left-8 { margin-left: 8px; }
.chip-margin-left-10 { margin-left: 10px; }
.chip-margin-right-20 { margin-right: 20px; }
.chip-margin-top-20 { margin-top: 20px; }
.chip-margin-top-30 { margin-top: 30px; }
.chip-margin-top-20-padding-left-0 { margin-top: 20px; padding-left: 0; }

.hiddenContent { display: none; }

   also target the wrapper (and with enough specificity to win), matching the
   approach used for Eutorp.OperatorPortal. */
.chip-width-60,
span.k-widget.chip-width-60,
span.k-picker.chip-width-60,
span.k-dropdownlist.chip-width-60 { width: 60%; }

.chip-width-100,
span.k-widget.chip-width-100,
span.k-picker.chip-width-100,
span.k-dropdownlist.chip-width-100,
span.k-numerictextbox.chip-width-100 { width: 100%; }

.chip-width-100.chip-text-right,
span.k-widget.chip-width-100.chip-text-right,
span.k-picker.chip-width-100.chip-text-right,
span.k-dropdownlist.chip-width-100.chip-text-right { width: 100%; text-align: right; }

.chip-width-300,
span.k-widget.chip-width-300,
span.k-picker.chip-width-300,
span.k-dropdownlist.chip-width-300,
span.k-datetimepicker.chip-width-300 { width: 300px; }

/* Page-specific combinations that are only reused by a couple of views but
   are simple enough to keep here rather than in a page stylesheet. */
.chip-pdf-frame { height: 800px; overflow: auto; border: 1px solid #b1b4b6; }

.chip-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 999;
}

/* Home/Index.cshtml page-specific styles, previously an inline <style> block
   in the Styles section of that view. */
.decs-white {
    color: white !important;
}

.app-masthead {
    padding: 20px;
    border-bottom: 1px solid #1d70b8;
    color: #fff;
    background-color: #1d70b8;
    margin-bottom: 10px;
}

.app-masthead__description {
    font-family: "GDS Transport", arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-weight: 400;
    font-size: 1.3125rem;
    line-height: 1.1904761905;
    margin-bottom: 0;
}

.app-masthead__title {
    color: #fff;
    margin-bottom: 20px;
}

.govuk-button--inverse, .govuk-button--inverse:link, .govuk-button--inverse:visited, .govuk-button--inverse:active, .govuk-button--inverse:hover {
    color: #1d70b8;
}

.govuk-button--inverse {
    background-color: #fff;
    box-shadow: 0 2px 0 #144e81;
}

.govuk-button:hover, .govuk-button.\\3ahover {
    background-color: #e8f1f8;
}