/* ==========================================================================
   Tema visual "cuiudo" — reskin baseado em https://cuiudo.online/
   Carregado depois de assets/css/style.css, sobrescreve apenas o visual
   (paleta, formatos, sombras, tipografia). Nenhuma regra de layout
   estrutural do sistema é removida.
   ========================================================================== */

:root {
    /* --- paleta extraída da referência ---------------------------------- */
    --ct-page: #f3f3f5;
    --ct-card: #ffffff;
    --ct-header: #090a0c;
    --ct-fg: #020618;
    --ct-muted: #62748e;
    --ct-muted-bg: #f1f5f9;
    --ct-border: #e2e8f0;
    --ct-brand: #00c565;
    --ct-brand-strong: #007f35;
    --ct-brand-soft: #a7e2b2;
    --ct-yellow: #f9c635;
    --ct-yellow-hi: #ffe07a;
    --ct-yellow-lo: #e2a516;
    --ct-yellow-fg: #231103;
    --ct-neon-from: #3ae0e8;
    --ct-neon-to: #00ec9b;
    --ct-support: #626975;
    --ct-danger: #e7000b;

    /* fundo dos blocos escuros (promoções / roleta) */
    --ct-deep-1: #032a3a;
    --ct-deep-2: #075b74;
    --ct-deep-3: #06503c;

    --ct-radius: 10px;
    --ct-radius-lg: 16px;
    --ct-shadow: 0 1px 3px rgba(2, 6, 24, .08), 0 1px 2px rgba(2, 6, 24, .04);
    --ct-shadow-lg: 0 10px 25px -10px rgba(2, 6, 24, .25);

    /* --- remapeamento das variáveis do sistema (tema claro) -------------- */
    --incrivel-bg: #f3f3f5;
    --incrivel-border: #e2e8f0;
    --incrivel-bgColor: #020618;
    --incrivel-bgLink: #020618;
    --incrivel-bgLinkHover: #007f35;
    --incrivel-rgba: 255, 255, 255;
    --incrivel-rgbaInvert: 2, 6, 24;
    --incrivel-formBg: #ffffff;
    --incrivel-formBgHover: #f1f5f9;
    --incrivel-formBgHoverColor: #020618;
    --incrivel-formBorder: #e2e8f0;
    --incrivel-formColor: #020618;
    --incrivel-cardBg: #ffffff;
    --incrivel-cardColor: #020618;
    --incrivel-cardLink: #020618;
    --incrivel-modalBg: #ffffff;
    --incrivel-modalBorder: #e2e8f0;
    --incrivel-modalColor: #020618;
    --incrivel-primaria: #090a0c;
    --incrivel-primariaColor: #ffffff;
    --incrivel-primariaLink: #ffffff;
    --incrivel-primariaLinkHover: #00c565;
    --incrivel-primariaDarken: #f3f3f5;
    --incrivel-primariaDarkenColor: #020618;
    --incrivel-primariaDarkenLink: #020618;
    --incrivel-primariaDarkenLinkHover: #007f35;

    --bs-body-bg: #f3f3f5;
    --bs-body-color: #020618;
}

/* ==========================================================================
   1. Base
   ========================================================================== */

body,
body.modal-open {
    font-family: -apple-system, system-ui, "Segoe UI", Roboto, "Helvetica Neue",
        "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
    background: var(--ct-page);
    color: var(--ct-fg);
    line-height: 1.35;
}

body a {
    color: var(--ct-fg);
}

body a:active,
body a:focus,
body a:hover {
    color: var(--ct-brand-strong);
}

.text-muted,
.text-white-50 {
    color: var(--ct-muted) !important;
}

.text-yellow {
    color: var(--ct-yellow) !important;
}

.text-cor-primaria,
.incrivel-primariaLink {
    color: var(--ct-brand-strong) !important;
}

.bg-cor-primaria {
    background-color: var(--ct-header) !important;
}

/* ==========================================================================
   2. Cabeçalho (barra preta)
   ========================================================================== */

.header-app-header .header-app-header-container {
    background-color: var(--ct-header);
    color: #fff;
}

