/* =========================================================
   CryptoBank — core theme
   Dark / Gray / Lime-Green fintech theme, built on top of a
   heavily overridden Bootstrap 5. No Bootstrap defaults are
   left visually intact.
   ========================================================= */

:root{
  --bg:            #0a0c0d;
  --bg-elevated:   #0d0f11;
  --panel:         #131619;
  --panel-2:       #16191d;
  --panel-3:       #1b1f24;
  --border:        rgba(255,255,255,.07);
  --border-strong: rgba(255,255,255,.14);
  --text:          #f2f4f3;
  --text-muted:    #9aa2a0;
  --text-faint:    #6b7370;

  --accent:        #cbfa3d;
  --accent-2:      #e4ff8a;
  --accent-dark:   #9fd424;
  --accent-ink:    #0c1400;

  --danger:        #ff5c5c;
  --danger-bg:     rgba(255,92,92,.12);
  --warning:       #ffb547;
  --warning-bg:    rgba(255,181,71,.12);
  --success:       #5be08a;
  --success-bg:    rgba(91,224,138,.12);
  --info:          #58b6ff;
  --info-bg:       rgba(88,182,255,.12);

  --radius-sm:     8px;
  --radius:        14px;
  --radius-lg:     20px;
  --radius-xl:     28px;

  --shadow-panel:  0 1px 0 rgba(255,255,255,.03) inset, 0 10px 30px -18px rgba(0,0,0,.6);
  --sidebar-w:     264px;
  --topbar-h:      72px;

  --font-sans: 'Manrope', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

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

html{ -webkit-text-size-adjust:100%; }

body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-sans);
  font-size:15px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}

a{ color:inherit; text-decoration:none; }
a:hover{ color:var(--accent); }
::selection{ background:var(--accent); color:var(--accent-ink); }

/* subtle dotted background texture used on content area */
.cb-app{
  min-height:100vh;
  background-image:radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:22px 22px;
  background-position:-6px -6px;
}

h1,h2,h3,h4,h5,h6{ color:var(--text); font-weight:800; letter-spacing:-.02em; margin:0; }
p{ margin:0; }
small,.text-sm{ font-size:12.5px; }

.text-muted{ color:var(--text-muted) !important; }
.text-faint{ color:var(--text-faint) !important; }
.text-accent{ color:var(--accent) !important; }
.fw-bold{ font-weight:700 !important; }
.fw-800{ font-weight:800 !important; }

