.bg-dark-gray {
        background-color: #1e1e1e;
    }

    .border-light {
        border-color: #444 !important;
    }

    .text-white-80 {
        color: rgba(255, 255, 255, 0.8);
    }

    .form-select.role-select {
        background-color: rgba(64, 118, 126, 0.39);
        color: #fff;
        font-family: "HomeVideo-Regular", sans-serif;
        border: none;
        border-radius: 0.5rem;
        padding: 0.4rem 0.8rem;
        height: 3.5vw;
        width: auto;
        min-width: 140px;
        backdrop-filter: blur(5px);
        transition: all 0.3s ease;
        cursor: pointer;
        text-align: center;
    }

    /* Стили для прозрачной темной таблицы */
    .table-transparent-dark {
        --bs-table-bg: transparent;
        --bs-table-color: white;
        --bs-table-striped-color: white;
        --bs-table-active-color: white;
        --bs-table-hover-color: white;
        background-color: rgba(30, 30, 30, 0.5) !important;
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        border: 1px solid rgba(255, 255, 255, 0.1);
    }
    
    .table-transparent-dark > :not(caption) > * > * {
        background-color: transparent;
        border-bottom-width: 1px;
        box-shadow: none;
        color: white;
    }
    
    .header-highlight {
        background-color: white;
        color: black;
        display: inline-block;
        font-weight: 500;
    }

    .table-transparent-dark th {
        background-color: rgba(73, 169, 176, 0.3) !important;
        border-bottom: 2px solid rgba(73, 169, 176, 0.5);
        font-family: "HomeVideo-Regular", sans-serif;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        padding-top: 1vw;
        padding-bottom: 1vw;
    }
    
    .table-transparent-dark td {
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
        vertical-align: middle;
        font-family: "HomeVideo-Regular", sans-serif;
        padding-top: 1vw;
        padding-bottom: 1vw;
    }
    
    .table-transparent-dark tbody tr:hover {
        background-color: rgba(73, 169, 176, 0.1) !important;
    }
    
    /* Стили для прогресс-бара */
    .progress-container {
        position: relative;
        max-width: 150px;
        margin: 0 auto;
    }
    
    .progress-value {
        position: absolute;
        left: 50%;
        top: -20px;
        transform: translateX(-50%);
        font-size: 12px;
        color: white;
    }
    
    .progress {
        background-color: rgba(255, 255, 255, 0.1);
        border-radius: 3px;
        overflow: hidden;
    }
    
    .progress-bar {
        background-color: #49A9B0 !important;
    }
    
    /* Стили для бейджей статусов */
    .status-badge {
        background-color: rgba(73, 169, 176, 0.2);
        color: white;
        font-weight: normal;
        padding: 5px 10px;
        border-radius: 50px;
        border: 1px solid rgba(73, 169, 176, 0.5);
    }
    


    .container {
        background-color: rgba(30, 30, 30, 0.0);
        border: 0.5px solid rgba(255, 255, 255, 0.0);
        border-radius: 29.22px;
        padding: 20px;
        backdrop-filter: blur(0px);
        -webkit-backdrop-filter: blur(0px);
        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.0);
    }

    .custom-background {
        background-color: rgba(30, 30, 30, 0.5);
        border: 0.5px solid rgba(255, 255, 255, 0.2);
        border-radius: 29.22px;
        padding: 20px;
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    }