/* ---------------------------------------------------------------------------------------
CARDS - core
--------------------------------------------------------------------------------------- */
.m-card-image img {
    width: 100%;
}


/* ---------------------------------------------------------------------------------------
Slick
--------------------------------------------------------------------------------------- */
.slick-below {
    background-position: 50%;
    background-repeat: no-repeat;
    background-image: url(../images/uk/icons/below.png);
    border: none;
    cursor: pointer;
    display: inline-block;
    font-size: 0;
    height: 57px;
    line-height: 0;
    opacity: 1;
    outline: none;
    padding: 0;
    width: 57px;
    z-index: 9999;
    margin-bottom: 13px;
}


/* ---------------------------------------------------------------------------------------
Validation errors
--------------------------------------------------------------------------------------- */
.validation-summary-errors {
    word-break: break-word;
}

.field-validation-error {
    color: #bd2624;
    display: block;
    font-weight: bold;
    margin-bottom: .625em;
    margin-left: 2.1875em;
    margin-right: 0;
    margin-top: 0;
}

    .field-validation-error:before {
        background-image: url(https://static.aviva.io/static/core/v.3.0.0/images/icons/forms/error.png);
        content: '';
        display: block;
        font-size: 16px;
        height: 25px;
        left: 0;
        position: absolute;
        width: 25px;
    }

.input-validation-error {
    border-color: #bd2624;
}


/* ---------------------------------------------------------------------------------------
Dropdown
--------------------------------------------------------------------------------------- */
.a-dropdown-group__item {
    display: inline-block;
    margin-right: 0.625em;
    text-align: center;
}

    .a-dropdown-group__item:last-child {
        margin-right: 0;
    }

    .a-dropdown-group__item > a-label {
        font-size: 1.2em;
    }

@media (max-width: 35em) {
    .a-dropdown-group__item {
        margin-right: 0.313em;
    }
}


/* ---------------------------------------------------------------------------------------
SEGMENTED CONTROL IE, MOBILE SAFARI FIX
--------------------------------------------------------------------------------------- */
.js .m-radio-group--pictorial .a-radio__input:checked ~ .a-radio__label:after {
    border: none;
    background-color: transparent;
}


/* ---------------------------------------------------------------------------------------
Js-On "Attachment upload" section
--------------------------------------------------------------------------------------- */
.fileupload-buttons {
    padding: 1.4em 0;
}

.fileinput-button {
    display: inline-block;
    overflow: hidden;
    position: relative;
}

    .fileinput-button input {
        cursor: pointer;
        filter: alpha(opacity=0);
        height: 100%;
        opacity: 0;
        position: absolute;
        right: 0;
        top: 0;
    }

.fileinput-button-spinner {
    display: none;
}

.auto-upload:focus + .a-button {
    background: #004fb6;
    border-color: #004fb6;
    color: #fff;
}

.uploaded-docs-presentation {
    display: flex;
    flex-wrap: wrap;
}

    .uploaded-docs-presentation p {
        border: 1px solid #d5d5d5;
        display: flex;
        flex-direction: column;
        margin: 1em 2em 1em 0;
        overflow: hidden;
        padding: 0.375em;
        position: relative;
        text-align: center;
        vertical-align: top;
        width: 9.96em;
    }

        .uploaded-docs-presentation p:hover {
            border-color: #004fb6;
            outline: 1px solid #004fb6;
        }

    .uploaded-docs-presentation .thumbWrap {
        height: 125px;
    }

        .uploaded-docs-presentation .thumbWrap.success:after {
            background-image: url(../images/icons/circle/tick.png);
            background-repeat: no-repeat;
            background-position: center;
            content: '';
            height: 1.56em;
            position: absolute;
            right: 0;
            top: 0;
            width: 1.56em;
            z-index: 1;
        }

.svg .uploaded-docs-presentation .thumbWrap.success:after {
    background-image: url(../images/icons/circle/tick.svg);
}

.uploaded-docs-presentation canvas,
.uploaded-docs-presentation img {
    display: block;
    margin: 0 auto;
}

.uploaded-docs-presentation img {
    max-width: 8.06em;
    max-height: 7.81em;
}

.uploaded-file-name {
    display: block;
    font-size: 0.8em;
    margin-bottom: 0.2em;
    margin-top: 6px;
    min-height: 2.8em;
    text-align: center;
    width: 100%;
    word-break: break-all;
}

.uploaded-docs-presentation a {
    border-bottom: none;
    display: inline-block;
    margin-top: 0.5em;
    text-decoration: none;
    text-align: center;
}

.uploaded-docs-presentation .progress-bar {
    background-color: green;
    display: block;
    height: 19px;
    -webkit-transition: width .8s;
    -moz-transition: width .8s;
    transition: width .8s;
    width: 0px;
}

.uploaded-docs-presentation .progress-text {
    display: block;
    font-size: 0.6em;
    margin-bottom: 0.5em;
    text-align: center;
    width: 100%;
}

.uploaded-docs-presentation .thumbWrap.upload-in-progress img,
.uploaded-docs-presentation .thumbWrap.upload-in-progress canvas {
    opacity: 0.4;
    filter: alpha(opacity=40);
}

@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and ( min--moz-device-pixel-ratio:2), only screen and ( -o-min-device-pixel-ratio:2/1), only screen and ( min-device-pixel-ratio:2), only screen and ( min-resolution:192dpi), only screen and ( min-resolution:2dppx) {
    .uploaded-docs-presentation .thumbWrap.success:after {
        background-image: url(../images/icons/circle/tick@2x.png);
    }
}


/* ---------------------------------------------------------------------------------------
Refresh modal override
--------------------------------------------------------------------------------------- */
.o-modal .a-timeout-counter.is-hidden {
    opacity: 0;
}

.o-modal .m-button-group__item {
    margin-bottom: 0;
}

.session-modal-opened .o-modal__cancel {
    display: none;
}


/* ---------------------------------------------------------------------------------------
Guidewire error custom modal and custom loading indicator
--------------------------------------------------------------------------------------- */
.o-modal-overlay--custom .a-loading-indicator--custom {
    margin-top: -5.5em;
    top: 50%;
}

.o-modal--custom {
    background-color: #fff;
    max-width: 35em;
    padding: 1.875em;
}

.o-modal-active .o-modal-overlay--custom {
    opacity: 1;
}

.o-modal-overlay--custom {
    background: #333;
    background: rgba(51, 51, 51, .75);
    bottom: 0;
    content: '';
    display: block;
    left: 0;
    opacity: 0;
    position: fixed;
    right: 0;
    top: 0;
    transition: opacity .5s;
    z-index: 5000;
}

.o-modal__wrapper--custom {
    align-items: center;
    display: flex;
    height: 100vh;
    justify-content: center;
}

/* ---------------------------------------------------------------------------------------
Loading Indicator
--------------------------------------------------------------------------------------- */
.a-loading-indicator--small.find-button-spinner {
    margin: 16px 0;
}


/* ---------------------------------------------------------------------------------------
Item Validator
--------------------------------------------------------------------------------------- */
.js-item-presearch__row {
    position: relative;
}

    .js-item-presearch__row .js-item-presearch__spinner {
        position: absolute;
        z-index: 3;
        right: 1.25em;
        top: 50%;
        transform: translateY(-50%);
    }

/* ---------------------------------------------------------------------------------------
Fieldset Legend override
--------------------------------------------------------------------------------------- */
.fieldset-legend--show {
    left: auto;
    position: static;
}

/* ---------------------------------------------------------------------------------------
Utility classes
--------------------------------------------------------------------------------------- */
.u-distant-sentence {
    margin-top: 3.75em;
}

.u-nowrap {
    white-space: nowrap;
}

.u-display--none {
    display: none;
}

.u-margin--top {
    margin-top: 1.25em;
}

.u-margin--bottom {
    margin-bottom: 1.25em;
}

.u-margin--bottom--small {
    margin-bottom: 1.25em;
}

.u-nopadding--top {
    padding-top: 0;
}

.u-relative {
    position: relative;
}

.uppercase-holder .uppercase-input,
.u-text--uppercase {
    text-transform: uppercase;
}

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

@media (min-width: 35em) {
    .u-margin--bottom--small {
        margin-bottom: 0;
    }
}

@media (min-width: 60em) {
    .u-align-left {
        margin-left: 0;
    }
}

@media (max-width: 35em) {
    .u-display-block--small {
        display: block;
    }
}

/****************
* FIX FOR PICTORIAL SEGMENTED CONTROLS IN IE11
* REMOVE AFTER UPGRADE TO FW v4.12.0
****************/
.m-radio-group--segmented.m-radio-group--pictorial .a-radio__input ~ .a-radio__label .a-radio__label-image img {
    pointer-events: none;
}
/****************
* END FIX
****************/

/* framework fix - where text area with character count is hidden by default 
*  Present in v.4.16.3 and earlier
*/
.m-textarea-max-characters__countdown {
    pointer-events: none;
}

/*
    IE / Edge - Hyphen fix
*/

.a-radio__label-inner {
    -ms-hyphens: none;
}


/* ---------------------------------------------------------------------------------------
File Uploader 2020
--------------------------------------------------------------------------------------- */

#u-file-uploader--presentation {
    display: flex;
    flex-wrap: wrap;
}

