﻿:root {
    --bg: #030712 !important;
    --surface: #090f1d !important;
    --surface-strong: #101827 !important;
    --surface-soft: #060b16 !important;
    --line: rgba(148, 163, 184, 0.22) !important;
    --text: #f8fafc !important;
    --muted: #c7d2e2 !important;
    --primary: #35f08f !important;
    --primary-strong: #14c871 !important;
    --accent: #8df7b0 !important;
    --danger: #fb7185 !important;
    --success: #34d399 !important;
    --warning: #c4ccd8 !important;
    --shadow: 0 28px 70px rgba(0, 0, 0, 0.52) !important;
    --title-font: 'Space Grotesk', 'Segoe UI', sans-serif;
}

body {
    background:
        radial-gradient(circle at 14% -8%, rgba(53, 240, 143, 0.12), transparent 28%),
        radial-gradient(circle at 86% 4%, rgba(53, 240, 143, 0.06), transparent 26%),
        radial-gradient(circle at 50% 110%, rgba(99, 102, 241, 0.10), transparent 34%),
        linear-gradient(180deg, #020617 0%, #050816 42%, #030712 100%) !important;
    color: var(--text) !important;
}

.logo-lockup {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--text);
    font-family: var(--title-font);
    font-weight: 700;
    letter-spacing: 0;
}

.logo-mark {
    width: 38px;
    height: 38px;
    border: 1px solid var(--primary);
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--surface);
    color: var(--primary);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
}

.brand-logo {
    display: none !important;
}

.admin-logo-title .bi {
    display: inline-flex !important;
}

.admin-logo-title {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: var(--title-font);
    font-weight: 700;
    letter-spacing: 0;
}

.auth-section,
.card,
.header,
.stat-card,
.table-container,
.user-profile,
.subscription-status,
.no-subscription,
.access-section,
.plan-card,
.sidebar,
.alert {
    border-radius: 8px !important;
}

.auth-section,
.card,
.header,
.stat-card,
.table-container {
    background: var(--surface) !important;
    border: 1px solid var(--line) !important;
    box-shadow: var(--shadow) !important;
}

.auth-header,
.btn-primary,
.btn-logout,
.avatar,
.access-section,
.sidebar {
    background: var(--primary) !important;
}

.auth-header,
.btn-primary,
.btn-logout,
.access-section,
.sidebar {
    color: #ffffff !important;
}

.btn,
.btn-primary,
.btn-secondary,
.btn-access,
.btn-small,
input,
.table-search input,
.status-badge,
.waitlist-badge,
.waitlist-counter {
    border-radius: 8px !important;
}

.btn-primary,
.btn-logout,
.btn-access,
.btn-small {
    box-shadow: none !important;
}

.btn-primary:hover,
.btn-access:hover,
.stat-card:hover {
    transform: none !important;
}

.btn-secondary,
.btn-small {
    background: var(--surface-soft) !important;
    color: var(--text) !important;
}

.btn-primary:hover:not(:disabled),
.btn-logout:hover,
.sidebar-nav button.active,
.sidebar-nav button:hover {
    background: var(--primary-strong) !important;
}

.info-section h1,
.header h1,
.card h2,
.table-header h2,
.auth-header h2,
.navbar-brand,
.sidebar-logo {
    color: var(--text) !important;
    text-shadow: none !important;
}

.auth-header h2,
.auth-header p,
.auth-header .logo-lockup,
.sidebar,
.sidebar .logo-lockup,
.sidebar-logo,
.sidebar-logo .logo-lockup {
    color: #ffffff !important;
}

.auth-header .logo-mark,
.sidebar .logo-mark,
.sidebar-logo .logo-mark {
    background: transparent;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.7);
}

.access-section-allowed {
    background: var(--success) !important;
}

.sidebar-nav a.nav-btn {
    display: block;
    width: 100%;
    color: rgba(255, 255, 255, 0.88) !important;
    padding: 12px 15px;
    border-radius: 8px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
}

.sidebar-nav a.nav-btn:hover {
    background: var(--primary-strong) !important;
    color: #ffffff !important;
}

.features li:before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--primary);
    flex: 0 0 auto;
}

.waitlist-badge,
.waitlist-counter,
.subscription-status,
.no-subscription,
.countdown {
    background: var(--surface-soft) !important;
    border: 1px solid var(--line) !important;
    color: var(--text) !important;
    backdrop-filter: none !important;
}

.waitlist-badge strong,
.stat-value,
.plan-price strong,
.subscription-detail .value,
.navbar-brand {
    color: var(--primary) !important;
}

.status-active {
    background: #e7f6ec !important;
    color: var(--success) !important;
}

.status-trial,
.status-pending {
    background: #fff7ed !important;
    color: var(--warning) !important;
}

.status-inactive,
.alert-error {
    background: #fef3f2 !important;
    color: var(--danger) !important;
}

.alert-success {
    background: #e7f6ec !important;
    color: var(--success) !important;
}

.alert-info {
    background: #eaf4f7 !important;
    color: var(--accent) !important;
}

.plan-card:hover {
    border-color: var(--primary) !important;
    box-shadow: none !important;
}

#sharedTopbarRoot {
    position: sticky;
    top: 0;
    z-index: 100;
}

#sharedTopbarRoot .omnipost-topbar {
    background: rgba(255, 255, 255, 0.94) !important;
    border-bottom: 1px solid var(--line) !important;
    box-shadow: 0 14px 34px rgba(33, 48, 74, 0.08) !important;
    backdrop-filter: blur(16px);
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px;
    padding: 15px 30px !important;
    margin-bottom: 0 !important;
}

#sharedTopbarRoot .navbar-brand {
    display: flex !important;
    align-items: center !important;
    flex: 0 0 220px !important;
    min-width: 220px !important;
    color: var(--text) !important;
    font-family: var(--title-font);
    font-size: 20px;
    font-weight: 700;
}

#sharedTopbarRoot .nav-links,
#sharedTopbarRoot .dashboard-menu {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 1 1 auto !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 0 18px !important;
}

#sharedTopbarRoot .nav-links a,
#sharedTopbarRoot .dashboard-menu a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    min-height: 40px !important;
    padding: 8px 12px !important;
    border-radius: 8px !important;
    border: 1px solid transparent !important;
    text-decoration: none !important;
    color: var(--text) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.1;
    white-space: nowrap;
}

#sharedTopbarRoot .nav-links a:hover,
#sharedTopbarRoot .nav-links a.active,
#sharedTopbarRoot .dashboard-menu a:hover,
#sharedTopbarRoot .dashboard-menu a.active {
    background: rgba(53, 240, 143, 0.08) !important;
    border-color: rgba(53, 240, 143, 0.16) !important;
    color: var(--primary) !important;
}

#sharedTopbarRoot .navbar-right {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 15px !important;
    flex: 0 0 auto !important;
}

