/* ================================================================
   BPSFW — Premium Admin UI  ·  Single SCSS File
   Design: Luxury refined with glass morphism, DM Sans typography
   ================================================================ */

/* ─── DESIGN TOKENS ───────────────────────────────────────── */
:root {
  --ink:        #0d0f1a;
  --ink-2:      #161929;
  --ink-3:      #1e2235;

  --violet:     #6c63ff;
  --violet-h:   #5a52e0;
  --violet-lt:  rgba(108,99,255,.1);
  --violet-glow:0 0 28px rgba(108,99,255,.38);

  --cyan:       #22d3ee;
  --emerald:    #10b981;
  --emerald-lt: rgba(16,185,129,.1);
  --amber:      #f59e0b;
  --amber-lt:   rgba(245,158,11,.1);
  --rose:       #f43f5e;
  --rose-h:     #e11d48;
  --rose-lt:    rgba(244,63,94,.1);

  --surf-0:     #ffffff;
  --surf-1:     #f7f8fc;
  --surf-2:     #eef0f8;
  --surf-3:     #e3e6f0;

  --text-1:     #0d0f1a;
  --text-2:     #3d4166;
  --text-3:     #6b7294;
  --text-4:     #9da3be;

  --bdr:        #dde0ef;
  --bdr-strong: #c8ccdf;
  --bdr-focus:  var(--violet);

  --font:       -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono:  "Fira Code", ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;

  --fs-2xs:10px; --fs-xs:11px;   --fs-sm:12px;
  --fs-base:13px;--fs-md:14px;   --fs-lg:15px;
  --fs-xl:18px;  --fs-2xl:22px;  --fs-3xl:28px;

  --fw-light:300;--fw-n:400;--fw-m:500;--fw-b:600;--fw-xb:700;

  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;
  --sp-5:20px;--sp-6:24px;--sp-8:32px;--sp-10:40px;--sp-12:48px;

  --r-sm:4px;--r:8px;--r-md:10px;--r-lg:14px;--r-xl:18px;--r-full:9999px;

  --sh-xs: 0 1px 2px rgba(13,15,26,.04);
  --sh-sm: 0 2px 8px rgba(13,15,26,.06),0 1px 2px rgba(13,15,26,.04);
  --sh:    0 4px 16px rgba(13,15,26,.08),0 2px 4px rgba(13,15,26,.04);
  --sh-md: 0 8px 24px rgba(13,15,26,.10),0 2px 8px rgba(13,15,26,.06);
  --sh-lg: 0 16px 40px rgba(13,15,26,.14);
  --sh-xl: 0 24px 60px rgba(13,15,26,.18);
  --sh-violet: 0 4px 20px rgba(108,99,255,.3);
  --sh-rose:   0 4px 20px rgba(244,63,94,.3);

  --ease:        cubic-bezier(.4,0,.2,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);
  --t:     .16s;
  --t-slow:.28s;

  --btn-h:36px;--btn-h-sm:30px;--btn-h-lg:44px;
  --input-h:38px;
  --avatar:36px;
  --z-overlay:99999;
}

