/*
 * Componentes de botao das noticias.
 * API compativel com os botoes do Bootstrap 5, sem carregar o restante do
 * framework e sem alterar o layout geral da pagina.
 */

.btn {
    --btn-color: #212529;
    --btn-bg: transparent;
    --btn-border-color: transparent;
    --btn-hover-color: #212529;
    --btn-hover-bg: transparent;
    --btn-hover-border-color: transparent;
    --btn-focus-shadow-rgb: 49, 132, 253;
    --btn-active-color: #212529;
    --btn-active-bg: transparent;
    --btn-active-border-color: transparent;
    --btn-disabled-color: #6c757d;
    --btn-disabled-bg: transparent;
    --btn-disabled-border-color: transparent;
    display: inline-block;
    padding: 0.375rem 0.75rem;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--btn-color);
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    border: 1px solid var(--btn-border-color);
    border-radius: 0.375rem;
    background-color: var(--btn-bg);
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
        border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.btn:hover {
    color: var(--btn-hover-color);
    background-color: var(--btn-hover-bg);
    border-color: var(--btn-hover-border-color);
}

.btn:focus-visible {
    color: var(--btn-hover-color);
    background-color: var(--btn-hover-bg);
    border-color: var(--btn-hover-border-color);
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(var(--btn-focus-shadow-rgb), 0.5);
}

.btn-check:checked + .btn,
.btn.active,
.btn.show,
.btn:first-child:active,
:not(.btn-check) + .btn:active {
    color: var(--btn-active-color);
    background-color: var(--btn-active-bg);
    border-color: var(--btn-active-border-color);
}

.btn-check:checked + .btn:focus-visible,
.btn.active:focus-visible,
.btn.show:focus-visible,
.btn:first-child:active:focus-visible,
:not(.btn-check) + .btn:active:focus-visible {
    box-shadow: 0 0 0 0.25rem rgba(var(--btn-focus-shadow-rgb), 0.5);
}

.btn:disabled,
.btn.disabled,
fieldset:disabled .btn {
    color: var(--btn-disabled-color);
    pointer-events: none;
    background-color: var(--btn-disabled-bg);
    border-color: var(--btn-disabled-border-color);
    opacity: 0.65;
}

.btn-primary {
    --btn-color: #fff; --btn-bg: #0d6efd; --btn-border-color: #0d6efd;
    --btn-hover-color: #fff; --btn-hover-bg: #0b5ed7; --btn-hover-border-color: #0a58ca;
    --btn-focus-shadow-rgb: 49, 132, 253;
    --btn-active-color: #fff; --btn-active-bg: #0a58ca; --btn-active-border-color: #0a53be;
    --btn-disabled-color: #fff; --btn-disabled-bg: #0d6efd; --btn-disabled-border-color: #0d6efd;
}

.btn-secondary {
    --btn-color: #fff; --btn-bg: #6c757d; --btn-border-color: #6c757d;
    --btn-hover-color: #fff; --btn-hover-bg: #5c636a; --btn-hover-border-color: #565e64;
    --btn-focus-shadow-rgb: 130, 138, 145;
    --btn-active-color: #fff; --btn-active-bg: #565e64; --btn-active-border-color: #51585e;
    --btn-disabled-color: #fff; --btn-disabled-bg: #6c757d; --btn-disabled-border-color: #6c757d;
}

.btn-success {
    --btn-color: #fff; --btn-bg: #198754; --btn-border-color: #198754;
    --btn-hover-color: #fff; --btn-hover-bg: #157347; --btn-hover-border-color: #146c43;
    --btn-focus-shadow-rgb: 60, 153, 110;
    --btn-active-color: #fff; --btn-active-bg: #146c43; --btn-active-border-color: #13653f;
    --btn-disabled-color: #fff; --btn-disabled-bg: #198754; --btn-disabled-border-color: #198754;
}

.btn-danger {
    --btn-color: #fff; --btn-bg: #dc3545; --btn-border-color: #dc3545;
    --btn-hover-color: #fff; --btn-hover-bg: #bb2d3b; --btn-hover-border-color: #b02a37;
    --btn-focus-shadow-rgb: 225, 83, 97;
    --btn-active-color: #fff; --btn-active-bg: #b02a37; --btn-active-border-color: #a52834;
    --btn-disabled-color: #fff; --btn-disabled-bg: #dc3545; --btn-disabled-border-color: #dc3545;
}