#sharedTopbarRoot .user-profile {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 48px !important;
    padding: 8px 15px !important;
    border-radius: 14px !important;
    border: 1px solid var(--line) !important;
    background: rgba(53, 240, 143, 0.06) !important;
}

#sharedTopbarRoot .avatar {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(135deg, var(--primary) 0%, #6d4aff 100%) !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

#sharedTopbarRoot .user-info {
    display: grid;
    gap: 2px;
    font-size: 13px !important;
    color: var(--text) !important;
}

#sharedTopbarRoot .user-info .name {
    display: block !important;
    font-weight: 700 !important;
    color: var(--text) !important;
}

#sharedTopbarRoot .user-info .status {
    display: block !important;
    font-size: 11px !important;
    color: var(--muted) !important;
}

#sharedTopbarRoot .admin-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    min-height: 40px !important;
    padding: 8px 15px !important;
    margin-right: 0 !important;
    border-radius: 12px !important;
    background: rgba(15, 118, 110, 0.1) !important;
    color: var(--primary) !important;
    text-decoration: none !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}

#sharedTopbarRoot .btn-logout {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 40px !important;
    padding: 8px 16px !important;
    border: none !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #ef5a6f 0%, #d33f5a 100%) !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    cursor: pointer;
}

#sharedTopbarRoot .btn-logout:hover {
    background: #da190b !important;
}

#sharedTopbarRoot .bi {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}

@media (max-width: 980px) {
    #sharedTopbarRoot .omnipost-topbar {
        flex-direction: column !important;
        align-items: stretch !important;
        padding: 14px 18px !important;
    }

    #sharedTopbarRoot .navbar-brand {
        flex: 0 0 auto !important;
        min-width: 0 !important;
    }

    #sharedTopbarRoot .nav-links,
    #sharedTopbarRoot .dashboard-menu,
    #sharedTopbarRoot .navbar-right {
        width: 100% !important;
        margin: 0 !important;
        justify-content: flex-start !important;
    }

    #sharedTopbarRoot .user-profile {
        flex: 1 1 auto;
    }
}

/* Padrao Campanhas aplicado ao sistema inteiro: preto, grafite e verde. */
:root {
    --bg: #020403 !important;
    --surface: rgba(10, 12, 14, 0.96) !important;
    --surface-strong: rgba(14, 17, 20, 0.98) !important;
    --surface-soft: rgba(18, 22, 25, 0.94) !important;
    --line: rgba(218, 232, 224, 0.14) !important;
    --text: #f2f7f4 !important;
    --muted: #9daaa4 !important;
    --primary: #35f08f !important;
    --primary-strong: #17c96d !important;
    --accent: #64f5b0 !important;
    --shadow: 0 22px 56px rgba(0, 0, 0, 0.48) !important;
}

body,
body:has(#sharedTopbarRoot),
.main-wrapper,
.dashboard-main,
.page-shell,
.app-shell,
.shell,
.container,
.container-fluid {
    background:
        radial-gradient(circle at 18% 0%, rgba(53, 240, 143, 0.08), transparent 28%),
        linear-gradient(180deg, #030504 0%, #050706 44%, #020303 100%) !important;
}

.header,
.hero,
.hero-card,
.status-card,
.card,
.panel,
.toolbar,
.campaign-card,
.tip-card,
.modal-card,
.notice,
.empty-state,
.stat-card,
.table-container,
.dashboard-sidebar,
.subscription-status,
.no-subscription,
.tool-card,
.metric-box,
.access-summary,
.history-box,
.card-preview,
.preview-box,
.preview-message,
.preview-media-item,
.media-card,
.upload-box,
.ai-feedback,
.ai-feedback-item,
.meta-item,
.locked-channel,
.usage-notice,
.alert,
.side-note,
.source-panel,
.manual-card,
.destination-card,
.resource-item,
.post-item,
.page-item,
.account-item,
.group-card,
.log-box,
.log-card,
.history-item,
.chat-list,
.chat-item,
.recipient-pill,
.message-preview-box,
.photo-item,
.status-item,
.mini-stat,
.modal-content,
.dropdown-menu,
.list-group-item {
    background:
        linear-gradient(180deg, rgba(14, 17, 20, 0.98), rgba(7, 9, 10, 0.99)) !important;
    border: 1px solid rgba(218, 232, 224, 0.14) !important;
    color: var(--text) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.035),
        0 18px 48px rgba(0, 0, 0, 0.44) !important;
}

.hero-card,
.status-card,
.panel,
.card,
.toolbar,
.stat-card,
.campaign-card,
.tool-card {
    border-radius: 8px !important;
}

.card:hover,
.panel:hover,
.campaign-card:hover,
.tool-card:hover,
.group-card:hover,
.media-card:hover,
.log-card:hover {
    border-color: rgba(53, 240, 143, 0.30) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.045),
        0 22px 58px rgba(0, 0, 0, 0.54) !important;
}

.hero-pill,
.toolbar-chip,
.chip-toggle,
.channel-chip,
.meta-chip,
.mode-badge,
.badge,
.status-badge,
.tag,
.pill,
.nav-chip {
    background: rgba(53, 240, 143, 0.08) !important;
    border: 1px solid rgba(53, 240, 143, 0.22) !important;
    color: #dfffea !important;
}

.status-draft,
.status-running,
.status-paused,
.status-scheduled,
.status-active,
.badge-info,
.badge-primary,
.badge-warning,
.badge-success,
.alert-info,
.alert-warning,
.alert-success,
#extensionUpdateNotice,
.version-notice {
    background:
        linear-gradient(180deg, rgba(14, 17, 20, 0.98), rgba(7, 9, 10, 0.99)) !important;
    border-color: rgba(53, 240, 143, 0.20) !important;
    color: var(--text) !important;
}

.metric-box strong,
.mini-stat-value,
.mini-stat-value span,
.stat-value,
.stat-number,
#heroCount,
#heroImages,
#heroStatus,
#extensionVersionStatus,
#heroTargets,
#heroMedia,
#heroBatchStatus,
#heroExtensionStatus {
    color: var(--primary) !important;
}