/* =========================================================
   Scrollbars
   ========================================================= */
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{ background:#242a2e; border-radius:10px; border:2px solid var(--bg); }
::-webkit-scrollbar-thumb:hover{ background:#2f363b; }

/* =========================================================
   Layout shell
   ========================================================= */
.cb-shell{ display:flex; min-height:100vh; }

.cb-sidebar{
  width:var(--sidebar-w);
  flex:0 0 var(--sidebar-w);
  background:var(--bg-elevated);
  border-right:1px solid var(--border);
  position:fixed;
  top:0; left:0; bottom:0;
  z-index:1040;
  display:flex;
  flex-direction:column;
  transition:transform .25s ease;
}

.cb-sidebar__brand{
  display:flex; align-items:center; gap:10px;
  padding:22px 22px 18px;
  flex:0 0 auto;
}
.cb-sidebar__brand .cb-logo-mark{
  width:30px; height:30px; border-radius:8px;
  background:var(--accent);
  display:flex; align-items:center; justify-content:center;
  color:var(--accent-ink); font-size:18px;
  flex:0 0 auto;
}
.cb-sidebar__brand .cb-logo-text{
  font-size:19px; font-weight:800; color:var(--text); letter-spacing:-.02em;
}

.cb-sidebar__scroll{
  flex:1 1 auto;
  overflow-y:auto;
  padding:6px 14px 24px;
}

.cb-nav-group{ margin-top:18px; }
.cb-nav-group__label{
  font-size:10.5px; font-weight:800; letter-spacing:.12em;
  color:var(--text-faint); text-transform:uppercase;
  padding:0 10px 8px;
}

.cb-nav-item{
  display:flex; align-items:center; gap:12px;
  padding:10px 12px; margin-bottom:2px;
  border-radius:10px;
  color:var(--text-muted);
  font-weight:700; font-size:13.5px;
  cursor:pointer;
  position:relative;
  border:1px solid transparent;
}
.cb-nav-item i{ font-size:17px; flex:0 0 auto; width:18px; text-align:center; color:inherit; }
.cb-nav-item .cb-nav-item__chev{ margin-left:auto; font-size:14px; transition:transform .18s ease; opacity:.7; }
.cb-nav-item:hover{ color:var(--text); background:var(--panel); }
.cb-nav-item.is-active{
  color:var(--accent);
  background:var(--panel);
  border-color:var(--border);
}
.cb-nav-item .cb-dot{
  width:6px; height:6px; border-radius:50%; background:var(--accent);
  margin-left:auto; flex:0 0 auto;
}
.cb-nav-badge{
  font-size:9.5px; font-weight:800; letter-spacing:.04em;
  padding:2px 6px; border-radius:5px;
  background:var(--warning-bg); color:var(--warning);
  margin-left:6px;
}
.cb-nav-badge.is-new{ background:var(--success-bg); color:var(--success); }

.cb-nav-sub{
  overflow:hidden; max-height:0; transition:max-height .22s ease;
  padding-left:6px;
}
.cb-nav-sub.is-open{ max-height:600px; }
.cb-nav-sub .cb-nav-item{ padding-left:38px; font-size:13px; }
.cb-nav-sub .cb-nav-item i{ font-size:15px; }

.cb-nav-item.has-children[aria-expanded="true"] .cb-nav-item__chev{ transform:rotate(90deg); }

/* =========================================================
   Topbar
   ========================================================= */
.cb-main{
  flex:1 1 auto;
  min-width:0;
  margin-left:var(--sidebar-w);
  display:flex; flex-direction:column;
}

.cb-topbar{
  height:var(--topbar-h);
  flex:0 0 auto;
  display:flex; align-items:center; gap:16px;
  padding:0 28px;
  background:rgba(10,12,13,.85);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
  position:sticky; top:0; z-index:1020;
}
.cb-topbar__title{ font-size:18px; font-weight:800; }
.cb-burger{
  display:none;
  width:38px; height:38px; border-radius:9px;
  background:var(--panel); border:1px solid var(--border);
  align-items:center; justify-content:center;
  color:var(--text); font-size:19px;
  flex:0 0 auto;
}
.cb-topbar__spacer{ flex:1 1 auto; }

.cb-topbar__actions{ display:flex; align-items:center; gap:10px; }

.cb-pill-btn{
  display:flex; align-items:center; gap:6px;
  height:38px; padding:0 12px;
  border-radius:10px; background:var(--panel); border:1px solid var(--border);
  color:var(--text); font-weight:700; font-size:13px;
  cursor:pointer;
}
.cb-pill-btn:hover{ border-color:var(--border-strong); color:var(--text); }

.cb-icon-btn{
  width:38px; height:38px; border-radius:10px;
  background:var(--panel); border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  color:var(--text-muted); font-size:17px; position:relative; cursor:pointer;
}
.cb-icon-btn:hover{ color:var(--text); border-color:var(--border-strong); }
.cb-icon-btn .cb-badge-dot{
  position:absolute; top:7px; right:7px;
  width:7px; height:7px; border-radius:50%;
  background:var(--accent); border:2px solid var(--bg-elevated);
}

.cb-avatar{
  width:38px; height:38px; border-radius:50%;
  background:var(--accent); color:var(--accent-ink);
  display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:15px; cursor:pointer; flex:0 0 auto;
}

.cb-content{ padding:26px 28px 60px; }

/* overlay for mobile drawer */
.cb-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,.55);
  z-index:1030; opacity:0; pointer-events:none; transition:opacity .2s ease;
}
.cb-overlay.is-visible{ opacity:1; pointer-events:auto; }

@media (max-width: 991.98px){
  .cb-sidebar{ transform:translateX(-100%); box-shadow:0 0 60px rgba(0,0,0,.5); }
  .cb-sidebar.is-open{ transform:translateX(0); }
  .cb-main{ margin-left:0; }
  .cb-burger{ display:flex; }
  .cb-topbar{ padding:0 16px; }
  .cb-content{ padding:18px 16px 48px; }
}

/* =========================================================
   Panels / Cards
   ========================================================= */
