:root {
    --bg-color: black;
    --bg-contrast: white;
    --txtcolor: white;
    --txtcontrast: black;
    --graycolor: gray;
}


[data-theme="white"] {
    --bg-color: white;
    --bg-contrast: black;
    --txtcolor: black;
    --txtcontrast: white;
}

[data-theme="dark"] {
    --bg-color: black;
    --bg-contrast: white;
    --txtcolor: white;
    --txtcontrast: black;
}

[data-theme="white"] #searchinbase {
    box-shadow: 0px 3px 3px var(--bg-contrast);
}

[data-theme="white"] div.albumsList {
    background-color: var(--graycolor);
}

table  {
    border-collapse: collapse;
}
table tr {
    border-top:1px dashed var(--bg-contrast);
    border-bottom:1px dashed var(--bg-contrast);
}
div.consultus a {
    background: var(--bg-contrast);
    color:var(--txtcontrast);
}



[data-theme="white"] img.wave {
    background: var(--bg-contrast);
    border-radius: 5px;
    padding:5px;
}
[data-theme="white"] .albumimage {
    background: var(--graycolor);
    padding:5px;
    text-align: center;
    padding-top: 1px;
    padding-bottom: 1px;
}

button.data-theme-toggle {
    background: var(--bg-color);
    border:none;
}


a,
.content,
.normalback {
    background: var(--bg-color);
    color: var(--txtcolor);
}

.form-group div label {
    color: var(--txtcolor);
}

.form-group div select,
div.view.content .form-group div div,
.form-group div input:not([type="checkbox"]) {
    border: 1px solid var(--grey-4, #cbd5e1);
    background: var(--nuance-white, #fff);
    /* Shadow/xs */
    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
}


#currenttags #lestags,
.cartcontent {
    background: var(--bg-contrast);
    color: var(--txtcontrast);
}

#currenttags #lestags span a,
#currenttags #lestags span {
    color: var(--txtcolor);
    background: var(--graycolor);
}

div.playlists.index.content h3 span,
div.artists.index.content h3 span,
div.albums.index.content h3 span,
div.searchresults.index.content h3 span {
    background: var(--graycolor);
}

div.more a {
    background: var(--graycolor);
    color:white;
}

/* Albums */


div.index div.ingrid>div span {
    color: var(--txtcolor);
}

h2.title {
    background-color: var(--graycolor);
}

.mininfos_content {
    background: var(--graycolor);
}

tr.onemedia {
    border-top: 2px solid var(--bg-contrast);
    border-bottom: 2px solid var(--bg-contrast);
}

ul.social.row {
    color: var(--txtcolor);
}

.message.warning {
    background: #fffabc;
    color: #8d7b00;
    border-color: #d3b800;
}

main.main aside#tagbar ul.unetaxonomie .untag.keyactive a,
main.main aside#tagbar ul.unetaxonomie .untag.keyactive {
    background-color: aqua;
    color: var(--txtcontrast);
}

main.main aside#tagbar ul.unetaxonomie .untag.keyinactive *,
main.main aside#tagbar ul.unetaxonomie .untag.keyinactive {
    color: var(--graycolor);
}

#cartcontent {
    background: var(--bg-contrast);
    color: var(--txtcontrast);
}

#cartcontent div.row a {
    background: var(--bg-contrast);
    color: var(--txtcontrast);
}

#cartcontent div.row a.button {
    background: var(--bg-color);
    color: var(--txtcolor);
}

.top-nav-title a {
    color: #d33c43;
}

.top-nav-title span {
    color: #404041;
}

/* Flash messages */
.message {
    background: #eff8ff;
    color: #2779bd;
}

.message.success {
    background: #e3fcec;
    color: #1f9d55;
    border-color: #51d88a;
}

.message.warning {
    background: #fffabc;
    color: #8d7b00;
    border-color: #d3b800;
}

.error-message,
.message.error {
    background: #fcebea;
    color: #cc1f1a;
    border-color: #ef5753;
}

.prev.disabled a,
.next.disabled a {
    color: #606c76;
}

.unpricetype>h3 {
    background: gray;
    color:white;
} 
div.pricetypes.index.content div.unpricetype div div.accordeon label.leaccordeon.accordeon h3.accordeon.titre {
    background: lightslategrey;
    color:white;
}
div.pricetypes.index.content div.unpricetype div div.accordeon label.leaccordeon.accordeon h3.accordeon.titre:hover { 
    background: #80808099;
}

