/**
 * Compatibility layer for markup the module builds in PHP with Bootstrap 4
 * and AdminLTE class names (btn, table-*, row/col, card, small-box, alert,
 * bg-*). These map those names onto the theme's components so module code
 * does not need to change, and replace the 70 MB AdminLTE bundle.
 */

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-height: 2.5rem;
  padding: 0.5rem 1rem;
  font: 650 var(--kc-fs-sm)/1.2 var(--kc-font-sans);
  text-decoration: none !important;
  color: var(--kc-green-900);
  background: var(--kc-surface);
  border: 1px solid var(--kc-line-strong);
  border-radius: var(--kc-radius);
  cursor: pointer;
  white-space: nowrap;
}
.btn:hover { background: var(--kc-green-50); border-color: var(--kc-green-400); color: var(--kc-green-900); }
.btn:focus-visible { outline: 3px solid var(--kc-focus); outline-offset: 2px; }
.btn-primary { color: #fff; background: var(--kc-green-700); border-color: var(--kc-green-700); }
.btn-primary:hover { color: #fff; background: var(--kc-green-800); border-color: var(--kc-green-800); }
.btn-success { color: #fff; background: var(--kc-success); border-color: var(--kc-success); }
.btn-success:hover { color: #fff; background: #0b5f36; border-color: #0b5f36; }
.btn-info { color: #fff; background: #1f5fae; border-color: #1f5fae; }
.btn-info:hover { color: #fff; background: #184b8a; border-color: #184b8a; }
.btn-warning { color: var(--kc-green-950); background: var(--kc-gold-400); border-color: var(--kc-gold-400); }
.btn-warning:hover { color: var(--kc-green-950); background: var(--kc-gold-300); border-color: var(--kc-gold-300); }
.btn-danger { color: #fff; background: var(--kc-error); border-color: var(--kc-error); }
.btn-danger:hover { color: #fff; background: #912018; border-color: #912018; }
.btn-sm { min-height: 2rem; padding: 0.3rem 0.7rem; font-size: var(--kc-fs-xs); border-radius: var(--kc-radius-sm); }
.btn-xs { min-height: 1.75rem; padding: 0.2rem 0.55rem; font-size: var(--kc-fs-2xs); border-radius: 0.4rem; }
.btn-block { display: flex; width: 100%; }
.pull-right, .float-right { float: right; }
.pull-left, .float-left { float: left; }
.glyphicon { display: none; }

/* Tables */
.table { width: 100%; margin-bottom: var(--kc-s6); }
.table-sm td, .table-sm th { padding: 0.5rem 0.75rem; }
.table-bordered td, .table-bordered th { border-right: 1px solid var(--kc-line); }
.table-bordered td:last-child, .table-bordered th:last-child { border-right: 0; }
.table-striped tbody tr:nth-child(even) > td { background: var(--kc-surface-2); }
.table-striped tbody tr:hover > td { background: var(--kc-green-50); }

/* Grid */
.container, .container-fluid { width: 100%; max-width: 100%; padding: 0; }
.row { display: flex; flex-wrap: wrap; gap: var(--kc-s4); margin: 0 0 var(--kc-s6); }
.row > [class*="col"] { flex: 1 1 100%; min-width: 0; }
.row > [class*="col-"] { flex-grow: 0; }
@media (min-width: 36rem) {
  .row > .col-6, .row > .col-sm-6 { flex-basis: calc(50% - var(--kc-s4)); }
}
@media (min-width: 48rem) {
  .row > .col-md-4 { flex-basis: calc(33.333% - var(--kc-s4)); }
  .row > .col-md-6 { flex-basis: calc(50% - var(--kc-s4)); }
  .row > .col, .row > .col-md { flex-basis: 0; }
}
@media (min-width: 64rem) {
  .row > .col-lg-3 { flex-basis: calc(25% - var(--kc-s4)); }
  .row > .col-lg-4 { flex-basis: calc(33.333% - var(--kc-s4)); }
  .row > .col-lg-6 { flex-basis: calc(50% - var(--kc-s4)); }
}
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-white { color: #fff; }
.text-dark { color: var(--kc-ink); }
.m-0 { margin: 0; }
.mb-0 { margin-bottom: 0; }
h2.m-0 { margin-bottom: var(--kc-s5) !important; }

/* Cards */
.card { display: flex; flex-direction: column; min-width: 0; background: var(--kc-surface); border: 1px solid var(--kc-line); border-radius: var(--kc-radius-lg); box-shadow: var(--kc-shadow-sm); overflow: hidden; }
.card-header { padding: var(--kc-s4) var(--kc-s5); border-bottom: 1px solid var(--kc-line); background: var(--kc-green-50); font-weight: 700; color: var(--kc-green-900); }
.card-header.bg-success, .card-header.bg-danger, .card-header.bg-info, .card-header.bg-warning { border-bottom: 0; }
.card-title { margin: 0; font-size: var(--kc-fs-md); }
.card-body { padding: var(--kc-s5); }
.card-footer { padding: var(--kc-s4) var(--kc-s5); border-top: 1px solid var(--kc-line); background: var(--kc-surface-2); }

/* Backgrounds */
.bg-success { background: var(--kc-green-700) !important; color: #fff; }
.bg-info { background: #1f5fae !important; color: #fff; }
.bg-warning { background: var(--kc-gold-400) !important; color: var(--kc-green-950); }
.bg-danger { background: #a3271c !important; color: #fff; }
.bg-primary { background: var(--kc-green-800) !important; color: #fff; }

/* Alerts */
.alert { padding: var(--kc-s4); border: 1px solid var(--kc-line); border-left-width: 4px; border-radius: var(--kc-radius); margin-bottom: var(--kc-s4); }
.alert-danger { background: var(--kc-error-bg); border-color: #fbcfca; border-left-color: var(--kc-error); color: #8a1c13; }
.alert-success { background: var(--kc-success-bg); border-color: #bfe6cf; border-left-color: var(--kc-success); color: #0b4f2f; }
.alert-warning { background: var(--kc-warning-bg); border-color: #f5dc9f; border-left-color: var(--kc-gold-500); color: #6b3a05; }
.alert-info { background: var(--kc-info-bg); border-color: #c9d9fb; border-left-color: var(--kc-info); color: #163c8c; }

/* AdminLTE "small-box" statistics tiles (Admin Dashboard). */
.small-box {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 9.5rem;
  overflow: hidden;
  border: 0;
  border-radius: var(--kc-radius-xl);
  box-shadow: var(--kc-shadow);
  isolation: isolate;
}
.small-box::after {
  content: "";
  position: absolute;
  right: -2.5rem;
  top: -2.5rem;
  z-index: -1;
  width: 9rem;
  height: 9rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
}
.small-box.bg-success { background: linear-gradient(135deg, var(--kc-green-700), var(--kc-green-900)) !important; }
.small-box.bg-info { background: linear-gradient(135deg, #1f5fae, #143f76) !important; }
.small-box.bg-warning { background: linear-gradient(135deg, var(--kc-gold-300), var(--kc-gold-500)) !important; }
.small-box.bg-danger { background: linear-gradient(135deg, #b23a2c, #7d1d14) !important; }
.small-box > .inner { flex: 1; padding: var(--kc-s5) var(--kc-s5) var(--kc-s3); }
.small-box > .inner h3 { margin: 0 0 0.25rem; font-family: var(--kc-font-display); font-size: 2.25rem; font-weight: 800; line-height: 1.1; color: inherit; font-variant-numeric: tabular-nums; }
.small-box > .inner p { margin: 0; font-size: var(--kc-fs-sm); font-weight: 650; text-transform: uppercase; letter-spacing: 0.05em; opacity: 0.92; }
.small-box > .icon { position: absolute; right: var(--kc-s5); top: var(--kc-s5); width: 2.75rem; height: 2.75rem; border-radius: 0.9rem; background: rgba(255, 255, 255, 0.16); }
.small-box > .icon::before { content: ""; position: absolute; inset: 0.6rem; background: currentColor; -webkit-mask: var(--kc-sb-icon) center / contain no-repeat; mask: var(--kc-sb-icon) center / contain no-repeat; }
.small-box > .icon { --kc-sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' %3E %3Cpath d='M3 3v18h18' /%3E %3Cpath d='M18 17V9' /%3E %3Cpath d='M13 17V5' /%3E %3Cpath d='M8 17v-3' /%3E %3C/svg%3E "); }
.small-box > .icon:has(.ion-bag) { --kc-sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' %3E %3Cpath d='m2 7 4.41-4.41A2 2 0 0 1 7.83 2h8.34a2 2 0 0 1 1.42.59L22 7' /%3E %3Cpath d='M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8' /%3E %3Cpath d='M15 22v-4a2 2 0 0 0-2-2h-2a2 2 0 0 0-2 2v4' /%3E %3Cpath d='M2 7h20' /%3E %3Cpath d='M22 7v3a2 2 0 0 1-2 2v0a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 16 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 12 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 8 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 4 12v0a2 2 0 0 1-2-2V7' /%3E %3C/svg%3E "); }
.small-box > .icon:has(.ion-stats-bars) { --kc-sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' %3E %3Cpath d='M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z' /%3E %3Cpath d='m9 12 2 2 4-4' /%3E %3C/svg%3E "); }
.small-box > .icon:has(.ion-person-add) { --kc-sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' %3E %3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2' /%3E %3Ccircle cx='9' cy='7' r='4' /%3E %3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87' /%3E %3Cpath d='M16 3.13a4 4 0 0 1 0 7.75' /%3E %3C/svg%3E "); }
.small-box > .icon:has(.ion-pie-graph) { --kc-sb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' %3E %3Cline x1='3' x2='15' y1='22' y2='22' /%3E %3Cline x1='4' x2='14' y1='9' y2='9' /%3E %3Cpath d='M14 22V4a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v18' /%3E %3Cpath d='M14 13h2a2 2 0 0 1 2 2v2a2 2 0 0 0 2 2h0a2 2 0 0 0 2-2V9.83a2 2 0 0 0-.59-1.42L18 5' /%3E %3C/svg%3E "); }
.small-box > .icon > i { display: none; }
.small-box-footer {
  display: block;
  padding: 0.55rem var(--kc-s5);
  font-size: var(--kc-fs-xs);
  font-weight: 650;
  color: inherit !important;
  text-decoration: none !important;
  background: rgba(0, 0, 0, 0.14);
}
.small-box-footer > i { display: none; }
.small-box-footer::after { content: " \2192"; }
.small-box-footer:hover { background: rgba(0, 0, 0, 0.24); }
.row > .col-lg-3 > .small-box { height: 100%; margin: 0; }
.ion, .fas, .far, .fa { font-style: normal; }

/* Pure.css columns used by one module page */
[class*="pure-u-"] { display: inline-block; vertical-align: top; width: 100%; }
@media (min-width: 48rem) { .pure-u-md-1-3 { width: 33.333%; } }
