/*! V4.2 CM 03/03/2020 TABBED and SIDEBAR layout */
/*! V4.4 CM 17/08/2021 Geoviewer V8.40 layout */
/*! V4.6 CM 22/08/2022 Geoviewer login form width override */
/*! V4.7 CM 14/10/2022 Geoviewer query summaries */
/*! V6.0 CM 10/02/2025 CNSOPB renamed to CNSOER */

/* geoviewer map page logo */
#logo {
  width: 200px;
}
#lynxTitle .serviceTitle,
#lynxTitle .serviceSubtitle {
  display: none;
}
body.layout-grid#geoviewer {
  flex-flow: column nowrap;
}
body.layout-grid#geoviewer #dmc-banner {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  padding-top: 8px;
  background: inherit; /* required for print background color */
}
body.layout-grid#geoviewer #dmc-banner #logoLink {
  flex: 0;
}
body.layout-grid#geoviewer #dmc-banner #lynxTitle {
  order: 3; /* show username underneath banner links */
  width: 100%;
  color: #00263e;
  background: lightslategrey;
  padding: 7px 0; /* same height as #map-toolbar */
  display: flex;
  justify-content: space-between;
  align-items: center;
}
body.layout-grid#geoviewer #currentUser {
  padding: 0 8px;
}
body.layout-grid#geoviewer .map-toolbar-cart .downloadSelectionCount.not-empty {
  right: unset;
  left: -8px;
  top: -4px;
}

body.layout-grid#geoviewer #dmc-content {
  display: flex;
  flex-flow: row nowrap;
  flex: 1;
  overflow-y: hidden;
}

body.layout-grid #query-summary-links {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  gap: 24px;
}

body.layout-grid #lynxTitle .cart-button {
  /* wrapper element required for button flash */
  XXmargin-right: 4px;
}
body.layout-grid #lynxTitle #map-toolbar-cart {
  position: relative;
  width: auto;
  right: unset;
  padding-left: 26px;
  font-weight: bold;
  background: lightslategrey url(../../../images/download-16.png) no-repeat top 4px left 6px;
}

body.layout-grid .layerItem {
  font-size: 8pt;
}

body.layout-grid .layerItem.collapsed .layerGroup {
  display: none; /* avoid unneeded scrollbar in layer list when groups collapsed */
}

#lynxBanner #progTitle {
  display: none;
}
body.layout-grid #lynxBanner {
  padding: 0;
  min-width: 304px
}
body.layout-grid #lynxBanner #progTitle {
  display: block;
  min-height: 76px;
  background: none;
  padding: 0;
  margin: 0;
}
body.layout-grid #lynxBanner #progTitle #brandTitle {
  display: none;
}

#currentUser .logout,
#currentUser .logout:visited {
  color: white;
  text-transform: lowercase;
  font-weight: bold;
  text-decoration: none;
}

#map-toolbar .lynxLogo {
  background: url('../../../images/lynx_logo-small-bw.png') no-repeat;
  background-size: contain;
}

/* map popup - report list */
body:not(.layout-grid) #map .ol-overlay-container.ol-selectable {
  /* fixed instead of absolute allows popups to overflow map element, 
     but requires adjustments to top/left/bottom coords below - depends on #lynxBanner height */
  position: fixed !important; 
  z-index: 3;
}
body:not(.layout-grid) #map .ol-popup.bottom-left {
  top: 56px;
  left: -46px;
}
body:not(.layout-grid) #map .ol-popup.top-left {
  bottom: -128px;
  left: -50px;
}
body:not(.layout-grid) #map .ol-popup.top-right {
  bottom: -128px;
  left: -364px;
}
body:not(.layout-grid) #map .ol-popup.bottom-right {
  top: 56px;
  left: -360px;
}

#map .ol-popup .ui-tabs .ui-tabs-nav {
  background: white;
}
#map .ol-popup .ui-tabs .ui-tabs-panel {
  padding: 0;
}
#map .ol-popup .dataTables_wrapper {
  font-size: 8pt;
}

td.reportName { /* force wrapping for long report names to avoid horizontal scrollbar */
  max-width: 200px;
  word-wrap: break-word;
}

/* map popup reportName for wells - needs to wrap */
.ol-popup td {
  max-width: 100px;
  word-wrap: break-word;
}
.ol-popup .rowDetail td {
  max-width: 200px;
}

/* banner popup */
.bannerPopup.ui-dialog {
  max-width: 50%;
}

#requestErrors {
  color: black;
}

