/**
 * Additions to the original poltextv2 theme.
 *
 * Loaded last, after css/site/main.css. Nothing here restyles the 2015 design; it
 * covers three gaps:
 *
 *  1. Drupal utility classes the theme relied on but did not ship (they lived in core's
 *     system.base.css, which is not part of the theme directory).
 *  2. Two elements that carried a duplicated id="wrapper" on the live site and had to be
 *     renamed to keep the markup valid.
 *  3. The catalogue, analyses and polimeter pages, which have no 2015 counterpart. Their
 *     declarations are copied from the theme's own Views-listing, file-button, dropdown
 *     and Polimètre rules so they read as part of the same site.
 *
 * Class names are deliberately unchanged: src/scripts/{catalogue,analyses,polimeter}.ts
 * emit and query them, so renaming would mean editing the scripts for no visual gain.
 */

/* -------------------------------------------------------------------------- */
/* 1. Drupal core utilities (from system.base.css)                             */
/* -------------------------------------------------------------------------- */

.element-invisible {
  position: absolute !important;
  clip: rect(1px, 1px, 1px, 1px);
  overflow: hidden;
  height: 1px;
}

.element-focusable:active,
.element-focusable:focus {
  position: static !important;
  clip: auto;
  overflow: visible;
  height: auto;
}

/* -------------------------------------------------------------------------- */
/* 2. Renamed wrappers                                                          */
/* -------------------------------------------------------------------------- */

/* Was `#basDePage #wrapper`, the second of three elements sharing that id. */
.footer-inner {
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

@media screen and (min-width: 975px) {
  .footer-inner {
    width: 950px;
  }
}

/* Was `#slider`, which the front page repeated once per card. The declarations below are
   copied verbatim from css/site/main.css; only the selector prefix changed. */
.slider {
  display: none;
  background-color: #f7f7f7;
  width: 100%;
  margin-top: 0;
  z-index: 9;
}

.slider ul { padding: 0; }
.slider ul ul { display: none; margin-bottom: 0; margin-top: 0; }
.slider ul .active { display: block; }

.slider li {
  list-style: none;
  display: block;
  overflow: hidden;
  background-color: #1e1e1e;
  margin-top: 1px;
  position: relative;
}

.slider li a {
  font-family: "proximaLight", Myriad Pro, sans-serif;
  color: #f7f7f7;
  display: block;
  padding: 15px 30px 15px 15px;
}

.slider li a:hover { background-color: #353535; }

.slider li a:after {
  content: "\25BA";
  font-size: 13px;
  padding: 1.2em 0em;
  font-weight: bold;
  position: absolute;
  top: 0;
  right: 15px;
  display: block;
  color: #f7f7f7;
}

.slider li li a:after { content: none; }
.slider li li { background-color: #353535; padding: 0; }
.slider li li a:hover { color: #adadad; }
.slider li li li { background-color: #5B5B5B; }
.slider li li li a { margin-left: 15px; }
.slider li li li a:hover { color: #adadad; background-color: #5B5B5B; }
.slider li li.expanded li a:after { content: ""; }
.slider .menu li.expanded a.nolink { cursor: pointer; }

/* Legacy redirect pages, which render outside the full shell. */
.redirect-page {
  max-width: 950px;
  margin: 40px auto;
  padding: 30px 25px;
  background-color: #f7f7f7;
  box-shadow: 4px 4px 8px 0 rgba(50, 50, 50, 0.15);
  font-family: "proximaLight", Myriad Pro, sans-serif;
}

.redirect-page h1 {
  font-family: "proximaLight", Myriad Pro, sans-serif;
  font-size: 28px;
  font-weight: normal;
  color: #2d2d2d;
  margin: 0 0 5px;
}

.redirect-page a {
  color: #764e18;
}

/* -------------------------------------------------------------------------- */
/* 3. Shared furniture for the archive-only pages                              */
/* -------------------------------------------------------------------------- */

/* Native selects, styled after the theme's msDropdown skin (.dropdownListe.ddcommon)
   rather than loading jQuery and the plugin. The `name` attributes stay untouched
   because catalogue.ts reads them through FormData. */
#conteneur #page select,
#conteneur #page input[type="search"],
#conteneur #page input[type="number"],
#conteneur #page input[type="text"] {
  -webkit-appearance: none;
  appearance: none;
  background-color: #e8e3da;
  border: 2px solid #2d2d2d;
  border-radius: 0;
  color: #2d2d2d;
  cursor: pointer;
  font-family: "proximaLight", Myriad Pro, sans-serif;
  font-size: 1.125em;
  padding: 0.25em 0.75em;
  width: 100%;
  margin-bottom: 0.5em;
}

#conteneur #page select {
  background-image: url('/theme/poltextv2/images/fleche_noire_bas.png');
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 45px;
}

#conteneur #page select:hover {
  opacity: 0.6;
}

#conteneur #page input[type="search"],
#conteneur #page input[type="number"] {
  cursor: text;
}

/* Each filter is a <label> wrapping a <span> caption and its control. */
#conteneur #page .filter-panel label {
  display: block;
  margin-bottom: 0.5em;
}

#conteneur #page .filter-panel label span {
  display: block;
  font-family: "proximaBold", Myriad Pro, sans-serif;
  font-size: 14px;
  color: #2d2d2d;
  margin-bottom: 4px;
}

