/* =========================================================
   NivelDigital AI Studio — skin.css V8.39
   Visual vibrante, moderno e sem alterar a estrutura
   Carregar APÓS style.css
   ========================================================= */

:root{
    --skin-red:#E03030;
    --skin-red-hover:#C62828;
    --skin-red-light:#FFF1F1;

    --skin-blue:#3157E8;
    --skin-blue-light:#EEF2FF;

    --skin-yellow:#F4B400;
    --skin-yellow-light:#FFF7D6;

    --skin-green:#198754;
    --skin-green-light:#ECFDF3;

    --skin-purple:#7C3AED;
    --skin-purple-light:#F4F0FF;

    --skin-text:#1A1A1A;
    --skin-muted:#6B7280;
    --skin-border:#D9DDE5;

    --skin-bg:#FFFFFF;
    --skin-box:#F4F4F4;

    --bs-primary:#E03030;
    --bs-primary-rgb:224,48,48;
    --bs-link-color:#E03030;
    --bs-link-hover-color:#C62828;
    --bs-border-color:#D9DDE5;
    --bs-body-color:#1A1A1A;
    --bs-body-bg:#FFFFFF;
}

html,
body{
    min-height:100%;
    background:#FFFFFF !important;
}

body{
    margin:0;
    color:var(--skin-text) !important;
    background:#FFFFFF !important;
    background-image:none !important;
    font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif !important;
    font-size:15px !important;
    font-weight:400;
    line-height:1.55;
}

/* Sem radius/sombra/gradiente/filtro */
*,
*::before,
*::after{
    border-radius:0 !important;
    box-shadow:none !important;
    text-shadow:none !important;
    filter:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
}

button,
.btn,
input,
textarea,
select,
.card,
.alert,
.badge,
.dropdown-menu,
.modal-content,
.offcanvas,
.toast,
.progress,
.progress-bar{
    background-image:none !important;
}

/* Peso máximo 800 */
strong,
b,
.fw-bold,
.fw-bolder,
.fw-black,
.form-label,
.section-kicker,
.stat-value,
.wallet-mini-value,
.wallet-balance-value,
.btn,
.nav-link-premium,
.user-chip,
.balance-chip{
    font-weight:800 !important;
}

/* ---------------------------------------------------------
   TIPOGRAFIA
   --------------------------------------------------------- */

h1,h2,h3,h4,h5,h6{
    color:#161616 !important;
    font-weight:800 !important;
    letter-spacing:-.025em !important;
}

.hero h1{
    font-size:clamp(2.1rem,5vw,3.6rem) !important;
}

p,
.small-muted,
.text-muted,
.stat-label{
    color:var(--skin-muted) !important;
}

a{
    color:var(--skin-red);
}

a:hover{
    color:var(--skin-red-hover);
}

/* ---------------------------------------------------------
   HERO / ÁREAS DE DESTAQUE
   --------------------------------------------------------- */

.hero{
    background:#FFFFFF !important;
    position:relative;
}

.hero::after{
    content:"";
    display:block;
    width:74px;
    height:5px;
    margin:18px auto 0;
    background:var(--skin-red);
}

.hero-badge{
    display:inline-flex;
    align-items:center;
    gap:7px;
    background:var(--skin-yellow-light) !important;
    color:#8A5A00 !important;
    border:1px solid #F0D36A !important;
    padding:7px 12px !important;
    font-size:12px !important;
    font-weight:800 !important;
}

.meta-pill{
    background:var(--skin-blue-light) !important;
    color:var(--skin-blue) !important;
    border:1px solid #CFD8FF !important;
}

.category-chip{
    background:var(--skin-purple-light) !important;
    color:var(--skin-purple) !important;
    border:1px solid #DDD0FF !important;
}

/* ---------------------------------------------------------
   BOXES / CARDS
   --------------------------------------------------------- */

.premium-card,
.card,
.stat-card,
.login-card,
.loading-card,
.wallet-mini-panel,
.wallet-balance-card,
.pix-qr-wrap,
.upload-box,
.paste-image-wrapper{
    background:var(--skin-box) !important;
    border:1px solid var(--skin-border) !important;
}

.card-inner{
    background:transparent !important;
}

.premium-card{
    border-left:4px solid var(--skin-red) !important;
}

.premium-card:nth-of-type(2n){
    border-left-color:var(--skin-blue) !important;
}

.premium-card:nth-of-type(3n){
    border-left-color:var(--skin-yellow) !important;
}

.stat-card{
    border-top:4px solid var(--skin-blue) !important;
}

.wallet-mini-panel{
    border-left:4px solid var(--skin-green) !important;
}

.upload-box,
.paste-image-wrapper{
    background:#FAFAFA !important;
    border:1px dotted #C7CDD7 !important;
}

.upload-box:hover,
.paste-image-wrapper:hover,
.paste-image-wrapper:focus,
.paste-image-wrapper:focus-within{
    background:#FFFFFF !important;
    border-color:var(--skin-red) !important;
}

/* ---------------------------------------------------------
   SECTION KICKER
   --------------------------------------------------------- */

.section-kicker{
    display:inline-block;
    color:var(--skin-red) !important;
    background:var(--skin-red-light) !important;
    border-left:4px solid var(--skin-red) !important;
    padding:5px 8px !important;
    font-size:11px !important;
    line-height:1.2;
    letter-spacing:.12em !important;
    text-transform:uppercase !important;
    font-weight:800 !important;
}

/* ---------------------------------------------------------
   INPUTS
   --------------------------------------------------------- */

.form-label{
    color:#202020 !important;
    font-size:13px !important;
    font-weight:700 !important;
    margin-bottom:6px;
}