.btn-primary,
.btn.primary,
.tool-link,
.sidebar-link.is-active,
.channel-tab.active,
button.primary,
button[type="submit"] {
    background: linear-gradient(135deg, #35f08f 0%, #17c96d 100%) !important;
    border-color: rgba(53, 240, 143, 0.35) !important;
    color: #04100a !important;
    box-shadow: 0 12px 30px rgba(23, 201, 109, 0.18) !important;
}

.btn-secondary,
.btn.small,
.btn,
.sidebar-link,
.chip-toggle:not(.active),
.channel-tab,
.btn-outline,
.btn-light {
    background: rgba(10, 12, 14, 0.90) !important;
    border: 1px solid rgba(218, 232, 224, 0.14) !important;
    color: var(--text) !important;
}

input,
select,
textarea,
.form-control,
.toolbar-search input,
.form-field input,
.form-field select,
.form-field textarea {
    background: #050706 !important;
    border: 1px solid rgba(218, 232, 224, 0.16) !important;
    color: var(--text) !important;
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus {
    border-color: rgba(53, 240, 143, 0.48) !important;
    box-shadow: 0 0 0 3px rgba(53, 240, 143, 0.10) !important;
}

[style*="background: #0f172a"],
[style*="background:#0f172a"],
[style*="background: #111827"],
[style*="background:#111827"],
[style*="background: #172033"],
[style*="background:#172033"],
[style*="background: #15213a"],
[style*="background:#15213a"],
[style*="background: #102033"],
[style*="background:#102033"],
[style*="background: #12213b"],
[style*="background:#12213b"],
[style*="background: #0b1324"],
[style*="background:#0b1324"],
[style*="background: #0f1b2d"],
[style*="background:#0f1b2d"],
[style*="background-color: #0f172a"],
[style*="background-color:#0f172a"],
[style*="background-color: #111827"],
[style*="background-color:#111827"],
[style*="background-color: #172033"],
[style*="background-color:#172033"] {
    background: #050706 !important;
}

tr:hover,
.table-hover tbody tr:hover {
    background: rgba(53, 240, 143, 0.06) !important;
}

/* Aviso de versao unificado nos postadores Facebook e WhatsApp. */
.version-notice,
.extension-version-notice,
#extensionUpdateNotice,
#extensionUpdateNotice.alert,
#extensionUpdateNotice.alert-info,
#extensionUpdateNotice.alert-success,
#extensionUpdateNotice.alert-warning {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 50px !important;
    margin: 14px 0 20px !important;
    padding: 14px 18px !important;
    border-radius: 8px !important;
    background: linear-gradient(180deg, rgba(14, 17, 20, 0.98), rgba(7, 9, 10, 0.99)) !important;
    border: 1px solid rgba(53, 240, 143, 0.22) !important;
    color: var(--text) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.035),
        0 18px 48px rgba(0, 0, 0, 0.38) !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
}

.version-notice::before,
.extension-version-notice::before,
#extensionUpdateNotice::before {
    content: "\F26A";
    font-family: "bootstrap-icons" !important;
    width: 26px !important;
    height: 26px !important;
    flex: 0 0 26px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important;
    background: rgba(53, 240, 143, 0.10) !important;
    color: var(--primary) !important;
    font-size: 14px !important;
}

.version-notice strong,
.extension-version-notice strong,
#extensionUpdateNotice strong {
    color: #ffffff !important;
    font-weight: 800 !important;
}

.version-notice a,
.extension-version-notice a,
#extensionUpdateNotice a,
#extensionUpdateNotice .alert-link {
    color: var(--primary) !important;
    font-weight: 900 !important;
}

.version-notice.is-warning,
.extension-version-notice.is-warning,
#extensionUpdateNotice.alert-warning {
    border-color: rgba(246, 196, 83, 0.28) !important;
}

/* App control-center shell */
:root {
    --bg: #020304 !important;
    --surface: #090b10 !important;
    --surface-strong: #10131a !important;
    --surface-soft: #06080c !important;
    --line: rgba(177, 190, 210, 0.22) !important;
    --text: #f4f7fb !important;
    --muted: #b4c0d1 !important;
    --primary: #35f08f !important;
    --primary-strong: #14c871 !important;
    --accent: #8df7b0 !important;
    --danger: #fb7185 !important;
    --success: #34d399 !important;
    --warning: #c4ccd8 !important;
    --shadow: 0 22px 60px rgba(0, 0, 0, 0.38) !important;
    --sidebar-width: 286px;
}

html {
    background: var(--bg) !important;
}

body {
    background:
        radial-gradient(circle at 18% -10%, rgba(53, 240, 143, 0.11), transparent 30%),
        radial-gradient(circle at 90% 8%, rgba(53, 240, 143, 0.06), transparent 24%),
        linear-gradient(180deg, #020304 0%, #06080d 48%, var(--bg) 100%) !important;
    color: var(--text) !important;
}

body:has(#sharedTopbarRoot) {
    padding-left: var(--sidebar-width);
}

#sharedTopbarRoot {
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    width: var(--sidebar-width) !important;
    z-index: 1000 !important;
}

#sharedTopbarRoot .omnipost-topbar,
#sharedTopbarRoot .omnipost-sidebar {
    width: 100% !important;
    height: 100vh !important;
    padding: 16px !important;
    margin: 0 !important;
    display: grid !important;
    grid-template-rows: auto auto auto !important;
    align-items: stretch !important;
    gap: 14px !important;
    background: rgba(10, 15, 28, 0.96) !important;
    border-right: 1px solid var(--line) !important;
    border-bottom: 0 !important;
    box-shadow: 18px 0 50px rgba(0, 0, 0, 0.26) !important;
    backdrop-filter: blur(18px);
}

#sharedTopbarRoot .navbar-brand {
    flex: none !important;
    min-width: 0 !important;
    padding: 8px 8px 14px !important;
    border-bottom: 1px solid var(--line) !important;
    color: var(--text) !important;
}

#sharedTopbarRoot .logo-lockup {
    align-items: center !important;
    color: var(--text) !important;
}

#sharedTopbarRoot .logo-lockup > span:last-child {
    display: grid;
    gap: 2px;
}

#sharedTopbarRoot .logo-lockup strong {
    font-size: 18px;
    line-height: 1;
}

#sharedTopbarRoot .logo-lockup small {
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

#sharedTopbarRoot .logo-mark {
    width: 40px !important;
    height: 40px !important;
    background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
    border: 0 !important;
    color: #06111f !important;
    box-shadow: 0 16px 30px rgba(56, 189, 248, 0.24);
}

#sharedTopbarRoot .nav-links,
#sharedTopbarRoot .dashboard-menu {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    margin: 0 !important;
    overflow: visible !important;
}

#sharedTopbarRoot .nav-links::before {
    content: "Ferramentas";
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding: 0 10px 4px;
}

#sharedTopbarRoot .nav-links a,
#sharedTopbarRoot .dashboard-menu a {
    justify-content: flex-start !important;
    min-height: 42px !important;
    padding: 10px 12px !important;
    border-radius: 8px !important;
    border: 1px solid transparent !important;
    color: #cbd5e1 !important;
    background: transparent !important;
    font-size: 13px !important;
}

#sharedTopbarRoot .nav-links a:hover,
#sharedTopbarRoot .nav-links a.active,
#sharedTopbarRoot .dashboard-menu a:hover,
#sharedTopbarRoot .dashboard-menu a.active {
    background: linear-gradient(135deg, rgba(53, 240, 143, 0.14), rgba(141, 247, 176, 0.08)) !important;
    border-color: rgba(53, 240, 143, 0.34) !important;
    color: #ffffff !important;
}