#conteneur #page .filter-panel h2 {
  font-family: "proximaBold", Myriad Pro, sans-serif;
  font-weight: normal;
  font-size: 16px;
  color: #2d2d2d;
  margin: 30px 0 10px;
}

/* The theme's file-link button: sand fill, square 2px rule, chevron at the right,
   inverting to dark on hover. Copied from `#conteneur #page a.btLienFichier`. */
#conteneur #page a.btLienFichier,
#conteneur #page a.download,
#conteneur #page .record-collection__catalogue {
  background: url('/theme/poltextv2/images/menu-collapsed.png') no-repeat 98% 52% #e8e3da;
  padding: 5px 20px 5px 5px;
  border: 2px solid #2d2d2d;
  display: block;
  font-weight: bold;
  margin-bottom: 10px;
  color: #2d2d2d;
  max-width: 20em;
}

#conteneur #page a.btLienFichier:hover,
#conteneur #page a.download:hover,
#conteneur #page .record-collection__catalogue:hover {
  border: 2px solid #e8e3da !important;
  background: url('/theme/poltextv2/images/menu-collapsed_hover.png') no-repeat 98% 52% #2d2d2d;
  color: #e8e3da !important;
}

/* Buttons reuse the outline treatment the theme gave #edit-submit. */
#conteneur #page button,
#conteneur #page .reset-button,
#conteneur #page .load-more {
  font-family: "proximaBold", Myriad Pro, sans-serif;
  font-weight: normal;
  font-size: 1em;
  color: #2d2d2d;
  background-color: transparent;
  border: 1px solid #2d2d2d;
  border-radius: 0;
  padding: 6px 16px;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}

#conteneur #page button:hover,
#conteneur #page .reset-button:hover,
#conteneur #page .load-more:hover {
  background-color: #2d2d2d;
  color: #f7f7f7;
}

/* The theme's Views listing chrome: block band, grouping header, sub-heading rule. */
#conteneur #page .results-panel,
#conteneur #page .polimeter__stats,
#conteneur #page .analysis-table {
  background-color: #e2dddc;
}

#conteneur #page .results-summary,
#conteneur #page .chart-heading,
#conteneur #page .record-collection__heading h2,
#conteneur #page .polimeter__heading h2 {
  font-family: "proximaBold", Myriad Pro, sans-serif;
  background-color: #d7cfcd;
  font-weight: bold;
  font-size: 1.25em;
  padding: 16px;
  margin: 0;
  color: #2d2d2d;
}

/* -------------------------------------------------------------------------- */
/* 3a. Catalogue                                                                */
/* -------------------------------------------------------------------------- */

#conteneur #page .filter-panel {
  margin-bottom: 1.5em;
}

#conteneur #page .filter-panel > div {
  margin-bottom: 0.5em;
}

#conteneur #page .filter-panel label {
  display: block;
  font-family: "proximaBold", Myriad Pro, sans-serif;
  font-size: 14px;
  color: #2d2d2d;
  margin-bottom: 4px;
}

