:root {
  --border: #ccc;
  --accent-bg: #f5f7ff;
}

/*
** This program and library is free software; you can redistribute it and/or 
** modify it under the terms of the GNU (Library) General Public License 
** as published by the Free Software Foundation; either version 2 
** of the License, or any later version. 
** 
** This program is distributed in the hope that it will be useful, 
** but WITHOUT ANY WARRANTY; without even the implied warranty of 
** MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 
** GNU (Library) General Public License for more details. 
** 
** You should have received a copy of the GNU (Library) General Public License
** along with this program; if not, write to the Free Software 
** Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA  02111-1307, USA 
**/

/*
** Default stylesheet for hypermail archives
** 
** Last revised: 04/Nov/2021
**/

html {
    color: black;
    background-color:  #ffffff; /* was: #FFEEC2 */
}

body {
    margin: 20px;
    line-height: 1.4;
    background: transparent;
    font-family: sans-serif;
    color: black;
}

pre {
    font-family: monospace;
}

/* for displaying a message's body */
pre, .body {
    color: black;
    background-color: white; 
    padding: 0.5em;
    white-space: pre-wrap;
    overflow-wrap: break-word;
}

/* a div.showhtml-body encapsulates
** the body of a message when using the
** showhtml option */
div.showhtml-body {
    margin-top: 0.5em;
    padding-top: 0.5em;
    padding-left: 0.75em;
    padding-right: 1em;
    background-color: white;
}

/* in 2.5.0, txt2html() is generating a <br> as the first element; we
   ignore it until we can fix the code  */
div.showhtml-body > br:first-child {
    display: none;
}

div.showhtml-body p {
    padding-top: 0em;
    padding-bottom: 0em;
    margin-bottom: 0em;
    margin-top: 0.75em;
}

/* used for signatures when using showhtml */
div.showhtml-body pre {
    padding-top: 0.75em;
    margin-top: 0em;
    padding-left: 0em;
    margin-left: 0em;
}

/* a div.inline-body encapsulates
** the body of a message when using the
** inlinehtml option */
div.inlinehtml-body {
    margin-top: 1em;
    padding: 0.74em;
    padding-top: 0.2em;
    color: black;
    background-color: white;
}

div.inlinehtml-body p {
    padding-top: 0em;
    padding-bottom: 0em;
    margin-bottom: 0em;
    margin-top: 0.75em;
}

/* Not too big on the heading - they can be long */
h1 { font-size: 120% }

/* use the following rule if you want to add some style to the
archive's name as displayed in the h1 of each index */
/* .archive-label  { } */

/* don't print the navbars pointing to the next message and indexes */
@media print {
 #upper, #navbarfoot, #navbar {
    display: none;
  }
}

/* for displaying the headers */
.heading {font-weight: bold; }
.message-id { font-size: 0.9em; }
span.message-id > span.heading { font-size: revert; }

p.received { margin-bottom: 0; }

table { margin-left: 2em; }
nav ul {list-style: none; }
address { font-style: inherit; }

