:root {
	--primary: rgba(0,125,183,1);
	--secondary: rgba(0,161,203,1);
}

@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-Thin-Pro.otf") format("opentype");
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-ThinItalic-Pro.otf") format("opentype");
  font-weight: 100;
  font-style: italic;
}


@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-XLight-Pro.otf") format("opentype");
  font-weight: 200;
  font-style: normal;
}

@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-XLightItalic-Pro.otf") format("opentype");
  font-weight: 200;
  font-style: normal;
}

@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-Light-Pro.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-LightItalic-Pro.otf") format("opentype");
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-Book-Pro.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-BookItalic-Pro.otf") format("opentype");
  font-weight: 400;
  font-style: italic;
}


@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-Medium-Pro.otf") format("opentype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-BookItalic-Pro.otf") format("opentype");
  font-weight: 500;
  font-style: italic;
}

@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-SemiBold-Pro.otf") format("opentype");
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-SemiBoldItalic-Pro.otf") format("opentype");
  font-weight: 600;
  font-style: italic;
}

@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-Bold-Pro.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-BoldItalic-Pro.otf") format("opentype");
  font-weight: 700;
  font-style: italic;
}


@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-Black-Pro.otf") format("opentype");
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: "Ideal Sans";
  src: url("/assets/ADB/fonts/IdealSans/IdealSans-BlackItalic-Pro.otf") format("opentype");
  font-weight: 800;
  font-style: italic;
}


body {
  margin: 0;
}

/* HOME: Background Image */
#id_home_page {
  background-image:
    url("/assets/ADB/home-background-2.png");
  background-size: cover;
  background-position: center top;
  background-attachment: fixed;
}

@media (max-width: 1024px) {
  #id_home_page {
    background-image:
      url("/assets/ADB/home-background-2.png");
    background-size: 100vh;
    background-position: center top;
    background-repeat: repeat-y;
  }
}

/* HOME: Hide some Appbar items */
[data-testid="footer-bar-test-id"],
[data-testid="sisccappbar"] .MuiDivider-vertical,
/*[data-testid="sisccappbar"] [aria-label="Log in"],*/
[data-testid="sisccappbar"] [aria-label="contact"],
[data-testid="sisccappbar"] .MuiTextField-root,
[data-testid="sisccappbar"] .MuiMenu-root .MuiList-root > li:not(:first-child),
[data-testid="sisccappbar"] .MuiMenu-root .MuiList-root > hr {
  display: none;
}

/**HOME: Adjust the main container padding */
#id_home_page > div > div {
  padding: 0 5%;
}

/* HOME: Spotlight / Search Box */
#id_home_page [data-testid="spotlight"] {
 padding: 0px;
}

#id_home_page [data-testid="spotlight"] > div {
 padding: 6px;
}

#id_home_page .MuiTypography-root.MuiTypography-body1 {
 color: black;
}


/* HOME: Hide text "Find, access and share data" */
#id_home_page [data-sentry-element="Typography"] {
  visibility: hidden;
}

/* HOME: Topics and Subtopics Container */
#id_home_page [data-testid="collapseButton"] {
  margin-top: 16px;
  background-color: rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(10px);
  padding-bottom: 16px;
  border-radius: 6px;
  margin-left: -8px;
	box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
}

/* HOME: Topic Buttons (update color) to move the style to theme configuration if seen as it is applicable to all buttons */
#id_home_page
  [data-testid="collapseButton"]
  .MuiButton-textPrimary
  [tabindex="-1"] {
  color: #fff;
}

#id_home_page
  [data-testid="collapseButton"] button:not([role="link"]){
	background-color: white;
  transition-duration: 300ms;
  color: black !important;
  font-family: 'Ideal Sans', san-serif;
}

/* tab index 0 is active -1 is inactive*/
#id_home_page
  [data-testid="collapseButton"]
  .MuiButton-colorPrimary[aria-expanded="true"]{
	background-color: var(--primary);
  transition-duration: 300ms;
  color: #fff !important;
  font-family: 'Ideal Sans', san-serif;
}

/* tab index 0 is active -1 is inactive*/
#id_home_page
[data-testid="collapseButton"] button:not([role="link"]):hover {
  /* background-color: var(--primary) !important; */
	background-color: none;
  color: none;
}

/* HOME: Topic Buttons (make it responsive) */
#id_home_page [data-testid="collapseButton"] :nth-child(3) {
  padding-right: 16px;
}

