.tds-timeline-wrapper { margin: 25px 0; width: 100%; }
.tds-timeline-card { position: relative; border-radius: 20px; padding: 30px 25px 45px; overflow: hidden; box-shadow: 0 12px 30px rgba(0,0,0,0.15); }
.tds-timeline-header { text-align: center; margin-bottom: 20px; font-weight: 400; font-size: 12px; }
.tds-steps { display: flex; justify-content: space-between; position: relative; z-index: 5; }
.tds-step { flex: 1; text-align: center; }
.tds-step-top { font-weight: 700; margin-bottom: 10px; font-size: 16px; }
.tds-line-wrap { position: absolute; height: 8px; top: 62%; z-index: 1; }
.tds-line { position: absolute; width: 100%; height: 100%; border-radius: 4px; background: rgba(0,0,0,0.1); }
.tds-progress { position: absolute; height: 100%; border-radius: 4px; transition: width 0.6s ease; }
.tds-marker { width: 20px; height: 20px; border-radius: 50%; border: 4px solid #ddd; background: #fff; margin: 0 auto; position: relative; top: 6px; z-index: 10; box-sizing: border-box; }
.tds-today-marker { border-color: #10b981; box-shadow: 0 0 0 5px rgba(16,185,129,0.3); transform: scale(1.1); }
.tds-today-badge { position: absolute; top: 32px; left: 50%; transform: translateX(-50%); background: #10b981; color: #fff; font-size: 11px; padding: 2px 10px; border-radius: 10px; white-space: nowrap; }
.m-label { display: none; }
/* Themes */
.tds-theme-pink .tds-timeline-card { background: #ffd6d6; } .tds-theme-pink .tds-progress { background: #2f9e44; }
.tds-theme-blue .tds-timeline-card { background: #d6e4ff; } .tds-theme-blue .tds-progress { background: #1c7ed6; }
.tds-theme-green .tds-timeline-card { background: #d8f5d0; } .tds-theme-green .tds-progress { background: #2b8a3e; }
.tds-theme-dark .tds-timeline-card { background: #1f2933; color: #f9fafb; } .tds-theme-dark .tds-line { background: #4b5563; } .tds-theme-dark .tds-progress { background: #10b981; }
@media (max-width: 768px) { .d-label { display: none; } .m-label { display: inline; } .tds-line-wrap { top: auto; bottom: 15px; } .tds-today-badge { display: none; } }