/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

:root {
  --blue-coal-color: #515559;
  --albescent-white-color: #F7E9DE;
  --spanish-pink-color: #F0BBB4;
  --terra-cotta-color: #D4401C;
  --peach-fuzz-color: #FFBE98;
  --medium-cyan: #1880A0;
}

.text-color-blue-coal {
  color: var(--blue-coal-color);
}

.bg-albescent-white {
  background-color: var(--albescent-white-color);
}
.bg-peach-fuzz {
  background-color: var(--peach-fuzz-color);
}

 /* on iphone: need to add padding, otherwise navbar at bottom covers up bottom portion of page */
body {
  padding-bottom: 85px; 
}

 /* General stying of background of app and text in app */
h1, h2, h3, h4, h5 {
  color: var(--blue-coal-color);
  /* font-family: 'Josefin Sans', sans-serif; */
}

#admin-button {
  border: 2px solid var(--blue-coal-color);
  background-color: var(--blue-coal-color);
  border-radius: 6px;
  color: #FFF;

}

/* ----------------------- */
/* Tabletop Primary Button */
/* ----------------------- */
.btn-tabletop-primary {
  color: var(--terra-cotta-color);
  border: 2px solid var(--terra-cotta-color);
  background-color: #FFF;
}

.btn-tabletop-primary:hover {
  background-color: var(--terra-cotta-color);
  color: var(--albescent-white-color);
  border-color: var(--terra-cotta-color);
}

/* tough getting pseudo selector to work without !important */
.btn-tabletop-primary:active {
  color: var(--terra-cotta-color) !important;
  border: 2px solid var(--terra-cotta-color) !important;
  background-color: #FFF !important;
}
/* ----------------------- */
/* Tabletop Primary Button */
/* ----------------------- */

.tabletop-navbar {
  border-top: 2px solid var(--terra-cotta-color);
  background-color: #FFF;
}

.nav-link {
  color: var(--terra-cotta-color);
}

.nav-link.text-medium-cyan {
  color: var(--medium-cyan);
}

.navbar-nav .nav-link.active {
  background-color: var(--peach-fuzz-color);
  color: #383B3D;
  border-radius: 15px;
}

.nav-link:hover {
  color: #383B3D;
}


.table.table-albescent-white>:not(caption)>*>* {
  background-color: var(--albescent-white-color);
}


tbody, td, tfoot, th, thead, tr {
  border-color: var(--blue-coal-color);
}

strong.tt-strong, i.tt-item-icon {
  color: var(--blue-coal-color);
}


.board-games-controls-top-border-radius {
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}

.board-games-controls-bottom-border-radius {
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}


button:active:not(.accordion-button), a:active:not(.accordion-button) {
  transform: scale(0.97); /* slightly shrink for pressed look */
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);
}


.digg_pagination {
  /* background: var(--albescent-white-color); */
  cursor: default;
  /* self-clearing method: */ }
  .digg_pagination a, .digg_pagination span, .digg_pagination em {
    padding: 0.2em 0.5em;
    margin-right: 1px; }
  .digg_pagination .disabled {
    color: #999999;
    background: #FFF;
    border: 1px solid #dddddd; }
  .digg_pagination .current {
    font-style: normal;
    background: #2e6ab1;
    color: var(--blue-coal-color);
    border: 1px solid #2e6ab1; }
  .digg_pagination a {
    text-decoration: none;
    background: #FFF;
    color: var(--terra-cotta-color);
    border: 1px solid var(--terra-cotta-color); }
    .digg_pagination a:hover, .digg_pagination a:focus {
      background-color: var(--terra-cotta-color);
      color: var(--albescent-white-color);
      border-color: var(--terra-cotta-color);
  .digg_pagination .page_info {
    background: #f8f9fa;
    color: var(--blue-coal-color);
    padding: 0.4em 0.6em;
    margin-bottom: 0.3em;
    text-align: center; }
    .digg_pagination .page_info b {
      color: #000033;
      background: var(--albescent-white-color);
      padding: 0.1em 0.25em; }
  .digg_pagination:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden; }
  * html .digg_pagination {
    height: 1%; }
  *:first-child + html .digg_pagination {
    overflow: hidden; }}


.dropdown-menu {
  z-index: 1050; /* Same as Bootstrap modals */
}


.no-border {
  border: none !important;
  box-shadow: none; /* optional: removes focus ring */
}