/* Compatibility layer: keeps legacy Bootstrap 3 era page markup working without Bootstrap. Grid rules are generated. */

/* Grid */
.row { display: flex; flex-wrap: wrap; margin-left: -12px; margin-right: -12px; }
.row::after, .clearfix::after { content: ""; display: table; clear: both; }
:where(.row) > [class*="col-"], [class*="col-xs-"], [class*="col-sm-"], [class*="col-md-"], [class*="col-lg-"] { padding-left: 12px; padding-right: 12px; width: 100%; flex: 0 0 auto; max-width: 100%; }
.prose .container { padding: 0; }

.col-xs-1 { width: 8.3333%; }
.col-xs-2 { width: 16.6667%; }
.col-xs-3 { width: 25%; }
.col-xs-4 { width: 33.3333%; }
.col-xs-5 { width: 41.6667%; }
.col-xs-6 { width: 50%; }
.col-xs-7 { width: 58.3333%; }
.col-xs-8 { width: 66.6667%; }
.col-xs-9 { width: 75%; }
.col-xs-10 { width: 83.3333%; }
.col-xs-11 { width: 91.6667%; }
.col-xs-12 { width: 100%; }
.col-xs-offset-0 { margin-left: 0%; }
.col-xs-offset-1 { margin-left: 8.3333%; }
.col-xs-offset-2 { margin-left: 16.6667%; }
.col-xs-offset-3 { margin-left: 25%; }
.col-xs-offset-4 { margin-left: 33.3333%; }
.col-xs-offset-5 { margin-left: 41.6667%; }
.col-xs-offset-6 { margin-left: 50%; }
.col-xs-offset-7 { margin-left: 58.3333%; }
.col-xs-offset-8 { margin-left: 66.6667%; }
.col-xs-offset-9 { margin-left: 75%; }
.col-xs-offset-10 { margin-left: 83.3333%; }
.col-xs-offset-11 { margin-left: 91.6667%; }
@media (min-width: 768px) {
  .col-sm-1 { width: 8.3333%; }
  .col-sm-2 { width: 16.6667%; }
  .col-sm-3 { width: 25%; }
  .col-sm-4 { width: 33.3333%; }
  .col-sm-5 { width: 41.6667%; }
  .col-sm-6 { width: 50%; }
  .col-sm-7 { width: 58.3333%; }
  .col-sm-8 { width: 66.6667%; }
  .col-sm-9 { width: 75%; }
  .col-sm-10 { width: 83.3333%; }
  .col-sm-11 { width: 91.6667%; }
  .col-sm-12 { width: 100%; }
  .col-sm-offset-0 { margin-left: 0%; }
  .col-sm-offset-1 { margin-left: 8.3333%; }
  .col-sm-offset-2 { margin-left: 16.6667%; }
  .col-sm-offset-3 { margin-left: 25%; }
  .col-sm-offset-4 { margin-left: 33.3333%; }
  .col-sm-offset-5 { margin-left: 41.6667%; }
  .col-sm-offset-6 { margin-left: 50%; }
  .col-sm-offset-7 { margin-left: 58.3333%; }
  .col-sm-offset-8 { margin-left: 66.6667%; }
  .col-sm-offset-9 { margin-left: 75%; }
  .col-sm-offset-10 { margin-left: 83.3333%; }
  .col-sm-offset-11 { margin-left: 91.6667%; }
}
@media (min-width: 992px) {
  .col-md-1 { width: 8.3333%; }
  .col-md-2 { width: 16.6667%; }
  .col-md-3 { width: 25%; }
  .col-md-4 { width: 33.3333%; }
  .col-md-5 { width: 41.6667%; }
  .col-md-6 { width: 50%; }
  .col-md-7 { width: 58.3333%; }
  .col-md-8 { width: 66.6667%; }
  .col-md-9 { width: 75%; }
  .col-md-10 { width: 83.3333%; }
  .col-md-11 { width: 91.6667%; }
  .col-md-12 { width: 100%; }
  .col-md-offset-0 { margin-left: 0%; }
  .col-md-offset-1 { margin-left: 8.3333%; }
  .col-md-offset-2 { margin-left: 16.6667%; }
  .col-md-offset-3 { margin-left: 25%; }
  .col-md-offset-4 { margin-left: 33.3333%; }
  .col-md-offset-5 { margin-left: 41.6667%; }
  .col-md-offset-6 { margin-left: 50%; }
  .col-md-offset-7 { margin-left: 58.3333%; }
  .col-md-offset-8 { margin-left: 66.6667%; }
  .col-md-offset-9 { margin-left: 75%; }
  .col-md-offset-10 { margin-left: 83.3333%; }
  .col-md-offset-11 { margin-left: 91.6667%; }
}
@media (min-width: 1200px) {
  .col-lg-1 { width: 8.3333%; }
  .col-lg-2 { width: 16.6667%; }
  .col-lg-3 { width: 25%; }
  .col-lg-4 { width: 33.3333%; }
  .col-lg-5 { width: 41.6667%; }
  .col-lg-6 { width: 50%; }
  .col-lg-7 { width: 58.3333%; }
  .col-lg-8 { width: 66.6667%; }
  .col-lg-9 { width: 75%; }
  .col-lg-10 { width: 83.3333%; }
  .col-lg-11 { width: 91.6667%; }
  .col-lg-12 { width: 100%; }
  .col-lg-offset-0 { margin-left: 0%; }
  .col-lg-offset-1 { margin-left: 8.3333%; }
  .col-lg-offset-2 { margin-left: 16.6667%; }
  .col-lg-offset-3 { margin-left: 25%; }
  .col-lg-offset-4 { margin-left: 33.3333%; }
  .col-lg-offset-5 { margin-left: 41.6667%; }
  .col-lg-offset-6 { margin-left: 50%; }
  .col-lg-offset-7 { margin-left: 58.3333%; }
  .col-lg-offset-8 { margin-left: 66.6667%; }
  .col-lg-offset-9 { margin-left: 75%; }
  .col-lg-offset-10 { margin-left: 83.3333%; }
  .col-lg-offset-11 { margin-left: 91.6667%; }
}

