@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');


:root {
    --component-icon-clr: rgb(140, 140, 0);
    --entitytype-background-clr: #D3D04F;
    --entity-background-clr: rgb(110, 211, 79);
    --default-border: #0288D1;
    --expansions-border-clr: #0288D1;
    --note-border-clr: #8E24AA;
    --note-background-clr: #6A1B9A;
    --noteimage-background-clr: #8E24AA;
    --noteimage-border-clr: #BA68C8;
    --noteimage-rescontainer-border-clr: #65869a;
    --kunde-border-clr: #8C9EFF;
    --kunde-background-clr: #304FFE;
    --auftrag-border-clr: #FF80AB;
    --auftrag-background-clr: #C51162;
    --rapporte-appstarter-icon-clr: #43A047;
    --kontakt-border-clr: #C0CA33;
    --kontakt-background-clr: rgb(100, 180, 0);
    --adresse-background-clr: rgb(140, 140, 0);
    --mail-background-clr: rgb(140, 140,0);
    --phone-background-clr: rgba(140, 140, 0);
    --pk-appstarter-icon-clr: rgb(180, 8, 19);
    --pk-icon-clr: rgb(141, 41, 3);
    --pk-tree-1-clr: #BB2525;
    --pk-tree-2-clr: #F66B0E;
    --pk-tree-3-clr: #205375;
    --pk-tree-4-clr: #FEC260;
    --pk-tree-5-clr: #A2678A;
    --pk-tree-6-clr: #D3D04F;
    --pk-tree-7-clr: #FF7E67;
    --pk-tree-8-clr: #DCD7C9;
    --docu-appstarter-icon-clr: #F66B0E;
    --explorer-appstarter-icon-clr: #a70f68;
    --rapporte-appstarter-icon-clr: #67a91d;
    --accounts-appstarter-icon-clr: #0b5367;
    --pay-appstarter-icon-clr: #FFB300;
    --pay-border-clr: #d8950b;
    --offerte-appstarter-icon-clr: #239c8a;
    --rechnug-appstarter-icon-clr: #48a50f;
    --padding-075: 0.75rem;
    --padding-087: 0.875rem;
    --padding-100: 1.0rem;
}

.main {
    margin : 0;
    min-width: 300px;
    min-height: 100vh;
    display: grid;
    grid-template-columns:0.5em 1fr 0.7em;
    grid-template-rows:5px 1fr 30px;
    grid-template-areas:
        ". . ."
        ". content ."
        ". . ."
}

.main-content{
    grid-area: content;
}

.main-content-tab-side {
    grid-area: side;
    margin: 6px;
}

.main-content-tab-detail {
    grid-area: detail;
    margin: 6px;
}

.main-content-tab-detail2 {
    grid-area: detail2;
}

.main-content-tab-list{
    grid-area: list;
}

.main-content-tab {
    margin: 0;
    min-height: calc(100dvh - 130px);
    display: grid;
    grid-template-columns: 500px minmax(380px, 500px);
    grid-gap: 10px;

}

.detail-content-flex {
    min-width: 300px;
    display: flex;
    gap: 10px;
    flex-direction: column;
}


@media only screen and (max-width:599px) {
    .main-content-tab {
        grid-template-areas:
            "side"
            "detail"
            "detail"
            "detail"
    }
    .detail-content-grow {
        flex: 0 0 300px;
    }
}

@media only screen and (min-width:600px) {
    .main-content-tab {
        grid-template-columns: 500px minmax(380px, 500px);
        grid-template-areas:
            "side detail"
            "side detail"
            ". detail"
    }
    .detail-content-grow {
        flex: 1 1 auto;
    }
}

@media only screen and (min-width:850px) {
    .main-content-tab {
        grid-template-columns: 500px minmax(380px, 500px) minmax(160px, 1fr);
        flex-flow: column;
        grid-template-areas:
            "side detail detail"
            "side detail detail"
            ". detail detail"
    }
    .detail-content-flex {
        flex-flow: row wrap;
    }
    .detail-content-grow {
        flex: 1 1 0;
    }
}


.flex-shrink-0 {
    flex-shrink:0;
}

.flex-shrink-1 {
    flex-shrink: 1;
}

.flex-grow-1 {
    flex-grow: 1 ;
}

.content-width-xs {
    width: 280px;
}

.content-width-sm {
    width:320px;
}
.content-width-md {
    width: 450px;
}

.padding-block-1{
    padding-block:var(--padding-087);
}
.padding-inline-1{
    padding-inline: var(--padding-087);
}
.note-style{
    border:2px solid var(--note-border-clr);
}