/* mobile banner */
#mobileBanner.mobile-show {
  background-color: #00263e;
}
#mobileBanner #bannerPopupText a,
#mobileBanner #bannerPopupText a:visited {
  color: white;
  font-weight: bold;
  text-decoration: none;
}
#mobileBanner #lynxTitle {
  padding-left: 0;
  padding-top: 20px;
}
#mobileBanner #lynxTitle #currentUser {
  position: static;
}
#mobileBanner #lynxTitle #userLinks {
  position: static;
  float: right;
}
#mobileBanner #lynxTitle #cnsopb-link {
  width: 300px;
  top: 0;
}

#mobileBanner #progTitle {
  display: none;
}
@media (max-width:680px) {
  #mobileBanner #cnsopb-logo {
    width: 200px;
    height: auto;
  }
}
@media (max-width: 540px) {
  #mobileBanner #cnsopb-logo {
    display: none;
  }
}

body.layout-grid #layersMenuDropdown .scrollable-layers {
  overflow-y: scroll;
}

#popup-content .layerName {
  display: none;
}
#popup-content .layerNameDePluralised {
  display: block;
}

.popupList .dataTables_wrapper .fg-toolbar {
  position: relative;
}
.popupList .dataTables_wrapper .fg-toolbar .reportPopupButton {
  background: black;
  border: 1px solid white;
  color: white;
  font-weight: bold;
  font-size: 10px;
  padding: 4px 10px;
  height:  23px;
  width: 174px;
  cursor: pointer;
}
.popupList .dataTables_wrapper .fg-toolbar .reportPopupButton:hover {
  background: white;
  color: black;
}
.popupList .dataTables_wrapper .fg-toolbar .reportPopupButton.addToCart {
  position: absolute;
  right: 9px;
  top: 3px;
}
.popupList .dataTables_wrapper .fg-toolbar .reportPopupButton.select2dProgram {
  position: absolute;
  left: 9px;
  top: 3px;
}

#downloadCartTable td {
  max-width: 200px;
  word-wrap: break-word;
}

#downloadCartTable td.row-delete:before {
  content: "\2717"; /* ballot X */
  cursor: pointer;
}

#downloadCart .lynx-controls {
  display: inline-block;
  padding-top: 3px;
  position: relative;
  top: -2px;
}
#downloadCart .downloadAll,
#downloadCart .clearCart {
  display: inline-block;
  margin-left: 16px;
  padding: 2px 4px 2px 20px;
  text-decoration: none;
  color: grey;
}
#downloadCart .downloadAll {
  background: url('../../images/download-16-neg.png') no-repeat 2px 2px;
}
#downloadCart .clearCart {
  background: url('trash-neg.png') no-repeat 2px 2px;
}
#downloadCart .link-enabled {
  color: white;
  cursor: pointer;
}
#downloadCart .downloadAll.link-enabled:hover {
  background: white url('../../images/download-16.png') no-repeat 2px 2px;
  color: black;
}
#downloadCart .clearCart.link-enabled:hover {
  background: white url('trash.png') no-repeat 2px 2px;
  color: black;
}

/* listing feature name attribute display link */
div.report-category table.display td:nth-child(2):not(.reportName) {
  color: blue;
  text-decoration: underline;
  cursor: pointer;
}

/* custom add to selected list link for each report listing */
div.report-category .dataTables_wrapper .lynx-controls {
  display: inline-block;
  padding-top: 3px;
  position: relative;
  top: -2px;
}
div.report-category .addCurrentPageItemsToCart {
  display: inline-block;
  background: url('import-neg.png') no-repeat 2px 2px;
  margin-left: 16px;
  padding: 2px 4px 2px 20px;
  text-decoration: none;
  color: grey;
  cursor: default;
}
div.report-category .addCurrentPageItemsToCart.link-enabled {
  color: white;  
  cursor: pointer;
}
div.report-category .addCurrentPageItemsToCart.link-enabled:hover {
  background: white url('import.png') no-repeat 2px 2px;
  color: black;
}

/* map search and selection custom controls */
.ol-control.hamburger-menu.cnsopb-select button,
.ol-control #browse-features-btn {
  width: auto;
  background: none;
}

#cnsopb-select-dropdown {
  width: 324px;
  padding-bottom: 8px;
  z-index: 1;
}
#cnsopb-select-dropdown p {
  font-weight: normal;
}

#cnsopb-select-dropdown input[type='checkbox'] {
  vertical-align: sub;
}

#cnsopb-select-dropdown .ui-autocomplete {
  font-weight: normal;
}