#sharedTopbarRoot .nav-links a.active::after,
#sharedTopbarRoot .dashboard-menu a.active::after {
    content: "";
    width: 7px;
    height: 7px;
    margin-left: auto;
    border-radius: 50%;
    background: var(--success);
    box-shadow: 0 0 16px rgba(52, 211, 153, .7);
}

#sharedTopbarRoot .navbar-right {
    display: grid !important;
    gap: 10px !important;
    align-items: stretch !important;
    justify-content: stretch !important;
    border-top: 1px solid var(--line);
    padding-top: 12px;
}

#sharedTopbarRoot .user-profile {
    border-radius: 8px !important;
    border: 1px solid var(--line) !important;
    background: rgba(7, 10, 16, 0.92) !important;
    min-height: 54px !important;
    padding: 9px !important;
}

#sharedTopbarRoot .avatar {
    background: rgba(56, 189, 248, 0.16) !important;
    color: var(--primary) !important;
}

#sharedTopbarRoot .user-info .name {
    color: var(--text) !important;
}

#sharedTopbarRoot .user-info .status {
    color: var(--success) !important;
}

#sharedTopbarRoot .admin-btn,
#sharedTopbarRoot .btn-logout {
    width: 100% !important;
    min-height: 40px !important;
    border-radius: 8px !important;
}

#sharedTopbarRoot .admin-btn {
    background: rgba(56, 189, 248, 0.12) !important;
    color: var(--primary) !important;
    border: 1px solid rgba(56, 189, 248, .22) !important;
}

#sharedTopbarRoot .btn-logout {
    background: rgba(251, 113, 133, 0.14) !important;
    color: #fecdd3 !important;
    border: 1px solid rgba(251, 113, 133, .24) !important;
}

