/* Sales Automation Plugin Styles */

/* Stat Cards */
.sa-stat-card {
    border: none;
    border-radius: 8px;
    transition: transform 0.15s ease;
}
.sa-stat-card:hover {
    transform: translateY(-2px);
}
.sa-stat-card h3 {
    font-size: 1.8rem;
    font-weight: 700;
    margin: 0;
}
.sa-stat-card small {
    font-size: 0.8rem;
    opacity: 0.85;
}
.sa-stat-warning {
    background: linear-gradient(135deg, #fff3e0 0%, #ffe0b2 100%);
    color: #e65100;
}
.sa-stat-danger {
    background: linear-gradient(135deg, #ffebee 0%, #ffcdd2 100%);
    color: #c62828;
}
.sa-stat-info {
    background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
    color: #1565c0;
}
.sa-stat-success {
    background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
    color: #2e7d32;
}

/* Dashboard Widget */
.sa-dashboard-widget {
    border-right: 4px solid #FF9800;
    background: #fffbf5;
}
.sa-dashboard-widget h6 {
    color: #e65100;
    font-weight: 700;
}

/* Activity Timeline */
.sa-activity-item {
    display: flex;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid #f0f0f0;
}
.sa-activity-item:last-child {
    border-bottom: none;
}
.sa-activity-icon {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
}
.sa-activity-header {
    font-size: 0.85rem;
    margin-bottom: 2px;
}
.sa-activity-subject {
    font-weight: 600;
    font-size: 0.9rem;
}
.sa-activity-details {
    font-size: 0.8rem;
    margin-top: 2px;
}

/* RTL Adjustments */
[dir="rtl"] .sa-dashboard-widget {
    border-right: none;
    border-left: 4px solid #FF9800;
}
[dir="rtl"] .sa-activity-item {
    flex-direction: row-reverse;
}

/* ============================================================
   Phase Sales-Automation-Lang+UX-1.2 (chip-style action buttons)
   Scoped to #sa-followup-table only. Forces readable defaults
   (no need to hover) — chip background + colored stroke per role.
   ============================================================ */
#sa-followup-table td a.sa-row-action {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin-inline: 3px;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, .28);
    background: rgba(15, 23, 42, .55);
    opacity: 1 !important;
    text-decoration: none !important;
    line-height: 1;
    transition: transform .18s ease, background .18s ease, border-color .18s ease, filter .18s ease, box-shadow .18s ease;
}
#sa-followup-table td a.sa-row-action > svg {
    width: 16px;
    height: 16px;
    opacity: 1 !important;
    stroke-width: 2.2;
    color: inherit;
}
#sa-followup-table td a.sa-row-action-complete {
    color: #22C55E !important;
    background: rgba(34, 197, 94, .12);
    border-color: rgba(34, 197, 94, .35);
}
#sa-followup-table td a.sa-row-action-edit {
    color: #38BDF8 !important;
    background: rgba(56, 189, 248, .12);
    border-color: rgba(56, 189, 248, .35);
}
#sa-followup-table td a.sa-row-action-delete {
    color: #EF4444 !important;
    background: rgba(239, 68, 68, .12);
    border-color: rgba(239, 68, 68, .35);
}
#sa-followup-table td a.sa-row-action:hover,
#sa-followup-table td a.sa-row-action:focus {
    transform: translateY(-1px);
    filter: brightness(1.12);
    box-shadow: 0 6px 14px rgba(0, 0, 0, .22);
    text-decoration: none !important;
    outline: none;
}
#sa-followup-table td a.sa-row-action-complete:hover,
#sa-followup-table td a.sa-row-action-complete:focus {
    background: rgba(34, 197, 94, .22);
    border-color: rgba(34, 197, 94, .55);
}
#sa-followup-table td a.sa-row-action-edit:hover,
#sa-followup-table td a.sa-row-action-edit:focus {
    background: rgba(56, 189, 248, .22);
    border-color: rgba(56, 189, 248, .55);
}
#sa-followup-table td a.sa-row-action-delete:hover,
#sa-followup-table td a.sa-row-action-delete:focus {
    background: rgba(239, 68, 68, .22);
    border-color: rgba(239, 68, 68, .55);
}
/* Light theme fallback (less translucent background) */
body:not(.theme-bg-executive-dark) #sa-followup-table td a.sa-row-action {
    background: #f8fafc;
    border-color: rgba(100, 116, 139, .28);
}
/* End Phase 1.2 */