/*OBS: Tem que usar !important para funcionar ! */

:root {
    --positive-color: #16d768 !important;
    --negative-color: #dd2c1a !important;
    --positive-background-color: rgba(46, 204, 113, 0.2) !important;
    --negative-background-color: rgba(231, 76, 60, 0.2) !important;
}

.badge-transparent {
    background-color: transparent !important;
    border: 1px solid !important;
}

.badge-positive {
    background-color: rgba(46, 204, 113, 0.2) !important;
    color: #16d768 !important;
}

.badge-negative {
    background-color: rgba(231, 76, 60, 0.2) !important;
    color: #dd2c1a !important;
}

.badge-container {
    padding: 0px 4px 0px 4px !important;
    border-radius: 4px !important;
    display: inline-block !important;
    font-weight: 500 !important;
}

.badge-big-container {
    font-weight: 600 !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    display: inline-block !important;
}

.word-breaker-50 { /* para colunas de checkbox em tabelas */
    word-wrap: break-word !important;
    white-space: normal !important;
    max-width: 50px !important;
}

.word-breaker-100 { /* para colunas com texto grande que necessita de quebra de linhas */
    word-wrap: break-word !important;
    white-space: normal !important;
    max-width: 100px !important;
}

/* Spinner de carregamento para tabelas */
.table-overlay-spinner {
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(var(--ct-link-color-rgb), 0.05);
    width: 100%;
    height: 100%;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.table-overlay-spinner.active {
    opacity: 1;
    pointer-events: all;
}

.table-overlay-spinner .spinner-border {
    width: 2.5rem;
    height: 2.5rem;
    border-width: 0.25rem;
    color: rgb(var(--ct-link-color-rgb));
}

.form-switch .form-check-input {
    transform: scale(1.4); /* ou 2.0 para ainda maior */
    margin-right: 15px;
}

/* bolinha à esquerda */
.dot-left {
    position: relative;
    padding-left: 0.9rem; /* espaço pro ponto */
    padding-bottom: 0.3rem;
}

    .dot-left::before {
        content: "";
        position: absolute;
        left: 0;
        top: 36%;
        width: 0.55rem;
        height: 0.55rem;
        border-radius: 50%;
        transform: translateY(-50%);
        background: var(--dot-color, #6c757d); /* default = secondary */
    }

/* mapear para as cores do seu tema */
.dot-success {
    --dot-color: var(--ct-success);
}

.dot-danger {
    --dot-color: var(--ct-danger);
}

.dot-warning {
    --dot-color: var(--ct-warning);
}

.dot-info {
    --dot-color: var(--ct-info);
}

.icon-small {
    font-size: 15px;
}

.mt-3-5 {
    margin-top: 32px;
}

.mt-button {
    margin-top: 29px;
}

.pr-3 {
    padding-right: 1.5rem !important;
}

@font-face {
    font-family: 'HOMOARAK';
    src: url('/fonts/HOMOARAK.TTF') format('truetype');
    font-weight: normal;
    font-style: normal;
}

.spider-man-font {
    font-family: 'HOMOARAK', sans-serif;
}

.legend-indicator {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: .5rem;
    vertical-align: middle;
}

    .legend-indicator.bg-success {
        background-color: #28a745;
    }

    .legend-indicator.bg-danger {
        background-color: #dc3545;
    }

    .legend-indicator.bg-warning {
        background-color: #ffc107;
    }