@media (max-width: 900px) {
  #id_home_page [data-testid="collapseButton"] > div {
    padding-right: 16px;
  }
}

/* HOME: Subtopics container */
#id_home_page [data-testid="collapseButton"] .MuiPaper-root.MuiPaper-elevation {
  background-color: #fff;
  border: 2px solid var(--primary);
  border-radius: 6px;
  margin: 16px 16px 0 16px;
}

/* HOME: Text (Update topics and subtopics color) */
#id_home_page [data-testid="collapseButton"] button,
#id_home_page [data-testid="collapseButton"] span,
#id_home_page [data-testid="collapseButton"] .MuiCollapse-wrapperInner svg,
#id_home_page [data-testid="collapseButton"] a {
  color: black;
}

/* tab index 0 is active -1 is inactive*/
#id_home_page
[data-testid="collapseButton"] button[role="link"]:hover {
	background-color: rgba(109,207,246,0.5);
}

#id_home_page [data-testid="collapseButton"] button > div span:first-of-type {
  font-family: 'Ideal Sans', sans-serif;
  font-weight: 500 !important;
}

#id_home_page
  [data-testid="collapseButton"]
  button
  > div
  span:last-of-type
  > a {
  margin-top: 0.5rem;
}

#id_home_page [data-testid="collapseButton"] .MuiCollapse-root .MuiCollapse-wrapperInner > div {
  max-height: 40dvh;
  overflow-y: scroll;
}

/* VIS PAGE: hide 2nd appbar */
.MuiGrid-root:has(> #id_vis_page) #id_appbar [data-testid="deappbar"] {
  display: none;
}

/* VIS PAGE: hide 2nd appbar */
.MuiGrid-root:has(> #id_search_page) #id_appbar [data-testid="deappbar"] {
  display: none;
}

/* Update Appbar style*/
[data-testid="sisccappbar"] > div {
  background: hsl(210, 11%, 15%);
}

[data-testid="sisccappbar"] > div svg {
  color: white;
}


/* SEARCH RESULT PAGE: */
#id_search_page.class_page {
  margin-top: 40px;
}

#id_search_page #filters {
  margin-bottom: 10px;
  font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif',Apple c Emoji','Segoe UI Emoji','Segoe UI Symbol';
}


#id_search_page h6 a:hover {
  color: var(--secondary);
}


/* VIS PAGE:  table main banner hover which is used somewhere else*/
#id_vis_page #id_viewer_component table > tbody tr:nth-child(1) th:only-child {
  background-color: var(--secondary);
  color: #fff;
}

/*VIS PAGE: overwrite here because the setting is on theme.outerPalette.hover which is used somewhere else*/
#id_vis_page [data-testid="detoolbar"] button[aria-pressed="true"] {
  background-color: #a2d0e3;
}

/* VIS PAGE: fixed appbar */
  div:has(> #id_search_page, > #id_vis_page) > div:nth-child(1) > div {
  position: fixed !important;
  z-index: 2;
}

#id_appbar {
  background-color: #fff;
}

#id_viewer_component table > thead {
  background-color: #fff;
}
/* VIS PAGE: fixed table headers on top. (chained like this to avoid applying the style on when the table is on full screen. in full screen, only difference is 1 nested element is missing, no unique css class or id is being added) */
#id_vis_page
  > div
  > div:nth-child(2)
  > div:nth-child(2)
  > div:nth-child(2)
  > #id_viewer_component
  table
  > thead {
  top: 112px;
}

#id_vis_page
  > div
  > div:nth-child(2)
  > div:nth-child(2)
  > div:nth-child(2)
  > #id_viewer_component
  table {
  border-top: none;
}

#id_vis_page
  > div
  > div:nth-child(2)
  > div:nth-child(2)
  > div:nth-child(2)
  > #id_viewer_component
  table
  > thead
  > tr:nth-child(1) {
  border-top: thin solid #9e9e9e;
}

#id_vis_page
  > div
  > div:nth-child(2)
  > div:nth-child(2)
  > div:nth-child(2)
  > #id_viewer_component
  table
  > tbody
  > tr:nth-child(1) {
  top: 164px !important;
}

#id_vis_page #id_viewer_component table tr:nth-child(2) > th:nth-child(2) {
  min-width: 120px;
}

/* On Vis Page, the Not Authenticated notification is hidden. Fix by adding a margin on top */
#authRequired {
  margin-top: 10rem;
}