.form-control,
.form-select,
.form-control-color,
.input-group-text{
    min-height:48px;
    padding:.72rem .84rem;
    background:#FFFFFF !important;
    color:#1A1A1A !important;
    border:2px solid #D5D9E1 !important;
    font-size:15px !important;
    transition:
        border-color .16s ease,
        background-color .16s ease,
        transform .12s ease !important;
}

textarea.form-control{
    min-height:112px;
}

.form-control:hover,
.form-select:hover{
    border-color:#B8BEC9 !important;
}

.form-control:focus,
.form-select:focus,
.form-control-color:focus{
    border-color:var(--skin-red) !important;
    background:#FFFFFF !important;
    outline:0 !important;
    box-shadow:0 0 0 .20rem rgba(224,48,48,.12) !important;
}

.form-control::placeholder,
textarea.form-control::placeholder{
    color:#A0A6B1 !important;
}

.input-group-text:not(.color-preview){
    background:#F8F8F8 !important;
}

/* ---------------------------------------------------------
   BOTÕES — TODOS COM EFEITO
   --------------------------------------------------------- */

.btn{
    position:relative;
    overflow:hidden;
    font-size:14px !important;
    font-weight:700 !important;
    border-width:2px !important;
    transition:
        transform .14s ease,
        background-color .16s ease,
        border-color .16s ease,
        color .16s ease !important;
}

.btn:hover{
    transform:translateY(-2px);
}

.btn:active{
    transform:translateY(1px) scale(.99);
}

.btn-primary,
.btn-premium,
.btn-danger{
    background:var(--skin-red) !important;
    border-color:var(--skin-red) !important;
    color:#FFFFFF !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-premium:hover,
.btn-premium:focus,
.btn-danger:hover,
.btn-danger:focus{
    background:var(--skin-red-hover) !important;
    border-color:var(--skin-red-hover) !important;
    color:#FFFFFF !important;
}

.btn-outline-primary{
    background:#FFFFFF !important;
    border-color:var(--skin-red) !important;
    color:var(--skin-red) !important;
}

.btn-outline-primary:hover{
    background:var(--skin-red-light) !important;
    color:var(--skin-red-hover) !important;
}

.btn-outline-secondary,
.btn-secondary{
    background:#FFFFFF !important;
    border-color:#BFC5CE !important;
    color:#4B5563 !important;
}

.btn-outline-secondary:hover,
.btn-secondary:hover{
    background:#F1F2F4 !important;
    border-color:#9299A4 !important;
    color:#1A1A1A !important;
}

.btn-success{
    background:var(--skin-green) !important;
    border-color:var(--skin-green) !important;
    color:#FFFFFF !important;
}

.btn-warning{
    background:var(--skin-yellow) !important;
    border-color:var(--skin-yellow) !important;
    color:#191919 !important;
}

/* ---------------------------------------------------------
   ALERTAS
   --------------------------------------------------------- */

.alert{
    background:#FFFFFF !important;
    border:1px solid var(--skin-border) !important;
    color:#1A1A1A !important;
}

.alert-success{
    background:var(--skin-green-light) !important;
    border-left:5px solid var(--skin-green) !important;
}

.alert-danger{
    background:#FFF1F1 !important;
    border-left:5px solid #DC3545 !important;
}

.alert-warning{
    background:var(--skin-yellow-light) !important;
    border-left:5px solid var(--skin-yellow) !important;
}

.alert-info{
    background:var(--skin-blue-light) !important;
    border-left:5px solid var(--skin-blue) !important;
}

/* ---------------------------------------------------------
   TABELAS
   --------------------------------------------------------- */

.table{
    --bs-table-bg:#FFFFFF;
    --bs-table-color:#1A1A1A;
    --bs-table-border-color:#E1E4E9;
    margin-bottom:0;
}

.table-premium thead th,
.table thead th{
    background:#ECEDEF !important;
    color:#4B5563 !important;
    font-size:11px !important;
    font-weight:800 !important;
    letter-spacing:.06em;
    text-transform:uppercase;
    border-bottom:2px solid #D5D9E1 !important;
}

.table td,
.table th{
    border-color:#E1E4E9 !important;
}

.table-hover > tbody > tr:hover > *{
    background:#FFF7F7 !important;
    color:#1A1A1A !important;
}

/* ---------------------------------------------------------
   CARTEIRA
   --------------------------------------------------------- */

.balance-chip{
    background:var(--skin-green-light) !important;
    color:var(--skin-green) !important;
    border:1px solid #B7E2C7 !important;
}

.balance-chip:hover,
.balance-chip.active{
    background:#DFF7E8 !important;
    color:#12683F !important;
}

.balance-plus{
    background:var(--skin-green) !important;
    color:#FFFFFF !important;
}

.wallet-mini-value,
.wallet-balance-value,
.pix-value{
    color:var(--skin-green) !important;
}

/* ---------------------------------------------------------
   PERFIL / PALETA
   --------------------------------------------------------- */

.profile-color-preview{
    border:2px solid #D5D9E1 !important;
}

.profile-color-input{
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
    font-weight:700 !important;
}

.profile-logo-current img,
.admin-logo-preview,
.admin-client-logo,
.result-image,
.preview-logo{
    background:#FFFFFF !important;
    border:2px solid #D5D9E1 !important;
}

/* ---------------------------------------------------------
   LOADING
   --------------------------------------------------------- */

.loading-overlay{
    background:rgba(255,255,255,.94) !important;
}

.loading-card{
    background:var(--skin-box) !important;
    border:2px solid var(--skin-border) !important;
}

.loading-orbit{
    border-color:#DDE0E5 !important;
    border-top-color:var(--skin-red) !important;
}

/* ---------------------------------------------------------
   NAVBAR
   --------------------------------------------------------- */

.brand-bar,
.client-brand-bar,
.admin-brand-bar{
    background:#FFFFFF !important;
    border:0 !important;
    border-bottom:2px solid #ECEEF2 !important;
    padding:10px 0 !important;
}

.navbar-brand{
    color:#1A1A1A !important;
}

.nav-link-premium{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:4px;

    padding:8px 10px !important;
    color:#6B7280 !important;
    background:#FFFFFF !important;
    border:0 !important;
    border-bottom:3px solid transparent !important;

    font-size:13px !important;
    font-weight:600 !important;
    white-space:nowrap;
    text-decoration:none !important;

    transition:
        color .16s ease,
        background-color .16s ease,
        transform .14s ease,
        border-color .16s ease !important;
}

.nav-link-premium:hover{
    color:var(--skin-red) !important;
    background:var(--skin-red-light) !important;
    transform:translateY(-1px);
}

.nav-link-premium.active{
    color:var(--skin-red) !important;
    background:var(--skin-red-light) !important;
    border-bottom-color:var(--skin-red) !important;
}

.user-chip{
    background:var(--skin-blue-light) !important;
    color:var(--skin-blue) !important;
    border:1px solid #D3DBFF !important;
    font-size:13px !important;
    font-weight:600 !important;
    transition:
        background-color .16s ease,
        transform .14s ease !important;
}

.user-chip:hover,
.user-chip.active{
    background:#DDE5FF !important;
    color:#2444C7 !important;
    transform:translateY(-1px);
}

.admin-badge{
    background:#171717 !important;
    color:#FFFFFF !important;
    border:1px solid #171717 !important;
}

.navbar-toggler{
    border:2px solid #D5D9E1 !important;
    background:#FFFFFF !important;
    transition:
        border-color .16s ease,
        transform .14s ease !important;
}

.navbar-toggler:hover{
    border-color:var(--skin-red) !important;
    transform:scale(1.03);
}

.navbar-toggler:focus{
    border-color:var(--skin-red) !important;
    box-shadow:0 0 0 .18rem rgba(224,48,48,.12) !important;
}

/* ---------------------------------------------------------
   PAGINAÇÃO
   --------------------------------------------------------- */

.page-link{
    color:#6B7280 !important;
    background:#FFFFFF !important;
    border:1px solid #D9DDE5 !important;
}

.page-link:hover{
    color:var(--skin-red) !important;
    background:var(--skin-red-light) !important;
}

.active > .page-link,
.page-link.active{
    color:#FFFFFF !important;
    background:var(--skin-red) !important;
    border-color:var(--skin-red) !important;
}

/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width:767.98px){

    .app-shell{
        padding-left:14px !important;
        padding-right:14px !important;
    }

    .navbar-collapse{
        margin-top:8px;
        border-top:1px solid #E5E7EB !important;
        background:#FFFFFF !important;
    }

    .client-menu-actions,
    .navbar-collapse .navbar-nav{
        width:100%;
    }

    .client-menu-actions .nav-link-premium,
    .client-menu-actions .balance-chip,
    .client-menu-actions .user-chip,
    .navbar-collapse .nav-link-premium{
        width:100% !important;
        justify-content:flex-start !important;
        margin:0 !important;
        border-left:0 !important;
        border-right:0 !important;
        border-top:0 !important;
        border-bottom:1px solid #E5E7EB !important;
        padding:11px 8px !important;
    }

    .nav-link-premium.active{
        border-left:4px solid var(--skin-red) !important;
        border-bottom:1px solid #E5E7EB !important;
    }

    .premium-card{
        border-left-width:4px !important;
    }
}

