/*
 * Bootstrap 4 -> 5 compatibility shim for migrated v1 content (#3797).
 *
 * v1's CMS content is Bootstrap 4 markup; base.html serves Bootstrap 5.2.3, which
 * removed or renamed every class below. This aliases the BS4 names the fleet
 * actually uses (a read-only scan of 49 live v1 sites, 2026-09-28) onto their BS5
 * behaviour. It is a bounded layer, NOT a port of Bootstrap 4: a name goes in only
 * if migrated content uses it, and SHIMMED / SPACING_FAMILIES in
 * pinogy_app/bootstrap4_compat.py are the list the suite checks this file against,
 * both ways. RESTORED there lists the names BS5 kept but changed (the grid's .col,
 * .container, links and .btn), which this file sets back to Bootstrap 4.6 (#5252).
 *
 * Linked from base.html only for a tenant that started as a v1 site
 * (bootstrap4_compat.schema_loads_shim). Never linked from shop_base.html, which is
 * the Bootstrap 4 root and has all of this already.
 *
 * Left out on purpose -- they need component CSS, not an alias, and a half-right
 * one is worse than a visibly wrong one: close, media, jumbotron, embed-responsive.
 * The import counts them and mig_report.md lists them as hand-fix items.
 *
 * This does not restore v1's own template CSS (theme.css, theme-elements.css,
 * pinogy-1.0.1.css). See docs/bootstrap4-compat-shim.md.
 *
 * Utilities carry !important, as they did in Bootstrap 4 and do in Bootstrap 5.
 */

/* Renamed utilities: text-start / text-end, fw-bold / fw-normal. */
.text-left{text-align:left!important}
.text-right{text-align:right!important}
.font-weight-bold{font-weight:700!important}
.font-weight-normal{font-weight:400!important}

/* sr-only -> visually-hidden. */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* no-gutters -> g-0. */
.no-gutters{--bs-gutter-x:0;--bs-gutter-y:0}

/* Removed outright in Bootstrap 5; restored with Bootstrap 4.6's own values. */
.form-group{margin-bottom:1rem}
.btn-block{display:block;width:100%}
.btn-block+.btn-block{margin-top:.5rem}
input[type=submit].btn-block,input[type=reset].btn-block,input[type=button].btn-block{width:100%}

/*
 * Names Bootstrap 5 kept but changed (#5252), set back to what Bootstrap 4.6 did.
 * These are not aliases, so they have no !important. The theme stylesheet loads
 * after this one and wins at equal or higher specificity. Every guard below sits
 * inside :where(), so each rule is only as specific as the Bootstrap 5 rule it
 * replaces (#5662): a theme or plugin rule such as `.hero .col{flex:0 0 50%}`
 * still wins.
 */

/* Equal-width columns. BS5 gives them flex:1 0 0%. Bootstrap 4 gave them
 * flex:1 1 0, so they shrank to share a row with a fixed column such as col-md-3.
 * min-width:0 cancels the flex item's content-based minimum, so an image in the
 * column cannot push the column onto its own line. The trade-off: content that
 * cannot shrink (an iframe or table with a set width, a long unbroken URL) now
 * overflows the column instead of widening it.
 * (0,1,0), the same as BS5's .col and .row>*, and later, so it wins over those and
 * loses to anything more specific. The guards keep it to a bare col in a plain
 * row: a sized column (col-12, col-md-4) and a row-cols grid keep BS5's sizing,
 * which this rule would otherwise beat on order. A class *token* starting col- is
 * what excludes a column, so `col hero-col-image` still takes the rule. Tokens
 * split by a tab, newline or form feed (\9, \a, \c) count too; migrated v1 HTML
 * wraps long class attributes (CR never reaches the DOM). Bare
 * breakpoint columns (col-md, col-lg) are excluded too, and keep flex:1 0 0%.
 * max-width is BS5's own, from .row>*. */
:where(.row:not([class*="row-cols-"]))>.col:where(:not([class^="col-"]):not([class*=" col-"]):not([class*="\a col-"]):not([class*="\9 col-"]):not([class*="\c col-"])){flex:1 1 0%;min-width:0}

/* BS5 added a 1320px container at xxl, for .container and every .container-{bp}.
 * Bootstrap 4 stopped at 1140px for all of them. .container-xxl is BS5-only. */
@media (min-width:1400px){.container,.container-sm,.container-md,.container-lg,.container-xl{max-width:1140px}}

