/*
 * ==============================================
 * Skin for oXygen generated WebHelp.
 * ==============================================
 */


/*
 * ------------------------------------------------------------------
 *  
 * Fonts.
 *  
 */

@font-face {
    font-family: 'Lato';
    src: url('resources/fonts/Lato-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('resources/fonts/Lato-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

body {
    font-family: 'Lato', sans-serif;
    background-color: #d3edff;
}

h1, h2, h3, h4, h5, h6,
.topictitle1, .topictitle2, .topictitle3, .topictitle4, .topictitle5, .topictitle6 {
    font-family: Georgia, serif;
}


/*
 * ------------------------------------------------------------------
 *  
 * Fight with bootstrap
 *  
 */
.navbar-brand {
    height: auto;
}
.navbar {
    border: none;
    border-radius: 0;
    margin: 0;
}
a,
a:hover,
a:visited {
    color: navy;
}
a:hover {
    text-decoration: none;
}

/*  Nicholas */

.topictitle1
{
  padding-top: 25px;
}

/*
 * ------------------------------------------------------------------
 *  
 * Publication titles
 *  
 */
.wh_publication_title > a {
    font-size: 1.5em;
}

/*
 * ------------------------------------------------------------------
 *  
 * Menu
 *  
 */
.wh_top_menu {
    font-size: 1.1em;
    margin: .4em 0;
    color:white;
    background-color: #530008;
}

/* The submenus */
.wh_top_menu ul ul {
    /*background-color: #f4f4f4;*/
}
.wh_top_menu ul li a,
.wh_top_menu ul li a:focus,
.wh_top_menu ul li a:hover,
.wh_top_menu.activated-on-click ul li.active {
    /*background-color: #f4f4f4;*/
    color:white;
}
.wh_top_menu ul ul li a,
.wh_top_menu ul ul li a:focus,
.wh_top_menu ul ul li a:hover {
   /* background: #e4e4e4;
*/    color:#530008;
}
.wh_top_menu ul ul li {
    border-top-color: #530008;
}

.wh_top_menu:not(.activated-on-click) ul:hover li,
.wh_top_menu:not(.activated-on-click) ul li:hover {
    /* WH-2521 Change the background color imediatelly when the current menu item (li) or other menu item is hovered. */
    transition: none;
}

.wh_top_menu:not(.activated-on-click) ul li {
    /* WH-2521 Delay the background color change on hover off. */
    transition: background-color 0.2s 1s;
}

/*
 * ------------------------------------------------------------------
 *  
 * Link to the index.
 * 
 */
.wh_indexterms_link a span {
    display: none;
}

@media only screen and (max-width : 767px) {
    .wh_indexterms_link a:before {
        bottom: 0;
    }
}


/*
 * ------------------------------------------------------------------
 *  
 * Breadcrumb
 *  
 */
.wh_breadcrumb ol {
    background-color: #530008;
}
.wh_breadcrumb ol {
    color: #fafafa;
}
.wh_breadcrumb ol a {
    color: inherit;
}
.wh_breadcrumb ol .active {
    color: white;
}


/*
 * ------------------------------------------------------------------
 *  
 * Tools and navigation
 * 
 */
.wh_tools {
    background-color: #530008;
    margin: 1em 0 2em;
}

.wh_print_link,
.wh_navigation_links,
.wh_navigation_links .navnext,
.wh_navigation_links .navprev {
}

.wh_print_link button,
.webhelp_expand_collapse_sections,
.wh_hide_highlight,
.oxy-icon-pdf-link,
.wh_navigation_links a,
.wh_navigation_links a:hover,
.wh_navigation_links a:active,
.wh_navigation_links a:visited,
.wh_print_link a:before,
.wh_navigation_links a:before,
.wh_navigation_links a:hover:before,
.wh_navigation_links a:active:before,
.wh_navigation_links a:visited:before {
    color: #347bb7;
    text-decoration: none;
}


/*
 * ------------------------------------------------------------------
 *  
 * Tiles
 * 
 */
.wh_tile {
    border-radius: .5em;
    background-color: #eeeeee;
}
.wh_tile_shortdesc {
    margin-top: 0.5em;
    text-align: center;
}
.wh_tile_title {
    font-family: Georgia, serif;
    text-align: center;
    font-size: 1.1em;
    text-decoration: none;
}
.wh_tile_title a {
}
.wh_tile_shortdesc {
    text-align: center;
}
.wh_tile_text:after {
    background: linear-gradient(to bottom, rgba(238, 238, 238, 0), rgba(238, 238, 238, 1) 50%);
}
@media only screen and (max-width : 767px) {
    .wh_tile > div {
        height: auto;
    }
}

/* 
You can style some of the tiles in a special way. 
Example:
.wh_tiles *[data-id='getting_started']{
    background-color:gray;
}
*/

/*
 * ------------------------------------------------------------------
 *  
 * Search area
 * 
 */
.wh_search_input {
    margin: 2em 0;/*
    background: white;*/
}
.wh_welcome:not(:empty) {
    margin: 0 auto;
    padding: 0 0 .5rem 0;
    text-shadow: none;
    color: #040480;
}
/* The strapline carries the front door; the supporting line explains it without shouting.
   Sized in rem, not em: the theme sets a 35px base on this container, so an em size here
   multiplies off that (2.5em came out at 87.5px and pushed the search box below the fold).
   clamp keeps it readable on a phone and stops it dominating a laptop. */
.contsys-strapline {
    font-size: clamp(1.4rem, 3.2vw, 2.1rem);
    line-height: 1.2;
    margin: 0 0 .4rem 0;
}
.contsys-support {
    font-size: clamp(.95rem, 1.4vw, 1.05rem);
    line-height: 1.5;
    max-width: 44rem;
    margin: 0 auto;
    color: #16212a;
}
.wh_search_textfield {
    border: solid 1px #CCC;
    border-radius: 5px;
    padding: 0 .5em;
    font-size: 1.2em;
    line-height: 2em;
    height: auto;
}
.wh_search_button {
    border: solid 1px #CCC;
    border-radius: 0 5px 5px 0;
    padding: 0.5em 1em;
}

/* Search autocomplete */
.ui-menu-item {
    font-size: 1.4em;
}

.ui-menu-item .ui-state-active {
    background-color: #530008;
}

/* Search relative path */
.searchresult li .relativePath a {
    color: #006621;
}

/* Search autocomplete icons */
.search-autocomplete-proposal-type-history a,
.search-autocomplete-proposal-type-history a:hover,
.search-autocomplete-proposal-type-history a:visited,
.search-autocomplete-proposal-type-history a:active {
    text-decoration: none;
    color: inherit;
    font-size: 0.8em;
}
.ui-state-active .search-autocomplete-proposal-type-history a,
.ui-state-active .search-autocomplete-proposal-type-history a:hover,
.ui-state-active .search-autocomplete-proposal-type-history a:visited,
.ui-state-active .search-autocomplete-proposal-type-history a:active {
    color: #fff;
}

/* Active search page */
#wh-search-pagination > ul > li.active > a {
    background-color: #530008;
}

.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
    border-color: #346ec5 !important;
}

