.titles {
    margin-top: 2rem;
    text-align: center;
    
}

.titles h2 {
    color: #f2f2f2;
}

.button-custom {
            margin-top: .5rem;
            background-color: #F2D541;
            color: #232323;
            padding: .5rem 2rem .5rem 2rem;
            border-radius: .30rem;
            border: 0;
            text-decoration: none;
        }
.menu-learn {
    padding: 2rem;
}

section>hr {
    color: #F2D541;
    max-width: var(--max-width);
    margin: 0 auto 0 auto !important;
    margin-right: auto;
}

/* Mandamentos */
#mandamentos>div{
    max-width: var(--max-width);
}
section>div>h2{
    color: #f2f2f2;
    font-size: 1.7rem;
    font-weight: bold;
    margin-top: .5rem;
    margin-bottom: 1rem;
}
section>div>p {
    color: #f2f2f2;
    font-size: 1.2rem;
    line-height: 2rem;
    text-align: justify;
}

.mandamentos-lista {
    background-image: url('../assets/generic-images/ChatGPT Image 18 de abr. de 2025, 04_44_32.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transform: scaleX(-1);
    padding: 2rem;
    border-radius: 10px;
    background-color: rgba(0, 0, 0, 0.5); /* opaco */
    background-blend-mode: darken;
}

.mandamentos-lista> ol{
    list-style-type: decimal; 
    padding-left: 1.5em;
    transform: scaleX(-1);
    
}

.mandamentos-lista>ol>li {
    color: #f2f2f2;
    font-size: 1.2rem;
    line-height: 2rem;
}

/* Técnincas */
#tecnicas>div{
    max-width: var(--max-width);
}
section>div>h3{
    color: #f2f2f2;
    font-size: 1.5rem;
    font-weight: bold;
    margin-top: .5rem;
    margin-bottom: 1rem;
}
section>div>h4{
    color: #f2f2f2;
    font-size: 1.3rem;
    font-weight: bold;
    margin-top: .5rem;
    margin-bottom: 1rem;
}
.deslocamento> ul{
    list-style-type: disc; 
    padding-left: 1.5em;
    
}

.deslocamento>ul>li {
    color: #f2f2f2;
    font-size: 1.2rem;
    line-height: 2rem;
}

.aviso {
    padding: .3rem 1rem .3rem 1rem;
}
.aviso p {
    color: #ffdc6b;
}
/* Estilo geral da área do accordion */
.accordion {
    background-color: transparent; /* cor de fundo escura elegante */
    color: #f1f1f1; /* cor da fonte clara para contraste */
    border-radius: 8px;
    padding: 10px;
}
.accordion-item {
    background-color: transparent !important;
    border: 1px solid #353535 !important;
}
.accordion-item:hover {
    border: 1px solid #ffdc6b !important;
}
/* Cabeçalhos dos acordeons */
.accordion-button {
    background-color: #232323 !important; /* cor de fundo do botão fechado */
    color: #f1f1f1 !important; /* cor do texto */
    font-weight: 600;
    border-radius: 10px !important;
}

.accordion-button:not(.collapsed) {
    background-color: #353535; /* cor quando está aberto */
    color: #ffffff;
}

/* Remover o fundo cinza padrão ao clicar */
.accordion-button:focus {
    box-shadow: none;
}

/* Conteúdo do acordeão */
.accordion-body {
    background-color: #353535; /* cor do conteúdo aberto */
    color: #e0e0e0;
    border-radius: 4px;
    padding: 10px 15px;
}

/* Estilizar a lista */
.list-ct-mandamentos {
    list-style: none; /* remove marcador padrão */
    padding-left: 0;
}

.list-ct-mandamentos li {
    background-color: #303030; /* cor de fundo de cada item */
    margin-bottom: 6px;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 15px;
    color: #f8f8f8;
}

/* Itens ao passar o mouse */
.list-ct-mandamentos li:hover {
    background-color: #ffc107;
    cursor: default;
    color: #232323;
}

/* Grauação */

#graduacao>div{
    max-width: var(--max-width);
}

.destaque {
    background-image: url('https://aitma.pt/wp-content/uploads/2024/05/MT-133-1024x683.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 2rem;
    border-radius: 10px;
    background-color: rgba(0, 0, 0, 0.7); /* opaco */
    background-blend-mode: darken;
}

.destaque p{
    color: #F2D541;
    font-weight: bold;
}


.lista-graduacao {
    list-style: disc;
}

.lista-graduacao li {
    color: #f2f2f2;
    font-size: 1.2rem;
    line-height: 2rem;
}

.table-responsive {
    width: 100%;
    overflow-x: auto;
}

.table-responsive table {
    width: 100%; /* garante que ela ocupe o container */
    border-collapse: collapse;
}


/* Cabeçalho */
.table-responsive table thead tr {
    color: #f2f2f2;
    text-align: center;
}

/* Linhas do corpo */
.table-responsive tbody tr {
    color: #f2f2f2;
}

/* Ajuste dos paddings */
.table-responsive tbody tr td,
.table-responsive thead tr th {
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    text-align: center;
}

/* Se quiser garantir largura mínima para que as colunas não fiquem espremidas demais */
.table-responsive table {
    min-width: 500px; /* ajuste se necessário */
}