.request-list {
    @extend .card-accordion;

    &-item {
        @extend .card;

        // Header Section
        // --------------
        &-header {
            @extend .card-header, .card-header-link;

            &-row {
                display: block;
                & + & {
                    margin-top: .4em;
                }
            }

            &-method,
            &-uri,
            &-type,
            &-timestamp,
            &-size,
            &-ip {
                display: inline-block;
                .icon {
                    margin: 0 .2em;
                }
            }

            &-type,
            &-timestamp,
            &-size,
            &-ip {
                color: $request-item-secondary-color;
                font-size: $font-size-small;
            }

            &-method {
                font-weight: bold;
            }

            &-type,
            &-size {
                width: 30%;
            }

            &-ip,
            &-timestamp {
                float: right;
            }
        }

        // Detail section
        // --------------
        &-detail {
            @extend .card-body;
            background-color: $request-detail-background;

            &-headers {
                @extend .table, .table-bordered;
                background: white;

                &-key {
                    width: 30%;
                }
            }

            &-body {
                margin-bottom: 1em;
            }

            &-button {
                @extend .button, .button-brand;
                display: block;
                margin-bottom: 1em;
            }
        }
    }
}