/* ---------------------------------------------------------
   ACESSIBILIDADE
   --------------------------------------------------------- */

:focus-visible{
    outline:2px solid rgba(224,48,48,.35) !important;
    outline-offset:2px;
}

.form-control:focus-visible,
.form-select:focus-visible{
    outline:0 !important;
}

/* =========================================================
   V8.30 - CAMADA VISUAL FINAL
   ========================================================= */

/* Fundo geral */
body{
    background:#FFFFFF !important;
}

/* Cards/boxes */
.premium-card,
.card,
.stat-card,
.wallet-mini-panel,
.wallet-balance-card,
.login-card,
.loading-card,
.prompt-client-card,
.field-row,
.prompt-image-preview-box{
    background:#F4F4F4 !important;
}

/* Mais personalidade nos cards principais */
.premium-card{
    border-top:1px solid #E3E5EA !important;
    border-right:1px solid #E3E5EA !important;
    border-bottom:1px solid #E3E5EA !important;
}

.premium-card:hover{
    background:#F7F7F7 !important;
}

/* Inputs mais marcados */
.form-control,
.form-select,
.form-control-color,
.input-group-text{
    border-width:2px !important;
}

.form-control:hover,
.form-select:hover{
    border-color:#AEB5C0 !important;
}

.form-control:focus,
.form-select:focus,
.form-control-color:focus{
    border-color:#E03030 !important;
    box-shadow:0 0 0 .20rem rgba(224,48,48,.12) !important;
}

.btn-outline-primary:hover{
    border-color:#C62828 !important;
}

.btn-outline-danger{
    background:#FFFFFF !important;
    border:2px solid #DC3545 !important;
    color:#DC3545 !important;
}

