/*!
 * Waltz - Enterprise Architecture
 * Copyright (C) 2016, 2017, 2018, 2019 Waltz open source project
 * See README.md for more information
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific
 *
 */

@import "breadcrumbs";
@import "bootstrap-styles";
@import "grid";
@import "util";
@import "waltz-draft";
@import "waltz-field-table";
@import "waltz-icons";
@import "waltz-inactive";
@import "waltz-popover-width";
@import "waltz-scroll-region";
@import "waltz-tabs";
@import "waltz-text-muted";
@import "waltz-tree";
@import "waltz-visibility";

@import "client/allocation/components/entity-sub-section/allocation-entity-sub-section";
@import "client/applications/components/bulk-application-selector/bulk-application-selector";
@import "client/assessments/index";
@import "client/attestation/attestation";
@import "client/attestation/components/confirmation/attestation-confirmation";
@import "client/flow-classification-rule/components/discouraged-sources-panel/discouraged-sources-panel";
@import "client/flow-classification-rule/components/table/flow-classification-rules-table";
@import "client/change-initiative/directives/change-initiative-selector";
@import "client/change-unit/components/data-type-change-panel/data-type-change-panel";
@import "client/common/common";
@import "client/complexity/components/graph/complexity-graph";
@import "client/cost/components/graph/entity-costs-graph";
@import "client/data-types/components/usage-count-tree/data-type-usage-count-tree";
@import "client/data-types/components/usage-panel/data-type-usage-panel";
@import "client/data-type-usage/components/editor/app-data-type-usage-editor";
@import "client/data-type-usage/directives/app-data-type-usage-list";
@import "client/dynamic-section/components/dynamic-section/dynamic-section";
@import "client/dynamic-section/components/dynamic-sections-view/waltz-dynamic-sections-view";
@import "client/entity-named-note/components/panel/entity-named-notes-panel";
@import "client/entity/components/entity-selector/entity-selector";
@import "client/entity-statistics/directives/entity-statistic";
@import "client/entity-statistics/components/entity-statistic-summary-card";
@import "client/entity-statistics/components/history-chart/entity-statistic-history-chart";
@import "client/entity-svg-diagram/components/viewer/entity-svg-diagram-viewer";
@import "client/report-grid/components/grid-view-section/report-grid-view-section";
@import "client/legal-entity/components/bulk-legal-entity-selector/bulk-legal-entity-selector";
@import "client/logical-flow/components/boingy-graph/boingy-graph";
@import "client/logical-flow/components/logical-flows-tabgroup/logical-flows-tabgroup";
@import "client/logical-flow/components/source-and-target-graph/source-and-target-graph";
@import "client/logical-flow/components/source-and-target-panel/source-and-target-panel";
@import "client/logical-flow/components/flow-filter-options/flow-filter-options";
@import "client/measurable/components/info/measurable-info";
@import "client/measurable/components/tree/measurable-tree";
@import "client/measurable-relationship/components/panel/related-measurables-panel";
@import "client/measurable-relationship/components/viz/related-measurables-viz";
@import "client/measurable-rating/components/tree/measurable-rating-tree";
@import "client/measurable-rating/components/browser-tree-panel/measurable-ratings-browser-tree-panel";
@import "client/navbar/navigation";
@import "client/notification/components/notification-panel/outstanding-actions-notification-panel";
@import "client/org-units/pages/home-view/home-view";
@import "client/playpen/playpen";
@import "client/playpen/5/playpen5";
@import "client/playpen/4/playpen4";
@import "client/physical-flows/components/overview/physical-flow-overview";
@import "client/physical-flows/components/overview/physical-flow-overview-node";
@import "client/physical-flows/components/register/overview/physical-flow-edit-overview";
@import "client/physical-flows/components/register/attribute-editor/physical-flow-attribute-editor";
@import "client/physical-flows/components/register/edit-target-logical-flow/physical-flow-edit-target-logical-flow";
@import "client/physical-flows/components/register/edit-specification/physical-flow-edit-specification";
@import "client/ratings/components/rag-line/rag-line";
@import "client/ratings/components/rating-picker/rating-picker";
@import "client/ratings/components/rating-indicator-cell/rating-indicator-cell";
@import "client/roadmap/components/roadmap-scenario-diagram/roadmap-scenario-diagam";
@import "client/scenario/components/scenario-diagram/scenario-diagram";
@import "client/static-panel/components/static-panel";
@import "client/software-catalog/directives/simple-software-usage-list";
@import "client/survey/survey";
@import "client/widgets/styles";


html {
    overflow-y: scroll;
}


.input-group-btn .btn {
    // this fixes an annoying off-by-1 alignment issue with
    // the calendar control button
    padding-top: 5px;
}


@font-face {
    font-family: "Hind";
    font-weight: normal;
    src: url('./fonts/Hind-Regular.ttf') format('truetype');
}


@font-face {
    font-family: "Hind";
    font-weight: bold;
    src: url('./fonts/Hind-Medium.ttf') format('truetype');
}


.waltz-body {
    color: $waltz-font-color;
    padding-top: 70px;
    background: $waltz-background-color;
    font-family: 'Hind', sans-serif;
    -webkit-box-shadow: 0 150px 46px 16px $waltz-background-color;
    -moz-box-shadow: 0 150px 46px 16px $waltz-background-color;
    box-shadow: 0 150px 46px 16px $waltz-background-color;
}


textarea {
    padding: 10px;
}


.padding-0 {
    padding: 0 !important;
}