.ct-header-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    margin: 0 auto;
    max-width: 600px;
}

/* marca: ícone + wordmark em itálico com o risco sobre a segunda palavra */
.ct-brand {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #fff;
    text-decoration: none;
    flex-shrink: 0;
}

.ct-brand:hover,
.ct-brand:focus {
    color: #fff;
}

.ct-brand svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.ct-brand-text {
    font-size: 17px;
    font-weight: 900;
    font-style: italic;
    line-height: 1;
    letter-spacing: -.025em;
    white-space: nowrap;
}

.ct-brand-mark {
    position: relative;
}

.ct-brand-mark::after {
    content: "";
    position: absolute;
    top: -3px;
    left: 0;
    width: 100%;
    height: 2px;
    background: currentColor;
    transform: skewX(-12deg);
}

/* logo em imagem (quando configurada no painel) */
.header-app-header .header-app-brand,
.ct-brand img {
    max-height: 34px;
    max-width: 160px;
    width: auto;
}

.ct-header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

/* botão amarelo "Meus Bilhetes" com brilho passando */
.ct-btn-tickets {
    position: relative;
    overflow: hidden;
    border: 0;
    border-radius: 999px;
    padding: 6px 14px;
    font-size: 12.5px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--ct-yellow-fg);
    text-decoration: none;
    white-space: nowrap;
    background: linear-gradient(to bottom, var(--ct-yellow-hi), var(--ct-yellow) 55%, var(--ct-yellow-lo));
    box-shadow: 0 4px 14px -4px rgba(249, 198, 53, .9), inset 0 1px 0 rgba(255, 255, 255, .6);
}

.ct-btn-tickets:hover,
.ct-btn-tickets:focus {
    color: var(--ct-yellow-fg);
}

.ct-btn-tickets > span {
    position: relative;
    z-index: 1;
}

.ct-btn-tickets::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 33%;
    z-index: 0;
    background: linear-gradient(to right, transparent, rgba(255, 255, 255, .7), transparent);
    animation: ct-shine 3s ease-in-out infinite;
}

@keyframes ct-shine {
    0%   { transform: translateX(-120%); }
    60%  { transform: translateX(420%); }
    100% { transform: translateX(420%); }
}

.ct-btn-menu {
    background: none;
    border: 0;
    padding: 0;
    color: #fff;
    line-height: 0;
}

.ct-btn-menu svg {
    width: 28px;
    height: 28px;
}

/* a barra preta secundária vira apenas o espaçador do header fixo */
.black-bar {
    box-shadow: none;
    background-color: transparent;
    height: 58px;
    padding-top: 0;
}

.separador {
    display: none;
}

.app-main {
    background: transparent;
    border-radius: 0;
    margin-top: 0;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    max-width: 600px;
}

/* ==========================================================================
   3. Títulos de seção
   ========================================================================== */

.app-title .h1,
.app-title h1 {
    color: var(--ct-fg);
    font-size: 1.35em;
    font-weight: 700;
    letter-spacing: -.01em;
}

.app-title .app-title-desc {
    color: var(--ct-muted);
    font-size: .85em;
}

.app-title2 h1,
.app-title2 .h1 {
    font-weight: 700;
}

/* ==========================================================================
   4. Cartões
   ========================================================================== */

.app-card,
.card,
.SorteioTpl_sorteioTpl__2s2Wu,
.ganhadorItem_ganhadorContainer__1Sbxm,
.pergunta-item {
    background-color: var(--ct-card);
    color: var(--ct-fg);
    border: none;
    border-radius: var(--ct-radius-lg);
    box-shadow: var(--ct-shadow);
}

.app-card .card-desc {
    color: var(--ct-muted);
}

.card-body,
.app-card .card-body {
    padding: 14px;
}

/* card de campanha em destaque — imagem grande no topo, texto embaixo */
.SorteioTpl_sorteioTpl__2s2Wu {
    padding: 6px;
    overflow: hidden;
}

.SorteioTpl_sorteioTpl__2s2Wu.SorteioTpl_destaque__3vnWR {
    padding: 0;
}