.btn-outline-danger:hover{
    background:#FFF0F0 !important;
    color:#B4232C !important;
    border-color:#B4232C !important;
}

/* Navbar com presença maior */
.brand-bar,
.client-brand-bar,
.admin-brand-bar{
    background:#FFFFFF !important;
    border-bottom:3px solid #ECEEF2 !important;
}

.nav-link-premium{
    position:relative;
}

.nav-link-premium.active{
    color:#E03030 !important;
    background:#FFF1F1 !important;
}

.nav-link-premium.active::after{
    content:"";
    position:absolute;
    left:10px;
    right:10px;
    bottom:-3px;
    height:3px;
    background:#E03030;
}

.user-chip{
    background:#EEF2FF !important;
    border:2px solid #D3DBFF !important;
}

.balance-chip{
    border:2px solid #B7E2C7 !important;
}

/* Dashboard administrativo mais vivo */
.admin-dashboard-stats .stat-card:nth-child(1n) .stat-icon{
    background:#EEF2FF !important;
    color:#3157E8 !important;
}

.admin-dashboard-stats > div:nth-child(2) .stat-card{
    border-top-color:#198754 !important;
}

.admin-dashboard-stats > div:nth-child(2) .stat-icon{
    background:#ECFDF3 !important;
    color:#198754 !important;
}

.admin-dashboard-stats > div:nth-child(3) .stat-card{
    border-top-color:#7C3AED !important;
}

.admin-dashboard-stats > div:nth-child(3) .stat-icon{
    background:#F4F0FF !important;
    color:#7C3AED !important;
}

.admin-dashboard-stats > div:nth-child(4) .stat-card{
    border-top-color:#F4B400 !important;
}

.admin-dashboard-stats > div:nth-child(4) .stat-icon{
    background:#FFF7D6 !important;
    color:#9A6B00 !important;
}

/* Financeiro */
.admin-finance-stats > div:nth-child(1) .wallet-balance-card{
    border-left:5px solid #198754 !important;
}

.admin-finance-stats > div:nth-child(2) .wallet-balance-card{
    border-left:5px solid #3157E8 !important;
}

.admin-finance-stats > div:nth-child(3) .wallet-balance-card{
    border-left:5px solid #7C3AED !important;
}

/* Tabelas */
.table-premium tbody tr{
    transition:background-color .14s ease;
}

.table-premium tbody tr:hover > *{
    background:#FFF5F5 !important;
}

/* Uploads */
.upload-box,
.paste-image-wrapper{
    background:#FFFFFF !important;
    border:1px dotted #C7CDD7 !important;
}

.upload-box:hover,
.paste-image-wrapper:hover,
.paste-image-wrapper:focus,
.paste-image-wrapper:focus-within{
    background:#FFFDFD !important;
    border-color:#E03030 !important;
}

/* Prompt/admin */
.prompt-client-card.on{
    border-left:5px solid #E03030 !important;
}

.prompt-client-card.off{
    opacity:.62;
}

.field-row{
    border-left:5px solid #3157E8 !important;
}

.imagem-prompt-row,
.prompt-image-preview-box{
    border-left-color:#F4B400 !important;
}

/* Alertas */
.alert{
    border-width:1px !important;
}

/* Mobile */
@media (max-width:767.98px){

    .navbar-collapse{
        background:#FFFFFF !important;
        border-top:2px solid #ECEEF2 !important;
    }

    .nav-link-premium.active::after{
        display:none;
    }

    .nav-link-premium.active{
        border-left:4px solid #E03030 !important;
    }


}

/* =========================================================
   V8.33 - CORREÇÕES CONSOLIDADAS
   ========================================================= */

/* ---------------------------------------------------------
   PREVIEW DE CORES — ADMIN / CLIENTE_FORM
   --------------------------------------------------------- */

/*
 * O cliente_form.php usa:
 * <span class="input-group-text color-preview" style="background-color:#HEX">
 *
 * O preview não pode receber o fundo genérico de .input-group-text.
 */
.input-group-text:not(.color-preview){
    background:#F8F8F8 !important;
}

.color-hex-group .color-preview,
.input-group-text.color-preview{
    width:48px;
    min-width:48px;
    min-height:48px;
    padding:0 !important;
    background-image:none !important;
    border:2px solid #D5D9E1 !important;
    border-right:0 !important;
}

/* Mantém contraste em tons claros sem substituir a cor */
.color-hex-group .color-preview::after,
.input-group-text.color-preview::after{
    content:"";
    display:block;
    width:100%;
    height:100%;
    min-height:44px;
    border:1px solid rgba(0,0,0,.05);
    pointer-events:none;
}

/* Preview da área do cliente */
.profile-color-preview{
    min-height:48px;
    border:2px solid #D5D9E1 !important;
    background-image:none !important;
}

/* ---------------------------------------------------------
   BOTÕES — EFEITO MODERNO SEM ESCONDER CONTEÚDO
   --------------------------------------------------------- */

.btn::before,
.btn::after,
.btn-primary::before,
.btn-primary::after,
.btn-premium::before,
.btn-premium::after,
.btn-danger::before,
.btn-danger::after{
    content:none !important;
    display:none !important;
}

.btn{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:5px;
    position:relative;
    overflow:visible !important;
    opacity:1 !important;
    visibility:visible !important;
    transform:translateY(0);
    transition:
        transform .14s ease,
        background-color .16s ease,
        border-color .16s ease,
        color .16s ease !important;
}

.btn:hover{
    transform:translateY(-2px);
}

.btn:active{
    transform:translateY(1px) scale(.985);
}

