/* As fontes sao auto-hospedadas e declaradas em fonts.css. */

:root {

    /* O laranja mora em theme.css, como --ds-accent. Estes dois nomes
       continuam aqui porque o resto do arquivo os usa; o VALOR e um so. */
    --primary-color: var(--ds-accent);
    --primary-color-hover: var(--ds-accent-hover);

    --font-theme-family: Quicksand, sans-serif;

}

body, 
.ui-tooltip, 
.nav-menu-bar li a, 
#directory-list-header, 
.header-top-content .header-information {
    font-family: var(--font-theme-family);
}

a,
.header-top-content .header-information a {
    transition: all .3s ease-in-out;
}

    a:hover, 
    .breadcrumbs .crumbs a:hover, 
    .header-top-content .header-information a:hover {
        color: var(--primary-color-hover);
        text-decoration: none;
    }

#directory-list-header {
    font-size: 15px;
    font-weight: 700;
}

.ui-tooltip {
    background-color: var(--site-chrome-strip);
    border: none!important;
    border-radius: 3px;
    box-shadow: 0 8px 16px rgba(0,0,0,0.24);
    color: var(--ds-text);
    font-size: 12px;
    font-weight: 600;
    padding: 5px 15px;
    max-width: 800px;
    white-space: pre-line;
}

.file-name {
    display: flex;
}

    .file-name svg {
        height: 22px;
        margin: 0 14px 0 3px;
        width: 22px;
    }

    .nav-menu-bar li a {
        font-size: 15px;
        line-height: 20px;
        text-transform: initial;
    }

.breadcrumbs .crumbs a {
    color: var(--ds-text-2);
    font-weight: 400;
}

    .breadcrumbs .crumbs svg {
        fill: var(--ds-text-3);
        position: relative;
        top: -1px;
    }

    .breadcrumbs .crumbs {
        color: var(--ds-text);
        cursor: default;
        font-weight: 700;
    }

.modal-header {
    /* O cabecalho do modal usa o accent, definido em style.css. */
}

    .modal-header .modal-title {
        font-weight: 600;
        letter-spacing: 0.5px;
    }