/* ==========================================================================
   DIGIBOT DESIGN SYSTEM

   Version      : 1.0
   Theme        : Professional Dark
   Framework    : Bootstrap 5 Compatible
   Architecture : Component Based
   Responsive   : 576 / 768 / 992 / 1200 / 1400 / 1600
   Status       : FROZEN

   Copyright © DigiDost India

========================================================================== */

/* ==========================================================================
   DigiBot v1.0
   Global Design System

   Author  : DigiDost India
   Product : DigiBot

   Theme   : Professional Dark
   Version : 1.0
========================================================================== */


/* ==========================================================================
   IMPORTS
========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');


/* ==========================================================================
   ROOT VARIABLES
========================================================================== */

:root{

    /*----------------------------------------------------------
      Brand
    ----------------------------------------------------------*/

    --digibot-primary:#3B82F6;
    --digibot-primary-hover:#2563EB;

    --digibot-secondary:#F59E0B;

    --digibot-success:#22C55E;
    --digibot-danger:#EF4444;
    --digibot-warning:#F59E0B;
    --digibot-info:#06B6D4;


    /*----------------------------------------------------------
      Backgrounds
    ----------------------------------------------------------*/

    --digibot-body:#0F172A;

    --digibot-surface:#1E293B;

    --digibot-surface-light:#334155;

    --digibot-sidebar:#111827;

    --digibot-navbar:#111827;


    /*----------------------------------------------------------
      Text
    ----------------------------------------------------------*/

    --digibot-text:#F8FAFC;

    --digibot-text-light:#CBD5E1;

    --digibot-text-muted:#94A3B8;


    /*----------------------------------------------------------
      Borders
    ----------------------------------------------------------*/

    --digibot-border:#334155;

    --digibot-border-light:#475569;


    /*----------------------------------------------------------
      Radius
    ----------------------------------------------------------*/

    --digibot-radius-xs:4px;

    --digibot-radius-sm:8px;

    --digibot-radius:12px;

    --digibot-radius-lg:18px;

    --digibot-radius-xl:24px;


    /*----------------------------------------------------------
      Shadows
    ----------------------------------------------------------*/

    --digibot-shadow-sm:
        0 2px 10px rgba(0,0,0,.15);

    --digibot-shadow:
        0 8px 25px rgba(0,0,0,.28);

    --digibot-shadow-lg:
        0 15px 45px rgba(0,0,0,.45);


    /*----------------------------------------------------------
      Widths
    ----------------------------------------------------------*/

    --digibot-sidebar-width:280px;

    --digibot-sidebar-collapse:80px;

    --digibot-navbar-height:70px;


    /*----------------------------------------------------------
      Z Index
    ----------------------------------------------------------*/

    --digibot-z-sidebar:1000;

    --digibot-z-navbar:1010;

    --digibot-z-dropdown:1020;

    --digibot-z-modal:1030;

    --digibot-z-toast:1040;

    --digibot-z-loader:1100;


    /*----------------------------------------------------------
      Spacing
    ----------------------------------------------------------*/

    --digibot-space-0:0;

    --digibot-space-1:4px;

    --digibot-space-2:8px;

    --digibot-space-3:12px;

    --digibot-space-4:16px;

    --digibot-space-5:20px;

    --digibot-space-6:24px;

    --digibot-space-7:32px;

    --digibot-space-8:40px;

    --digibot-space-9:48px;

    --digibot-space-10:64px;


    /*----------------------------------------------------------
      Typography
    ----------------------------------------------------------*/

    --digibot-font-xs:.75rem;

    --digibot-font-sm:.875rem;

    --digibot-font-md:1rem;

    --digibot-font-lg:1.125rem;

    --digibot-font-xl:1.35rem;

    --digibot-font-2xl:1.75rem;

    --digibot-font-3xl:2.4rem;

    --digibot-font-4xl:3rem;


    /*----------------------------------------------------------
      Font Weight
    ----------------------------------------------------------*/

    --digibot-fw-light:300;

    --digibot-fw-normal:400;

    --digibot-fw-medium:500;

    --digibot-fw-semibold:600;

    --digibot-fw-bold:700;

    --digibot-fw-black:800;


    /*----------------------------------------------------------
      Animation
    ----------------------------------------------------------*/

    --digibot-fast:.15s;

    --digibot-normal:.30s;

    --digibot-slow:.45s;

    --digibot-transition:
        all .30s ease;

}



/* ==========================================================================
   RESET
========================================================================== */

*,
*::before,
*::after{

    margin:0;

    padding:0;

    box-sizing:border-box;

}



/* ==========================================================================
   HTML
========================================================================== */

html{

    font-size:16px;

    scroll-behavior:smooth;

}



/* ==========================================================================
   BODY
========================================================================== */

body{

    font-family:'Inter',sans-serif;

    font-size:var(--digibot-font-md);

    font-weight:var(--digibot-fw-normal);

    line-height:1.6;

    color:var(--digibot-text);

    background:var(--digibot-body);

    overflow-x:hidden;

    text-rendering:optimizeLegibility;

    -webkit-font-smoothing:antialiased;

}



/* ==========================================================================
   IMAGES
========================================================================== */

img{

    max-width:100%;

    height:auto;

    display:block;

}



/* ==========================================================================
   LINKS
========================================================================== */

a{

    color:var(--digibot-primary);

    text-decoration:none;

    transition:var(--digibot-transition);

}

a:hover{

    color:var(--digibot-primary-hover);

}



/* ==========================================================================
   TYPOGRAPHY
========================================================================== */

h1{

    font-size:var(--digibot-font-4xl);

    font-weight:var(--digibot-fw-black);

}

h2{

    font-size:var(--digibot-font-3xl);

    font-weight:var(--digibot-fw-bold);

}

h3{

    font-size:var(--digibot-font-2xl);

    font-weight:var(--digibot-fw-bold);

}

h4{

    font-size:var(--digibot-font-xl);

    font-weight:var(--digibot-fw-semibold);

}

h5{

    font-size:var(--digibot-font-lg);

    font-weight:var(--digibot-fw-semibold);

}

h6{

    font-size:var(--digibot-font-md);

    font-weight:var(--digibot-fw-semibold);

}

h1,
h2,
h3,
h4,
h5,
h6{

    color:var(--digibot-text);

    line-height:1.3;

    margin-bottom:var(--digibot-space-4);

}

p{

    color:var(--digibot-text-light);

    margin-bottom:var(--digibot-space-4);

}



/* ==========================================================================
   LISTS
========================================================================== */

ul,
ol{

    padding-left:22px;

}

li{

    margin-bottom:6px;

}



/* ==========================================================================
   SELECTION
========================================================================== */

::selection{

    background:var(--digibot-primary);

    color:#ffffff;

}



/* ==========================================================================
   SCROLLBAR
========================================================================== */

::-webkit-scrollbar{

    width:10px;

    height:10px;

}

::-webkit-scrollbar-track{

    background:var(--digibot-surface);

}

::-webkit-scrollbar-thumb{

    background:var(--digibot-border-light);

    border-radius:20px;

}

::-webkit-scrollbar-thumb:hover{

    background:var(--digibot-primary);

}



/* ==========================================================================
   HORIZONTAL RULE
========================================================================== */

hr{

    border:none;

    border-top:1px solid var(--digibot-border);

    margin:var(--digibot-space-6) 0;

}



/* ==========================================================================
   FOCUS
========================================================================== */

:focus-visible{

    outline:3px solid rgba(59,130,246,.45);

    outline-offset:2px;

}



/* ==========================================================================
   END OF PART 1
========================================================================== */

/* ==========================================================================
   CONTAINER SYSTEM
========================================================================== */

.digibot-container{

    width:100%;

    max-width:1400px;

    margin:auto;

    padding:0 var(--digibot-space-6);

}

.digibot-container-fluid{

    width:100%;

    padding:0 var(--digibot-space-6);

}

.digibot-container-sm{

    max-width:720px;

    margin:auto;

    padding:0 var(--digibot-space-5);

}

.digibot-container-md{

    max-width:960px;

    margin:auto;

    padding:0 var(--digibot-space-5);

}