/* ─── BASE ────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;}

.plugin-settings {
  max-width:1080px;
  font-family:var(--font);
  padding-bottom:var(--sp-12);
  color:var(--text-1);
  -webkit-font-smoothing:antialiased;
  margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
}

/* ─── PAGE HEADER ─────────────────────────────────────────── */
.bpsfw-page-header {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:28px 36px;
  margin-bottom:var(--sp-6);
  margin-right:var(--sp-5);
  border-radius:var(--r-xl);
  overflow:hidden;
  background:
    radial-gradient(ellipse 60% 80% at 5% 50%, rgba(108,99,255,.2) 0%,transparent 60%),
    radial-gradient(ellipse 40% 60% at 95% 20%, rgba(34,211,238,.12) 0%,transparent 55%),
    linear-gradient(145deg,#0d0f1a 0%,#161929 40%,#1a1d35 70%,#1e1b3a 100%);
  box-shadow:var(--sh-xl),inset 0 1px 0 rgba(255,255,255,.06);

  &::before {
    content:'';position:absolute;inset:0;
    background-image:
      linear-gradient(rgba(108,99,255,.05) 1px,transparent 1px),
      linear-gradient(90deg,rgba(108,99,255,.05) 1px,transparent 1px);
    background-size:32px 32px;
    pointer-events:none;
  }
  &::after {
    content:'';position:absolute;
    top:-60px;right:-40px;
    width:220px;height:220px;border-radius:50%;
    background:radial-gradient(circle,rgba(108,99,255,.22) 0%,transparent 65%);
    pointer-events:none;
  }
}

.bpsfw-page-header__left {
  display:flex;align-items:center;gap:var(--sp-4);position:relative;z-index:1;
}

.bpsfw-page-header__meta { display:flex;flex-direction:column;gap:5px; }

.bpsfw-page-header__title {
  margin:0;font-size:var(--fs-2xl);font-weight:var(--fw-xb);
  letter-spacing:-.03em;line-height:1.2;
  background:linear-gradient(135deg,#fff 20%,rgba(180,174,255,.9) 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
}

.bpsfw-page-header__sub {
  margin:0;font-size:var(--fs-sm);
  color:rgba(255,255,255,.38);font-weight:var(--fw-n);letter-spacing:.01em;
}

.bpsfw-page-header__actions {
  display:flex;gap:var(--sp-2);align-items:center;position:relative;z-index:1;
}

.bpsfw-header-btn {
  display:inline-flex;align-items:center;gap:6px;
  padding:0 var(--sp-4);height:34px;
  font-family:var(--font);font-size:var(--fs-sm);font-weight:var(--fw-b);
  border-radius:var(--r-full);border:none;cursor:pointer;
  text-decoration:none;transition:all var(--t) var(--ease);
  white-space:nowrap;letter-spacing:.02em;

  &--outline {
    background:rgba(255,255,255,.08);color:rgba(255,255,255,.72);
    border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(8px);
    &:hover { background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.25);transform:translateY(-1px); }
    &:focus {color:#fff}
  }
  &--star {
    background:linear-gradient(135deg,var(--amber),#d97706);color:#fff;
    box-shadow:0 2px 12px rgba(245,158,11,.4);
    &:hover { transform:translateY(-1px);box-shadow:0 4px 18px rgba(245,158,11,.5); }
  }
  &--pro {
    background:linear-gradient(135deg,var(--violet),#9f7aea);color:#fff;
    box-shadow:var(--sh-violet);
    &:hover { transform:translateY(-1px);box-shadow:0 6px 22px rgba(108,99,255,.5); }
  }
}

/* ─── TAB NAV — pill switcher ─────────────────────────────── */
.bpsfw-tab-panel {
  margin-right:var(--sp-5);

  &__nav {
    display:flex;align-items:stretch;gap:2px;
    background:var(--surf-1);
    border:1px solid var(--bdr);
    border-radius:var(--r-lg);
    padding:4px;
    margin-bottom:var(--sp-6);
    overflow-x:auto;white-space:nowrap;
    scrollbar-width:none;
    box-shadow:var(--sh-xs);
    &::-webkit-scrollbar { display:none; }
  }

  &__btn {
    display:inline-flex;align-items:center;gap:6px;
    padding:var(--sp-2) var(--sp-4);
    font-family:var(--font);font-size:var(--fs-sm);font-weight:var(--fw-m);
    color:var(--text-3);background:transparent;
    border:none;border-radius:var(--r-md);cursor:pointer;
    transition:all var(--t) var(--ease);white-space:nowrap;letter-spacing:.01em;

    &:hover:not(.is-active) { color:var(--text-1);background:var(--surf-2); }
    &:focus-visible { outline:2px solid var(--violet);outline-offset:-2px; }
    &.is-active {
      color:var(--text-1);background:var(--surf-0);
      font-weight:var(--fw-b);box-shadow:var(--sh-sm);
    }
  }

  &__content { padding:var(--sp-1) 0; }
}

/* ─── SECTION CARD ────────────────────────────────────────── */
.bpsfw-section-card {
  background:var(--surf-0);
  border:1px solid var(--bdr);
  border-radius:var(--r-lg);
  box-shadow:var(--sh-sm);
  overflow:hidden;
  margin-bottom:var(--sp-4);
  transition:box-shadow var(--t-slow) var(--ease),border-color var(--t-slow) var(--ease);
  &:hover { box-shadow:var(--sh-md);border-color:var(--bdr-strong); }
}

.bpsfw-section-header {
  display:flex;align-items:center;gap:var(--sp-3);
  padding:var(--sp-4) var(--sp-6);
  border-bottom:1px solid var(--bdr);
  background:var(--surf-1);
  position:relative;

  &::before {
    content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
    background:linear-gradient(180deg,var(--violet),rgba(108,99,255,.15));
    border-radius:0 var(--r-sm) var(--r-sm) 0;
  }
}

.bpsfw-section-icon {
  display:flex;align-items:center;justify-content:center;
  width:34px;height:34px;font-size:16px;flex-shrink:0;
  background:var(--violet-lt);
  border:1px solid rgba(108,99,255,.18);
  border-radius:var(--r);
}

.bpsfw-section-title {
  margin:0;font-size:var(--fs-md);font-weight:var(--fw-b);
  color:var(--text-1);letter-spacing:-.02em;
}
.bpsfw-section-subtitle { margin:2px 0 0;font-size:var(--fs-xs);color:var(--text-4);letter-spacing:.01em; }
.bpsfw-section-body { padding:var(--sp-5) var(--sp-6); }

.bpsfw-role-badge {
  display:inline-flex;align-items:center;
  padding:3px 10px;margin-left:auto;
  background:var(--violet-lt);color:var(--violet);
  border:1px solid rgba(108,99,255,.2);
  border-radius:var(--r-full);
  font-size:var(--fs-2xs);font-family:var(--font-mono);
  font-weight:var(--fw-b);letter-spacing:.06em;text-transform:uppercase;
}

/* Sticky save bar */
.bpsfw-save-row {
  position:sticky;
  bottom:0;
  z-index:100;
  display:flex;align-items:center;gap:var(--sp-3);
  padding:var(--sp-3) var(--sp-5);
  margin:0;
  background:rgba(247,248,252,.9);
  backdrop-filter:blur(8px);
  border-top:1px solid var(--bdr);
  box-shadow:0 -4px 16px rgba(13,15,26,.06);
}

/* ─── INPUT ROWS ──────────────────────────────────────────── */
.bui-input-row {
  display:flex;align-items:flex-start;gap:var(--sp-6);
  padding:var(--sp-4) var(--sp-5);
  background:var(--surf-0);
  border:1px solid var(--surf-2);
  border-radius:var(--r);
  margin-bottom:var(--sp-3);
  transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease);

  &:last-child { margin-bottom:0; }
  &:focus-within {
    border-color:rgba(108,99,255,.28);
    box-shadow:0 0 0 3px var(--violet-lt);
  }

  &__label {
    flex:0 0 230px;max-width:230px;padding-top:8px;
    font-size:var(--fs-base);font-weight:var(--fw-m);
    color:var(--text-2);line-height:1.5;
  }
  &__field { flex:1;max-width:460px; }

  &__field--radio { display:flex;margin-top:10px;gap:var(--sp-4); }
}

/* ─── FORM CONTROLS ───────────────────────────────────────── */
.bui-field-label {
  display:block;margin-bottom:6px;
  font-size:var(--fs-sm);font-weight:var(--fw-b);
  color:var(--text-2);letter-spacing:.02em;text-transform:uppercase;
}

%inp {
  width:100%;font-family:var(--font);font-size:var(--fs-base);
  color:var(--text-1);background:var(--surf-1);
  border:1.5px solid var(--bdr);border-radius:var(--r);
  transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease),background var(--t) var(--ease);
  appearance:none;
  &::placeholder { color:var(--text-4); }
  &:hover:not(:focus) { border-color:var(--bdr-strong);background:var(--surf-0); }
  &:focus {
    outline:none;background:var(--surf-0);
    border-color:var(--violet);box-shadow:0 0 0 3px var(--violet-lt);
  }
}

.bui-input-base { @extend %inp;height:var(--input-h);padding:0 var(--sp-3); }
.bui-text-control { width:100%; }
.bui-text-input   { @extend %inp;height:var(--input-h);padding:0 var(--sp-3); }

.bui-textarea-control { width:100%; }
.bui-textarea { @extend %inp;height:auto;min-height:100px;padding:var(--sp-3);resize:vertical;line-height:1.6; }

/* Standard checkbox — clean, reliable */
.bui-checkbox-control { display:flex;align-items:center;gap:var(--sp-2);cursor:pointer; }
.bui-checkbox-input {
  flex-shrink:0;
  width:16px;height:16px;
  appearance:auto;
  -webkit-appearance:checkbox;
  accent-color:var(--violet);
  cursor:pointer;
  margin:0;
  &:focus-visible { outline:2px solid var(--violet);outline-offset:2px; }
}
.bui-checkbox-label { font-size:var(--fs-base);color:var(--text-2);line-height:1.5;user-select:none; }

.bui-select-control { width:100%; }
.bui-select { @extend %inp;height:var(--input-h);padding:0 var(--sp-3);cursor:pointer;appearance:auto; }
.bui-select-control--compact .bui-select { width:160px; }

p.description { margin:6px 0 0;font-size:var(--fs-sm);color:var(--text-3);line-height:1.6; }
code {
  font-family:var(--font-mono);font-size:11px;
  background:var(--surf-2);color:var(--violet);
  padding:2px 6px;border-radius:var(--r-sm);
  border:1px solid rgba(108,99,255,.15);
}

/* Select2 */
.select2-container {
  .select2-selection--multiple {
    background:var(--surf-1) !important;
    border:1.5px solid var(--bdr) !important;
    border-radius:var(--r) !important;
    min-height:var(--input-h) !important;
    &:focus-within { border-color:var(--violet) !important;box-shadow:0 0 0 3px var(--violet-lt) !important; }
  }
  .select2-selection__choice {
    background:var(--violet-lt) !important;
    border:1px solid rgba(108,99,255,.25) !important;
    border-radius:var(--r-full) !important;
    color:var(--violet) !important;font-family:var(--font) !important;
    font-size:var(--fs-xs) !important;font-weight:var(--fw-b) !important;
    padding:2px 10px 2px 8px !important;
  }
  .select2-selection__choice__remove { color:var(--violet) !important;&:hover{color:var(--rose)!important;} }
}
.select2-dropdown { border:1.5px solid var(--bdr) !important;border-radius:var(--r-md) !important;box-shadow:var(--sh-lg) !important;overflow:hidden !important;font-family:var(--font) !important; }
.select2-results__option--highlighted { background:var(--violet) !important; }

/* ─── BUTTONS ─────────────────────────────────────────────── */
.bui-btn {
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:0 var(--sp-5);height:var(--btn-h);
  font-family:var(--font);font-size:var(--fs-base);font-weight:var(--fw-b);
  letter-spacing:.01em;border-radius:var(--r);border:1.5px solid transparent;
  cursor:pointer;text-decoration:none;white-space:nowrap;
  user-select:none;vertical-align:middle;
  transition:background var(--t) var(--ease),border-color var(--t) var(--ease),
    color var(--t) var(--ease),box-shadow var(--t) var(--ease),
    transform var(--t) cubic-bezier(.34,1.56,.64,1);

  &:focus-visible { outline:2px solid var(--violet);outline-offset:2px; }
  &:disabled,&[aria-disabled="true"] { opacity:.45;cursor:not-allowed;pointer-events:none; }

  &--primary {
    background:var(--violet);border-color:var(--violet);color:#fff;box-shadow:var(--sh-violet);
    &:hover:not(:disabled) { background:var(--violet-h);border-color:var(--violet-h);transform:translateY(-1px);box-shadow:0 8px 24px rgba(108,99,255,.45); }
    &:active:not(:disabled) { transform:translateY(0);box-shadow:var(--sh-violet); }
  }
  &--secondary {
    background:var(--surf-0);border-color:var(--bdr-strong);color:var(--text-2);box-shadow:var(--sh-xs);
    &:hover:not(:disabled) { background:var(--surf-1);color:var(--text-1);transform:translateY(-1px);box-shadow:var(--sh-sm); }
  }
  &--danger {
    background:var(--rose);border-color:var(--rose);color:#fff;box-shadow:var(--sh-rose);
    &:hover:not(:disabled) { background:var(--rose-h);border-color:var(--rose-h);transform:translateY(-1px);box-shadow:0 8px 24px rgba(244,63,94,.45); }
  }
  &--ghost {
    background:transparent;border-color:transparent;color:var(--violet);
    &:hover:not(:disabled) { background:var(--violet-lt); }
  }
  &--sm { height:var(--btn-h-sm);padding:0 var(--sp-3);font-size:var(--fs-sm);border-radius:var(--r); }
  &--lg { height:var(--btn-h-lg);padding:0 var(--sp-6);font-size:var(--fs-md);border-radius:var(--r-md); }
}

/* ─── LOADER ──────────────────────────────────────────────── */
.bpsfw-overlay-loader {
  position:fixed;inset:0;
  background:rgba(13,15,26,.5);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;
  z-index:var(--z-overlay);
  animation:bpsfw-fadein .15s var(--ease);
}
@keyframes bpsfw-fadein { from{opacity:0} to{opacity:1} }

.bpsfw-loader-box {
  background:var(--surf-0);border:1px solid var(--bdr);
  border-radius:var(--r-xl);padding:var(--sp-10) var(--sp-12);
  box-shadow:var(--sh-xl);
  display:flex;flex-direction:column;align-items:center;gap:var(--sp-4);
  animation:bpsfw-scalein .2s cubic-bezier(.34,1.56,.64,1);
}
@keyframes bpsfw-scalein { from{opacity:0;transform:scale(.94)} to{opacity:1;transform:scale(1)} }
.bpsfw-loader-text { font-size:var(--fs-sm);color:var(--text-3);font-weight:var(--fw-m);letter-spacing:.02em; }
.bpsfw-spinner {
  width:32px;height:32px;border:2.5px solid var(--surf-2);border-top-color:var(--violet);
  border-radius:50%;animation:bpsfw-spin .6s linear infinite;
}
@keyframes bpsfw-spin { to { transform:rotate(360deg) } }

/* ─── USER MANAGEMENT — STAT CARDS ───────────────────────── */
.bpsfw-users-wrap { padding-top:var(--sp-1); }

.bpsfw-stats-row {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:var(--sp-4);
  margin-bottom:var(--sp-5);
}

.bpsfw-stat-card {
  display:flex;align-items:center;gap:var(--sp-4);
  padding:var(--sp-5);
  background:var(--surf-0);
  border:1px solid var(--bdr);
  border-radius:var(--r-lg);
  box-shadow:var(--sh-xs);
  cursor:pointer;
  transition:all var(--t-slow) var(--ease);

  &:hover { box-shadow:var(--sh);transform:translateY(-1px); }

  &.is-active-pending {
    border-color:rgba(245,158,11,.35);
    background:linear-gradient(135deg,var(--amber-lt),var(--surf-0));
    box-shadow:0 4px 20px rgba(245,158,11,.14),var(--sh-sm);
    .bpsfw-stat-icon { background:var(--amber-lt);border-color:rgba(245,158,11,.25); }
  }
  &.is-active-approved {
    border-color:rgba(16,185,129,.35);
    background:linear-gradient(135deg,var(--emerald-lt),var(--surf-0));
    box-shadow:0 4px 20px rgba(16,185,129,.14),var(--sh-sm);
    .bpsfw-stat-icon { background:var(--emerald-lt);border-color:rgba(16,185,129,.25); }
  }
  &.is-active-denied {
    border-color:rgba(244,63,94,.35);
    background:linear-gradient(135deg,var(--rose-lt),var(--surf-0));
    box-shadow:var(--sh-rose),var(--sh-sm);
    .bpsfw-stat-icon { background:var(--rose-lt);border-color:rgba(244,63,94,.25); }
  }
}

.bpsfw-stat-icon {
  width:44px;height:44px;display:flex;align-items:center;justify-content:center;
  font-size:20px;flex-shrink:0;
  background:var(--surf-2);border:1px solid var(--bdr);border-radius:var(--r-md);
  transition:all var(--t) var(--ease);
}

.bpsfw-stat-num {
  font-size:28px;font-weight:var(--fw-xb);color:var(--text-1);
  line-height:1;letter-spacing:-.04em;font-family:var(--font);
}

.bpsfw-stat-label {
  font-size:var(--fs-xs);color:var(--text-4);font-weight:var(--fw-m);
  margin-top:4px;text-transform:uppercase;letter-spacing:.06em;
}

/* ─── USER TABLE ──────────────────────────────────────────── */
.bui-table-header {
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:var(--sp-4);flex-wrap:wrap;gap:var(--sp-3);

  &__count { font-size:var(--fs-sm);color:var(--text-3);font-weight:var(--fw-m); }

  .bui-per-page {
    display:flex;align-items:center;gap:var(--sp-2);
    font-size:var(--fs-sm);color:var(--text-3);
    select {
      height:30px;padding:0 var(--sp-2);font-family:var(--font);font-size:var(--fs-sm);
      background:var(--surf-1);border:1.5px solid var(--bdr);border-radius:var(--r);
      color:var(--text-1);cursor:pointer;
      &:focus { outline:none;border-color:var(--violet);box-shadow:0 0 0 3px var(--violet-lt); }
    }
  }
}

.bui-user-table-wrap {
  width:100%;overflow-x:auto;
  border-radius:var(--r-md);border:1px solid var(--bdr);
}

.bui-user-table {
  width:100%;border-collapse:collapse;font-size:var(--fs-base);

  thead tr { background:var(--surf-1);border-bottom:1.5px solid var(--bdr); }
  thead th {
    padding:var(--sp-3) var(--sp-4);text-align:left;
    font-size:var(--fs-2xs);font-weight:var(--fw-xb);color:var(--text-4);
    white-space:nowrap;letter-spacing:.08em;text-transform:uppercase;
    font-family:var(--font-mono);
  }

  tbody tr {
    border-bottom:1px solid var(--surf-2);
    transition:background var(--t) var(--ease);
    &:hover { background:#f5f6ff; }
    &:last-child { border-bottom:none; }
  }
  tbody td { padding:var(--sp-3) var(--sp-4);vertical-align:middle;color:var(--text-1); }

  .bui-user-cell { display:flex;align-items:center;gap:var(--sp-3); }
  .bui-user-avatar {
    width:var(--avatar);height:var(--avatar);border-radius:50%;object-fit:cover;
    flex-shrink:0;border:2px solid var(--surf-3);box-shadow:var(--sh-xs);
  }
  .bui-user-link {
    color:var(--text-1);text-decoration:none;font-weight:var(--fw-b);font-size:var(--fs-base);
    &:hover { color:var(--violet);text-decoration:underline; }
  }
  .bui-email-link {
    color:var(--text-3);text-decoration:none;font-size:var(--fs-sm);font-family:var(--font-mono);
    &:hover { color:var(--violet); }
  }
  .bui-role-tag {
    display:inline-flex;align-items:center;padding:2px 10px;
    background:var(--surf-2);color:var(--text-2);
    border-radius:var(--r-full);font-size:var(--fs-xs);
    font-weight:var(--fw-b);font-family:var(--font-mono);
    letter-spacing:.04em;border:1px solid var(--bdr);
  }
  .bui-action-cell { display:flex;align-items:center;gap:var(--sp-2); }

  .bui-empty-row td { padding:60px var(--sp-4);text-align:center; }
  .bui-empty-state {
    display:flex;flex-direction:column;align-items:center;gap:var(--sp-3);
    &__icon { font-size:40px;opacity:.18;filter:grayscale(1); }
    &__text { font-size:var(--fs-lg);font-weight:var(--fw-b);color:var(--text-3);letter-spacing:-.01em; }
    &__sub  { font-size:var(--fs-sm);color:var(--text-4); }
  }
}

.bui-status-badge {
  display:inline-flex;align-items:center;gap:5px;padding:3px 10px;
  border-radius:var(--r-full);font-size:var(--fs-2xs);font-weight:var(--fw-xb);
  font-family:var(--font-mono);letter-spacing:.07em;text-transform:uppercase;

  &::before { content:'';display:inline-block;width:5px;height:5px;border-radius:50%; }

  &--pending  { background:var(--amber-lt);  color:#78350f;border:1px solid rgba(245,158,11,.25); &::before{background:var(--amber);box-shadow:0 0 5px var(--amber);} }
  &--approved { background:var(--emerald-lt);color:#064e3b;border:1px solid rgba(16,185,129,.25);  &::before{background:var(--emerald);box-shadow:0 0 5px var(--emerald);} }
  &--denied   { background:var(--rose-lt);   color:#881337;border:1px solid rgba(244,63,94,.25);   &::before{background:var(--rose);box-shadow:0 0 5px var(--rose);} }
}

.bui-pagination {
  display:flex;align-items:center;justify-content:space-between;
  margin-top:var(--sp-4);padding-top:var(--sp-4);
  border-top:1px solid var(--surf-2);flex-wrap:wrap;gap:var(--sp-3);

  &__controls { display:flex;align-items:center;gap:var(--sp-2); }
  &__page-label { padding:0 var(--sp-3);font-size:var(--fs-sm);color:var(--text-2);font-weight:var(--fw-b);white-space:nowrap;font-family:var(--font-mono); }
  &__info { font-size:var(--fs-sm);color:var(--text-4);font-family:var(--font-mono); }
}

.bui-page-btn {
  display:inline-flex;align-items:center;justify-content:center;
  height:32px;padding:0 var(--sp-3);
  font-family:var(--font);font-size:var(--fs-sm);font-weight:var(--fw-b);
  color:var(--text-2);background:var(--surf-0);
  border:1.5px solid var(--bdr);border-radius:var(--r);cursor:pointer;
  transition:all var(--t) var(--ease);

  &:hover:not(:disabled) { background:var(--surf-1);border-color:var(--violet);color:var(--violet);transform:translateY(-1px); }
  &:disabled { opacity:.35;cursor:not-allowed; }
}

/* ─── RESPONSIVE ──────────────────────────────────────────── */
@media (max-width:782px) {
  .bpsfw-page-header { flex-direction:column;align-items:flex-start;gap:var(--sp-4);padding:var(--sp-5);margin-right:0; }
  .bpsfw-tab-panel { margin-right:0; }
  .bpsfw-tab-panel__nav { border-radius:var(--r); }
  .bpsfw-section-body { padding:var(--sp-4); }
  .bui-input-row { flex-direction:column;gap:var(--sp-3);&__label{max-width:100%;padding-top:0;}&__field{max-width:100%;} }
  .bpsfw-stats-row { grid-template-columns:1fr; }
}

/* ─── TOAST NOTIFICATIONS ─────────────────────────────────── */
.bpsfw-toast-stack {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 999999;
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  max-width: 360px;
  pointer-events: none;
}

.bpsfw-toast {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
  border-radius: var(--r-md);
  box-shadow: var(--sh-lg);
  font-family: var(--font);
  font-size: var(--fs-base);
  font-weight: var(--fw-m);
  pointer-events: all;
  animation: bpsfw-toast-in .22s cubic-bezier(.34,1.56,.64,1) forwards;

  &__icon {
    display: flex; align-items: center; justify-content: center;
    width: 22px; height: 22px; border-radius: 50%;
    font-size: 12px; font-weight: var(--fw-xb); flex-shrink: 0;
    background: rgba(255,255,255,.22);
  }

  &__msg { flex: 1; line-height: 1.4; }

  &__close {
    background: transparent; border: none; cursor: pointer;
    font-size: 18px; line-height: 1; opacity: .6; padding: 0;
    color: inherit; flex-shrink: 0;
    &:hover { opacity: 1; }
  }

  &--success { background: #0a3d2b; color: #6ee7b7; border: 1px solid rgba(16,185,129,.3); }
  &--error   { background: #3b0a14; color: #fca5a5; border: 1px solid rgba(244,63,94,.3); }
  &--warning { background: #3b2800; color: #fcd34d; border: 1px solid rgba(245,158,11,.3); }
  &--info    { background: #0f1535; color: #a5b4fc; border: 1px solid rgba(108,99,255,.3); }
}

@keyframes bpsfw-toast-in {
  from { opacity: 0; transform: translateX(20px) scale(.95); }
  to   { opacity: 1; transform: translateX(0) scale(1); }
}

/* ─── CONFIRM DIALOG ──────────────────────────────────────── */
.bpsfw-dialog-overlay {
  position: fixed; inset: 0;
  background: rgba(13,15,26,.55);
  backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  z-index: 999998;
  animation: bpsfw-fadein .15s var(--ease);
}

.bpsfw-dialog {
  background: var(--surf-0);
  border: 1px solid var(--bdr);
  border-radius: var(--r-xl);
  padding: var(--sp-8) var(--sp-8);
  box-shadow: var(--sh-xl);
  max-width: 360px; width: 100%;
  text-align: center;
  animation: bpsfw-scalein .2s cubic-bezier(.34,1.56,.64,1);

  &__icon { font-size: 32px; margin-bottom: var(--sp-3); }

  &__msg {
    font-size: var(--fs-md); color: var(--text-1);
    font-weight: var(--fw-m); line-height: 1.5;
    margin: 0 0 var(--sp-6);
  }

  &__actions {
    display: flex; gap: var(--sp-3); justify-content: center;
    .bui-btn { min-width: 100px; }
  }
}

.pqd-pro-badge {
  display: inline-flex;
  align-items: stretch;
  gap: 4px;
  background: #6366f1;
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 4px;
  text-transform: uppercase;
  margin-left: 8px;
  line-height: 1.4;
}

.select2-container--disabled {
  opacity: 0.6;
  pointer-events: none;
}

.bui-disabled input,
.bui-disabled textarea,
.bui-disabled select,
.bui-disabled .select2-container {
  opacity: 0.6;
  pointer-events: none;
}

.bui-disabled a {
  opacity: 1;
  pointer-events: auto;
}

.bui-field-with-pro {
  display: flex;
  align-items: center;
  gap: 10px;
}

.bui-field-with-pro > *:first-child {
  flex: 1;
}

.bui-pro-inline {
  font-size: 12px;
  color: #64748b;
  white-space: nowrap;
}

.bui-pro-inline a {
  color: #6366f1;
  font-weight: 600;
  text-decoration: underline;
}

/* Fix Select2 width inside flex */
.select2-container {
  width: 100% !important;
}