/* === SMARTFENCE SCOPED BRAND COLORS - Only affects SmartFence containers === */

/* Define CSS variables for use in all SmartFence apps */
:root,
#smartfence-embed-root,
.app-container,
.container,
#sf-chat-container,
#sf-chat-content-wrapper,
.sf-embed-mode {
    /* Dynamic variables that apps reference */
    --dynamic-primary-base: #58954b;
    --dynamic-primary-dark: #46773c;
    --dynamic-primary-light: #69b25a;
    --dynamic-secondary-base: #406732;
    --dynamic-accent-base: #f59e0b;
    
    /* Direct variables for backward compatibility */
    --primary-color: #58954b;
    --secondary-color: #58954b;
    --accent-color: #f59e0b;
    --primary-dark: #46773c;
    --primary-light: #69b25a;
}

.app-container .btn-primary,
.app-container .btn-secondary,
.app-container .quick-action,
.app-container .btn-submit,
.container .btn-primary,
.container .btn-secondary,
.container .quick-action,
.container .btn-submit,
#sf-chat-container .btn-primary,
#sf-chat-container .btn-secondary,
#sf-chat-container .quick-action,
#sf-chat-container .btn-submit {
    background-color: #58954b !important;
    border-color: #58954b !important;
    color: white !important;
}

.app-container .btn-primary:hover,
.app-container .btn-secondary:hover,
.app-container .quick-action:hover,
.app-container .btn-submit:hover,
.container .btn-primary:hover,
.container .btn-secondary:hover,
.container .quick-action:hover,
.container .btn-submit:hover,
#sf-chat-container .btn-primary:hover,
#sf-chat-container .btn-secondary:hover,
#sf-chat-container .quick-action:hover,
#sf-chat-container .btn-submit:hover {
    background-color: white !important;
    color: #58954b !important;
    border-color: #58954b !important;
}

.app-container .btn-language,
.container .btn-language,
#sf-chat-container .btn-language {
    background: linear-gradient(135deg, var(--bg-tertiary), var(--bg-secondary)) !important;
    border-color: #58954b !important;
    color: #58954b !important;
}

.app-container .btn-language:hover,
.container .btn-language:hover,
#sf-chat-container .btn-language:hover {
    background: linear-gradient(135deg, #58954b, #46773c) !important;
    border-color: #46773c !important;
    color: white !important;
}

.app-container .app-header,
.container .app-header,
#sf-chat-container .app-header,
.app-container .navbar,
.container .navbar,
#sf-chat-container .navbar {
    background-color: white !important;
    border-bottom: 1px solid #e5e7eb !important;
}

.app-container .logo-text2,
.container .logo-text2,
#sf-chat-container .logo-text2 {
    color: #58954b !important;
}

.app-container .logo-subtitle2,
.container .logo-subtitle2,
#sf-chat-container .logo-subtitle2 {
    color: #000000 !important;
}

.app-container .user-message .message-content,
.container .user-message .message-content,
#sf-chat-container .user-message .message-content {
    background-color: #58954b !important;
}

.app-container a,
.container a,
#sf-chat-container a,
#sf-chat-content-wrapper a {
    color: #58954b !important;
}

.app-container a:hover,
.container a:hover,
#sf-chat-container a:hover,
#sf-chat-content-wrapper a:hover {
    color: #46773c !important;
}

.app-container .input-container:focus-within,
.container .input-container:focus-within,
#sf-chat-container .input-container:focus-within {
    border-color: #58954b !important;
    box-shadow: 0 0 0 3px rgba(88, 149, 75, 0.1) !important;
}

.app-container .btn-primary:focus,
.app-container .btn-secondary:focus,
.app-container .quick-action:focus,
.app-container .btn-language:focus,
.app-container .btn-submit:focus,
.container .btn-primary:focus,
.container .btn-secondary:focus,
.container .quick-action:focus,
.container .btn-language:focus,
.container .btn-submit:focus,
#sf-chat-container .btn-primary:focus,
#sf-chat-container .btn-secondary:focus,
#sf-chat-container .quick-action:focus,
#sf-chat-container .btn-language:focus,
#sf-chat-container .btn-submit:focus {
    box-shadow: 0 0 0 3px rgba(88, 149, 75, 0.2) !important;
}

.app-container .progress-bar,
.container .progress-bar,
#sf-chat-container .progress-bar {
    background-color: #58954b !important;
}

.app-container .status-active,
.container .status-active,
#sf-chat-container .status-active {
    background-color: #69b25a !important;
    color: #46773c !important;
}