#conteneur #page .catalogue-results {
  padding: 0;
  margin: 0;
  list-style: none;
}

#conteneur #page .catalogue-row {
  padding: 16px;
  margin: 0 16px;
  border-top: 1px #c0bdbc solid;
  font-family: "proximaLight", Myriad Pro, sans-serif;
  color: #2d2d2d;
}

#conteneur #page .catalogue-row:first-of-type {
  border-top: none;
}

#conteneur #page .catalogue-row__class {
  font-family: "proximaBold", Myriad Pro, sans-serif;
  font-size: 12px;
  color: #686868;
  text-transform: uppercase;
}

#conteneur #page .catalogue-row__class small {
  margin-left: 8px;
  font-family: "proximaLight", Myriad Pro, sans-serif;
  color: #969288;
}

#conteneur #page .catalogue-row__body h2 {
  font-family: "proximaBold", Myriad Pro, sans-serif;
  font-weight: normal;
  font-size: 1.17em;
  margin: 4px 0 0;
}

#conteneur #page .catalogue-row__body a {
  color: #764e18;
}

#conteneur #page .catalogue-row__body p {
  color: #696969;
  margin: 4px 0 0;
}

#conteneur #page .catalogue-row__meta {
  list-style: none;
  padding: 0;
  margin: 6px 0 0;
  font-size: 12px;
  color: #696969;
}

#conteneur #page .catalogue-row__meta li {
  display: inline;
  margin: 0;
  color: #696969;
}

#conteneur #page .catalogue-row__meta li::after {
  content: ' / ';
  color: #c0bdbc;
}

#conteneur #page .catalogue-row__meta li:last-child::after {
  content: none;
}

#conteneur #page .catalogue-empty,
#conteneur #page .empty-note,
#conteneur #page .polimeter__empty {
  padding: 16px;
  color: #696969;
  font-family: "proximaLight", Myriad Pro, sans-serif;
}

#conteneur #page .catalogue-note,
#conteneur #page .method-note {
  font-size: 12px;
  color: #696969;
  margin-top: 1.5em;
}

/* `hidden` must keep winning over the display rules below — the original stylesheet
   set `.load-more { display: block }` with no guard, so the button stayed visible
   when the script had hidden it. */
#conteneur #page .load-more {
  display: block;
  margin: 16px auto;
}

#conteneur #page [hidden] {
  display: none !important;
}

/* Browse-by-corpus pages: a facet column beside the listing, above 975px only. */
#conteneur #page .browse__side h2 {
  font-family: "proximaBold", Myriad Pro, sans-serif;
  font-weight: normal;
  font-size: 16px;
  color: #2d2d2d;
  margin: 30px 0 10px;
}

#conteneur #page .browse__facets {
  list-style: none;
  padding: 0;
  margin: 0 0 1.5em;
}

#conteneur #page .browse__facets li {
  margin-bottom: 8px;
}

#conteneur #page .browse__facets i {
  font-style: normal;
  color: #969288;
  font-size: 12px;
}

#conteneur #page .browse__more {
  margin-top: 1.5em;
}

#conteneur #page .catalogue-row__body h3 {
  font-family: "proximaBold", Myriad Pro, sans-serif;
  font-weight: normal;
  font-size: 1.17em;
  margin: 4px 0 0;
}

@media screen and (min-width: 975px) {
  #conteneur #page .browse {
    display: flex;
    align-items: flex-start;
    gap: 30px;
  }

  #conteneur #page .browse__side {
    flex: 0 0 210px;
  }

  #conteneur #page .browse__main {
    flex: 1 1 auto;
    min-width: 0;
  }

  #conteneur #page .browse__side h2:first-child {
    margin-top: 0;
  }
}

/* -------------------------------------------------------------------------- */
/* 3b. Record pages                                                             */
/* -------------------------------------------------------------------------- */

/* Preservation notice on the archived Polimètre pages. */
#conteneur #page .archive-snapshot {
  display: block;
  background-color: #e8e3da;
  border-left: 4px solid #2d2d2d;
  padding: 12px 16px;
  margin-bottom: 1.5em;
  font-family: "proximaLight", Myriad Pro, sans-serif;
  color: #2d2d2d;
}