.digibot-container-lg{

    max-width:1200px;

    margin:auto;

    padding:0 var(--digibot-space-6);

}

.digibot-container-xl{

    max-width:1600px;

    margin:auto;

    padding:0 var(--digibot-space-6);

}



/* ==========================================================================
   APPLICATION LAYOUT
========================================================================== */

.digibot-wrapper{

    display:flex;

    width:100%;

    min-height:100vh;

    background:var(--digibot-body);

}

.digibot-main{

    flex:1;

    display:flex;

    flex-direction:column;

    min-height:100vh;

    overflow:hidden;

}

.digibot-content{

    flex:1;

    padding:var(--digibot-space-7);

    overflow-x:hidden;

}

.digibot-page{

    width:100%;

}

.digibot-section{

    margin-bottom:var(--digibot-space-8);

}



/* ==========================================================================
   PAGE HEADER
========================================================================== */

.digibot-page-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:20px;

    margin-bottom:30px;

    flex-wrap:wrap;

}

.digibot-page-title{

    margin:0;

}

.digibot-page-description{

    margin-top:6px;

    color:var(--digibot-text-muted);

}

.digibot-page-actions{

    display:flex;

    gap:12px;

    flex-wrap:wrap;

}



/* ==========================================================================
   GRID SYSTEM
========================================================================== */

.digibot-grid{

    display:grid;

    gap:24px;

}

.digibot-grid-auto{

    display:grid;

    grid-template-columns:
        repeat(auto-fit,minmax(320px,1fr));

    gap:24px;

}

.digibot-grid-2{

    display:grid;

    grid-template-columns:
        repeat(2,1fr);

    gap:24px;

}

.digibot-grid-3{

    display:grid;

    grid-template-columns:
        repeat(3,1fr);

    gap:24px;

}

.digibot-grid-4{

    display:grid;

    grid-template-columns:
        repeat(4,1fr);

    gap:24px;

}

.digibot-grid-5{

    display:grid;

    grid-template-columns:
        repeat(5,1fr);

    gap:24px;

}

.digibot-grid-sidebar{

    display:grid;

    grid-template-columns:
        320px 1fr;

    gap:30px;

}



/* ==========================================================================
   FLEX
========================================================================== */

.digibot-flex{

    display:flex;

}

.digibot-inline-flex{

    display:inline-flex;

}

.digibot-flex-column{

    flex-direction:column;

}

.digibot-flex-row{

    flex-direction:row;

}

.digibot-flex-wrap{

    flex-wrap:wrap;

}

.digibot-align-start{

    align-items:flex-start;

}

.digibot-align-center{

    align-items:center;

}

.digibot-align-end{

    align-items:flex-end;

}

.digibot-justify-start{

    justify-content:flex-start;

}

.digibot-justify-center{

    justify-content:center;

}

.digibot-justify-between{

    justify-content:space-between;

}

.digibot-justify-around{

    justify-content:space-around;

}

.digibot-justify-end{

    justify-content:flex-end;

}

.digibot-flex-1{

    flex:1;

}



/* ==========================================================================
   GAP UTILITIES
========================================================================== */

.digibot-gap-1{gap:4px;}
.digibot-gap-2{gap:8px;}
.digibot-gap-3{gap:12px;}
.digibot-gap-4{gap:16px;}
.digibot-gap-5{gap:20px;}
.digibot-gap-6{gap:24px;}
.digibot-gap-7{gap:30px;}
.digibot-gap-8{gap:40px;}



/* ==========================================================================
   WIDTH
========================================================================== */

.digibot-w-25{

    width:25%;

}

.digibot-w-50{

    width:50%;

}

.digibot-w-75{

    width:75%;

}

.digibot-w-100{

    width:100%;

}

.digibot-h-100{

    height:100%;

}



/* ==========================================================================
   RESPONSIVE BREAKPOINTS
========================================================================== */

/* XXL */

@media(max-width:1600px){

    .digibot-container{

        max-width:1400px;

    }

}

/* XL */

@media(max-width:1400px){

    .digibot-grid-5{

        grid-template-columns:
            repeat(4,1fr);

    }

}

/* LG */

@media(max-width:1200px){

    .digibot-content{

        padding:24px;

    }

    .digibot-grid-4{

        grid-template-columns:
            repeat(2,1fr);

    }

    .digibot-grid-5{

        grid-template-columns:
            repeat(3,1fr);

    }

}

/* MD */

@media(max-width:992px){

    .digibot-grid-3,

    .digibot-grid-4,

    .digibot-grid-5{

        grid-template-columns:
            repeat(2,1fr);

    }

    .digibot-grid-sidebar{

        grid-template-columns:1fr;

    }

}

/* SM */

@media(max-width:768px){

    .digibot-content{

        padding:20px;

    }

    .digibot-grid-2,

    .digibot-grid-3,

    .digibot-grid-4,

    .digibot-grid-5{

        grid-template-columns:1fr;

    }

    .digibot-page-header{

        flex-direction:column;

        align-items:flex-start;

    }

}

/* XS */

@media(max-width:576px){

    .digibot-container,

    .digibot-container-fluid,

    .digibot-container-lg,

    .digibot-container-xl{

        padding:0 15px;

    }

    .digibot-content{

        padding:15px;

    }

}

/* ==========================================================================
   SIDEBAR
========================================================================== */

.digibot-sidebar{

    position:fixed;

    top:0;

    left:0;

    width:var(--digibot-sidebar-width);

    height:100vh;

    background:var(--digibot-sidebar);

    border-right:1px solid var(--digibot-border);

    display:flex;

    flex-direction:column;

    transition:all .30s ease;

    z-index:var(--digibot-z-sidebar);

    overflow:hidden;

}

.digibot-sidebar.collapsed{

    width:var(--digibot-sidebar-collapse);

}

.digibot-sidebar.collapsed .digibot-sidebar-text,

.digibot-sidebar.collapsed .digibot-sidebar-title,

.digibot-sidebar.collapsed .digibot-sidebar-version,

.digibot-sidebar.collapsed .digibot-user-details{

    display:none;

}

.digibot-sidebar.collapsed .digibot-sidebar-logo{

    width:45px;

}



/* ==========================================================================
   SIDEBAR HEADER
========================================================================== */

.digibot-sidebar-header{

    height:80px;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:20px;

    border-bottom:1px solid var(--digibot-border);

}

.digibot-sidebar-brand{

    display:flex;

    align-items:center;

    gap:15px;

    width:100%;

}

.digibot-sidebar-logo{

    width:54px;

    height:54px;

    border-radius:12px;

    object-fit:cover;

    flex-shrink:0;

}

.digibot-sidebar-title{

    font-size:1.15rem;

    font-weight:700;

    color:var(--digibot-text);

    line-height:1.2;

}

.digibot-sidebar-version{

    font-size:.75rem;

    color:var(--digibot-text-muted);

}



/* ==========================================================================
   USER PANEL
========================================================================== */

.digibot-user-panel{

    display:flex;

    align-items:center;

    gap:14px;

    padding:20px;

    border-bottom:1px solid var(--digibot-border);

}

.digibot-user-avatar{

    width:52px;

    height:52px;

    border-radius:50%;

    object-fit:cover;

    border:2px solid var(--digibot-primary);

}

.digibot-user-details{

    overflow:hidden;

}

.digibot-user-name{

    font-weight:600;

    white-space:nowrap;

    overflow:hidden;

    text-overflow:ellipsis;

}

.digibot-user-role{

    font-size:.82rem;

    color:var(--digibot-text-muted);

}



/* ==========================================================================
   SIDEBAR MENU
========================================================================== */

.digibot-sidebar-body{

    flex:1;

    overflow-y:auto;

    overflow-x:hidden;

    padding:20px 0;

}

.digibot-sidebar-menu{

    list-style:none;

    margin:0;

    padding:0;

}

.digibot-sidebar-menu li{

    margin:4px 12px;

}

.digibot-sidebar-menu a{

    display:flex;

    align-items:center;

    gap:15px;

    height:48px;

    padding:0 18px;

    border-radius:12px;

    color:var(--digibot-text-light);

    transition:var(--digibot-transition);

}

