/* ==========================================================================
 * SHEQ24 — global UI layer (Theme Kit rollout, Phase A).
 * Approved benchmark: index.php?module=default&action=sheqTheme
 * See audits/bootstrap/theme-rollout-plan.md.
 *
 * Loaded LAST in default_header_tpl.php (after style.bundle.css, select2.min.css,
 * style.css) so it wins by source order. Promotes the sandbox's proven, scoped
 * styles to app-wide.
 *
 * SCOPE (deliberately conservative for a global change):
 *   1. Select2 — the CONFIRMED app-wide breakage. Metronic sets Select2's default
 *      theme to "bootstrap5" but that theme CSS isn't loaded, and plain
 *      select2.min.css clobbers the sizing → every dropdown is half-styled. We
 *      target the THEME-AGNOSTIC `.select2-container` (NOT `--default`, which
 *      never matches the bootstrap5 containers) so it applies everywhere.
 *   2. Badges/pills + icon-only buttons — text/glyph was leaking; centre both axes.
 *
 * NOT here (deferred to per-module conversion so we don't change form semantics
 * app-wide in one shot): checkbox restyle, segmented controls, table/toolbar
 * structure. Those ship via the partials + the kit classes.
 *
 * Rollback: remove the single `sheq-ui.css` entry from $stylesheet in the header.
 * ========================================================================== */

/* ---- 1. Select2 (theme-agnostic) ---------------------------------------- */
.select2-container { font-family: inherit; }
.select2-container .select2-selection { border: 1px solid #dbdfe9; border-radius: .475rem; background: #fff; }
.select2-container--open .select2-selection,
.select2-container--focus .select2-selection { border-color: #3e97ff !important; }

/* SINGLE — fixed box + canonical line-height centring (41px = 43 − 2px border) */
.select2-container .select2-selection--single {
    height: 43px !important; border: 1px solid #dbdfe9 !important; border-radius: .475rem !important;
    padding: 0 12px !important; display: block !important;
}
.select2-container .select2-selection--single .select2-selection__rendered {
    line-height: 41px !important; color: #4b5675 !important; font-size: .95rem !important; font-weight: 400 !important; padding: 0 !important;
}
.select2-container .select2-selection--single .select2-selection__placeholder { color: #99a1b7; }
.select2-container .select2-selection--single .select2-selection__arrow { height: 41px !important; top: 0 !important; right: 8px !important; }

/* MULTIPLE — auto-grow, never clip the placeholder/chips */
.select2-container .select2-selection--multiple {
    min-height: 43px !important; height: auto !important; border: 1px solid #dbdfe9 !important; border-radius: .475rem !important;
    padding: 3px 8px !important; display: flex !important; flex-wrap: wrap !important; align-items: center !important;
}
.select2-container .select2-selection--multiple .select2-selection__rendered { display: flex !important; flex-wrap: wrap !important; padding: 0 !important; width: 100%; }
.select2-container .select2-selection--multiple .select2-search__field { margin: 4px 0 !important; color: #4b5675; }
.select2-container .select2-selection--multiple .select2-selection__choice {
    background: #eef3ff !important; border: 0 !important; color: #3e97ff !important; border-radius: .4rem !important;
    font-size: .85rem !important; padding: 3px 9px !important; margin: 3px 5px 3px 0 !important;
}
.select2-container .select2-selection--multiple .select2-selection__choice__remove { color: #3e97ff !important; border: 0 !important; background: transparent !important; }

/* Dropdown panel + results */
.select2-dropdown { border: 1px solid #dbdfe9 !important; border-radius: .475rem !important; box-shadow: 0 10px 30px rgba(56,71,109,.15) !important; }
.select2-results__option--highlighted[aria-selected] { background: #3e97ff !important; color: #fff !important; }

/* ---- 2. Badges/pills + icon buttons: centre both axes -------------------- */
.badge { display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
.btn-icon { display: inline-flex; align-items: center; justify-content: center; }
.btn-table-action { display: inline-flex; align-items: center; justify-content: center; }

/* badge-light-* colours, defined GLOBALLY (were only scoped to the Theme Kit,
   so on real pages the pills fell back to grey). Dark-on-light for readability. */
.badge.badge-light-success { background: #e7f8ef !important; color: #0a7d3e !important; }
.badge.badge-light-warning { background: #fff4d6 !important; color: #9a6b00 !important; }
.badge.badge-light-danger  { background: #fdecef !important; color: #c01e3c !important; }
.badge.badge-light-primary { background: #e9f1ff !important; color: #1a5fd0 !important; }
.badge.badge-light-info    { background: #e7f6fb !important; color: #0b6e8a !important; }
/* sizing only on the light pills, so notification/count badges are untouched */
.badge[class*="badge-light-"] { padding: .42rem .7rem; border-radius: .425rem; font-weight: 600; }

/* btn-xs is a Bootstrap-3 size that BS5 dropped, so legacy btn-xs buttons
   render FULL size (e.g. the shared date_format_class "Due in N d" pills).
   Restore a real extra-small size app-wide. */
.btn.btn-xs { padding: .2rem .55rem; font-size: .72rem; line-height: 1.35; border-radius: .375rem; }

/* ---- 3. Register card + toolbar (scoped to .sheq-register from the partial,
 *         so the 955 existing data-sheq-grid pages are NOT affected) ---------- */
.sheq-register { border: 0; border-radius: .85rem; box-shadow: 0 0 30px rgba(56,71,109,.05); }
.sheq-register .card-header { min-height: 70px; align-items: center; border-bottom: 1px solid #f1f1f4; }
.sheq-register .card-title h2 { color: #181c32; }
.sheq-register .card-toolbar { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.sheq-register .sheq-toolbar-search { position: relative; }
.sheq-register .sheq-toolbar-search i { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: #99a1b7; }
.sheq-register .sheq-toolbar-search input { padding-left: 34px; width: 220px; }
.sheq-register .dataTables_filter { display: none; }  /* the toolbar search replaces it */
.sheq-register table.dataTable thead th { font-weight: 600; color: #4b5675; text-transform: uppercase; font-size: .75rem; letter-spacing: .05em; }
.sheq-register table.dataTable tbody td { color: #4b5675; vertical-align: middle; }