#conteneur #page .archive-snapshot strong {
  display: block;
  font-family: "proximaBold", Myriad Pro, sans-serif;
  font-weight: normal;
  margin-bottom: 4px;
}

/* Provenance, printed quietly at the foot of a record rather than under its title. */
#conteneur #page .record-classification,
#conteneur #page .record-stamp {
  margin: 0.5em 0 0;
  font-size: 12px;
  color: #696969;
}

#conteneur #page .record-classification {
  margin-top: 2em;
  padding-top: 0.75em;
  border-top: 1px #c0bdbc solid;
}

#conteneur #page .record-stamp div {
  display: inline-block;
  margin-right: 1.5em;
}

#conteneur #page .record-stamp dt,
#conteneur #page .metadata dt {
  font-family: "proximaBold", Myriad Pro, sans-serif;
  color: #2d2d2d;
  display: inline;
}

#conteneur #page .record-stamp dd,
#conteneur #page .metadata dd {
  display: inline;
  margin: 0 0 0 4px;
  color: #696969;
}

#conteneur #page .metadata div {
  margin-bottom: 8px;
}

#conteneur #page .metadata-heading,
#conteneur #page .record-collection__summary strong {
  font-family: "proximaBold", Myriad Pro, sans-serif;
  font-weight: normal;
  font-size: 16px;
  color: #2d2d2d;
  margin-top: 30px;
}

#conteneur #page .downloads,
#conteneur #page .metadata {
  margin-top: 30px;
}

#conteneur #page .file-icon {
  margin-right: 6px;
}

#conteneur #page .download small {
  display: block;
  font-weight: normal;
  font-size: 12px;
}

/* Files absent from the delivered archive render as plain text, not as links. */
#conteneur #page .archive-missing-link {
  color: #696969;
}

#conteneur #page .collection-label,
#conteneur #page .dossier-label {
  font-family: "proximaBold", Myriad Pro, sans-serif;
  font-size: 12px;
  text-transform: uppercase;
  color: #686868;
  margin: 2em 0 0.5em;
}

#conteneur #page .record-collection__summary {
  margin: 1em 0;
  color: #696969;
}

#conteneur #page .record-collection__summary strong {
  margin-right: 0.5em;
}

#conteneur #page .record-collection__list {
  list-style: none;
  padding: 0;
}

#conteneur #page .record-collection__list li {
  padding-top: 8px;
  border-top: 1px #c0bdbc solid;
}

#conteneur #page .record-collection__list li:first-of-type {
  border-top: none;
}

#conteneur #page .record-collection__list span {
  font-size: 12px;
  color: #696969;
  margin-left: 8px;
}

/* -------------------------------------------------------------------------- */
/* 3c. Polimètre                                                                */
/* -------------------------------------------------------------------------- */

#conteneur #page .polimeter__stats {
  padding: 16px;
  margin-bottom: 1em;
}

#conteneur #page .polimeter-stat {
  display: inline-flex;
  align-items: baseline;
  gap: 0.5em;
  margin: 0 1.5em 0.5em 0;
  padding: 4px 10px;
  border: 1px solid #2d2d2d;
  background-color: transparent;
  font-family: "proximaLight", Myriad Pro, sans-serif;
  color: #2d2d2d;
  cursor: pointer;
}

#conteneur #page .polimeter-stat:hover {
  background-color: #2d2d2d;
  color: #f7f7f7;
}

#conteneur #page .polimeter-stat--total {
  font-family: "proximaBold", Myriad Pro, sans-serif;
  border: none;
  cursor: default;
}

#conteneur #page .polimeter-stat--total:hover {
  background-color: transparent;
  color: #2d2d2d;
}

#conteneur #page .promise-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

#conteneur #page .promise-card {
  padding: 16px;
  margin: 0 16px;
  border-top: 1px #c0bdbc solid;
}

#conteneur #page .promise-card a,
#conteneur #page .promise-card strong {
  color: #3e3e3e;
}

#conteneur #page .promise-card__context {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75em;
  font-size: 12px;
  color: #696969;
}