.digibot-sidebar-menu a:hover{

    background:rgba(59,130,246,.12);

    color:#ffffff;

}

.digibot-sidebar-menu li.active>a{

    background:var(--digibot-primary);

    color:#ffffff;

}

.digibot-sidebar-icon{

    width:22px;

    text-align:center;

    font-size:17px;

    flex-shrink:0;

}

.digibot-sidebar-text{

    flex:1;

    white-space:nowrap;

}



/* ==========================================================================
   SUB MENU
========================================================================== */

.digibot-submenu{

    list-style:none;

    margin:6px 0 6px 18px;

    padding-left:18px;

    border-left:1px solid var(--digibot-border);

    display:none;

}

.digibot-sidebar-menu li.open>.digibot-submenu{

    display:block;

}

.digibot-submenu li{

    margin:4px 0;

}

.digibot-submenu a{

    height:40px;

    font-size:.90rem;

}



/* ==========================================================================
   MENU BADGE
========================================================================== */

.digibot-menu-badge{

    margin-left:auto;

    min-width:24px;

    height:24px;

    padding:0 8px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50px;

    background:var(--digibot-danger);

    color:#ffffff;

    font-size:.75rem;

    font-weight:600;

}



/* ==========================================================================
   MENU ARROW
========================================================================== */

.digibot-menu-arrow{

    margin-left:auto;

    transition:.25s;

}

.digibot-sidebar-menu li.open>.digibot-menu-arrow{

    transform:rotate(90deg);

}



/* ==========================================================================
   SIDEBAR FOOTER
========================================================================== */

.digibot-sidebar-footer{

    padding:18px;

    border-top:1px solid var(--digibot-border);

    text-align:center;

    font-size:.82rem;

    color:var(--digibot-text-muted);

}



/* ==========================================================================
   MOBILE TOGGLE
========================================================================== */

.digibot-sidebar-toggle{

    display:none;

    width:44px;

    height:44px;

    border:none;

    background:none;

    color:var(--digibot-text);

    font-size:1.3rem;

    cursor:pointer;

}



/* ==========================================================================
   MOBILE OVERLAY
========================================================================== */

.digibot-overlay{

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.55);

    opacity:0;

    visibility:hidden;

    transition:.30s;

    z-index:999;

}

.digibot-overlay.active{

    opacity:1;

    visibility:visible;

}



/* ==========================================================================
   CONTENT OFFSET
========================================================================== */

.digibot-main{

    margin-left:var(--digibot-sidebar-width);

    transition:.30s;

}

.digibot-main.expanded{

    margin-left:var(--digibot-sidebar-collapse);

}



/* ==========================================================================
   TABLET
========================================================================== */

@media(max-width:992px){

    .digibot-sidebar{

        width:80px;

    }

    .digibot-main{

        margin-left:80px;

    }

}



/* ==========================================================================
   MOBILE
========================================================================== */

@media(max-width:768px){

    .digibot-sidebar{

        transform:translateX(-100%);

        width:280px;

    }

    .digibot-sidebar.show{

        transform:translateX(0);

    }

    .digibot-main{

        margin-left:0;

    }

    .digibot-sidebar-toggle{

        display:flex;

        align-items:center;

        justify-content:center;

    }

}

/* ==========================================================================
   TOP NAVBAR
========================================================================== */

.digibot-navbar{

    position:sticky;

    top:0;

    left:0;

    right:0;

    z-index:var(--digibot-z-navbar);

    height:var(--digibot-navbar-height);

    background:var(--digibot-navbar);

    border-bottom:1px solid var(--digibot-border);

    display:flex;

    align-items:center;

    justify-content:space-between;

    padding:0 24px;

    backdrop-filter:blur(14px);

}



/* ==========================================================================
   NAVBAR LEFT
========================================================================== */

.digibot-navbar-left{

    display:flex;

    align-items:center;

    gap:18px;

}

.digibot-navbar-title{

    font-size:1.20rem;

    font-weight:700;

    color:var(--digibot-text);

}

.digibot-navbar-subtitle{

    color:var(--digibot-text-muted);

    font-size:.85rem;

}



/* ==========================================================================
   SEARCH
========================================================================== */

.digibot-navbar-search{

    position:relative;

    width:360px;

}

.digibot-navbar-search input{

    width:100%;

    height:44px;

    background:var(--digibot-surface);

    border:1px solid var(--digibot-border);

    border-radius:50px;

    color:var(--digibot-text);

    padding-left:48px;

    padding-right:18px;

    transition:var(--digibot-transition);

}

.digibot-navbar-search input::placeholder{

    color:var(--digibot-text-muted);

}

.digibot-navbar-search input:focus{

    outline:none;

    border-color:var(--digibot-primary);

    box-shadow:0 0 0 4px rgba(59,130,246,.15);

}

.digibot-navbar-search i{

    position:absolute;

    left:18px;

    top:50%;

    transform:translateY(-50%);

    color:var(--digibot-text-muted);

}



/* ==========================================================================
   NAVBAR RIGHT
========================================================================== */

.digibot-navbar-right{

    display:flex;

    align-items:center;

    gap:14px;

}



/* ==========================================================================
   NAVBAR ICON BUTTON
========================================================================== */

.digibot-nav-btn{

    position:relative;

    width:46px;

    height:46px;

    display:flex;

    align-items:center;

    justify-content:center;

    border:none;

    border-radius:50%;

    background:var(--digibot-surface);

    color:var(--digibot-text);

    cursor:pointer;

    transition:var(--digibot-transition);

}

.digibot-nav-btn:hover{

    background:var(--digibot-primary);

    color:#ffffff;

}



/* ==========================================================================
   NOTIFICATION BADGE
========================================================================== */

.digibot-nav-badge{

    position:absolute;

    top:4px;

    right:2px;

    min-width:18px;

    height:18px;

    padding:0 5px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50px;

    background:var(--digibot-danger);

    color:#ffffff;

    font-size:10px;

    font-weight:700;

}



/* ==========================================================================
   USER MENU
========================================================================== */

.digibot-navbar-user{

    display:flex;

    align-items:center;

    gap:12px;

    cursor:pointer;

    padding:6px 10px;

    border-radius:12px;

    transition:var(--digibot-transition);

}

.digibot-navbar-user:hover{

    background:rgba(255,255,255,.05);

}

.digibot-navbar-avatar{

    width:44px;

    height:44px;

    border-radius:50%;

    object-fit:cover;

    border:2px solid var(--digibot-primary);

}

.digibot-navbar-user-info{

    display:flex;

    flex-direction:column;

    line-height:1.2;

}

.digibot-navbar-user-name{

    font-weight:600;

    color:var(--digibot-text);

}

.digibot-navbar-user-role{

    font-size:.80rem;

    color:var(--digibot-text-muted);

}



/* ==========================================================================
   USER DROPDOWN
========================================================================== */

.digibot-user-dropdown{

    position:absolute;

    top:70px;

    right:0;

    width:280px;

    background:var(--digibot-surface);

    border:1px solid var(--digibot-border);

    border-radius:var(--digibot-radius);

    box-shadow:var(--digibot-shadow-lg);

    overflow:hidden;

    display:none;

    animation:digibotDropdown .20s ease;

}

.digibot-user-dropdown.show{

    display:block;

}

.digibot-user-dropdown-header{

    padding:18px;

    border-bottom:1px solid var(--digibot-border);

}

.digibot-user-dropdown-header h5{

    margin-bottom:4px;

}

.digibot-user-dropdown-header p{

    margin:0;

    font-size:.85rem;

    color:var(--digibot-text-muted);

}

.digibot-user-dropdown-menu{

    list-style:none;

    margin:0;

    padding:8px 0;

}

.digibot-user-dropdown-menu li{

    margin:0;

}

.digibot-user-dropdown-menu a{

    display:flex;

    align-items:center;

    gap:14px;

    padding:12px 18px;

    color:var(--digibot-text-light);

    transition:var(--digibot-transition);

}

.digibot-user-dropdown-menu a:hover{

    background:rgba(59,130,246,.10);

    color:#ffffff;

}