.btn-primary,
.btn-premium,
.btn-danger{
    padding:.72rem 1.2rem !important;
    background:#E03030 !important;
    border:2px solid #E03030 !important;
    color:#FFFFFF !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-premium:hover,
.btn-premium:focus,
.btn-danger:hover,
.btn-danger:focus{
    background:#C62828 !important;
    border-color:#C62828 !important;
    color:#FFFFFF !important;
}

.btn-outline-primary{
    background:#FFFFFF !important;
    border:2px solid #E03030 !important;
    color:#E03030 !important;
}

.btn-outline-primary:hover{
    background:#FFF1F1 !important;
    border-color:#C62828 !important;
    color:#C62828 !important;
}

.btn-outline-secondary,
.btn-secondary{
    background:#FFFFFF !important;
    border:2px solid #BFC5CE !important;
    color:#4B5563 !important;
}

.btn-outline-secondary:hover,
.btn-secondary:hover{
    background:#F1F2F4 !important;
    border-color:#9299A4 !important;
    color:#1A1A1A !important;
}

.btn-outline-danger{
    background:#FFFFFF !important;
    border:2px solid #DC3545 !important;
    color:#DC3545 !important;
}

.btn-outline-danger:hover{
    background:#FFF0F0 !important;
    border-color:#B4232C !important;
    color:#B4232C !important;
}

.btn-success{
    background:#198754 !important;
    border:2px solid #198754 !important;
    color:#FFFFFF !important;
}

.btn-warning{
    background:#F4B400 !important;
    border:2px solid #F4B400 !important;
    color:#191919 !important;
}

.btn-sm{
    min-height:36px;
    padding:.40rem .70rem !important;
    font-size:13px !important;
}

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

.btn > i,
.btn > span{
    position:relative;
    z-index:1;
}

/* ---------------------------------------------------------
   INPUTS
   --------------------------------------------------------- */

.form-control,
.form-select,
.form-control-color,
.input-group-text{
    border-width:2px !important;
}

.form-control:focus,
.form-select:focus,
.form-control-color:focus{
    border-color:#E03030 !important;
    box-shadow:0 0 0 .20rem rgba(224,48,48,.12) !important;
}

/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width:767.98px){

    .btn{
        min-height:44px;
    }

    .btn-primary,
    .btn-premium,
    .btn-danger{
        min-height:46px;
    }

    .color-hex-group .color-preview,
    .input-group-text.color-preview{
        width:44px;
        min-width:44px;
    }
}

/* =========================================================
   V8.34 - CONTRASTE DOS CARDS FINANCEIROS
   ========================================================= */

/*
 * Os cards do financeiro usam .wallet-balance-card e no HTML
 * os títulos recebem classes Bootstrap com opacity.
 * Forçamos títulos escuros para garantir leitura no fundo #F4F4F4.
 */
.admin-finance-stats .wallet-balance-card{
    background:#F4F4F4 !important;
    color:#1A1A1A !important;
}

.admin-finance-stats .wallet-balance-card .small,
.admin-finance-stats .wallet-balance-card .text-uppercase,
.admin-finance-stats .wallet-balance-card .fw-bold,
.admin-finance-stats .wallet-balance-card .opacity-75{
    color:#4B5563 !important;
    opacity:1 !important;
    font-weight:800 !important;
}

.admin-finance-stats .wallet-balance-value{
    color:#198754 !important;
}

/* Cada card mantém sua identidade pela borda lateral */
.admin-finance-stats > div:nth-child(1) .wallet-balance-card{
    border-left:5px solid #198754 !important;
}

.admin-finance-stats > div:nth-child(2) .wallet-balance-card{
    border-left:5px solid #3157E8 !important;
}

.admin-finance-stats > div:nth-child(3) .wallet-balance-card{
    border-left:5px solid #7C3AED !important;
}

/* =========================================================
   V8.35 - FINANCEIRO: CORREÇÃO SEM DEPENDER DO HTML
   ========================================================= */

/*
 * Correção genérica:
 * qualquer texto auxiliar/título dentro de wallet-balance-card
 * fica escuro, mesmo que financeiro.php não tenha
 * a classe .admin-finance-stats.
 */
.wallet-balance-card{
    background:#F4F4F4 !important;
    color:#1A1A1A !important;
}

/* Títulos pequenos dos cards financeiros */
.wallet-balance-card .small,
.wallet-balance-card .text-uppercase,
.wallet-balance-card .fw-bold,
.wallet-balance-card .opacity-75,
.wallet-balance-card div.small,
.wallet-balance-card div.text-uppercase{
    color:#4B5563 !important;
    opacity:1 !important;
}

/* Especificidade extra para vencer Bootstrap/style antigo */
div.wallet-balance-card > div.small.text-uppercase.fw-bold.opacity-75{
    color:#374151 !important;
    opacity:1 !important;
    font-weight:800 !important;
}

/* Valor continua destacado em verde */
.wallet-balance-card .wallet-balance-value,
.wallet-balance-value{
    color:#198754 !important;
    opacity:1 !important;
}

/* =========================================================
   V8.36 - FINANCEIRO: CONTRASTE FORÇADO
   ========================================================= */

/*
 * Regra final com alta especificidade para impedir qualquer
 * herança de texto branco dos estilos antigos.
 */
.wallet-balance-card,
.admin-finance-stats .wallet-balance-card{
    background:#F4F4F4 !important;
    color:#1A1A1A !important;
}

