/* Stylesheet for army lists.  It's also used for the index page. */

/* Make the whole thing match the width of an A4 page for printing. */
body {
    width: 210mm;
}

/* Make tables fit the page, and apply a basic visual style. */
table {
    width: 95%;
    border-collapse: collapse;
    margin: auto;
    margin-top: 15px;
    margin-bottom: 15px;
    page-break-inside: avoid;
}
td, th {
    padding: 4px;
}
.stat-centre {
    text-align: center;
}
.stat-buffed {
    text-align: center;
    color: #33ff33;
    font-weight: bold;
}
.stat-left {
    text-align: left;
}
.stat-right {
    text-align: right;
}
.title, .title_nofill {
    padding: 10px;
    font-variant: small-caps;
}
.title {
    color: #ffffff;
    background-color: #000000;
}
.title a {
    color: #ffffff;
}
.title a:visited {
    color: #999999;
}

/* Ensure squad cards don't get split when printing, and add a border to group
   their contents. */
.squad, .detachment_header, .army_header {
    border: 2px solid #000000;
    border-radius: 10px;
    margin-bottom: 20px;
    margin-top: 20px;
    page-break-inside: avoid;
    position: relative;
}

.cards {
    column-width: 100mm;
}

.cards .squad {
    width: 100mm;
    font-size: 11px;
}
.cards table {
    font-size: 11px;
}

.squad_portrait_cell {
    width: 64px;
    padding: 0px;
    vertical-align: top;
}

.squad_portrait {
    width: 64px;
    height: 64px;
    border: 2px solid #000000;
}

.experience_gauge {
    margin-left: 10px;
    margin-right: 10px;
    text-align: right;
}

.experience_cell, .experience_cell_checked, .experience_cell_level, .experience_cell_level_checked {
    border: 1px solid #000000;
    width: 16px;
    height: 16px;
    display: inline-block;
}

.experience_cell_level, .experience_cell_level_checked {
    border-color: #ee3300;
}

.experience_cell_checked {
      background: linear-gradient(to bottom right, transparent 45%, #000 45%, #000 55%, transparent 55%),
                  linear-gradient(to bottom left, transparent 45%, #000 45%, #000 55%, transparent 55%);
}

.experience_cell_level_checked {
      background: linear-gradient(to bottom right, transparent 45%, #ee3300 45%, #ee3300 55%, transparent 55%),
                  linear-gradient(to bottom left, transparent 45%, #ee3300 45%, #ee3300 55%, transparent 55%);
}


/* The name of an ability should stand out. */
.ability_tag {
    font-weight: bold;
}

/* The notes on a squad. */
.notes {
    text-align:center;
    font-style: italic;
}

/* The inline costs on a squad. */
.inline_costs {
    padding: 4px;
    width: 80%;
    margin-left: 20px;
}

.extra_space {
    height: 20mm;
}