.logo-wrapper img {
    height: 50px;
}
.login-card .logo img {
    height: 120px;
}
.login-card {

    background-position: center;
    background-repeat: no-repeat;
}
.default-dashboard .card {
    height: 100%;
}
.dropdown .btn.cst {
    width: 100%;
    padding-right: 25px;
}
.dropdown .dropdown-toggle.cst:after {

    right: 6px;
}
.header-top.gap {
    gap: 10px;
    justify-content: inherit;
}
.l-inherit h6 {
    line-height: inherit;
}
.default-dashboard .comman-round img, .dashboard-2 .comman-round img, .dashboard-3 .comman-round img, .general-widget .comman-round img {
    max-width: 100%;
    height: auto;
}
.page-wrapper .page-body-wrapper .page-body {
    margin-bottom: 20px;
}
/* ═══════════════════════════════════════════════
   PAGE CUSTOM STYLES
═══════════════════════════════════════════════ */

/* --- Screen system --- */
.bqr-screen          { display:none; }
.bqr-screen.active   { display:block; }

/* --- Filter bar --- */
.members-filter-bar {
  display:flex; flex-wrap:wrap; gap:8px;
  align-items:center; padding:12px 20px;
  /* border-bottom:1px solid var(--border-color,#ebebeb); */
  background:var(--light-color);
}
.members-filter-bar .search-wrap {
  position:relative; flex:0 0 260px;
}
.members-filter-bar .search-wrap .form-control { padding-left:36px; }
.members-filter-bar .search-wrap .iconly-Search {
  position:absolute; left:11px; top:50%; transform:translateY(-50%);
  color:#aaa; font-size:15px; pointer-events:none;
}
.members-filter-bar .form-select { flex:0 0 160px; }
.members-filter-bar .form-select.auto {
    flex: 0 0 75px;
    width: auto;
}

