/* ═══════════════════════════════════════════════════════
   TradeForge — Unified Project Timeline Engine Styles
   Extends existing activity-timeline CSS with source-based
   filtering, date-range controls, and source breakdown stats.
   ═══════════════════════════════════════════════════════ */

/* ── Source Stats Row ── */
.pte-sources{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:6px;margin:0 0 16px}
@media(max-width:1000px){.pte-sources{grid-template-columns:repeat(4,1fr)}}
@media(max-width:520px){.pte-sources{grid-template-columns:repeat(2,1fr)}}

.pte-source{background:linear-gradient(180deg,rgba(46,49,54,.96),rgba(46,49,54,.82));border:1px solid rgba(181,183,185,.10);border-radius:10px;padding:10px 8px;text-align:center;cursor:pointer;transition:border-color .15s,transform .1s;position:relative}
.pte-source:hover{border-color:rgba(140,106,62,.35);transform:translateY(-1px)}
.pte-source.active{border-color:var(--bronze);background:rgba(140,106,62,.08)}
.pte-source-dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin:0 auto 4px}
.pte-source-count{font-size:20px;font-weight:700;color:#fff;line-height:1.2}
.pte-source-label{font-size:10px;color:var(--muted);margin:2px 0 0;line-height:1.2;letter-spacing:.02em}

/* ── Controls Row ── */
.pte-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 16px;padding:12px 0;border-top:1px solid rgba(181,183,185,.06);border-bottom:1px solid rgba(181,183,185,.06)}
.pte-search{background:rgba(46,49,54,.80);border:1px solid rgba(181,183,185,.12);border-radius:8px;padding:7px 12px 7px 32px;font-size:12px;color:var(--text);outline:none;width:220px;max-width:100%;transition:border-color .15s}
.pte-search:focus{border-color:var(--bronze)}
.pte-search-wrap{position:relative}
.pte-search-wrap svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:14px;height:14px;color:var(--muted);pointer-events:none}
.pte-date-range{display:flex;align-items:center;gap:6px}
.pte-date-input{background:rgba(46,49,54,.80);border:1px solid rgba(181,183,185,.12);border-radius:8px;padding:7px 10px;font-size:12px;color:var(--text);outline:none;width:130px}
.pte-date-input:focus{border-color:var(--bronze)}
.pte-date-sep{color:var(--muted);font-size:11px}
.pte-btn-clear{background:none;border:1px solid rgba(181,183,185,.12);border-radius:8px;padding:7px 12px;font-size:11px;color:var(--muted);cursor:pointer;transition:border-color .15s,color .15s}
.pte-btn-clear:hover{border-color:var(--bronze);color:var(--bronze)}

@media(max-width:640px){
  .pte-controls{flex-direction:column;align-items:stretch}
  .pte-search{width:100%}
  .pte-date-range{flex-wrap:wrap}
}

/* ── Timeline Container ── */
.pte-timeline{position:relative;padding:0 0 0 36px;margin:0 0 20px}
.pte-timeline::before{content:"";position:absolute;left:13px;top:0;bottom:0;width:2px;background:rgba(181,183,185,.08);border-radius:1px}

/* ── Date Separator ── */
.pte-date-sep-row{display:flex;align-items:center;gap:10px;margin:20px 0 12px;position:relative}
.pte-date-sep-row::before{content:"";position:absolute;left:-36px;top:50%;transform:translate(0,-50%);width:12px;height:12px;border-radius:50%;background:var(--bronze);border:2px solid rgba(15,17,20,.9);z-index:1}
.pte-date-label{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--bronze)}
.pte-date-line{flex:1;height:1px;background:rgba(181,183,185,.08)}
.pte-date-count{font-size:10px;color:var(--muted)}

/* ── Event Card ── */
.pte-event{position:relative;display:flex;gap:12px;padding:12px 14px;margin-bottom:6px;background:linear-gradient(180deg,rgba(46,49,54,.85),rgba(46,49,54,.65));border:1px solid rgba(181,183,185,.06);border-radius:10px;transition:border-color .15s,background .15s}
.pte-event:hover{border-color:rgba(140,106,62,.2);background:rgba(46,49,54,.92)}
.pte-event::before{content:"";position:absolute;left:-27px;top:18px;width:8px;height:8px;border-radius:50%;border:2px solid rgba(181,183,185,.15);background:var(--ink)}

