.accordion-button { background: none; }
.accordion-button:not(.collapsed) { background: transparent; color: #000; }
.accordion-body a { color: #212529; text-decoration: none; }
.accordion-body a:hover { text-decoration: underline; }


.menu ul li {
    position: static; /* IMPORTANT */
}

.menu ul li ul {
    position: absolute;
    left: 0;
    width: 100%;
    background: #fff;
    display: none;
    z-index: 999;

    padding: 20px 40px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

/* show on hover */
.menu ul li:hover > ul {
    display: block;
}


.menu ul li ul {
    display: none;
    flex-wrap: wrap;
    gap: 15px;
}

.menu ul li:hover > ul {
    display: flex;
}

.menu ul li ul li {
    width: 20%; /* 5 columns */
}

.menu ul li ul li a {
    display: block;
    padding: 8px;
    color: #000;
}


.dropdown-menu {
    top: 100%;
    left: 0;
    right: 0;
}

.dropdown-menu .dropdown-item {
    padding: 8px 12px;
    font-size: 14px;
}

.nav-item.dropdown:hover .dropdown-menu {
    display: block;
}



/* Dashboard Cards */
.dashboard-card {
    border: none;
    border-radius: 16px;
    padding: 20px;
    color: #fff;
    transition: 0.3s ease-in-out;
    position: relative;
    overflow: hidden;
}

.dashboard-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}

/* Icon circle */
.card-icon {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    background: rgba(255,255,255,0.2);
}

/* Gradient Themes */
.bg-blue    { background: linear-gradient(135deg,#4e73df,#224abe); }
.bg-green   { background: linear-gradient(135deg,#1cc88a,#13855c); }
.bg-purple  { background: linear-gradient(135deg,#6f42c1,#4e2a84); }
.bg-orange  { background: linear-gradient(135deg,#f6c23e,#dda20a); }
.bg-red     { background: linear-gradient(135deg,#e74a3b,#be2617); }
.bg-dark    { background: linear-gradient(135deg, #ff9f43, #ff6b00); }
.bg-sky    { background: linear-gradient(135deg, #36d1dc, #5b86e5); }
.bg-pink {background: linear-gradient(135deg, #ff758c, #ff7eb3);}
.stat-title {
    font-size: 14px;
    font-weight: 500;
    opacity: 0.9;
}

.stat-value {
    font-size: 24px;
    font-weight: 700;
}

.stat-small {
    font-size: 12px;
    opacity: 0.85;
}

li.sidebar-item a{ color:#003C77!important; font-size:13px!important;}
li.sidebar-item{ color:#003C77!important}
li.sidebar-item a:hover{color:#001A33!important}

.tbl_head th{ background-color:#0B8C86; color:#FFF; font-weight:bold; padding:10px}

.tbl_head tr{ background-color:#d0eddb; color:#FFF; font-weight:bold; padding:10px}

.offer-click{ background-color:#d0eddb;}
table td{ color:#000; font-size:14px; font-weight:normal}
.text-red{ color:#F00!important}
.border-my-fav{ border-color:#3f4d67}

a.scrollup {
  outline:0;
  text-align: center;
}
.scrollup {
  position: fixed;
  width: 32px;
  height: 32px;
  bottom: 10px;
  right: 20px;
  background:#E9E9E9;
  color:#FEAD34;
  border-radius:2px;
}


/******form validation *********/
.error {
            border: 1px solid red;
        }
        .error-message {
            color: red;
            font-size: 12px;
            text-align: left;
            margin-bottom: 5px;
        }
.showSuccess{background:#ECFFF5; 
              border:1px solid #008040; 
			  color:#008040; 
			  padding:5px;
			  border-radius:5px;
			  }
/********chat bot********/
/* FLOAT BUTTON */
/* CHAT TOGGLE BUTTON */
#chatToggle {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: #0d6efd;
    color: #fff;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 20px;
    z-index: 99999;
}

/* =============================
CHAT BOX (MAIN CONTAINER)
============================= */
#chatBox {
    position: fixed;
    bottom: 80px;
    right: 20px;
    width: 320px;
    height: 450px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.2);
    display: none;

    /* ✅ FLEX LAYOUT FIX */
    display: flex;
    flex-direction: column;

    overflow: hidden;
    z-index: 99999;
}

/* =============================
HEADER
============================= */
.chat-header {
    background: linear-gradient(to bottom, #0d6efd, #6610f2);
    color: #fff;
    padding: 10px;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    flex-shrink: 0; /* prevent resize */
}

/* =============================
USER LIST (FIXED HEIGHT)
============================= */
#userList {
    /* height: 80px;  FIXED HEIGHT */
    overflow-y: auto;
    border-bottom: 1px solid #ddd;
    flex-shrink: 0; /* prevent layout shift */
}

/* =============================
WRAPPER (AUTO HEIGHT)
============================= */
.chat-wrapper {
    display: flex;
    flex-direction: column;
    flex: 1; /* ✅ fill remaining space */
    min-height: 0; /* ✅ critical fix */
}

/* =============================
CHAT BODY (SCROLL AREA)
============================= */
.chat-body {
    flex: 1;
    overflow-y: auto;
    background: #f5f5f5;
    padding: 10px;

    min-height: 0; /* ✅ prevents overflow bugs */
}

/* =============================
CHAT FOOTER (INPUT AREA)
============================= */
.chat-footer {
    display: flex;
    align-items: center;
    border-top: 1px solid #ddd;
    padding: 6px;
    background: #fff;

    flex-shrink: 0; /* ✅ prevents jumping */
}

/* INPUT */
.chat-footer input {
    flex: 1;
    border: none;
    padding: 8px;
    outline: none;
    font-size: 13px;
}

/* BUTTON */
.chat-footer button {
    border: none;
    background: transparent;
    padding: 8px;
    cursor: pointer;
    font-size: 16px;
}

/* =============================
MESSAGES
============================= */
.msg {
    padding: 8px 12px;
    border-radius: 10px;
    margin-bottom: 6px;
    max-width: 75%;
    font-size: 13px;
    word-wrap: break-word;
}

/* SENT MESSAGE */
.msg.me {
    background: #E1F0FF;
    color: #000;
    margin-left: auto;
}

/* RECEIVED MESSAGE */
.msg.other {
    background: #e9ecef;
}

/* =============================
USER ITEM
============================= */
.user-item {
    padding: 6px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
}

/* ACTIVE USER */
.user-item.active {
    background: #dbeafe;
    font-weight: bold;
}

/* HOVER */
.user-item:hover {
    background: #eee;
}

/* STATUS TEXT */
.user-status {
    font-size: 11px;
    color: #666;
    margin-left: 14px;
}

/* =============================
ONLINE / OFFLINE DOTS
============================= */
.online-dot {
    width: 8px;
    height: 8px;
    background: #28a745;
    border-radius: 50%;
    display: inline-block;
    margin-right: 5px;
}

.offline-dot {
    width: 8px;
    height: 8px;
    background: #ccc;
    border-radius: 50%;
    display: inline-block;
    margin-right: 5px;
}



.task-strip.status-1 { background: #dc3545; }
.task-strip.status-2 { background: #ffc107; }
.task-strip.status-3 { background: #198754; }
.stat-card {
    border-radius: 12px;
    transition: 0.2s;
}

.stat-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
}

.stat-card h5 {
    font-size: 22px;
}


.stat-card.total { background: linear-gradient(45deg,#343a40,#495057); color:#fff; }
.stat-card.pending { background: linear-gradient(45deg,#dc3545,#ff6b6b); color:#fff; }
.stat-card.progress { background: linear-gradient(45deg,#ffc107,#ffda6a); }
.stat-card.completed { background: linear-gradient(45deg,#198754,#51cf66); color:#fff; }
.modal-content {
    border-radius: 12px;
}
.task-card img {
    max-width: 100%;
    height: auto;
    border-radius: 6px;
}
#editor {
    background: #fff;
    border-radius: 6px;
}

/* Left status strip */
.task-strip {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    border-radius: 10px 0 0 10px;
}

/* Status colors */
.task-strip.pending { background: #dc3545; }
.task-strip.progress { background: #ffc107; }
.task-strip.completed { background: #198754; }

/* Mobile button stretch */
@media (max-width: 576px) {
    .task-card .btn {
        flex: 1 1 auto;
    }
}


.task-content ul {
    list-style: none;
    padding-left: 0;
}

.task-content ul li {
    position: relative;
    padding-left: 24px;
    margin-bottom: 6px;
}

.task-content ul li::before {
    content: "✔";
    width: 16px;
    height: 16px;
    background:#60BF00;
    color: #fff;
    font-size: 10px;
    text-align: center;
    line-height: 16px;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 2px;
}

.task-content ul li:hover::before {
    transform: scale(1.1);
    transition: 0.2s;
}


.task-content ol {
    counter-reset: item;
    padding-left: 0;
}

.task-content ol li {
    list-style: none;
    position: relative;
    padding-left: 24px;
    margin-bottom: 6px;
}

.task-content ol li::before {
    counter-increment: item;
    content: counter(item);
    width: 16px;
    height: 16px;
    background:#F89807;
    color: #fff;
    font-size: 10px;
    text-align: center;
    line-height: 16px;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 2px;
}

.task-content ol li:hover::before {
    transform: scale(1.1);
    transition: 0.2s;
}

.task-content ol li {
    font-size: 14px;
}

.bg-gradient-red-glass {
    background: linear-gradient(135deg, #ff6b6b, #c92a2a);
    color: #fff;
    border-radius: 12px;
}


.card{
    overflow: hidden;
    border: none;
    border-radius: .5rem;
    transition: .3s;
}


.card-img-top{
    width: 100%;
    height: 180px;
    object-fit: contain;
    object-position: center;
    border-radius: 10px;
    margin: 0px auto 0;
    display: block;
    transition: all .3s ease;
}

.card:hover .card-img-top{
    transform: scale(1.08);
}