.digibot-user-dropdown-menu i{

    width:18px;

    text-align:center;

}



/* ==========================================================================
   NAVBAR DIVIDER
========================================================================== */

.digibot-navbar-divider{

    width:1px;

    height:34px;

    background:var(--digibot-border);

}



/* ==========================================================================
   DROPDOWN ANIMATION
========================================================================== */

@keyframes digibotDropdown{

    from{

        opacity:0;

        transform:translateY(10px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}



/* ==========================================================================
   RESPONSIVE
========================================================================== */

@media(max-width:992px){

    .digibot-navbar-search{

        width:240px;

    }

}



@media(max-width:768px){

    .digibot-navbar{

        padding:0 16px;

    }

    .digibot-navbar-search{

        display:none;

    }

    .digibot-navbar-user-info{

        display:none;

    }

}



@media(max-width:576px){

    .digibot-navbar{

        height:64px;

    }

    .digibot-navbar-title{

        font-size:1rem;

    }

    .digibot-nav-btn{

        width:42px;

        height:42px;

    }

}

/* ==========================================================================
   CARDS
========================================================================== */

.digibot-card{

    background:var(--digibot-surface);

    border:1px solid var(--digibot-border);

    border-radius:var(--digibot-radius);

    box-shadow:var(--digibot-shadow);

    overflow:hidden;

    transition:var(--digibot-transition);

}

.digibot-card:hover{

    transform:translateY(-2px);

}

.digibot-card-header{

    display:flex;

    align-items:center;

    justify-content:space-between;

    padding:20px 24px;

    border-bottom:1px solid var(--digibot-border);

    background:rgba(255,255,255,.02);

}

.digibot-card-title{

    margin:0;

    font-size:1.1rem;

    font-weight:600;

}

.digibot-card-subtitle{

    font-size:.85rem;

    color:var(--digibot-text-muted);

    margin-top:4px;

}

.digibot-card-body{

    padding:24px;

}

.digibot-card-footer{

    padding:18px 24px;

    border-top:1px solid var(--digibot-border);

    background:rgba(255,255,255,.02);

}



/* ==========================================================================
   STATISTIC CARD
========================================================================== */

.digibot-stat-card{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:28px;

}

.digibot-stat-info h3{

    margin:0;

    font-size:2rem;

}

.digibot-stat-info p{

    margin-top:8px;

    margin-bottom:0;

    color:var(--digibot-text-muted);

}

.digibot-stat-icon{

    width:72px;

    height:72px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:30px;

    background:rgba(59,130,246,.15);

    color:var(--digibot-primary);

}



/* ==========================================================================
   BUTTONS
========================================================================== */

.digibot-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    border:none;

    cursor:pointer;

    text-decoration:none;

    font-weight:600;

    font-size:.95rem;

    border-radius:var(--digibot-radius-sm);

    padding:12px 24px;

    transition:var(--digibot-transition);

}

.digibot-btn i{

    font-size:.95rem;

}

.digibot-btn:disabled{

    opacity:.6;

    cursor:not-allowed;

}



/* Primary */

.digibot-btn-primary{

    background:var(--digibot-primary);

    color:#fff;

}

.digibot-btn-primary:hover{

    background:var(--digibot-primary-hover);

}



/* Secondary */

.digibot-btn-secondary{

    background:var(--digibot-surface-light);

    color:var(--digibot-text);

}

.digibot-btn-secondary:hover{

    background:#475569;

}



/* Success */

.digibot-btn-success{

    background:var(--digibot-success);

    color:#fff;

}



/* Danger */

.digibot-btn-danger{

    background:var(--digibot-danger);

    color:#fff;

}



/* Warning */

.digibot-btn-warning{

    background:var(--digibot-warning);

    color:#111827;

}



/* Outline */

.digibot-btn-outline{

    background:transparent;

    color:var(--digibot-primary);

    border:1px solid var(--digibot-primary);

}

.digibot-btn-outline:hover{

    background:var(--digibot-primary);

    color:#fff;

}



/* Sizes */

.digibot-btn-sm{

    padding:8px 16px;

    font-size:.85rem;

}

.digibot-btn-lg{

    padding:15px 34px;

    font-size:1rem;

}



/* ==========================================================================
   BUTTON GROUP
========================================================================== */

.digibot-btn-group{

    display:flex;

    flex-wrap:wrap;

    gap:12px;

}



/* ==========================================================================
   FORM
========================================================================== */

.digibot-form{

    width:100%;

}

.digibot-form-group{

    margin-bottom:22px;

}

.digibot-label{

    display:block;

    margin-bottom:8px;

    color:var(--digibot-text);

    font-weight:600;

    font-size:.92rem;

}



/* ==========================================================================
   INPUT
========================================================================== */

.digibot-input,

.digibot-select,

.digibot-textarea{

    width:100%;

    height:48px;

    padding:0 16px;

    background:var(--digibot-body);

    border:1px solid var(--digibot-border);

    border-radius:var(--digibot-radius-sm);

    color:var(--digibot-text);

    font-size:.92rem;

    transition:var(--digibot-transition);

}

.digibot-textarea{

    min-height:140px;

    resize:vertical;

    padding:14px 16px;

}

.digibot-input::placeholder,

.digibot-textarea::placeholder{

    color:var(--digibot-text-muted);

}

.digibot-input:focus,

.digibot-select:focus,

.digibot-textarea:focus{

    outline:none;

    border-color:var(--digibot-primary);

    box-shadow:0 0 0 4px rgba(59,130,246,.15);

}



/* ==========================================================================
   INPUT GROUP
========================================================================== */

.digibot-input-group{

    position:relative;

}

.digibot-input-group i{

    position:absolute;

    left:16px;

    top:50%;

    transform:translateY(-50%);

    color:var(--digibot-text-muted);

}

.digibot-input-group .digibot-input{

    padding-left:48px;

}



/* ==========================================================================
   CHECKBOX
========================================================================== */

.digibot-checkbox{

    display:flex;

    align-items:center;

    gap:10px;

    cursor:pointer;

}

.digibot-checkbox input{

    width:18px;

    height:18px;

}



/* ==========================================================================
   RADIO
========================================================================== */

.digibot-radio{

    display:flex;

    align-items:center;

    gap:10px;

}

.digibot-radio input{

    width:18px;

    height:18px;

}



/* ==========================================================================
   SWITCH
========================================================================== */

.digibot-switch{

    position:relative;

    display:inline-block;

    width:52px;

    height:28px;

}

.digibot-switch input{

    display:none;

}

.digibot-switch-slider{

    position:absolute;

    inset:0;

    background:#475569;

    border-radius:100px;

    transition:.30s;

}

.digibot-switch-slider:before{

    content:"";

    position:absolute;

    left:4px;

    top:4px;

    width:20px;

    height:20px;

    border-radius:50%;

    background:#fff;

    transition:.30s;

}

.digibot-switch input:checked
+
.digibot-switch-slider{

    background:var(--digibot-primary);

}

.digibot-switch input:checked
+
.digibot-switch-slider:before{

    transform:translateX(24px);

}



/* ==========================================================================
   FORM HELP
========================================================================== */

.digibot-help{

    display:block;

    margin-top:6px;

    color:var(--digibot-text-muted);

    font-size:.82rem;

}



/* ==========================================================================
   VALIDATION
========================================================================== */

.digibot-input-error{

    border-color:var(--digibot-danger);

}

.digibot-input-success{

    border-color:var(--digibot-success);

}

.digibot-error{

    color:var(--digibot-danger);

    margin-top:6px;

    font-size:.82rem;

}

.digibot-success{

    color:var(--digibot-success);

    margin-top:6px;

    font-size:.82rem;

}



/* ==========================================================================
   RESPONSIVE
========================================================================== */

@media(max-width:768px){

    .digibot-card-body{

        padding:20px;

    }

    .digibot-card-header{

        padding:18px 20px;

    }

    .digibot-card-footer{

        padding:18px 20px;

    }

    .digibot-btn{

        width:100%;

    }

    .digibot-btn-group{

        flex-direction:column;

    }

}

/* ==========================================================================
   TABLE WRAPPER
========================================================================== */

.digibot-table-wrapper{

    width:100%;

    overflow-x:auto;

    border:1px solid var(--digibot-border);

    border-radius:var(--digibot-radius);

    background:var(--digibot-surface);

}

.digibot-table{

    width:100%;

    min-width:900px;

    border-collapse:collapse;

}

.digibot-table thead{

    background:rgba(255,255,255,.03);

}

.digibot-table th{

    padding:18px 20px;

    text-align:left;

    font-size:.90rem;

    font-weight:600;

    color:var(--digibot-text);

    border-bottom:1px solid var(--digibot-border);

    white-space:nowrap;

}

.digibot-table td{

    padding:16px 20px;

    border-bottom:1px solid rgba(255,255,255,.05);

    color:var(--digibot-text-light);

    vertical-align:middle;

}

.digibot-table tbody tr{

    transition:var(--digibot-transition);

}

.digibot-table tbody tr:hover{

    background:rgba(59,130,246,.08);

}

.digibot-table tbody tr:last-child td{

    border-bottom:none;

}



/* ==========================================================================
   TABLE ACTIONS
========================================================================== */

.digibot-table-actions{

    display:flex;

    align-items:center;

    gap:8px;

    flex-wrap:wrap;

}

.digibot-action{

    width:38px;

    height:38px;

    display:flex;

    align-items:center;

    justify-content:center;

    border:none;

    border-radius:10px;

    cursor:pointer;

    transition:var(--digibot-transition);

}

.digibot-action-view{

    background:rgba(59,130,246,.15);

    color:var(--digibot-primary);

}

.digibot-action-edit{

    background:rgba(245,158,11,.15);

    color:var(--digibot-warning);

}

.digibot-action-delete{

    background:rgba(239,68,68,.15);

    color:var(--digibot-danger);

}

.digibot-action:hover{

    transform:translateY(-2px);

}



/* ==========================================================================
   SEARCH BAR
========================================================================== */

.digibot-search{

    position:relative;

    width:100%;

    max-width:420px;

}

.digibot-search i{

    position:absolute;

    left:16px;

    top:50%;

    transform:translateY(-50%);

    color:var(--digibot-text-muted);

}

.digibot-search input{

    width:100%;

    height:48px;

    padding:0 18px 0 46px;

    background:var(--digibot-body);

    border:1px solid var(--digibot-border);

    border-radius:50px;

    color:var(--digibot-text);

}

.digibot-search input:focus{

    outline:none;

    border-color:var(--digibot-primary);

}



/* ==========================================================================
   FILTER BAR
========================================================================== */

.digibot-filter-bar{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:15px;

    margin-bottom:24px;

    flex-wrap:wrap;

}

.digibot-filter-group{

    display:flex;

    align-items:center;

    gap:12px;

    flex-wrap:wrap;

}



/* ==========================================================================
   BADGES
========================================================================== */

.digibot-badge{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:6px 12px;

    border-radius:50px;

    font-size:.78rem;

    font-weight:600;

}

.digibot-badge-primary{

    background:rgba(59,130,246,.15);

    color:var(--digibot-primary);

}

.digibot-badge-success{

    background:rgba(34,197,94,.15);

    color:var(--digibot-success);

}

.digibot-badge-warning{

    background:rgba(245,158,11,.15);

    color:var(--digibot-warning);

}

.digibot-badge-danger{

    background:rgba(239,68,68,.15);

    color:var(--digibot-danger);

}

.digibot-badge-info{

    background:rgba(6,182,212,.15);

    color:var(--digibot-info);

}



/* ==========================================================================
   STATUS PILLS
========================================================================== */

.digibot-status{

    display:inline-flex;

    align-items:center;

    gap:8px;

    font-size:.85rem;

    font-weight:600;

}

.digibot-status::before{

    content:"";

    width:10px;

    height:10px;

    border-radius:50%;

}

.digibot-status-active::before{

    background:var(--digibot-success);

}

.digibot-status-inactive::before{

    background:var(--digibot-danger);

}

.digibot-status-pending::before{

    background:var(--digibot-warning);

}

.digibot-status-online::before{

    background:#22C55E;

}

.digibot-status-offline::before{

    background:#64748B;

}

.digibot-status-human::before{

    background:#8B5CF6;

}

.digibot-status-bot::before{

    background:#06B6D4;

}



/* ==========================================================================
   AVATAR
========================================================================== */

.digibot-avatar{

    width:42px;

    height:42px;

    border-radius:50%;

    object-fit:cover;

}

.digibot-avatar-sm{

    width:32px;

    height:32px;

}

.digibot-avatar-lg{

    width:60px;

    height:60px;

}



/* ==========================================================================
   TIMELINE
========================================================================== */

.digibot-timeline{

    position:relative;

    margin-left:15px;

    padding-left:25px;

    border-left:2px solid var(--digibot-border);

}

.digibot-timeline-item{

    position:relative;

    padding-bottom:28px;

}

.digibot-timeline-item:last-child{

    padding-bottom:0;

}

.digibot-timeline-item::before{

    content:"";

    position:absolute;

    left:-33px;

    top:4px;

    width:16px;

    height:16px;

    border-radius:50%;

    background:var(--digibot-primary);

    border:3px solid var(--digibot-body);

}

.digibot-timeline-title{

    font-weight:600;

    margin-bottom:5px;

}

.digibot-timeline-date{

    font-size:.82rem;

    color:var(--digibot-text-muted);

    margin-bottom:8px;

}



/* ==========================================================================
   EMPTY STATE
========================================================================== */

.digibot-empty{

    text-align:center;

    padding:80px 20px;

}

.digibot-empty i{

    font-size:70px;

    color:var(--digibot-text-muted);

    margin-bottom:20px;

}

.digibot-empty h3{

    margin-bottom:10px;

}

.digibot-empty p{

    max-width:450px;

    margin:auto;

    color:var(--digibot-text-muted);

}



/* ==========================================================================
   PAGINATION
========================================================================== */

.digibot-pagination{

    display:flex;

    justify-content:flex-end;

    gap:8px;

    margin-top:24px;

    flex-wrap:wrap;

}

.digibot-pagination a{

    min-width:42px;

    height:42px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:10px;

    background:var(--digibot-surface);

    border:1px solid var(--digibot-border);

    color:var(--digibot-text);

    transition:var(--digibot-transition);

}

.digibot-pagination a:hover{

    background:var(--digibot-primary);

    color:#ffffff;

}

.digibot-pagination .active{

    background:var(--digibot-primary);

    color:#ffffff;

}



/* ==========================================================================
   RESPONSIVE
========================================================================== */

@media(max-width:768px){

    .digibot-filter-bar{

        flex-direction:column;

        align-items:stretch;

    }

    .digibot-search{

        max-width:100%;

    }

    .digibot-pagination{

        justify-content:center;

    }

}

/* ==========================================================================
   ALERTS
========================================================================== */

.digibot-alert{

    position:relative;

    display:flex;

    align-items:flex-start;

    gap:15px;

    padding:18px 20px;

    margin-bottom:20px;

    border-radius:var(--digibot-radius);

    border-left:5px solid transparent;

}

.digibot-alert i{

    font-size:22px;

    margin-top:2px;

}

.digibot-alert-content{

    flex:1;

}

.digibot-alert-title{

    font-weight:700;

    margin-bottom:6px;

}

.digibot-alert-success{

    background:rgba(34,197,94,.08);

    border-left-color:var(--digibot-success);

}

.digibot-alert-success i{

    color:var(--digibot-success);

}

.digibot-alert-danger{

    background:rgba(239,68,68,.08);

    border-left-color:var(--digibot-danger);

}

.digibot-alert-danger i{

    color:var(--digibot-danger);

}

.digibot-alert-warning{

    background:rgba(245,158,11,.08);

    border-left-color:var(--digibot-warning);

}

.digibot-alert-warning i{

    color:var(--digibot-warning);

}

.digibot-alert-info{

    background:rgba(6,182,212,.08);

    border-left-color:var(--digibot-info);

}

.digibot-alert-info i{

    color:var(--digibot-info);

}



/* ==========================================================================
   TOAST NOTIFICATION
========================================================================== */

.digibot-toast-container{

    position:fixed;

    top:25px;

    right:25px;

    width:360px;

    z-index:var(--digibot-z-toast);

}

.digibot-toast{

    display:flex;

    gap:15px;

    align-items:flex-start;

    padding:18px;

    margin-bottom:15px;

    background:var(--digibot-surface);

    border:1px solid var(--digibot-border);

    border-left:4px solid var(--digibot-primary);

    border-radius:var(--digibot-radius);

    box-shadow:var(--digibot-shadow);

    animation:digibotToast .30s ease;

}

.digibot-toast-success{

    border-left-color:var(--digibot-success);

}

.digibot-toast-danger{

    border-left-color:var(--digibot-danger);

}

.digibot-toast-warning{

    border-left-color:var(--digibot-warning);

}

.digibot-toast-info{

    border-left-color:var(--digibot-info);

}

.digibot-toast-icon{

    font-size:22px;

}

.digibot-toast-body{

    flex:1;

}

.digibot-toast-title{

    font-weight:700;

    margin-bottom:5px;

}

.digibot-toast-close{

    cursor:pointer;

    color:var(--digibot-text-muted);

}

@keyframes digibotToast{

    from{

        opacity:0;

        transform:translateX(40px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}



/* ==========================================================================
   PAGE LOADER
========================================================================== */

.digibot-loader-overlay{

    position:fixed;

    inset:0;

    background:rgba(15,23,42,.92);

    display:flex;

    justify-content:center;

    align-items:center;

    flex-direction:column;

    gap:20px;

    z-index:var(--digibot-z-loader);

}

.digibot-spinner{

    width:60px;

    height:60px;

    border:5px solid var(--digibot-border);

    border-top-color:var(--digibot-primary);

    border-radius:50%;

    animation:digibotSpin 1s linear infinite;

}

@keyframes digibotSpin{

    to{

        transform:rotate(360deg);

    }

}

.digibot-loader-text{

    color:var(--digibot-text-muted);

}



/* ==========================================================================
   PROGRESS BAR
========================================================================== */

.digibot-progress{

    width:100%;

    height:10px;

    background:var(--digibot-surface-light);

    border-radius:100px;

    overflow:hidden;

}

.digibot-progress-bar{

    height:100%;

    width:0;

    background:var(--digibot-primary);

    transition:.30s;

}



/* ==========================================================================
   SKELETON LOADER
========================================================================== */

.digibot-skeleton{

    position:relative;

    overflow:hidden;

    background:#273548;

    border-radius:8px;

}

.digibot-skeleton::after{

    content:"";

    position:absolute;

    inset:0;

    transform:translateX(-100%);

    background:

    linear-gradient(

        90deg,

        transparent,

        rgba(255,255,255,.08),

        transparent

    );

    animation:digibotSkeleton 1.5s infinite;

}

@keyframes digibotSkeleton{

    100%{

        transform:translateX(100%);

    }

}



/* ==========================================================================
   FILE DROP AREA
========================================================================== */

.digibot-upload{

    border:2px dashed var(--digibot-border);

    border-radius:var(--digibot-radius);

    padding:50px 30px;

    text-align:center;

    cursor:pointer;

    transition:var(--digibot-transition);

    background:rgba(255,255,255,.02);

}

.digibot-upload:hover{

    border-color:var(--digibot-primary);

    background:rgba(59,130,246,.05);

}

.digibot-upload.dragover{

    border-color:var(--digibot-primary);

    background:rgba(59,130,246,.10);

}

.digibot-upload-icon{

    font-size:70px;

    color:var(--digibot-primary);

    margin-bottom:18px;

}

.digibot-upload-title{

    font-size:1.20rem;

    font-weight:700;

}

.digibot-upload-text{

    color:var(--digibot-text-muted);

    margin-top:8px;

}



/* ==========================================================================
   FILE CARD
========================================================================== */

.digibot-file{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:16px 20px;

    margin-top:20px;

    background:var(--digibot-surface);

    border:1px solid var(--digibot-border);

    border-radius:var(--digibot-radius);

}

.digibot-file-left{

    display:flex;

    align-items:center;

    gap:15px;

}

.digibot-file-icon{

    font-size:34px;

    color:var(--digibot-primary);

}

.digibot-file-name{

    font-weight:600;

}

.digibot-file-size{

    font-size:.82rem;

    color:var(--digibot-text-muted);

}



/* ==========================================================================
   IMAGE PREVIEW
========================================================================== */

.digibot-image-preview{

    width:140px;

    height:140px;

    margin:20px auto;

    border-radius:12px;

    overflow:hidden;

    border:2px solid var(--digibot-border);

}

.digibot-image-preview img{

    width:100%;

    height:100%;

    object-fit:cover;

}



/* ==========================================================================
   UPLOAD STATUS
========================================================================== */

.digibot-upload-success{

    color:var(--digibot-success);

}

.digibot-upload-error{

    color:var(--digibot-danger);

}

.digibot-upload-processing{

    color:var(--digibot-warning);

}



/* ==========================================================================
   RESPONSIVE
========================================================================== */

@media(max-width:768px){

    .digibot-toast-container{

        width:calc(100% - 30px);

        right:15px;

        left:15px;

    }

    .digibot-upload{

        padding:35px 20px;

    }

}

/* ==========================================================================
   TABS
========================================================================== */

.digibot-tabs{

    display:flex;

    gap:10px;

    flex-wrap:wrap;

    border-bottom:1px solid var(--digibot-border);

    margin-bottom:24px;

}

.digibot-tab{

    padding:14px 22px;

    color:var(--digibot-text-light);

    font-weight:600;

    cursor:pointer;

    border-bottom:3px solid transparent;

    transition:var(--digibot-transition);

}

.digibot-tab:hover{

    color:var(--digibot-primary);

}

.digibot-tab.active{

    color:var(--digibot-primary);

    border-bottom-color:var(--digibot-primary);

}

.digibot-tab-content{

    display:none;

}

.digibot-tab-content.active{

    display:block;

}



/* ==========================================================================
   ACCORDION
========================================================================== */

.digibot-accordion{

    border:1px solid var(--digibot-border);

    border-radius:var(--digibot-radius);

    overflow:hidden;

}

.digibot-accordion-item{

    border-bottom:1px solid var(--digibot-border);

}

.digibot-accordion-item:last-child{

    border-bottom:none;

}

.digibot-accordion-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:18px 22px;

    cursor:pointer;

    background:var(--digibot-surface);

    transition:var(--digibot-transition);

}

.digibot-accordion-header:hover{

    background:rgba(255,255,255,.03);

}

.digibot-accordion-title{

    font-weight:600;

}

.digibot-accordion-icon{

    transition:.30s;

}

.digibot-accordion-item.active
.digibot-accordion-icon{

    transform:rotate(180deg);

}

.digibot-accordion-body{

    display:none;

    padding:22px;

    background:rgba(255,255,255,.02);

}

.digibot-accordion-item.active
.digibot-accordion-body{

    display:block;

}



/* ==========================================================================
   DROPDOWN
========================================================================== */

.digibot-dropdown{

    position:relative;

    display:inline-block;

}

.digibot-dropdown-menu{

    position:absolute;

    top:100%;

    left:0;

    min-width:220px;

    margin-top:8px;

    background:var(--digibot-surface);

    border:1px solid var(--digibot-border);

    border-radius:var(--digibot-radius);

    box-shadow:var(--digibot-shadow);

    overflow:hidden;

    display:none;

    z-index:var(--digibot-z-dropdown);

}

.digibot-dropdown.show
.digibot-dropdown-menu{

    display:block;

}

.digibot-dropdown-menu a{

    display:flex;

    align-items:center;

    gap:12px;

    padding:14px 18px;

    color:var(--digibot-text-light);

    transition:var(--digibot-transition);

}

.digibot-dropdown-menu a:hover{

    background:rgba(59,130,246,.10);

    color:#ffffff;

}

.digibot-dropdown-divider{

    height:1px;

    background:var(--digibot-border);

}



/* ==========================================================================
   MODAL
========================================================================== */

.digibot-modal-backdrop{

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.60);

    display:none;

    align-items:center;

    justify-content:center;

    z-index:var(--digibot-z-modal);

}

.digibot-modal-backdrop.show{

    display:flex;

}

.digibot-modal{

    width:95%;

    max-width:650px;

    background:var(--digibot-surface);

    border-radius:var(--digibot-radius-lg);

    border:1px solid var(--digibot-border);

    box-shadow:var(--digibot-shadow-lg);

    overflow:hidden;

    animation:digibotZoom .25s ease;

}

.digibot-modal-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:20px 24px;

    border-bottom:1px solid var(--digibot-border);

}