.u-file-uploader--image-preview {
    border: 1px solid #d5d5d5;
    display: flex;
    flex-direction: column;
    margin: 1em 2em 1em 0;
    overflow: hidden;
    padding: 0.375em;
    position: relative;
    text-align: center;
    vertical-align: top;
    width: 9.96em;
}


#u-file-uploader--input {
    cursor: pointer;
    filter: alpha(opacity=0);
    height: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
}

.u-file-uploader--image-preview:hover {
    border-color: #004fb6;
    outline: 1px solid #004fb6;
}

.u-file-uploader--image-preview {
    position: relative;
}

    .u-file-uploader--image-preview.success:after {
        background-image: url(../images/icons/circle/tick.svg);
    }

    .u-file-uploader--image-preview.success:after {
        background-image: url(../images/icons/circle/tick.png);
        background-repeat: no-repeat;
        background-position: center;
        content: '';
        height: 1.56em;
        position: absolute;
        right: 0;
        top: 0;
        width: 1.56em;
        z-index: 1;
    }

    .u-file-uploader--image-preview progress {
        background-color: green;
        display: block;
        height: 19px;
        margin: 10px 0;
        width: 100%;
    }

        .u-file-uploader--image-preview progress[value]::-webkit-progress-bar {
            background-color: white;
        }

        .u-file-uploader--image-preview progress[value]::-moz-progress-bar {
            background-color: white;
        }

