/* =========================================================
   ROOT VARIABLES / DESIGN TOKENS
   ========================================================= */

:root {
  /* Colors */
  --color-primary: #FF5689;
  --color-primary-dark: #C84E7D;
  --color-secondary: #286A68;
  --color-secondary-dark: #002F2C;

  --color-text: #000;
  --color-text-light: #ccc;
  --color-text-inverse: #fff;

  --color-bg-main: #fff;
  --color-bg-light: #605E5C14;
  --color-bg-hover: #fff;
  --color-bg-button-hover: #FBF3E2;

  --color-border: #D0D0D0;

  --color-warning-bg: #e8112314;
  --color-warning-border: #A4262C;

  --color-note-bg: #0458C514;
  --color-note-border: #11409C;

  --color-tip-bg: #01890114;
  --color-tip-border: #004B1C;

  --color-table-head-bg: #68A6A433;
  --color-table-head-text: #002F2C;

  --color-footer: #fff;
  --color-bg-search: #fff;
  --color-font-search: #000;

  --color-searchresultitem-hover: #f5f5f5;
  --color-placeholder-search: #ccc;

  --color-bg-icon: #f5f5f5;

  /* Typography */
  --font-weight-regular: 400;
  --font-weight-bold: 700;
  --font-size-featured-label: 1.5em;

  /* Spacing */
  --spacing-header-y: 28px;
  --spacing-header-x: 40px;
  --spacing-logo-x: 20px;
  --spacing-inline-icon-x: 4px;
  --spacing-example-padding: 1em;
  --spacing-featured-label-top: 64px;

  /* Radius */
  --radius-small: 2px;

  /* Sizes */
  --logo-height: 70px;

  /* Borders */
  --border-width-example: 2px;
  --border-width-none: 0;

  /* Shadows */
  --shadow-footer: 0 4px 18px 0 rgba(0, 0, 0, 0.12),
    0 7px 10px -5px rgba(0, 0, 0, 0.15);
}

/* =========================================================
   LAYOUT / STRUCTURE (Sticky Footer, Base Layout)
   ========================================================= */

html,
body {
  min-height: 100vh;
  margin: 0;
}

body.theme2 {
  display: flex;
  flex-direction: column;
}