.digibot-modal-title{

    margin:0;

    font-size:1.20rem;

    font-weight:700;

}

.digibot-modal-close{

    background:none;

    border:none;

    color:var(--digibot-text-muted);

    font-size:22px;

    cursor:pointer;

}

.digibot-modal-body{

    padding:24px;

}

.digibot-modal-footer{

    display:flex;

    justify-content:flex-end;

    gap:12px;

    padding:18px 24px;

    border-top:1px solid var(--digibot-border);

}



/* ==========================================================================
   WIDGET
========================================================================== */

.digibot-widget{

    background:var(--digibot-surface);

    border:1px solid var(--digibot-border);

    border-radius:var(--digibot-radius);

    box-shadow:var(--digibot-shadow-sm);

}

.digibot-widget-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:18px 22px;

    border-bottom:1px solid var(--digibot-border);

}

.digibot-widget-title{

    font-weight:700;

}

.digibot-widget-body{

    padding:22px;

}

.digibot-widget-footer{

    padding:18px 22px;

    border-top:1px solid var(--digibot-border);

}



/* ==========================================================================
   INFO WIDGET
========================================================================== */

.digibot-info-widget{

    display:flex;

    align-items:center;

    gap:18px;

}

.digibot-info-icon{

    width:64px;

    height:64px;

    border-radius:14px;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:28px;

    background:rgba(59,130,246,.12);

    color:var(--digibot-primary);

}