.SorteioTpl_sorteioTpl__2s2Wu .SorteioTpl_imagem__2GXxI,
.SorteioTpl_sorteioTpl__2s2Wu .SorteioTpl_imagemContainer__2-pl4 {
    border-radius: 12px;
}

.SorteioTpl_sorteioTpl__2s2Wu.SorteioTpl_destaque__3vnWR .SorteioTpl_imagem__2GXxI,
.SorteioTpl_sorteioTpl__2s2Wu.SorteioTpl_destaque__3vnWR .SorteioTpl_imagemContainer__2-pl4 {
    border-radius: 0;
}

.SorteioTpl_sorteioTpl__2s2Wu .SorteioTpl_title__3RLtu {
    color: var(--ct-fg);
    font-size: 1.05em;
    font-weight: 700;
    letter-spacing: -.01em;
}

.SorteioTpl_sorteioTpl__2s2Wu .SorteioTpl_descricao__1b7iL {
    color: var(--ct-muted);
    font-size: .8em;
}

/* na página do produto o título fica sobre o card branco, não sobre foto */
.SorteioTpl_title__3RLtu.text-white,
.custom-content-wrapper .SorteioTpl_title__3RLtu {
    color: var(--ct-fg) !important;
}

.SorteioTpl_descricao__1b7iL.text-white-50 {
    color: var(--ct-muted) !important;
}

.SorteioTpl_sorteioTpl__2s2Wu:after {
    color: var(--ct-brand);
}

/* foto do produto em 4:3, como na referência */
.SorteioTpl_sorteioTpl__2s2Wu.SorteioTpl_destaque__3vnWR .SorteioTpl_imagemContainer__2-pl4 {
    aspect-ratio: 4 / 3;
    height: auto;
    width: 100%;
}

.SorteioTpl_destaque__3vnWR .SorteioTpl_imagemContainer__2-pl4 .carousel,
.SorteioTpl_destaque__3vnWR .SorteioTpl_imagemContainer__2-pl4 .carousel-inner,
.SorteioTpl_destaque__3vnWR .SorteioTpl_imagemContainer__2-pl4 .carousel-item,
.SorteioTpl_destaque__3vnWR .SorteioTpl_imagemContainer__2-pl4 .custom-image {
    height: 100% !important;
}

.SorteioTpl_destaque__3vnWR .SorteioTpl_imagem__2GXxI {
    height: 100% !important;
    width: 100% !important;
    object-fit: cover;
}

/* texto do produto sai de cima da foto e vai para a faixa branca de baixo */
.custom-content-wrapper {
    position: relative;
    bottom: auto;
    background: var(--ct-card);
    padding: 14px 16px 16px !important;
}

.custom-content-wrapper2 {
    padding: 14px 16px 16px !important;
}

.custom-content-wrapper-details {
    padding: 14px 0 16px !important;
}

.custom-content-wrapper-details h1,
.custom-content-wrapper-details p {
    padding: 0 16px;
}

.custom-content-wrapper-details .btn {
    margin: 14px 16px 0;
    width: calc(100% - 32px) !important;
    border-radius: 999px !important;
}

/* selo flutuante sobre a foto, no canto superior esquerdo */
.custom-highlight-card .custom-badge-display {
    top: 12px;
    left: 12px;
}

.custom-highlight-card .custom-badge-display .badge.bg-success {
    background-color: rgba(0, 197, 101, .3) !important;
    color: #04361c !important;
    backdrop-filter: blur(6px);
    border-radius: 8px;
}

.custom-highlight-card .custom-badge-display .badge.bg-dark {
    background-color: rgba(2, 6, 24, .55) !important;
    color: #fff !important;
    backdrop-filter: blur(6px);
}

/* setas do carrossel iguais às da referência */
.custom-highlight-card .carousel-control-prev,
.custom-highlight-card .carousel-control-next {
    width: 34px;
    height: 34px;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 999px;
    background: rgba(2, 6, 24, .3);
    opacity: 1;
}

.custom-highlight-card .carousel-control-prev {
    left: 8px;
}

.custom-highlight-card .carousel-control-next {
    right: 8px;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
    width: 16px;
    height: 16px;
}

