/* =========================================================================
   STARTER THEME
   1. Change the colour variables in :root - most of the UI follows them.
   2. Each block below says WHERE the element is on the page.
   3. Selectors marked [verified] come from the existing Medicover CSS.
      The others are standard ResourceSpace selectors that could not be
      tested yet - if something does not change, inspect the element in the
      browser (F12 > pick an element) and adjust the selector.
   Tip: use the Preview button to try changes before saving.
   ========================================================================= */

:root {
    --brand:       #00539F;  /* main brand colour: buttons / calls to action */
    --brand-dark:  #B30022;  /* hover colour of buttons, breadcrumb bar */
    --brand-text:  #FFFFFF;  /* text on top of the brand colour */
    --header-bg:   #1E2A38;  /* top header bar */
    --header-text: #FFFFFF;  /* links in the header bar */
    --page-bg:     #F4F6F8;  /* page background */
    --panel-bg:    #FFFFFF;  /* cards, forms, search result tiles */
    --text:        #1F2933;  /* body text */
    --link:        #0067B1;  /* links in the main content */
    --border:      #D9DEE3;  /* thin borders */
}

/* --- Page background and base text colour (whole page) --- */
body {
    background-color: var(--page-bg);
    color: var(--text);
}

/* --- Header bar at the very top (logo, main menu, user links) --- */
#Header {
    background-color: var(--header-bg) !important;
}
#Header a,
#HeaderNav1 a,
#HeaderNav2 a {
    color: var(--header-text) !important;
}

/* --- Bar with in-page actions/tabs below the header [verified] --- */
.TopInpageNav {
    background: var(--brand) !important;
}

/* --- Breadcrumb trail, e.g. "System Setup > Plugin Manager" [verified] --- */
.BreadcrumbsBoxTheme {
    background-color: var(--brand-dark) !important;
    color: var(--brand-text);
    margin: 0 1em 1em 0;
    padding: 6px 8px;
    border-radius: 6px;
}

/* --- Primary buttons / calls to action: Save, Search, Upload, Download [verified] --- */
.button,
button,
input[type=submit],
input[type=button],
.UploadButton a,
.RecordPanel .RecordDownloadSpace .DownloadDBlend a {
    background: var(--brand) !important;
    color: var(--brand-text) !important;
    border-color: var(--brand) !important;
}

/* --- Hover state of the buttons above --- */
.button:hover,
button:hover,
input[type=submit]:hover,
input[type=button]:hover,
.UploadButton a:hover,
.RecordPanel .RecordDownloadSpace .DownloadDBlend a:hover {
    background: var(--brand-dark) !important;
    border-color: var(--brand-dark) !important;
}

/* --- Search box (keyword field area) --- */
#SearchBox {
    background-color: var(--panel-bg) !important;
}

/* --- Content panels and cards: forms, record details, search result tiles --- */
.BasicsBox,
.RecordBox,
.ResourcePanel {
    background-color: var(--panel-bg);
    border-color: var(--border);
}

/* --- Links in the main content area (uncomment to enable) --- */
/* #CentralSpace a { color: var(--link); } */