/* Dark theme */
    :root {
        --border-debug: red;
        --border-header: blue;
        --border-main: violet;
        --border-article: orange;
        --border-heading: green;
        --dialog-bg: saddlebrown;
        --dialog-border: #666;
        --dialog-text: white;
        --buttonbar-bg: green;
        --debug-panel-bg: #1a1a1a;
        --debug-panel-border: #333;
        --debug-text: #00ff00;
    }
/* Base colors */
body {
    border-color: var(--border-debug);
    background-color: #352e2e; 
}
    * {
        color: white;
        background-color:inherit;
    }
    video, canvas, img {
            background: aliceblue;
    }
    button,
    datalist {
        background-color: rgb(85, 85, 85);
        color: #ffffff;
    }

    input, select {
        color: rgb(179, 255, 179);
        background-color: rgb(102, 86, 86);
        border: 1px solid;
        border-color: #696 #363 #363 #696;
    }
 a {color:yellow;}
 .menu summary span {
    background: azure;
 }
 
.highlight {
    border: solid yellow;
    transition: border 0.5s ease;
    background: black!important;
}

main {
    border-color: var(--border-main);
}
*::placeholder { 
 //     color: blue; /* Puoi impostare un colore grigio chiaro per la leggibilità */
  }
 

h2 {
    border-color: green;
}


#idMenuItems{
    background: black; 
}
/* Button colors */
.buttonbar {
    background: var(--buttonbar-bg);
}

/* Debug Panel colors */
#idDebugPanel {
    background-color: black;
    border: solid thick red;
}
#idDebugPanel mark {color:red}

.clsAppMessage,
.clsSplash {
 background-color: darkblue;
}

.clsButton {
    color: white;
    background-color: #4CAF50;
}

mark {
     color:red;
}

.fade-out-message {
    background: orange;
    }