/* ===== Mini Bootstrap Compat (for user-system) – 1 selector/line ===== */
.title-list-group {
    flex-direction: row !important;
    justify-content: space-between !important;
}
.d-inline-flex {
    display: inline-flex!important;
}

/* Base */
.bg-body { background:var(--us-body-bg); }
.text-body { color:var(--us-body-fg); }
.text-muted { color:rgba(127,127,127,.9); }
.text-white { color:#fff; }
.text-light { color:#f8fafc; }
.text-warning { color:#f59e0b; }
.text-success { color:#22c55e; }
.text-danger { color:#ef4444; }
a { color:var(--ps-link); text-decoration:none; }
a:hover { text-decoration:underline; }
.small { font-size:.875rem; }
.h1 { font-size:2rem; }
.h2 { font-size:1.75rem; }
.h3 { font-size:1.5rem; }
.h4 { font-size:1.25rem; }
.h5 { font-size:1.1rem; }
.h6 { font-size:1rem; }

/* Container */
.container { width:100%; max-width:1200px; margin-left:auto; margin-right:auto; padding-left:1rem; padding-right:1rem; }

/* Grid + flex (subset dùng thực tế) */
.row { display:flex; flex-wrap:wrap; gap:var(--us-gap); }
.col { flex:1 0 0%; min-width:0; }
.col-12 { flex:0 0 100%; max-width:100%; }
.col-md-1 { flex:0 0 8.3333%; max-width:8.3333%; }
.col-md-2 { flex:0 0 16.6667%; max-width:16.6667%; }
.col-md-3 { flex:0 0 25%; max-width:25%; }
.col-md-4 { flex:0 0 33.3333%; max-width:33.3333%; }
.col-md-6 { flex:0 0 50%; max-width:50%; }
.col-md-8 { flex:0 0 66.6667%; max-width:66.6667%; }
.col-md-9 { flex:0 0 75%; max-width:75%; }
.col-md-10 { flex:0 0 83.3333%; max-width:83.3333%; }
@media (max-width:767.98px){ .col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-6,.col-md-8,.col-md-9,.col-md-10 { flex:0 0 100%; max-width:100%; } }

/* Display + flex helpers */
.d-flex { display:flex!important; }
.d-block { display:block!important; }
.d-none { display:none!important; }
.flex-column { flex-direction:column!important; }
.flex-wrap { flex-wrap:wrap!important; }
.align-items-center { align-items:center!important; }
.align-items-start { align-items:flex-start!important; }
.align-items-end { align-items:flex-end!important; }
.justify-content-between { justify-content:space-between!important; }
.justify-content-center { justify-content:center!important; }
.justify-content-end { justify-content:flex-end!important; }
.text-center { text-align:center!important; }
.text-start { text-align:start!important; }
.text-end { text-align:end!important; }
.gap-2 { gap:.5rem!important; }
.gap-3 { gap:1rem!important; }
.w-100 { width:100%!important; }

/* Responsive display (md≥768) */
@media (min-width:768px){ .d-md-flex { display:flex!important; } .row {flex-wrap: nowrap;}}
@media (min-width:768px){ .d-md-block { display:block!important; } }
@media (min-width:768px){ .d-md-none { display:none!important; } }
@media (min-width:768px){ .flex-md-row {display: flex !important;flex-direction:row!important;justify-content: space-between !important; } }
@media (min-width:768px){ .align-items-md-center { align-items:center!important; } }
@media (min-width:768px){ .justify-content-md-between { justify-content:space-between!important; } }

/* Spacing (0..5 ~ .25rem step) */
.m-0 { margin:0!important; }
.mt-0 { margin-top:0!important; }
.mb-0 { margin-bottom:0!important; }
.ms-0 { margin-inline-start:0!important; }
.me-0 { margin-inline-end:0!important; }
.m-1 { margin:.25rem!important; }
.mt-1 { margin-top:.25rem!important; }
.mb-1 { margin-bottom:.25rem!important; }
.ms-1 { margin-inline-start:.25rem!important; }
.me-1 { margin-inline-end:.25rem!important; }
.m-2 { margin:.5rem!important; }
.mt-2 { margin-top:.5rem!important; }
.mb-2 { margin-bottom:.5rem!important; }
.ms-2 { margin-inline-start:.5rem!important; }
.me-2 { margin-inline-end:.5rem!important; }
.m-3 { margin:1rem!important; }
.mt-3 { margin-top:1rem!important; }
.mb-3 { margin-bottom:1rem!important; }
.ms-3 { margin-inline-start:1rem!important; }
.me-3 { margin-inline-end:1rem!important; }
.m-4 { margin:1.5rem!important; }
.mt-4 { margin-top:1.5rem!important; }
.mb-4 { margin-bottom:1.5rem!important; }
.ms-4 { margin-inline-start:1.5rem!important; }
.me-4 { margin-inline-end:1.5rem!important; }
.m-5 { margin:3rem!important; }
.mt-5 { margin-top:3rem!important; }
.mb-5 { margin-bottom:3rem!important; }
.p-0 { padding:0!important; }
.p-1 { padding:.25rem!important; }
.p-2 { padding:.5rem!important; }
.p-3 { padding:1rem!important; }
.p-4 { padding:1.5rem!important; }
.p-5 { padding:3rem!important; }
.pt-2 { padding-top:.5rem!important; }
.pb-2 { padding-bottom:.5rem!important; }
.pt-3 { padding-top:1rem!important; }
.pb-3 { padding-bottom:1rem!important; }
.px-4 { padding-left:1.5rem!important; padding-right:1.5rem!important; }
.px-5 { padding-left:3rem!important; padding-right:3rem!important; }

/* Radius + borders + shadows */
.rounded { border-radius:var(--us-r); }
.rounded-3 { border-radius:var(--us-r-lg); }
.rounded-circle { border-radius:9999px; }
.border { border:1px solid var(--us-line); }
.border-0 { border:0; }
.border-secondary { border-color:rgba(148,163,184,.6)!important; }
.shadow { box-shadow:var(--us-shadow); }
.shadow-sm { box-shadow:0 1px 4px rgba(0,0,0,.06); }

/* Buttons */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; border:1px solid transparent; padding:.5rem 1rem; font-weight:600; border-radius:.5rem; cursor:pointer; transition:background-color .2s, border-color .2s, color .2s; }
.btn:disabled { opacity:.6; cursor:not-allowed; }
.btn-sm { padding:.25rem .5rem; font-size:.875rem; border-radius:.375rem; }
.btn-primary { background:var(--accent); color:#fff; border-color:color-mix(in srgb,var(--accent) 75%,#000 25%); }
.btn-primary:hover { background:color-mix(in srgb,var(--accent) 85%,#000 15%); }
.btn-success { background:#2fb344; color:#fff; border-color:#288c39; }
.btn-success:hover { background:#24963a; }
.btn-danger { background:#e03131; color:#fff; border-color:#c92a2a; }
.btn-danger:hover { background:#c12727; }
.btn-warning { background:#f59e0b; color:#111; border-color:#d97706; }
.btn-warning.text-white { color:#fff; }
.btn-warning:hover { background:#ea8a05; }
.btn-light { background:#f8fafc; color:#111; border-color:#e5e7eb; }
.modal-gg-bg{background: var(--gg-bg)!important;}
.btn-light:hover { background:#eef2f7; }
.btn-dark { background:#111827; color:#fff; border-color:#0b1220; }
.btn-outline-secondary { background:transparent; color:var(--us-body-fg); border-color:var(--us-line); }
.btn-outline-secondary:hover { background:rgba(127,127,127,.12); }

/* Forms */
.form-label { display:block; margin-bottom:.25rem; font-weight:600; }
.form-control { width:100%; min-height:2.25rem; padding:.45rem .65rem; border:1px solid var(--us-line); background:var(--us-body-bg); color:var(--us-body-fg); border-radius:.5rem; outline:none; transition:border-color .2s, box-shadow .2s; }
.form-control:focus { border-color:color-mix(in srgb,var(--accent) 60%, transparent); box-shadow:0 0 0 .2rem color-mix(in srgb,var(--accent) 25%, transparent); }
.form-select { width:100%; min-height:2.25rem; padding:.45rem 2rem .45rem .65rem; border:1px solid var(--us-line); background:var(--us-body-bg); color:var(--us-body-fg); border-radius:.5rem; }
.form-check { display:flex; align-items:center; gap:.5rem; }
.form-check-input { width:1rem; height:1rem; border:1px solid var(--us-line); border-radius:.25rem; background:var(--us-body-bg); }
.form-check-input:checked { background:var(--accent); border-color:var(--accent); }
.form-hint { font-size:.875rem; color:rgba(127,127,127,.9); }
.input-group { display:flex; width:100%; }
.input-group > .form-control { border-top-right-radius:0; border-bottom-right-radius:0; }
.input-group > .btn, .input-group > .input-group-text { border-top-left-radius:0; border-bottom-left-radius:0; }
.input-group-text { display:inline-flex; align-items:center; padding:.45rem .65rem; border:1px solid var(--us-line); background:var(--us-body-bg); color:var(--us-body-fg); }

/* Badges */
.badge { display:inline-block; padding:.25rem .6rem; font-weight:700; font-size:.75rem; border-radius:999px; border:1px solid var(--us-line); background:rgba(127,127,127,.08); color:var(--us-body-fg); }
.bg-success { background:#22c55e!important; color:#fff!important; }
.bg-secondary { background:#6b7280!important; color:#fff!important; }
.bg-dark { background:#111827!important; color:#fff!important; }

/* Alerts */
.alert { padding:.75rem 1rem; border:1px solid var(--us-line); border-radius:.5rem; margin:1rem 0; }
.alert-success { background:color-mix(in srgb,#2fb344 10%, var(--us-body-bg) 90%); color:color-mix(in srgb,#2fb344 75%, #000 25%); border-color:color-mix(in srgb,#2fb344 35%, transparent); }
.alert-info { background:color-mix(in srgb,#0ea5e9 10%, var(--us-body-bg) 90%); color:color-mix(in srgb,#0ea5e9 75%, #000 25%); border-color:color-mix(in srgb,#0ea5e9 35%, transparent); }
.alert-warning { background:color-mix(in srgb,#f59e0b 10%, var(--us-body-bg) 90%); color:color-mix(in srgb,#f59e0b 70%, #000 30%); border-color:color-mix(in srgb,#f59e0b 35%, transparent); }
.alert-danger { background:color-mix(in srgb,#ef4444 10%, var(--us-body-bg) 90%); color:color-mix(in srgb,#ef4444 80%, #000 20%); border-color:color-mix(in srgb,#ef4444 35%, transparent); }

/* Cards */
.card { background:var(--us-body-bg); color:var(--us-body-fg); border:1px solid var(--us-line); border-radius:.75rem; box-shadow:0 1px 4px rgba(0,0,0,.06); }
.card-body { padding:1rem; }

/* List group */
.list-group { display:block; border:1px solid var(--us-line); border-radius:.5rem; overflow:hidden; }
.list-group-item { display:block; padding:.75rem 1rem; border-bottom:1px solid var(--us-line); background:var(--us-body-bg); color:var(--us-body-fg); }
.list-group-item:last-child { border-bottom:0; }

/* Tables */
.table-responsive { width:100%; overflow-x:auto; }
.table { width:100%; border-collapse:collapse; }
.table th { text-align:left; }
.table td, .table th { padding:.5rem .6rem; border:1px solid var(--us-line); }
.table-sm td, .table-sm th { padding:.35rem .5rem; }
.table-bordered { border:1px solid var(--us-line); }
.table-striped tbody tr:nth-child(odd) { background:rgba(127,127,127,.06); }
.table-hover tbody tr:hover { background:rgba(127,127,127,.1); }
.table-light th, .table-light td { background:color-mix(in srgb, var(--us-body-bg) 70%, #fff 30%); }

/* Nav tabs (đã có style riêng trong user-style.css, nhưng thêm base) */
.nav { display:flex; flex-wrap:wrap; gap:0; }
.nav-tabs { display:flex; border-bottom:1px solid var(--us-line); padding-top:30px}
.nav-tabs .nav-link { display:block; padding:.6rem 1rem; color:rgba(127,127,127,.9); border:1px solid transparent; border-top-left-radius:.5rem; border-top-right-radius:.5rem; }
.nav-tabs .nav-link:hover { background:rgba(127,127,127,.08); color:var(--us-body-fg); }
.nav-tabs .nav-link.active { color:#fff; background:var(--accent); border-color:var(--accent); }

/* Modal (dùng với user-mini-bootstrap.js) */
.modal { position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,.5); z-index:1055; }
.modal.show { display:flex; }
.modal-dialog { width:100%; max-width:520px; margin:1rem; }
.modal-dialog.modal-lg { max-width:720px; }
.modal-content { background:var(--us-body-bg); color:var(--us-body-fg); border:1px solid var(--us-line); border-radius:.75rem; box-shadow:var(--us-shadow); overflow:hidden; }
.modal-header { display:flex; align-items:center; justify-content:space-between; padding:.75rem 1rem; border-bottom:1px solid var(--us-line); }
.modal-body { padding:1rem; }
.btn-close { width:1.25rem; height:1.25rem; border:0; background:transparent; position:relative; opacity:.7; }
.btn-close::before { content:""; position:absolute; inset:.2rem; background:currentColor; -webkit-mask:linear-gradient(#000 0 0), linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; }
.us-modal-open { overflow:hidden; }

/* Utilities khác */
.position-fixed { position:fixed!important; }
.top-0 { top:0!important; }
.end-0 { right:0!important; }
.fw-bold { font-weight:700!important; }
.fw-semibold { font-weight:600!important; }
.fst-italic { font-style:italic!important; }
.bg-light { background:#f8fafc!important; color:#111!important; }