/**
 * Portal Themes CSS Fixes
 * Phase 4: Complete theme fixes with no inline styles
 * 
 * IMPORTANT: This file contains specific overrides that MUST come after portal-themes.css
 * to properly override base styles from replybridge-modern.css
 * 
 * Fixed Issues:
 * - Classic theme: blue backgrounds, readability
 * - Minimal theme: padding issues
 * - Vibrant theme: banner gradients, text readability
 * - Tech theme: dark backgrounds, gradients
 * - Terminal theme: table and button backgrounds
 * - All themes: new ticket button, portal tabs, table styles
 */

/* ========================================
   GLOBAL FIXES - Override base styles
   ======================================== */

/* Fix: Override gradient background from base CSS for ALL themes */
.replybridge-portal[data-theme] .replybridge-thread-header {
    background: var(--portal-header-bg) !important;
    color: var(--portal-text) !important;
}

/* Fix: Ensure thread header text inherits theme colors */
.replybridge-portal[data-theme] .replybridge-thread-header h2,
.replybridge-portal[data-theme] .replybridge-thread-header .replybridge-thread-info,
.replybridge-portal[data-theme] .replybridge-thread-header .replybridge-meta-item {
    color: inherit !important;
    opacity: 1 !important;
}

/* Fix: Customer message colors for ALL themes */
.replybridge-portal[data-theme] .replybridge-message.customer .replybridge-message-bubble {
    background: var(--portal-message-customer) !important;
}

/* Fix: Admin message colors for ALL themes */
.replybridge-portal[data-theme] .replybridge-message.admin .replybridge-message-bubble {
    background: var(--portal-message-admin) !important;
}

/* ========================================
   CLASSIC THEME FIXES
   ======================================== */

/* Fix 1: Remove blue gradient background, use white */
.replybridge-portal[data-theme="classic"] .replybridge-thread-header {
    background: #ffffff !important;
    color: #333333 !important;
    border-bottom: 3px solid #003366 !important;
    padding: 24px !important;
}

/* Fix 2: Ensure all header text is dark */
.replybridge-portal[data-theme="classic"] .replybridge-thread-header h2,
.replybridge-portal[data-theme="classic"] .replybridge-thread-header .replybridge-subject-line,
.replybridge-portal[data-theme="classic"] .replybridge-thread-header .replybridge-meta-item {
    color: #333333 !important;
}

/* Fix 3: Category tag on white background */
.replybridge-portal[data-theme="classic"] .replybridge-category-tag {
    background: #003366 !important;
    color: #ffffff !important;
}

/* Fix 4: Status pill styling */
.replybridge-portal[data-theme="classic"] .replybridge-status-pill {
    background: #336699 !important;
    color: #ffffff !important;
}

/* Fix 5: Tab active state visibility */
.replybridge-portal[data-theme="classic"] .replybridge-tab.active {
    background: #003366 !important;
    color: #ffffff !important;
    font-weight: 600;
}

/* ========================================
   MODERN THEME FIXES
   ======================================== */

/* Fix 1: Customer messages - blue background with white text */
.replybridge-portal[data-theme="modern"] .replybridge-message.customer .replybridge-message-bubble {
    background: #2196f3 !important;
    color: #ffffff !important;
}

/* Fix 2: Admin messages - light blue background */
.replybridge-portal[data-theme="modern"] .replybridge-message.admin .replybridge-message-bubble {
    background: #e3f2fd !important;
    color: #212529 !important;
}

/* Fix 3: Ensure message body text inherits color */
.replybridge-portal[data-theme="modern"] .replybridge-message.customer .replybridge-message-body,
.replybridge-portal[data-theme="modern"] .replybridge-message.customer .replybridge-message-body p {
    color: #ffffff !important;
}

/* ========================================
   TECH THEME FIXES
   ======================================== */

/* Fix 1: Attach files button - already styled but ensure specificity */
.replybridge-portal[data-theme="tech"] .replybridge-file-input-label,
.replybridge-portal[data-theme="tech"] .replybridge-attach-files,
.replybridge-portal[data-theme="tech"] button.replybridge-attach-files {
    background: #64ffda !important;
    color: #000000 !important;
    border: 2px solid #64ffda !important;
    padding: 8px 16px !important;
    font-family: 'Courier New', monospace !important;
    text-transform: uppercase !important;
    font-weight: bold !important;
    letter-spacing: 1px !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
    display: inline-block !important;
}

