/* Birdie CRM look: ported from the Birdie Connect design system (violet, flat, hairline cards, pill buttons) */
@font-face{font-family:"Poppins";font-weight:300;font-display:swap;src:url(fonts/poppins-300.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-weight:400;font-display:swap;src:url(fonts/poppins-400.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-weight:500;font-display:swap;src:url(fonts/poppins-500.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-weight:600;font-display:swap;src:url(fonts/poppins-600.woff2) format("woff2")}
:root{
  --b-primary:#6d5df5;--b-deep:#5238e0;--b-press:#3f2bb8;--b-tint:#efecff;--b-dark:#1b1840;
  --b-ink:#14163a;--b-ink2:#3d4062;--b-mute:#6b6f8e;--b-bg:#f7f7fc;--b-surface:#f6f6fb;
  --b-line:#e7e7f1;--b-line-in:#d3d4e6;
  --b-ok:#178a58;--b-ok-soft:#e6f6ee;--b-warn:#9a6400;--b-warn-soft:#fff3db;--b-danger:#cf3b3b;--b-danger-soft:#fdecec;--b-info:#2764d8;--b-info-soft:#e8f0fe;
  --b-shadow:0 1px 3px rgb(27 24 64/6%);--b-shadow-lg:0 10px 30px rgb(27 24 64/8%),0 2px 6px rgb(27 24 64/4%);
  --b-ring:0 0 0 3px rgb(109 93 245/22%);
  --birdie-font:"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,"Noto Sans",Arial,sans-serif;
}
html,body{font-family:var(--birdie-font)!important;color:var(--b-ink);-webkit-font-smoothing:antialiased}
body,body.app,#wrapper{background:var(--b-bg)!important}
body.app #wrapper{background:
  radial-gradient(38% 260px at 6% 0,rgb(201 193 255/65%),transparent 70%),
  radial-gradient(28% 220px at 36% 0,rgb(246 169 214/36%),transparent 70%),
  radial-gradient(34% 260px at 66% 0,rgb(255 210 174/42%),transparent 70%),
  radial-gradient(36% 260px at 100% 10%,rgb(185 215 255/55%),transparent 70%),var(--b-bg)!important;background-repeat:no-repeat!important}
a{color:var(--b-deep)}a:hover,a:focus{color:var(--b-press)}
h1,h2,h3,h4,h5,h6{color:var(--b-ink);font-weight:600;letter-spacing:-.01em}
table,.table,.dataTables_wrapper{font-variant-numeric:tabular-nums}

/* top bar */
#header{background:rgb(255 255 255/86%)!important;backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--b-line)!important;box-shadow:none!important;height:64px!important}
#header .navbar-nav>li>a,#header a{color:var(--b-ink2)}
#header .icon-badge,#header .badge{border-radius:999px}
#search_input,#search_input .form-control,#header .form-control{border-radius:999px!important;background:var(--b-surface)!important;border:1px solid var(--b-line)!important;box-shadow:none!important}

/* sidebar */
#menu.sidebar,aside#menu{background:#fff!important;border-inline-end:1px solid var(--b-line)!important;box-shadow:none!important;width:248px}
#menu .sidebar-user-profile,#menu .tw-flex{border-color:var(--b-line)}
#side-menu{padding:8px 12px!important}
#side-menu>li{margin:2px 0!important;position:relative}
#side-menu>li>a{display:flex!important;align-items:center;gap:12px;padding:10px 12px!important;border-radius:10px!important;color:var(--b-ink2)!important;font-size:14px;font-weight:500;background:transparent!important;transition:background .15s,color .15s,transform .1s}
#side-menu>li>a:hover{background:var(--b-surface)!important;color:var(--b-ink)!important}
#side-menu>li>a:active{transform:translateY(1px) scale(.985)}
#side-menu>li.active>a,#side-menu>li.active:hover>a{background:var(--b-tint)!important;color:var(--b-deep)!important;font-weight:600}
#side-menu>li.active::before{content:"";position:absolute;inset-inline-start:-12px;top:9px;bottom:9px;width:3px;border-radius:3px;background:var(--b-primary)}
#side-menu>li>a>i.menu-icon{display:inline-block!important;flex:none;width:34px;height:34px;margin:0!important;border-radius:10px;font-size:0!important;line-height:0;
  background:var(--b-tint);color:var(--b-deep);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
/* the icon is a mask over a tinted chip: draw the glyph and the chip with two layers */
#side-menu>li>a>i.menu-icon{background:linear-gradient(var(--b-ink2),var(--b-ink2));-webkit-mask-size:20px;mask-size:20px;-webkit-mask-position:center;mask-position:center;width:22px;height:22px;border-radius:0}
#side-menu>li.active>a>i.menu-icon{background:linear-gradient(var(--b-deep),var(--b-deep))}
#side-menu>li>a>i.menu-icon::before{content:none!important}
#side-menu .sub-menu-item-badge,#side-menu .badge{border-radius:999px}
#side-menu ul.nav-second-level{padding:4px 0 4px 0!important;background:transparent!important}
#side-menu ul.nav-second-level li a{border-radius:8px;padding:8px 12px 8px 12px!important;color:var(--b-mute)!important;font-size:13px}
#side-menu ul.nav-second-level li.active a,#side-menu ul.nav-second-level li a:hover{color:var(--b-deep)!important;background:var(--b-tint)!important}

/* cards */
.panel_s,.panel-default,.widget .panel_s{background:#fff!important;border:1px solid var(--b-line)!important;border-radius:16px!important;box-shadow:var(--b-shadow)!important}
.panel_s>.panel-body{border-radius:16px}
.panel-heading{background:transparent!important;border-bottom:1px solid var(--b-line)!important}
.content{padding-top:28px}
.dropdown-menu,.popover,.bootstrap-select .dropdown-menu{border:1px solid var(--b-line)!important;border-radius:12px!important;box-shadow:var(--b-shadow-lg)!important;padding:6px!important}
.dropdown-menu>li>a{border-radius:8px;color:var(--b-ink2)}
.dropdown-menu>li>a:hover{background:var(--b-surface)!important;color:var(--b-ink)!important}
.modal-content{border:0!important;border-radius:22px!important;box-shadow:var(--b-shadow-lg)!important}
.modal-header{border-bottom:1px solid var(--b-line)!important}.modal-footer{border-top:1px solid var(--b-line)!important}

/* buttons: pills */
.btn{border-radius:999px!important;font-weight:500;box-shadow:none!important;transition:background .15s,border-color .15s,color .15s,transform .1s}
.btn:active{transform:translateY(1px) scale(.985)}
.btn:focus,.btn:focus-visible{box-shadow:var(--b-ring)!important;outline:0}
.btn-primary,.btn-info{background:var(--b-primary)!important;border-color:var(--b-primary)!important;color:#fff!important}
.btn-primary:hover,.btn-info:hover{background:var(--b-deep)!important;border-color:var(--b-deep)!important}
.btn-primary:active,.btn-info:active{background:var(--b-press)!important}
.btn-default,.btn-secondary{background:#fff!important;border:1px solid var(--b-line-in)!important;color:var(--b-ink2)!important}
.btn-default:hover,.btn-secondary:hover{background:var(--b-surface)!important;color:var(--b-ink)!important}
.btn-success{background:var(--b-ok)!important;border-color:var(--b-ok)!important}
.btn-danger{background:var(--b-danger)!important;border-color:var(--b-danger)!important}
.btn-warning{background:var(--b-warn-soft)!important;border-color:var(--b-warn-soft)!important;color:var(--b-warn)!important}
.btn-icon,.btn-sm.btn-icon{border-radius:999px!important}

/* inputs */
.form-control,.bootstrap-select>.dropdown-toggle,.select2-container--default .select2-selection--single,.select2-container--default .select2-selection--multiple{border:1px solid var(--b-line-in)!important;border-radius:8px!important;box-shadow:none!important;background-color:#fff;color:var(--b-ink);height:auto;min-height:38px}
.form-control:focus,.bootstrap-select.open>.dropdown-toggle,.select2-container--open .select2-selection{border-color:var(--b-primary)!important;box-shadow:var(--b-ring)!important}
label{font-weight:500;color:var(--b-ink2)}
.checkbox input[type=checkbox]:checked+label::before,.radio input[type=radio]:checked+label::before{background:var(--b-primary)!important;border-color:var(--b-primary)!important}

/* tables */
.table>thead>tr>th,table.dataTable thead th{background:var(--b-surface)!important;color:var(--b-mute)!important;font-size:12px;font-weight:600;letter-spacing:0;text-transform:none;border-bottom:1px solid var(--b-line)!important}
.table>tbody>tr>td,.table>thead>tr>th{border-color:var(--b-line)!important;padding:12px 10px!important}
.table-hover>tbody>tr:hover,table.dataTable tbody tr:hover{background:var(--b-bg)!important}
.table-striped>tbody>tr:nth-of-type(odd){background:transparent!important}
.dataTables_wrapper .pagination>.active>a,.pagination>.active>a,.pagination>.active>span{background:var(--b-primary)!important;border-color:var(--b-primary)!important;color:#fff!important}
.pagination>li>a{border-radius:8px!important;margin:0 2px;border:1px solid var(--b-line)!important;color:var(--b-ink2)}

/* tabs */
.nav-tabs{border-bottom:1px solid var(--b-line)!important}
.nav-tabs>li>a{border:0!important;border-radius:999px!important;color:var(--b-mute)!important;font-weight:500;margin:0 2px 6px;padding:7px 14px}
.nav-tabs>li>a:hover{background:var(--b-surface)!important;color:var(--b-ink)!important}
.nav-tabs>li.active>a,.nav-tabs>li.active>a:hover,.nav-tabs>li.active>a:focus{background:var(--b-tint)!important;color:var(--b-deep)!important}

/* status pills (labels / badges) */
.label,.badge,.label-default{border-radius:999px!important;font-weight:500;padding:4px 10px!important}
.label-success{background:var(--b-ok-soft)!important;color:var(--b-ok)!important}
.label-warning{background:var(--b-warn-soft)!important;color:var(--b-warn)!important}
.label-danger{background:var(--b-danger-soft)!important;color:var(--b-danger)!important}
.label-info{background:var(--b-info-soft)!important;color:var(--b-info)!important}
.alert{border-radius:12px!important;border:0!important}
.alert-info{background:var(--b-info-soft)!important;color:var(--b-info)!important}
.alert-success{background:var(--b-ok-soft)!important;color:var(--b-ok)!important}
.alert-warning{background:var(--b-warn-soft)!important;color:var(--b-warn)!important}
.alert-danger{background:var(--b-danger-soft)!important;color:var(--b-danger)!important}
.progress{border-radius:999px;background:var(--b-line);box-shadow:none}.progress-bar{background:var(--b-primary)}
.staff-profile-image-small,.img-circle,.staff-profile-image-thumb{border-radius:11px!important}

/* kanban board (tasks) */
.kan-ban-content-wrapper .kan-ban-col,.kan-ban-col{border-radius:16px!important}
.kan-ban-col .panel-heading{border-radius:14px 14px 0 0!important}
.kan-ban-content-wrapper .task{border-radius:12px!important;box-shadow:var(--b-shadow)!important;border:1px solid var(--b-line)!important}

/* dashboard board-stat tiles (Birdie flow) */
#widget-board_stats .panel_s{border-radius:16px!important}

/* login */
body.authentication{background:var(--b-bg)!important}
body.authentication .company-logo,.authentication-form-wrapper{background:transparent}
.authentication-form,.authentication .panel_s{border-radius:22px!important;box-shadow:var(--b-shadow-lg)!important;padding:8px!important}

/* scrollbars */
*{scrollbar-color:var(--b-line-in) transparent}

/* phones */
@media (max-width:720px){
  .content{padding:16px!important}
  .btn,.form-control{min-height:40px}
  #side-menu>li>a{min-height:44px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* task menu "..." : Perfex draws it with three outline circles; make them three small solid dots */
.task-single-menu .trigger{display:inline-flex;align-items:center;gap:3px;padding:8px 10px;border-radius:999px}
.task-single-menu .trigger:hover{background:var(--b-surface)}
.task-single-menu .trigger i{width:4px;height:4px;border-radius:50%;background:var(--b-mute);font-size:0!important;line-height:0;margin:0!important;display:inline-block}
.task-single-menu .trigger i::before{content:none!important}