/* Títulos dos cards */
.wallet-balance-card > .small,
.wallet-balance-card > .text-uppercase,
.wallet-balance-card > .fw-bold,
.wallet-balance-card > .opacity-75,
.wallet-balance-card .small.text-uppercase,
.wallet-balance-card .small.fw-bold,
.wallet-balance-card .small.opacity-75,
div.wallet-balance-card > div.small.text-uppercase.fw-bold.opacity-75{
    color:#374151 !important;
    -webkit-text-fill-color:#374151 !important;
    opacity:1 !important;
    font-weight:800 !important;
}

/* Valor financeiro */
.wallet-balance-card .wallet-balance-value,
div.wallet-balance-card > .wallet-balance-value,
.wallet-balance-value{
    color:#198754 !important;
    -webkit-text-fill-color:#198754 !important;
    opacity:1 !important;
    font-weight:800 !important;
}

/* Garante contraste para qualquer texto direto do card */
.wallet-balance-card > div:not(.wallet-balance-value){
    color:#374151 !important;
    -webkit-text-fill-color:#374151 !important;
    opacity:1 !important;
}

/* =========================================================
   V8.39 - TELA DE GERAÇÃO COM CRONÔMETRO
   ========================================================= */

.loading-overlay{
    background:rgba(255,255,255,.97) !important;
    padding:20px;
}

.loading-card{
    width:min(520px,100%);
    padding:38px 34px 32px !important;
    text-align:center;
    background:#F4F4F4 !important;
    border:1px solid #D9DDE5 !important;
}

/*
 * Exceção intencional ao radius 0:
 * somente o indicador animado precisa ser circular.
 */
.loading-orbit{
    position:relative;
    width:86px;
    height:86px;
    margin:0 auto 24px;
    border:6px solid #E1E4E9 !important;
    border-top-color:#E03030 !important;
    border-right-color:#3157E8 !important;
    border-bottom-color:#F4B400 !important;
    border-radius:50% !important;
    animation:ndLoadingSpin 1s linear infinite;
}

.loading-orbit::before,
.loading-orbit::after{
    border-radius:50% !important;
}

.loading-orbit::before{
    content:"";
    position:absolute;
    inset:10px;
    border:3px solid #D5D9E1;
    border-left-color:#198754;
    border-radius:50% !important;
    animation:ndLoadingSpinReverse .72s linear infinite;
}

.loading-orbit-core{
    position:absolute;
    top:50%;
    left:50%;
    width:12px;
    height:12px;
    transform:translate(-50%,-50%);
    background:#E03030;
    border-radius:50% !important;
}

@keyframes ndLoadingSpin{
    to{
        transform:rotate(360deg);
    }
}

@keyframes ndLoadingSpinReverse{
    to{
        transform:rotate(-360deg);
    }
}

.loading-card h4{
    margin:0 0 8px;
    color:#1A1A1A !important;
    font-size:1.35rem;
    font-weight:800 !important;
}

.loading-timer{
    margin:4px 0 16px;
    color:#E03030;
    font-size:2.35rem;
    line-height:1;
    font-weight:800;
    letter-spacing:.04em;
    font-variant-numeric:tabular-nums;
}

.loading-description{
    max-width:410px;
    margin:0 auto;
    color:#6B7280 !important;
    font-size:.95rem;
    line-height:1.6;
}

.loading-estimate{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    margin:20px 0 18px;
    padding:11px 14px;
    background:#FFF7D6;
    color:#7A5200;
    border-left:4px solid #F4B400;
    font-size:.9rem;
    font-weight:700;
}

.loading-estimate i{
    color:#F4B400;
    font-size:1.05rem;
}

.loading-progress-track{
    position:relative;
    width:100%;
    height:6px;
    margin-top:4px;
    overflow:hidden;
    background:#E1E4E9;
}

.loading-progress-bar{
    position:absolute;
    top:0;
    bottom:0;
    left:-38%;
    width:38%;
    background:#3157E8;
    animation:ndLoadingProgress 1.45s ease-in-out infinite;
}

@keyframes ndLoadingProgress{
    0%{
        left:-38%;
        width:38%;
    }

    50%{
        width:52%;
    }

    100%{
        left:100%;
        width:38%;
    }
}

.loading-status-text{
    margin-top:13px;
    color:#6B7280;
    font-size:.78rem;
}

@media (max-width:575.98px){
    .loading-card{
        padding:30px 20px 26px !important;
    }

    .loading-orbit{
        width:74px;
        height:74px;
    }

    .loading-timer{
        font-size:2rem;
    }

    .loading-estimate{
        align-items:flex-start;
        text-align:left;
    }
}

@media (prefers-reduced-motion:reduce){
    .loading-orbit,
    .loading-orbit::before,
    .loading-progress-bar{
        animation-duration:2.8s !important;
    }
}

/* =========================================================
   V8.45 - LEGENDA PARA INSTAGRAM
   ========================================================= */

.instagram-caption-card{
    max-width:1080px;
    margin-left:auto;
    margin-right:auto;
    padding:22px;
    background:#F4F4F4 !important;
    border:1px solid #D9DDE5 !important;
    border-left:5px solid #E03030 !important;
}

.instagram-caption-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-bottom:16px;
}

.instagram-caption-header h4{
    font-size:1.15rem !important;
    font-weight:800 !important;
}

.instagram-caption-text{
    padding:18px;
    background:#FFFFFF !important;
    border:2px solid #D5D9E1 !important;
    color:#1A1A1A !important;
    font-size:15px;
    line-height:1.7;
    white-space:normal;
    overflow-wrap:anywhere;
}

.instagram-copy-feedback{
    min-height:20px;
    margin-top:8px;
    color:#198754;
    font-size:13px;
    font-weight:700;
}