.portal-content.theme2 {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.portal-body,
.site-body {
  flex: 1 0 auto;
}

.portal-footer,
.theme2 .portal-footer {
  margin-top: auto;
}

.portal-footer {
  box-shadow: var(--shadow-footer); 
  background-color: var(--color-footer);
  padding: 0;
  margin: 0;
}

.theme2 .site-footer {
  display: none;
}

/* =========================================================
    PORTAL TILE IMAGES 2026/06/02
    ======================================================== */

.cat-panel-1:before {
  content: "\f0f6";
}

.cat-panel-2:before {
  content: "\f0f6";
}

.cat-panel-3:before {
  content: "\f0f6";
}

.cat-panel-4:before {
  content: "\f0f6";
}

/* =========================================================
   PORTAL COOKIE CONSENT 2026/06/02
   ========================================================= */

/* COOKIE BANNER CONTAINER 2026/06/02 */
[class*="cc-color-override"].cc-window {
    color: var(--color-text-inverse);
    background-color: var(--color-secondary-dark)!important;
}

[class*="cc-color-override"].cc-window a {
  color: var(--color-text-inverse)!important;
}

/* DECLINE BUTTON 2026/06/02 */
[class*="cc-color-override"].cc-window .cc-btn.cc-deny {
  color: var(--color-text-inverse)!important;
  border-color: transparent;
  background-color: var(--color-secondary-dark)!important;
}

/* ACCEPT BUTTON 2026/06/02 */
[class*="cc-color-override"].cc-window .cc-btn.cc-allow {
  color: var(--color-text-inverse)!important;
  border-color: transparent;
  background-color: var(--color-primary)!important;
}

/* ACCEPT BUTTON HOVER 2026/06/02 */
[class*="cc-color-override"].cc-window .cc-btn.cc-allow:hover {
color: var(--color-text-inverse)!important;
  border-color: transparent;
  background-color: var(--color-primary-dark)!important;
}

/* SHOW COOKIE POLICY 2026/06/02 */
.cc-revoke.cc-bottom.cc-animate[class*="cc-color-override"]  {
  color: var(--color-text-inverse)!important;
  border-color: transparent;
  background-color: var(--color-secondary-dark)!important;
}


/* =========================================================
   HEADER
   ========================================================= */

.portal-header {
  padding: var(--spacing-header-y) var(--spacing-header-x);
}

.portal-header h1 {
  color: var(--color-bg-hover);
  font-weight: var(--font-weight-regular);
}

.portal-header::after {
  opacity: 1;
  filter: none;
}

.portal-header .logo {
  height: var(--logo-height);
}

.portal-header .portal-search button {
  border-radius: var(--radius-small);
  background-color: var(--color-primary);
}

.portal-header .portal-search button:hover {
  background-color: var(--color-primary-dark);
}

.portal-single-publication .publication-icon i,
.portal-single-publication .publication-icon .fa {
  color: var(--color-secondary);
}

.colored-top .site-sidebar-header {
  min-height: 64px;
  box-shadow: var(--shadow-footer);
}

.toolbar-tools {
  color: var(--color-text);
}

.tool-search-form {
  color: #000;
  background-color: var(--color-bg-search);
}



/* =========================================================
   SEARCH
   ========================================================= */

.search-container h2 {
  color: var(--color-secondary);
}

.searchresultitem.selected-searchresultitem {
  background-color: transparent;
}

.searchresultitem:hover {
  background-color: var(--color-searchresultitem-hover);
  color: var(--color-secondary);
}

.searchresultitem a {
  color: var(--color-text);
}

.searchresultitem a:hover {
  color: var(--color-secondary);
}

ul.searchresults .search-highlight {
  font-style: normal;
}

.search-result-breadcrumbs {
  color: var(--color-secondary);
}

.search-result-breadcrumbs:hover {
  color: var(--color-secondary);
  text-decoration: underline;
}

/* =========================================================
   SIDEBAR / NAVIGATION
   ========================================================= */

.fixed-toolbar .toolbar,
.colored-top .site-sidebar-header {
  background-color: var(--color-bg-main);
}

.colored-top .site-sidebar-header {
  display: flex;
  border-color: transparent;
}

.site-sidebar .logo {
  padding: 0 var(--spacing-logo-x);
}

.breadcrumb a,
.breadcrumb > li {
  color: var(--color-text);
}

.theme2 .nav-site-sidebar .active > a {
  font-size: 14px;
  font-weight: var(--font-weight-bold);
  color: var(--color-secondary);
  background-color: var(--color-bg-hover);
}

.breadcrumb > li + li:before {
  color: var(--color-text);
}

.site-sidebar-header {
  max-height: 64px;
  box-shadow: var(--shadow-footer);
}

/* =========================================================
   TYPOGRAPHY / TITLES
   ========================================================= */

.titlepage h1.title,
.titlepage h2.title,
.titlepage h3.title {
  color: var(--color-secondary);
  font-weight: var(--font-weight-bold);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: var(--font-weight-bold);
  color: var(--color-secondary);
}

h5 {
  text-transform: none;
}

.title h2,
.title h3,
.title h4,
.title h5,
.title h6 {
  font-size: 27px;
  font-weight: var(--font-weight-bold);
  color: var(--color-secondary);
}

/* =========================================================
   ADMONITIONS (Warning, Note, Tip, Example)
   ========================================================= */

.warning {
  background-color: var(--color-warning-bg);
  border-left-color: var(--color-warning-border);
  border-radius: var(--radius-small);
}

.note {
  background-color: var(--color-note-bg);
  border-left-color: var(--color-note-border);
  border-radius: var(--radius-small);
}

.tip {
  background-color: var(--color-tip-bg);
  border-left-color: var(--color-tip-border);
  border-radius: var(--radius-small);
}

.note:before,
.tip:before,
.warning:before,
.caution:before,
.important:before {
  display: none;
}

.warning strong,
.note strong,
.important strong,
.caution strong,
.tip strong {
  font-size: 16.8px;
  font-weight: var(--font-weight-bold);
}

.example {
  border: var(--border-width-example) solid var(--color-border);
  border-radius: var(--radius-small);
  padding: 16px 16px 16px 65px;
}

.example-contents p {
  margin: 16.8px 0;
}

.example-title .formal-label .formal-number, 
.example-title .formal-label .formal-label-delimiter { 
  display: none; 
}

div.example-title {
  font-size: 16.8px;
}

/* =========================================================
   CODE / SYNTAX HIGHLIGHTING
   ========================================================= */

code {
  background-color: var(--color-bg-light);
  color: var(--color-text);
}

.theme2 .hljs {
  background: var(--color-bg-light);
}

.theme2 .hljs-attr,
.theme2 .hljs-punctuation,
.theme2 .hljs-string {
  color: var(--color-text);
}

/* =========================================================
   LINKS / ACCORDION / INTERACTIONS
   ========================================================= */

a.link {
  text-decoration: underline;
  color: var(--color-primary-dark);
}

a.link:hover {
  text-decoration: underline;
}

a:hover {
  color: var(--color-primary);
}

div.sidebar-title {
  font-weight: var(--font-weight-bold);
  color: var(--color-secondary);
  transition: color 0.2s ease;
}

.panel-heading.active .sidebar-title {
  color: var(--color-primary-dark);
}

div.sidebar-title:focus {
  outline: none;
}

.section.internal.accordion .panel-heading h3.title {
  font-size: 23px;
  font-weight: var(--font-weight-bold);
  color: var(--color-secondary);
}

.section.internal.accordion .panel-heading:active h3.title,
.section.internal.accordion .panel-heading.active h3.title {
  color: var(--color-primary-dark);
}


.section-toc .topic-link,
#email-feedback a {
  color: var(--color-primary-dark);
}

