/* Presentation only. The public palette comes from the existing theme settings. */
:where(.cartao-public, .cartao-admin, .cartao-access, .cartao-report) {
    --cartao-font-body: "Inter", Arial, sans-serif;
    --cartao-font-heading: "Plus Jakarta Sans", Arial, sans-serif;
    --cartao-font-hero: "Playfair Display", Georgia, serif;
    --cartao-accent: var(--primary-color, var(--cartao-config-accent, #2c62a0));
    --cartao-secondary: var(--secondary-color, var(--cartao-config-secondary, #234d76));
    --cartao-nav: var(--incrivel-primaria, var(--cartao-config-nav, #12243a));
    --cartao-nav-ink: var(--incrivel-bgColor, var(--cartao-config-nav-ink, #fff));
    --cartao-surface: var(--incrivel-formBg, #fff);
    --cartao-ink: var(--incrivel-modalColor, #202b3c);
    --cartao-canvas: color-mix(in srgb, var(--cartao-surface) 95%, var(--cartao-accent));
    --cartao-line: color-mix(in srgb, var(--cartao-ink) 14%, var(--cartao-surface));
    --cartao-muted: color-mix(in srgb, var(--cartao-ink) 75%, var(--cartao-surface));
    --cartao-accent-ink: color-mix(in srgb, var(--cartao-accent) 62%, #131b29);
    --cartao-accent-wash: color-mix(in srgb, var(--cartao-surface) 88%, var(--cartao-accent));
    --cartao-radius: 14px;
    --cartao-shadow: 0 12px 30px #182b4210, 0 2px 5px #182b420c;
}

/* Tipografia global da identidade visual */
.cartao-public,
.cartao-public button,
.cartao-public input,
.cartao-public select,
.cartao-public textarea,
.cartao-admin,
.cartao-admin button,
.cartao-admin input,
.cartao-admin select,
.cartao-admin textarea { font-family: var(--cartao-font-body); }
.cartao-public :is(h1,h2,h3,h4,h5,h6,.app-title,.section-title,.cartao-section-title) {
    font-family: var(--cartao-font-heading);
    font-weight: 800;
}
.cartao-public :is(.cartao-hero h1,.home-hero h1,.cartao-sale-hero h1,.cartao-sale-hero-title,.campaign-hero h1) {
    font-family: var(--cartao-font-hero);
    font-weight: 700;
}
.cartao-public :is(nav a,nav button,.public-navbar a,.public-navbar button,.home-btn,.campaign-join,.btn,.button,[type="submit"]) {
    font-family: var(--cartao-font-body);
    font-weight: 600;
}
.cartao-public :is(.home-price,.cartao-price,.price,.valor,.total,.cartao-sale-price,.cartao-sale-progress strong,.cartao-checkout-total) {
    font-family: var(--cartao-font-heading);
    font-weight: 700;
}

:where(.cartao-public, .cartao-admin, .cartao-access) :is(a, button, input, select, textarea):focus-visible {
    outline: 2px solid var(--cartao-accent);
    outline-offset: 3px;
}

body.cartao-public {
    color: var(--cartao-ink);
    background: var(--cartao-canvas);
}

.cartao-public #__next {
    min-height: 100vh;
    background: linear-gradient(180deg, var(--cartao-accent-wash), var(--cartao-canvas) 400px);
}

.cartao-public .header-app-header {
    background: linear-gradient(110deg, var(--cartao-nav), color-mix(in srgb, var(--cartao-nav) 83%, var(--cartao-accent)));
    color: var(--cartao-nav-ink);
    border-bottom: 1px solid color-mix(in srgb, var(--cartao-accent) 55%, transparent);
    box-shadow: var(--cartao-shadow);
}

.cartao-public .header-app-header .container-600 {
    max-width: 1120px;
    padding-inline: clamp(16px, 3vw, 32px);
    padding-block: 10px;
}

.cartao-public .header-app-header .header-app-brand {
    max-width: min(58vw, 220px);
    object-fit: contain;
}

.cartao-public .header-app-header button[data-bs-target="#mobileMenu"] {
    border-radius: 9px !important;
    box-shadow: inset 0 0 0 1px #ffffff40, 0 2px 4px #0002;
}

.cartao-public .container.app-main {
    max-width: 960px;
    margin-top: 0;
    padding-inline: clamp(14px, 3vw, 28px);
    padding-block: clamp(18px, 3.5vw, 36px) !important;
    background: transparent;
    color: var(--cartao-ink);
}

.cartao-public .container.app-main.cartao-home { max-width: 1120px; }

.cartao-public .cartao-hero {
    position: relative;
    isolation: isolate;
    display: grid;
    align-content: center;
    min-height: clamp(188px, 27vw, 320px);
    overflow: hidden;
    padding: clamp(24px, 5vw, 60px);
    margin-bottom: clamp(20px, 3vw, 32px);
    border: 1px solid color-mix(in srgb, var(--cartao-accent) 54%, var(--cartao-nav));
    border-radius: 20px;
    color: var(--cartao-nav-ink);
    background:
        radial-gradient(ellipse at 82% 35%, color-mix(in srgb, var(--cartao-accent) 56%, transparent), transparent 55%),
        linear-gradient(115deg, var(--cartao-nav) 30%, color-mix(in srgb, var(--cartao-nav) 76%, var(--cartao-secondary)));
    box-shadow: var(--cartao-shadow);
}

.cartao-public .cartao-hero-art {
    position: absolute;
    z-index: -1;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 86% 25%, #ffffff64 0 1px, transparent 2px),
        radial-gradient(circle at 72% 72%, #ffffff74 0 1px, transparent 3px),
        radial-gradient(circle at 92% 66%, #ffffff63 0 1px, transparent 2px),
        radial-gradient(circle at 64% 20%, #ffffff5e 0 1px, transparent 2px);
}

.cartao-public .cartao-hero-art::before,
.cartao-public .cartao-hero-art::after {
    content: "";
    position: absolute;
    width: min(26%, 250px);
    aspect-ratio: 1.55;
    right: 11%;
    top: 23%;
    border: 1px solid #ffffff42;
    border-radius: 16px;
    background:
        linear-gradient(transparent 23%, #ffffff2a 23% 24%, transparent 24%),
        linear-gradient(145deg, #ffffff22, #ffffff05);
    box-shadow: 0 16px 35px #0003, inset 0 0 0 6px #ffffff0c;
    transform: rotate(-12deg);
}

.cartao-public .cartao-hero-art::after {
    right: 6%;
    top: 37%;
    transform: rotate(10deg);
}

.cartao-public .cartao-hero-kicker {
    margin: 0 0 12px;
    color: inherit;
    font-size: .75rem;
    font-weight: 750;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.cartao-public .cartao-hero h1 {
    max-width: 17ch;
    margin: 0;
    color: inherit;
    font-size: clamp(2rem, 5.4vw, 4rem);
    font-weight: 800;
    letter-spacing: -.045em;
    line-height: 1.03;
    overflow-wrap: anywhere;
}

.cartao-public .app-main :is(.app-title, .winner-title) {
    margin-block: .75rem;
    font-weight: 750;
    letter-spacing: -.02em;
}

.cartao-public .app-main :is(.app-title-desc, .campanha-header .SorteioTpl_descricao__1b7iL) {
    line-height: 1.55;
}

.cartao-public .app-main :is(.app-card, .pergunta-item, .SorteioTpl_sorteioTpl__2s2Wu) {
    border: 1px solid var(--cartao-line);
    border-radius: var(--cartao-radius);
    box-shadow: var(--cartao-shadow);
}

.cartao-public .app-main :is(.app-card, .pergunta-item) {
    background-color: var(--incrivel-cardBg, var(--cartao-surface));
    color: var(--incrivel-cardColor, var(--cartao-ink));
}

.cartao-public .cartao-home .cartao-featured > a {
    display: block;
    border-radius: var(--cartao-radius);
    background: var(--incrivel-cardBg, var(--cartao-surface));
    color: var(--incrivel-cardColor, var(--cartao-ink));
    box-shadow: var(--cartao-shadow);
    overflow: hidden;
    text-decoration: none;
}

.cartao-public .cartao-home .cartao-featured :is(h1, p) {
    margin-inline: clamp(16px, 3vw, 30px) !important;
}

.cartao-public .cartao-home .cartao-featured img.SorteioTpl_imagem__2GXxI {
    max-height: clamp(220px, 45vw, 490px) !important;
    object-fit: cover;
}

.cartao-public .cartao-home .cartao-featured .overlay-text {
    border-radius: 9px;
    box-shadow: var(--cartao-shadow);
}

.cartao-public .cartao-home .action-card {
    border: 1px solid var(--cartao-line);
    border-radius: var(--cartao-radius);
    box-shadow: var(--cartao-shadow);
}

.cartao-public .cartao-steps {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.cartao-public .cartao-steps .action-card {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: start;
    gap: 12px;
    min-width: 0;
    margin: 0;
    padding: 16px;
    background: var(--cartao-surface);
    color: var(--cartao-ink);
}

.cartao-public .cartao-steps .action-number {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    margin: 0;
    border-radius: 9px;
    color: var(--cartao-accent-ink);
    background: var(--cartao-accent-wash);
    font-size: 1rem;
    font-weight: 800;
}

.cartao-public .cartao-steps .action-content {
    min-width: 0;
    color: var(--cartao-ink);
}

.cartao-public .cartao-steps .action-content h3 {
    margin-bottom: 5px;
    font-size: .875rem;
    line-height: 1.35;
}

.cartao-public .cartao-steps .action-card .action-content p {
    color: var(--cartao-muted);
    font-size: .8rem;
    line-height: 1.55;
}

.cartao-public .campanha-header {
    overflow: hidden;
    background-color: var(--incrivel-cardBg, var(--cartao-surface));
    color: var(--incrivel-cardColor, var(--cartao-ink));
}

.cartao-public .campanha-header .SorteioTpl_title__3RLtu {
    font-size: clamp(1.3rem, 3vw, 2.2rem) !important;
    line-height: 1.12;
    letter-spacing: -.025em;
}

.cartao-public .campanha-header .carousel-item img.SorteioTpl_imagem__2GXxI {
    max-height: clamp(260px, 44vw, 500px);
    object-fit: contain;
}

.cartao-public .app-main .progress {
    min-height: .8rem;
    border-radius: 100vw;
}

.cartao-public .app-main .progress .bg-progress-bar {
    background-color: var(--cartao-accent) !important;
}

.cartao-public .app-main :is(.numeros-list, .cotas-checkout) {
    font-variant-numeric: tabular-nums;
}

.cartao-public .app-main :is(.numero-template, .quick-add-button, .btn-promo) {
    border-radius: 9px;
    box-shadow: inset 0 0 0 1px #00000016;
}

.cartao-public .app-main .numero-template {
    min-height: 2.35rem;
    display: grid;
    place-items: center;
}

.cartao-public .checkout-button {
    border-radius: 10px;
    box-shadow: 0 5px 14px #182b4229;
    font-weight: 750;
}

.cartao-public .modal:not(#mobileMenu) .modal-content {
    --bs-modal-bg: var(--incrivel-modalBg, var(--cartao-surface));
    --bs-modal-color: var(--incrivel-modalColor, var(--cartao-ink));
    background-color: var(--bs-modal-bg);
    color: var(--bs-modal-color);
}

.cartao-public .modal :is(.modal-header, .modal-footer) { border-color: var(--cartao-line); }
.cartao-public .modal .modal-title { font-weight: 750; letter-spacing: -.015em; }

.cartao-public :is(#modal-checkout, #loginModal, #cadastroModal) .modal-header {
    border-top: 4px solid var(--incrivel-checkout-color-p, var(--cartao-accent));
    padding-inline: clamp(16px, 4vw, 28px);
}

.cartao-public :is(#modal-checkout, #loginModal, #cadastroModal) .modal-body {
    padding-inline: clamp(14px, 3vw, 24px);
}

.cartao-public :is(#modal-checkout, #loginModal, #cadastroModal) :is(.alert-message, .alert-message-danger) {
    border-radius: 10px;
}

.cartao-public :is(.app-form, .checkout, #loginModal) :is(.form-control, .form-select) {
    border-radius: 9px;
    border-color: var(--incrivel-formBorder, var(--cartao-line));
}

.cartao-public :is(.compra-status, .compra-pagamento, .detalhes-compra) {
    max-width: 840px;
    margin-inline: auto;
}

.cartao-public .app-main .app-alerta-msg { border-radius: var(--cartao-radius); }

.cartao-public .rodape {
    margin-top: 1.5rem;
    border-top: 1px solid var(--cartao-line);
}

/* Administrative and affiliate shells share spacing and visual treatments. */
body.cartao-admin {
    --cartao-surface: #fff;
    --cartao-ink: #202b3c;
    background: var(--cartao-canvas) !important;
    color: var(--cartao-ink);
}

html.theme-dark body.cartao-admin {
    --cartao-surface: #192332;
    --cartao-ink: #e9eef8;
}

.cartao-admin .sidenav.navbar {
    background: linear-gradient(170deg, var(--cartao-nav), color-mix(in srgb, var(--cartao-nav) 79%, #111c2b)) !important;
    color: var(--cartao-nav-ink);
    border-radius: 15px !important;
    box-shadow: var(--cartao-shadow);
}

.cartao-admin .sidenav :is(.navbar-brand, .navbar-nav .nav-link) {
    color: var(--cartao-nav-ink) !important;
}

.cartao-admin .sidenav .navbar-nav .nav-link {
    border-radius: 9px;
    min-height: 40px;
}

.cartao-admin .sidenav .nav-link .icon.icon-shape {
    color: var(--cartao-accent-ink);
    background: color-mix(in srgb, #fff 88%, var(--cartao-accent)) !important;
    box-shadow: none !important;
}

.cartao-admin .sidenav .navbar-nav .nav-link:hover {
    background-color: color-mix(in srgb, var(--cartao-accent) 36%, var(--cartao-nav));
}

.cartao-admin .sidenav .navbar-nav .nav-link.active {
    background: color-mix(in srgb, var(--cartao-accent) 72%, var(--cartao-nav)) !important;
    box-shadow: inset 0 0 0 1px #ffffff24;
}

.cartao-admin .main-content { color: var(--cartao-ink); }
.cartao-admin .main-content .navbar-main { border-bottom: 1px solid var(--cartao-line); }
.cartao-admin .main-content .navbar-main h6 { font-size: 1rem; letter-spacing: -.025em; }

.cartao-admin .main-content :is(.card, .tabs-container) {
    border-radius: var(--cartao-radius);
    box-shadow: var(--cartao-shadow);
}

.cartao-admin .main-content .card {
    border: 1px solid var(--cartao-line);
    background-color: var(--cartao-surface);
}

.cartao-admin .main-content .card :is(h5, h6) { letter-spacing: -.015em; }

.cartao-admin .main-content .container.grid:has(> .row > .cartao-metrics) {
    grid-template-columns: minmax(0, 1fr);
}

.cartao-admin .main-content .cartao-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    width: 100%;
    min-width: 0;
    margin-bottom: 20px;
}

.cartao-admin .cartao-metrics > .row { display: contents; }
.cartao-admin .cartao-metrics > .row > [class*="col-"] {
    width: auto;
    min-width: 0;
    padding: 0;
    margin-top: 0 !important;
}

.cartao-admin .main-content .cartao-metrics > .row > [class*="col-"] > .card {
    min-height: 136px;
    background: linear-gradient(148deg, var(--cartao-surface) 56%, var(--cartao-accent-wash)) !important;
}

.cartao-admin .cartao-metrics > .row > [class*="col-"] > .card > .mask { opacity: .035 !important; }
.cartao-admin .cartao-metrics > .row > [class*="col-"] > .card :is(.text-white, .text-white-200, .text-gray-200) {
    color: var(--cartao-ink) !important;
}

.cartao-admin .cartao-metrics .icon.icon-shape {
    color: var(--cartao-accent-ink);
    background-color: var(--cartao-accent-wash) !important;
    box-shadow: none !important;
}

html.theme-dark .cartao-admin .cartao-metrics .icon.icon-shape { color: var(--cartao-ink); }

.cartao-admin .main-content :is(.form-control, .form-select, .form-input) {
    border-radius: 8px;
    border-color: var(--cartao-line);
}

.cartao-admin .main-content :is(.btn, .badge) { border-radius: 8px; }
.cartao-admin .main-content .btn-primary {
    background-color: var(--cartao-accent-ink);
    border-color: var(--cartao-accent-ink);
}

.cartao-admin .main-content .table-responsive {
    border: 1px solid var(--cartao-line);
    border-radius: 11px;
}

.cartao-admin .main-content :is(.table, .table-responsive table, .overflow-x-auto > table) {
    --bs-table-color: var(--cartao-ink);
    margin-bottom: 0;
}

.cartao-admin .main-content :is(.table, .table-responsive table, .overflow-x-auto > table) thead th {
    background: var(--cartao-accent-wash);
    border-color: var(--cartao-line);
    font-weight: 750;
}

.cartao-admin .main-content :is(.table, .table-responsive table, .overflow-x-auto > table) tbody tr:hover > * {
    background-color: var(--cartao-canvas);
}

.cartao-admin .main-content :is(.table, .table-responsive table, .overflow-x-auto > table) :is(th, td) {
    border-color: var(--cartao-line);
}

.cartao-access > .min-h-screen {
    background: linear-gradient(150deg, var(--cartao-accent-wash), var(--cartao-canvas));
}

.cartao-access .shadow-xl {
    border: 1px solid var(--cartao-line);
    border-radius: 18px;
    box-shadow: var(--cartao-shadow);
}

.cartao-access :is(.form-input, button[type="submit"]) { border-radius: 9px; }
.cartao-access button[type="submit"] { background: var(--cartao-accent-ink); }

@media screen {
    .cartao-report { background: var(--cartao-canvas); color: var(--cartao-ink); }
    .cartao-report .card-footer { border-radius: 10px; }
    .cartao-report thead th { background: var(--cartao-accent-wash); }
}

@media (min-width: 576px) {
    .cartao-public :is(#modal-checkout, #loginModal, #cadastroModal) .modal-dialog {
        max-width: min(600px, calc(100vw - 48px));
    }

    .cartao-public :is(#modal-checkout, #loginModal, #cadastroModal) .modal-content {
        border-radius: 16px !important;
        overflow: hidden;
    }
}

@media (min-width: 1040px) {
    .cartao-public .cartao-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (min-width: 1200px) {
    .cartao-admin .main-content .cartao-metrics {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 16px;
    }
}

@media (max-width: 1199.98px) {
    .cartao-admin .sidenav.fixed-start ~ .main-content { margin-left: 0 !important; }
}

@media (max-width: 575px) {
    .cartao-public .cartao-hero-art { opacity: .55; }
    .cartao-public .cartao-hero h1 { max-width: 14ch; }
    .cartao-public .cartao-steps { grid-template-columns: 1fr; }
    .cartao-public .app-main .numero-template { min-height: 2.1rem; }
    .cartao-admin .main-content .cartao-metrics > .row > [class*="col-"] > .card { min-height: 122px; }
    .cartao-admin .cartao-metrics .card-body > .row > .col-8 { width: 100%; }
    .cartao-admin .cartao-metrics .card-body > .row > .col-4 {
        position: absolute;
        inset: 14px 10px auto auto;
        width: auto;
    }
    .cartao-admin .main-content .table-responsive { border-radius: 8px; }
}