/* --- Filter chips --- */
.filter-chips-bar {
  display:flex; align-items:center; gap:6px; flex-wrap:wrap;
  padding:8px 20px; background:var(--light-color); border:1px solid var(--border-color,#ebebeb);
}
.filter-chip {
  display:inline-flex; align-items:center; gap:4px;
  background:#fff; border:1px solid var(--theme-default);
  color:var(--theme-default); border-radius:20px;
  padding:2px 10px; font-size:12px; font-weight:600;
  margin-right: 5px;
}
.chip-x {
  background:none; border:none; cursor:pointer; padding:0 2px;
  color:var(--theme-default); font-size:11px; line-height:1;
}
.clear-chips-btn {
  background:none; border:none; color:#e74b2b;
  font-size:12px; font-weight:600; cursor:pointer; padding:2px 8px;
}
.clear-chips-btn:hover { text-decoration:underline; }

/* --- Member table --- */
/* .member-table thead th {
  font-size:12px; font-weight:700; text-transform:uppercase;
  letter-spacing:.04em; color:#888; border-bottom:2px solid var(--border-color,#ebebeb);
  white-space:nowrap; user-select:none;
} */
.member-table thead th[onclick] { cursor:pointer; }
.member-table thead th[onclick]:hover { color:var(--theme-default); }
.member-table tbody tr { cursor:pointer; transition:background .12s; }
/* .member-table tbody tr:hover { background:var(--categorie-hover,#f4f5f8) !important; }
.member-table td { vertical-align:middle; padding:10px 14px; border-bottom:1px solid var(--border-color,#ebebeb); font-size:13.5px; } */
.col-sorted { color:var(--theme-default) !important; }
.sort-ic { font-size:11px; opacity:.55; margin-left:3px; }

/* --- Member cell --- */
.m-cell { display:flex; align-items:center; gap:10px; }
.m-avatar {
  width:34px; height:34px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:700; color:#fff;
  flex-shrink:0;
}
.m-name { font-weight:600; color:var(--body-font-color); font-size:13.5px; }
.m-id   { font-size:11px; color:#aaa; margin-top:1px; }
.m-mob  { font-size:13px; font-weight:500;  }

/* --- Plan badges --- */
/* .plan-badge {
  display:inline-block; border-radius:20px; padding:3px 10px;
  font-size:11.5px; font-weight:700; white-space:nowrap;
} */
.plan-ssc  { background:#fef3c7; color:#78350f; }
.plan-bwb  { background:#dbeafe; color:#1e40af; }
.plan-pp   { background:#ede9fe; color:#5b21b6; }
.plan-vip  { background:#fce7f3; color:#9d174d; }

/* --- Status badges --- */
/* .status-badge {
  display:inline-block; border-radius:20px; padding:3px 10px;
  font-size:11.5px; font-weight:700; white-space:nowrap;
} */
/* .st-active  { background:#d1fae5; color:#065f46; }
.st-cancel  { background:#fff3cd; color:#92400e; }
.st-expired { background:#f3f4f6; color:#4b5563; }
.st-failed  { background:#fee2e2; color:#991b1b; } */

/* --- Renewal soon --- */
.renew-soon-date { color:#e74b2b; font-weight:700; font-size:13px; }
.renew-soon-sub  { font-size:11px; color:#e74b2b; margin-top:2px; }

/* --- Action buttons --- */
/* .tbl-act-btn {
  display:inline-flex; align-items:center; gap:4px;
  padding:4px 10px; border-radius:6px; font-size:12px; font-weight:600;
  border:1px solid transparent; cursor:pointer; transition:all .15s;
  white-space:nowrap;
}
.tbl-act-btn.view {
  background:var(--theme-default); color:#fff;
  border-color:var(--theme-default);
}
.tbl-act-btn.view:hover { opacity:.88; }
.tbl-act-btn.renew {
  background:#10b981; color:#fff; border-color:#10b981;
}
.tbl-act-btn.renew:hover { background:#059669; border-color:#059669; }
.tbl-act-btn:disabled { opacity:.45; cursor:not-allowed; } */

/* --- DataTables overrides for Bootstrap 5 --- */
div.dt-container .dt-search    { display:none; }   /* hide built-in search */
div.dt-container .dt-length    { display:none; }   /* hide built-in length */
div.dt-container .dt-info      { font-size:12.5px; color:#888; padding:12px 20px; }
div.dt-container .dt-paging    { padding:8px 20px; }
div.dt-container .dt-paging nav { display:flex; gap:4px; justify-content:flex-end; }
.dt-paging-button {
  min-width:32px; height:32px; padding:0 10px;
  border-radius:6px; font-size:12.5px; font-weight:600;
  border:1px solid var(--border-color,#ebebeb);
  background:#fff; color:#444; cursor:pointer; transition:.12s;
  display:inline-flex; align-items:center; justify-content:center;
}
.dt-paging-button:hover:not(:disabled) { background:var(--active-bg-color); border-color:var(--theme-default); color:var(--theme-default); }
.dt-paging-button.current { background:var(--theme-default); border-color:var(--theme-default); color:#fff; }
.dt-paging-button:disabled { opacity:.4; cursor:not-allowed; }
.dataTables_wrapper .dataTables_processing { background:rgba(255,255,255,.8); }
/* table.dataTable tbody tr:nth-of-type(even) { background:rgba(0,0,0,.015); } */

/* --- Empty state --- */
.members-empty { text-align:center; padding:48px 24px; }
.members-empty .e-icon { font-size:48px; color:var(--theme-default); opacity:.25; margin-bottom:12px; }
.members-empty h5 { font-weight:700; color:#555; margin-bottom:6px; }
.members-empty p  { font-size:13px; color:#aaa; }

/* --- Days badge --- */
.days-badge { display:inline-block; border-radius:20px; padding:2px 8px; font-size:11px; font-weight:700; }
.days-urgent { background:#fee2e2; color:#991b1b; }
.days-soon   { background:#fff3cd; color:#92400e; }
.days-ok     { background:#d1fae5; color:#065f46; }
.reminder-sent-txt { color:#059669; font-size:12px; font-weight:600; }
.reminder-no-txt   { color:#aaa; font-size:12px; }

/* --- Renewal screen tabs --- */
.renewal-tabs { display:flex; gap:4px; margin-bottom:20px; border-bottom:2px solid var(--border-color,#ebebeb); }
.renewal-tab {
  padding:8px 16px; font-size:13px; font-weight:600;
  cursor:pointer; border-radius:6px 6px 0 0; color:#888;
  border-bottom:3px solid transparent; transition:.15s;
  display:flex; align-items:center; gap:6px;
}
.renewal-tab:hover { color:var(--theme-default); }
.renewal-tab.active { color:var(--theme-default); border-bottom-color:var(--theme-default); background:var(--active-bg-color); }
.tab-ct { background:var(--theme-default); color:#fff; border-radius:20px; padding:1px 7px; font-size:11px; font-weight:700; }

/* ═══════════════════════════════════════════════
   BOOTSTRAP OFFCANVAS DRAWER (replaces custom drawer)
═══════════════════════════════════════════════ */
#detailDrawer { width:480px; }
.drawer-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.drawer-head-left { display:flex; align-items:center; gap:12px; }
.drawer-avatar { width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:15px; color:#fff; flex-shrink:0; }
.drawer-name { font-size:16px; font-weight:700; color:var(--body-font-color); }
.drawer-mob  { font-size:13px; color:#aaa; }
.drawer-close { background:none; border:none; cursor:pointer; font-size:18px; color:#aaa; padding:0; }
.drawer-close:hover { color:#e74b2b; }
.drawer-actions { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:20px; padding-bottom:16px; border-bottom:1px solid var(--border-color,#ebebeb); }

/* Sub info table */
.sub-info-table { width:100%; font-size:13px; }
.sub-info-table tr td:first-child { color:#888; padding:7px 0; width:40%; font-weight:500; }
.sub-info-table tr td:last-child  { font-weight:600; color:var(--body-font-color); text-align:right; }
.sub-info-table tr:not(:last-child) td { border-bottom:1px solid var(--border-color,#ebebeb); }

/* Onboarding progress */
.progress-wrap .prog-label { display:flex; justify-content:space-between; font-size:12px; color:#888; margin-bottom:6px; }
.prog-bar-bg  { background:#eee; border-radius:6px; height:7px; overflow:hidden; }
.prog-bar-fill { background:var(--theme-default); height:100%; border-radius:6px; transition:width .5s; }

/* Body Metrics grid */
.metric-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.metric-item { background:#f8f9fa; border-radius:8px; padding:10px 12px; }
.metric-key  { font-size:11px; color:#aaa; font-weight:600; text-transform:uppercase; letter-spacing:.04em; }
.metric-val  { font-size:17px; font-weight:700; color:var(--body-font-color); margin:2px 0; }
.metric-date { font-size:10.5px; color:#bbb; }

/* Q&A */
.qa-block { margin-bottom:12px; padding-bottom:12px; border-bottom:1px solid var(--border-color,#ebebeb); }
.qa-block:last-child { border-bottom:none; margin-bottom:0; }
.qa-q { font-size:11.5px; font-weight:700; color:#aaa; text-transform:uppercase; letter-spacing:.04em; margin-bottom:4px; }
.qa-a { font-size:13.5px; color:var(--body-font-color); line-height:1.5; }

/* Payment history rows */
.pay-row { display:flex; align-items:center; justify-content:space-between; padding:10px 0; border-bottom:1px solid var(--border-color,#ebebeb); gap:12px; }
.pay-row:last-child { border-bottom:none; }
.pay-row-left strong { display:block; font-size:13px; font-weight:600; color:var(--body-font-color); }
.pay-row-left span   { display:block; font-size:11px; color:#aaa;  margin-top:2px; }
.pay-amount { font-size:14px; font-weight:700; color:var(--body-font-color); white-space:nowrap; }

/* ═══════════════════════════════════════════════
   MODAL CONTENT STYLES (Bootstrap modals)
═══════════════════════════════════════════════ */

/* Plan selection cards */
.plan-select-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.plan-sel-card {
  position:relative; border:2px solid var(--border-color,#ebebeb);
  border-radius:10px; padding:16px; cursor:pointer; transition:.15s;
  overflow:hidden;
}
.plan-sel-card:hover { border-color:var(--theme-default); }
.plan-sel-card.selected {
  border-color:var(--theme-default);
  background:var(--active-bg-color);
}
.plan-sel-card.is-current { border-color:#e0e0e0; background:#f8f8f8; cursor:not-allowed; opacity:.6; }
.ps-label { font-size:10px; font-weight:700; text-transform:uppercase; color:#aaa; letter-spacing:.06em; margin-bottom:4px; }
.ps-name  { font-size:16px; font-weight:800; color:var(--body-font-color); margin-bottom:2px; }
.ps-sub   { font-size:12px; color:#888; }
.ps-check {
  position:absolute; top:12px; right:12px;
  width:20px; height:20px; border-radius:50%;
  background:var(--theme-default); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:10px; opacity:0; transition:.15s;
}
.plan-sel-card.selected .ps-check { opacity:1; }
.cur-badge {
  position:absolute; bottom:10px; right:10px;
  background:#ddd; color:#666; border-radius:20px;
  padding:2px 8px; font-size:10px; font-weight:700;
}
.change-summary {
  background:var(--active-bg-color); border-radius:8px;
  padding:12px 16px; font-size:13px; color:var(--body-font-color);
  border-left:3px solid var(--theme-default);
}

/* Renew boxes */
.renew-boxes { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:16px; }
.renew-box {
  border:2px solid var(--border-color,#ebebeb); border-radius:10px;
  padding:16px; text-align:center;
}
.renew-box.new-exp { border-color:#10b981; background:#f0fdf4; }
.rb-lbl  { font-size:11px; font-weight:700; text-transform:uppercase; color:#aaa; letter-spacing:.04em; margin-bottom:6px; }
.rb-date { font-size:20px; font-weight:800; color:var(--body-font-color); }
.rb-sub  { font-size:12px; color:#888; margin-top:4px; }
.renew-box.new-exp .rb-date { color:#059669; }
.renew-box.new-exp .rb-sub  { color:#059669; font-weight:600; }

/* Info boxes */
.info-box {
  display:flex; align-items:flex-start; gap:10px;
  padding:12px 16px; border-radius:8px; font-size:13px;
  margin-bottom:16px; line-height:1.5;
}
.info-box.info    { background:#eff6ff; color:#1e40af; border:1px solid #bfdbfe; }
.info-box.warning { background:#fffbeb; color:#92400e; border:1px solid #fde68a; }
.info-box.danger  { background:#fff1f2; color:#9f1239; border:1px solid #fecdd3; }
.info-box i { font-size:15px; flex-shrink:0; margin-top:2px; }

/* ═══════════════════════════════════════════════
   TOAST
═══════════════════════════════════════════════ */
.bqr-toast-wrap {
  position:fixed; top:82px; right:20px;
  z-index:9999; display:flex; flex-direction:column; gap:8px;
  pointer-events:none;
}
.bqr-toast {
  display:flex; align-items:flex-start; gap:10px;
  min-width:300px; max-width:420px;
  background:#fff; border-radius:10px; padding:12px 14px;
  box-shadow:0 6px 28px rgba(0,0,0,.14);
  border-left:4px solid #10b981;
  pointer-events:all;
  transform:translateX(60px); opacity:0;
  transition:transform .28s cubic-bezier(.22,1,.36,1), opacity .28s;
}
.bqr-toast.show { transform:translateX(0); opacity:1; }
.bqr-toast.toast-info    { border-color:var(--theme-default); }
.bqr-toast.toast-danger  { border-color:#e74b2b; }
.bqr-toast-icon { font-size:17px; flex-shrink:0; margin-top:1px; }
.toast-success .bqr-toast-icon { color:#10b981; }
.toast-info    .bqr-toast-icon { color:var(--theme-default); }
.toast-danger  .bqr-toast-icon { color:#e74b2b; }
.bqr-toast-msg { font-size:13.5px; color:var(--body-font-color); line-height:1.5; flex:1; }
.bqr-toast-close { background:none; border:none; cursor:pointer; color:#aaa; padding:0 0 0 8px; font-size:14px; }
.bqr-spinner {
  display:inline-block; width:14px; height:14px;
  border:2px solid rgba(255,255,255,.4);
  border-top-color:#fff; border-radius:50%;
  animation:spin .7s linear infinite; vertical-align:middle; margin-right:6px;
}
@keyframes spin { to { transform:rotate(360deg); } }

/* ═══════════════════════════════════════════════
   SIDEBAR — Bootstrap collapse integration
═══════════════════════════════════════════════ */
.sidebar-submenu.collapse { display:none; }
.sidebar-submenu.collapse.show { display:flex; }
/* The Admiro theme uses flex for sidebar-submenu */
.page-sidebar .sidebar-link[data-bs-toggle="collapse"]:not(.collapsed) .iconly-Arrow-Right-2 {
  transform:rotate(90deg);
}
.page-sidebar .sidebar-link[data-bs-toggle="collapse"] .iconly-Arrow-Right-2 {
  transition:transform .25s;
}

/* ═══════════════════════════════════════════════
   DRAWER ACCORDION (Bootstrap accordion in offcanvas)
═══════════════════════════════════════════════ */
#detailDrawer .accordion-item { border:none; border-bottom:1px solid var(--border-color,#ebebeb); }
#detailDrawer .accordion-button {
  font-size:13px; font-weight:700; padding:12px 0;
  background:transparent !important; color:var(--body-font-color);
  box-shadow:none; gap:8px;
}
#detailDrawer .accordion-button:not(.collapsed) { color:var(--theme-default); }
#detailDrawer .accordion-button i { font-size:14px; }
#detailDrawer .accordion-body { padding:10px 0 16px; }
#detailDrawer .accordion-button::after { margin-left:auto; }

/* ═══════════════════════════════════════════════
   SMALL WIDGET CARDS — match reference
═══════════════════════════════════════════════ */
/* .small-widget .card-body { position:relative; overflow:hidden; padding:20px; }
.small-widget .f-light { font-size:13px; color:#888; display:block; margin-bottom:6px; }
.small-widget h4 { font-size:24px; font-weight:800; margin-bottom:0; }
.small-widget .bg-gradient {
  position:absolute; right:-10px; bottom:-10px;
  width:72px; height:72px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  opacity:.15;
}
.small-widget .bg-gradient svg { width:42px; height:42px; }
.small-widget .card-body.secondary { --grad-color:var(--theme-secondary,#f39159); }
.small-widget .card-body.warning   { --grad-color:#ea9200; }
.small-widget .card-body.secondary .bg-gradient { background:var(--theme-secondary,#f39159); opacity:.12; }
.small-widget .card-body.warning .bg-gradient   { background:#ea9200; opacity:.12; } */

/* ═══════════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════════ */
@media (max-width:768px) {
  .members-filter-bar .search-wrap { flex:0 0 100%; }
  .members-filter-bar .form-select { flex:1 1 120px; }
  .plan-select-grid { grid-template-columns:1fr; }
  .renew-boxes { grid-template-columns:1fr; }
  .metric-grid { grid-template-columns:repeat(2,1fr); }
  #detailDrawer { width:100%; }
}
table.cst.dataTable input, table.cst.dataTable select {
    height: 1em;
}
.dataTables_wrapper button.btn-outline-primary {
  color: var(--theme-default);
}
.dataTables_wrapper button.btn-outline-primary:hover {
  color: var(--white);
}
.btn.btn-primary:disabled, .btn.btn-primary.disabled {
    border-color: var(--theme-default);
}
.dark-only .filter-chip {
  background-color: var(--light-color);
}
.dark-only .metric-item {
  background-color: var(--bs-body-bg)
}