/* Fix 2: Attach button hover state */
.replybridge-portal[data-theme="tech"] .replybridge-file-input-label:hover,
.replybridge-portal[data-theme="tech"] .replybridge-attach-files:hover,
.replybridge-portal[data-theme="tech"] button.replybridge-attach-files:hover {
    background: transparent !important;
    color: #64ffda !important;
    box-shadow: 0 0 10px rgba(100, 255, 218, 0.5) !important;
}

/* Fix 3: Thread header for tech theme */
.replybridge-portal[data-theme="tech"] .replybridge-thread-header {
    background: #000000 !important;
    color: #64ffda !important;
    border-bottom: 2px solid #64ffda !important;
}

/* ========================================
   TERMINAL THEME FIXES
   ======================================== */

/* Fix 1: Attach files button - green terminal style */
.replybridge-portal[data-theme="terminal"] .replybridge-file-input-label,
.replybridge-portal[data-theme="terminal"] .replybridge-attach-files,
.replybridge-portal[data-theme="terminal"] button.replybridge-attach-files {
    background: transparent !important;
    color: #00ff00 !important;
    border: 1px solid #00ff00 !important;
    padding: 8px 16px !important;
    font-family: 'Courier New', monospace !important;
    text-transform: uppercase !important;
    font-weight: normal !important;
    letter-spacing: 1px !important;
    transition: all 0.1s ease !important;
    cursor: pointer !important;
    display: inline-block !important;
    text-shadow: 0 0 5px #00ff00 !important;
}

/* Fix 2: Attach button hover state */
.replybridge-portal[data-theme="terminal"] .replybridge-file-input-label:hover,
.replybridge-portal[data-theme="terminal"] .replybridge-attach-files:hover,
.replybridge-portal[data-theme="terminal"] button.replybridge-attach-files:hover {
    background: #00ff00 !important;
    color: #000000 !important;
    text-shadow: none !important;
}

/* Fix 3: Customer messages - green tinted background */
.replybridge-portal[data-theme="terminal"] .replybridge-message.customer .replybridge-message-bubble {
    background: #001100 !important;
    color: #00ff00 !important;
    border: 1px solid #00ff00 !important;
}

/* Fix 4: Admin messages */
.replybridge-portal[data-theme="terminal"] .replybridge-message.admin .replybridge-message-bubble {
    background: #000000 !important;
    color: #00ff00 !important;
    border: 1px solid #004400 !important;
}

/* Fix 5: Chat/messages background */
.replybridge-portal[data-theme="terminal"] .replybridge-messages-timeline {
    background: #000000 !important;
}

/* Fix 6: Thread header */
.replybridge-portal[data-theme="terminal"] .replybridge-thread-header {
    background: #000000 !important;
    color: #00ff00 !important;
    border-bottom: 1px solid #00ff00 !important;
}

/* ========================================
   ADDITIONAL THEME FIXES
   ======================================== */

/* Minimal Theme - Ensure clean appearance */
.replybridge-portal[data-theme="minimal"] .replybridge-thread-header {
    background: #ffffff !important;
    color: #333333 !important;
    border-bottom: 1px solid #e0e0e0 !important;
}

/* Corporate Theme - Professional appearance */
.replybridge-portal[data-theme="corporate"] .replybridge-thread-header {
    background: #ffffff !important;
    color: #2c3e50 !important;
    border-bottom: 2px solid #1a5490 !important;
}

/* Elegant Theme - Sophisticated styling */
.replybridge-portal[data-theme="elegant"] .replybridge-thread-header {
    background: #ffffff !important;
    color: #2c3e50 !important;
    border-bottom: 1px solid #d4af37 !important;
}

