:root {
    --main: rgb(255, 100, 100);
    --light: rgb(255, 200, 200);
}

/* Link color */
a {
    color: var(--main);
}

.hl{
    background-color: yellow
}

/* Login screen logo */
.login-container .logo,
.divRegisterContent .logo{
    display: flex;
    justify-content: center;
}


/*
=========================
===== Input styling =====
=========================
*/

/* Transparent button */
.input-button {
    color: var(--main);
}

/* Transparent button hover */
.input-button:not(.input-button-primary):hover {
    border-color: var(--main);
}

/* Filled button */
.input-button.input-button-primary {
    color: white;
    background-color: var(--main);
    border-color: var(--main);
}

/* Filled button hover */
.input-button.input-button-primary:hover {
    background-color: #005c95;
    border-color: #005c95;
}

/* Text/select input border color when selected  */
.input-text:focus {
    border-color: var(--main);
}

/*
=================================
===== Top menu styling =====
=================================
*/

/* Main menu container */
.header-mainmenu {
    background-color: var(--main);
    border-bottom-color: var(--light);
    color: white;
}

/* Main menu button */
.header-mainmenu .header-mainmenu-button {
    color: white;
}

/* Main menu button hover */
.header-mainmenu .header-mainmenu-button:not(.header-mainmenu-button-active):hover {
    background-color: var(--light);
    color: black;
}

/* Active main menu button */
.header-mainmenu .header-mainmenu-button-active {
    background-color: var(--light);
    color: black;
}

/* Arrow color behind user name */
.header-mainmenu .header-mainmenu-user:after {
    border-top-color: white;
}

/* Submenu container */
.header-submenu {
    background-color: white;
    color: #4d4d4d;
}

/* Submenu button text color */
.header-submenu .header-submenu-button {
    color: #4d4d4d;
}

/* Submenu button hover */
.header-submenu .header-submenu-button:not(.header-submenu-button-active):hover {
    border-bottom-color: #4d4d4d;
}

/* Active Submenu button */
.header-submenu .header-submenu-button-active {;
    color: var(--main);
    border-bottom-color: var(--main);
}

/*
=================================
===== Page styling =====
=================================
*/

/* Page header bottom line */
.page-header {
    border-bottom-color: var(--main);
}

/* Tab holder */
.page-tabs, .tab-container {
    border-bottom-color: #f1f1f2;
}

/* Tab button text color */
.page-tabs .tabswitch, .tab-container .tab-tab {
    color: #4d4d4d;
}

/* Tab button hover */
.page-tabs .tabswitch:not(.active):hover, .tab-container .tab-tab:not(.tab-tab-active):hover {
    border-bottom-color: #4d4d4d;
}

/* Tab button active */
.page-tabs .tabswitch.active, .tab-container .tab-tab.tab-tab-active {
    color: var(--main);
    border-bottom-color: var(--main);
}
/* Info box */
.info-container {
    background-color: rgba(100, 180, 255, 0.2);
    border-color: rgba(100, 180, 255, 0.4);
}


/*
===============================
===== Signalering content =====
===============================
*/

/* signalering level marker line */
#tree .dynatree-container  li {
    border-color: var(--main) !important;
}

/* selected signalering in tree */
#tree .signaleringType.dynatree-active .dynatree-title {
    border-color: var(--main);
}

/* selected title in tree */
#tree .keyType.dynatree-active .dynatree-title {
    color: var(--main);
}

/* selected seeFurther in tree */
#tree .seeFurtherType.dynatree-active .dynatree-title {
    color: var(--main);
}

/* selected SeeAlso in tree */
#tree .seeAlsoType.dynatree-active .dynatree-title {
    color: var(--main);
}

/* selected LinkType in tree */
#tree .linkType.dynatree-active .dynatree-title {
    color: var(--main);
}

/* selected seeFurtherType border in tree */
#tree .seeFurtherType.dynatree-active .dynatree-title {
    border-color: var(--main);
}

/* selected seeAlsoType border in tree */
#tree .seeAlsoType.dynatree-active .dynatree-title {
    border-color: var(--main);
}