body:has(#sharedTopbarRoot) .container,
body:has(#sharedTopbarRoot) .page-shell,
body:has(#sharedTopbarRoot) .app-shell,
body:has(#sharedTopbarRoot) .shell,
body:has(#sharedTopbarRoot) main.grid,
body:has(#sharedTopbarRoot) .container-fluid {
    max-width: 1440px;
}

.header,
.hero,
.hero-card,
.status-card,
.card,
.panel,
.toolbar,
.campaign-card,
.tip-card,
.modal-card,
.notice,
.empty-state,
.stat-card,
.table-container,
.dashboard-sidebar,
.subscription-status,
.no-subscription {
    background: rgba(18, 26, 42, 0.96) !important;
    border: 1px solid var(--line) !important;
    box-shadow: var(--shadow) !important;
    color: var(--text) !important;
}

[style*="background: white"],
[style*="background:white"],
[style*="background: #fff"],
[style*="background:#fff"],
[style*="background-color: white"],
[style*="background-color:white"],
[style*="background-color: #fff"],
[style*="background-color:#fff"],
.bg-white {
    background: var(--surface) !important;
    color: var(--text) !important;
}

.card h1,
.card h2,
.card h3,
.header h1,
.hero h1,
.hero-card h1,
.hero-card h2,
.panel h2,
.navbar-brand,
.sidebar-title {
    color: var(--text) !important;
}

.muted,
.help,
.sidebar-subtitle,
.hero p,
.hero-card p,
label,
td,
.toolbar-count,
.metric-box span,
.section-subtitle {
    color: var(--muted) !important;
}

input,
select,
textarea,
.form-control,
.toolbar-search input,
.form-field input,
.form-field select,
.form-field textarea {
    background: #0d1524 !important;
    border: 1px solid var(--line) !important;
    color: var(--text) !important;
    box-shadow: none !important;
}

input::placeholder,
textarea::placeholder {
    color: #64748b !important;
}

.btn,
.btn-secondary,
.btn-small,
.tool-link,
.sidebar-link,
button {
    border-radius: 8px !important;
}

.btn-primary,
.btn.primary,
.tool-link,
.sidebar-link.is-active,
.channel-tab.active {
    background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
    border-color: transparent !important;
    color: #07111f !important;
    font-weight: 800 !important;
}

.btn-secondary,
.btn.small,
.btn,
.sidebar-link {
    background: rgba(7, 10, 16, 0.90) !important;
    border: 1px solid var(--line) !important;
    color: var(--text) !important;
}

table,
th,
td {
    color: var(--text) !important;
    border-color: var(--line) !important;
}

th,
.card-header,
.card-toolbar,
.metric-box,
.mini-stat,
.destination-card,
.resource-item,
.photo-item,
.post-item,
.message-preview-box,
.preview-box,
.page-item,
.account-item {
    background: rgba(15, 23, 38, 0.92) !important;
    border-color: var(--line) !important;
    color: var(--text) !important;
}

.text-muted,
.small.text-muted,
.text-secondary,
.form-text,
.table-search input,
.toolbar-count {
    color: var(--muted) !important;
}

.alert,
.notice,
.side-note,
.usage-notice,
.alert-warning,
.alert-info,
.alert-success,
.alert-danger,
.alert-light,
.bg-light,
.list-group-item,
.dropdown-menu,
.modal-content {
    color: var(--text) !important;
}

.usage-notice,
.alert-info,
.alert-warning,
.alert-light,
.side-note,
.notice,
.source-panel,
.recipient-pill,
.recipient-warning,
.message-preview-box,
.chat-list,
.chat-item,
.photo-item,
.check,
.status-item,
.manual-card,
.card-preview {
    background: rgba(18, 26, 42, 0.96) !important;
    border: 1px solid var(--line) !important;
    color: var(--text) !important;
}

.usage-notice h1,
.usage-notice h2,
.usage-notice h3,
.usage-notice h4,
.usage-notice p,
.usage-notice li,
.notice h1,
.notice h2,
.notice h3,
.notice h4,
.notice p,
.notice li,
.side-note h1,
.side-note h2,
.side-note h3,
.side-note h4,
.side-note p,
.side-note li,
.alert h1,
.alert h2,
.alert h3,
.alert h4,
.alert p,
.alert li,
.alert a,
.source-panel,
.source-panel strong,
.source-panel p,
.source-panel span,
.recipient-pill,
.recipient-pill span,
.status-item,
.status-item strong,
.status-item span,
.check,
.check span,
.chat-item,
.chat-item strong,
.chat-item span,
.photo-item,
.photo-name,
.message-preview,
.recipient-warning {
    color: var(--text) !important;
}

.usage-notice h3,
.notice strong,
.side-note strong,
.source-panel strong,
.status-item strong {
    color: #ffffff !important;
}

.alert-link,
.usage-notice a,
.notice a,
.side-note a,
.source-panel a,
.status-item a {
    color: var(--primary) !important;
    font-weight: 800 !important;
}

#extensionUpdateNotice,
#extensionUpdateNotice[style],
#extensionStatus,
#extensionStatus[style],
.badge[style],
[style*="background: #f0fdf4"],
[style*="background:#f0fdf4"],
[style*="background: #fffbeb"],
[style*="background:#fffbeb"],
[style*="background: #dcfce7"],
[style*="background:#dcfce7"],
[style*="background: #e8eefb"],
[style*="background:#e8eefb"],
[style*="background-color: #f0fdf4"],
[style*="background-color:#f0fdf4"],
[style*="background-color: #fffbeb"],
[style*="background-color:#fffbeb"],
[style*="background-color: #dcfce7"],
[style*="background-color:#dcfce7"],
[style*="background-color: #e8eefb"],
[style*="background-color:#e8eefb"] {
    background: rgba(18, 26, 42, 0.96) !important;
    border-color: var(--line) !important;
    color: var(--text) !important;
}

.recipient-pill strong,
.mini-stat-value,
#heroCount,
#heroImages,
#heroStatus,
#extensionVersionStatus {
    color: var(--accent) !important;
}

.alert-success,
.status-active {
    background: rgba(52, 211, 153, 0.14) !important;
    color: #d1fae5 !important;
    border-color: rgba(52, 211, 153, 0.30) !important;
}

.alert-error,
.status-inactive,
.badge-error,
.badge-danger {
    background: rgba(251, 113, 133, 0.14) !important;
    color: #ffe4e6 !important;
    border-color: rgba(251, 113, 133, 0.30) !important;
}

tr:hover {
    background: rgba(56, 189, 248, 0.07) !important;
}

.badge,
.meta-chip,
.status-badge {
    border-radius: 999px !important;
}

/* Profundidade global para componentes antigos que ainda vinham claros. */
.tool-card,
.dashboard-sidebar,
.campaign-card,
.tip-card,
.modal-card,
.empty-state,
.metric-box,
.access-summary,
.history-box,
.card-preview,
.preview-box,
.preview-message,
.preview-media-item,
.media-card,
.upload-box,
.ai-feedback,
.ai-feedback-item,
.meta-item,
.locked-channel {
    background:
        linear-gradient(180deg, rgba(24, 34, 53, 0.98), rgba(13, 21, 36, 0.98)) !important;
    border: 1px solid rgba(177, 190, 210, 0.22) !important;
    color: var(--text) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.04),
        0 18px 42px rgba(0, 0, 0, 0.34) !important;
}

.tool-card:hover,
.campaign-card:hover,
.media-card:hover,
.chip-toggle:hover,
.btn-secondary:hover {
    border-color: rgba(53, 240, 143, 0.42) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 22px 56px rgba(0, 0, 0, 0.42) !important;
}

.tool-card h3,
.tool-card h2,
.dashboard-sidebar h2,
.campaign-card h3,
.campaign-card h4,
.access-summary h3,
.history-box h3,
.history-box strong,
.card-preview strong,
.preview-box h3,
.preview-box strong,
.ai-feedback strong,
.ai-feedback-item strong,
.media-card strong,
.meta-item strong,
.empty-state h3,
.tip-card h3 {
    color: #ffffff !important;
}

.tool-card p,
.dashboard-sidebar p,
.sidebar-subtitle,
.campaign-card p,
.campaign-card span,
.access-summary p,
.history-box p,
.history-box span,
.history-row,
.card-preview,
.preview-message,
.preview-media-item,
.ai-feedback p,
.ai-feedback span,
.media-card span,
.upload-box p,
.meta-item,
.empty-state p,
.tip-card p {
    color: var(--muted) !important;
}

.history-box a,
.card-preview a,
.preview-box a,
.access-summary a,
.campaign-card a:not(.btn-primary):not(.tool-link),
.tool-card a:not(.tool-link) {
    color: var(--primary) !important;
    font-weight: 800 !important;
}

.channel-chip,
.tip-pill,
.mode-badge,
.version-badge,
.status-draft,
.status-scheduled,
.status-running,
.status-paused,
.status-completed,
.status-failed {
    background: rgba(53, 240, 143, 0.10) !important;
    border: 1px solid rgba(53, 240, 143, 0.26) !important;
    color: #dff7ff !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

.status-running,
.status-completed,
.version-badge {
    background: rgba(52, 211, 153, 0.14) !important;
    border-color: rgba(52, 211, 153, 0.28) !important;
    color: #d1fae5 !important;
}

.status-paused,
.status-draft,
.mode-badge {
    background: rgba(251, 191, 36, 0.12) !important;
    border-color: rgba(251, 191, 36, 0.26) !important;
    color: #d8fbe3 !important;
}

.status-failed,
.ai-feedback.error {
    background: rgba(251, 113, 133, 0.14) !important;
    border-color: rgba(251, 113, 133, 0.30) !important;
    color: #ffe4e6 !important;
}

.chip-toggle,
.btn-secondary,
.btn-danger,
.sidebar-link {
    background: rgba(15, 23, 38, 0.82) !important;
    border-color: rgba(177, 190, 210, 0.22) !important;
    color: var(--text) !important;
}

.chip-toggle.active,
.chip-toggle.is-active,
.sidebar-link.is-active,
.sidebar-link:hover {
    background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
    border-color: transparent !important;
    color: #06111e !important;
    box-shadow: 0 14px 32px rgba(53, 240, 143, 0.18) !important;
}

.btn-danger {
    background: rgba(251, 113, 133, 0.13) !important;
    color: #ffe4e6 !important;
    border-color: rgba(251, 113, 133, 0.28) !important;
}

.upload-box {
    border-style: dashed !important;
}

.media-thumb,
.preview-media-item,
.card-preview[style],
[style*="background:#f8fafc"],
[style*="background: #f8fafc"],
[style*="background-color:#f8fafc"],
[style*="background-color: #f8fafc"],
[style*="background:#fff7ed"],
[style*="background: #fff7ed"],
[style*="background-color:#fff7ed"],
[style*="background-color: #fff7ed"],
[style*="background:#ecfdf5"],
[style*="background: #ecfdf5"],
[style*="background-color:#ecfdf5"],
[style*="background-color: #ecfdf5"] {
    background: rgba(13, 21, 36, 0.94) !important;
    border-color: rgba(177, 190, 210, 0.22) !important;
    color: var(--text) !important;
}

/* Refinamento preto + luz para todo o app. */
.app-shell,
.container,
.page-shell {
    position: relative;
}

.app-shell {
    max-width: 1480px !important;
}

.hero-card,
.status-card,
.header,
.card,
.panel,
.toolbar,
.auth-section,
.table-container,
.subscription-status,
.no-subscription,
.access-section,
.plan-card {
    background:
        linear-gradient(180deg, rgba(14, 22, 36, 0.98), rgba(5, 9, 18, 0.98)) !important;
    border-color: rgba(148, 163, 184, 0.24) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 24px 70px rgba(0, 0, 0, 0.48),
        0 0 0 1px rgba(53, 240, 143, 0.03) !important;
}

.hero-card,
.header {
    background:
        linear-gradient(135deg, rgba(14, 22, 36, 0.98), rgba(4, 12, 24, 0.98) 58%, rgba(8, 32, 42, 0.86)) !important;
}

.section-title,
.card-title,
h1,
h2,
h3,
h4,
h5,
label,
.composer-label {
    color: #ffffff !important;
}

.section-subtitle,
.text-muted,
small,
.download-note,
.mini-stat-label,
.history-meta {
    color: var(--muted) !important;
}

.btn-primary,
.tool-link,
button.tool-link,
.btn-success {
    background: linear-gradient(135deg, #35f08f 0%, #8df7b0 100%) !important;
    border-color: transparent !important;
    color: #03101a !important;
    box-shadow: 0 16px 36px rgba(53, 240, 143, 0.20) !important;
}

.btn-dark,
.btn-outline-primary,
.btn-outline-secondary,
.btn-link,
.toolbar-chip,
.hero-pill,
.emoji-btn {
    background: rgba(7, 10, 16, 0.94) !important;
    border: 1px solid rgba(148, 163, 184, 0.26) !important;
    color: #e5f6ff !important;
}

.btn-link:hover,
.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.emoji-btn:hover {
    color: #06111e !important;
    background: linear-gradient(135deg, #35f08f, #8df7b0) !important;
}

.mini-stat,
.group-card,
.log-card,
.history-item {
    background: rgba(7, 12, 24, 0.92) !important;
    border-color: rgba(148, 163, 184, 0.22) !important;
    color: var(--text) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.04),
        0 14px 34px rgba(0, 0, 0, 0.30) !important;
}

.group-card.selected {
    background: rgba(53, 240, 143, 0.10) !important;
    border-color: rgba(53, 240, 143, 0.62) !important;
}

.log-box,
#lista,
.history-list {
    background: rgba(3, 7, 18, 0.72) !important;
    border-color: rgba(148, 163, 184, 0.20) !important;
}

/* Ajuste de maturidade visual: menos azul nos cards, mais respiro e CTAs vivos. */
:root {
    --bg: #020304 !important;
    --surface: #090b10 !important;
    --surface-strong: #10131a !important;
    --surface-soft: #06080c !important;
    --line: rgba(214, 222, 235, 0.16) !important;
    --primary: #35f08f !important;
    --primary-strong: #14c871 !important;
    --accent: #8df7b0 !important;
    --muted: #c4ccd8 !important;
}

body {
    background:
        radial-gradient(circle at 18% -10%, rgba(53, 240, 143, 0.11), transparent 30%),
        radial-gradient(circle at 90% 8%, rgba(53, 240, 143, 0.06), transparent 24%),
        linear-gradient(180deg, #020304 0%, #06080d 48%, #020304 100%) !important;
}

.app-shell {
    max-width: 1360px !important;
}

.hero-card,
.status-card,
.header,
.card,
.panel,
.toolbar,
.auth-section,
.table-container,
.subscription-status,
.no-subscription,
.access-section,
.plan-card,
.tool-card,
.campaign-card,
.tip-card,
.modal-card,
.empty-state,
.metric-box,
.access-summary,
.history-box,
.card-preview,
.preview-box,
.preview-message,
.preview-media-item,
.media-card,
.upload-box,
.ai-feedback,
.ai-feedback-item,
.meta-item,
.locked-channel,
.mini-stat,
.group-card,
.log-card,
.history-item,
.usage-notice {
    background:
        linear-gradient(180deg, rgba(16, 19, 26, 0.98), rgba(6, 8, 12, 0.99)) !important;
    border-color: rgba(214, 222, 235, 0.16) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.045),
        0 18px 44px rgba(0, 0, 0, 0.44) !important;
}

.hero-card,
.header {
    background:
        linear-gradient(135deg, rgba(17, 20, 28, 0.98), rgba(6, 8, 12, 0.99) 64%, rgba(18, 28, 22, 0.88)) !important;
}

.btn-primary,
.tool-link,
button.tool-link,
.btn-success,
.chip-toggle.active,
.chip-toggle.is-active {
    background: linear-gradient(135deg, #35f08f 0%, #8df7b0 100%) !important;
    color: #050607 !important;
    box-shadow: 0 14px 30px rgba(53, 240, 143, 0.18) !important;
}

.btn-dark,
.btn-secondary,
.btn-outline-primary,
.btn-outline-secondary,
.btn-link,
.toolbar-chip,
.hero-pill,
.emoji-btn,
.chip-toggle {
    background: rgba(12, 15, 22, 0.94) !important;
    border-color: rgba(214, 222, 235, 0.18) !important;
    color: #eef4fb !important;
    box-shadow: none !important;
}

.btn-link:hover,
.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.emoji-btn:hover,
.group-card:hover {
    border-color: rgba(53, 240, 143, 0.46) !important;
    background: rgba(18, 28, 22, 0.96) !important;
}

.group-card.selected {
    background: rgba(53, 240, 143, 0.10) !important;
    border-color: rgba(53, 240, 143, 0.62) !important;
}

#sharedTopbarRoot .nav-links a.active,
#sharedTopbarRoot .dashboard-menu a.active {
    background: rgba(53, 240, 143, 0.10) !important;
    border-color: rgba(53, 240, 143, 0.34) !important;
    box-shadow: inset 24px 0 34px rgba(53, 240, 143, 0.08) !important;
}

/* Padrao final verde/preto aplicado sobre telas antigas. */
body,
.main-wrapper,
.dashboard-main,
.auth-container,
.auth-card,
.login-container {
    background-color: #020304 !important;
}

#sharedTopbarRoot .omnipost-sidebar,
#sharedTopbarRoot .omnipost-topbar,
.sidebar,
.navbar,
.topbar {
    background: rgba(3, 5, 8, 0.98) !important;
    border-color: rgba(214, 222, 235, 0.14) !important;
}

.logo-mark,
#sharedTopbarRoot .logo-mark,
.stat-icon.icon-blue,
.stat-icon.icon-green {
    background: linear-gradient(135deg, #35f08f 0%, #8df7b0 100%) !important;
    color: #050607 !important;
}

.toolbar-chip,
.hero-pill,
.version-badge,
.channel-chip,
.tip-pill,
.mode-badge,
.status-badge,
.badge-admin,
.badge-user,
.badge-inactive,
.badge[style*="background:#e0f2fe"],
.badge[style*="background: #e0f2fe"] {
    background: rgba(53, 240, 143, 0.10) !important;
    border-color: rgba(53, 240, 143, 0.28) !important;
    color: #dfffea !important;
}

input,
select,
textarea,
.form-control,
.form-field input,
.form-field select,
.form-field textarea {
    background: #070a10 !important;
    border-color: rgba(214, 222, 235, 0.18) !important;
    color: var(--text) !important;
}

input::placeholder,
textarea::placeholder {
    color: rgba(196, 204, 216, 0.68) !important;
}

.hero-strip,
.stats-grid,
.tools-grid,
.layout,
.dashboard-layout,
.form-grid {
    align-items: stretch;
}

.hero-card,
.header,
.card,
.panel,
.tool-card,
.stat-card,
.status-card,
.campaign-card {
    overflow: visible !important;
}

th,
.card-header,
.card-toolbar {
    background: rgba(9, 11, 16, 0.92) !important;
    color: var(--muted) !important;
}

td,
tr,
.table td,
.table th {
    color: var(--text) !important;
    border-color: rgba(214, 222, 235, 0.14) !important;
}

.btn-primary,
.btn-refresh,
.tool-link,
.submit-btn,
button[type="submit"] {
    background: linear-gradient(135deg, #35f08f 0%, #8df7b0 100%) !important;
    border-color: transparent !important;
    color: #050607 !important;
}

/* Unificacao final dos postadores: uma paleta, um ritmo visual. */
.hero-strip {
    gap: 14px !important;
}

.hero-card,
.status-card,
.version-notice,
#extensionUpdateNotice,
.alert-info,
.alert-warning,
.alert-success {
    background: linear-gradient(180deg, rgba(16, 19, 26, 0.98), rgba(6, 8, 12, 0.99)) !important;
    border-color: rgba(214, 222, 235, 0.16) !important;
    color: var(--text) !important;
}

.mini-stat {
    background: rgba(7, 10, 16, 0.82) !important;
    border-color: rgba(214, 222, 235, 0.16) !important;
}

.mini-stat-value,
.mini-stat-value span,
#heroCount,
#heroImages,
#heroStatus,
#extensionVersionStatus,
#heroTargets,
#heroMedia,
#heroBatchStatus,
#heroExtensionStatus {
    color: var(--primary) !important;
}

.toolbar-chip,
.hero-pill {
    min-height: 38px !important;
    padding: 9px 13px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    border-radius: 8px !important;
    background: rgba(53, 240, 143, 0.08) !important;
    border: 1px solid rgba(53, 240, 143, 0.28) !important;
    color: #ecfff3 !important;
    font-weight: 800 !important;
}

.version-notice strong,
#extensionUpdateNotice strong {
    color: #ffffff !important;
}

.version-notice a,
#extensionUpdateNotice a,
.alert-link {
    color: var(--primary) !important;
    font-weight: 900 !important;
}

.badge,
.status-badge,
#extensionStatus {
    background: rgba(53, 240, 143, 0.10) !important;
    border: 1px solid rgba(53, 240, 143, 0.24) !important;
    color: var(--primary) !important;
}

/* Controles inferiores do menu: pequenos e discretos. */
#sharedTopbarRoot .navbar-right {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 6px !important;
    padding-top: 8px !important;
    border-top: 1px solid rgba(214, 222, 235, 0.12) !important;
}

#sharedTopbarRoot .admin-btn,
#sharedTopbarRoot .btn-logout {
    width: 100% !important;
    min-height: 26px !important;
    height: 26px !important;
    padding: 4px 8px !important;
    border-radius: 6px !important;
    font-size: 11px !important;
    line-height: 1 !important;
    gap: 5px !important;
    justify-self: stretch !important;
}

#sharedTopbarRoot .user-profile {
    grid-column: 1 / -1 !important;
}

#sharedTopbarRoot .admin-btn .bi,
#sharedTopbarRoot .btn-logout .bi {
    font-size: 12px !important;
}