/* ==========================================================================
   5. Selos / badges
   ========================================================================== */

.badge.bg-success,
.badge.bg-success.bg-opacity-75 {
    background-color: rgba(0, 197, 101, .16) !important;
    color: var(--ct-brand-strong) !important;
    font-weight: 600;
    border-radius: 8px;
    padding: 5px 9px;
    --bs-bg-opacity: 1;
}

.badge.bg-dark {
    background-color: rgba(2, 6, 24, .08) !important;
    color: #334155 !important;
    font-weight: 600;
    border-radius: 8px;
    padding: 5px 9px;
}

.custom-badge-display .badge {
    backdrop-filter: blur(4px);
}

.blink {
    animation: ct-pulse 2.4s cubic-bezier(.4, 0, .6, 1) infinite;
}

@keyframes ct-pulse {
    0%, 100% { opacity: 1; }
    50%      { opacity: .72; }
}

/* ==========================================================================
   6. Botões
   ========================================================================== */

.btn {
    border-radius: var(--ct-radius);
    font-weight: 600;
}

.btn-success,
.btn-success.disabled,
.btn-success:disabled {
    background-color: var(--ct-brand);
    border-color: var(--ct-brand);
    color: #fff;
}

.btn-check:focus + .btn-success,
.btn-success:focus,
.btn-success:hover,
.btn-success:active {
    background-color: #00b45c;
    border-color: #00b45c;
    color: #fff;
}

.btn-primary {
    background-color: var(--ct-brand);
    border-color: var(--ct-brand);
    color: #fff;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: #00b45c;
    border-color: #00b45c;
}

.btn-secondary {
    background-color: var(--ct-support);
    border-color: var(--ct-support);
    color: #fff;
}

.btn-warning {
    background-color: var(--ct-yellow);
    border-color: var(--ct-yellow);
    color: var(--ct-yellow-fg);
}

.btn-danger {
    background-color: var(--ct-danger);
    border-color: var(--ct-danger);
}

.btn-gradient-dark,
.bg-gradient-blue,
.bg-gradient-green2,
.bg-gradient-pink {
    background: linear-gradient(90deg, var(--ct-neon-from), var(--ct-neon-to)) !important;
    color: var(--ct-yellow-fg) !important;
    border: none !important;
    font-weight: 700;
}

.btn-gradient-dark {
    border-radius: var(--ct-radius);
}

/* botão "Ver meus títulos" sobre o card do produto */
.custom-content-wrapper .btn-gradient-dark {
    color: #04120b !important;
}

.rounded-pill {
    border-radius: 999px !important;
}

/* ==========================================================================
   7. Bloco de destaque / promoção (estilo "Roleta Premiada")
   ========================================================================== */

.rifa-alerta-card,
.app-promocao-numeros > .app-card.card.mb-3 {
    position: relative;
    overflow: hidden;
    color: #fff !important;
    background: linear-gradient(135deg, var(--ct-deep-1) 0%, var(--ct-deep-2) 55%, var(--ct-deep-3) 100%) !important;
    background-color: var(--ct-deep-1) !important;
    border: 2px solid rgba(0, 127, 53, .6) !important;
    border-radius: var(--ct-radius-lg) !important;
    box-shadow: var(--ct-shadow-lg);
}