.panel-body p {
  margin: 0;
}

/* Remove outline from active (expanded) section accordion 2026/06/02 */
.section.internal.accordion .panel-heading a:not(.collapsed),
.section.internal.accordion .panel-heading a:focus,
.section.internal.accordion .panel-heading a:active {
  outline: none !important;
}


/* Remove outline from active (expanded) sidebar accordion 2026/06/02*/
.sidebar.accordion .panel-heading a:not(.collapsed),
.sidebar.accordion .panel-heading a:focus,
.sidebar.accordion .panel-heading a:active {
   outline: none !important;
}

/* External link icon 2026/06/02 */
#topic-content a[target="_blank"]::after {
  content: " \f08e";
  font-family: "FontAwesome";
  font-size: 0.9em;
}

/* =========================================================
   INLINE MEDIA / ICONS
   ========================================================= */

.inlinemediaobject img {
  background-color: var(--color-bg-icon);
}


img {
  vertical-align: baseline;}

/* =========================================================
   FEATURED CONTENT
   ========================================================= */

.featured-content-label {
  display: none;
  margin-top: var(--spacing-featured-label-top);
  font-size: var(--font-size-featured-label);
  color: var(--color-secondary);
}

/* =========================================================
   PORTAL CONTENT / LISTINGS / PAGINATION
   ========================================================= */

.portal-single-publication h3 {
  color: var(--color-text);
  font-weight: var(--font-weight-regular);
}

.portal-single-publication h3:hover {
  color: var(--color-primary-dark);
}

.pager .previous > a,
.pager li > a {
  color: var(--color-primary-dark);
}

.pager .previous > a:hover,
.pager li > a:hover {
  color: var(--color-primary-dark);
  background-color: #F8F8F8;
}

.portal-contents {
  display: none;
}

.publication-contents h4 a {
  color: #333;
  font-weight: var(--font-weight-regular);
}

.publication-contents h4 a:hover {
  color: var(--color-primary-dark);
  text-decoration: underline;
}

.procedure-title,
p.prereqtitle {
  font-size: 16.8px;
  font-weight: var(--font-weight-bold);
}

p.prereqtitle {
  margin-bottom: 12px;
}

.procedure-title {
  margin-top: 32px;
}

.listitem p {
  margin: 10px 0;
}

.step p {
  margin: 12px 0;
}

/* =========================================================
   TABLES
   ========================================================= */

p {
  margin: 28px 0;
}

th {
  background-color: var(--color-table-head-bg);
  color: var(--color-table-head-text);
}

/* =========================================================
   FEEDBACK PANEL
   ========================================================= */

div.feedback-panel .btn {
  background-color: var(--color-secondary);
  color: var(--color-text-inverse);
  border: var(--border-width-none);
}

div.feedback-panel .btn:hover,
div.feedback-panel .btn:focus {
  background-color: var(--color-bg-button-hover);
  color: var(--color-secondary-dark);
  border: var(--color-secondary);
  border-radius: 2px;
}

div.feedback-panel .btn.active {
  border: var(--color-secondary);
  border-radius: 2px;
  background-color: var(--color-bg-button-hover);
  color: var(--color-secondary-dark);
}

/* =========================================================
   FOOTER
   ========================================================= */

.copyright {
  color: var(--color-text);
}

/* =========================================================
   GLOBAL OVERRIDES / CLEANUP
   ========================================================= */

.btn-default {
  display: none;
}

.tool-search-form {
  color: var(--color-text);
  background-color: var(--color-bg-search);
}

.tool-search-form input.search-field {
  color: var(--color-text);
  background-color: var(--color-bg-search);
}

.tool-search-form input.search-field::placeholder {
  color: var(--color-placeholder-search);
  opacity: 1;
}

.emphasis,
em {
    font-weight: var(--font-weight-bold);
    font-style: normal;

}