#sharedTopbarRoot .admin-btn {
    background: rgba(53, 240, 143, 0.08) !important;
    color: #dfffea !important;
    border: 1px solid rgba(53, 240, 143, 0.20) !important;
}

#sharedTopbarRoot .btn-logout {
    background: rgba(251, 113, 133, 0.08) !important;
    color: #fecdd3 !important;
    border: 1px solid rgba(251, 113, 133, 0.18) !important;
}

#sharedTopbarRoot .btn-logout:hover {
    background: rgba(251, 113, 133, 0.14) !important;
}

/* Nivelamento fino entre Postador Facebook e WhatsApp. */
.hero-card h2,
.hero-card .section-title {
    font-size: 20px !important;
    line-height: 1.15 !important;
}

.hero-card p,
.hero-card .section-subtitle {
    font-size: 14px !important;
    line-height: 1.5 !important;
}

.mini-stat {
    padding: 10px !important;
}

.mini-stat-label {
    font-size: 11px !important;
    line-height: 1.25 !important;
}

.mini-stat-value,
.mini-stat-value span,
#heroCount,
#heroImages,
#heroStatus,
#extensionVersionStatus,
#heroTargets,
#heroMedia,
#heroBatchStatus,
#heroExtensionStatus {
    font-size: 15px !important;
    line-height: 1.25 !important;
    overflow: hidden !important;
    overflow-wrap: normal !important;
    word-break: keep-all !important;
    hyphens: none !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}