.u-file-uploader--image-preview-file-wrapper img {
    max-height: 125px;
}

.u-file-uploader--image-preview-file-wrapper {
    height: 125px;
}

.u-file-uploader--file-name {
    display: block;
    font-size: 0.8em;
    margin-bottom: 0.2em;
    margin-top: 6px;
    min-height: 2.8em;
    text-align: center;
    width: 100%;
    word-break: break-all;
}

.u-file-uploader--image-preview progress.u-file-uploader--remove,
.u-file-uploader--image-preview .u-file-uploader--percentage-text.u-file-uploader--remove {
    height: 0;
    opacity: 0;
    transition: 0.2s ease-in-out;
}

.o-masthead-support__link--your-policy {
    background-image: url('../images/icons/edit.svg');
}

.o-masthead-logged-in__last-time-info {
    background-image: url('../images/icons/icon-info.svg');
}

.o-masthead-logged-in__content li.a-buttonicon--information {
    padding-left: 1.5em;
    color: rgba(255,255,255, .66);
    background: url("../images/icons/info-icon-mobile.png") center left no-repeat;
}

.svg .o-masthead-logged-in__content li.a-buttonicon--information {
    background: url("../images/icons/info-icon-mobile.svg") center left no-repeat;
}

@media only screen and (min-width:35em) {
    .o-masthead-logged-in__content li.a-buttonicon--information {
        padding-left: 1.5em;
        color: #444;
        background: url("../images/icons/info-icon-tablet.png") center left no-repeat;
    }

    .svg .o-masthead-logged-in__content li.a-buttonicon--information {
        background: url("../images/icons/info-icon-tablet.svg") center left no-repeat;
    }
}
/*  ==========================================================================

	Cards

	========================================================================== */