#conteneur #page .promise-id {
  font-size: 12px;
  color: #969288;
}

#conteneur #page .promise-card h3 {
  font-family: "proximaLight", Myriad Pro, sans-serif;
  font-weight: normal;
  font-size: 1em;
  margin: 0.5em 0 0;
}

#conteneur #page .promise-card__language {
  font-size: 12px;
  color: #969288;
}

/* The five promise states, in the theme's own colours. */
#conteneur #page .promise-status {
  display: inline-block;
  height: 20px;
  line-height: 20px;
  padding: 0 8px;
  background-color: #adafac;
  color: #ffffff;
  font-family: "proximaLight", Myriad Pro, sans-serif;
  font-size: 12px;
}

#conteneur #page .promise-status--kept { background-color: #34ad4e; }
#conteneur #page .promise-status--partial { background-color: #f88216; }
#conteneur #page .promise-status--pending { background-color: #596d75; }
#conteneur #page .promise-status--broken { background-color: #e12f2f; }

/* -------------------------------------------------------------------------- */
/* 3d. Analyses                                                                 */
/* -------------------------------------------------------------------------- */

#conteneur #page .chart-card {
  background-color: #e8f1f0;
  padding: 0;
  margin-bottom: 1.5em;
}

#conteneur #page .chart-heading {
  background-color: #85b0a9;
  color: #ffffff;
  font-family: "proximaLight", Myriad Pro, sans-serif;
  font-weight: bold;
  padding: 15px 16px;
}

#conteneur #page .chart-legend,
#conteneur #page .analysis-status {
  padding: 0 16px;
  font-size: 12px;
  color: #696969;
}

#conteneur #page .chart {
  padding: 16px;
}

#conteneur #page .grid-line {
  stroke: #dfdbd9;
}

#conteneur #page .axis-label {
  fill: #696969;
  font-family: "proximaLight", Myriad Pro, sans-serif;
  font-size: 11px;
}

#conteneur #page .score-point {
  fill: #85b0a9;
}

#conteneur #page .analysis-table {
  border-spacing: 2px;
  border-collapse: separate !important;
  width: 100%;
}

#conteneur #page .analysis-table th {
  padding: 5px;
  background-color: #d5ccca;
  color: #2d2d2d;
  border: #d5ccca;
  font-size: 12px;
}

#conteneur #page .analysis-table td {
  background-color: #e5e1e0;
  padding: 6px !important;
  font-size: 12px;
  color: #696969;
}

/* -------------------------------------------------------------------------- */
/* 3e. Plan du site                                                             */
/* -------------------------------------------------------------------------- */

#conteneur #page .plan-du-site {
  list-style: none;
  padding: 0;
}

/* Section parents carry no destination, so they must not read as links here. Inside a
   #slider panel they keep the theme's own light-on-dark treatment. */
#conteneur #page a.nolink {
  color: #2d2d2d;
  cursor: default;
}

#conteneur #page .plan-du-site ul {
  list-style: none;
  padding-left: 20px;
}

#conteneur #page .plan-du-site > li {
  margin-bottom: 1.5em;
}

#conteneur #page .plan-du-site > li > strong {
  font-family: "proximaBold", Myriad Pro, sans-serif;
  font-weight: normal;
  font-size: 1.25em;
  display: block;
  background-color: #d7cfcd;
  padding: 16px;
  margin-bottom: 0.5em;
  color: #2d2d2d;
}

/* A near-invisible dot at the very bottom reveals the archive credit. */
footer .archive-easter-egg {
  clear: both;
  color: #696969;
  text-align: center;
}

footer .archive-easter-egg summary {
  width: fit-content;
  margin: 0 auto;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
  opacity: 0.45;
  padding: 4px 12px;
  user-select: none;
  transition: opacity 150ms ease;
}

footer .archive-easter-egg summary:hover,
footer .archive-easter-egg summary:focus-visible,
footer .archive-easter-egg[open] summary {
  opacity: 1;
}

footer .archive-easter-egg summary::marker,
footer .archive-easter-egg summary::-webkit-details-marker {
  display: none;
  content: "";
}

footer .archive-easter-egg p {
  margin: 4px 0 14px;
  font-size: 11px;
}
