/* NBS anpassnig av Teleriks style */

:root {
	/*--kendo-font-size: 1.25rem;*/ /* 0.875rem original blir liten text i t.ex. wizard. Men funkar inte för TreeView */

	--kendo-color-primary: #8799ff; /* ändrar primary color som används på flera olika ställen av telerik, t.ex. som bakgrundsfärg när man klickar i menyn på hamburgerknappen på ett party, när man ska byta ägare på ett abonnemang t.ex.*/
}

/* Gör ingen effekt? 
.k-treeview-item
{
	font-size: 0.875rem !important;	
} */


/* Rader i telerik gridden */
/* Utan denna så blir det radbrytningar i griden när text inte får plats */
.k-grid td, .k-grid .k-table-td {
	white-space: nowrap;
}
/* Utan denna blir det ellipsis när text inte får plats i grid */
.k-grid .k-table-th,
.k-grid td,
.k-grid .k-table-td {
	text-overflow: clip;
}

.k-grid .k-selected {
    background-color: unset;
}

.k-grid td.k-selected, .k-grid tr.k-selected > td {
	color: black;
	/*background-color: rgba(18, 116, 172, 0.25);*/
	background-color: #BAC4FF !important; /* Solid markering före uppgradering till Telerik 3.x */
	/*background-color: #BAC4FF99; */ /* Transparent markering från Telerik 3.x */
	/*background-color: #8799FF66; */
}

/* Kolumnrubrik i gridden */
.k-column-title {
    text-overflow: clip;
}
.k-cell-inner > .k-link {
    padding-right: 0px;
}

/* Hover färg för raderna i telerik gridden */
.k-master-row:hover 
{
	background-color:#E5E9FF !important
}

/* Teleriks dialog */
.k-dialog-titlebar
{
	border-color:inherit;
	color:#fff;
	background-color:#8799FF;
}

/* Knapparna i en telerik dialog, hover färg (eftersom teleriks knappt syns) denna är dessutom samma som på knapparna i vårt egna fönster */
.k-window-action:hover
{
	background-color: #9BAAFF !important;	
}							 


/* För att telerikkontroller ska få samma rundning som Nbs kontroller */
.k-rounded-md 
{
    border-radius: 2px;
}

/* Telerik knapp in inbyggade dialoger t.ex. i rich-text editorn 
Detta gör att de ser ut som våra ImageButtons med text */
.k-actions .k-button-solid-base {
    border-radius: 4px;
	padding: 8px 21px 5px 21px;
    border: none;
    background-color: #DCDCDC;
    font-weight: bold;
    color: black;
    outline: none;
}

/* Primär telerik knapp i inbyggda dialoger. Enter verkar inte motsvara den så inte så stor mening att ha en speciell färg på den?  
Detta gör att de ser ut som våra ImageButtons med text */
.k-actions .k-button-solid-primary {
	border-radius: 4px;    
	padding: 8px 21px 5px 21px;
    border: none;
    background-color: #DCDCDC;
    font-weight: bold;
    color: black;
    outline: none;
}


/* hover färg för telerik knappar, t.ex. i datumväljare och i toolbaren för rich-text editorn */
.k-button:hover
{	
	background-color: #BAC4FF;	
}

/* inputfält */
.k-input-inner 
{
    padding: 3px 4px;
    text-overflow: clip;
}


/* Ram kring telerik inputs t.ex. datepickern */
.k-input-solid 
{
	border: solid 1px #BBBBAA;
}
/* datetimepicker - Tar bort skugga runt vid fokus */
.k-input-solid:focus-within 
{
	box-shadow:none;
}

/* datepicker - valt datum */
.k-calendar .k-calendar-td.k-selected .k-calendar-cell-inner, 
.k-calendar .k-calendar-td.k-selected .k-link {
    border-color: #8799FF;
    color: #ffffff;
    background-color: #8799FF;
} 

/* datepicker - inputfältet */
.k-input-md .k-input-inner, .k-picker-md .k-input-inner {
    padding: 3px 4px;
}

/* datepicker - texten 'i dag' */
.k-calendar .k-nav-today,
.k-calendar .k-calendar-nav-today 
{
    color: #0000FF;
	
}

/* datepicker - texten 'i dag' när man hovrar över den */
.k-calendar .k-calendar-nav-today:hover
{
	color: #0000FF;
}

/* Minskar bredd på datum och tid komponenter */
.k-dateinput, .k-datetimepicker, .k-timepicker {
	width: 12.4em;
}

