/* Eigenchampions stylesheet.  Section headers + brief guards only;
   full commentary in the parallel eigen-css.md (repo-only, not
   deployed).  Canonical copy: edit here, then copy to
   ~/Dropbox/Public/assets/eigen.css for local browser preview; deploy.sh
   pushes that copy live. */

/* page */
html, * {
	padding:0;
	margin:0;
}

body {
	background-color:#DADADA;
	font-family:Garamond, "Garamond", Times, serif;
	font-size:1.4em;
	margin:0 auto;
	padding:20px 0;
	max-width:1200px;
	}

/* headers */
h1 {
	color:#FFFFFF;
	text-align:center;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:1.8em;
	padding-bottom:20px;
	text-decoration:none;
}

h2 {
	padding-top:10px;
	padding-bottom:3px;
	color:#00003C;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:1.3em;
}

h3 {
	padding-top:5px;
	padding-bottom:2px;
	color:#00003C;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:1.1em;
}

p.small {font-size:85%;}

/* paragraphs */
p {
	margin:5px 2px 10px 2px;
	line-height:1.3em;
}

/* links */
a {color:#4D4D77; text-decoration:none;}
a:visited {color:#4D4D81;}
a:hover {color:#592626;}

/* divs */
div#wrap {
	width:80%;
	background-color:#FFFFFF;
	margin:0 auto;
	padding:10px;
	min-width:780px;
}

div#header {
	background-color: #00003C; /* Main title background color */
	padding-top:10px;
	border:1px solid #B69468;
}


div#header h2 {
	color:#FFFFFF;
	text-align:center;
	font-family:Geneva, Arial, Helvetica, sans-serif;
	font-size:1.4em;
	padding-bottom:25px;
	padding-top:0px;
}

div.nav {
	background-color:#4D4D77;
	margin:5px 0;
	width:100%;
	height:30px;
	min-width:780px;
	overflow:hidden;
}

div.nav ul {
	list-style:none;
	margin:0;
	padding:0;
	clear:both;
}

div.nav ul li {
	float:left;
}

div.nav ul li a {
	float:left;
	padding:5px 8px 5px 6px;
	height:20px;
	font-weight:bold;
	color:#FFFFFF;
	text-decoration:none;
	display:block;
}

div.nav ul li a:hover {
	background-color: #592626;
}

div.nav ul li a.selected, div.nav ul li a.selected:hover {
	background-color:#FFFFFF;
	color:#4D4D77;
}

div.narrow {
	background-color: #8282A0;
	max-width:960px;
	border-width: 0px;
	padding: 0px 0px;
	letter-spacing: 0px;
	word-spacing: -2px;
	}

div#content { margin:2px 6px;}

div#footer {
	clear:both;
	border-top:1px solid #DDDDDD;
}

div#footer p {
	font-size:0.9em;
	text-align:center;
}

span#note {
	color:white;
	font-family:courier;
	font-size:0.8em;
	vertical-align:bottom;
	float:right;
}

.pretty-table {
  padding: 0;
  margin: 0;
  border-collapse: collapse;
  border: 1px solid #333;
  font-family: Garamond, "Garamond", Times, serif;
  font-size: 0.9em;
  color:#000033;
  background:#E6E6EC;
}

.pretty-table caption {
  caption-side: top;
  font-size: 1.2em;
  font-style: normal;
  text-align: center;
  padding: 0.5em 0;
}

.pretty-table th, .pretty-table td {
  border-bottom: 1px dotted #666;
  padding: 0.15em 0.25em;
  text-align: left;
}

/* top left cell */
.pretty-table th[scope=col]  {
  color: #000;
  background-color: #8282A0;
  text-transform: uppercase;
  font-size: 0.9em;
  border-bottom: 2px solid #4D4D77;
}

/* column headers */
.pretty-table th+th[scope=col] {
  color: #fff;
  background-color: #8282A0;
}

/* row headers */
.pretty-table th[scope=row] {
  background-color: #AFAFC2;
  border-right: 1px solid #4D4D77;
}

 /* # even rows */
table.pretty-table tbody tr:nth-child(even) {color: #800000;}

.pretty-table tr:hover th[scope=row], .pretty-table tr:hover td {
  background-color: #592626;
  color: #fff;
 }

/** Season navigation **/

.season-nav {
  table-layout: fixed;
}

.season-nav th {
  width: 33.33%;
}

/** Summary table **/
/* Full design + history: eigstyles-css.md. */

.summary-table td {
  padding: 0 0.35em;
}

.summary-table, .summary-nav {
  min-width: 780px;
}

@media (min-width: 980px) {
  .summary-table, .summary-nav {
    width: 100%;
  }
}

.summary-table td:first-child, .summary-table td:last-child {
  white-space: nowrap;
}

.summary-table td:nth-child(n+5) {
  text-align: center;
}

.summary-table td:nth-child(4),
.summary-table td:nth-child(6) {
  padding-left: 0.7em;
}

.summary-table tr:first-child td {
  background: rgba(130, 130, 160, 0.18);
  white-space: nowrap;
}

.summary-table tr:not(:first-child) td > :is(span, b):is([title], [data-title]) {
  display: block;
  margin: 0 -0.35em;
  padding: 0 0.35em;
}

.summary-table :is(span, b):is([title], [data-title]):hover {
  background: rgba(130, 130, 160, 0.5);
}

/** Summary nav (prev/next transition row) **/
/* Separate from .summary-table on purpose -- see eigstyles-css.md. */

.summary-nav {
  table-layout: fixed;
}

.summary-nav td {
  width: 33.33%;
  padding: 0 0.4em;
  overflow-wrap: break-word;
  background: rgba(130, 130, 160, 0.18);
}

.summary-nav td:first-child { text-align: left; }
.summary-nav td:nth-child(2) { text-align: center; }
.summary-nav td:last-child { text-align: right; }

/** Tap/hover tooltips (all devices) **/
/* Document touchstart listener (Notes/PageHTMLfooter2.txt) enables
   this on iPad Safari; anchors excluded on purpose.  data-title is the
   generator's current output; title is read too as a dual-read
   fallback for not-yet-regenerated pages -- see eigstyles-css.md. */

:is(td, th, span, b):is([title], [data-title]) { position: relative; }

:is(td, th, span, b)[title]:hover::after { content: attr(title); }
:is(td, th, span, b)[data-title]:hover::after { content: attr(data-title); }

:is(td, th, span, b):is([title], [data-title]):hover::after {
  position: absolute;
  top: 100%; left: 0;
  z-index: 200;
  pointer-events: none;
  background: rgba(32, 32, 32, 0.95);
  color: #fff;
  border-radius: 5px;
  box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.4);
  padding: 6px 9px;
  font: normal 13px/1.45 -apple-system, "Segoe UI", sans-serif;
  text-align: left;
  text-shadow: none;
  text-transform: none;
  white-space: pre-wrap;
  width: max-content;
  max-width: 280px;
}

:is(td, th):is([title], [data-title]):nth-last-child(-n+3):hover::after {
  left: auto; right: 0;
}

.pretty-table th[scope=col]:is([title], [data-title]):hover::after {
  top: auto;
  bottom: 100%;
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}

.fixed { position: fixed;}