/*
* Notice: This source file was originally developed by Automatik IT, to make development of new projects more efficient, internally and externally for various clients.
* The functionality in this file is provided in source form instead of as a binary (NuGet Package etc.) to allow clients of Automatik IT to make changes on their own.
* Clients of Automatik IT have the right to modify this file and have ownership of the changes they make.
* Exclusive ownership of the original source file is not granted, as it's used in various projects for the sake of efficiency.
*/


/* DETAILS CONTROL */

.DetailsControl {
    max-height: 100%;
    max-width: 1440px;
    background-color: #fff;
    box-shadow: 21px 0px 61px 0px rgba(0,0,0,.2);
    z-index: 1;
    /*
    margin-left: auto;
    margin-right: auto;
        */
    margin: 24px 0 0 24px;
    font-size: 16px;
}






    /* Default left and right padding for DetailsControl only, as ListControl higlighting needs to cover the the full width. */
    .DetailsControl > .Body {
        /*max-width: 720px;*/
        /*
        padding: 0;
        */
        /*
        margin-left: 28px;
        margin-right: 28px;
        */
    }


        .DetailsControl .Body ul {
            padding: 0;
            margin: 0;
            flex-grow: 1;
        }
                

            .DetailsControl .Body li {
                display: block;
            }


    /*
        .DetailsControl footer:empty {
            display: none;
        }*/



    .DetailsControl fieldset {
        text-align: left;
        border: none;
        width: 100%;
        margin-top: 28px;
    }


        .DetailsControl fieldset:first-child {
            margin-top: 0;
        }


        .DetailsControl fieldset > legend {
            font-size: 13px;
            text-transform: uppercase;
            color: rgba(0,0,0,.6);
            cursor: pointer;
            /*margin-bottom: 28px;*/
            /*display: none;*/
        }


    .DetailsControl .Body fieldset.Method,
    .DetailsControl .Body fieldset.Parameter,
    .DetailsControl .Body li.Category {
        margin: 0;
        padding: 0;
    }


    .DetailsControl .Body fieldset.Parameter {
        /* border: 1px solid rgba(0,0,0,.14); */
        /*padding: 12px 12px 12px 12px;*/
		padding: 12px 12px 12px 12px;
    }
	
	.DetailsControl .Body > fieldset.Parameter {
		padding: 12px 0 0 0 !important;
    }

    /* Don't show border for the top level fieldset for the object */
    .DetailsControl .Body .Method > ul > li > fieldset.Parameter {
        border: none;
        padding: 0;
    }



/*
    .DetailsControl .Body .Category > ul {
        margin-top: 8px;
    }*/
.DetailsControl .Body li {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    position: relative;
    align-items: center;
}

    .DetailsControl .Body .Category li {
        margin-top: 32px;
    }


    .DetailsControl .Body li:first-child {
        margin-top: 0;
    }


    .DetailsControl label {
        /*padding-right: 20px;*/
        color: rgba(0,0,0,.72);
		font-size: 1.125rem;
		
        /*border-bottom: solid 1px rgba(0,0,0,.2);*/
        /*min-width: 120px;*/
        padding: 2px 6px 2px 0;
    }


    .DetailsControl li.CheckboxInput label {
        border-bottom: none;
    }


    .DetailsControl .Body input[type='text'],
    .DetailsControl .Body input[type='password'],
    .DetailsControl .Body select,
    .DetailsControl .Body textarea,
    .DetailsControl .Body input.MultiLanguageTextBoxControl,
    .DetailsControl .Body input.MultiLanguageTextAreaControl {
        flex-grow: 1;
    }


    .DetailsControl .Body textarea,
    .DetailsControl .Body div.MultiLanguageTextBoxControl,
    .DetailsControl .Body div.MultiLanguageTextAreaControl,
    .DetailsControl .Body table.CheckboxTreeControl,
    .DetailsControl .Body .CheckboxMultiSelectControl
    /*.DetailsControl .Body input.MultiLanguageTextBoxControl*/ {
        width: 100%;
    }

        .DetailsControl .Body input[type='checkbox'] {
            flex-grow: 0;
            margin-left: 8px;
            margin-right: 8px;
        }


    /* Hide as they are replaced by select2:s*/
    .DetailsControl .Body select {
        visibility: hidden;
        height: 32px;
    }


/*
                    form fieldset > ul > li > input[type='text'],
                    form fieldset > ul > li > input[type='number'],
                    form fieldset > ul > li > input[type='password'] {
                        padding-top: 0;
                        padding-bottom: 0;
                        font-size: 18px;
                        border: none;
                        line-height: inherit;
                        border-bottom: solid 1px rgba(0,0,0,.2);
                    }
                    */