/* Minskar bredd på datumväljare */
.k-datepicker {
	width: 9em;
}

/* tar bort avrundning på knappen i datepicker och datetimepicker */
.k-datepicker .k-button, .k-datetimepicker .k-button {
	border-radius: 0px;
}

/* tabbar - Gör texten på disablade tabbar grå så man ser att tabben är disablad */
.k-disabled, .k-widget[disabled] {
	color: #AAAAAA !important;
}

/* progressbar - ändrat färg */
.k-progressbar .k-selected {
	border-color: #B799FF !important;
	background-color: #B799FF !important;
}
/* k-stepper delarna används av progressbar när den ökar, t.ex. när man kopierar en abonnemangsorder*/
.k-stepper .k-step-label .k-step-text {
	max-width: none !important; /*max-width: calc(10em - 20px);ändrat för att inte ordet ska kortas av*/
}
.k-stepper .k-step-done .k-step-indicator {
	border-color: #8799FF !important;
	background-color: #8799FF !important;
}
.k-stepper .k-step-done.k-step-hover .k-step-indicator, .k-stepper .k-step-done:hover .k-step-indicator {
	background-color: #BAC4FF !important;
}
.k-stepper .k-step-current .k-step-indicator {
	border-color: #8799FF !important;
	background-color: #8799FF !important;
}
.k-stepper .k-step-current.k-step-hover .k-step-indicator, .k-stepper .k-step-current:hover .k-step-indicator {
	background-color: #BAC4FF !important;
}

/* paging - t.ex. för treeview grid som används i ticket */
.k-pager-numbers .k-link.k-selected {
	background-color: #BAC4FF !important;
}

/* Wizard - padding och margin minskad, används på subscriptionorder */
.k-wizard {
	padding: 5px 0px !important; /*20px 20px;*/
}
.k-wizard .k-wizard-step {
	padding: 0px !important; /*padding: 10px;*/
}
.k-wizard .k-wizard-buttons {
	margin-top: 20px !important; /*32px;*/
}
.k-wizard-horizontal .k-wizard-steps {
	margin-top: 20px !important; /*32px*/
}

/* okänt? */
/*.k-list-item.k-selected, .k-selected.k-list-optionlabel {
    color: #ffffff;
    background-color: #8799FF;
} */

/*.k-focus 
{
   background-color: #8799FF;
} */

/*.k-selected
{
   background-color: #8799FF;
} */


/* Styles från Telerik2 som har att göra med hover färg */
/*.k-button:hover,
.k-button.k-state-hover,
.k-action-buttons .k-button:hover,
.k-action-buttons .k-button.k-state-hover,
.k-dropdowntree .k-dropdown-wrap:hover,
.k-dropdowntree .k-dropdown-wrap.k-state-hover,
.k-spreadsheet-filter:hover,
.k-pivot-toolbar .k-button:hover,
.k-pivot-toolbar .k-button.k-state-hover,
.k-fieldselector .k-list li.k-item:hover,
.k-fieldselector .k-list li.k-item.k-state-hover,
.k-editor-toolbar a.k-tool:hover,
.k-editor-toolbar a.k-tool.k-state-hover,
.k-gantt-views li.k-state-hover,
.k-scheduler-navigation .k-nav-today:hover,
.k-scheduler-navigation .k-nav-prev:hover,
.k-scheduler-navigation .k-nav-next:hover,
.k-scheduler-views li:hover,
.k-scheduler-footer li:hover,
.k-handle:hover
{border-color:rgba(0,0,0,0.15);color:#656565;background-color:#E5E9FF;background-image:linear-gradient(#E5E9FF,#e8e8e8)}
*/


/* Nya för Telerik 4.0.1 */

.k-table-md .k-table-th, .k-table-md .k-table-td 
{
    padding: 6px 10px 6px 10px;
}

.k-table-thead, .k-table-header, .k-table-group-sticky-header 
{
	color: black;
    background-color: #f0f0f0;
	text-overflow: clip;
}

.k-grid-header .k-header 
{
    font-size: 9pt;
    font-weight: bold;
    padding: 4px 10px;
}

.k-button-md.k-icon-button > .k-button-icon 
{
    min-width: 20.0000000004px;
    min-height: 20.0000000004px;
}

.nbsEditor-icon
{
	padding:14px !important;
}

.k-input-solid:focus
{
	border-color:#BBBBAA;
}

.k-input-solid:focus-within
{
	border-color:#BBBBAA;
}

.k-input-solid:hover
{
	border-color:#BBBBAA;
}

