:root{
    --team-red : #d03d46;
    --team-white:#F3F6F9;
    --team-blue:#4d5ddb;
    --team-black:#000000;
    --team-yellow:#e3cb0d;
    --team-green:#1dd871;
    --team-orange:#FE9900;
    --team-purple:#8920AD;
    --team-gold:#D3AF37;
    --team-silver:#C0C0C0;
    --team-brown:#964B00;
    --team-pink:#f338a2;
    --team-light-red: rgb(255, 0, 0, 0.7);
    --team-light-white: rgb(245, 245, 245);
    --team-light-blue: rgb(0, 0, 255, 0.7);
    --team-light-black: rgb(0, 0, 0, 0.7);
    --team-light-yellow: rgb(253, 218, 13, 0.7);
    --team-light-green: rgb(0, 128, 0, 0.7);
    --team-light-orange: rgb(255, 165, 0, 0.7);
    --team-light-purple: rgb(160, 32, 240, 0.7);
    --team-light-gold: rgb(211 175 55);
    --team-light-silver: rgb(192 192 192);
    --team-light-brown: rgb(150 75 0);
    --team-light-pink: rgb(255 192 203);
}

.bg-team-red {
    background-color: var(--team-red);
    color: #fff !important;
}
.bg-team-white {
    border: 2px solid #edebeb;
    background-color:var(--team-white);
    color: #000 !important;
}
.bg-team-blue {
    background-color:var(--team-blue);
    color: #fff !important;
}
.bg-team-black {
    background-color:var(--team-black);
    color: #fff !important;
}
.bg-team-yellow {
    background-color:var(--team-yellow);
    color: #fff !important;
}
.bg-team-green {
    background-color:var(--team-green);
    color: #fff !important;
}
.bg-team-orange {
    background-color:var(--team-orange);
    color: #fff !important;
}
.bg-team-purple {
    background-color:var(--team-purple);
    color: #fff !important;
}
.bg-team-gold {
    background-color:var(--team-gold);
    color: #fff !important;
}
.bg-team-silver {
    background-color:var(--team-silver);
    color: #fff !important;
}
.bg-team-brown {
    background-color:var(--team-brown);
    color: #fff !important;
}
.bg-team-pink {
    background-color:var(--team-pink);
    color: #fff !important;
}

.team-red {
    color: var(--team-red);
}
.team-white {
    color:var(--team-white);
}
.team-blue {
   color:var(--team-blue);
}
.team-black {
   color:var(--team-black);
}
.team-yellow {
   color:var(--team-yellow);
}
.team-green {
   color:var(--team-green);
}
.team-orange {
   color:var(--team-orange);
}
.team-purple {
   color:var(--team-purple);
}
.team-gold {
   color:var(--team-gold);
}
.team-silver {
   color:var(--team-silver);
}
.team-brown {
   color:var(--team-brown);
}
.team-pink {
   color:var(--team-pink);
}

.bg-team-light-red {
    background-color: var(--team-light-red);
}
.bg-team-light-white {
    background-color: var(--team-light-white);
}
.bg-team-light-blue {
    background-color: var(--team-light-blue);
}
.bg-team-light-black {
    background-color: var(--team-light-black);
}
.bg-team-light-yellow {
    background-color: var(--team-light-yellow);
}
.bg-team-light-green {
    background-color: var(--team-light-green);
}
.bg-team-light-orange {
    background-color: var(--team-light-orange);
}
.bg-team-light-purple {
    background-color: var(--team-light-purple);
}
.bg-team-light-gold {
    background-color: var(--team-light-gold);
}
.bg-team-light-silver {
    background-color: var(--team-light-silver);
}
.bg-team-light-brown {
    background-color: var(--team-light-brown);
}
.bg-team-light-pink {
    background-color: var(--team-light-pink);
}

.bg-team-light-red-border {
    border: 1px solid var(--team-light-red);
}
.bg-team-light-white-border {
    border: 1px solid #d1d1d1;
    color: #b6b6b6 !important;
}
.bg-team-light-blue-border {
    border: 1px solid var(--team-light-blue);
}
.bg-team-light-black-border {
    border: 1px solid var(--team-light-black);
}
.bg-team-light-yellow-border {
    border: 1px solid var(--team-light-yellow);
}
.bg-team-light-green-border {
    border: 1px solid var(--team-light-green);
}
.bg-team-light-orange-border {
    border: 1px solid var(--team-light-orange);
}
.bg-team-light-purple-border {
    border: 1px solid var(--team-light-purple);
}
.bg-team-light-gold-border {
    border: 1px solid var(--team-light-gold);
}
.bg-team-light-silver-border {
    border: 1px solid var(--team-light-silver);
}
.bg-team-light-brown-border {
    border: 1px solid var(--team-light-brown);
}
.bg-team-light-pink-border {
    border: 1px solid var(--team-light-pink);
}

.m-width-select {
    min-width: clamp(60px, 10vw, 120px) !important;
}
.m-width-select-content {
    width: 300px !important;
}
.help-block {
    color: red !important;
}
.div.required label:after {
  content: " *";
  color: red;
}

.custom-list {
    list-style-type: square;
    padding-left: 20px;
    font-size: small;
}

/* ===== Custom Dashboard Styles ===== */
.section-title {
    font-weight: 600;
    font-size: 1.1rem;
    color: #495057;
    margin-bottom: 0.5rem;
}

.my-dashboard-page .accordion-button:not(.collapsed) {
    background-color: #f0f2f5;
    color: #212529;
    font-weight: 600;
}
.my-dashboard-page .accordion-body {
    max-height: 30vh;
    overflow-y: auto;
}

/* Employee List Item Dashboard */
.employee-item {
    display: flex;
    align-items: center;
    padding: 0.5rem 0;
    border-bottom: 1px dashed #e0e0e0;
}
.employee-item:last-child { border-bottom: none; }

.employee-name {
    font-size: 0.95rem;
    font-weight: 500;
}
.employee-date {
    font-size: 0.8rem;
    color: #868e96;
}
.hover-shadow {
    transition: all 0.3s ease-in-out;
}
.hover-shadow:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.2);
}
.text-orange {
    color: #f97316 !important;
}

.hover-card {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.hover-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
}
.status-icon {
    background: rgba(0,0,0,0.05);
    color: #212529;
}
@keyframes pulse { 0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(1.15);opacity:0.7;} }
@keyframes shake { 0%,100%{transform:translateX(0);}25%{transform:translateX(-3px);}75%{transform:translateX(3px);} }
.pulse-green { background:rgba(25,135,84,.15);color:#198754;animation:pulse 1.5s infinite; }
.shake-red { background:rgba(220,53,69,.15);color:#dc3545;animation:shake .8s infinite; }
.pulse-gray { background:rgba(108,117,125,.15);color:#6c757d;animation:pulse 2s infinite; }

    /* birthday image hover */
    .img-overflow .img-effect {
        transition: .3s;
        cursor: pointer;
    }
    .img-overflow .img-effect:hover {
        transform: scale(4.5);
        z-index: 20;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .3);
    }
    .img-overflow,.img-overflow .employee-item {
        overflow: visible !important;
    }
    .confetti-name {
        position: relative;
    }
    .bg-white-team { background-color: #fff !important; color: #333 !important; border: 1px solid #ccc !important; }