.fvtt-hamalron.action-complexe { .action-complexe-container { padding: 8px; } .action-complexe-header { margin-bottom: 12px; button { width: 100%; padding: 8px; background: #2a2a4a; color: #e0e0e0; border: 1px dashed #555; border-radius: 6px; cursor: pointer; font-size: 13px; &:hover { background: #3a3a6a; border-color: #e94560; } } } .action-complexe-list { display: flex; flex-direction: column; gap: 10px; } .action-card { background: #1e1e3a; border: 1px solid #333; border-radius: 8px; padding: 10px; &.action-complete { border-color: #4caf50; background: #1a2e1a; } } .action-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; .action-name { font-weight: 600; color: #e0e0e0; font-size: 14px; } .action-symbole { color: #e94560; font-size: 14px; } } .action-progress { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; .progress-bar { flex: 1; height: 8px; background: #333; border-radius: 4px; overflow: hidden; .progress-fill { height: 100%; width: calc(var(--pct) * 1%); background: linear-gradient(90deg, #e94560, #ff6b81); border-radius: 4px; transition: width 0.3s ease; } } .progress-text { font-size: 12px; color: #aaa; white-space: nowrap; } } .action-stats { display: flex; gap: 12px; margin-bottom: 4px; font-size: 12px; .stat-success { color: #4caf50; } .stat-failure { color: #f44336; } } .action-notes { font-size: 11px; color: #888; font-style: italic; margin-bottom: 6px; padding: 4px; background: rgba(0,0,0,0.2); border-radius: 4px; } .action-controls { display: flex; gap: 4px; button { padding: 4px 8px; border: none; border-radius: 4px; cursor: pointer; font-size: 11px; transition: opacity 0.2s; &:hover { opacity: 0.8; } } .btn-success { background: #2e7d32; color: #fff; } .btn-failure { background: #c62828; color: #fff; } .btn-reset { background: #555; color: #ccc; } .btn-delete { background: #333; color: #888; } } .action-empty { text-align: center; padding: 40px 20px; color: #666; i { margin-bottom: 12px; } p { font-size: 13px; } } }