/*
 * ------------------------------------------------------------------
 *  
 * Publication TOC
 * 
 */
.wh_publication_toc {
    border-radius: 3px;
    background-color: #530008;
    padding: 1.5em 2em;
    line-height: 2em;
}
.wh_publication_toc .active > .topicref a {
    color: white;
    font-weight: normal;
}
.wh_publication_toc div,
.wh_publication_toc a,
.wh_publication_toc a:visited,
.wh_publication_toc a:hover {
    color: #fafafa;
}
.wh_publication_toc a:hover {
    text-decoration: underline;
}
.topictitle3 {
    font-weight: 400
}
@media only screen and (max-width : 767px) {
    .wh_publication_toc {
        border-radius: 0;
        padding: 1em 0.5em;
        margin-top: 10px;
    }
}

/*
 * ------------------------------------------------------------------
 *  
 * Footer
 * 
 */
.wh_footer {
    text-align: center;
    padding: 1em;
}


/*
 * ------------------------------------------------------------------
 *  
 * Topic content
 * 
 */

.wh_topic_content,
.wh_content_area {
    color: black;
    line-height: 1.7em;
    background-color: #d3edff;
}


.wh_related_links,
.wh_child_links,
.wh_topic_content .related-links {
    background-color: #eeeeee;
    padding: 1.5em;
    margin-top: 1.5em;
}


.related-links a,
.related-links a:visited {
    color: #530008;
    padding-bottom: .3em;
}

/*
 * ------------------------------------------------------------------
 *  
 * Search results.
 * 
 */
.searchresult {
    list-style: none;
}

.searchresult li a {
    color: #346ec5;
}
.searchresult .shortdesclink {
    margin: .3em .5em 0 0;
}
.wh_search_expression {
    font-weight: bold;
}





/*
 * ------------------------------------------------------------------
 *  
 * Index terms.
 * 
 */
.wh_index_terms span.wh_first_letter {
    color: #346ec5;
}
.wh_index_terms #indexList {
    padding: 0;
}



/*
 * ------------------------------------------------------------------
 *  
 * Tree TOC for the main page.
 * 
 */
.wh_main_page_toc {
}


/*
 * ------------------------------------------------------------------
 *
 * ContSys website customisations (2026-08).
 *
 */

/* Front-door tile: the introduction spans the full row in brand maroon. */
.wh_tiles *[data-id='c_model_overview'] {
    width: 100%;
    max-width: 100%;
    flex-basis: 100%;
    background-color: #530008;
}
.wh_tiles *[data-id='c_model_overview'] .wh_tile_title,
.wh_tiles *[data-id='c_model_overview'] .wh_tile_title a {
    color: #ffffff;
    font-size: 1.25em;
}
.wh_tiles *[data-id='c_model_overview'] .wh_tile_shortdesc {
    color: #F5E9EA;
}
.wh_tiles *[data-id='c_model_overview'] .wh_tile_text:after {
    background: linear-gradient(to bottom, rgba(83, 0, 8, 0), rgba(83, 0, 8, 1) 50%);
}

/* Attribution footer. */
.contsys-footer {
    font-size: 0.85em;
    color: #444444;
    text-align: center;
    line-height: 1.5;
    padding: 0.5em 1em;
}
.contsys-footer a,
.contsys-footer a:visited {
    color: #530008;
}

/* ── ?embed=1: the page as presentation content ─────────────────────────────────────────────
   Framed on the hospital's lecture-theatre screen, read from metres away rather than
   centimetres. The chrome that serves a desk reader — menu, search, breadcrumb, side TOC,
   footer — spends exactly the pixels the body text needs there, so it goes, the type grows,
   and the content takes the whole frame. html-fragments/head.html sets the class. */
html.embed { font-size: 130%; }
.embed .wh_header,
.embed .wh_footer,
.embed .wh_breadcrumb,
.embed .wh_publication_toc,
.embed .wh_right_tools,
.embed .contsys-companion { /* the walkthrough link, circular from inside the walkthrough */
    display: none !important;
}
.embed .wh_content_area {
    margin: 0;
    padding: 1rem 2rem;
    max-width: none;
}
.embed .wh_topic_content {
    margin: 0 auto;
    max-width: 62rem;
}
