/* Component compat shim — the last of the Bootstrap components main.css (Tailwind vocabulary)
   never defined but ported templates still use: nav-tabs, progress, pagination, input-group.
   Additive, scoped to these class names only; pairs with grid/util/form-compat. */

/* ---- nav-tabs (domains, affiliates, dedicated list) ---- */
.nav-tabs{display:flex;flex-wrap:wrap;gap:2px;border-bottom:1px solid var(--gray-200,#E5E7EB);margin:0 0 16px;padding:0;list-style:none}
.nav-tabs .nav-item{list-style:none}
.nav-tabs .nav-link{display:inline-block;padding:9px 14px;border:none;border-bottom:2px solid transparent;background:none;color:var(--gray-500,#6B7280);font-size:14px;font-weight:500;text-decoration:none;cursor:pointer}
.nav-tabs .nav-link:hover{color:var(--gray-800,#1F2937)}
.nav-tabs .nav-link.active{color:#4F2CFA;border-bottom-color:#4F2CFA}

/* ---- progress (ticket uploads, meters) ---- */
.progress{display:flex;height:8px;overflow:hidden;background:var(--gray-100,#F1F3F5);border-radius:999px}
.progress-bar{display:flex;flex-direction:column;justify-content:center;background:#4F2CFA;color:#fff;height:100%;transition:width .3s ease}

/* ---- pagination (shared components/pagination.tpl → many list pages) ---- */
.pagination{display:flex;flex-wrap:wrap;gap:4px;list-style:none;padding:0;margin:16px 0}
.pagination .page-item{list-style:none}
.pagination .page-link{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 10px;border:1px solid var(--gray-200,#E5E7EB);border-radius:8px;color:var(--gray-700,#374151);font-size:14px;text-decoration:none;cursor:pointer;box-sizing:border-box}
.pagination .page-link:hover{background:var(--gray-50,#F9FAFB)}
.pagination .page-item.active .page-link{background:#4F2CFA;border-color:#4F2CFA;color:#fff}
.pagination .page-item.disabled .page-link{opacity:.45;pointer-events:none}

/* ---- input-group (search box, CVV, credit) ---- */
.input-group{position:relative;display:flex;align-items:stretch;width:100%}
.input-group>.form-control{position:relative;flex:1 1 auto;width:1%;min-width:0}
.input-group>.form-control:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}
.input-group>.form-control:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0;border-left:0}
.input-group-prepend,.input-group-append{display:flex}
.input-group-text{display:flex;align-items:center;padding:0 12px;background:var(--gray-50,#F9FAFB);border:1px solid var(--gray-300,#D1D5DB);color:var(--gray-600,#4B5563);font-size:14px;white-space:nowrap}
.input-group-prepend .input-group-text{border-top-left-radius:var(--radius,10px);border-bottom-left-radius:var(--radius,10px);border-right:0}
.input-group-append .input-group-text,.input-group-append .btn{border-top-right-radius:var(--radius,10px);border-bottom-right-radius:var(--radius,10px)}
/* Bootstrap modal (dropped in port) — positioned + skinned to the kit */
.modal{position:fixed;top:0;left:0;z-index:10040;display:none;width:100%;height:100%;overflow-x:hidden;overflow-y:auto;outline:0}
.modal.fade .modal-dialog{transform:translateY(-24px);transition:transform .18s ease-out}
.modal.show .modal-dialog{transform:none}
.modal-dialog{position:relative;width:auto;max-width:520px;margin:8vh auto;pointer-events:none;padding:0 16px}
.modal-dialog-centered{display:flex;align-items:center;min-height:calc(100% - 16vh)}
.modal-content{position:relative;display:flex;flex-direction:column;width:100%;pointer-events:auto;background:#fff;border:1px solid var(--gray-200,#E5E7EB);border-radius:var(--radius-lg,12px);box-shadow:0 20px 50px rgba(17,24,39,.25);outline:0}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--gray-200,#E5E7EB)}
.modal-header .modal-title{margin:0;font-size:16px;font-weight:600;color:var(--gray-900,#111827)}
.modal-header .close{background:none;border:none;padding:4px;margin:-4px -4px -4px auto;cursor:pointer;color:var(--gray-400,#9CA3AF);line-height:0}
.modal-header .close:hover{color:var(--gray-600,#4B5563)}
.modal-body{position:relative;flex:1 1 auto;padding:20px}
.modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:16px 20px;border-top:1px solid var(--gray-200,#E5E7EB)}
.modal-backdrop{position:fixed;top:0;left:0;z-index:10030;width:100vw;height:100vh;background:rgba(17,24,39,.55)}
.modal-backdrop.fade{opacity:0;transition:opacity .15s}
.modal-backdrop.show{opacity:1}
.modal.fade:not(.show){opacity:0;transition:opacity .15s}
.modal.show{opacity:1}
body.modal-open{overflow:hidden}