.digibot-info-content{

    flex:1;

}

.digibot-info-number{

    font-size:2rem;

    font-weight:700;

    line-height:1;

}

.digibot-info-label{

    margin-top:6px;

    color:var(--digibot-text-muted);

}



/* ==========================================================================
   ACTIVITY CARD
========================================================================== */

.digibot-activity{

    display:flex;

    gap:16px;

    padding:18px 0;

    border-bottom:1px solid rgba(255,255,255,.05);

}

.digibot-activity:last-child{

    border-bottom:none;

}

.digibot-activity-icon{

    width:46px;

    height:46px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:rgba(59,130,246,.12);

    color:var(--digibot-primary);

}

.digibot-activity-content{

    flex:1;

}

.digibot-activity-title{

    font-weight:600;

}

.digibot-activity-time{

    font-size:.82rem;

    color:var(--digibot-text-muted);

    margin-top:4px;

}



/* ==========================================================================
   RESPONSIVE
========================================================================== */

@media(max-width:768px){

    .digibot-tabs{

        overflow-x:auto;

        flex-wrap:nowrap;

    }

    .digibot-tab{

        white-space:nowrap;

    }

    .digibot-modal{

        width:calc(100% - 20px);

    }

    .digibot-modal-footer{

        flex-direction:column;

    }

    .digibot-info-widget{

        flex-direction:column;

        text-align:center;

    }

}