.rifa-alerta-card::after,
.app-promocao-numeros > .app-card.card.mb-3::after {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .3;
    pointer-events: none;
    background: radial-gradient(circle at 85% 15%, #0b7a5e, transparent 55%);
}

.rifa-alerta-content,
.app-promocao-numeros > .app-card.card.mb-3 .card-body {
    position: relative;
    z-index: 2;
}

.rifa-alerta-title,
.rifa-alerta-timer,
.rifa-alerta-description,
.rifa-alerta-validity,
.app-promocao-numeros > .app-card.card.mb-3 h1 {
    color: #fff !important;
}

.rifa-alerta-title {
    font-size: 1rem !important;
    line-height: 1.3;
    text-transform: none !important;
    letter-spacing: 0 !important;
    text-shadow: 0 2px 6px rgba(0, 0, 0, .35);
}

.rifa-alerta-timer {
    font-size: 1.35rem !important;
    font-family: inherit !important;
}

.rifa-alerta-bg-icon {
    color: rgba(255, 255, 255, .06) !important;
}

.rifa-alerta-progress-container {
    background: rgba(255, 255, 255, .14) !important;
    border: none !important;
    border-radius: 999px !important;
    padding: 3px !important;
}

.rifa-alerta-progress-bar {
    background: linear-gradient(90deg, var(--ct-neon-from), var(--ct-neon-to)) !important;
    box-shadow: 0 0 15px rgba(0, 236, 155, .35);
}

.rifa-alerta-validity {
    border-top: 1px solid rgba(255, 255, 255, .15) !important;
    color: rgba(255, 255, 255, .8) !important;
}

.rifa-alerta-btn {
    background: linear-gradient(90deg, var(--ct-neon-from), var(--ct-neon-to)) !important;
    color: var(--ct-yellow-fg) !important;
}

/* ==========================================================================
   8. Seletor de quantidade + botão comprar
   ========================================================================== */

/* painel de compra fixo no rodapé, como na referência */
.app-vendas-express {
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    z-index: 1030;
    width: 100%;
    max-width: 600px;
    margin: 0 !important;
    background: var(--ct-card);
    border-radius: 20px 20px 0 0;
    box-shadow: 0 -8px 30px -12px rgba(2, 6, 24, .28);
    padding: 12px 14px calc(10px + env(safe-area-inset-bottom, 0px));
}

/* espaço para o conteúdo não ficar escondido atrás do painel */
body:has(.app-vendas-express) .app-main {
    padding-bottom: 250px !important;
}

/* contador -/valor/+ */
.vendasExpressNums,
.vendasExpressNums .card-body {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.vendasExpressNums .card-body {
    background: var(--ct-card) !important;
    border: 1px solid var(--ct-border) !important;
    border-radius: 999px !important;
    padding: 6px !important;
    min-height: 56px;
}

.vendasExpressNums input,
.vendasExpressNums input.form-control {
    background-color: transparent !important;
    color: var(--ct-fg) !important;
    border: none !important;
    font-size: 1.15rem !important;
    font-weight: 700;
    box-shadow: none;
}

.vendasExpressNums .numeroChange {
    border-radius: 999px;
    height: 42px;
    width: 42px;
    padding: 0;
    font-size: 1.5em;
}

.vendasExpressNums .addNumero {
    background: var(--ct-brand);
    color: #fff !important;
}

.vendasExpressNums .removeNumero {
    background: var(--ct-brand-soft);
    color: #ffffff !important;
}

.vendasExpressNums .resetNumero {
    background: transparent;
    height: auto;
    width: auto;
}

.vendasExpressNums .rp-addNumero {
    right: 7px !important;
}

.vendasExpressNums .lp-removeNumero {
    left: 7px !important;
}

/* botões de seleção rápida (+138, +552, ...) */
.vendasExpressNumsSelect.v2 .item .item-content,
.vendasExpressNumsSelect .item .item-content {
    background-color: var(--ct-muted-bg) !important;
    color: var(--ct-fg) !important;
    border: none !important;
    border-radius: 14px;
    min-height: 66px;
}

.vendasExpressNumsSelect.v2 .item .item-content .title-number,
.vendasExpressNumsSelect.v2 .item .item-content h3,
.vendasExpressNumsSelect.v2 .item .item-content .h3 {
    color: var(--ct-fg) !important;
    font-size: 1.35em;
    font-weight: 700;
}

.vendasExpressNumsSelect .item-content-txt {
    color: var(--ct-muted) !important;
    font-weight: 600;
}

.vendasExpressNumsSelect .item.mais-popular:before {
    content: "🔥 Mais popular";
    background: var(--ct-brand);
    border-radius: 999px;
    padding: 2px 8px;
    font-size: .6em;
    font-weight: 700;
    width: auto;
    white-space: nowrap;
    left: 50%;
    transform: translateX(-50%);
    top: -8px;
    box-shadow: 0 2px 8px -2px rgba(0, 197, 101, .8);
}

.vendasExpressNumsSelect.v2 .item.mais-popular .item-content {
    background-color: var(--ct-muted-bg) !important;
    border: 2px solid var(--ct-brand) !important;
}

.vendasExpressNumsSelect .item.active .item-content {
    background: var(--ct-brand) !important;
    color: #fff !important;
}

.vendasExpressNumsSelect .item.active .item-content .title-number,
.vendasExpressNumsSelect .item.active .item-content-txt {
    color: #fff !important;
}

/* botão Comprar com gradiente neon */
.btn-finalizar-container .btn-participar-sorteio,
.btn-participar-sorteio {
    background: linear-gradient(100deg, var(--ct-neon-from), var(--ct-neon-to)) !important;
    border: none !important;
    border-radius: 999px !important;
    color: #04241a !important;
    font-weight: 800;
    min-height: 58px;
    box-shadow: 0 8px 24px -8px rgba(0, 236, 155, .85);
}

.btn-participar-sorteio:hover,
.btn-participar-sorteio:focus,
.btn-participar-sorteio:active {
    filter: brightness(1.04);
    color: #04241a !important;
}

.btn-texto-principal {
    font-weight: 800 !important;
}

.btn-preco-flutuante {
    font-weight: 800;
}

/* ==========================================================================
   9. Preço / barra de progresso
   ========================================================================== */

.campanha-preco {
    background: var(--ct-card);
    border-radius: var(--ct-radius-lg);
    box-shadow: var(--ct-shadow);
    padding: 10px 12px;
    color: var(--ct-muted);
}

.campanha-preco .tag.btn {
    border-radius: 999px;
    font-weight: 700;
}

.campanha-preco .tag.btn.bg-cor-primaria {
    background: var(--ct-brand) !important;
    color: #fff !important;
}

.campanha-preco .tag.btn.bg-white {
    background: var(--ct-card) !important;
    color: var(--ct-fg) !important;
    box-shadow: var(--ct-shadow) !important;
}

/* atalhos Loteria Federal / Suporte */
.ct-quick-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 12px;
}

.ct-quick-link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px;
    border-radius: 12px;
    background: var(--ct-card);
    color: var(--ct-fg);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: var(--ct-shadow);
}

