/* ==========================================================================
   16_SPECIFICS
   --------------------------------------------------------------------------
   * README

   * BANNER: MAIN

   * DASHBOARD: SITE
   * DASHBOARD: SECTION
   * DASHBOARD: GRID

   * DASHBOARD: DASHLETS: ARTICLE
   * DASHBOARD: DASHLETS: INFO ORGANIZATION

   * DASHBOARD: REPORTS: SECTION
   * DASHBOARD: REPORTS: ARTICLE
   * DASHBOARD: REPORTS: INFO ORGANIZATION

   * DASHBOARD: STATS: SECTION
   * DASHBOARD: STATS: ARTICLE

   * DETAIL ASIDE: PIPELINE: INFO ORGANIZATION

   * NEW REQUISITION: BALANCED BUTTONS PATCH
   * BLOCKING LOGIN: SITE

   * PAGETYPE: PROFILE PAGE
   * PAGETYPE: OPEN REQUISITIONS
   * PAGETYPE: OPEN REQUISITIONS: POPUP

   ========================================================================== */

/* README
   ========================================================================== */

/*
 * Styles on this stylesheet are the All specific styles.
 * That means they apply to any page that deals with an exception to any
 * default style.

 * If you need to deal with an exception to any default styles, you should
 * manage it by adding a .X--modifier class to the .X element and develop the
 * given exception nested to this .X--modifier class in this stylesheet under
 * the corresponding page subtitle.

 * These .X--modifier classes and its nested styles are grouped by page in which
 * are featured, sorted by HTML depth, and separated in Structure, Behaviour or
 * Appearance styles as appropriate.
 */

/* BANNER: MAIN
   ========================================================================== */

/* DETAIL ASIDE: PIPELINE: INFO ORGANIZATION
   ========================================================================== */
.list--pipeline a {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: var(--dividers--border--color);
    padding: var(--spacer--s) 0;
}

.list--pipeline .list__item__count {
    width: calc(var(--sizing--basis) * 9);
    margin-right: var(--spacer--m);
    text-align: right;
}

.list--pipeline .list__item__count__value {
    font-size: 3.2rem;
    color: var(--color--clickeable);
}