/* Source dot colors on timeline events */
.pte-event[data-source="crew"]::before{border-color:rgba(140,106,62,.5)}
.pte-event[data-source="inspections"]::before{border-color:rgba(39,174,96,.5)}
.pte-event[data-source="deliveries"]::before{border-color:rgba(52,152,219,.5)}
.pte-event[data-source="incidents"]::before{border-color:rgba(231,76,60,.5)}
.pte-event[data-source="milestones"]::before{border-color:rgba(245,158,11,.5)}
.pte-event[data-source="permits"]::before{border-color:rgba(155,89,182,.5)}
.pte-event[data-source="weather"]::before{border-color:rgba(91,155,213,.5)}
.pte-event[data-source="equipment"]::before{border-color:rgba(230,126,34,.5)}
.pte-event[data-source="safety"]::before{border-color:rgba(224,93,68,.5)}
.pte-event[data-source="site-notes"]::before{border-color:rgba(23,165,137,.5)}
.pte-event[data-source="completion"]::before{border-color:rgba(46,204,113,.5)}

/* High-priority left accent */
.pte-event[data-priority="high"]{border-left:3px solid #e74c3c}

/* Source-specific left-border accents */
.pte-event[data-source="crew"]{border-left:3px solid rgba(140,106,62,.6)}
.pte-event[data-source="inspections"]{border-left:3px solid rgba(39,174,96,.6)}
.pte-event[data-source="deliveries"]{border-left:3px solid rgba(52,152,219,.6)}
.pte-event[data-source="incidents"]{border-left:3px solid rgba(231,76,60,.6)}
.pte-event[data-source="milestones"]{border-left:3px solid rgba(245,158,11,.6)}
.pte-event[data-source="permits"]{border-left:3px solid rgba(155,89,182,.6)}
.pte-event[data-source="weather"]{border-left:3px solid rgba(91,155,213,.6)}
.pte-event[data-source="equipment"]{border-left:3px solid rgba(230,126,34,.6)}
.pte-event[data-source="safety"]{border-left:3px solid rgba(224,93,68,.6)}
.pte-event[data-source="site-notes"]{border-left:3px solid rgba(23,165,137,.6)}
.pte-event[data-source="completion"]{border-left:3px solid rgba(46,204,113,.6)}
/* High priority overrides source border */
.pte-event[data-priority="high"][data-source]{border-left:3px solid #e74c3c}

/* ── Event Icon ── */
.pte-event-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pte-event-icon svg{width:16px;height:16px}

.pte-event-icon--crew{background:rgba(140,106,62,.12);color:var(--bronze)}
.pte-event-icon--crew svg{stroke:var(--bronze)}
.pte-event-icon--inspections{background:rgba(39,174,96,.12);color:#27ae60}
.pte-event-icon--inspections svg{stroke:#27ae60}
.pte-event-icon--deliveries{background:rgba(52,152,219,.12);color:#3498db}
.pte-event-icon--deliveries svg{stroke:#3498db}
.pte-event-icon--incidents{background:rgba(231,76,60,.12);color:#e74c3c}
.pte-event-icon--incidents svg{stroke:#e74c3c}
.pte-event-icon--milestones{background:rgba(245,158,11,.12);color:#f59e0b}
.pte-event-icon--milestones svg{stroke:#f59e0b}
.pte-event-icon--permits{background:rgba(155,89,182,.12);color:#9b59b6}
.pte-event-icon--permits svg{stroke:#9b59b6}
.pte-event-icon--weather{background:rgba(91,155,213,.12);color:#5b9bd5}
.pte-event-icon--weather svg{stroke:#5b9bd5}
.pte-event-icon--equipment{background:rgba(230,126,34,.12);color:#e67e22}
.pte-event-icon--equipment svg{stroke:#e67e22}
.pte-event-icon--safety{background:rgba(224,93,68,.12);color:#e05d44}
.pte-event-icon--safety svg{stroke:#e05d44}
.pte-event-icon--site-notes{background:rgba(23,165,137,.12);color:#17a589}
.pte-event-icon--site-notes svg{stroke:#17a589}
.pte-event-icon--completion{background:rgba(46,204,113,.12);color:#2ecc71}
.pte-event-icon--completion svg{stroke:#2ecc71}

/* ── Event Content ── */
.pte-event-body{flex:1;min-width:0}
.pte-event-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:2px}
.pte-event-title{font-size:13px;font-weight:600;color:#fff;line-height:1.4}
.pte-event-time{font-size:10px;color:var(--muted);margin-left:auto;white-space:nowrap}
.pte-event-tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:4px}
.pte-tag{display:inline-flex;align-items:center;gap:3px;font-size:10px;font-weight:600;padding:2px 8px;border-radius:4px;letter-spacing:.02em}

.pte-tag--crew{background:rgba(140,106,62,.12);color:var(--bronze)}
.pte-tag--inspections{background:rgba(39,174,96,.12);color:#27ae60}
.pte-tag--deliveries{background:rgba(52,152,219,.12);color:#3498db}
.pte-tag--incidents{background:rgba(231,76,60,.12);color:#e74c3c}
.pte-tag--milestones{background:rgba(245,158,11,.12);color:#f59e0b}
.pte-tag--permits{background:rgba(155,89,182,.12);color:#9b59b6}
.pte-tag--weather{background:rgba(91,155,213,.12);color:#5b9bd5}
.pte-tag--equipment{background:rgba(230,126,34,.12);color:#e67e22}
.pte-tag--safety{background:rgba(224,93,68,.12);color:#e05d44}
.pte-tag--site-notes{background:rgba(23,165,137,.12);color:#17a589}
.pte-tag--completion{background:rgba(46,204,113,.12);color:#2ecc71}
.pte-tag--high{background:rgba(231,76,60,.10);color:#e74c3c}
.pte-tag--type{background:rgba(181,183,185,.08);color:var(--muted)}

.pte-event-author{font-size:11px;color:var(--muted);margin-top:2px}

/* ── Event Detail Row ── */
.pte-event-detail{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:4px;font-size:11px;color:var(--ash);line-height:1.4}
.pte-event-detail span{display:inline-flex;align-items:center;gap:3px}
.pte-detail-desc{color:var(--muted);font-style:italic;max-width:100%}
.pte-detail-result--passed,.pte-detail-result--Passed{color:#27ae60}
.pte-detail-result--failed,.pte-detail-result--Failed{color:#e74c3c}

/* ── Total Banner ── */
.pte-total-banner{display:flex;align-items:center;justify-content:space-between;margin:0 0 12px;padding:10px 14px;background:rgba(140,106,62,.06);border:1px solid rgba(140,106,62,.12);border-radius:8px;font-size:12px;color:var(--ash)}
.pte-total-banner strong{color:var(--bronze)}

/* ── Load More ── */
.pte-load-more{text-align:center;margin:16px 0}
.pte-load-more button{background:none;border:1px solid rgba(181,183,185,.14);border-radius:8px;padding:10px 24px;font-size:12px;color:var(--ash);cursor:pointer;transition:border-color .15s,color .15s}
.pte-load-more button:hover{border-color:var(--bronze);color:var(--bronze)}

/* ── Loading / Empty ── */
.pte-loading{text-align:center;padding:24px 0;color:var(--muted);font-size:13px}
.pte-spinner{display:inline-block;width:16px;height:16px;border:2px solid rgba(140,106,62,.2);border-top-color:var(--bronze);border-radius:50%;animation:pte-spin .6s linear infinite;margin:0 0 8px}
@keyframes pte-spin{to{transform:rotate(360deg)}}
.pte-empty{text-align:center;padding:40px 0;color:var(--muted);font-size:13px}

/* ── Responsive timeline ── */
@media(max-width:520px){
  .pte-timeline{padding:0 0 0 24px}
  .pte-timeline::before{left:7px}
  .pte-date-sep-row::before{left:-24px;width:10px;height:10px}
  .pte-event::before{left:-19px;width:6px;height:6px}
  .pte-event{flex-direction:column;gap:8px}
  .pte-event-icon{width:30px;height:30px}
  .pte-event-icon svg{width:14px;height:14px}
  .pte-event-time{margin-left:0}
}

/* ── Mobile Field Optimization ── */
@media(max-width:900px){
  /* Touch targets — min 44px for interactive elements */
  .pte-source{min-height:48px;padding:12px 10px}
  .pte-btn-clear{min-height:44px;padding:10px 16px;font-size:13px}
  .pte-load-more button{min-height:44px;padding:12px 28px;font-size:13px}
  .pte-event{min-height:48px;padding:14px 16px}

  /* Input font size — 16px prevents iOS zoom */
  .pte-search{font-size:16px;padding:10px 14px 10px 36px;min-height:48px}
  .pte-date-input{font-size:16px;padding:10px 12px;min-height:48px;width:100%}

  /* Readable text for outdoor use */
  .pte-source-count{font-size:18px}
  .pte-source-label{font-size:11px}
  .pte-event-title{font-size:14px}
  .pte-event-detail{font-size:12px}
  .pte-event-author{font-size:12px}
  .pte-tag{font-size:11px;padding:3px 10px}
  .pte-date-label{font-size:12px}
  .pte-total-banner{font-size:13px;padding:12px 16px}

  /* Card and item spacing */
  .pte-event{margin-bottom:8px}
  .pte-date-sep-row{margin:18px 0 14px}

  /* Full-width controls on small screens */
  .pte-controls{flex-direction:column;align-items:stretch}
  .pte-search{width:100%}
  .pte-date-range{flex-wrap:wrap;width:100%}
  .pte-date-input{flex:1;min-width:0}
  .pte-btn-clear{width:100%;justify-content:center;text-align:center}
}