.Method > ul > li > .Parameter > ul > li > ul > li.TextBoxControl,
.Method > ul > li > .Parameter > ul > li > ul > li.ReadOnlyTextBoxControl,
.Method > ul > li > .Parameter > ul > li > ul > li.SelectControl,
.Method > ul > li > .Parameter > ul > li > ul > li.PartialControl label,
.Method > ul > li > .Parameter > ul > li > ul > li.ReadOnlyDateTimeControl,
.Method > ul > li > .Parameter > ul > li > ul > li.NullableCheckboxControl,
.Method > ul > li > .Parameter > ul > li > ul > li.TextAreaWithMultiUploadControl,
.Method > ul > li > .Parameter > ul > li > ul > li.TextAreaControl,
.Method > ul > li > .Parameter > ul > li > ul > li.MultiUploadControl,
.Method > ul > li > .Parameter > ul > li > ul > li.MultiSelectControl,
.Method > ul > li > .Parameter > ul > li > ul > li.CheckboxTreeControl,
.Method > ul > li > .Parameter > ul > li > ul > li.DateTimeControl,
.Method > ul > li > .Parameter > ul > li > ul > li.CheckboxControl,
.Method > ul > li > .Parameter > ul > li > ul > li.AnchorControl,
.Method > ul > li > .Parameter > ul > li > ul > li.CodeControl,
.Method .Parameter .Parameter .DomainClassControl,
.Method > ul > li > .Parameter > ul > li > ul > li.ReadOnlyTextAreaControl,
.Method > ul > li > .Parameter > ul > li > ul > li.MultiLanguageTextBoxControl,
.Method > ul > li > .Parameter > ul > li > ul > li.MultiLanguageTextAreaControl {
    margin-left: 28px;
    margin-right: 28px;
}


.TextBoxControl input,
.DateTimeControl input,
input.MultiLanguageTextBoxControl {
    padding-top: 0;
    padding-bottom: 0;
    font-size: 18px;
    line-height: inherit;
}


.TextBoxControl,
/*.ReadOnlyTextBoxControl,*/
.DateTimeControl /*,
.ReadOnlyDateTimeControl*/ {
    font-size: 18px;
    /*border-bottom: solid 1px rgba(0,0,0,.2);*/
}

/* Show in single column for Comment textareas, selects etc. */

/*li.Input > label,*/
li.TextAreaControl > label,
/*li.ReadOnlyTextAreaControl > label,*/
li.SelectControl > label,
li.SelectMultipleControl > label,
li.UploadMultipleControl > label,
li.UploadControl > label,
li.TextAreaWithMultiUploadControl > label,
li.MultiLanguageTextBoxControl > label,
li.MultiLanguageTextAreaControl > label {
    /*flex: 0 0 100%;*/
    text-align: left;
    border-bottom: none;
    /*padding: 2px 0 2px 0;*/
}




/*TODO: Make general? */
#UserLogInPartial,
#UserSendPasswordResetMailPartial {
    margin-left: auto;
    margin-right: auto;
}

    #UserLogInPartial header h4,
    #UserSendPasswordResetMailPartial header h4 {
        flex-grow: 1;
        text-align: center;
        font-size: 30px;
        padding: 42px;
    }

    /*
    #UserSendPasswordResetMailPartial header h4 {*/
        /* Offset to compensate for window controls */
        /*padding-left: 118px;
    }
    */
    #UserLogInPartial .WindowControls,
    #UserSendPasswordResetMailPartial .WindowControls {
        margin-top: 0;
        margin-right: 0;
        position: absolute;
        right: 8px;
        top: 8px;
    }




    #UserLogInPartial > .Body,
    #UserSendPasswordResetMailPartial > .Body {
        padding: 0 64px 0 64px;
    }


    #UserLogInPartial > footer,
    #UserSendPasswordResetMailPartial > footer {
        padding: 42px;
        justify-content: center;
    }

    #UserLogInPartial footer input[type='submit'],
    #UserSendPasswordResetMailPartial footer input[type='submit'] {
        padding: 8px 16px;
        font-size: 20px;
    }





li.Parameter {
    margin-top: 24px;
}



/* Action links under input fields */
.ParameterActions {
    width: 100%;
    text-align: right;
    margin-top: 8px;

    text-transform: uppercase;
    font-size: 12px;
}

    .ParameterActions a {
        text-decoration: none;
        letter-spacing: 0.08em;
        border-bottom: 1px solid #FD41A4;
        padding-bottom: 1px;
        box-sizing: content-box;
        display: inline-block;
    }

        .ParameterActions a:hover {
            color: #ff0086;
            border-bottom-color: #ff0086;
        }