.quotelev1 {color : #990099; }
.quotelev2 {color : #ff7700; }
.quotelev3 {color : #007799; }
.quotelev4 {color : #95c500; }
.period {font-weight: bold; }

.messages-list, .mail, .summary-year  {
    border-top:    thin solid black;
    border-bottom: thin solid black;
}

.messages-list-author {
    font-style: italic;
}
.messages-list-date {
    font-style: italic;
}

.colophon {
    font-style: italic;
}

/*
**  accessible breadcrumbs 
*/
nav ul {list-style:none; }

nav.breadcrumb ul { padding: 0; }
nav.breadcrumb ul li { display: inline; }
nav.breadcrumb ul li+li::before { content: " > "; }

/*
**  accessible horizontal menus 
*/
ul.hmenu_container { padding-left: 0; list-style: none; }
ul.hmenu_container > li { list-style-type: none; }
ul.hmenu_container .heading {  }
ul.hmenu { font-style: normal; padding: 0; display: flex; margin-left: 0; padding-left: 0; }
ul.hmenu li { flex: 1; font-size: 1.0em; background: #ccc; text-align: center; list-style: none; background-color: #eee; margin: 1px; padding: 5px 0; }

ul.hmenu li {
    border-right: 1.2px solid black;
    padding-right: 0.4em;
}

ul.hmenu li:last-child {
    border-right: none;
    padding-right: 0;
}

/*
**  replacement for dfn 
*/
.heading { font-weight: bold; }

h2.heading, h2.theading {
    padding-left: 0;
    font-size: inherit;
    margin-top: 0.2em;
    margin-bottom: 0;
}

/* 
** rules for the thread view
*/
h2.theading:before  {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #b83b3b;
    display: inline-block;
}

h2.theading + ul {
    list-style-type: disc;
}

/*
** default settings for narrow screens (smaller headings and padding)
*/
body {
    margin: 1em;
}

h1 {
    font-size: 1.3em;
}

h2 {
    font-size: 1.25em;
}

h3 {
    font-size: 1.125em;
}

.summary-year {
    padding-top: 1em;
    padding-bottom: 1em;
}

main.summary-year th.cell_period + th,
main.summary-year td.cell_message + td {
    padding-left: 0.5em;
}

.messages-list {
    padding-top: 1em;
    padding-bottom: 1em;
}

.messages-list ul {
    margin: 0;
    padding-left: 0;
    list-style-type: disc;
}

/* 
** inline attachments
*/
.attached-message-notice {
    font-weight: bold;
    border-bottom: thin solid black;
    padding-bottom: 1em;
}

section.message-attachments address {
    background-color: white;
    padding-top: 0.75em;
    padding-left: 0.75em;
    padding-bottom: 1.25em;;
    margin-bottom: 0px;
}

section.message-attachments pre.body {
    margin-top: 0px;
}

section.message-attachments div.showhtml-body {
    margin-top: -0.7em;
    padding-top: 0em;
}

section.message-attachments div.inlinehtml-body {
    margin-top: -1.25em;
    padding-top: 0em;
}

/*
**  bigger headings and padding on wider screens (desktops, tablets) 
*/
@media screen and (min-width: 48em) {
    body {
	margin: 1em 2.5em;
    }
    
    h1 {
	font-size: 1.6em;
    }
    
    h2 {
	font-size: 1.5em;
    }
    
    h3 {
	font-size: 1.25em;
    }
    
    ul.hmenu_container {
    }
    
    .messages-list {
	padding-top: 1.5em;
	padding-bottom: 1.5em;
    }
    
    .messages-list ul {
	padding-left: 2em;
    }
}

/*
** accessible links 
*/

/* make links visible thru focus or hover */
a:link {
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

a:visited {
    color: #754675
}

a:focus {
    outline: 2px solid;
    outline-offset: 1px;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    outline-color: #005A9C;
    cursor: pointer;
}

a:hover {
    color: #930;
    text-decoration: underline;
    text-decoration-thickness: 2px;
}

.last-message-date {
    line-height: 1em;
    padding-top: 0.25em;
}

.archived-on {
    line-height: 0;
    margin-bottom: 0.5em;
    padding-bottom: 0.25em;
}

.header {
    display: flex;
    align-items: center;
    gap: 50px;
}

hr {
  border: 0;
  border-top: 1px solid #ccc;
}

/* Format tables */
table {
  border-collapse: collapse;
  margin: 1.5rem 0;
}

td,
th {
  border-bottom: 1px solid var(--border);
  text-align: left;
  padding: 0.2rem .4rem;
  text-align: center;
}

th {
  background: var(--accent-bg);
  font-weight: bold;
  color: #666;
  text-transform: uppercase;
  padding-top: .4rem;
}

tr:nth-child(even) {
  /* Set every other cell slightly darker. Improves readability. */
  background: var(--accent-bg);
}

table caption {
  font-weight: bold;
  margin-bottom: 0.5rem;
}