.cb-panel{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow-panel);
}
.cb-panel__header{
  display:flex; align-items:center; gap:10px;
  padding:18px 20px; border-bottom:1px solid var(--border);
}
.cb-panel__body{ padding:20px; }
.cb-panel__accent-bar{ width:4px; height:16px; border-radius:3px; background:var(--accent); }

.cb-stat{
  background:var(--panel); border:1px solid var(--border); border-radius:var(--radius);
  padding:18px; position:relative;
}
.cb-stat.is-active{ border-color:var(--accent); box-shadow:0 0 0 1px var(--accent) inset; }
.cb-stat__top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; }
.cb-stat__icon{
  width:38px; height:38px; border-radius:10px; background:var(--panel-3);
  display:flex; align-items:center; justify-content:center; font-size:18px; color:var(--accent);
}
.cb-stat__tag{ font-size:10.5px; font-weight:800; letter-spacing:.04em; color:var(--accent); text-transform:uppercase; }
.cb-stat__label{ font-size:10.5px; font-weight:800; letter-spacing:.08em; color:var(--text-faint); text-transform:uppercase; margin-bottom:6px; }
.cb-stat__value{ font-size:26px; font-weight:800; letter-spacing:-.02em; }

/* Hero */
.cb-hero{
  position:relative; overflow:hidden;
  background:radial-gradient(120% 140% at 85% 0%, rgba(203,250,61,.16), transparent 55%), var(--panel);
  border:1px solid var(--border); border-radius:var(--radius-xl);
  padding:44px 44px 40px;
}
.cb-hero__badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 12px; border-radius:20px;
  background:var(--panel-3); border:1px solid var(--border-strong);
  font-size:10.5px; font-weight:800; letter-spacing:.08em; color:var(--accent); text-transform:uppercase;
  margin-bottom:22px;
}
.cb-hero__badge i{ font-size:13px; }
.cb-hero h1{ font-size:46px; line-height:1.06; max-width:640px; }
.cb-hero h1 .hl{ color:var(--accent); }
.cb-hero p{ color:var(--text-muted); max-width:520px; margin-top:16px; font-size:15px; }
.cb-hero__actions{ display:flex; gap:12px; margin-top:28px; flex-wrap:wrap; }

