/* BaTelÒc portal overlay — additive styles on top of bundle.css.
   Served by /corpus/api/portal.css when the Host maps to the "oc" portal.
   Values calibrated against bateloc.univ-tlse2.fr (Twenty Twenty-Five). */

/* Self-hosted Manrope (SIL Open Font License 1.1) — same typeface as
   bateloc.univ-tlse2.fr. The weight range is required for the variable
   font: without it, font-weight 300 does not reliably pick the light cut. */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 200 800;
  font-display: fallback;
  src: url('/corpus/img/portals/manrope-var.woff2') format('woff2');
}

/* Global typography — mirrors the WP body rule:
   Manrope, font-weight 300, letter-spacing -0.1px. */
body {
  font-family: 'Manrope', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-weight: 300;
  letter-spacing: -0.1px;
  /* index.html pins `padding-top: 50px` inline for the 51px navbar;
     the taller header below needs the matching offset. */
  padding-top: 135px !important;
}

/* Top bar: opaque white on the app's base color, borderless, WP-like
   height. 37px padding + 61px logo ≈ 135px, matching WP's header
   (20px padding + 96px 16:9 frame whose artwork renders ~61px tall).
   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: 37px 0;
}

/* WP header layout: near-full-width container with clamp(30px, 5vw, 50px)
   side padding, logo far left, menu pushed to the right.
   Flexbox instead of Bootstrap floats: `.navbar-right` on the menu <ul>
   would float it to the far right PAST the login buttons (the first
   float-right element becomes the rightmost). margin-left: auto keeps the
   reading order: logo … menu … login buttons. */
.navbar > .container {
  width: auto;
  max-width: none;
  padding-left: clamp(30px, 5vw, 50px);
  padding-right: clamp(30px, 5vw, 50px);
  display: flex;
  align-items: center;
}

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

.navbar-brand {
  padding: 0;
  height: auto;
  display: flex;
  align-items: center;
}

/* 61px matches WP's rendered artwork: the WP header shows the 1920x1080
   frame at 171px wide, so the trimmed artwork (1806/1920 of the frame)
   renders ~161px wide = 61px tall at this image's 2.63:1 ratio. */
.navbar-brand img {
  height: 61px;
  width: auto;
}

/* Push the menu (and everything after it) to the right edge.
   Bootstrap's .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 > .navbar-nav {
  float: none !important;
  margin: 0 0 0 auto;
}

.navbar > .container > .navbar-right {
  float: none !important;
  margin: 0 0 0 15px;
}

/* Nav links — WP: Manrope clamp(1rem…1.125rem), weight 300, -0.1px. */
.navbar-default .navbar-nav > li > a {
  font-size: 17px;
  font-weight: 300;
  letter-spacing: -0.1px;
  color: #111111;
  padding: 10px 15px;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #111111;
  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: #111111;
  background-color: transparent;
  text-decoration: underline;
}

/* Dropdown contents: light Manrope to match. */
.navbar-default .dropdown-menu > li > a {
  font-weight: 300;
  letter-spacing: -0.1px;
}

/* Login/signup buttons: subdued outline style (WP has no buttons; these
   stay corpus-only). */
.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 (~135px). */
.sidebar {
  top: 135px;
}

.segments-editor {
  top: 135px;
}

/* Footer: WordPress-like spacing */
footer hr {
  margin-bottom: 30px;
}

.portal-footer-columns {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

.portal-footer-columns .footer-links {
  float: none;
}

.portal-footer-columns .menu li {
  margin-left: 0;
  margin-bottom: 8px;
}

.attribution {
  margin-top: 24px;
}

/* Smaller screens: shrink the header so the fixed bar stays usable.
   (The app has no hamburger menu — WP collapses; not built here.) */
@media (max-width: 767px) {
  body {
    padding-top: 70px !important;
  }

  .navbar {
    padding: 10px 0;
  }

  .navbar-brand img {
    height: 40px;
  }

  .navbar-default .navbar-nav > li > a {
    font-size: 15px;
    padding: 5px 10px;
  }

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