/* listing feature attribute popup */
.featureAttributes table.attributes {
  width: 100%;
}
.featureAttributes table.attributes td {
  width: 50%;
  max-width: 100px;
  word-wrap: break-word;
}
.featureAttributes table.attributes td.value {
  text-align: right;
}

/* DMC custom search box and feature browse dlg */
#map-toolbar #map-search {
  height: 24px;
  position: relative;
  top: 2px;
  margin-right: 6px;
}

#browse-features-dlg {
  background: #00263e;
  color: white;
}
#browse-features-dlg .ui-tabs .ui-tabs-nav {
  background: #00263e;
}
#browse-features-dlg .ui-tabs .ui-tabs-nav .ui-tabs-active {
  background: #f9af3a;
  margin-bottom: -0.25em;
  padding-bottom: 0;
}
#browse-features-dlg .ui-tabs .ui-tabs-nav .ui-tabs-active a {
  color: white;
}
#browse-features-dlg .ui-tabs .ui-tabs-panel.browse-features-tab {
  padding: 0;
}
.browse-features.ui-dialog .ui-resizable-se {
  /* visible size-grip, but this is invisible against dark blue, so replace it with an 'after' CSS triangle border */
  right: 6px;
  bottom: 6px;
  background-position: -64px -224px !important;
  transform: scale(1.5);
}
.browse-features.ui-dialog .ui-resizable-se:after {
  content: "";
  width: 0;
  height: 0;
  display: block;
  border-bottom: 16px solid grey;
  border-left: 16px solid transparent;
}
.browse-features.ui-dialog .ui-dialog-titlebar {
  background: black;
  color: white;
}
.browse-features.ui-dialog .ui-dialog-titlebar .ui-state-default {
  background: black;
}
#browse-features-dlg .dataTables_wrapper {
  font-size: 8pt;
}
#browse-features-dlg .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {
  flex: auto; /* override the geoviewer datatables flex customisation to work with the browse-feature-dialog sizing */
}
#browse-features-dlg .dataTables_wrapper .invisible {
  display: none;
}
#browse-features-dlg .dataTables_wrapper:not(.dt-jqueryui) .dataTables_scroll + .fg-toolbar {
  justify-content: left;  
}
#browse-features-dlg td.select-feature,
#browse-features-dlg td.select-program {
  color: blue;
  text-decoration: underline;
  cursor: pointer;
}

/* V3.2 Report Dialog custom toolbar and download button for text/plain (LAS) */
.dmcDialogWithToolbar iframe {
  height: calc(100% - 32px);
}
.dmcDialogWithToolbar .dmcToolbar {
  height: 22px;
  padding: 6px;
  background: black;
}
.dmcToolbar .dmcDownloadNow {
  display: inline-block;
  width: 16px;
  height: 16px;  
  background: url(../../images/download-16-neg.png) no-repeat 2px 2px;
  margin-right: 12px;
}
.dmcToolbar .dmcWrapText {
  display: inline-block;
  color: white;
  font-weight: bold;
  float: right;
}
.dmcToolbar .dmcWrapText input {
  vertical-align: middle;
}

form input[type="submit"],
form button[type="submit"] {
  background-color: #14a2b3 !important;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
  height: 38px;
  margin: 0 !important;
  padding: .5em 1em;
  display: inline-block;
  font-weight: 600;
  letter-spacing: .05em;
  padding: .85em 1.5em .7em;
  position: relative;
  text-decoration: none;
  text-transform: uppercase;
  -webkit-transition: all .2s;
  transition: all .2s;
}

body.loginPage form input[type="text"], 
body.loginPage form input[type="password"] {
  padding:  0.5em 1em;
  border: 1px solid #636467;
}

form input[type="submit"]:hover, 
form button[type="submit"]:hover,
form input[type="submit"]:focus,
form button[type="submit"]:focus {
  background-color: #f9af3a !important;
}

#cnsopb-logo {
  margin: 1em 0;
  width: 300px;
}
body.layout-grid #cnsopb-logo {
  max-width: 96%;
  margin: 1em 4px;
	filter: brightness(0) invert(1); /* invert colors */
}
body.loginPage #cnsopb-logo,
body.query-summary #cnsopb-logo {
  margin: 0;
  width: 315px !important;
  max-width: 100%;
}

/*
MAIN PAGE
*/