.ct-quick-link img {
    width: 20px;
    height: 20px;
    object-fit: contain;
}

.ct-quick-link--support {
    background: var(--ct-support);
    color: #fff;
}

.ct-quick-link--support:hover,
.ct-quick-link--support:focus {
    color: #fff;
}

.progress {
    background-color: var(--ct-muted-bg);
    border-radius: 999px;
    height: 12px;
    overflow: hidden;
}

.progress-bar.bg-success {
    background: linear-gradient(90deg, var(--ct-neon-from), var(--ct-neon-to)) !important;
    color: #04241a;
    font-size: .68rem;
}

.progress-bar.bg-info {
    background-color: var(--ct-brand-soft) !important;
}

/* ==========================================================================
   10. Ganhadores
   ========================================================================== */

.ganhadorItem_ganhadorContainer__1Sbxm {
    padding: 10px;
}

.ganhadorItem_ganhadorContainer__1Sbxm .ganhadorItem_ganhadorFoto__324kH {
    border: none;
    border-radius: 12px;
}

.ganhadorItem_ganhadorContainer__1Sbxm .ganhadorItem_ganhadorNome__2j_J- {
    color: #475569;
    font-weight: 700;
    font-size: 1.05em;
}

.ganhadorItem_ganhadorContainer__1Sbxm .ganhadorItem_ganhadorDescricao__Z4kO2 {
    color: var(--ct-muted);
    opacity: 1;
}

.ganhadorItem_ganhadorContainer__1Sbxm .ganhadorItem_ganhadorDescricao__Z4kO2 b {
    color: var(--ct-fg);
}

/* ==========================================================================
   11. Perguntas frequentes / colapsáveis
   ========================================================================== */

.pergunta-item {
    padding: 14px !important;
    font-weight: 600;
}

.pergunta-item--resp {
    color: var(--ct-muted);
    font-weight: 400;
}