.padding-sm {
    padding: 2px !important;
}


.padding-md {
    padding: 5px !important;
}


.clickable:hover {
    cursor: pointer;
}


.no-text-select {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
}


.show-grid {
    border: 1px solid red;
}


.show-grid div {
    border: 1px solid green;
}


.no-overflow {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: break-word;
}


.force-wrap {
    /* These are technically the same, but use both */
    overflow-wrap: break-word;
    word-wrap: break-word;

    -ms-word-break: break-all;
    /* This is the dangerous one in WebKit, as it breaks things wherever */
    word-break: break-all;
    /* Instead use this non-standard one: */
    word-break: break-word;

    /* Adds a hyphen where the word breaks, if supported (No Blink) */
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}


.fixed-table {
    table-layout: fixed;
    word-wrap: break-word;
}


.vertical-align {
    display: flex;
    align-items: center;
}


.waltz-overlay-trigger:hover {
    cursor: pointer;
}


.waltz-overlay-trigger {
    border-bottom: 1px dotted #0f0746;
}


.waltz-display-field-label {
    color: #705f53;
    overflow: hidden;
    padding-bottom: 0.2em;
}

.waltz-display-field-value {
    overflow-wrap: anywhere;
}


.waltz-display-section {
    .row {
        padding-top: 4px;
    }
}


.waltz-clickable-definition {
    border-bottom: 1px dotted #ccc;
}


.waltz-clickable-definition:hover {
    cursor: pointer;
}


.waltz-section-actions {
    margin-top: -42px;
    float: right;
    padding: 0 2px 2px 0;

    .wsa-action {
        margin-left: 3px;
        margin-right: 3px;
    }
}


.waltz-tally-count {
    border-radius: 6px;
    border: 1px solid #ccc;
    font-size: x-small;
    margin: auto;
    padding: 0 3px;
}


.waltz-app-tally-count {
    @extend .waltz-tally-count;
    background: #e2ecfb;
    color: #144d66;
    border-color: #88c1cc;
}


.waltz-end-user-app-tally-count {
    @extend .waltz-tally-count;
    background: #e5fbda;
    color: #1b6b0a;
    border-color: #b8ec67;
}

.waltz-content {
    margin-top: 25px;
    margin-bottom: 40px;
}


.waltz-page-summary {
    background: #fff;
    border: 1px solid $waltz-border-color-lighter;
    padding: 1em;
    border-radius: 3px;
    margin-left: $waltz-section-margin;
    margin-right: $waltz-section-margin;
    @include waltz-box-shadow();
}


.waltz-page-summary-attach {
    margin-top: -14px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}


.waltz-side-nav-help {
    @extend small !optional;
    color: $text-muted;
    white-space: normal !important;
}


.waltz-detail-callout {
    background-color: lighten($waltz-background-color, 0.5);
    padding: 0 6px 4px;
    border-radius: 3px;
    border: 1px solid $waltz-border-color-lighter;
    @include waltz-box-shadow();

    .dismiss:hover {
        color: mediumblue;
    }
}


.waltz-hr-dotted {
    border: 0;
    border-bottom: 1px dotted $waltz-border-color;
}


.waltz-paragraph {
    margin-top: 4px;
    margin-bottom: 4px;
}

.waltz-inactive {
    text-decoration: line-through;
}

.italics {
    font-style: italic;
}

a.subtle-link {
    color: $waltz-font-color;
    text-decoration: none;
}


a.subtle-link:hover {
    color: $waltz-link-color;
}


.waltz-action-link {
    @extend .clickable !optional;
    border-bottom: 1px blue dashed;
}


.waltz-btn-transparent {
    @extend .btn-default !optional;
    background-color: transparent;
}

.waltz-error {
    @extend small !optional;
    padding: 2px 4px;
    color: #c7254e;
    background-color: #f4edef;
    border-radius: 2px;
    font-style: italic;
}

.waltz-highlighted-row {
    background-color: $waltz-selected-item-bg-color;

    &:hover {
        background-color: darken($waltz-selected-item-bg-color, 2) !important;
    }
}


.waltz-panel-content {
    padding-top: 0.8em;
}


.waltz-popover-wide {
    max-width: 500px;
}


.waltz-mini-table {
    td,th {
        padding-left: 0.3em;
        padding-right: 0.3em;
    }
    thead {
        border-bottom: 1px solid $waltz-border-color-lighter;
    }
}

.waltz-rotate-45 {
    height: 7em;
    white-space: nowrap;

    div {
        transform:
            /* Magic Numbers */
            translate(25px, 0px)
            /* 45 is really 360 - 45 */
            rotate(315deg);
        width: 10px;

        :first-of-type(span) {
            padding: 5px;
        }
    }
}

a[disabled="disabled"] {
    color: #888;
    &:hover {
        cursor: default;
    }
}

.waltz-no-margins {
    padding: 0;
    margin: 0;
}

.waltz-entity-removed {
    font-style: italic;
    color: #AAA;
    text-decoration: line-through rgba(125, 125, 125, 0.3);
}

.waltz-sticky-part {
    position: -webkit-sticky;
    position: sticky;
    top: 100px;
}

.waltz-sticky-wrapper {
    display: flex;
    justify-content: space-between;
}

details {
    background: #f5f5f5;
    border: 1px solid #eee;
    margin-bottom: 1rem;
    padding: .5rem 1rem;
    border-radius: 5px;
}

details summary {
    cursor: pointer;
    display: list-item;
}


.waltz-search-input {
    width: 100%;
}