.list--pipeline .list__item__text {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.list--pipeline .list__item__text__title {
    font-size: 1.4rem;
}

.list--view-more .list__item__text__title, .list--view-more .list__item:hover .list__item__text__title {
    color: var(--color--font);
}

/* SUCCESS
   ========================================================================== */

.article--view-more--content .article__header__text__title{
    font-size: 2rem;
}

.list--view-more a{
    color: var(--color--font);
}

.section--success .section__header__text__title > span {
    display: block;
}

.section--success .article--view-more--content .article__header{
    justify-content: space-between;
}

/* NEW REQUISITION: BALANCED BUTTONS PATCH
   ========================================================================== */

/* Media query to target tablet and desktop */
@media all and (min-width:751px) {
    .article--from-scratch {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        height: 100%;
    }

    .article--from-scratch .article__content {
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
    }

}

/* TABS
   ========================================================================== */

/* inverting the colors */

.tabs__list__item:not(.tabs__list__item--active),
.tabs__list__item:not(.tabs__list__item--active):link,
.tabs__list__item:not(.tabs__list__item--active):visited {
    color: inherit;
}

.tabs__list__item:not(.tabs__list__item--active):hover,
.tabs__list__item:not(.tabs__list__item--active):focus,
.tabs__list__item:not(.tabs__list__item--active):active {
    color: inherit;
}

.tabs__list__item--active,
.tabs__list__item--active:link,
.tabs__list__item--active:visited,
.tabs__list__item--active:hover,
.tabs__list__item--active:focus,
.tabs__list__item--active:active {
    color: inherit;
}

/* LIST CONTROLS
   ========================================================================== */

/* inverting the colors */

.dropdown__placeholder:hover,
.dropdown__placeholder:focus {
    color: var(--color--clickeable);
}

.dropdown__list__item:not(.dropdown__list__item--active) a {
    color: var(--fields--font--color);
}

.dropdown__list__item--active a {
    color: var(--color--clickeable);
}

.list-controls__sort .dropdown__list .sort__item:not(.sort__item--active) {
    color: var(--fields--font--color);
}

.list-controls__sort .dropdown__list .sort__item--active {
    color: var(--color--clickeable);
}

.list-controls__sort .dropdown:hover .dropdown__list .sort__item:hover {
    background-color: #FFFFFF;
    color: var(--color--clickeable);
}

.list-controls__sort .dropdown:hover .dropdown__list .sort__item:hover .sort__arrow {
    color: #333333;
}

.sort__item .sort__arrow {
    color: #333333;
}

.sort__item:hover .sort__arrow--asc,
.sort__item:focus .sort__arrow--asc,
.sort__item:active .sort__arrow--asc,
.sort__item--ASC .sort__arrow--asc {
    color: var(--color--clickeable);
}

.sort__item--ASC:hover .sort__arrow--desc,
.sort__item--ASC:focus .sort__arrow--desc,
.sort__item--ASC:active .sort__arrow--desc,
.sort__item--DESC .sort__arrow--desc {
    color: var(--color--clickeable);
}

/* HEADER
   ========================================================================== */
.header__logo {
    background-image: var(--logo--background--image);
}

/* BANNER: MAIN
   ========================================================================== */
.banner--main {
    background-image: var(--banner--background--image);
}

@media (max-width: 750px) {

    .banner--main {
        background-position: left;
    }

}

/* MOBILE MENU
   ========================================================================== */
a[class*="__trigger"] {
    background-image: url('../images/icon--menu.svg');
}

/* DATASET
   ========================================================================== */
.removeDatasetRow {
    background-image: url('../images/icon--remove.svg');
}

.addDatasetRow {
    background-image: url('../images/icon--add.svg');
}

/* FILE UPLOAD
   ========================================================================== */
div[class*="fieldSpec"].FileField div[id*="fileInput_"] > button,
div[class*="fieldSpec"].FileField div[id*="fileInput_"] > button:hover,
div[class*="fieldSpec"].FileField div[id*="fileInput_"] > button:active,
div[class*="fieldSpec"].FileField div[id*="fileInput_"] > button:focus {
    background-image: url('../images/icon--remove.svg');
}

/* PHOTO UPLOAD (PENDING)
   ========================================================================== */
div[class*="fieldSpec"].FileField div[id*="fileInputContainer_"] .photoInputPreviewWrapper .photoInputPreviewContainer.photoPreviewUnselected {
    background-image: url('../images/icon--user.svg');
}

/* BLOCKING LOGIN: SITE
   ========================================================================== */
.body--login {
    background-image: var(--login__body--background--image);
}

.article--login .article__header__text__title {
    background-image: var(--logo--background--image);
}

.article--login .article__header {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}

.article--login .article__header__text {
    font-size: 1.8rem;
    padding-top: var(--spacer--m);
    font-weight: var(--font--weight--bold);
}

/* PAGETYPE: PROFILE PAGE
   ========================================================================== */
.table--people img {
    width: 2.8rem;
    height: 2.8rem;
}

/* PAGETYPE: OPEN REQUISITIONS
   ========================================================================== */
.main__title__text {
    display: flex;
    flex-direction: column;
    line-height: 3.2rem;
}

.table--jobs:not(.table--cards) th:first-child,
.table--jobs:not(.table--cards) td:first-child {
    width: 9rem;
}

.table thead th {
    white-space: unset;
}

.table--default thead th {
    padding: 1.2rem 0 1.2rem 1rem;
    vertical-align: top;
}

.table--jobs .th--narrow {
    max-width: 13rem;
}

.table--jobs .th--date {
    min-width: 11rem;
}

.table--jobs .sort__stack {
    height: unset;
    line-height: unset;
    vertical-align: top;
}

/* PAGETYPE: OPEN REQUISITIONS: POPUP
   ==========================================================================*/
.list__item__label {
    font-weight: var(--font--weight--bold);
}

.list--contact .list__item + .list__item{
    padding-top: var(--spacer--xs);
}

/* CORE OVERWRIDE
   ==========================================================================*/
.article--details .article__content__view__field__value > br:first-child,
.article--details .article__content__view__field__value > br:last-child {
    display: block;
}