@media (max-width:767.98px){
    .instagram-caption-header{
        align-items:stretch;
        flex-direction:column;
    }

    .instagram-caption-header .btn{
        width:100%;
    }

    .instagram-caption-card{
        padding:16px;
    }

    .instagram-caption-text{
        padding:14px;
    }
}



/* =========================================================
   V8.46 - IMAGENS FIXAS DO CLIENTE
   ========================================================= */

.prompt-client-card .upload-box img{
    display:block;
}

.prompt-client-card .upload-box{
    background:#FFFFFF !important;
}

.form-check-input:checked{
    background-color:#E03030 !important;
    border-color:#E03030 !important;
}

/* =========================================================
   V8.47 - GERAÇÃO POR CÓDIGOS
   ========================================================= */
.code-command{display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-weight:800;color:#7C3AED!important;background:#F4F0FF!important;border:1px solid #DDD0FF!important;padding:4px 8px;}
.code-option-card,.code-description-box{height:100%;padding:18px;background:#FFFFFF!important;border:2px solid #D5D9E1!important;}
.code-description-box{border-left:5px solid #7C3AED!important;color:#374151;}


/* =========================================================
   V8.60 - GERADOR DE CARROSSEIS
   ========================================================= */
.car-slide{background:#F4F4F4!important;}
.car-slide .form-control{background:#fff!important;}
.save-status{color:#198754;}


/* =========================================================
   V8.65 - MENU CLIENTE MODERNO / SAAS
   ========================================================= */

.client-navbar-modern{
    background:#FFFFFF;
    border-bottom:1px solid #E6E9EF;
    min-height:92px;
    padding:14px 0;
}

.client-navbar-inner{
    max-width:1440px;
    margin:0 auto;
    padding-left:28px;
    padding-right:28px;
}

.client-brand-modern{
    display:flex;
    align-items:center;
    margin-right:34px;
    padding:0;
}

.client-brand-logo{
    display:block;
    width:auto;
    max-width:290px;
    height:54px;
    object-fit:contain;
}

.client-navbar-modern .navbar-collapse{
    align-items:center;
}

.client-nav-main{
    display:flex;
    align-items:center;
    gap:10px;
}

.client-nav-action{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-height:46px;
    padding:0 17px;
    background:#FFFFFF;
    border:1px solid #E2E5EA;
    color:#3F4754;
    font-size:14px;
    font-weight:800;
    text-decoration:none;
    cursor:pointer;
    transition:
        transform .16s ease,
        background-color .16s ease,
        border-color .16s ease,
        color .16s ease;
}

.client-nav-action:hover,
.client-nav-action.active{
    color:#E03030;
    border-color:#F2A5A5;
    background:#FFF7F7;
    transform:translateY(-1px);
}

.client-nav-action-primary{
    background:#E03030;
    border-color:#E03030;
    color:#FFFFFF;
}

.client-nav-action-primary:hover,
.client-nav-action-primary.active{
    background:#C62828;
    border-color:#C62828;
    color:#FFFFFF;
}

.client-nav-action.dropdown-toggle::after{
    margin-left:2px;
}

.client-mega-menu{
    width:400px;
    padding:10px;
    margin-top:12px !important;
    background:#FFFFFF;
    border:1px solid #E2E5EA;
    box-shadow:0 16px 40px rgba(20,28,45,.12) !important;
}

.client-mega-menu-compact{
    width:360px;
}

.client-mega-title{
    padding:8px 10px 9px;
    color:#9299A5;
    font-size:11px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.client-mega-item{
    display:flex;
    align-items:flex-start;
    gap:13px;
    padding:13px 12px;
    text-decoration:none;
    color:#171A1F;
    border:1px solid transparent;
    transition:
        transform .14s ease,
        background-color .15s ease,
        border-color .15s ease;
}

.client-mega-item:hover,
.client-mega-item.active{
    background:#F8F9FB;
    border-color:#ECEFF3;
    color:#171A1F;
    transform:translateX(2px);
}

.client-mega-icon{
    flex:0 0 44px;
    width:44px;
    height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
}

.client-mega-icon.icon-red{
    background:#FFF0F0;
    color:#E03030;
}

.client-mega-icon.icon-purple{
    background:#F4F0FF;
    color:#7C3AED;
}

.client-mega-icon.icon-blue{
    background:#EEF2FF;
    color:#3157E8;
}

.client-mega-icon.icon-yellow{
    background:#FFF7D6;
    color:#A56D00;
}

.client-mega-copy{
    display:flex;
    flex-direction:column;
    gap:3px;
    min-width:0;
}

.client-mega-copy strong{
    color:#171A1F;
    font-size:14px;
    font-weight:800;
}

.client-mega-copy small{
    display:block;
    color:#737B89;
    font-size:12px;
    line-height:1.35;
    font-weight:500;
}

.client-nav-account{
    margin-left:auto;
    display:flex;
    align-items:center;
    gap:9px;
}

.client-balance-modern,
.client-profile-modern,
.client-logout-modern{
    text-decoration:none;
}

.client-balance-modern{
    min-height:46px;
    display:inline-flex;
    align-items:center;
    border:1px solid #A8E5C2;
    background:#ECFDF3;
    color:#087A42;
}

.client-balance-icon{
    width:42px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.client-balance-value{
    padding:0 11px 0 0;
    white-space:nowrap;
    font-size:14px;
    font-weight:800;
}

.client-balance-plus{
    align-self:stretch;
    width:38px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#198754;
    color:#FFFFFF;
}

.client-balance-modern:hover{
    color:#066438;
    border-color:#73D49D;
}

.client-profile-modern{
    min-height:46px;
    max-width:220px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:0 11px;
    background:#F6F8FF;
    border:1px solid #CED7FF;
    color:#3157E8;
}

.client-profile-modern:hover{
    background:#EEF2FF;
    color:#2746BE;
}

.client-profile-avatar{
    width:28px;
    height:28px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#FFFFFF;
    border:1px solid #D6DEFF;
}

.client-profile-name{
    max-width:130px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:13px;
    font-weight:800;
}

.client-profile-edit{
    font-size:12px;
}

.client-logout-modern{
    width:46px;
    height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid #E2E5EA;
    background:#FFFFFF;
    color:#646D7A;
    font-size:18px;
}

.client-logout-modern:hover{
    color:#E03030;
    border-color:#F0A0A0;
    background:#FFF7F7;
}

.client-navbar-toggler{
    width:48px;
    height:46px;
    padding:0 !important;
    border:1px solid #E2E5EA !important;
    background:#FFFFFF !important;
    color:#20242B !important;
    font-size:24px;
    box-shadow:none !important;
}

@media (max-width:1199.98px){

    .client-navbar-inner{
        padding-left:20px;
        padding-right:20px;
    }

    .client-brand-logo{
        max-width:235px;
        height:48px;
    }

    .client-brand-modern{
        margin-right:20px;
    }

    .client-nav-action{
        padding-left:13px;
        padding-right:13px;
    }

    .client-profile-name{
        max-width:90px;
    }
}

@media (max-width:991.98px){

    .client-navbar-modern{
        min-height:auto;
        padding:12px 0;
    }

    .client-navbar-modern .navbar-collapse{
        margin-top:14px;
        padding-top:14px;
        border-top:1px solid #ECEFF3;
    }

    .client-nav-main,
    .client-nav-account{
        width:100%;
        flex-direction:column;
        align-items:stretch;
        gap:9px;
    }

    .client-nav-account{
        margin-top:14px;
        padding-top:14px;
        border-top:1px solid #ECEFF3;
    }

    .client-nav-main .dropdown{
        width:100%;
    }

    .client-nav-action{
        width:100%;
        justify-content:flex-start;
    }

    .client-mega-menu,
    .client-mega-menu-compact{
        width:100%;
        position:static !important;
        transform:none !important;
        margin-top:7px !important;
        box-shadow:none !important;
    }

    .client-balance-modern,
    .client-profile-modern{
        width:100%;
        max-width:none;
    }

    .client-profile-name{
        max-width:none;
        flex:1;
    }

    .client-logout-modern{
        width:100%;
    }
}

@media (max-width:575.98px){

    .client-navbar-inner{
        padding-left:14px;
        padding-right:14px;
    }

    .client-brand-logo{
        max-width:205px;
        height:44px;
    }

    .client-mega-menu{
        padding:7px;
    }

    .client-mega-item{
        padding:11px 9px;
    }

    .client-mega-icon{
        flex-basis:40px;
        width:40px;
        height:40px;
    }
}


/* =========================================================
   V8.66 - SALDO E RECARGAS
   ========================================================= */

.wallet-balance-summary-card{
    margin-top:0 !important;
    padding:clamp(22px,4vw,42px) !important;
    line-height:normal !important;
    letter-spacing:normal !important;
    border-left:4px solid #3157E8 !important;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.wallet-summary-header{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    padding-bottom:22px;
    margin-bottom:18px;
    border-bottom:1px solid #D9DDE5;
}

.wallet-balance-summary-card .wallet-balance-value{
    margin-top:5px;
    font-size:clamp(27px,3vw,38px) !important;
    line-height:1 !important;
    letter-spacing:-.04em !important;
}

.wallet-summary-icon{
    flex:0 0 48px;
    width:48px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#ECFDF3;
    border:1px solid #A8E5C2;
    color:#198754 !important;
    font-size:21px;
}

.wallet-price-list{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.wallet-price-item{
    display:grid;
    grid-template-columns:38px minmax(0,1fr) auto;
    align-items:center;
    gap:11px;
    min-height:54px;
    padding:8px 10px;
    background:#FFFFFF;
    border:1px solid #E1E5EB;
}

.wallet-price-icon{
    width:36px;
    height:36px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
}

.wallet-price-banner{
    color:#E03030 !important;
    background:#FFF0F0;
}

.wallet-price-special{
    color:#A56D00 !important;
    background:#FFF7D6;
}

.wallet-price-carousel{
    color:#3157E8 !important;
    background:#EEF2FF;
}

.wallet-price-copy{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:1px;
}

.wallet-price-copy strong{
    color:#1A1A1A !important;
    -webkit-text-fill-color:#1A1A1A !important;
    font-size:13px;
    font-weight:800;
}

.wallet-price-copy small{
    color:#697384 !important;
    -webkit-text-fill-color:#697384 !important;
    font-size:11px;
    line-height:1.25;
    font-weight:500;
}

.wallet-price-value{
    color:#111827 !important;
    -webkit-text-fill-color:#111827 !important;
    font-size:14px;
    font-weight:800;
    white-space:nowrap;
}

@media (max-width:575.98px){

    .wallet-balance-summary-card{
        padding:20px !important;
    }

    .wallet-price-item{
        grid-template-columns:34px minmax(0,1fr) auto;
        gap:8px;
        padding-left:8px;
        padding-right:8px;
    }

    .wallet-price-icon{
        width:32px;
        height:32px;
    }

    .wallet-price-value{
        font-size:13px;
    }
}

.client-mega-icon.icon-green{background:#ECFDF3;color:#198754;}

.wallet-price-panfleto{color:#198754!important;background:#ECFDF3;}