/* selected LinkType border in tree */
#tree .linkType.dynatree-active {
    border-color: var(--main);
}

/* selected keyType border in tree */
#tree .keyType.dynatree-active .dynatree-title {
    border-color: var(--main);
}

/* already used article in article list */
#tree2 .markArticle .dynatree-title, #tree2 .markArticle .dynatree-title:hover,
#tree2 .alreadyUsedKnipsel .dynatree-title, #tree2 .alreadyUsedKnipsel .dynatree-title:hover {
    background-color: var(--light);
    color: black;
}

/* selected article in article list */
#tree2 .dynatree-active .dynatree-title, #tree2 .dynatree-active .dynatree-title:hover {
    background-color: var(--main);
    color: white;
}

/* Selected RSS source */
#dvAddKnipselRssBronDiv .rssitem.selected {
    background-color: var(--main);
    color: white;
}

/* Related article selected */
.dvRelatedArticle.selected {
    background-color: var(--main);
    color: white;
}

/* Activa pagination in article search */
#dvAddKnipselBronResultsDiv .navigation a.active {
    background-color: var(--main);
    color: white;
}

/* Download page apps text color */
.download-container-inner > div > h3{
    color: var(--main);
}

/* Tree drop markers */
.dynatree-node.dynatree-drop-target:not(.dynatree-drop-before):not(.dynatree-drop-after).dynatree-drop-accept {
    border: 1px solid var(--main);
}
.dynatree-node.dynatree-drop-target:not(.dynatree-drop-before):not(.dynatree-drop-after).dynatree-drop-accept:after {
    position: absolute;
    content: "";
    top: calc(50% - 4px);
    left: 0;
    border: 0px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 6px solid var(--main);
    border-top: 4px solid transparent;
}
.dynatree-node.dynatree-drop-before.dynatree-drop-accept {
    border-top: 1px solid var(--main);
}
.dynatree-node.dynatree-drop-before.dynatree-drop-accept:after {
    position: absolute;
    content: "";
    bottom: calc(100% + 1px);
    left: 0;
    border: 0px solid transparent;
    border-bottom: 6px solid var(--main);
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
}
.dynatree-node.dynatree-drop-after.dynatree-drop-accept {
    border-bottom: 1px solid var(--main);
}
.dynatree-node.dynatree-drop-after.dynatree-drop-accept:after {
    position: absolute;
    content: "";
    top: calc(100% + 1px);
    left: 0;
    border: 0px solid transparent;
    border-top: 6px solid var(--main);
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
}

/* UseReporting table */
#dvUseReportSelection .page-content > table > tbody > tr > th {
    background-color: var(--main);
    color: white;
}

/*
=========================
===== Admin content =====
=========================
*/

/* Selected item in a list */
.selectionItem.selected, .selectionItem.highLightBackground {
    background-color: var(--main);
    color: white;
}

/* Topic screen preview signalering level indicator */
.preview-container .preview-news .preview-treedisplay-level {
    border-color: var(--main);
}

/* Already added RSS feed item */
#dvAddKnipselRssResultsDiv .rsslistitem.existing {
    background-color: var(--light);
}

/* Already added search item */
#dvAddKnipselBronResultsDiv .easyResultItem.existing {
    background-color: var(--light);
}

/* Selected source when adding a knipsel */
#dvAddKnipselBronDiv .bron.active {
  background-color: var(--main);
  color: white;
}

/* Add/Update stored query dialog header */
.dvStoreQueryHeader {
    background-color: var(--main);
    color: white;
}

/* Add/Update stored query dialog header close button */
.dvStoreQueryHeader a {
    color: white !important;
}

/* Progress bar color */
.knipsel-progress-barinner {
    background-color: var(--main);
}

/* loading screen border color */
.loading-screen-icon {
    border-top-color: var(--main);
}


/*
===========================
===== Webview content =====
===========================
*/

.webview-container .articleListItem.selected a {
    background-color: var(--main);
    color: white;
}

/*
==============================
===== Connector settings =====
==============================
*/

/* Selected connector */
#dvSourceListEditActiveSelectBox .feedlistitem.selected {
  background-color: var(--main);
  color: white;
}