/* =========================
   TOREGE CRM Global Theme
   Bootstrap 5 overrides
   ========================= */

/* 1) Design Tokens */
:root{
  --tg-green: #7cff6b;
  --tg-green-2:#34d399;
  --tg-ink:   #0b1220;
  --tg-muted: #667085;
  --tg-line:  #e7ecf3;
  --tg-bg:    #ffffff;
  --tg-soft:  #f8fafc;

  --tg-radius-sm: 10px;
  --tg-radius:    14px;
  --tg-radius-lg: 18px;

  --tg-shadow-sm: 0 8px 18px rgba(15, 23, 42, .06);
  --tg-shadow:    0 16px 40px rgba(15, 23, 42, .08);

  --tg-focus: rgba(124,255,107,.18);
  --tg-focus-border: rgba(124,255,107,.75);
}

/* 2) Base */
html, body{
  height:100%;
}
body{
  background: var(--tg-bg);
  color: var(--tg-ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a{
  text-decoration: none;
}
a:hover{
  text-decoration: none;
}

.text-muted{
  color: var(--tg-muted) !important;
}

.hr, hr{
  border-color: var(--tg-line);
  opacity: 1;
}

/* 3) Layout helpers */
.tg-page{
  background:
    radial-gradient(circle at 22% 10%, rgba(124,255,107,.10), transparent 42%),
    radial-gradient(circle at 82% 86%, rgba(124,255,107,.06), transparent 45%),
    var(--tg-bg);
  min-height: 100vh;
}

.tg-container{
  max-width: 1180px;
}

.tg-section-title{
  font-weight: 900;
  letter-spacing: .2px;
}

.tg-kicker{
  font-size: 12px;
  letter-spacing: 1px;
  font-weight: 900;
  color: var(--tg-muted);
}

/* 4) Cards */
.card{
  border: 1px solid var(--tg-line);
  border-radius: var(--tg-radius-lg);
  box-shadow: var(--tg-shadow-sm);
}
.card-header{
  background: #fff;
  border-bottom: 1px solid var(--tg-line);
  border-top-left-radius: var(--tg-radius-lg);
  border-top-right-radius: var(--tg-radius-lg);
}
.card-footer{
  background: #fff;
  border-top: 1px solid var(--tg-line);
  border-bottom-left-radius: var(--tg-radius-lg);
  border-bottom-right-radius: var(--tg-radius-lg);
}

/* 5) Buttons */
.btn{
  border-radius: var(--tg-radius);
  font-weight: 800;
  letter-spacing: .1px;
  padding: .6rem .95rem;
}

.btn:focus{
  box-shadow: 0 0 0 .25rem var(--tg-focus) !important;
}

.btn-primary{
  background: linear-gradient(135deg, var(--tg-green), var(--tg-green-2));
  border: none;
  color: #06110a;
}
.btn-primary:hover{
  filter: brightness(1.02);
  color: #06110a;
}
.btn-outline-primary{
  border-color: rgba(124,255,107,.65);
  color: #0b1220;
}
.btn-outline-primary:hover{
  background: rgba(124,255,107,.12);
  border-color: rgba(124,255,107,.65);
  color: #0b1220;
}

.btn-danger, .btn-outline-danger{
  border-radius: var(--tg-radius);
}

/* Make secondary more clean */
.btn-secondary{
  background: #0b1220;
  border: none;
}

/* 6) Forms */
.form-label{
  font-weight: 800;
  color: #344054;
}
.form-control, .form-select{
  border-radius: var(--tg-radius);
  border-color: #d7deea;
  padding: .65rem .8rem;
}
.form-control:focus, .form-select:focus{
  border-color: var(--tg-focus-border);
  box-shadow: 0 0 0 .25rem var(--tg-focus);
}
.form-control::placeholder{
  color: rgba(102,112,133,.75);
}

/* input group */
.input-group-text{
  border-radius: var(--tg-radius);
  border-color: #d7deea;
  background: var(--tg-soft);
}

/* 7) Tables */
.table{
  --bs-table-bg: transparent;
}
.table thead th{
  font-size: 12px;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: var(--tg-muted);
  border-bottom: 1px solid var(--tg-line);
}
.table tbody td{
  border-bottom: 1px solid var(--tg-line);
  vertical-align: middle;
}
.table-hover tbody tr:hover{
  background: rgba(124,255,107,.06);
}

/* 8) Alerts / Toasts */
.alert{
  border-radius: var(--tg-radius);
  border-color: var(--tg-line);
  box-shadow: var(--tg-shadow-sm);
}
.alert-success{
  background: rgba(124,255,107,.14);
  border-color: rgba(124,255,107,.35);
  color: #0b1220;
}
.alert-danger{
  background: rgba(255,90,90,.08);
  border-color: rgba(255,90,90,.25);
  color: #0b1220;
}
.alert-warning{
  background: rgba(245, 158, 11, .10);
  border-color: rgba(245, 158, 11, .25);
  color: #0b1220;
}

/* 9) Navbar (if you use one later) */
.navbar{
  border-bottom: 1px solid var(--tg-line);
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
}
.navbar-brand{
  font-weight: 900;
  letter-spacing: .2px;
}
.nav-link{
  font-weight: 700;
  color: #0b1220;
}
.nav-link:hover{
  color: #0b1220;
  opacity: .85;
}
.navbar .badge{
  border-radius: 999px;
}

/* 10) Badges / Pills */
.badge{
  border-radius: 999px;
  font-weight: 800;
}
.badge.bg-success{
  background: rgba(124,255,107,.20) !important;
  color: #0b1220;
}
.badge.bg-secondary{
  background: rgba(15, 23, 42, .08) !important;
  color: #0b1220;
}

/* 11) Pagination */
.pagination .page-link{
  border-radius: 12px !important;
  border-color: var(--tg-line);
  color: #0b1220;
}
.pagination .page-link:focus{
  box-shadow: 0 0 0 .25rem var(--tg-focus);
}
.pagination .page-item.active .page-link{
  background: linear-gradient(135deg, var(--tg-green), var(--tg-green-2));
  border: none;
  color:#06110a;
}

/* 12) Modals */
.modal-content{
  border-radius: var(--tg-radius-lg);
  border: 1px solid var(--tg-line);
  box-shadow: var(--tg-shadow);
}
.modal-header, .modal-footer{
  border-color: var(--tg-line);
}

/* 13) Dropdown */
.dropdown-menu{
  border-radius: var(--tg-radius-lg);
  border: 1px solid var(--tg-line);
  box-shadow: var(--tg-shadow);
}
.dropdown-item{
  font-weight: 650;
}
.dropdown-item:active{
  background: rgba(124,255,107,.15);
  color:#0b1220;
}

/* 14) Small brand mark helper */
.tg-mark{
  width: 40px; height: 40px;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--tg-green), var(--tg-green-2));
  box-shadow: 0 10px 22px rgba(124,255,107,.20);
}
.tg-dot{
  width:10px;height:10px;border-radius:999px;
  background: linear-gradient(135deg, var(--tg-green), var(--tg-green-2));
  display:inline-block;
}

/* 15) Utilities */
.fw-black{ font-weight: 950 !important; }
.tg-soft{
  background: var(--tg-soft) !important;
  border: 1px solid var(--tg-line);
  border-radius: var(--tg-radius-lg);
}