.cb-card-mock{
  position:absolute; right:40px; top:50%; transform:translateY(-50%) rotate(-8deg);
  width:280px; height:176px; border-radius:18px;
  background:linear-gradient(155deg,#1c2024,#101315 60%);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 30px 60px -20px rgba(0,0,0,.7);
  padding:20px;
  display:flex; flex-direction:column; justify-content:space-between;
}
.cb-card-mock__top{ display:flex; align-items:center; justify-content:space-between; }
.cb-card-mock__mark{ width:26px; height:26px; border-radius:7px; background:var(--accent); display:flex; align-items:center; justify-content:center; color:var(--accent-ink); font-size:15px; }
.cb-card-mock__chip{ width:34px; height:24px; border-radius:5px; background:linear-gradient(135deg,#8a8f78,#c9d19b); }
.cb-card-mock__number{ font-family:'JetBrains Mono', monospace; letter-spacing:.12em; color:rgba(255,255,255,.75); font-size:15px; }
.cb-card-mock__bottom{ display:flex; align-items:flex-end; justify-content:space-between; }
.cb-card-mock__label{ font-size:8.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--text-faint); }
.cb-card-mock__value{ font-size:11px; color:rgba(255,255,255,.85); font-weight:700; }

@media (max-width: 991.98px){
  .cb-card-mock{ display:none; }
  .cb-hero h1{ font-size:32px; }
  .cb-hero{ padding:30px 24px; }
}

/* =========================================================
   Buttons
   ========================================================= */
.btn{ border-radius:11px; font-weight:800; font-size:13.5px; padding:.62rem 1.15rem; border:1px solid transparent; }
.btn:focus{ box-shadow:none; }

.btn-cb-primary{ background:var(--accent); color:var(--accent-ink); }
.btn-cb-primary:hover{ background:var(--accent-2); color:var(--accent-ink); }
.btn-cb-primary:disabled{ background:#3a4023; color:#767c5f; }

.btn-cb-dark{ background:var(--panel-3); color:var(--text); border-color:var(--border); }
.btn-cb-dark:hover{ background:#22262b; color:var(--text); }

.btn-cb-outline{ background:transparent; color:var(--text); border-color:var(--border-strong); }
.btn-cb-outline:hover{ background:var(--panel); color:var(--text); }

.btn-cb-danger{ background:var(--danger-bg); color:var(--danger); }
.btn-cb-danger:hover{ background:var(--danger); color:#1a0000; }

.btn-sm.btn{ padding:.42rem .85rem; font-size:12.5px; border-radius:9px; }
.btn:disabled{ opacity:.6; cursor:not-allowed; }

/* =========================================================
   Forms
   ========================================================= */
.form-label{ font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--text-faint); margin-bottom:8px; }
.form-control, .form-select{
  background:var(--panel-2); border:1px solid var(--border); color:var(--text);
  border-radius:11px; padding:.65rem .9rem; font-size:14.5px;
}
.form-control::placeholder{ color:var(--text-faint); }
.form-control:focus, .form-select:focus{
  background:var(--panel-2); border-color:var(--accent); color:var(--text);
  box-shadow:0 0 0 3px rgba(203,250,61,.15);
}
.form-select{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%239aa2a0' d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .9rem center; }
.form-check-input{ background-color:var(--panel-2); border-color:var(--border-strong); }
.form-check-input:checked{ background-color:var(--accent); border-color:var(--accent); }
.input-group-text{ background:var(--panel-3); border:1px solid var(--border); color:var(--text-muted); border-radius:11px; }

.cb-input-suffix{ position:relative; }
.cb-input-suffix .form-control{ padding-right:70px; }
.cb-input-suffix .suffix{
  position:absolute; right:8px; top:50%; transform:translateY(-50%);
  background:var(--panel-3); border-radius:8px; padding:.35rem .7rem;
  font-size:12px; font-weight:800; color:var(--text-muted);
}

.cb-choice{
  border:1px solid var(--border); border-radius:var(--radius);
  padding:16px 18px; display:flex; align-items:center; gap:14px; cursor:pointer;
  background:var(--panel-2);
}
.cb-choice.is-selected{ border-color:var(--accent); background:rgba(203,250,61,.06); }
.cb-choice__check{ margin-left:auto; width:20px; height:20px; border-radius:50%; border:2px solid var(--border-strong); display:flex; align-items:center; justify-content:center; }
.cb-choice.is-selected .cb-choice__check{ border-color:var(--accent); background:var(--accent); color:var(--accent-ink); }

/* =========================================================
   Tables
   ========================================================= */
.table{ color:var(--text); margin-bottom:0; }
.table > :not(caption) > * > *{ background:transparent; border-bottom-color:var(--border); padding:14px 12px; color:var(--text); }
.table thead th{
  font-size:10.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  color:var(--text-faint); border-bottom:1px solid var(--border); white-space:nowrap;
}
.table tbody tr:hover td{ background:var(--panel-2); }
.table tbody tr.cb-row-link{ cursor:pointer; }
.table-responsive{ border-radius:var(--radius); }

.cb-empty{ padding:60px 20px; text-align:center; color:var(--text-muted); }
.cb-empty i{ font-size:34px; color:var(--text-faint); margin-bottom:10px; display:block; }

/* =========================================================
   Badges / status pills
   ========================================================= */
.cb-badge{
  display:inline-flex; align-items:center; gap:5px;
  padding:4px 10px; border-radius:20px;
  font-size:11px; font-weight:800; letter-spacing:.02em;
}
.cb-badge.is-success{ background:var(--success-bg); color:var(--success); }
.cb-badge.is-warning{ background:var(--warning-bg); color:var(--warning); }
.cb-badge.is-danger{ background:var(--danger-bg); color:var(--danger); }
.cb-badge.is-info{ background:var(--info-bg); color:var(--info); }
.cb-badge.is-muted{ background:var(--panel-3); color:var(--text-muted); }

.cb-tabs{ display:flex; gap:8px; flex-wrap:wrap; }
.cb-tab{
  padding:8px 14px; border-radius:10px; background:var(--panel-2); border:1px solid var(--border);
  color:var(--text-muted); font-weight:800; font-size:12.5px; cursor:pointer;
}
.cb-tab.is-active{ background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }

/* =========================================================
   Auth pages
   ========================================================= */
.cb-auth-wrap{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:var(--bg);
  background-image:radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:22px 22px;
  padding:24px;
}
.cb-auth-card{
  width:100%; max-width:420px;
  background:var(--panel); border:1px solid var(--border); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-panel);
  padding:36px 32px;
}
.cb-auth-card__brand{ display:flex; align-items:center; justify-content:center; gap:10px; margin-bottom:22px; }
.cb-auth-card h1{ font-size:22px; text-align:center; margin-bottom:26px; }
.cb-auth-foot{ text-align:center; margin-top:20px; font-size:13px; color:var(--text-muted); }
.cb-pw-meter{ height:4px; border-radius:3px; background:var(--panel-3); overflow:hidden; margin-top:8px; }
.cb-pw-meter__bar{ height:100%; width:0%; background:var(--danger); transition:width .2s ease, background .2s ease; }

/* =========================================================
   Misc
   ========================================================= */
.cb-divider{ height:1px; background:var(--border); border:0; margin:20px 0; }
.cb-modal .modal-content{ background:var(--panel); border:1px solid var(--border); border-radius:var(--radius-lg); color:var(--text); }
.cb-modal .modal-header, .cb-modal .modal-footer{ border-color:var(--border); }
.cb-modal .btn-close{ filter:invert(1) grayscale(1) brightness(1.6); }

.dropdown-menu{ background:var(--panel-2); border:1px solid var(--border); border-radius:12px; box-shadow:0 20px 40px -20px rgba(0,0,0,.6); }
.dropdown-item{ color:var(--text-muted); font-weight:700; font-size:13px; border-radius:8px; margin:2px 6px; width:calc(100% - 12px); padding:.5rem .7rem; }
.dropdown-item:hover, .dropdown-item:focus{ background:var(--panel-3); color:var(--text); }
.dropdown-divider{ border-color:var(--border); }

.alert{ border-radius:12px; border:1px solid var(--border); font-size:13.5px; }
.alert-danger{ background:var(--danger-bg); color:var(--danger); border-color:transparent; }
.alert-success{ background:var(--success-bg); color:var(--success); border-color:transparent; }
.alert-warning{ background:var(--warning-bg); color:var(--warning); border-color:transparent; }

.cb-page-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:22px; }
.cb-breadcrumb{ font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--text-faint); margin-bottom:8px; }
.cb-breadcrumb .active{ color:var(--accent); }
.cb-page-head h1{ font-size:28px; }
.cb-page-head p{ color:var(--text-muted); margin-top:6px; font-size:14px; }

.cb-service-card{
  background:var(--panel); border:1px solid var(--border); border-radius:var(--radius);
  padding:18px; height:100%; display:flex; flex-direction:column; gap:10px;
}
.cb-service-card__icon{ width:36px; height:36px; border-radius:10px; background:var(--panel-3); display:flex; align-items:center; justify-content:center; color:var(--accent); font-size:17px; }
.cb-service-card h3{ font-size:15px; }
.cb-service-card .feat{ font-size:12px; color:var(--text-muted); display:flex; align-items:center; gap:6px; }
.cb-service-card .feat i{ color:var(--success); font-size:13px; }

.cb-platform-chip{
  display:flex; align-items:center; gap:10px; padding:10px 14px; border-radius:11px;
  background:var(--panel-2); border:1px solid var(--border); font-weight:800; font-size:13px; color:var(--text-muted);
  white-space:nowrap; cursor:pointer;
}
.cb-platform-chip.is-active{ background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }
.cb-platform-chip .count{ opacity:.7; font-weight:700; }

.cb-pagination{ display:flex; align-items:center; gap:6px; }
.cb-pagination a, .cb-pagination span{
  width:32px; height:32px; border-radius:8px; display:flex; align-items:center; justify-content:center;
  background:var(--panel-2); border:1px solid var(--border); color:var(--text-muted); font-weight:700; font-size:12.5px;
}
.cb-pagination .is-active{ background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }

.cb-lang-flag{ width:18px; height:13px; border-radius:2px; object-fit:cover; }

.container-fluid.cb-narrow{ max-width:1180px; }

/* fade/slide helpers */
.cb-fade-in{ animation:cbFadeIn .25s ease both; }
@keyframes cbFadeIn{ from{ opacity:0; transform:translateY(4px);} to{ opacity:1; transform:none; } }

@keyframes cbPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.3; } }