#lynxTitle #cnsopb-link {
  background: transparent url('cnsopb-logo_white.png') top center no-repeat;
  height: 55px;
  width: 300px;
  background-size: contain;
}
@media(max-width:1040px){
  #lynxTitle #cnsopb-link {  
    width: 200px;
    top: 15px;
  }
}
@media(max-width:940px){
  #lynxTitle #cnsopb-link {
    width: 100px;
    top: 30px;
  }
}

#lynxTitle #cnsopb-logo {
  margin: 8px 0 0 0;
  opacity: 0;
}
body[data-service-name] #tabs > .ui-tabs-nav {
  background-color: #00263e !important;
}


body[data-service-name] #tabs > .ui-tabs-nav li {
  background-image: none;
  background-color: #efefef;
  border: none !important;
}

body[data-service-name] #tabs > .ui-tabs-nav li:hover {
   background-color: #fff;
}

body[data-service-name] #tabs > .ui-tabs-nav li a {
  color: #000;
  letter-spacing: 0.05em;
}

body[data-service-name] #tabs > .ui-tabs-nav .ui-tabs-active {
  background-color: #f9af3a !important;
}

body[data-service-name] #tabs > .ui-tabs-nav .ui-tabs-active a {
  color: #fff;
}

/* V4.3 CM 13/03/2020 added layerItem filter style overrides */
.layerItem.has-filters .filter-submenu .ui-autocomplete {
  font-weight: normal;
  line-height: normal;
  font-size: 13.333px;
}

/* V4.5 CM 03/11/2021 report-feature-info HTML overrides */
body.report-feature-info #lynxBanner #lynxTitle {
  position: unset;
  flex-flow: row nowrap;
  justify-content: space-between;
  align-items: center;
}
body.report-feature-info #lynxBanner #lynxTitle #userLinks {
  position: unset;
}
body.report-feature-info #cnsopb-link {
  display: none;
}

/* V4.7 query summary and login overrides for Geoviewer V9.1 */
body.loginPage,
body.query-summary {
  background: url(../dmc-bg.jpg) no-repeat;
  background-size: cover;
  min-height: 100vh;
}
body.loginPage .wrapper {
  padding: 0;
  height: 100vh; /* required for agreement to fit page height with internal scrolling */
}
body.loginPage #login {
  flex: 1;
  align-items: center;
  gap: 0;
}
body.loginPage #logo-link,
body.loginPage #login #query-summary-links {
  margin-top: 8px;
}
body.loginPage #login-title {
  display: none;
}
body.query-summary #wrapper {
  height: 100vh; /* prevent body scrolling, scroll in #content instead */
}
body.query-summary #lynxBanner {
  flex-flow: column nowrap;
  align-items: center;
}
body.query-summary #query-links {
	flex-flow: row nowrap;
}
body.query-summary #query-links a.query-link {
	font-size: 8pt;
}

body.query-summary #lynxTitle {
  margin: 0;
}
body.loginPage #login #query-summary-links,
body.query-summary #lynxTitle {
  padding-left: 0;
  flex-flow: row wrap;
  justify-content: center;
  gap: 24px;
}
body.query-summary #logoLink {
  flex: unset;
}
body.layout-grid  #query-summary-links a,
body.layout-mobile #query-summary-links a,
body.loginPage #login #query-summary-links a,
body.query-summary #lynxTitle a {
  position: relative;
  color: rgb(255,255,255,0.75);
  letter-spacing: 0.05em;
  line-height: 1;
  text-decoration: none;
  font-weight: unset;
  text-transform: uppercase;
  transition: all 0.2s;
}
body.layout-grid #query-summary-links a:hover,
body.loginPage #login #query-summary-links a:hover,
body.query-summary #lynxTitle a:hover {
  color: #ffeda6;
  text-decoration: none !important;
}
body.layout-grid #query-summary-links a::before,
body.loginPage #login #query-summary-links a::before,
body.query-summary #lynxTitle a::before {
  opacity: 0;
  color: #f9af3a;
  content: '|';
  display: inline-block;
  font-weight: 600;
  margin-right: 0.5em;
  transform: translateX(1em);
  transition: transform 0.3s, opacity 0.2s; 
}
@media (max-width:500px) {
  /* disable the link hover bar for narrow screens, which are likely to be touchscreen without hover effects anyway */
  body.layout-grid #query-summary-links a::before,
  body.loginPage #login #query-summary-links a::before,
  body.query-summary #lynxTitle a::before {
    content: unset;
  }
}