.k-window-titlebar 
{
    border-color: inherit;
    color: #ffffff;
    background-color: #8799FF;
}

.k-button.k-selected::before 
{
    opacity: 0%;
}

.k-pager-numbers .k-button.k-selected
{
	background-color: #BAC4FF !important;
}

.k-pager-numbers .k-button
{
	color:blue;
}

.k-pager-nav .k-icon
{
	color:blue;
}

.k-button 											   
{
    transition: none !important;
}

.k-pager-md .k-pager-info, .k-pager-sm .k-pager-info, .k-pager-sm .k-pager-sizes, .k-pager-sm .k-pager-numbers {
    display: block;
}

.k-grid .k-grouping-row td 
{
    padding: 2px 8px;
}

.k-grid .k-hierarchy-cell > .k-icon, .k-grid .k-drag-cell > .k-icon {
    padding: 0px 0;
}

.k-window-titlebar-action:hover
{
	background-color: #9BAAFF !important;
}

/* Footern på en telerik tabell */
.k-table-tfoot, .k-table-footer 
{
    background-color: #f0f0f0;
}

/* Höjden på en rad i tabellen */
.k-grid-md td, .k-grid-md .k-table-td 
{
    padding: 6px 10px 6px 10px;
}

/* Marginal på soteringspil */
.k-grid .k-grid-header .k-cell-inner > .k-link > .k-sort-icon 
{
    -webkit-margin-start: 3px;
    margin-inline-start: 3px;
}

.k-grid-md .k-table-th > .k-cell-inner > .k-link 
{
    padding: 8px 0px 8px 12px;    
}

.nbs-limit-tabwidth 
{
	flex-direction: row !important;
}

.k-button-flat-primary 
{
    color: #0000FF !important;
}

.k-map .k-attribution
{
	display:none !important;   
}

.k-map-controls
{
	bottom: 0px;
}

.link-column-no-padding {
	padding: 0px !important;
}


/* 25964 Sorteringspilarna var röda i Telerik 8, de ska vara blå!  */
/*Försök till lösning som ej hjälpte
:root
{
   currentColor: #5360A4;	 WTC_NEIASD
}	 */

/* 25964 Sorteringspilarna var röda i Telerik 8, de ska vara blå!  */
.k-grid-header .k-svg-icon>svg 
{
  fill: unset !important;  
} 

/* 25964 Sorteringspilarna var röda i Telerik 8, de ska vara blå!  */
.k-grid .k-grid-header .k-cell-inner>.k-link>.k-sort-icon .k-icon
{
	fill: #1274AC !important;	  
}

/* 25810 Centrerar knappar i telerik dialoger */
.k-window-actions
{
	justify-content:center !important;
}

/* 25964 Disablade knappar i rich text editorn var inte syligt utgråade i Telerik 8. Detta gråar även ut ramen men enda lösningen jag kunde komma på. */
.k-button:disabled, .k-button.k-disabled
{
	opacity:0.36 !important;
}

.k-button-solid-base.k-selected 
{
    border-color: #1274AC;
    color: White;
    background-color: #1274AC;
}

.k-ct-popup .k-selected
{
	background-color: #3B94FC; /* RFFB1 */
}

.k-checkbox:checked::before, .k-checkbox.k-checked::before
{
    background-color: transparent !important; 
}

.k-checkbox:checked, .k-checkbox.k-checked 
{
    border-color: #888888 !important;
    color: #ffffff !important;
}

.k-checkbox:checked:focus, .k-checkbox.k-checked.k-focus
{
   box-shadow: 0 0 0 2px #BAC4FF !important;
}

.k-checkbox:indeterminate::before, .k-checkbox.k-indeterminate::before 
{
    background-color: black !important;
}

/* Teleriks förslag för att lösa 26326 (punkt 1) */
.k-grid .k-header:last-child .k-column-resizer,
    .k-grid .k-grid-content tr td:last-child 
{
   border-right: 1px solid #DDD;
}

/* Teleriks förslag för 26326 leder dock till att det blir dubbla linjer till höger på sista kolumnhuvudet. Fix 1 av 2 för detta */
.k-grid-header, .k-grid-footer 
{
	border-inline-end-color: #F0F0F0 !important;
}
/* Teleriks förslag för 26326 leder dock till att det blir dubbla linjer till höger på sista kolumnhuvudet. Fix 2 av 2 för detta */
.k-grid-header-wrap 
{
	border-color: #F0F0F0 !important;
}