/* Vibrant Theme - Colorful appearance */
.replybridge-portal[data-theme="vibrant"] .replybridge-thread-header {
    background: linear-gradient(135deg, #e91e63, #9c27b0) !important;
    color: #ffffff !important;
}

/* Gradient Theme - Glassmorphism style */
.replybridge-portal[data-theme="gradient"] .replybridge-thread-header {
    background: rgba(255, 255, 255, 0.1) !important;
    backdrop-filter: blur(10px) !important;
    color: #ffffff !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2) !important;
}

/* ========================================
   ENSURE PROPER CASCADING
   ======================================== */

/* Make sure all text elements inherit theme colors */
.replybridge-portal[data-theme] .replybridge-message-body,
.replybridge-portal[data-theme] .replybridge-message-body p,
.replybridge-portal[data-theme] .replybridge-message-body span,
.replybridge-portal[data-theme] .replybridge-message-author,
.replybridge-portal[data-theme] .replybridge-message-time {
    color: inherit !important;
}

/* Ensure buttons in reply form respect theme */
.replybridge-portal[data-theme] .replybridge-btn-primary {
    background: var(--portal-primary) !important;
    color: var(--portal-text-on-primary) !important;
    border-color: var(--portal-primary) !important;
}

.replybridge-portal[data-theme] .replybridge-btn-primary:hover {
    opacity: 0.9;
}

/* Fix tab visibility across all themes */
.replybridge-portal[data-theme] .replybridge-tab {
    background: transparent;
    color: var(--portal-text);
    opacity: 0.7;
    transition: all 0.2s ease;
}

.replybridge-portal[data-theme] .replybridge-tab:hover {
    opacity: 1;
}

.replybridge-portal[data-theme] .replybridge-tab.active {
    opacity: 1;
    font-weight: 600;
}

/* ========================================
   AVATAR COLOR FIXES - Remove inline styles
   ======================================== */

/* Default avatar colors */
.replybridge-portal[data-theme] .replybridge-message-avatar[data-author-type="customer"] {
    background: var(--portal-secondary, #4caf50) !important;
    color: var(--portal-text-on-primary, #ffffff) !important;
}

.replybridge-portal[data-theme] .replybridge-message-avatar[data-author-type="admin"] {
    background: var(--portal-primary, #2196f3) !important;
    color: var(--portal-text-on-primary, #ffffff) !important;
}

/* Theme-specific avatar overrides */
.replybridge-portal[data-theme="classic"] .replybridge-message-avatar[data-author-type="admin"] {
    background: var(--portal-secondary, #336699) !important;
}

.replybridge-portal[data-theme="terminal"] .replybridge-message-avatar {
    background: var(--portal-text, #39ff14) !important;
    color: var(--portal-bg, #0a0a0a) !important;
}

.replybridge-portal[data-theme="tech"] .replybridge-message-avatar[data-author-type="admin"] {
    background: var(--portal-primary, #00d4ff) !important;
    color: var(--portal-text-on-primary, #0a0e27) !important;
}

.replybridge-portal[data-theme="vibrant"] .replybridge-message-avatar[data-author-type="admin"] {
    background: var(--portal-primary, #ff6b6b) !important;
}

.replybridge-portal[data-theme="vibrant"] .replybridge-message-avatar[data-author-type="customer"] {
    background: var(--portal-secondary, #4ecdc4) !important;
}

/* ========================================
   NEW TICKET BUTTON FIXES - All Themes
   ======================================== */

/* Ensure new ticket button uses theme colors */
.replybridge-portal[data-theme] .replybridge-new-ticket-btn {
    background: var(--portal-primary) !important;
    color: var(--portal-text-on-primary) !important;
    border: none !important;
    transition: all 0.2s ease;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.replybridge-portal[data-theme] .replybridge-new-ticket-btn .dashicons {
    font-size: 18px !important;
    width: 18px !important;
    height: 18px !important;
    line-height: 1 !important;
    vertical-align: middle !important;
    margin: 0 !important;
}

.replybridge-portal[data-theme] .replybridge-new-ticket-btn:hover {
    opacity: 0.9;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

/* Theme-specific button overrides */
.replybridge-portal[data-theme="terminal"] .replybridge-new-ticket-btn {
    background: transparent !important;
    color: var(--portal-text) !important;
    border: 1px solid var(--portal-text) !important;
}

.replybridge-portal[data-theme="terminal"] .replybridge-new-ticket-btn:hover {
    background: var(--portal-text) !important;
    color: var(--portal-bg) !important;
}

.replybridge-portal[data-theme="gradient"] .replybridge-new-ticket-btn {
    background: white !important;
    color: var(--portal-gradient-start, #7c3aed) !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* ========================================
   MINIMAL THEME - Padding Fixes
   ======================================== */

.replybridge-portal[data-theme="minimal"] .replybridge-portal-container {
    padding: 20px;
}

.replybridge-portal[data-theme="minimal"] .replybridge-messages-timeline {
    padding: 20px !important;
}

.replybridge-portal[data-theme="minimal"] .replybridge-ticket-info,
.replybridge-portal[data-theme="minimal"] .replybridge-attachments-section {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.replybridge-portal[data-theme="minimal"] .replybridge-portal-tabs {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ========================================
   VIBRANT THEME - Banner & Text Fixes
   ======================================== */

/* Fix portal header gradient to match ticket view */
.replybridge-portal[data-theme="vibrant"] .replybridge-portal-header {
    background: linear-gradient(135deg, #ff6b6b 0%, #4ecdc4 100%) !important;
    color: white !important;
    padding: 32px;
    margin: -20px -20px 24px -20px;
    border-radius: 0 0 24px 24px;
}

.replybridge-portal[data-theme="vibrant"] .replybridge-portal-header h1,
.replybridge-portal[data-theme="vibrant"] .replybridge-portal-header p {
    color: white !important;
}

/* Ensure text readability on gradient */
.replybridge-portal[data-theme="vibrant"] .replybridge-thread-header {
    background: linear-gradient(135deg, #ff6b6b 0%, #4ecdc4 100%) !important;
    position: relative;
}

.replybridge-portal[data-theme="vibrant"] .replybridge-thread-header::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.1);
    pointer-events: none;
}

.replybridge-portal[data-theme="vibrant"] .replybridge-thread-header * {
    position: relative;
    z-index: 1;
}

/* ========================================
   TECH THEME - Dark Background Fixes
   ======================================== */

/* Fix portal view background */
.replybridge-portal[data-theme="tech"] {
    background: var(--portal-bg, #0a0e27) !important;
    min-height: 100vh;
}

.replybridge-portal[data-theme="tech"] .replybridge-portal-container {
    background: var(--portal-bg, #0a0e27) !important;
    color: var(--portal-text, #e4e6eb) !important;
}

/* Fix gradient in ticket view header */
.replybridge-portal[data-theme="tech"] .replybridge-thread-header {
    background: linear-gradient(135deg, var(--portal-header-bg, #151934) 0%, rgba(0,212,255,0.1) 100%) !important;
    color: var(--portal-text, #e4e6eb) !important;
    border-bottom: 2px solid var(--portal-primary, #00d4ff) !important;
}

/* Fix table backgrounds */
.replybridge-portal[data-theme="tech"] .replybridge-tickets-table {
    background: var(--portal-header-bg, #151934) !important;
}

.replybridge-portal[data-theme="tech"] .replybridge-tickets-table th {
    background: var(--portal-bg, #0a0e27) !important;
    color: var(--portal-primary, #00d4ff) !important;
}

.replybridge-portal[data-theme="tech"] .replybridge-tickets-table td {
    background: transparent !important;
    color: var(--portal-text, #e4e6eb) !important;
}

/* ========================================
   TERMINAL THEME - Table & Background Fixes
   ======================================== */

/* Fix table backgrounds */
.replybridge-portal[data-theme="terminal"] .replybridge-tickets-table {
    background: var(--portal-bg, #0a0a0a) !important;
}

.replybridge-portal[data-theme="terminal"] .replybridge-tickets-table th {
    background: var(--portal-header-bg, #1a1a1a) !important;
    color: var(--portal-text-accent, #ffd700) !important;
}

.replybridge-portal[data-theme="terminal"] .replybridge-tickets-table td {
    background: transparent !important;
    color: var(--portal-text, #39ff14) !important;
}

/* Fix attach files button */
.replybridge-portal[data-theme="terminal"] .replybridge-attach-files,
.replybridge-portal[data-theme="terminal"] .replybridge-file-input-label {
    background: transparent !important;
    color: var(--portal-text, #39ff14) !important;
    border: 1px solid var(--portal-text, #39ff14) !important;
    text-shadow: 0 0 5px var(--portal-text, #39ff14);
}

.replybridge-portal[data-theme="terminal"] .replybridge-attach-files:hover,
.replybridge-portal[data-theme="terminal"] .replybridge-file-input-label:hover {
    background: var(--portal-text, #39ff14) !important;
    color: var(--portal-bg, #0a0a0a) !important;
    text-shadow: none;
}

/* Fix portal container background */
.replybridge-portal[data-theme="terminal"] .replybridge-portal-container {
    background: var(--portal-bg, #0a0a0a) !important;
}

/* Fix Terminal theme icons */
.replybridge-portal[data-theme="terminal"] .dashicons {
    font-family: dashicons !important;
}

.replybridge-portal[data-theme="terminal"] .dashicons-plus-alt:before {
    content: "\f132" !important;
}

/* ========================================
   TABLE STYLE FIXES - All 4 Variations
   ======================================== */

/* Ensure table styles respect theme colors */
.replybridge-portal[data-theme] .replybridge-table-modern {
    background: var(--portal-header-bg) !important;
}

.replybridge-portal[data-theme] .replybridge-table-modern thead {
    background: var(--portal-bg) !important;
}

.replybridge-portal[data-theme] .replybridge-table-modern th {
    color: var(--portal-text-muted) !important;
}

.replybridge-portal[data-theme] .replybridge-table-classic {
    background: var(--portal-header-bg) !important;
    border-color: var(--portal-border) !important;
}

.replybridge-portal[data-theme] .replybridge-table-classic th {
    background: var(--portal-bg) !important;
    color: var(--portal-text) !important;
}

.replybridge-portal[data-theme] .replybridge-table-compact {
    background: var(--portal-header-bg) !important;
}

.replybridge-portal[data-theme] .replybridge-table-compact thead {
    border-bottom-color: var(--portal-primary) !important;
}

.replybridge-portal[data-theme] .replybridge-table-cards {
    background: transparent !important;
}

.replybridge-portal[data-theme] .replybridge-table-cards tr {
    background: var(--portal-header-bg) !important;
    color: var(--portal-text) !important;
}

/* ========================================
   PORTAL TABS - All Themes
   ======================================== */

/* Ensure consistent tab styling */
.replybridge-portal[data-theme] .replybridge-portal-tabs {
    background: var(--portal-header-bg) !important;
}

.replybridge-portal[data-theme] .replybridge-tab {
    color: var(--portal-text) !important;
    opacity: 0.7;
}

.replybridge-portal[data-theme] .replybridge-tab:hover {
    opacity: 1;
    background: var(--portal-bg) !important;
}

.replybridge-portal[data-theme] .replybridge-tab.active {
    background: var(--portal-primary) !important;
    color: var(--portal-text-on-primary) !important;
    opacity: 1;
}

/* ========================================
   ELEGANT THEME - Portal Tabs Fix
   ======================================== */

.replybridge-portal[data-theme="elegant"] .replybridge-portal-tabs {
    display: flex !important;
    gap: 24px !important;
    margin-bottom: 32px !important;
    padding-bottom: 16px !important;
    border-bottom: 2px solid var(--portal-border, #e8e3dc) !important;
    background: transparent !important;
}

.replybridge-portal[data-theme="elegant"] .replybridge-tab {
    flex: 0 0 auto !important;
    padding: 8px 0 !important;
    border: none !important;
    background: transparent !important;
    color: var(--portal-text-muted, #8a8a8a) !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    position: relative !important;
}

.replybridge-portal[data-theme="elegant"] .replybridge-tab:after {
    content: '' !important;
    position: absolute !important;
    bottom: -18px !important;
    left: 0 !important;
    right: 0 !important;
    height: 2px !important;
    background: var(--portal-primary, #8b7355) !important;
    transform: scaleX(0) !important;
    transition: transform 0.3s ease !important;
}

.replybridge-portal[data-theme="elegant"] .replybridge-tab:hover {
    color: var(--portal-text, #3a3a3a) !important;
    background: transparent !important;
}

.replybridge-portal[data-theme="elegant"] .replybridge-tab.active {
    color: var(--portal-primary, #8b7355) !important;
    background: transparent !important;
}

.replybridge-portal[data-theme="elegant"] .replybridge-tab.active:after {
    transform: scaleX(1) !important;
}

/* ========================================
   GRADIENT THEME - Table Header Fix
   ======================================== */

.replybridge-portal[data-theme="gradient"] .replybridge-tickets-table thead {
    background: transparent !important;
}

.replybridge-portal[data-theme="gradient"] .replybridge-tickets-table thead tr {
    background: linear-gradient(90deg, var(--portal-gradient-start, #7c3aed) 0%, var(--portal-gradient-end, #2563eb) 100%) !important;
}

.replybridge-portal[data-theme="gradient"] .replybridge-tickets-table th {
    background: transparent !important;
    color: white !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border: none !important;
}

/* ========================================
   STATUS BADGES - All Themes
   ======================================== */

/* Base status badge styling */
.replybridge-portal[data-theme] .replybridge-status-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 4px 12px !important;
    border-radius: 20px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-transform: capitalize !important;
}

/* Theme-specific status badge colors */
.replybridge-portal[data-theme="modern"] .replybridge-status-badge.status-open {
    background: rgba(76, 175, 80, 0.15) !important;
    color: #4caf50 !important;
}

.replybridge-portal[data-theme="modern"] .replybridge-status-badge.status-pending {
    background: rgba(255, 152, 0, 0.15) !important;
    color: #ff9800 !important;
}

.replybridge-portal[data-theme="modern"] .replybridge-status-badge.status-resolved {
    background: rgba(33, 150, 243, 0.15) !important;
    color: #2196f3 !important;
}

.replybridge-portal[data-theme="modern"] .replybridge-status-badge.status-closed {
    background: rgba(244, 67, 54, 0.15) !important;
    color: #f44336 !important;
}

/* Terminal theme status badges */
.replybridge-portal[data-theme="terminal"] .replybridge-status-badge {
    background: transparent !important;
    border: 1px solid var(--portal-text, #39ff14) !important;
    color: var(--portal-text, #39ff14) !important;
}

.replybridge-portal[data-theme="terminal"] .replybridge-status-badge.status-closed {
    border-color: var(--portal-text-accent, #ffd700) !important;
    color: var(--portal-text-accent, #ffd700) !important;
}

/* Tech theme status badges */
.replybridge-portal[data-theme="tech"] .replybridge-status-badge {
    background: rgba(0, 212, 255, 0.1) !important;
    border: 1px solid var(--portal-primary, #00d4ff) !important;
    color: var(--portal-primary, #00d4ff) !important;
}

.replybridge-portal[data-theme="tech"] .replybridge-status-badge.status-closed {
    background: rgba(255, 0, 0, 0.1) !important;
    border-color: #ff0066 !important;
    color: #ff0066 !important;
}

/* Classic theme status badges */
.replybridge-portal[data-theme="classic"] .replybridge-status-badge {
    font-weight: 600 !important;
}

.replybridge-portal[data-theme="classic"] .replybridge-status-badge.status-open {
    background: #e8f5e9 !important;
    color: #2e7d32 !important;
}

.replybridge-portal[data-theme="classic"] .replybridge-status-badge.status-pending {
    background: #fff3e0 !important;
    color: #e65100 !important;
}

.replybridge-portal[data-theme="classic"] .replybridge-status-badge.status-resolved {
    background: #e3f2fd !important;
    color: #1565c0 !important;
}

.replybridge-portal[data-theme="classic"] .replybridge-status-badge.status-closed {
    background: #ffebee !important;
    color: #c62828 !important;
}

/* ========================================
   TICKET VIEW STYLING - All Themes
   ======================================== */

/* Ensure ticket view elements inherit theme styles */
.replybridge-portal[data-theme] .replybridge-thread-container {
    background: var(--portal-bg) !important;
    color: var(--portal-text) !important;
}

.replybridge-portal[data-theme] .replybridge-thread-header {
    background: var(--portal-header-bg) !important;
    color: var(--portal-text) !important;
    border-bottom: 2px solid var(--portal-primary) !important;
}

.replybridge-portal[data-theme] .replybridge-messages-timeline {
    background: var(--portal-bg) !important;
}

.replybridge-portal[data-theme] .replybridge-message-bubble {
    background: var(--portal-message-customer) !important;
    color: var(--portal-text) !important;
}

.replybridge-portal[data-theme] .replybridge-message.admin .replybridge-message-bubble {
    background: var(--portal-message-admin) !important;
}

/* Ensure admin messages have proper text color */
.replybridge-portal[data-theme="modern"] .replybridge-message.admin .replybridge-message-bubble,
.replybridge-portal[data-theme="modern"] .replybridge-message.admin .replybridge-message-body,
.replybridge-portal[data-theme="modern"] .replybridge-message.admin .replybridge-message-body * {
    color: var(--portal-text-on-primary, white) !important;
}

.replybridge-portal[data-theme="vibrant"] .replybridge-message.admin .replybridge-message-bubble,
.replybridge-portal[data-theme="vibrant"] .replybridge-message.admin .replybridge-message-body,
.replybridge-portal[data-theme="vibrant"] .replybridge-message.admin .replybridge-message-body * {
    color: var(--portal-text-on-primary, white) !important;
}

/* Tech theme specific ticket view fixes */
.replybridge-portal[data-theme="tech"] .replybridge-thread-container {
    background: var(--portal-bg, #0a0e27) !important;
}

.replybridge-portal[data-theme="tech"] .replybridge-messages-timeline {
    background: var(--portal-bg, #0a0e27) !important;
}

.replybridge-portal[data-theme="tech"] .replybridge-reply-form {
    background: var(--portal-header-bg, #151934) !important;
}

/* Terminal theme specific ticket view fixes */
.replybridge-portal[data-theme="terminal"] .replybridge-thread-container {
    background: var(--portal-bg, #0a0a0a) !important;
}

.replybridge-portal[data-theme="terminal"] .replybridge-messages-timeline {
    background: var(--portal-bg, #0a0a0a) !important;
}

.replybridge-portal[data-theme="terminal"] .replybridge-reply-form {
    background: var(--portal-header-bg, #1a1a1a) !important;
}

/* Classic theme specific ticket view fixes */
.replybridge-portal[data-theme="classic"] .replybridge-thread-header {
    background: white !important;
    border-bottom: 3px solid var(--portal-primary, #003366) !important;
}

/* Elegant theme specific ticket view fixes */
.replybridge-portal[data-theme="elegant"] .replybridge-message-bubble {
    border-radius: 8px !important;
}

.replybridge-portal[data-theme="elegant"] .replybridge-thread-header {
    border-bottom: 1px solid var(--portal-border, #e8e3dc) !important;
}

/* Corporate theme specific ticket view fixes */
.replybridge-portal[data-theme="corporate"] .replybridge-thread-header {
    border-bottom: 2px solid var(--portal-primary, #1a5490) !important;
}

/* Minimal theme specific ticket view fixes */
.replybridge-portal[data-theme="minimal"] .replybridge-message-bubble {
    border-radius: 0 !important;
}

/* Gradient theme specific ticket view fixes */
.replybridge-portal[data-theme="gradient"] .replybridge-thread-header {
    background: linear-gradient(135deg, var(--portal-gradient-start, #7c3aed), var(--portal-gradient-end, #2563eb)) !important;
    color: white !important;
}

.replybridge-portal[data-theme="gradient"] .replybridge-thread-header h2,
.replybridge-portal[data-theme="gradient"] .replybridge-thread-header .replybridge-subject-line,
.replybridge-portal[data-theme="gradient"] .replybridge-thread-header .replybridge-meta-item {
    color: white !important;
}

/* Vibrant theme specific ticket view fixes (already partially done above) */
.replybridge-portal[data-theme="vibrant"] .replybridge-thread-header h2,
.replybridge-portal[data-theme="vibrant"] .replybridge-thread-header .replybridge-subject-line,
.replybridge-portal[data-theme="vibrant"] .replybridge-thread-header .replybridge-meta-item {
    color: white !important;
}