/* Bootstrap 4 left links un-underlined until hover. BS5 underlines every link.
 * The hover underline is for bare links only, so BS5 components with a class,
 * such as nav-link or dropdown-item, do not get it. :where() keeps the guard out
 * of the specificity, so the rule is (0,1,1) like BS4's a:hover, and a later
 * theme rule such as `.pagination li a{text-decoration:none}` still wins. */
a{text-decoration:none}
a:where(:not([class])):hover{text-decoration:underline}
.btn-link{text-decoration:none}
.btn-link:hover,.btn-link:focus{text-decoration:underline}

/* BS5's .btn sets font-family to an empty --bs-btn-font-family. Bootstrap 4 left
 * it to inherit. The site font on a v2.5 page is --general-font, which the
 * theme applies to p, li and headings but not to body. If --general-font is not
 * set, the declaration falls back to inherit. Links, buttons and submit inputs
 * alike (#5662). :where() keeps the specificity at .btn's, so theme button
 * classes (.theme-primary-btn, .F1) still win. */
:where(a,button,input).btn{font-family:var(--general-font)}

/* v1's base template loaded Open Sans and its content assumes it as the body font
 * (#5380). The default only, with no !important: a site's own CSS, carried in its
 * snippets and head blocks, comes later and sets its own (Proxima Nova on
 * website0028, the system font on website0079). Arial is the fallback v1 used.
 * fullwidth.html forces Open Sans with !important on v2-origin tenants only. */
body{font-family:'Open Sans',Arial,sans-serif}

/* The wrapper pinogy_app.bootstrap4_compat.wrap_authored_content puts around text
 * and snippet output on this tenant (#5380). It adds no box, so the authored
 * markup lays out as if it were not there. The theme's bare-heading rules skip
 * headings inside it. */
v1-content{display:contents}

