@import "fc-colors.css";

/*
    .HtmlAttributes(new { style = "color:blue;" })
    .HtmlAttributes(new { @class = "required-field" })

    .Scrollable(a => a.Height("auto"))

    #table-parameter tr td {
        border: 1px solid teal;
    }
*/

/*COLORS:
#484848 dkgrau //damit #3F51B5 ersetzen
#6c757d mittelgrau //
#f8f9fa hellgrau //damit #00B0FF ersetzen
-- STREIFEN GRID --
silver (dunkel)
gainsboro (mittel)
whitesmoke (hell)
*/

/*Alle icons in Titlebar*/
body > div > div.k-window-titlebar.k-hstack > div > button {
    margin-top: 5px;
    width: 30px !important;
}

k-svg-icon {
    margin-top: 5px;
    width: 30px !important;
}

.k-in, .k-treeview .k-in, .k-block, .k-content, .k-dropdown .k-input, .k-popup, .k-widget, .k-grid-header th.k-header > .k-link, .k-grid-header, .k-header, .k-grid-header .k-header .k-link, .k-grid-header .k-link, .k-grid-header .k-link:link, .k-scheduler-agendaview .k-scheduler-datecolumn, .k-scheduler-header {
    color: #000 !important;
}

/*SASS*/
.k-treeview-md .k-treeview-leaf {
    padding: 1px 1px;
}

/*Muss evtl. ans Ende der Datei*/
#Menu .k-menu.k-header {
    border-color: #fff !important;
}

/*SASS*/


.container {
    max-width: 100%;
}

button {
    border: 1px solid silver;
    padding: 4px;
}

/* ---------------------- */
/* LOGIN */
#Login a {
    font-size: 11px !important
}
#Login a.btn {
        font-size: 1.5em !important
    }
#Login a:link {color:red;}
#Login .form-group {font-size:1.5em;}

#Login form {
    background: #f8f9fa;
    border: 1px solid #484848;
    padding: 1.5em;
}

#Login h2 {font-size:20px;}



    #Login button.btn.btn-default {
    font-size: 1em;
    transition: box-shadow .3s;
    width: 130px;
    height: 40px;
    margin: 50px;
    border-radius: 2px;
    border: 1px solid #6c757d;
    background: #fff;
    float: left;
}

    #Login button.btn.btn-default:hover {
        background: #f8f9fa;
        color: #484848;
        -webkit-box-shadow: 11px 17px 5px -6px rgba(230,230,230,0.88);
        -moz-box-shadow: 11px 17px 5px -6px rgba(230,230,230,0.88);
        box-shadow: 9px 10px 5px -4px rgba(230,230,230,0.88);
    }


.k-window-title {
    font-size: 12px;
    font-weight: 600;
    padding: 8px 4px 8px 4px;
}


/* ---------------------- */
/* HEADER */
#container {
    margin-left: 0px;
    margin-right: 0px;
}

.navbar-expand-md {
    background: #484848;
}

#header-sub-nav {
    background: #f8f9fa;
    width: inherit;
}

.navbar-brand {display:block; padding-left: 0px; margin-right:0px;} /*erweitert das Sub Menu auf Seitenbreite*/

#navlist {
    padding-left: 0px;
}

    #navlist li {
        display: inline;
        list-style-type: none;
        /*padding-right: 10px;*/
    }

#FlexMenu li {
    float: right;
    display: inline-block;
}

/* Menu Header */


/* Adress Search */

.k-block, .k-draghandle, .k-grid-header, .k-grouping-header, .k-header, .k-treemap-tile, 
.k-autocomplete, .k-draghandle, .k-dropdown-wrap, .k-grid-header, .k-grouping-header, .k-header, .k-numeric-wrap, .k-panelbar .k-tabstrip-items .k-item, .k-picker-wrap, .k-progressbar, 
.k-state-highlight, .k-tabstrip-items .k-item, 
.k-gantt-toolbar .k-state-default, .k-grid .k-grouping-header, .k-grid-footer td, .k-grid-header, .k-grid-header-wrap, .k-group-footer td, .k-grouping-row td, .k-header {
    border-color: #6c757d !important;
}


/* ---------------------- */
/* FOOTER */
#footer-container, .quick-links, .copyright {
    background: #484848;
}

#footer {
    position: absolute;
    bottom: 0px;
    width: 100%;
    height: 1.5rem;
    margin: 0px;
    padding-right: 30px;
    }

#footer-container {
    padding: 10px 20px 10px 20px;
    max-width: 100%;
    margin-top: 15px;
}

#footer p {color:#fff;}
a.footer-links {color:#fff;}
/* ---------------------- */
/* SCHRIFTEN */
.btn {
    font-size: 1.5em;
}
#Home, #Impressum, #DSGVO {font-size: 1.5em;}
#AdressDetail h1 {font-size:14px;}
h2 {
    margin-top: 1.5rem
}
h4 {margin-top: 40px; margin-bottom: 20px;}
#Shopfinder h4 {
    margin-top: 10px;
    margin-bottom: 10px;
}
/* ---------------------- */