body.layout-grid #query-summary-links a:hover::before,
body.loginPage #login #query-summary-links a:hover::before,
body.query-summary #lynxTitle a:hover::before {
  opacity: 1;
  transform: translateX(0);
}
body.loginPage #login-form {
  color: black;
  background: white;
  padding: 20px;
  margin: 0;
  align-self: stretch;
}
body.loginPage form input.button,
body.loginPage form button {
  border: none;
}
body.loginPage #login-extra {
  background: white;
  margin: 0;
  color: black;
  align-self: stretch;
  display: flex;
  flex-flow: column;
  order: 2;
  flex: 1;
}
body.loginPage .smallprint {
  background: white;
  color: black;
  padding: 8px 20px;
  margin: 0;
  order: 1;
  align-self: stretch;
}
body.loginPage #cnsopb-logo {
  padding: 8px 20px;
}
body.loginPage.userAgreement #agreement>div {
  padding-right: 8px; /* space between end-of-line and scrollbar */
}
body.loginPage.userAgreement #accept-reject {
  background: white;
  color: black;
}
body.loginPage.userAgreement #accept-reject form {
  padding-left: 20px;
  padding-right: 0;
  margin-top: 0;
}

body.query-summary #content {
  flex-flow: column nowrap;
  overflow-y: auto;
}

body.loginPage #footer,
body.query-summary #footer {
  color: black;
  border-top: 1px solid black;
  background: white no-repeat 20px 2px/100px url(../../../images/lynx_logo-small-bw.png);
  padding: 8px 8px 8px 130px;
  margin-top: auto;
  line-height: normal;
  align-self: stretch;
}
body.loginPage #footer a,
body.query-summary #footer a {
  text-decoration: none;
  font-weight: bold;
  color: inherit;
}

body.layout-mobile #mobileBanner #progTitle.brand.iviewer.logo {
  background: inherit;
  padding-left: 0;
}
body.layout-mobile #mobileBanner #progTitle span {
  text-align: left;
}

/* CFB 2025 query summary scrollable tabs */
body.query-summary[data-service-name='cfb-ns25'] #query-links a.query-link {
	white-space: nowrap;
}
@supports selector(::scroll-button(*)) {
	/* Chromium browsers, scroll tabs left/right with scroll buttons */
	body.query-summary[data-service-name='cfb-ns25'] #query-links {
		overflow-x: hidden;
		anchor-name: --carousel;
	}
	body.query-summary[data-service-name='cfb-ns25'] #query-links::scroll-button(*) {
		cursor: pointer;	
		position-anchor: --carousel;
		position: fixed;
		align-self: anchor-center;
		display: block;
		height: 30px;
		width: 21px;
		color: white;
		background-color: black;
		border: 1px solid white;
	}
	body.query-summary[data-service-name='cfb-ns25'] #query-links::scroll-button(left) {
		content: "<";
		left: calc(anchor(left));
	}
	body.query-summary[data-service-name='cfb-ns25'] #query-links::scroll-button(right) {
		content: ">";
		right: calc(anchor(right));
	}
	body.query-summary[data-service-name='cfb-ns25'] #query-links::scroll-button(*):disabled {
		color: grey;
		cursor: default;
	}
	body.query-summary[data-service-name='cfb-ns25'] #query-links a.query-link:first-child {
		margin-left: 20px;
	}
	body.query-summary[data-service-name='cfb-ns25'] #query-links a.query-link:last-child {
		margin-right: 20px;
	}
}
@supports not (selector(::scroll-button(*))) {
	/* Firefox, manually add scroll buttons to tab-nav row */
	body.query-summary[data-service-name='cfb-ns25'] #wrapper {
		overflow-x: hidden;
	}
	body.query-summary[data-service-name='cfb-ns25'] #query-links {
		overflow-x: hidden;
	}
	body.query-summary[data-service-name='cfb-ns25'] #query-links .query-links-scroll-left,
	body.query-summary[data-service-name='cfb-ns25'] #query-links .query-links-scroll-right {
		position: fixed;
		display: block;
		height: 31px;
		width: 21px;
		color: white;
		background-color: black;
		border: 1px solid white;
	}
	body.query-summary[data-service-name='cfb-ns25'] #query-links a.query-link:first-of-type {
		margin-left: 20px;
	}
	body.query-summary[data-service-name='cfb-ns25'] #query-links a.query-link:last-of-type {
		margin-right: 20px;
	}
	body.query-summary[data-service-name='cfb-ns25'] #query-links .query-links-scroll-left {
		left: 20px;
	}
	body.query-summary[data-service-name='cfb-ns25'] #query-links .query-links-scroll-right {
		right: 20px;
	}
}