/* Feeno Support Board theme
   Keep Support Board's native layout. Only skin colors, radius, borders and buttons. */
:root {
    --feeno-bg: #000000;
    --feeno-surface: #09090b;
    --feeno-surface-2: #111113;
    --feeno-surface-3: #18181b;
    --feeno-border: rgba(255, 255, 255, 0.10);
    --feeno-border-2: rgba(255, 255, 255, 0.16);
    --feeno-text: #ffffff;
    --feeno-muted: #a1a1aa;
    --feeno-dim: #71717a;
    --feeno-green: #4ade80;
    --feeno-green-2: #86efac;
    --feeno-green-soft: rgba(74, 222, 128, 0.12);
    --feeno-red: #f87171;
    --feeno-radius: 18px;
}

/* WordPress support login */
body.login {
    background: radial-gradient(circle at 50% -10%, rgba(74, 222, 128, .14), transparent 34%), #000 !important;
    color: var(--feeno-text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
body.login #login { width: min(420px, calc(100vw - 32px)); padding-top: 9vh; }
body.login form {
    border: 1px solid var(--feeno-border);
    border-radius: 26px;
    background: rgba(9, 9, 11, .94) !important;
    box-shadow: 0 24px 80px rgba(0,0,0,.5);
}
body.login label, body.login #nav a, body.login #backtoblog a { color: var(--feeno-muted) !important; }
body.login input[type="text"], body.login input[type="password"] {
    border: 1px solid var(--feeno-border-2) !important;
    border-radius: 14px !important;
    background: #000 !important;
    color: var(--feeno-text) !important;
    box-shadow: none !important;
}
body.login .button-primary {
    border: 0 !important;
    border-radius: 999px !important;
    background: var(--feeno-green) !important;
    color: #000 !important;
    font-weight: 800;
    box-shadow: none !important;
}

/* Admin console base */
body.wp-admin.toplevel_page_support-board,
body.wp-admin.admin_page_support-board,
body.wp-admin.toplevel_page_support-board #wpwrap,
body.wp-admin.admin_page_support-board #wpwrap,
body.wp-admin.toplevel_page_support-board #wpcontent,
body.wp-admin.admin_page_support-board #wpcontent {
    background: #000 !important;
}

.sb-admin,
.sb-admin * {
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.sb-admin {
    background: #000 !important;
    color: var(--feeno-text) !important;
}

.sb-admin > .sb-header {
    background: rgba(9, 9, 11, .96) !important;
    border-bottom: 1px solid var(--feeno-border) !important;
    box-shadow: 0 12px 40px rgba(0,0,0,.35) !important;
}

/* Main panes */
.sb-admin .sb-admin-list,
.sb-admin .sb-conversation,
.sb-admin .sb-user-details,
.sb-admin .sb-area-settings > .sb-tab,
.sb-admin .sb-area-reports > .sb-tab,
.sb-admin .sb-area-articles > .sb-tab,
.sb-admin .sb-area-chatbot > .sb-tab,
.sb-admin .sb-area-flows > .sb-tab,
.sb-admin .sb-lightbox,
.sb-admin .sb-popup,
.sb-admin .sb-panel {
    background: var(--feeno-surface) !important;
    border-color: var(--feeno-border) !important;
    color: var(--feeno-text) !important;
}

.sb-admin .sb-admin-list > .sb-header,
.sb-admin .sb-conversation > .sb-top,
.sb-admin .sb-user-details > .sb-header,
.sb-admin .sb-tab > .sb-nav,
.sb-admin .sb-table thead,
.sb-admin .sb-popup > .sb-header,
.sb-admin .sb-lightbox > .sb-top {
    background: var(--feeno-surface-2) !important;
    border-color: var(--feeno-border) !important;
}

/* Text */
.sb-admin h1,
.sb-admin h2,
.sb-admin h3,
.sb-admin .sb-title,
.sb-admin .sb-name,
.sb-admin .sb-profile span,
.sb-admin .sb-user-name,
.sb-admin .sb-labels span {
    color: var(--feeno-text) !important;
}
.sb-admin p,
.sb-admin span,
.sb-admin label,
.sb-admin .sb-time,
.sb-admin .sb-user-email,
.sb-admin .sb-message,
.sb-admin .sb-setting-content p,
.sb-admin .sb-table td,
.sb-admin .sb-text {
    color: var(--feeno-muted) !important;
}
.sb-admin .sb-time,
.sb-admin .sb-note,
.sb-admin small { color: var(--feeno-dim) !important; }

/* Lists and rows */
.sb-admin .sb-user-conversations > li,
.sb-admin .sb-conversation-item,
.sb-admin .sb-table tr,
.sb-admin .sb-repeater .repeater-item,
.sb-admin .sb-card,
.sb-admin .sb-box,
.sb-admin .sb-setting {
    background: transparent !important;
    border-color: rgba(255,255,255,.07) !important;
}
.sb-admin .sb-user-conversations > li:hover,
.sb-admin .sb-user-conversations > li.sb-active,
.sb-admin .sb-conversation-item:hover,
.sb-admin .sb-table tr:hover,
.sb-admin .sb-menu li:hover,
.sb-admin .sb-menu li.sb-active,
.sb-admin .sb-select ul li:hover,
.sb-admin .sb-select ul li.sb-active {
    background: rgba(255,255,255,.055) !important;
    color: var(--feeno-text) !important;
}

/* Nav */
.sb-admin .sb-admin-nav a,
.sb-admin .sb-admin-nav-right > div,
.sb-admin .sb-tab > .sb-nav > div,
.sb-admin .sb-menu li,
.sb-admin .sb-select p {
    color: var(--feeno-muted) !important;
}
.sb-admin .sb-admin-nav a.sb-active,
.sb-admin .sb-admin-nav a:hover,
.sb-admin .sb-tab > .sb-nav > div.sb-active,
.sb-admin .sb-tab > .sb-nav > div:hover {
    color: var(--feeno-text) !important;
    background: rgba(255,255,255,.06) !important;
}

/* Inputs */
.sb-admin input,
.sb-admin textarea,
.sb-admin select,
.sb-admin .sb-search-btn input,
.sb-admin .sb-editor textarea,
.sb-admin [contenteditable="true"] {
    background: #000 !important;
    border-color: var(--feeno-border) !important;
    color: var(--feeno-text) !important;
    box-shadow: none !important;
}
.sb-admin input:focus,
.sb-admin textarea:focus,
.sb-admin select:focus,
.sb-admin .sb-search-btn input:focus,
.sb-admin .sb-editor textarea:focus {
    border-color: rgba(74,222,128,.5) !important;
    box-shadow: 0 0 0 3px rgba(74,222,128,.10) !important;
}

/* Buttons and statuses */
.sb-admin .sb-btn,
.sb-admin a.sb-btn,
.sb-admin .sb-submit,
.sb-admin .sb-input.sb-input-btn > div {
    background: var(--feeno-green) !important;
    border-color: var(--feeno-green) !important;
    color: #000 !important;
    font-weight: 800 !important;
    box-shadow: none !important;
}
.sb-admin .sb-btn:hover,
.sb-admin a.sb-btn:hover,
.sb-admin .sb-submit:hover,
.sb-admin .sb-input.sb-input-btn > div:hover {
    background: var(--feeno-green-2) !important;
    border-color: var(--feeno-green-2) !important;
    color: #000 !important;
}
.sb-admin .sb-btn-red,
.sb-admin .sb-status-error,
.sb-admin .sb-label-error {
    background: rgba(248,113,113,.12) !important;
    border-color: rgba(248,113,113,.28) !important;
    color: var(--feeno-red) !important;
}
.sb-admin .sb-status-success,
.sb-admin .sb-label-success,
.sb-admin .sb-status-online {
    background: var(--feeno-green-soft) !important;
    border-color: rgba(74,222,128,.25) !important;
    color: var(--feeno-green) !important;
}

/* Conversation bubbles */
.sb-admin .sb-list > div {
    background: transparent !important;
    box-shadow: none !important;
}
.sb-admin .sb-list > div .sb-message {
    background: var(--feeno-surface-2) !important;
    border: 1px solid var(--feeno-border) !important;
    color: var(--feeno-text) !important;
    border-radius: 18px !important;
}
.sb-admin .sb-list > div.sb-right .sb-message {
    background: var(--feeno-green-soft) !important;
    border-color: rgba(74,222,128,.25) !important;
}
.sb-admin .sb-editor {
    background: var(--feeno-surface) !important;
    border-top-color: var(--feeno-border) !important;
}
.sb-admin img { border-radius: 999px; }

/* Front widget: light touch only, keep native plugin layout intact */
.sb-chat,
.sb-chat * { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important; }
.sb-chat { color: var(--feeno-text) !important; }
.sb-chat > .sb-body,
.sb-chat .sb-scroll-area,
.sb-chat .sb-dashboard,
.sb-chat .sb-editor {
    background: #050505 !important;
}
.sb-chat > div > .sb-header,
.sb-chat .sb-header {
    background: var(--feeno-surface-2) !important;
    color: var(--feeno-text) !important;
}
.sb-chat .sb-chat-btn,
.sb-chat .sb-submit,
.sb-chat .sb-dashboard > div > .sb-btn,
.sb-chat .sb-rich-message .sb-card .sb-card-btn {
    background: var(--feeno-green) !important;
    color: #000 !important;
}
.sb-chat .sb-list > div .sb-message {
    background: var(--feeno-surface-2) !important;
    color: var(--feeno-text) !important;
}
.sb-chat .sb-list > div.sb-right,
.sb-chat .sb-list > div.sb-right .sb-message {
    background: var(--feeno-green-soft) !important;
    color: var(--feeno-text) !important;
}
.sb-chat input,
.sb-chat textarea,
.sb-chat select {
    background: #000 !important;
    color: var(--feeno-text) !important;
    border-color: var(--feeno-border) !important;
}

@media (max-width: 782px) {
    .sb-admin { margin-left: 0 !important; width: 100% !important; }
}