ul.Advanced li {list-style:none;}


/* ---------------------- */
/* k panels, i.e. AddressSearch Tabs */
/*.k-panelbar .k-tabstrip-items .k-state-active, .k-tabstrip-items .k-state-active {
    background-color: #999;
    border-bottom-color: #d4d4d4;
}

.k-autocomplete, .k-draghandle, .k-dropdown-wrap, .k-grid-header, .k-grouping-header, .k-header, .k-numeric-wrap, .k-panelbar .k-tabstrip-items .k-item, .k-picker-wrap, .k-progressbar, .k-state-highlight, .k-tabstrip-items .k-item {
    background-color: #484848;
}

.k-item k-state-default k-tab-on-top k-state-active, .k-item k-state-default k-tab-on-top k-state-hover {
    background-color: #f8f9fa;
}
    */

/* FORMS */
input, select, textarea, text, datalist {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: content-box;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}

#POSInfo select, #POSInfo input[type="text"]{
    width: 100%;
    box-sizing: border-box;
}

#container select, #container input[type="text"], #container number {
    width: 150%;
    box-sizing: border-box;
}

.readonly, .form-control:disabled, .form-control[readonly]  { /* für alle unabänderlichen Felder */
    background-color: #fafafa;
    border: 1px solid #f8f9fa;
    color: #000;
    opacity:1;
}




/* KALENDER z.B. AppointmentList*/
.k-calender .k-content {
    width: 80% !important;
    margin: 1em !important;
    color: aqua;
}



/*Farbe des Zeilen hovers in Ergebnistabellen auf grau ändern*/

html .k-grid tr:hover {
    background-color: gainsboro !important;
}

html .k-grid tr.k-alt:hover {
    /*Silver Theme*/
    background: #fbfbfb;
}

/* gewählter Filter in Ergebnisliste orange hinterlegen */
.k-grid-filter.k-state-link, .k-grid-filter.k-state-visited, .k-grid-filter.k-state-hover, .k-grid-filter.k-state-active {
    background-color: orange !important;
    border: 1px solid whitesmoke;
}

/* Filter panelbar */

#panelbar {
    max-width: 400px;
    margin: 0 auto;
}

.k-panelbar-item-text {
    color: black;
    text-decoration: underline;
    padding-left: 10px;
    font-weight: bolder
}

.k-panelbar .k-panelbar-expand,
.k-panelbar .k-panelbar-collapse {
    right: auto;
    left: 2px;
}

.k-menu .k-menu-group .k-item > .k-link {
    padding: .28em 1.8em .38em 1.9em;
}

.k-panelbar .k-item .k-link.k-state-selected, .k-panelbar > li.k-state-default > .k-link.k-state-selected, .k-panelbar > li > .k-state-selected, .k-state-selected > .k-link {
    color: black;
}

span.k-link.k-menu-link input {
    margin: 2px 4px 0 10px;
    color: black;
}

/* ENDE Filter panelbar */

/*ab hier SASS Änderungen*/
/* SASS */
body, 
button, input, optgroup, select, textarea, label,
.k-grid, .k-grid td, .k-grid th,
.k-treeview, .k-treeview-md, .k-treeview-leaf, .k-treeview-top,
.k-menu-group-md .k-menu-item,
.box label {
    font-size: 11px !important;
}

h1 {font-size: 20px;}
h2 {font-size: 18px;}
h3 {font-size: 16px;}
h4 {font-size: 14px;}
h5 {font-size: 12px;}
p {margin: 0; padding: 0; font-size: 11px !important;}
.k-panelbar,
.dx-widget, .dx-widget *, .dx-checkbox-text, .dx-pivotgrid-fields-container .dx-area-field-content, .dx-pivotgrid .dx-pivotgrid-fields-area-head .dx-empty-area-text {
    font-size: 11px;
}
span.k-list-item-text {font-size:11px;}

k-menu-group-md .k-menu-expand-arrow {
    margin-inline-end:-20px;
}

.k-content {padding-bottom: 1em;}
.k-input-value-text {font-size: 11px;}

input[type=date] /*, input[type=datetime-local], input[type=month], input[type=time] */ 
{
    width: 100%;
}

.k-icon-24 {font-size: 24px; /* Sets icon size to 24px */}
.k-icon-32 {font-size: 32px; /* Sets icon size to 32px */}
.k-icon-48 {font-size: 48px; /* Sets icon size to 48px */}
.k-icon-64 {font-size: 64px; /* Sets icon size to 64px */}
.k-button-icontext {padding: 2px 10px 1px 2px;} /*k-button-icontext gibt es in SASS nicht mehr- ich nutze es für button padding*/

/* GridToolbarTemplate */
.k-button-icontext {
    padding: 2px 10px 1px 2px;
}

.k-toolbar {
    gap: 20px;
    padding-left: 0;
}
/* ENDE GridToolbarTemplate */

div.k-grid-footer {
    border: 1px solid black;
}