/* --- START OF FILE public/css/history.css --- */

/* ПОИСК */
.search-input { 
    width: 100%; padding: 12px 16px 12px 36px; background: var(--bg-card); 
    border: 1px solid var(--border); border-radius: 12px; color: var(--text-primary); 
    font-size: 13px; outline: none; margin-bottom: 12px; transition: all 0.3s;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238b949e'%3E%3Cpath d='M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 16.032 2 11C2 5.968 6.032 2 11 2C15.968 2 20 5.968 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748Z'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: 10px center; background-size: 16px;
    box-shadow: 0 2px 8px var(--shadow-color);
}
.search-input:focus { border-color: var(--accent); box-shadow: 0 4px 15px rgba(227, 179, 65, 0.15); }

/* ЗАГОЛОВОК ДАТЫ */
.history-date-header { 
    position: sticky; top: 0; background: var(--bg-primary); opacity: 0.95;
    padding: 12px 4px 6px; font-size: 11px; font-weight: 800; color: var(--text-muted); 
    text-transform: uppercase; letter-spacing: 0.5px; z-index: 10; margin-top: 8px;
}

/* КАРТОЧКА ПОЕЗДКИ В СПИСКЕ (КОМПАКТНАЯ) */
.history-item { 
    background: linear-gradient(145deg, var(--bg-card), var(--bg-secondary)); 
    border: 1px solid var(--border); border-radius: 14px; 
    padding: 12px; margin-bottom: 8px; cursor: pointer; 
    box-shadow: 0 2px 8px var(--shadow-color);
    transition: transform 0.1s, border-color 0.2s;
    position: relative; overflow: hidden;
}
.history-item:active { transform: scale(0.98); border-color: var(--border-light); }

/* Верхний ряд карточки */
.h-top-row { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 8px; }
.h-time-dist { display: flex; flex-direction: column; }
.h-time { font-size: 14px; font-weight: 900; color: var(--text-primary); }
.h-dist { font-size: 10px; color: var(--text-muted); font-weight: 600; }
.h-price-block { text-align: right; }
.h-price { font-size: 15px; font-weight: 900; color: var(--text-primary); font-family: monospace; letter-spacing: -0.5px;}
.h-profit { font-size: 10px; font-weight: 800; padding: 1px 6px; border-radius: 6px; display: inline-block; margin-top: 2px; }
.h-profit.positive { color: var(--success); background: rgba(46, 160, 67, 0.15); }
.h-profit.negative { color: var(--danger); background: rgba(218, 54, 51, 0.15); }

/* Визуальный маршрут (Таймлайн - Компактный) */
.h-route { position: relative; margin-bottom: 10px; padding-left: 12px; }
.h-route::before {
    content: ''; position: absolute; left: 3px; top: 5px; bottom: 5px; width: 1px;
    background: repeating-linear-gradient(to bottom, var(--border) 0, var(--border) 4px, transparent 4px, transparent 6px);
}
.h-addr-row { display: flex; align-items: center; position: relative; margin-bottom: 6px; }
.h-addr-row:last-child { margin-bottom: 0; }
.h-dot { position: absolute; left: -12.5px; width: 7px; height: 7px; border-radius: 50%; border: 1.5px solid var(--bg-card); z-index: 2; }
.h-dot.start { background: var(--accent); }
.h-dot.end { background: var(--success); }
.h-address { font-size: 11px; font-weight: 600; color: var(--text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.2; }

/* Нижний ряд (Бейджи) */
.h-badges { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; border-top: 1px dashed var(--border); padding-top: 8px; }
.h-badge { font-size: 9px; font-weight: 800; padding: 2px 6px; border-radius: 6px; display: flex; align-items: center; gap: 4px; text-transform: uppercase; }
.h-badge-coeff { font-family: monospace; font-size: 10px; }

/* ДЕТАЛИ ПОЕЗДКИ (МОДАЛКА) */
.pt-finance-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 16px; }
.pt-fin-box { background: var(--bg-primary); border: 1px solid var(--border); border-radius: 12px; padding: 12px; position: relative; overflow: hidden; }
.pt-fin-lbl { font-size: 9px; color: var(--text-muted); text-transform: uppercase; font-weight: 800; margin-bottom: 4px; display: block; }
.pt-fin-val { font-size: 18px; font-weight: 900; color: var(--text-primary); font-family: monospace; }
.pt-fin-box.highlight { border-color: var(--accent); background: rgba(227, 179, 65, 0.05); }
.pt-fin-box.highlight .pt-fin-val { color: var(--accent); }

.pt-summary-box { background: var(--bg-primary); border: 1px solid var(--border); border-radius: 12px; padding: 12px; margin-bottom: 16px; }
.pt-sum-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; font-size: 12px; font-weight: 600; color: var(--text-secondary); }
.pt-sum-row:last-child { margin-bottom: 0; }
.pt-sum-row strong { font-family: monospace; font-size: 14px; color: var(--text-primary); }
/* --- END OF FILE history.css --- */