/* TelPoS portal overlay — additive styles on top of bundle.css.
   Served by /corpus/api/portal.css when the Host maps to the "ptv" portal.
   Values calibrated against telpos.huma-num.fr (Twenty Twenty-Three). */

/* Global typography — the WP site uses the WordPress system stack
   (Twenty Twenty-Three's default), not the app's Helvetica stack.
   Body font-size is left alone: that is content, not chrome. */
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
  /* index.html pins `padding-top: 50px` inline for the 51px navbar;
     the taller header below needs the matching offset. */
  padding-top: 122px !important;
}

/* Top bar: opaque white on the app's base color, borderless. 36px padding
   + a 50px row (the login buttons are 34px + 8px margins, the tallest
   child) = 122px, matching WP's header region (48px root padding + 26px
   row + 48px group padding) with the row centre at y=61 — the same centre
   WP's nav row has (48…74). WP's own header scrolls away; this app pins
   the navbar, so it must be opaque or scrolled content shows through the
   menu (FOV-767 report: "recouvrement des lettres et images"). */
.navbar-default {
  background-color: #ffffff;
  border: none;
  box-shadow: none;
}

.navbar {
  height: auto;
  padding: 36px 0;
}

/* WP header layout: alignwide container — the navbar spans the viewport,
   the container is centred with max-width 1264px so that the 32px side
   padding yields the same 1200px content box WP's .alignwide has at
   x=120…1320 (1440px viewport). Verified at 1440/1280/1024/900/768/600/375.
   Brand far left, menu pushed to the right. Flexbox instead of Bootstrap
   floats: `.navbar-right` is float:right !important, which would pull the
   login buttons out of the flex flow (so margin-left: auto could not align
   the menu to the true right edge) — force float: none. */
.navbar > .container {
  width: auto;
  max-width: 1264px;
  margin: 0 auto;
  padding-left: clamp(24px, 5vw, 32px);
  padding-right: clamp(24px, 5vw, 32px);
  display: flex;
  align-items: center;
}

.navbar > .container > .navbar-header {
  float: none;
}

/* Bootstrap pulls the brand 15px into the container padding
   (`.navbar > .container .navbar-brand`, which outranks a bare
   `.navbar-brand`) and pads it 15px; WP aligns the site title flush with
   the content edge. */
.navbar > .container .navbar-brand {
  padding: 0;
  margin-left: 0;
  height: auto;
  display: flex;
  align-items: center;
}

/* Text brand — this portal has no logo image on the WP site, so the
   site title itself is the brand: 18px, weight 400, black. */
.navbar-brand .portal-name {
  font-size: 18px;
  font-weight: 400;
  color: #000000;
  line-height: 25.2px;
}

/* Push the menu (and everything after it) to the right edge. */
.navbar > .container > .navbar-nav {
  float: none !important;
  margin: 0 0 0 auto;
}

.navbar > .container > .navbar-right {
  float: none !important;
  margin: 0 0 0 15px;
  /* main.less pins 4em here to clip the debug version block; it also
     inflates the row, which would push the header past WP's height. */
  height: auto;
}

/* Nav links — WP: 16px, weight 400, black, no letter-spacing, 24px gap
   between items, underlined on hover. 7px padding + 26px line-height =
   the row height. */
.navbar-default .navbar-nav > li > a {
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  letter-spacing: normal;
  color: #000000;
  padding: 7px 12px;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #000000;
  text-decoration: underline;
  background-color: transparent;
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  color: #000000;
  background-color: transparent;
  text-decoration: underline;
}

/* Dropdown: white panel, 1px rgba(0,0,0,.15) border, 200px min-width,
   square corners, no shadow — WP's navigation submenu. */
.navbar-default .dropdown-menu {
  background-color: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 0;
  box-shadow: none;
  min-width: 200px;
}

.navbar-default .dropdown-menu > li > a {
  font-size: 16px;
  font-weight: 400;
  color: #000000;
  padding: 8px 16px;
}

.navbar-default .dropdown-menu > li > a:hover,
.navbar-default .dropdown-menu > li > a:focus {
  color: #000000;
  background-color: transparent;
  text-decoration: underline;
}

/* Login/signup buttons: the WP site has no buttons — these stay
   corpus-only, subdued to the WP site's monochrome palette. */
.navbar-default .btn-default {
  border-color: #111111;
  color: #111111;
}

.navbar-default .btn-primary {
  background-color: #111111;
  border-color: #111111;
}

/* Elements pinned below the old 51px topbar (main.less) need the same
   offset as the new header height (122px). */
.sidebar {
  top: 122px;
}

.segments-editor {
  top: 122px;
}

/* Footer: WP puts the site title and the credit on one row
   (space-between, alignwide box, 48px above the row). This portal's WP
   footer carries no link columns, so the split row replaces them. */
.portal-footer-container {
  width: auto;
  max-width: 1264px;
  margin: 0 auto;
  padding-left: clamp(24px, 5vw, 32px);
  padding-right: clamp(24px, 5vw, 32px);
}

/* main.less reserves 100px above the footer; WP's is 48px (its
   --wp--preset--spacing--40 at this width). */
footer:before {
  height: 48px;
}

footer hr {
  margin-bottom: 30px;
}

.portal-footer-split {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 18px;
}

.portal-footer-split .portal-footer-title {
  color: #000000;
  text-decoration: none;
}

.portal-footer-split .attribution {
  margin: 0;
}

/* Narrow-but-not-mobile: WP shrinks its nav type here (clamp() bottoms
   out around 14.6px at 600px); reproduce that so the single row keeps
   fitting instead of wrapping under the fixed navbar. Measured: the row
   needs ≤409px for the menu at 768px; 8px side padding gives ~395px. */
@media (min-width: 768px) and (max-width: 991px) {
  .navbar-default .navbar-nav > li > a {
    font-size: 15px;
    padding: 7px 8px;
  }
}

/* Smaller screens: shrink the header so the fixed bar stays usable.
   WP collapses to a hamburger below 600px; the app has no hamburger
   menu (not built — same known deviation as the BaTelÒc portal), so the
   menu wraps instead. The body offset below is the tallest header the
   narrow range produces (measured at 320…767px). */
@media (max-width: 767px) {
  body {
    padding-top: 145px !important;
  }

  .navbar {
    padding: 10px 0;
  }

  .navbar-brand .portal-name {
    font-size: 16px;
  }

  .navbar-default .navbar-nav > li > a {
    font-size: 14px;
    line-height: 22px;
    padding: 4px 8px;
  }

  .navbar-default .btn {
    font-size: 12px;
    padding: 4px 8px;
  }

  .sidebar,
  .segments-editor {
    top: 145px;
  }
}