/* Directional spacing: pl/pr/ml/mr -> ps/pe/ms/me, with breakpoint variants. */
.pl-0{padding-left:0!important}
.pl-1{padding-left:.25rem!important}
.pl-2{padding-left:.5rem!important}
.pl-3{padding-left:1rem!important}
.pl-4{padding-left:1.5rem!important}
.pl-5{padding-left:3rem!important}
.pr-0{padding-right:0!important}
.pr-1{padding-right:.25rem!important}
.pr-2{padding-right:.5rem!important}
.pr-3{padding-right:1rem!important}
.pr-4{padding-right:1.5rem!important}
.pr-5{padding-right:3rem!important}
.ml-0{margin-left:0!important}
.ml-1{margin-left:.25rem!important}
.ml-2{margin-left:.5rem!important}
.ml-3{margin-left:1rem!important}
.ml-4{margin-left:1.5rem!important}
.ml-5{margin-left:3rem!important}
.ml-auto{margin-left:auto!important}
.mr-0{margin-right:0!important}
.mr-1{margin-right:.25rem!important}
.mr-2{margin-right:.5rem!important}
.mr-3{margin-right:1rem!important}
.mr-4{margin-right:1.5rem!important}
.mr-5{margin-right:3rem!important}
.mr-auto{margin-right:auto!important}
@media (min-width:576px){
  .pl-sm-0{padding-left:0!important}
  .pl-sm-1{padding-left:.25rem!important}
  .pl-sm-2{padding-left:.5rem!important}
  .pl-sm-3{padding-left:1rem!important}
  .pl-sm-4{padding-left:1.5rem!important}
  .pl-sm-5{padding-left:3rem!important}
  .pr-sm-0{padding-right:0!important}
  .pr-sm-1{padding-right:.25rem!important}
  .pr-sm-2{padding-right:.5rem!important}
  .pr-sm-3{padding-right:1rem!important}
  .pr-sm-4{padding-right:1.5rem!important}
  .pr-sm-5{padding-right:3rem!important}
  .ml-sm-0{margin-left:0!important}
  .ml-sm-1{margin-left:.25rem!important}
  .ml-sm-2{margin-left:.5rem!important}
  .ml-sm-3{margin-left:1rem!important}
  .ml-sm-4{margin-left:1.5rem!important}
  .ml-sm-5{margin-left:3rem!important}
  .ml-sm-auto{margin-left:auto!important}
  .mr-sm-0{margin-right:0!important}
  .mr-sm-1{margin-right:.25rem!important}
  .mr-sm-2{margin-right:.5rem!important}
  .mr-sm-3{margin-right:1rem!important}
  .mr-sm-4{margin-right:1.5rem!important}
  .mr-sm-5{margin-right:3rem!important}
  .mr-sm-auto{margin-right:auto!important}
}
@media (min-width:768px){
  .pl-md-0{padding-left:0!important}
  .pl-md-1{padding-left:.25rem!important}
  .pl-md-2{padding-left:.5rem!important}
  .pl-md-3{padding-left:1rem!important}
  .pl-md-4{padding-left:1.5rem!important}
  .pl-md-5{padding-left:3rem!important}
  .pr-md-0{padding-right:0!important}
  .pr-md-1{padding-right:.25rem!important}
  .pr-md-2{padding-right:.5rem!important}
  .pr-md-3{padding-right:1rem!important}
  .pr-md-4{padding-right:1.5rem!important}
  .pr-md-5{padding-right:3rem!important}
  .ml-md-0{margin-left:0!important}
  .ml-md-1{margin-left:.25rem!important}
  .ml-md-2{margin-left:.5rem!important}
  .ml-md-3{margin-left:1rem!important}
  .ml-md-4{margin-left:1.5rem!important}
  .ml-md-5{margin-left:3rem!important}
  .ml-md-auto{margin-left:auto!important}
  .mr-md-0{margin-right:0!important}
  .mr-md-1{margin-right:.25rem!important}
  .mr-md-2{margin-right:.5rem!important}
  .mr-md-3{margin-right:1rem!important}
  .mr-md-4{margin-right:1.5rem!important}
  .mr-md-5{margin-right:3rem!important}
  .mr-md-auto{margin-right:auto!important}
}
@media (min-width:992px){
  .pl-lg-0{padding-left:0!important}
  .pl-lg-1{padding-left:.25rem!important}
  .pl-lg-2{padding-left:.5rem!important}
  .pl-lg-3{padding-left:1rem!important}
  .pl-lg-4{padding-left:1.5rem!important}
  .pl-lg-5{padding-left:3rem!important}
  .pr-lg-0{padding-right:0!important}
  .pr-lg-1{padding-right:.25rem!important}
  .pr-lg-2{padding-right:.5rem!important}
  .pr-lg-3{padding-right:1rem!important}
  .pr-lg-4{padding-right:1.5rem!important}
  .pr-lg-5{padding-right:3rem!important}
  .ml-lg-0{margin-left:0!important}
  .ml-lg-1{margin-left:.25rem!important}
  .ml-lg-2{margin-left:.5rem!important}
  .ml-lg-3{margin-left:1rem!important}
  .ml-lg-4{margin-left:1.5rem!important}
  .ml-lg-5{margin-left:3rem!important}
  .ml-lg-auto{margin-left:auto!important}
  .mr-lg-0{margin-right:0!important}
  .mr-lg-1{margin-right:.25rem!important}
  .mr-lg-2{margin-right:.5rem!important}
  .mr-lg-3{margin-right:1rem!important}
  .mr-lg-4{margin-right:1.5rem!important}
  .mr-lg-5{margin-right:3rem!important}
  .mr-lg-auto{margin-right:auto!important}
}
@media (min-width:1200px){
  .pl-xl-0{padding-left:0!important}
  .pl-xl-1{padding-left:.25rem!important}
  .pl-xl-2{padding-left:.5rem!important}
  .pl-xl-3{padding-left:1rem!important}
  .pl-xl-4{padding-left:1.5rem!important}
  .pl-xl-5{padding-left:3rem!important}
  .pr-xl-0{padding-right:0!important}
  .pr-xl-1{padding-right:.25rem!important}
  .pr-xl-2{padding-right:.5rem!important}
  .pr-xl-3{padding-right:1rem!important}
  .pr-xl-4{padding-right:1.5rem!important}
  .pr-xl-5{padding-right:3rem!important}
  .ml-xl-0{margin-left:0!important}
  .ml-xl-1{margin-left:.25rem!important}
  .ml-xl-2{margin-left:.5rem!important}
  .ml-xl-3{margin-left:1rem!important}
  .ml-xl-4{margin-left:1.5rem!important}
  .ml-xl-5{margin-left:3rem!important}
  .ml-xl-auto{margin-left:auto!important}
  .mr-xl-0{margin-right:0!important}
  .mr-xl-1{margin-right:.25rem!important}
  .mr-xl-2{margin-right:.5rem!important}
  .mr-xl-3{margin-right:1rem!important}
  .mr-xl-4{margin-right:1.5rem!important}
  .mr-xl-5{margin-right:3rem!important}
  .mr-xl-auto{margin-right:auto!important}
}