/**
 * Host-site neutralisation.
 *
 * Hand-authored, and deliberately NOT run through bin/scope-css.py: tokens.css,
 * site.css and catalogue.css are generated from the standalone site's originals
 * and get regenerated whenever the scoper changes, which would silently drop
 * anything added to them by hand.
 *
 * Everything here exists because the section installs onto a site whose
 * GeneratePress settings are saved and are not ours. Loaded last.
 */

/* --------------------------------------------------------------- palette */

/*
 * GeneratePress builds ~12 KB of inline CSS from the host's saved
 * generate_settings and references these seven variables 42 times across it --
 * links, buttons, navigation, containers, footer. Redefining them on the
 * section turns all of that output to the BADCC palette at once, which is far
 * more durable than chasing GeneratePress's individual selectors.
 *
 * This is what badcc_global_colors() used to do through generate_option_defaults.
 * That only ever worked because the standalone site had never saved any
 * GeneratePress settings; a saved value always beats a filtered default.
 */
.badcc-scope{
  --contrast:#F2F2ED;
  --contrast-2:#A6AC9E;
  --contrast-3:#6E8161;
  --base:#1C201A;
  --base-2:#0B0D0B;
  --base-3:#0B0D0B;
  --accent:#D7965A;
}

/* ------------------------------------------------------------ background */

/*
 * The host paints a wood texture onto the body and, because this section runs
 * in one-container mode, onto .container as well
 * (generatepress/inc/css-output.php:383). The design is a flat dark ground, so
 * strip the image and let the body colour through.
 */
body.badcc-scope{ background-image:none; }

/*
 * body-prefixed deliberately. GeneratePress's rule is
 * `.one-container .container` at (0,2,0) and `.badcc-scope .container` ties it,
 * leaving us winning on load order alone -- which has already gone wrong on
 * this project more than once. `body.badcc-scope .container` is (0,2,1) and
 * wins wherever it loads.
 */
body.badcc-scope .container,
body.badcc-scope .site-content,
body.badcc-scope .inside-article,
body.badcc-scope .page-header,
body.badcc-scope .inside-page-header,
body.badcc-scope .inside-footer-widgets{
  background-image:none;
  background-color:transparent;
}

/* ------------------------------------------------------------ typography */

/*
 * GeneratePress writes `body, button, input, select, textarea` and
 * `.main-navigation a` font-family rules from the host's saved font manager.
 * The second is two classes, so beating it needs three. The standalone site
 * never hit this: with no saved settings the theme emits no font rules at all
 * and everything simply inherits from body.
 */
.badcc-scope button,
.badcc-scope input,
.badcc-scope select,
.badcc-scope textarea{ font-family:var(--badcc-body); }

.badcc-scope .main-navigation a,
.badcc-scope .main-navigation .menu-toggle,
.badcc-scope .main-navigation .menu-bar-items{ font-family:var(--badcc-body); }

/* ------------------------------------------------------------ sticky footer */

/*
 * The footer is a direct child of <body> (div.site-footer after #page), so a
 * short page would leave it floating mid-screen. Make body a column that is at
 * least one viewport tall and let the footer take the slack above it.
 * #page is a .grid-container (max-width + auto margins), which a flex item
 * would shrink-wrap, so it is given an explicit full width. The admin bar
 * pushes <html> down by its own height; subtract it so no scrollbar appears.
 */
body.badcc-scope{
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
}
body.badcc-scope.admin-bar{ min-height:calc(100vh - 32px); min-height:calc(100dvh - 32px); }
@media (max-width:782px){
  body.badcc-scope.admin-bar{ min-height:calc(100vh - 46px); min-height:calc(100dvh - 46px); }
}
body.badcc-scope > #page{ flex:1 0 auto; width:100%; }
body.badcc-scope > .site-footer{ margin-top:auto; flex-shrink:0; width:100%; }

/* Credit on the left, link back to the host site on the right. */
/* The host's own .copyright-bar rule pins it to 200px wide and 50px tall with a
   10px line-height, which is what wrapped the credit into a narrow column. */
body.badcc-scope .site-info .inside-site-info{
  display:block;
  width:100%;
  max-width:none;
  box-sizing:border-box;
  /* The host sets padding:10px 1300px 10px 0 here (a fixed right padding of
     1300px), which squeezed the whole bar into the left ~600px. */
  padding:14px 30px;
}
body.badcc-scope .copyright-bar .badcc-copy-main{ display:block; }
body.badcc-scope .copyright-bar .badcc-copy,
body.badcc-scope .copyright-bar .badcc-copy-contact{ display:block; }
body.badcc-scope .copyright-bar{
  position:static;
  width:100%;
  box-sizing:border-box;
  margin:0;
  height:auto;
  line-height:1.7;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:space-between;
  gap:6px 24px;
  text-align:left;
}
body.badcc-scope .copyright-bar .badcc-mainsite{
  margin-left:auto;
  white-space:nowrap;
  color:var(--badcc-amber);
  background:none;
  padding:0;
  text-decoration:none;
}
body.badcc-scope .copyright-bar .badcc-mainsite:hover,
body.badcc-scope .copyright-bar .badcc-mainsite:focus-visible{ color:var(--badcc-bone); }

/* ------------------------------------------------------------ film catalogue width */

/*
 * The film grid is auto-fill, so columns appear and disappear with the width it
 * is given -- but two max-width caps kept that width fixed on large screens:
 * the plugin's own .badcc-wrap (1180px) and the host's .grid-container on #page.
 * Lift both on the catalogue views only; single films and the marketing pages
 * keep their readable measure.
 */
body.badcc-scope.post-type-archive-film #page,
body.badcc-scope.tax-film_category #page{ max-width:none; }
body.badcc-scope.post-type-archive-film .badcc-catalogue .badcc-wrap,
body.badcc-scope.tax-film_category .badcc-catalogue .badcc-wrap{ max-width:none; }