.tab-close{
    height: 10px;
    width: 10px;
}

/* #region EditForms */
.editform{
    min-width:280px;
}
.editform-fields{
    padding-inline:var(--padding-087);
    display:grid;
    grid-gap: 10px;
}
.editform-list-style{
    max-height: 160px;
    opacity: 0.7;
}
/* #endregion */

/* #region Grid */
.grid-1to1{
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.grid-1to2{
    display: grid;
    grid-template-columns: 1fr 2fr;
}
.grid-1to3{
    display: grid;
    grid-template-columns:  1fr 3fr;
}

.grid-2to1{
    display: grid;
    grid-template-columns: 2fr 1fr;
}

.grid-3to1{
    display: grid;
    grid-template-columns: 3fr 1fr;
}

.grid-treeitem{
    display: grid;
    grid-template-columns: 30px 24px 1fr;
}

.grid-treeitem-data{
    display: grid;
    grid-template-columns: 30px 1fr;
}
.grid-rpk{
    display: grid;
    grid-template-columns: 1.5fr 1.5fr 1fr 1fr 2fr;
}

.grid-rzp{
    display: grid;
    grid-template-columns: 3fr 2fr 2fr 1.5fr 1.5fr;
}

.grid-rzp-total{
    display: grid;
    grid-template-columns: 2fr 1fr;
}

.grid-treeitem-explorer{
    display: grid;
    grid-template-columns: 2px 1fr;
}
/* #endregion */

/* #region Expansion */
.expansion-header-caption{
    margin-bottom: 4px;
    opacity: 0.8;
}
.expansions-border{
    border: 1px solid var(--expansions-border-clr);
}
.expansion-list-style {
    max-height: 140px;
    opacity: 0.7;
}
.expansion-child-small {
    margin-top: -9px;
    margin-bottom: -4px;
}
/* #endregion*/


.test-style{
    border: 4px solid rgb(130, 18, 18);
}

.test-style2 {
    border: 4px solid rgb(13, 148, 66);
    min-height: 100vh;
}


.tab-grid-item-1{
    grid-column: span 1;
}

.tab-grid-item-2 {
    padding-inline:10px;
    padding-block:10px;
    
}

/* #region EntityType */
.entitytype-color{
    background-color: var(--entitytype-background-clr);
    opacity: 0.7;
}

.entitytype-icon-color{
    color: var(--entitytype-background-clr);
    opacity: 0.7;
}
/* #endregion*/

/* #region Entity */
.entity-color{
    background-color: var(--entity-background-clr);
    opacity: 0.7;
}

.entity-icon-color{
    color: var(--entity-background-clr);
    opacity: 0.7;
}
/* #endregion*/



.helpertext{
    opacity: 0.7;
    color: lightgrey;
}

.component {
    margin-inline-start:0.7em;
    font-size:1rem;
}
/* #region Font */
.font-menueitem * {
    font-size:  0.75rem;
    font-weight: 400;
    line-height: 1.3125; 
    letter-spacing: .00703em;
}
.font-ssmall * {
    font-size: 0.6878rem;
    font-weight: 100;
    line-height: 1.3125;
    letter-spacing: .01em;
}
.font-small * {
    font-size: 0.75rem;
    font-weight: 300;
    line-height: 1.3125;
    letter-spacing: .02em;
}
.font-msmall * {
    font-size: 0.8rem;
    line-height: 1.4;
    font-weight: 300;
    letter-spacing: .02em;
}
.font-medium * {
    font-size: 1rem;
}
/* #endregion */

.text-field-edit * {
    font-size: 0.875rem;
    font-weight: 200;
    color: seashell;
}


/*Default*/
.default-border-1 {
    border: 1px solid var(--default-border);
}







.visibility-true * {
    visibility:visible;
}

.visibility-false * {
    visibility: hidden;
}

.fix-bottom {
    position:fixed;
    right:auto;
    bottom:5px;
    left:auto;
}







html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

h1:focus {
    outline: none;
}

a, .btn-link {
    color: #0071c1;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.content {
    padding-top: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

.blazor-error-boundary::after {
    content: "An error has occurred."
}

.status-bar-safe-area {
    display: none;
}

@supports (-webkit-touch-callout: none) {
    .status-bar-safe-area {
        display: flex;
        position: sticky;
        top: 0;
        height: env(safe-area-inset-top);
        background-color: #f7f7f7;
        width: 100%;
        z-index: 1;
    }

    .flex-column, .navbar-brand {
        padding-left: env(safe-area-inset-left);
    }
}