.app-descricao-completa--titulo {
    color: var(--ct-fg) !important;
    font-weight: 700;
}

/* ==========================================================================
   12. Formulários, modais, alertas
   ========================================================================== */

.form-control,
.form-select {
    background-color: var(--ct-card);
    color: var(--ct-fg);
    border: 1px solid var(--ct-border);
    border-radius: var(--ct-radius);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--ct-brand);
    box-shadow: 0 0 0 3px rgba(0, 197, 101, .15);
}

.form-control::placeholder {
    color: #94a3b8;
}

.app-form .form-check-input:checked,
.form-check-input:checked {
    background-color: var(--ct-brand) !important;
    border-color: var(--ct-brand) !important;
}

.app-form .app-form--search-input:after {
    color: #94a3b8;
}

.form-label,
.app-form label {
    color: var(--ct-fg);
}

/* seletor de abas "Ativas / Concluídas / Em breve" */
.btn-group .btn {
    background-color: var(--ct-muted-bg);
    color: var(--ct-fg);
    border: none;
}

.btn-group .btn a {
    color: inherit;
}

.comprador {
    border-color: var(--ct-brand) !important;
    border-radius: 12px !important;
    color: var(--ct-fg);
}

.modal-content {
    background-color: var(--ct-card);
    color: var(--ct-fg);
    border: none;
    border-radius: var(--ct-radius-lg);
}

.modal .modal-header {
    border-bottom: 1px solid var(--ct-border);
}

.modal-fullscreen .modal-content,
.modal-content.bg-cor-primaria {
    background-color: var(--ct-header);
    color: #fff;
    border-radius: 0;
}

.alert {
    border-radius: var(--ct-radius);
    border: none;
}

.alert-info {
    background-color: rgba(58, 224, 232, .14);
    color: #0f3f52;
}

.alert-success {
    background-color: rgba(0, 197, 101, .14);
    color: var(--ct-brand-strong);
}

.alert-warning {
    background-color: rgba(249, 198, 53, .18);
    color: #6b4f06;
}

.alert-danger {
    background-color: rgba(231, 0, 11, .1);
    color: #a10008;
}

/* ==========================================================================
   13. Menu lateral (modal fullscreen preto)
   ========================================================================== */

.nav-vertical ul li a {
    color: rgba(255, 255, 255, .85) !important;
    border-radius: 12px;
}

.nav-vertical ul li a:hover,
.nav-vertical ul li a:focus {
    background-color: rgba(255, 255, 255, .08);
    color: #fff !important;
}

.card-usuario {
    background-color: rgba(255, 255, 255, .07);
    border-radius: 14px;
}

.app-header.app-header-mobile--show .app-brand {
    max-height: 34px;
}

/* ==========================================================================
   14. Rodapé
   ========================================================================== */

.container-fluid.rodape {
    background: var(--ct-header) !important;
    color: #94a3b8;
}

.container-fluid.rodape a,
.text-center.links-rodape a {
    color: #e2e8f0 !important;
}

.spacing-icon a {
    color: #cbd5e1 !important;
}

/* ==========================================================================
   15. Utilitários herdados do tema escuro que precisam de correção
   ========================================================================== */

.bg-card {
    background-color: var(--ct-card) !important;
    color: var(--ct-fg) !important;
}

.box-shadow-08 {
    box-shadow: var(--ct-shadow) !important;
}

.rounded-10 {
    border-radius: 12px !important;
}

.rounded-4 {
    border-radius: var(--ct-radius-lg) !important;
}

.app-helpers .bg-white.bg-opacity-25 {
    background-color: var(--ct-card) !important;
    --bs-bg-opacity: 1;
}

.app-helpers .txt h3,
.app-helpers .txt p {
    color: var(--ct-fg);
}

.top-compradores,
.app-titulos-premiados--item {
    background-color: var(--ct-card);
    color: var(--ct-fg);
}

.app-titulos-premiados--titulo.text-bg-success {
    background-color: var(--ct-brand) !important;
}

/* números / cotas listadas */
.app-titulos-premiados--item {
    border-radius: 12px;
}