/*
 * SOCIB brand overlay for TDS 5 generated pages.
 *
 * Loaded AFTER the webapp default /thredds/tds.css (wired as standardCssUrl in
 * threddsConfig.xml htmlSetup), so it only overrides brand-relevant rules and
 * inherits the default layout. Selectors target the TDS 5 Thymeleaf markup
 * (.container, #header, .banner, .section-header, tr.subset, ...) — do not use
 * positional selectors: that is what broke the TDS 4.6 stylesheets.
 *
 * Palette (SOCIB visual identity 2026): navy #00223e, cyan #21b9da.
 */

/* Titillium Web (SOCIB brand typeface), self-hosted to avoid third-party requests */
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/titillium-web-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/titillium-web-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/titillium-web-700.woff2') format('woff2');
}

/* Base typography */
body, td, b, i, small, h2 {
  font-family: 'Titillium Web', Tahoma, Arial, sans-serif;
}

body, td {
  color: #1c2b36;
}

h2 {
  color: #00223e;
}

/* Links: navy with a cyan underline accent */
a:link, a:visited {
  font-family: inherit;
  color: #00223e;
  border-bottom: 1px solid #21b9da;
}

a:hover, a:active {
  font-family: inherit;
  color: #00223e;
  text-decoration: none;
  border-bottom: 2px solid #21b9da;
}

/* Page ground */
div.container {
  background-color: #e9eef1;
}

#header-buffer, #footer-buffer {
  background-color: #e9eef1;
}

/* Stock TDS leaves only 4px here, so the last catalog row collides with the
   navy footer bar. Header spacing is fine as it is, hence footer only. */
#footer-buffer {
  margin-top: 32px;
}

/* Stock leaves the last listing row 5px from the content box border, which
   reads as cramped however much air sits outside the box. */
div.section-content {
  padding-bottom: 16px;
}

/* Header and footer bars */
div#header, div#footer {
  background-color: #00223e;
  border: none;
  padding: 10px 24px;
}

/* Header layout (templates/tdsTemplateFragments.html :: header):
 * install name on the left, negative logo on the right of the navy bar */
.socib-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.socib-header .header-logo {
  float: none;
  padding: 0;
}

.socib-header .header-info {
  margin-left: 0;
  padding: 0;
}

/* The logo links to the host institution: block anchor so the inline box adds
   no stray line-height space, and no cyan underline accent under the image. */
.header-logo a,
.header-logo a:link,
.header-logo a:visited,
.header-logo a:hover {
  display: block;
  border-bottom: none;
}

.header-logo img {
  display: block;
  height: 52px;
  width: auto;
}

.header-info h2 {
  color: #ffffff;
  margin: 0;
  font-size: 18pt;
  font-weight: 700;
  letter-spacing: 0.03em;
}

a.static, a.static:link, a.static:visited {
  color: #ffffff;
  border-bottom: none;
}

a.static:hover {
  color: #21b9da;
  border-bottom: none;
  text-decoration: none;
}

div#footer h4 {
  color: #c6d6e0;
  font-weight: 400;
  margin: 4px 0;
}

/* Content boxes and section headers */
div.content {
  border: 1px solid #ccd8de;
}

div.section-header {
  background-color: #00223e;
  border-left: 6px solid #21b9da;
  color: #ffffff;
  font-size: 13pt;
  padding: 6px 12px;
}

/* Root-catalog greeting banner */
.banner {
  background-color: #00223e;
  border: none;
  border-left: 6px solid #21b9da;
}

.banner > h2 {
  color: #ffffff;
}

.banner h3 {
  color: #c6d6e0;
}

/* Dataset page tabs */
.button-pane, .tab-button {
  background-color: #00223e;
}

.tab-button:hover {
  background-color: #21b9da;
  color: #ffffff;
}

.tab-button.active {
  background-color: #21b9da;
}

.tab-container {
  background-color: #21b9da;
}

table.property-table > tbody > tr > td {
  border: 1px solid #ccd8de;
}

/* Private-instance marker. This stylesheet is kept byte-identical in both
 * content roots so it can be synced mechanically; what differs is the
 * template. Only the private tdsTemplateFragments.html emits .socib-private,
 * so these rules are inert on the public instance. Both servers are named
 * "SOCIB TDS", so without a marker they would look identical — this is a
 * safety cue, not decoration. If :has() is unsupported the badge still
 * shows and only the bar colour falls back to navy. */
.socib-private {
  background-color: #21b9da;
  border-radius: 3px;
  color: #00223e;
  font-size: 9pt;
  font-weight: 700;
  letter-spacing: .08em;
  margin-left: 10px;
  padding: 2px 8px;
  vertical-align: middle;
}

#header:has(.socib-private) {
  background-color: #0b5566;
}

/* Small orientation note inside the root-catalog banner (private template) */
.banner .socib-banner-note {
  color: #c6d6e0;
  font-size: 9pt;
  margin: 4px 0 0;
}

/* Advisory box (see templates/tdsTemplateFragments.html) */
.socib-advisory {
  background-color: #d5f1f8;
  border-left: 6px solid #21b9da;
  color: #083644;
  padding: 8px 16px;
}

/* Legal notice + CoreTrustSeal in the footer (see templates/tdsTemplateFragments.html) */
.socib-footer-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.socib-legal {
  flex: 1;
  color: #9fb8c6;
  font-size: 8pt;
  margin: 4px 0 8px;
}

.socib-seal {
  flex: none;
  height: 70px;
  width: auto;
}