/* ==========================================================================
   DISPLAY UTILITIES
========================================================================== */

.digibot-d-none{display:none!important;}
.digibot-d-block{display:block!important;}
.digibot-d-inline{display:inline!important;}
.digibot-d-inline-block{display:inline-block!important;}
.digibot-d-flex{display:flex!important;}
.digibot-d-grid{display:grid!important;}


/* ==========================================================================
   FLEX UTILITIES
========================================================================== */

.digibot-flex-row{flex-direction:row!important;}
.digibot-flex-column{flex-direction:column!important;}

.digibot-flex-wrap{flex-wrap:wrap!important;}
.digibot-flex-nowrap{flex-wrap:nowrap!important;}

.digibot-align-start{align-items:flex-start!important;}
.digibot-align-center{align-items:center!important;}
.digibot-align-end{align-items:flex-end!important;}
.digibot-align-stretch{align-items:stretch!important;}

.digibot-justify-start{justify-content:flex-start!important;}
.digibot-justify-center{justify-content:center!important;}
.digibot-justify-between{justify-content:space-between!important;}
.digibot-justify-around{justify-content:space-around!important;}
.digibot-justify-end{justify-content:flex-end!important;}

.digibot-flex-grow{
    flex-grow:1;
}

.digibot-flex-shrink{
    flex-shrink:0;
}


/* ==========================================================================
   TEXT
========================================================================== */

.digibot-text-left{text-align:left!important;}
.digibot-text-center{text-align:center!important;}
.digibot-text-right{text-align:right!important;}

.digibot-text-primary{color:var(--digibot-primary)!important;}
.digibot-text-success{color:var(--digibot-success)!important;}
.digibot-text-danger{color:var(--digibot-danger)!important;}
.digibot-text-warning{color:var(--digibot-warning)!important;}
.digibot-text-info{color:var(--digibot-info)!important;}
.digibot-text-muted{color:var(--digibot-text-muted)!important;}

.digibot-fw-light{font-weight:300!important;}
.digibot-fw-normal{font-weight:400!important;}
.digibot-fw-medium{font-weight:500!important;}
.digibot-fw-semibold{font-weight:600!important;}
.digibot-fw-bold{font-weight:700!important;}
.digibot-fw-black{font-weight:800!important;}


/* ==========================================================================
   MARGIN UTILITIES
========================================================================== */

.digibot-m-0{margin:0!important;}
.digibot-m-1{margin:4px!important;}
.digibot-m-2{margin:8px!important;}
.digibot-m-3{margin:12px!important;}
.digibot-m-4{margin:16px!important;}
.digibot-m-5{margin:20px!important;}
.digibot-m-6{margin:24px!important;}

.digibot-mt-auto{margin-top:auto!important;}
.digibot-mb-auto{margin-bottom:auto!important;}
.digibot-ms-auto{margin-left:auto!important;}
.digibot-me-auto{margin-right:auto!important;}


/* ==========================================================================
   PADDING UTILITIES
========================================================================== */

.digibot-p-0{padding:0!important;}
.digibot-p-1{padding:4px!important;}
.digibot-p-2{padding:8px!important;}
.digibot-p-3{padding:12px!important;}
.digibot-p-4{padding:16px!important;}
.digibot-p-5{padding:20px!important;}
.digibot-p-6{padding:24px!important;}


/* ==========================================================================
   BORDER RADIUS
========================================================================== */

.digibot-rounded-0{border-radius:0!important;}
.digibot-rounded-sm{border-radius:6px!important;}
.digibot-rounded{border-radius:12px!important;}
.digibot-rounded-lg{border-radius:18px!important;}
.digibot-rounded-xl{border-radius:24px!important;}
.digibot-rounded-circle{border-radius:50%!important;}


/* ==========================================================================
   SHADOWS
========================================================================== */

.digibot-shadow-none{
    box-shadow:none!important;
}

.digibot-shadow-sm{
    box-shadow:var(--digibot-shadow-sm)!important;
}

.digibot-shadow{
    box-shadow:var(--digibot-shadow)!important;
}

.digibot-shadow-lg{
    box-shadow:var(--digibot-shadow-lg)!important;
}


/* ==========================================================================
   CURSOR
========================================================================== */

.digibot-pointer{
    cursor:pointer;
}

.digibot-not-allowed{
    cursor:not-allowed;
}


/* ==========================================================================
   ANIMATIONS
========================================================================== */

@keyframes digibotFade{

    from{
        opacity:0;
    }

    to{
        opacity:1;
    }

}