.notification-wrapper {
    margin-top: 40px;
}

.u-claims-reference {
    padding-top: 2em;
    padding-bottom: 2em;
    padding-left: 1.5em;
    padding-right: 1.5em;
    display: inline-block;
}

.u-claims-reference--aviva-UKD {
    background-color: #215292;
}

    .u-claims-reference--aviva-UKD h3 {
        color: #fff;
    }

        .u-claims-reference--aviva-UKD h3::selection {
            background: #fff;
            color: #215292;
        }

@media (max-width: 35em) {
    .notification-wrapper {
        margin-top: 30px;
    }
}

@media (max-width: 65em) {
    .notification-wrapper {
        max-width: none;
    }
}


/*  ==========================================================================

	Typography

	========================================================================== */

@media (max-width: 35em) {
    .hero--text-fix {
        text-align: left;
    }
}


/*  ==========================================================================

	Margins

	========================================================================== */

.card-section__header {
    margin-bottom: 40px;
}

@media (min-width: 60em) {
    .m-hero-message__text.hero--text-fix {
        padding-right: 50%;
    }
}

@media (min-width: 35em) {
    .heading--margin-fix {
        margin-top: 80px;
    }

    .section__subheader {
        margin-top: 1.43em;
    }

    .margin-bottom--fix {
        margin-bottom: 40px;
    }

    .hero--margin-fix {
        margin-bottom: 80px;
    }
}

@media (max-width: 35em) {
    .m-hero-message--padding {
        padding: 60px 21px 75px 19px;
    }

    .section__subheader {
        margin-top: 1.25em;
    }

    .hero--text-fix {
        padding-right: 20px;
    }

    .heading--margin-fix {
        margin-top: 1.25em;
    }

    .card-section__header {
        margin-bottom: 20px;
    }
}

@media (max-width: 60em) {
    .card-section__header {
        margin-bottom: 30px;
    }
}


/*  ==========================================================================

	Form inputs

	========================================================================== */

@media (min-width: 60em) {
    .m-form--md.u-align-left {
        width: 37.5em;
    }
}

@media (min-width: 35em) and (max-width: 59.999em) {
    .m-form--md.u-align-left {
        width: 100%;
    }
}

.regInput .regInput-icon {
    background-image: url('../images/motor/vehicle-reg.png');
    background-repeat: no-repeat;
    background-position: left center;
    border-top-left-radius: .4em;
    border-bottom-left-radius: .4em;
    height: 3.125em;
    left: 0;
    position: absolute;
    width: 1.25em;
    z-index: 3;
}

.regNumber {
    padding-left: 2.25em;
}

.requiredSign {
    display: none;
}


/*  ==========================================================================

	JS-off "Details about what happened" section

	========================================================================== */
.m-radio-group--segmented.m-radio-group--pictorial .a-radio__icon-holder:after {
    height: 3.3em;
}

@media (min-width: 35em) {
    .m-radio-group--segmented.m-radio-group--pictorial .a-radio__icon-holder:after {
        height: 5.5em;
    }
}


/*  ==========================================================================

	"Damagepicker" section

	========================================================================== */

.m-form-row.m-form__damage-severity {
    margin-bottom: 1em;
    margin-top: 0;
    padding-left: 1.25em;
}

@media (max-width: 60em) {
    .m-form-row.m-form__damage-severity {
        margin-bottom: 0;
        padding-left: .625em;
        padding-right: .625em;
        padding-top: 0.5em;
    }
}

/*  ==========================================================================

	Utilities

	========================================================================== */

.u-hidden--always {
    display: none;
}

.u-hidden-block--small {
    display: none;
}

@media (min-width: 35em) {
    .u-hidden-block--small {
        display: block;
    }
}