#add-project-dialog {
    .templates, .template {
        box-sizing: border-box;
    }

    .templates {
        padding: 1px;
        margin: 0;
        display: flex;
        flex-wrap: wrap;
        /* for when it gets tab focus. Uncomment to not show a border, but we should show SOMETHING. */
        /*outline: none; */

        &:focus {
            outline: none;
        }
    }

    .template {
        vertical-align: top;
        margin: 0;
        padding: 10px;
        border: 1px solid var(--ds-background-neutral-subtle, white);
        border-radius: 3px;
        cursor: pointer;
        height: 80px;
        flex: 0 0 50%;
        /* CONFDEV-14285 fix text selection on double-click by preventing text selection in the first place */
        user-select: none;

        &:focus-within {
            outline: none;
            box-shadow: 0 0 0 2px var(--aui-focus);
        }

        &.selected {
            background-color: var(--ds-background-neutral, #E6EFF8);
            border-radius: 3px;
        }
    }

    .dialog-title {
        box-shadow: none;
    }

    .dialog-panel-body {
        overflow-x: hidden;
    }

    .template-meta {
        padding-left: 60px; /* 48px icon + 1px left border + 1px right border + 10px padding */
    }

    .template-preview {
        float: left;
        width: 48px;
        height: 48px;
        vertical-align: text-bottom;
    }

    .template-name {
        font-weight: bold;
        margin-top: 0;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }

    .dialog-panel-body.pt-content .wait-container {
        text-align: center;
        height: 16px;
        line-height: 16px;
        width: 100%;
        position: absolute;
        top: 50%;
        margin-top: -8px;
        display: block;
        font-size: 14px; /* to enable correct vertical centering */
        margin-left: 4px;

        & > .wait-icon {
            vertical-align: text-bottom;
            margin-right: 3px;
        }
    }

    .pt-submit-button {
        margin-right: 10px;
    }

    .help-lnk {
        margin-left: 10px;
    }

    .add-workflow-link {
        font-size: 14px;
    }

    .footer-links {
        float: left;
    }

    .pt-content {
        background: no-repeat 95% 100%;
    }

    .add-project-wrapper {
        display: table;
    }

    .help-lnk {
        background: none;
        border: 0;
    }

    .add-project-form-wrapper {
        width: 460px;
        padding-right: 60px;

        #add-project-form, fieldset, .field-group {
            position: unset;
        }
    }

    .add-project-description-wrapper {
        display: table-cell;
        margin-left: 5px;
        vertical-align: top;
    }

    .add-project-description-wrapper h3 {
        color: var(--ds-text-brand, #3B73AF);
    }

    .template-description {
        height: 40px;
    }

    .add-project-back-button {
        margin-left: 10px;
    }

    .template-group-header {
        margin-bottom: 5px;

        .project-type-icon {
            width: 18px;
            height: 18px;
            vertical-align: top;
            margin-right: 5px;
        }
    }

    .template-group {
        padding-bottom: 0;
        margin-bottom: 8px;
    }

    /* override default padding */
    &.aui-dialog .dialog-button-panel .footer-links .button-panel-link {
        padding-left: 10px;
    }

    .offscreen-left {
        left: -9999px;
        position: absolute;
    }

    .create-shared-info {
        display: none;
        color: var(--ds-text, #999);
    }

    .field-group.project-picker-group {
        padding-top: 2em;
        padding-bottom: 2em;
    }

    .aui-icon-help {
        cursor: pointer;
    }

    #create-shared-project-form p {
        margin-top: 0;
    }
}

.aui-icon.aui-icon-create-shared {
    background-image: url('/s/uajp63/11030007/1owio8b/111.3.20/_/download/resources/com.atlassian.jira.project-templates-plugin:project-templates-plugin-resources/images/icons/createshared.svg');
}

#inline-dialog-shared-project-help-popup {
    z-index: 3500; /* Make sure the popup shows up in front of a dialog */

    .shared-help {
        padding: 10px;

        ul {
            margin-top: 6px;
        }
    }
}

.project-key-help-popup-heading-title {
    font-size: 14px;
    font-weight: 700;
    line-height: 14px;
}