.col-centered, .vcenter { float: none; }
.hidden-xs { display: none !important; }
@media (min-width: 768px) { .hidden-xs { display: revert !important; } .visible-xs { display: none !important; } }

/* Utilities */
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-muted { color: var(--muted); }
.text-success { color: var(--ok); }
.text-danger { color: var(--live); }
.pull-left { float: left; margin-right: 12px; }
.pull-right { float: right; margin-left: 12px; }
.center-block { display: block; margin-left: auto; margin-right: auto; }
.list-unstyled { list-style: none; padding-left: 0; }
.img-responsive { display: block; max-width: 100%; height: auto; }
.img-thumbnail { padding: 4px; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; }
.img-rounded { border-radius: 12px; }
.thumbnail { display: block; padding: 4px; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; }
.bg-success, .bg-info, .bg-warning, .bg-danger { padding: 12px 16px; border-radius: 12px; }
.bg-success { background: #e2f5ea; color: #0d5a35; }
.bg-info { background: #e3f1fb; color: #0b4a75; }
.bg-warning { background: #fff3d6; color: #6d4b00; }
.bg-danger { background: #fde4e0; color: #7d1f10; }
.page-header { border-bottom: 2px solid var(--line); padding-bottom: .3em; margin: 1.6em 0 1em; }
.dl-horizontal dt { font-weight: 700; }

/* Embeds */
.embed-responsive { position: relative; display: block; height: 0; padding: 0; overflow: hidden; border-radius: 12px; }
.embed-responsive-16by9 { padding-bottom: 56.25%; }
.embed-responsive-4by3 { padding-bottom: 75%; }
.embed-responsive .embed-responsive-item, .embed-responsive iframe, .embed-responsive embed, .embed-responsive object, .embed-responsive video { position: absolute; top: 0; left: 0; bottom: 0; width: 100%; height: 100%; border: 0; }
.responsive-video { max-width: 100%; height: auto; }
.iframe-wrapper { width: 100%; }

/* Icons that used Glyphicons */
.glyphicon { font-style: normal; display: inline-block; }
.glyphicon-star::before { content: "\2605"; color: #f5b301; }
.glyphicon-chevron-left::before { content: "\2039"; }
.glyphicon-chevron-right::before { content: "\203A"; }

/* Buttons (base .btn lives in actc.css) */
.btn-default { background: var(--surface); color: var(--ink); border-color: var(--line); }
.btn-primary, .btn-info, .btn-success { background: var(--court); color: #fff; }
.btn-primary:hover, .btn-info:hover, .btn-success:hover { background: var(--court-deep); color: #fff; }
.btn-link { background: none; color: var(--link); }
.btn-lg { padding: 14px 28px; font-size: 1.1rem; }
.btn-block { display: flex; width: 100%; margin: 8px 0; }
.btn.active { box-shadow: inset 0 0 0 2px var(--ball); }

/* Tables */
.prose table, .table { width: 100%; border-collapse: collapse; font-size: .95rem; background: var(--surface); }
.prose th, .prose td, .table th, .table td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.prose th, .table th { background: var(--surface-2); font-weight: 700; white-space: nowrap; }
.table-bordered th, .table-bordered td { border: 1px solid var(--line); }
.table-striped tbody tr:nth-child(odd) td { background: color-mix(in srgb, var(--surface-2) 55%, transparent); }
.table-hover tbody tr:hover td { background: var(--surface-2); }
.table-condensed th, .table-condensed td { padding: 5px 8px; }
.table-responsive { overflow-x: auto; }
.dataframe { font-size: .85rem; }
table tr.success td { background: #e2f5ea; }
table tr.info td { background: #e3f1fb; }
table tr.warning td { background: #fff3d6; }
table tr.danger td { background: #fde4e0; }

/* List group / pager */
.list-group { display: grid; gap: 10px; padding: 0; margin: 1em 0; list-style: none; }
.list-group-item { display: block; padding: 14px 18px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); color: var(--ink); text-decoration: none; }
a.list-group-item:hover { border-color: var(--court); }
.pager { display: flex; justify-content: space-between; list-style: none; padding: 0; margin: 2em 0; }
.pager a { display: inline-block; padding: 10px 18px; border: 1px solid var(--line); border-radius: 999px; text-decoration: none; }

/* Carousel (behaviour in site.js) */
.carousel { position: relative; margin: 1.5em 0; border-radius: 14px; overflow: hidden; background: #000; }
.carousel-inner > .item { display: none; position: relative; }
.carousel-inner > .item.active { display: block; animation: fadeUp .4s ease; }
.carousel-inner > .item > img { width: 100%; max-height: 70vh; object-fit: contain; margin: 0 auto; border-radius: 0; }
.carousel-caption { position: absolute; left: 0; right: 0; bottom: 0; padding: 10px 16px 34px; color: #fff; background: linear-gradient(transparent, rgba(0, 0, 0, .6)); text-align: center; }
.carousel-caption:empty { display: none; }
.carousel-control { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: rgba(0, 0, 0, .45); color: #fff !important; text-decoration: none; font-size: 1.8rem; line-height: 1; }
.carousel-control.left { left: 10px; }
.carousel-control.right { right: 10px; }
.carousel-control .sr-only { position: absolute; }
.carousel-indicators { position: absolute; bottom: 10px; left: 0; right: 0; display: flex; justify-content: center; gap: 6px; list-style: none; padding: 0; margin: 0; }
.carousel-indicators li { width: 10px; height: 10px; border-radius: 50%; background: rgba(255, 255, 255, .5); cursor: pointer; margin: 0; }
.carousel-indicators li.active { background: var(--ball); }

/* Old blueimp/Bootstrap modal markup is replaced by the built-in lightbox */
.blueimp-gallery, .modal { display: none !important; }