/*
.FormControl {
    border: none;
}
*/


.DetailsControl li.TextBoxControl > label,
.DetailsControl li.DateTimeControl > label {
    
    border-bottom: solid 1px rgba(0,0,0,.2);
}

.DetailsControl input.TextBoxControl,
.DetailsControl input.DateTimeControl,
input.MultiLanguageTextBoxControl {
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: solid 1px rgba(0,0,0,.2);
    padding: 2px 8px 2px 8px;
}









/* DELETE BUTTON */
.DeleteButton {
    background: none !important;
    color: rgba(4,171,237, .7) !important;
    font-weight: bold !important;
    border: 1px solid rgba(4,171,237,0) !important;
    padding: 0 !important;
    /*height: 20px;*/
    margin-top: auto;
}

    /*
    .DeleteButton:hover {
        border: 1px solid rgba(4,171,237,1) !important;
    }
*/

    .DeleteButton:hover {
        color: rgba(4,171,237,1) !important;
    }


/* RESPONSIVE */

/* Cover full width on small devices */

@media (max-width: 1024px) {

    .DetailsControl {
        width: 100%;
        font-size: 32px;
    }
}


/*
@media (max-width: 1024px) {

    .DetailsControl {
        max-width: none !important;
    }
}
    */


li.IDControl {
    display: none !important;
}


/* Syntax highlighting for integration snippets */
.CodeControl {
    overflow: auto;
    max-width: 640px;
}



.RadioButtonGroup {
    width: 100%;
    display: flex;
    justify-items: flex-start;
    align-items: center;
    margin-top: 4px;
}

    .RadioButtonGroup > input[type='radio'] {
        flex-grow: 0;
        margin-top: -1px;
        vertical-align: middle;
    }



    /* ListControl inside DetailsControl */
.DetailsControl .ListControl {
    /*margin-left: -18px;*/
    width: 100%;
    margin-top: 0;
}

/* Hide list header when shown inside a details control */
/*
.DetailsControl .ListControl > header {
    display: none;
}
    */

    .DetailsControl .ListControl > header h4,
    .DetailsControl .ListControl > header .Close {
        display: none;
    }


    .DetailsControl .ListControl {
        box-shadow: none;
    }



    .DetailsControl .ListControl th:first-child,
    .DetailsControl .ListControl td:first-child {
        padding-left: 28px;
    }

    .DetailsControl.ListControl th:last-child,
    .DetailsControl .ListControl td:last-child {
        padding-right: 28px;
    }

    .DetailsControl .ListControl td {
        padding-top: 14px;
        padding-bottom: 14px;
    }



/* MultiLanguageTextBoxControl */


/* Row */
div.MultiLanguageTextBoxControl > div,
div.MultiLanguageTextAreaControl > div {
    display: flex;
    margin-top: 24px;
}


    div.MultiLanguageTextBoxControl > div:first-child,
    div.MultiLanguageTextAreaControl > div:first-child {
        margin-top: 8px;
    }




    div.MultiLanguageTextBoxControl > div > .Culture,
    div.MultiLanguageTextAreaControl > div > .Culture {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        padding-bottom: 2px;
    }

    div.MultiLanguageTextAreaControl > div > .Culture {
        justify-content: center;
    }

    div.MultiLanguageTextBoxControl > div > .Culture {
        border-bottom: solid 1px rgba(0,0,0,.2);
    }

        div.MultiLanguageTextBoxControl > div > .Culture .DomainObjectHtml > span:first-child,
        div.MultiLanguageTextAreaControl > div > .Culture .DomainObjectHtml > span:first-child {
            min-width: 22px;
            /*border-bottom: solid 1px rgba(0,0,0,.2);*/
        }

            div.MultiLanguageTextBoxControl > div > .Culture .DomainObjectHtml > span:first-child > svg,
            div.MultiLanguageTextAreaControl > div > .Culture .DomainObjectHtml > span:first-child > svg {
                width: 22px;
                height: 22px;
            }


            /*
.CheckboxTreeControl .ChildRow label {
    font-size: 94%;
    margin-left: 34px;
    padding-left: 28px;
}
                */

.CheckboxTreeControl .ChildRow .CheckboxControl > label .Checkmark {
    position: absolute;
    top: 4px;
    left: 0;
    height: 21px;
    width: 21px;
}

    .CheckboxTreeControl .ChildRow .CheckboxControl > label .Checkmark:after {
        left: 5px;
        top: 2px;
        width: 4px;
        height: 8px;
    }

/* Extra vertical spacing between checboxes on small devices */
@media (max-width: 1024px) {

    .CheckboxTreeControl .CheckboxControl {
        padding-top: 12px;
        padding-bottom: 12px;
    }
}