.btn-warning {
    --btn-color: #000; --btn-bg: #ffc107; --btn-border-color: #ffc107;
    --btn-hover-color: #000; --btn-hover-bg: #ffca2c; --btn-hover-border-color: #ffc720;
    --btn-focus-shadow-rgb: 217, 164, 6;
    --btn-active-color: #000; --btn-active-bg: #ffcd39; --btn-active-border-color: #ffc720;
    --btn-disabled-color: #000; --btn-disabled-bg: #ffc107; --btn-disabled-border-color: #ffc107;
}

.btn-info {
    --btn-color: #000; --btn-bg: #0dcaf0; --btn-border-color: #0dcaf0;
    --btn-hover-color: #000; --btn-hover-bg: #31d2f2; --btn-hover-border-color: #25cff2;
    --btn-focus-shadow-rgb: 11, 172, 204;
    --btn-active-color: #000; --btn-active-bg: #3dd5f3; --btn-active-border-color: #25cff2;
    --btn-disabled-color: #000; --btn-disabled-bg: #0dcaf0; --btn-disabled-border-color: #0dcaf0;
}

.btn-light {
    --btn-color: #000; --btn-bg: #f8f9fa; --btn-border-color: #f8f9fa;
    --btn-hover-color: #000; --btn-hover-bg: #d3d4d5; --btn-hover-border-color: #c6c7c8;
    --btn-focus-shadow-rgb: 211, 212, 213;
    --btn-active-color: #000; --btn-active-bg: #c6c7c8; --btn-active-border-color: #babbbc;
    --btn-disabled-color: #000; --btn-disabled-bg: #f8f9fa; --btn-disabled-border-color: #f8f9fa;
}

.btn-dark {
    --btn-color: #fff; --btn-bg: #212529; --btn-border-color: #212529;
    --btn-hover-color: #fff; --btn-hover-bg: #424649; --btn-hover-border-color: #373b3e;
    --btn-focus-shadow-rgb: 66, 70, 73;
    --btn-active-color: #fff; --btn-active-bg: #4d5154; --btn-active-border-color: #373b3e;
    --btn-disabled-color: #fff; --btn-disabled-bg: #212529; --btn-disabled-border-color: #212529;
}

