/**
 * Centralized employee role colors.
 * Helpers: purple | Dentists: blue | Secretary: green
 */

:root {
    --role-dentist: #0d6efd;
    --role-dentist-dark: #0056b3;
    --role-dentist-light: rgba(13, 110, 253, 0.1);
    --role-dentist-gradient: linear-gradient(135deg, #0d6efd 0%, #0056b3 100%);

    --role-secretary: #198754;
    --role-secretary-dark: #1e7e34;
    --role-secretary-light: rgba(25, 135, 84, 0.1);
    --role-secretary-gradient: linear-gradient(135deg, #198754 0%, #1e7e34 100%);

    --role-helper: #7c3aed;
    --role-helper-dark: #5b21b6;
    --role-helper-light: rgba(124, 58, 237, 0.1);
    --role-helper-gradient: linear-gradient(135deg, #7c3aed 0%, #5b21b6 100%);
}

/* Badge / background utilities (used with bg-{name} pattern) */
.bg-role-dentist {
    background-color: var(--role-dentist) !important;
    color: #fff !important;
}

.bg-role-secretary {
    background-color: var(--role-secretary) !important;
    color: #fff !important;
}

.bg-role-helper {
    background-color: var(--role-helper) !important;
    color: #fff !important;
}

/* Text color utilities */
.text-role-dentist { color: var(--role-dentist) !important; }
.text-role-secretary { color: var(--role-secretary) !important; }
.text-role-helper { color: var(--role-helper) !important; }

/* Icon sizing helper used in shift grids */
.role-icon {
    font-size: 2rem;
}

.role-icon-dentist { color: var(--role-dentist); }
.role-icon-secretary { color: var(--role-secretary); }
.role-icon-helper { color: var(--role-helper); }

/* Shift grid role sections */
.role-section {
    margin-bottom: 3rem;
    padding: 1.5rem;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.role-section.dentist {
    border-left: 5px solid var(--role-dentist);
}

.role-section.secretary {
    border-left: 5px solid var(--role-secretary);
}

.role-section.helper {
    border-left: 5px solid var(--role-helper);
}

.role-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid #e9ecef;
}

.role-title {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-size: 1.5rem;
    font-weight: 600;
}

.role-badge-dentist,
.role-badge-secretary,
.role-badge-helper {
    color: #fff;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    font-size: 0.9rem;
}

.role-badge-dentist {
    background: var(--role-dentist-gradient);
}

.role-badge-secretary {
    background: var(--role-secretary-gradient);
}

.role-badge-helper {
    background: var(--role-helper-gradient);
}

.stat-card.dentist-card {
    background: var(--role-dentist-gradient);
}

.stat-card.secretary-card {
    background: var(--role-secretary-gradient);
}

.stat-card.helper-card {
    background: var(--role-helper-gradient);
}

/* Table row grouping tints */
.role-row-dentist,
tr.role-dentist td {
    background-color: var(--role-dentist-light);
}

.role-row-secretary,
tr.role-secretary td {
    background-color: var(--role-secretary-light);
}

.role-row-helper,
tr.role-helper td {
    background-color: var(--role-helper-light);
}

/* Employee list role badges */
.badge-role-dentist {
    background: var(--role-dentist-gradient);
    color: #fff;
}

.badge-role-secretary {
    background: var(--role-secretary-gradient);
    color: #fff;
}

.badge-role-helper {
    background: var(--role-helper-gradient);
    color: #fff;
}

/* Shift template category headers */
.role-category-icon-dentist { color: var(--role-dentist); }
.role-category-icon-secretary { color: var(--role-secretary); }
.role-category-icon-helper { color: var(--role-helper); }