/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

/* Base Styles */
html {
  font-size: 14px;
  position: relative;
  min-height: 100%;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

body {
  /* Margin bottom by footer height */
  margin-bottom: 60px;
}

/* Layout */
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  white-space: nowrap;
  line-height: 60px; /* Vertically center the text there */
}

/* Grid Section */
section.grid a {
  text-decoration: none;
  cursor: pointer;
  color: white;
  transition: background-color 0.15s ease-in-out;
}

section.grid a:hover {
  background-color: #4d5d6c;  /* Solar's default active background color */
}

/* Game List */
.playable {
  font-weight: bold;
}

.games-list a {
  padding: 0.25rem 0.5rem;  /* Add some padding */
}

.comp-icon,
.game-icon {
  width: 24px;
  height: 24px;
  vertical-align: middle;
}

/* Styles for green checkboxes when checked */
.form-check-input:checked {
    background-color: #2aa198; /* Green color - General */
    border-color: #2aa198;
}

/* Make links white-ish with a hover effect */
a,
a:visited {
  color: #f8f9fa; /* Bootstrap's light color */
  text-decoration: none; /* Remove underline */
}

a:hover {
  color: #adb5bd; /* A dimmer grey for hover */
}

/* Style links specifically within the main content area */
main a, main a:visited {
    color: #f8f9fa; /* Bootstrap 'light' color */
    text-decoration: none; /* Remove underline */
}

main a:hover {
    color: #adb5bd; /* A slightly darker grey for hover */
}

/* Updates Page Specific Styles */
.update-content img {
    max-width: 100%;
    height: auto;
    border-radius: 0.25rem;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.update-tag-link {
    color: #ced4da;
}

.update-tag-link:hover {
    text-decoration: underline;
}

.tractatus-content {
    max-width: 800px;
    margin: 0 auto;
}

/* CCGs Page Table Styling for Dark Theme - Vertically Compressed */
.markdown-content .table {
    border-collapse: collapse;
}

.markdown-content .table thead {
    border-bottom: 1px solid #495057; /* Thinner header border */
}

.markdown-content .table th,
.markdown-content .table td {
    border-top: none;
    border-bottom: none; /* Removed all row dividers */
    padding: 0.1rem 0.75rem; /* Minimal vertical padding */
}

/* Responsive wrapper for tables */
.table-responsive-wrapper {
    overflow-x: auto;
}

/* Multi-column list for Engine page */
.multi-column-list {
  column-width: 250px;
  column-gap: 1.5rem;
}