﻿cms-contact-profile, .cms-contact-profile {
    display: block;
    padding: @base-unit;

    .header-actions-container {
        padding-top: 0;
        padding-left: 0;
        padding-right: 0;
    }

    .tag-group {
        margin-bottom: @margin-50;
        height: 1.5 * @base-unit;
    }

    h4 {
        margin-bottom: @margin-50;
    }

    h4.anchor {
        margin-top: 0;
        margin-bottom: @margin-base;

        & + div {
            margin-left: @margin-base;
        }
    }

    .row {
        margin: 0;

        & > * {
            padding: 0;
        }
    }

    .component {
        display: block;
        margin-right: @margin-base;
        margin-bottom: 2 * @margin-base;
    }

    ul, ol {
        padding-left: 0;
        list-style-position: inside;
    }

    .head-section {
        .row {
            padding-left: @base-unit;
            
            & > * {
                display: block;
                margin: 0 0 @margin-150 @margin-base;
                padding: 0;
            }

            > :first-child {
                margin-left: -@margin-base;
            }

            @media (max-width: @screen-sm-max) {
                & > * {
                    margin-left: -@margin-base;
                }
            }
        }
    }

    cms-card {
        .component;

        ul {
            list-style: none;
        }  

        .contact-name {
            color: #0f6194;
            font-weight: bold;
        }
    }  

    .cms-details, .cms-journey {
         word-wrap: break-word;

        .field-name {
            color: @color-blue-70;
            .text-semibold();
        }

        ul.field-list > li {
            list-style-type: none;
            margin: @margin-50;
            margin-left: 0;
            padding-left: 0;
        }

        ul.field-account li {
            margin-left: @margin-base;
            list-style-type: disc;
        }

        dl.dl-horizontal {
            margin-top: 0;

            dt {
                color: @color-blue-70;
                font-weight: 500;
                width: auto;
            }

            dd {
                margin-bottom: 0.25 * @margin-base;
            }
        }
    }

    .cms-journey strong {
        color: @color-black;
    }

    cms-persona {
        @persona-image-width: 6 * @base-unit;

        img {
            float: left;
            width: @persona-image-width;
        }

        p {
            margin-bottom: 0;
        }

        .body {
            display: inline-block;
        }

        .content {
            margin-left: @persona-image-width + @margin-base;
        }
    }

    cms-scorings {
        &.component, dl, span {
            margin-bottom: @margin-base;
        }

        span {
            display: inline-block;
        }

        dl {
            margin-top: 0;

            dt {
                font-size: @font-size-large;
                margin-bottom: @margin-50;
            }

            dd {
                text-overflow: ellipsis;
                white-space: nowrap;
                overflow: hidden;
                margin: 0 @margin-base 0 0;
            }
        }
    }

    cms-submitted-forms {
        .site-name-column {
            width: 66%; // 4/6 of 100%
        }

        .submission-date-column {
            width: 16%; // 1/6 of 100%
        }
    }

    cms-contact-notes {
        strong {
            color: @color-gray-50;
        }

        ul, ol {
            padding-left: 2 * @base-unit; // initial value for ul and ol
        }
    }
}
