/*
 * 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. The column rule's
 * guards raise it to (0,4,0); a theme rule aimed at those columns needs that much.
 */

/* 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 two :not()s limit this to a bare col in a plain row. `.row>.col` outranks
 * the sized classes (.col-12, .col-md-4, .row-cols-3>*), so without them
 * `col col-12` would lose its width and a row-cols grid would not wrap. */
.row:not([class*="row-cols-"])>.col:not([class*="col-"]){flex:1 1 0%;max-width:100%;min-width:0}

/* BS5 added a 1320px container at xxl. Bootstrap 4 stopped at 1140px. */
@media (min-width:1400px){.container{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. :where(a) keeps the specificity at
 * .btn's, so theme button classes still win. */
:where(a).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}
}