.hero-pills {
    gap: 8px !important;
    margin-top: 14px !important;
}

.toolbar-chip,
.hero-pill {
    min-height: 32px !important;
    padding: 7px 10px !important;
    font-size: 12px !important;
}

.card,
.hero-card,
.status-card,
.side-note,
.status-item,
.source-panel,
.recipient-pill,
.chat-list,
.chat-item,
.message-preview-box {
    background: linear-gradient(180deg, rgba(16, 19, 26, 0.98), rgba(6, 8, 12, 0.99)) !important;
    border-color: rgba(214, 222, 235, 0.16) !important;
}

[style*="background: #0f172a"],
[style*="background:#0f172a"],
[style*="background: #111827"],
[style*="background:#111827"],
[style*="background: #0b1220"],
[style*="background:#0b1220"] {
    background: #06080c !important;
}

@media (min-width: 981px) {
    body:has(#sharedTopbarRoot) {
        padding-top: 0 !important;
    }
}

@media (max-width: 980px) {
    body:has(#sharedTopbarRoot) {
        padding-left: 0;
        padding-bottom: 76px;
    }

    #sharedTopbarRoot {
        inset: auto 0 0 0 !important;
        width: 100% !important;
        height: auto !important;
    }

    #sharedTopbarRoot .omnipost-topbar,
    #sharedTopbarRoot .omnipost-sidebar {
        height: auto !important;
        grid-template-rows: auto !important;
        grid-template-columns: 1fr !important;
        padding: 10px !important;
        border-right: 0 !important;
        border-top: 1px solid var(--line) !important;
    }

    #sharedTopbarRoot .navbar-brand,
    #sharedTopbarRoot .navbar-right {
        display: none !important;
    }

    #sharedTopbarRoot .nav-links,
    #sharedTopbarRoot .dashboard-menu {
        flex-direction: row !important;
        flex-wrap: wrap !important;
        overflow: visible !important;
        justify-content: center !important;
        gap: 8px !important;
    }

    #sharedTopbarRoot .nav-links::before {
        display: none;
    }

    #sharedTopbarRoot .nav-links a,
    #sharedTopbarRoot .dashboard-menu a {
        min-width: 62px !important;
        flex: 1 1 62px !important;
        max-width: 112px !important;
        min-height: 54px !important;
        padding: 8px 6px !important;
        display: grid !important;
        gap: 3px !important;
        text-align: center !important;
        font-size: 11px !important;
        white-space: normal !important;
    }

    #sharedTopbarRoot .nav-links a .bi,
    #sharedTopbarRoot .dashboard-menu a .bi {
        margin: 0 auto;
        font-size: 16px;
    }

    #sharedTopbarRoot .nav-links a.active::after,
    #sharedTopbarRoot .dashboard-menu a.active::after {
        display: none;
    }
}

