@font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../vendor/fonts/inter-latin-wght-normal.woff2') format('woff2'); }
/* Kwebmaker Projects - black & white theme on top of Tabler */
:root, [data-bs-theme="light"] {
  --tblr-font-sans-serif: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --tblr-primary: #111111;
  --tblr-primary-rgb: 17, 17, 17;
  --tblr-primary-fg: #ffffff;
  --tblr-link-color: #111111;
  --tblr-link-color-rgb: 17, 17, 17;
  --tblr-link-hover-color: #000000;
  --tblr-body-bg: #f5f5f5;
  --tblr-body-color: #1a1a1a;
  --tblr-border-color: #e4e4e4;
  --tblr-border-radius: .6rem;
  --tblr-card-border-radius: .9rem;
  --ease: cubic-bezier(.22, .8, .3, 1);
}
body { font-family: var(--tblr-font-sans-serif); letter-spacing: -.005em; -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, .page-title, .card-title { font-weight: 650; letter-spacing: -.02em; }
a { transition: color .2s var(--ease); }

/* Sidebar: pure black */
.navbar-vertical { background: #0b0b0b !important; border-right: 1px solid #1f1f1f; }
.navbar-vertical .navbar-brand a { color: #fff; }
.navbar-vertical .nav-link {
  color: #a3a3a3; border-radius: .55rem; margin: 2px 10px; padding: .6rem .8rem;
  transition: background .25s var(--ease), color .25s var(--ease), transform .25s var(--ease);
}
.navbar-vertical .nav-link:hover { background: #1a1a1a; color: #fff; transform: translateX(4px); }
.navbar-vertical .nav-item.active > .nav-link { background: #fff; color: #000; font-weight: 600; }
.navbar-vertical .hr-text { color: #666; font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; padding: 0 1.2rem; }
.navbar-vertical .hr-text::before, .navbar-vertical .hr-text::after { display: none; }

/* Top bar & footer */
.page-wrapper > .navbar { background: #fff; border-bottom: 1px solid var(--tblr-border-color); }
.page-pretitle { letter-spacing: .12em; color: #8a8a8a; }

/* Cards */
.card {
  border: 1px solid var(--tblr-border-color); box-shadow: 0 1px 2px rgba(0,0,0,.04);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.card:hover { transform: translateY(-3px); box-shadow: 0 14px 30px -12px rgba(0,0,0,.22); border-color: #cfcfcf; }
.card .card:hover, .card form:hover .card { transform: none; }
.card-sm .avatar { background: #111 !important; color: #fff !important; border-radius: .7rem; transition: transform .35s var(--ease); }
.card-sm:hover .avatar { transform: rotate(-8deg) scale(1.1); }
.card-header { background: transparent; }

/* Buttons */
.btn { font-weight: 550; position: relative; overflow: hidden; transition: transform .15s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease), color .25s var(--ease); }
.btn:hover { transform: translateY(-1px); box-shadow: 0 6px 16px -6px rgba(0,0,0,.35); }
.btn:active { transform: translateY(1px) scale(.97); box-shadow: none; }
.btn-primary { background: #111; border-color: #111; color: #fff; }
.btn-primary:hover, .btn-primary:focus { background: #000; border-color: #000; color: #fff; }
.btn-outline-primary { color: #111; border-color: #111; background: transparent; }
.btn-outline-primary:hover { background: #111; color: #fff; border-color: #111; }
.btn-outline-secondary { color: #444; border-color: #cfcfcf; }
.btn-outline-secondary:hover { background: #111; color: #fff; border-color: #111; }
.ripple { position: absolute; border-radius: 50%; background: rgba(255,255,255,.45); transform: scale(0); animation: ripple .6s ease-out; pointer-events: none; }
.btn-outline-primary .ripple, .btn-outline-secondary .ripple, .btn-light .ripple { background: rgba(0,0,0,.18); }
@keyframes ripple { to { transform: scale(4); opacity: 0; } }

/* Forms */
.form-control, .form-select { border-color: #d9d9d9; transition: border-color .2s var(--ease), box-shadow .2s var(--ease); }
.form-control:focus, .form-select:focus { border-color: #111; box-shadow: 0 0 0 .2rem rgba(0,0,0,.08); }
.form-check-input:checked { background-color: #111; border-color: #111; }

/* Tables */
.table thead th { font-size: .68rem; letter-spacing: .1em; color: #8a8a8a; background: #fafafa; }
.table tbody tr { transition: background .2s var(--ease), transform .2s var(--ease); }
.table tbody tr:hover { background: #f3f3f3; }
.table-hover > tbody > tr:hover > * { --tblr-table-hover-bg: #f3f3f3; }

/* Badges & dropdowns */
.badge { font-weight: 600; letter-spacing: .03em; }
.dropdown-menu { border: 1px solid var(--tblr-border-color); box-shadow: 0 16px 36px -14px rgba(0,0,0,.3); animation: dropIn .22s var(--ease); }
.dropdown-item { transition: background .2s, padding-left .2s var(--ease); }
.dropdown-item:hover { background: #111; color: #fff; padding-left: 1.2rem; }
@keyframes dropIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* Alerts */
.alert { animation: dropIn .4s var(--ease); }

/* Page load + scroll reveal */
.page-body > .container-xl { animation: pageIn .5s var(--ease); }
@keyframes pageIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s var(--ease), transform .7s var(--ease); transition-delay: var(--d, 0s); }
.reveal.in { opacity: 1; transform: none; }

/* Guest / login */
.page-center { background: radial-gradient(circle at 20% 10%, #fff 0, #ececec 60%, #dcdcdc 100%); }
.page-center .card { box-shadow: 0 30px 60px -30px rgba(0,0,0,.35); }

::selection { background: #111; color: #fff; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .reveal { opacity: 1; transform: none; }
}

/* ---------- Spacing & header fixes ---------- */
.page-header { margin: 1.25rem 0 1rem; }
.page-title { display: block; width: 100%; }
.page-title h2 { font-size: 1.4rem; font-weight: 650; line-height: 1.3; margin: 0; }
.page-title > .d-flex { width: 100%; gap: .75rem 1rem; flex-wrap: wrap; justify-content: space-between; align-items: center; }
.page-title .btn { flex-shrink: 0; }
.page-title .btn-sm { padding: .45rem .9rem; font-size: .85rem; }
.page-body { margin: 0 0 1.5rem; }
.page-body .card { margin-bottom: 1rem; }
.page-body .card .card { margin-bottom: 0; }
.row.g-3 > [class*="col"] > .card:last-child { margin-bottom: 0; }
.card-header { padding: .9rem 1.25rem; }
.card-body { padding: 1.25rem; }
.card-footer { padding: .9rem 1.25rem; }
.table th, .table td { padding: .8rem 1rem; vertical-align: middle; }
.table td:last-child { white-space: nowrap; text-align: right; }
.table td .btn + .btn, .table td .btn + form, .table td form + .btn, .table td form + form, .table td a + a { margin-left: .4rem; }
.table td form.d-inline { display: inline-block !important; }
.form-label { margin-bottom: .4rem; }
.form-hint { font-size: .78rem; color: #8a8a8a; margin-top: .3rem; }
.mt-4 > .btn, .mt-4 > button, .mt-4 > a.btn { margin-right: .5rem; }
.form-switch .form-check-input:checked { background-color: #111; border-color: #111; }
.alert { margin-bottom: 1rem; }

/* ---------- Mobile / tablet ---------- */
html, body { overflow-x: hidden; }
img, svg { max-width: 100%; }
@media (max-width: 991.98px) {
  .navbar-vertical.navbar-expand-lg { position: sticky; top: 0; z-index: 1030; }
  .navbar-vertical .navbar-brand { font-size: 1rem; }
  .navbar-vertical .navbar-collapse { max-height: calc(100vh - 60px); overflow-y: auto; padding-bottom: 1rem; }
  .navbar-vertical .nav-link:hover { transform: none; }
  .page-wrapper > .navbar { padding: .4rem 0; }
}
@media (max-width: 767.98px) {
  .container-xl { padding-left: 14px; padding-right: 14px; }
  .page-header { margin: 1rem 0 .75rem; }
  .page-title h2 { font-size: 1.2rem; }
  .page-title > .d-flex { flex-direction: row; }
  .page-pretitle { font-size: .65rem; }
  .card-body, .card-header, .card-footer { padding: 1rem; }
  .card:hover { transform: none; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
  .card-actions { margin-left: auto; }
  .btn { padding-top: .55rem; padding-bottom: .55rem; }
  .form-control, .form-select { font-size: 16px; min-height: 44px; }
  .form-footer .btn, .card-footer .btn { width: 100%; }
  .mt-4 > .btn, .mt-4 > button, .mt-4 > a.btn { width: 100%; margin: 0 0 .5rem; }
  .table th, .table td { padding: .65rem .75rem; font-size: .85rem; }
  .table-responsive { -webkit-overflow-scrolling: touch; }
  .table td:last-child { text-align: left; }
  .card-sm .h2 { font-size: 1.35rem; }
  .card-sm .avatar { width: 2.5rem; height: 2.5rem; }
  .footer { padding: 1rem 0; font-size: .8rem; }
  .dropdown-menu { max-width: calc(100vw - 28px); }
}
@media (max-width: 575.98px) {
  .page-title > .d-flex .btn { width: 100%; }
  .row-cards > [class*="col-sm"] { width: 50%; }
  .card-sm .card-body { padding: .85rem; }
  .card-sm .row { flex-wrap: nowrap; gap: .5rem; }
}

/* ---------- Renewal urgency colours ---------- */
:root { --c-green:#2fb344; --c-yellow:#f5b400; --c-orange:#f76707; --c-red:#e03131; --c-dark-red:#7a0f1a; }
.badge.bg-green, .badge.bg-yellow, .badge.bg-orange, .badge.bg-red, .badge.bg-dark-red { color:#fff !important; }
.badge.bg-green { background:var(--c-green) !important; }
.badge.bg-yellow { background:var(--c-yellow) !important; color:#1a1a1a !important; }
.badge.bg-orange { background:var(--c-orange) !important; }
.badge.bg-red { background:var(--c-red) !important; }
.badge.bg-dark-red { background:var(--c-dark-red) !important; }
.table tr[class*="row-"] > td:first-child { box-shadow: inset 4px 0 0 transparent; }
.table tr.row-green > td:first-child { box-shadow: inset 4px 0 0 var(--c-green); }
.table tr.row-yellow { background: rgba(245,180,0,.10); } .table tr.row-yellow > td:first-child { box-shadow: inset 4px 0 0 var(--c-yellow); }
.table tr.row-orange { background: rgba(247,103,7,.11); } .table tr.row-orange > td:first-child { box-shadow: inset 4px 0 0 var(--c-orange); }
.table tr.row-red { background: rgba(224,49,49,.11); } .table tr.row-red > td:first-child { box-shadow: inset 4px 0 0 var(--c-red); }
.table tr.row-dark-red { background: rgba(122,15,26,.14); } .table tr.row-dark-red > td:first-child { box-shadow: inset 4px 0 0 var(--c-dark-red); }
.card-sm .avatar[class*="tier-"] { color:#fff !important; }
.card-sm .avatar.tier-dark { background:#111 !important; }
.card-sm .avatar.tier-green { background:var(--c-green) !important; }
.card-sm .avatar.tier-yellow { background:var(--c-yellow) !important; color:#1a1a1a !important; }
.card-sm .avatar.tier-orange { background:var(--c-orange) !important; }
.card-sm .avatar.tier-red { background:var(--c-red) !important; }
.card-sm .avatar.tier-dark-red { background:var(--c-dark-red) !important; }
.legend-dot { display:inline-block; width:.7rem; height:.7rem; border-radius:50%; margin-right:.35rem; }
.filter-bar .form-label { font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:#8a8a8a; margin-bottom:.25rem; }

/* ---------- Brand logo ---------- */
.brand-mark { width: 34px; height: 34px; border-radius: .4rem; margin-right: .6rem; box-shadow: 0 0 0 1px #3a3a3a; vertical-align: middle; }
.navbar-vertical .navbar-brand a { display: inline-flex; align-items: center; }
.auth-logo { height: 110px; width: auto; border-radius: .5rem; }
@media (max-width: 575.98px) { .auth-logo { height: 90px; } }

/* ---------- Dashboard charts & trends ---------- */
.chart-box { position: relative; height: 290px; }
.chart-box.chart-short { height: 230px; }
.trend-pill { display: inline-flex; align-items: center; gap: .35rem; padding: .45rem .8rem; border-radius: 999px; font-weight: 650; font-size: .9rem; }
.trend-pill.up { background: rgba(47,179,68,.12); color: #207a30; }
.trend-pill.down { background: rgba(224,49,49,.12); color: #b02525; }
.trend-pill.flat { background: #eee; color: #666; }
.trend-pill i { font-size: 1.15rem; }
@media (max-width: 767.98px) { .chart-box { height: 240px; } .chart-box.chart-short { height: 200px; } }
.navbar-vertical .navbar-brand { padding: .9rem 1rem; }
.navbar-vertical .navbar-brand-text { font-size: .98rem; white-space: nowrap; }
.brand-mark { width: 30px; height: 30px; margin-right: .5rem; }

/* Sidebar brand: logo on top, name below */
.navbar-vertical .navbar-brand { width: 100%; text-align: center; padding: 1.4rem 1rem 1rem; }
.navbar-vertical .navbar-brand a.brand-stack { display: flex; flex-direction: column; align-items: center; gap: .6rem; }
.navbar-vertical .brand-stack .brand-mark { width: 64px; height: 64px; margin: 0; border-radius: .6rem; }
.navbar-vertical .brand-stack .navbar-brand-text { font-size: 1rem; letter-spacing: .02em; }
@media (max-width: 991.98px) {
  .navbar-vertical .navbar-brand { width: auto; padding: .5rem 0; }
  .navbar-vertical .navbar-brand a.brand-stack { flex-direction: row; gap: .6rem; }
  .navbar-vertical .brand-stack .brand-mark { width: 34px; height: 34px; border-radius: .4rem; }
}

/* ---------- Renewed/cancelled, bell, saved filters, bulk bar ---------- */
.badge.bg-gray { background:#868e96 !important; color:#fff !important; }
.table tr.row-gray { background: rgba(134,142,150,.08); } .table tr.row-gray > td:first-child { box-shadow: inset 4px 0 0 #868e96; }
.bell-badge { position:absolute; top:2px; right:-2px; min-width:18px; height:18px; padding:0 5px; border-radius:9px; background:#e03131; color:#fff; font-size:.68rem; font-weight:700; line-height:18px; text-align:center; }
.notif-menu { width: 360px; max-width: calc(100vw - 24px); max-height: 70vh; overflow-y: auto; }
.notif-item { display:flex; gap:.75rem; align-items:flex-start; padding:.75rem 1rem; border-bottom:1px solid var(--tblr-border-color); color:inherit; text-decoration:none; transition: background .2s; }
.notif-item:hover { background:#f3f3f3; color:inherit; }
.notif-item.unread { background:#fafafa; } .notif-item.unread .fw-semibold { color:#000; }
.notif-dot { width:10px; height:10px; border-radius:50%; margin-top:.4rem; flex-shrink:0; background:#adb5bd; }
.notif-dot.lvl-success { background:#2fb344; } .notif-dot.lvl-warning { background:#f5b400; } .notif-dot.lvl-danger { background:#e03131; } .notif-dot.lvl-info { background:#4263eb; }
.notif-item:not(.unread) .notif-dot { opacity:.35; }
.saved-chip { display:inline-flex; align-items:center; border:1px solid #d9d9d9; border-radius:999px; padding:.15rem .25rem .15rem .75rem; font-size:.82rem; background:#fff; transition: border-color .2s, box-shadow .2s; }
.saved-chip:hover { border-color:#111; box-shadow:0 2px 8px rgba(0,0,0,.08); }
.saved-chip a { color:#111; text-decoration:none; font-weight:550; }
.saved-chip button { border:0; background:transparent; color:#888; font-size:1.1rem; line-height:1; padding:0 .45rem; cursor:pointer; } .saved-chip button:hover { color:#e03131; }
.bulk-bar { display:flex; flex-wrap:wrap; align-items:center; gap:.6rem; padding:.7rem 1.25rem; background:#111; color:#fff; animation: dropIn .25s var(--ease); }
.bulk-bar .form-select { background-color:#fff; }
.bulk-bar.d-none { display:none !important; }
@media (max-width: 767.98px) { .bulk-bar { padding:.7rem 1rem; } .bulk-bar .form-select, .bulk-bar .btn { max-width:none !important; flex:1 1 100%; } }