/*
 * Main.
 */

/** Element modifications **/
body {
    color: var(--uavcan-body-text-color, inherit);
    /* Proper overflow handling */
    overflow-wrap: break-word;
    word-wrap: break-word;     /* synonym for overflow-wrap */
    word-break: break-word;
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}
h1   { font-size: 1.6em; font-weight: bold; }
h2   { font-size: 1.2em; font-weight: bold; }
h3   { font-size: 1em; font-weight: bold; }
h4   { font-size: 1em; font-weight: normal; font-style: italic }
a    { color: var(--uavcan-link-text-color, inherit); }
i    { width: 20px; text-align: center }
img  { max-width: 100% }

/** Attribute modifier classes **/
.w-unset { width: unset; }
.table-sm td,
.table-sm th {
    padding: .3rem 1rem;
}
.table .thead-light th { color: inherit; }
table.table-nowrap {
    border-collapse: collapse;
    white-space: nowrap;
}
.lh-125 {
    line-height: 1.25;
}
.font-size-120 {
    font-size: 120%;
}


/** Navbar heading **/
.navbar-brand {
    margin-right: unset;
}
.navbar-nav .nav-link {
    color: var(--uavcan-navbar-major-text-color, inherit)!important;
    font-weight: normal;
}
.navbar-nav .nav-link.active {
    color: var(--uavcan-navbar-active-color, inherit);
    font-weight: 600;
}
nav .nav-link.nav-minor {
    color: var(--uavcan-navbar-minor-text-color, inherit)!important;
}
nav .nav-link.nav-l1-active {
    color: var(--uavcan-navbar-major-text-color, inherit);
    font-weight: 600;
}
.bg-navbar {
    background-color: var(--uavcan-header-bg-color);
}
.navbar-light .navbar-toggler {
    border-color: var(--uavcan-navbar-toggler-color);
}
.navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/** Sidebar **/
.sidebar {
    height: calc(100vh - 2rem);
    overflow-y: auto;
}
.sidebar .nav .nav-heading {
    color: var(--uavcan-navbar-heading-color, inherit)!important;
    font-size: 110%;
    font-weight: 700;
}
.sidebar .nav .nav-link {
    color: var(--uavcan-navbar-major-text-color, inherit);
    padding: .5rem .75rem;
}
.sidebar .nav a:hover {
    color: var(--uavcan-navbar-hover-text-color, inherit);
}
.sidebar .nav .nav-l2 {
    color: var(--uavcan-navbar-minor-text-color, inherit);
    font-size: 90%;
    padding: .25rem 1.25rem;
}
.sidebar .nav .nav-l2.active {                              /* .active used by scroll-spy */
    color: var(--uavcan-navbar-major-text-color, inherit);
}

/** Carousel **/
.carousel-caption {
    bottom: 0;                      /* Stick to the very bottom */
    text-shadow: 0 0 1px #000, 0 0 1px #000, 0 0 2px #000, 0 0 2px #000;
    line-height: 1.2;
    padding-left:  0.5em;
    padding-right: 0.5em;
    hyphens: none;
}
.carousel-caption > *       { margin-bottom: .3rem; }
.carousel-caption .credits  { font-size: small; }
.carousel-item img          { filter: brightness(70%); }

@media all and (min-width: 992px) {
    /* If the medium is large, tint only the caption instead of the whole image. */
    .carousel-item img { filter: none; }
    .carousel-caption  { background: rgba(0, 0, 0, 0.5); }
}

/** Feed cards **/
.card img  {
    max-width: unset;
}
.feed-header h2 {
    font-size: 1.0em;
}
div.thumbnail {
    width: 4.5rem;
    overflow: hidden;
}
div.thumbnail a img {
    height: 3.5rem;
}

/** Adopters flex-box **/
.adopters-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
}
.adopters-container img {
    object-fit: contain;
    width: 100%;
    height: 100%;
}
.adopters-container img:hover {
    filter: none;
}
.adopters-entry-small {
    margin: 15px;
    flex-grow: 1;
    flex-shrink: 1;
    height: 2rem;
    max-width: 8rem;
}
.adopters-entry-large {
    margin: 15px;
    flex-grow: 1;
    flex-shrink: 1;
    height: 3rem;
    max-width: 12rem;
}
@media (pointer:fine) {
    .adopters-container img {
        filter: contrast(50%);
    }
}

/** Code block styles **/
pre {
    color: var(--uavcan-code-text-color);
    background-color: var(--uavcan-code-bg-color);
    padding: 0.5rem 1rem;
}
code {
    color: var(--uavcan-code-text-color);
}
code.comment {
    color: var(--uavcan-code-comment-color);
    font-style: italic;
}
code.type {
    color: var(--uavcan-code-text-color);
    font-weight: bold;
}
code.value {
    color: var(--uavcan-code-value-color);
}
code.emphasis {
    color: var(--uavcan-code-em-color);
}

/** Blockquote styles **/
.blockquote {
    font-size: 100%;
    color: var(--uavcan-code-text-color);
    background-color: var(--uavcan-code-bg-color);
    padding: 0.5rem 1rem;
    border-left: 4px solid var(--uavcan-cyan);
}
.blockquote-footer {
    padding: unset;
    text-align: right;
}

/** Highlight box block **/
.highlight-box {
    border: 4px solid var(--uavcan-highlight-box-border);
}

/*
 * Footer.
 */
footer {
    text-align: center;
    font-size: 0.8em;
    line-height: 1.5em;
    color: var(--uavcan-footer-text-color, inherit);
}
footer p {
    margin-bottom: 0.5em;
}
footer a img {
    padding: 0.5em;
}
footer span {
    word-break: keep-all;
    white-space: nowrap;
}