/* Campanhas final: ultima palavra visual contra cards azulados antigos. */
:root {
    --bg: #020403 !important;
    --surface: rgba(10, 12, 14, 0.96) !important;
    --surface-strong: rgba(14, 17, 20, 0.98) !important;
    --surface-soft: rgba(18, 22, 25, 0.94) !important;
    --line: rgba(218, 232, 224, 0.14) !important;
    --text: #f2f7f4 !important;
    --muted: #9daaa4 !important;
    --primary: #35f08f !important;
    --primary-strong: #17c96d !important;
    --accent: #64f5b0 !important;
}

body,
body:has(#sharedTopbarRoot),
.main-wrapper,
.dashboard-main,
.page-shell,
.app-shell,
.shell,
.container,
.container-fluid {
    background:
        radial-gradient(circle at 18% 0%, rgba(53, 240, 143, 0.08), transparent 28%),
        linear-gradient(180deg, #030504 0%, #050706 44%, #020303 100%) !important;
}

.header,
.hero,
.hero-card,
.status-card,
.card,
.panel,
.toolbar,
.campaign-card,
.tip-card,
.modal-card,
.notice,
.empty-state,
.stat-card,
.table-container,
.dashboard-sidebar,
.subscription-status,
.no-subscription,
.tool-card,
.metric-box,
.access-summary,
.history-box,
.card-preview,
.preview-box,
.preview-message,
.preview-media-item,
.media-card,
.upload-box,
.ai-feedback,
.ai-feedback-item,
.meta-item,
.locked-channel,
.usage-notice,
.alert,
.side-note,
.source-panel,
.manual-card,
.destination-card,
.resource-item,
.post-item,
.page-item,
.account-item,
.group-card,
.log-box,
.log-card,
.history-item,
.chat-list,
.chat-item,
.recipient-pill,
.message-preview-box,
.photo-item,
.status-item,
.mini-stat,
.modal-content,
.dropdown-menu,
.list-group-item {
    background:
        linear-gradient(180deg, rgba(14, 17, 20, 0.98), rgba(7, 9, 10, 0.99)) !important;
    border-color: rgba(218, 232, 224, 0.14) !important;
    color: var(--text) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.035),
        0 18px 48px rgba(0, 0, 0, 0.44) !important;
}

.hero-card,
.status-card,
.panel,
.card,
.toolbar,
.stat-card,
.campaign-card,
.tool-card,
.group-card,
.log-card {
    border-radius: 8px !important;
}

.card:hover,
.panel:hover,
.campaign-card:hover,
.tool-card:hover,
.group-card:hover,
.media-card:hover,
.log-card:hover {
    border-color: rgba(53, 240, 143, 0.30) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.045),
        0 22px 58px rgba(0, 0, 0, 0.54) !important;
}

.hero-pill,
.toolbar-chip,
.chip-toggle,
.channel-chip,
.meta-chip,
.mode-badge,
.badge,
.status-badge,
.tag,
.pill,
.nav-chip {
    background: rgba(53, 240, 143, 0.08) !important;
    border: 1px solid rgba(53, 240, 143, 0.22) !important;
    color: #dfffea !important;
}

.status-draft,
.status-running,
.status-paused,
.status-scheduled,
.status-active,
.badge-info,
.badge-primary,
.badge-warning,
.badge-success,
.alert-info,
.alert-warning,
.alert-success,
#extensionUpdateNotice,
.version-notice {
    background:
        linear-gradient(180deg, rgba(14, 17, 20, 0.98), rgba(7, 9, 10, 0.99)) !important;
    border-color: rgba(53, 240, 143, 0.20) !important;
    color: var(--text) !important;
}

.metric-box strong,
.mini-stat-value,
.mini-stat-value span,
.stat-value,
.stat-number,
#heroCount,
#heroImages,
#heroStatus,
#extensionVersionStatus,
#heroTargets,
#heroMedia,
#heroBatchStatus,
#heroExtensionStatus {
    color: var(--primary) !important;
}

.btn-primary,
.btn.primary,
.tool-link,
.sidebar-link.is-active,
.channel-tab.active,
button.primary,
button[type="submit"] {
    background: linear-gradient(135deg, #35f08f 0%, #17c96d 100%) !important;
    border-color: rgba(53, 240, 143, 0.35) !important;
    color: #04100a !important;
    box-shadow: 0 12px 30px rgba(23, 201, 109, 0.18) !important;
}

.btn-secondary,
.btn.small,
.btn,
.sidebar-link,
.chip-toggle:not(.active),
.channel-tab,
.btn-outline,
.btn-light {
    background: rgba(10, 12, 14, 0.90) !important;
    border-color: rgba(218, 232, 224, 0.14) !important;
    color: var(--text) !important;
}

input,
select,
textarea,
.form-control,
.toolbar-search input,
.form-field input,
.form-field select,
.form-field textarea {
    background: #050706 !important;
    border-color: rgba(218, 232, 224, 0.16) !important;
    color: var(--text) !important;
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus {
    border-color: rgba(53, 240, 143, 0.48) !important;
    box-shadow: 0 0 0 3px rgba(53, 240, 143, 0.10) !important;
}

[style*="background: #0f172a"],
[style*="background:#0f172a"],
[style*="background: #111827"],
[style*="background:#111827"],
[style*="background: #172033"],
[style*="background:#172033"],
[style*="background: #15213a"],
[style*="background:#15213a"],
[style*="background: #102033"],
[style*="background:#102033"],
[style*="background: #12213b"],
[style*="background:#12213b"],
[style*="background: #0b1324"],
[style*="background:#0b1324"],
[style*="background: #0f1b2d"],
[style*="background:#0f1b2d"],
[style*="background-color: #0f172a"],
[style*="background-color:#0f172a"],
[style*="background-color: #111827"],
[style*="background-color:#111827"],
[style*="background-color: #172033"],
[style*="background-color:#172033"] {
    background: #050706 !important;
}

tr:hover,
.table-hover tbody tr:hover {
    background: rgba(53, 240, 143, 0.06) !important;
}