.btn-outline-primary { --btn-color: #0d6efd; --btn-border-color: #0d6efd; --btn-hover-color: #fff; --btn-hover-bg: #0d6efd; --btn-hover-border-color: #0d6efd; --btn-focus-shadow-rgb: 13, 110, 253; --btn-active-color: #fff; --btn-active-bg: #0d6efd; --btn-active-border-color: #0d6efd; --btn-disabled-color: #0d6efd; --btn-disabled-bg: transparent; --btn-disabled-border-color: #0d6efd; }
.btn-outline-secondary { --btn-color: #6c757d; --btn-border-color: #6c757d; --btn-hover-color: #fff; --btn-hover-bg: #6c757d; --btn-hover-border-color: #6c757d; --btn-focus-shadow-rgb: 108, 117, 125; --btn-active-color: #fff; --btn-active-bg: #6c757d; --btn-active-border-color: #6c757d; --btn-disabled-color: #6c757d; --btn-disabled-bg: transparent; --btn-disabled-border-color: #6c757d; }
.btn-outline-success { --btn-color: #198754; --btn-border-color: #198754; --btn-hover-color: #fff; --btn-hover-bg: #198754; --btn-hover-border-color: #198754; --btn-focus-shadow-rgb: 25, 135, 84; --btn-active-color: #fff; --btn-active-bg: #198754; --btn-active-border-color: #198754; --btn-disabled-color: #198754; --btn-disabled-bg: transparent; --btn-disabled-border-color: #198754; }
.btn-outline-danger { --btn-color: #dc3545; --btn-border-color: #dc3545; --btn-hover-color: #fff; --btn-hover-bg: #dc3545; --btn-hover-border-color: #dc3545; --btn-focus-shadow-rgb: 220, 53, 69; --btn-active-color: #fff; --btn-active-bg: #dc3545; --btn-active-border-color: #dc3545; --btn-disabled-color: #dc3545; --btn-disabled-bg: transparent; --btn-disabled-border-color: #dc3545; }
.btn-outline-warning { --btn-color: #ffc107; --btn-border-color: #ffc107; --btn-hover-color: #000; --btn-hover-bg: #ffc107; --btn-hover-border-color: #ffc107; --btn-focus-shadow-rgb: 255, 193, 7; --btn-active-color: #000; --btn-active-bg: #ffc107; --btn-active-border-color: #ffc107; --btn-disabled-color: #ffc107; --btn-disabled-bg: transparent; --btn-disabled-border-color: #ffc107; }
.btn-outline-info { --btn-color: #0dcaf0; --btn-border-color: #0dcaf0; --btn-hover-color: #000; --btn-hover-bg: #0dcaf0; --btn-hover-border-color: #0dcaf0; --btn-focus-shadow-rgb: 13, 202, 240; --btn-active-color: #000; --btn-active-bg: #0dcaf0; --btn-active-border-color: #0dcaf0; --btn-disabled-color: #0dcaf0; --btn-disabled-bg: transparent; --btn-disabled-border-color: #0dcaf0; }
.btn-outline-light { --btn-color: #f8f9fa; --btn-border-color: #f8f9fa; --btn-hover-color: #000; --btn-hover-bg: #f8f9fa; --btn-hover-border-color: #f8f9fa; --btn-focus-shadow-rgb: 248, 249, 250; --btn-active-color: #000; --btn-active-bg: #f8f9fa; --btn-active-border-color: #f8f9fa; --btn-disabled-color: #f8f9fa; --btn-disabled-bg: transparent; --btn-disabled-border-color: #f8f9fa; }
.btn-outline-dark { --btn-color: #212529; --btn-border-color: #212529; --btn-hover-color: #fff; --btn-hover-bg: #212529; --btn-hover-border-color: #212529; --btn-focus-shadow-rgb: 33, 37, 41; --btn-active-color: #fff; --btn-active-bg: #212529; --btn-active-border-color: #212529; --btn-disabled-color: #212529; --btn-disabled-bg: transparent; --btn-disabled-border-color: #212529; }

.btn-link {
    --btn-color: #0d6efd; --btn-bg: transparent; --btn-border-color: transparent;
    --btn-hover-color: #0a58ca; --btn-hover-bg: transparent; --btn-hover-border-color: transparent;
    --btn-active-color: #0a58ca; --btn-active-bg: transparent; --btn-active-border-color: transparent;
    --btn-disabled-color: #6c757d; --btn-disabled-bg: transparent; --btn-disabled-border-color: transparent;
    text-decoration: underline;
}

.btn-lg { padding: 0.5rem 1rem; font-size: 1.25rem; border-radius: 0.5rem; }
.btn-sm { padding: 0.25rem 0.5rem; font-size: 0.875rem; border-radius: 0.25rem; }

.btn-check { position: absolute; clip: rect(0, 0, 0, 0); pointer-events: none; }
.d-grid > .btn { width: 100%; }

.btn-group,
.btn-group-vertical {
    position: relative;
    display: inline-flex;
    vertical-align: middle;
}

.btn-group { flex-direction: row; }
.btn-group-vertical { flex-direction: column; align-items: flex-start; justify-content: center; }
.btn-group > .btn,
.btn-group-vertical > .btn { position: relative; flex: 1 1 auto; }
.btn-group > .btn:not(:first-child) { margin-left: -1px; border-top-left-radius: 0; border-bottom-left-radius: 0; }
.btn-group > .btn:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.btn-group-vertical > .btn:not(:first-child) { margin-top: -1px; border-top-left-radius: 0; border-top-right-radius: 0; }
.btn-group-vertical > .btn:not(:last-child) { border-bottom-right-radius: 0; border-bottom-left-radius: 0; }
.btn-group > .btn:hover,
.btn-group > .btn:focus,
.btn-group > .btn:active,
.btn-group > .btn.active,
.btn-group-vertical > .btn:hover,
.btn-group-vertical > .btn:focus,
.btn-group-vertical > .btn:active,
.btn-group-vertical > .btn.active { z-index: 1; }

.btn-close {
    box-sizing: content-box;
    width: 1em;
    height: 1em;
    padding: 0.25em;
    color: #000;
    background: transparent
        url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
    border: 0;
    border-radius: 0.375rem;
    opacity: 0.5;
    cursor: pointer;
}

.btn-close:hover { opacity: 0.75; }
.btn-close:focus { outline: 0; box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); opacity: 1; }
.btn-close:disabled,
.btn-close.disabled { pointer-events: none; user-select: none; opacity: 0.25; }

@media (prefers-reduced-motion: reduce) {
    .btn { transition: none; }
}