@keyframes digibotSlideUp{

    from{

        opacity:0;

        transform:translateY(25px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

@keyframes digibotZoom{

    from{

        opacity:0;

        transform:scale(.95);

    }

    to{

        opacity:1;

        transform:scale(1);

    }

}

.digibot-fade{

    animation:digibotFade .35s ease;

}

.digibot-slide-up{

    animation:digibotSlideUp .35s ease;

}

.digibot-zoom{

    animation:digibotZoom .30s ease;

}


/* ==========================================================================
   RESPONSIVE HELPERS
========================================================================== */

.digibot-mobile-only{

    display:none;

}

.digibot-desktop-only{

    display:block;

}

@media(max-width:768px){

    .digibot-mobile-only{

        display:block;

    }

    .digibot-desktop-only{

        display:none;

    }

}


/* ==========================================================================
   ACCESSIBILITY
========================================================================== */

.sr-only{

    position:absolute;

    width:1px;

    height:1px;

    padding:0;

    margin:-1px;

    overflow:hidden;

    clip:rect(0,0,0,0);

    border:0;

}

:focus-visible{

    outline:3px solid rgba(59,130,246,.45);

    outline-offset:3px;

}

@media(prefers-reduced-motion:reduce){

    *{

        animation:none!important;

        transition:none!important;

        scroll-behavior:auto!important;

    }

}


/* ==========================================================================
   PRINT
========================================================================== */

@media print{

    body{

        background:#ffffff!important;

        color:#000000!important;

    }

    .digibot-sidebar,

    .digibot-navbar,

    .digibot-btn,

    .digibot-pagination,

    .digibot-filter-bar,

    .digibot-toast-container{

        display:none!important;

    }

    .digibot-card{

        border:1px solid #cccccc;

        box-shadow:none;

        break-inside:avoid;

    }

    a{

        color:#000000;

        text-decoration:none;

    }

}


/* ==========================================================================
   END OF PART 9
========================================================================== */

/* ==========================================================================
   BOOTSTRAP 5 OVERRIDES
========================================================================== */

.card{

    background:var(--digibot-surface);

    border:1px solid var(--digibot-border);

    color:var(--digibot-text);

}

.card-header{

    background:rgba(255,255,255,.02);

    border-bottom:1px solid var(--digibot-border);

}

.card-footer{

    background:rgba(255,255,255,.02);

    border-top:1px solid var(--digibot-border);

}

.modal-content{

    background:var(--digibot-surface);

    color:var(--digibot-text);

    border:1px solid var(--digibot-border);

}

.modal-header{

    border-bottom:1px solid var(--digibot-border);

}

.modal-footer{

    border-top:1px solid var(--digibot-border);

}

.dropdown-menu{

    background:var(--digibot-surface);

    border:1px solid var(--digibot-border);

}

.dropdown-item{

    color:var(--digibot-text-light);

}

.dropdown-item:hover{

    background:rgba(59,130,246,.08);

    color:#ffffff;

}

.table{

    color:var(--digibot-text);

}

.table>:not(caption)>*>*{

    background:transparent;

    border-bottom-color:rgba(255,255,255,.08);

}

.form-control,

.form-select{

    background:var(--digibot-body);

    border:1px solid var(--digibot-border);

    color:var(--digibot-text);

}

.form-control:focus,

.form-select:focus{

    background:var(--digibot-body);

    color:var(--digibot-text);

    border-color:var(--digibot-primary);

    box-shadow:0 0 0 .2rem rgba(59,130,246,.18);

}

.form-control::placeholder{

    color:var(--digibot-text-muted);

}

.form-label{

    color:var(--digibot-text);

}

.page-link{

    background:var(--digibot-surface);

    border-color:var(--digibot-border);

    color:var(--digibot-text);

}

.page-link:hover{

    background:var(--digibot-primary);

    border-color:var(--digibot-primary);

    color:#ffffff;

}

.page-item.active .page-link{

    background:var(--digibot-primary);

    border-color:var(--digibot-primary);

}



/* ==========================================================================
   COLOR HELPERS
========================================================================== */

.digibot-bg-primary{background:var(--digibot-primary)!important;}
.digibot-bg-secondary{background:var(--digibot-secondary)!important;}
.digibot-bg-success{background:var(--digibot-success)!important;}
.digibot-bg-danger{background:var(--digibot-danger)!important;}
.digibot-bg-warning{background:var(--digibot-warning)!important;}
.digibot-bg-info{background:var(--digibot-info)!important;}

.digibot-bg-body{background:var(--digibot-body)!important;}
.digibot-bg-surface{background:var(--digibot-surface)!important;}
.digibot-bg-light{background:var(--digibot-surface-light)!important;}



/* ==========================================================================
   BORDER HELPERS
========================================================================== */

.digibot-border{

    border:1px solid var(--digibot-border)!important;

}

.digibot-border-top{

    border-top:1px solid var(--digibot-border)!important;

}

.digibot-border-bottom{

    border-bottom:1px solid var(--digibot-border)!important;

}

.digibot-border-left{

    border-left:1px solid var(--digibot-border)!important;

}

.digibot-border-right{

    border-right:1px solid var(--digibot-border)!important;

}



/* ==========================================================================
   OVERFLOW
========================================================================== */

.digibot-overflow-auto{

    overflow:auto;

}

.digibot-overflow-hidden{

    overflow:hidden;

}

.digibot-overflow-x{

    overflow-x:auto;

}

.digibot-overflow-y{

    overflow-y:auto;

}



/* ==========================================================================
   OPACITY
========================================================================== */

.digibot-opacity-25{opacity:.25;}
.digibot-opacity-50{opacity:.50;}
.digibot-opacity-75{opacity:.75;}
.digibot-opacity-100{opacity:1;}



/* ==========================================================================
   TRANSITIONS
========================================================================== */

.digibot-transition{

    transition:var(--digibot-transition);

}



/* ==========================================================================
   HOVER EFFECTS
========================================================================== */

.digibot-hover-rise{

    transition:var(--digibot-transition);

}

.digibot-hover-rise:hover{

    transform:translateY(-4px);

}

.digibot-hover-shadow:hover{

    box-shadow:var(--digibot-shadow-lg);

}

.digibot-hover-primary:hover{

    border-color:var(--digibot-primary);

}



/* ==========================================================================
   GLASS EFFECT
========================================================================== */

.digibot-glass{

    background:rgba(255,255,255,.04);

    backdrop-filter:blur(18px);

    border:1px solid rgba(255,255,255,.08);

}



/* ==========================================================================
   DIVIDERS
========================================================================== */

.digibot-divider{

    width:100%;

    height:1px;

    background:var(--digibot-border);

}

.digibot-divider-vertical{

    width:1px;

    align-self:stretch;

    background:var(--digibot-border);

}



/* ==========================================================================
   RESPONSIVE VISIBILITY
========================================================================== */

@media(min-width:769px){

    .digibot-hide-desktop{

        display:none!important;

    }

}

@media(max-width:768px){

    .digibot-hide-mobile{

        display:none!important;

    }

}



/* ==========================================================================
   PERFORMANCE
========================================================================== */

img{

    image-rendering:auto;

}

button,

a,

input,

select,

textarea{

    -webkit-tap-highlight-color:transparent;

}

*{

    word-wrap:break-word;

}



/* ==========================================================================
   DARK MODE HELPERS
========================================================================== */

.digibot-theme-dark{

    background:var(--digibot-body);

    color:var(--digibot-text);

}

.digibot-surface{

    background:var(--digibot-surface);

}



/* ==========================================================================
   FINAL RESPONSIVE POLISH
========================================================================== */

@media(max-width:1200px){

    .digibot-card-header,

    .digibot-card-body,

    .digibot-card-footer{

        padding:20px;

    }

}

@media(max-width:992px){

    .digibot-btn-group{

        justify-content:center;

    }

}

@media(max-width:768px){

    h1{

        font-size:2rem;

    }

    h2{

        font-size:1.75rem;

    }

    h3{

        font-size:1.5rem;

    }

    .digibot-stat-card{

        flex-direction:column;

        text-align:center;

        gap:20px;

    }

}

@media(max-width:576px){

    .digibot-card{

        border-radius:10px;

    }

}