@import '_content/Blazor.Bootstrap/Blazor.Bootstrap.7t9tbfaemk.bundle.scp.css';

/* _content/CourierService.WebApp/Components/Pages/Tracking.razor.rz.scp.css */

.tracking-container[b-covsourxk5] {
    width: 100%;
    max-width: 800px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    padding: 24px 32px;
    margin: auto;
}

header[b-covsourxk5] {
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 16px;
    margin-bottom: 24px;
}

    header h1[b-covsourxk5] {
        margin: 0;
        font-size: 2em;
        color: #2c3e50;
    }

.header-info[b-covsourxk5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 16px;
    font-size: 1.1em;
}

#tracking-number[b-covsourxk5] {
    font-weight: 700;
    color: #3498db;
}

.status-chip[b-covsourxk5] {
    padding: 6px 12px;
    border-radius: 16px;
    font-weight: 500;
    color: #fff;
    background-color: #f39c12; /* Default: In Transit */
}

    .status-chip.delivered[b-covsourxk5] {
        background-color: #2ecc71;
    }

    .status-chip.picked-up[b-covsourxk5] {
        background-color: #3498db;
    }

    .status-chip.exception[b-covsourxk5] {
        background-color: #e74c3c;
    }

    .status-chip.in-transit[b-covsourxk5] {
        background-color: #f39c12;
    }


.shipment-details[b-covsourxk5] {
    margin-bottom: 24px;
}

.address-info[b-covsourxk5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.address[b-covsourxk5] {
    width: 45%;
    padding: 16px;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
}

    .address h2[b-covsourxk5] {
        margin: 0 0 8px 0;
        font-size: 1.2em;
        color: #7f8c8d;
    }

    .address p[b-covsourxk5] {
        margin: 0;
        font-size: 1em;
        line-height: 1.5;
    }

.arrow[b-covsourxk5] {
    font-size: 2.5em;
    color: #bdc3c7;
}

.date-info[b-covsourxk5] {
    display: flex;
    justify-content: space-around;
    background-color: #f9f9f9;
    padding: 12px;
    border-radius: 6px;
}

    .date-info p[b-covsourxk5] {
        margin: 0;
    }

.timeline-container h2[b-covsourxk5] {
    font-size: 1.5em;
    color: #2c3e50;
    margin-bottom: 20px;
}

#timeline[b-covsourxk5] {
    list-style-type: none;
    padding-left: 20px;
    position: relative;
    margin: 0;
}

    #timeline[b-covsourxk5]::before {
        content: '';
        position: absolute;
        top: 10px;
        bottom: 10px;
        left: 8px;
        width: 4px;
        background-color: #e0e0e0;
        border-radius: 2px;
    }

.timeline-event[b-covsourxk5] {
    margin-bottom: 20px;
    position: relative;
    padding-left: 40px;
}

    .timeline-event[b-covsourxk5]::before {
        content: '';
        position: absolute;
        left: -2px;
        top: 5px;
        width: 20px;
        height: 20px;
        background-color: #fff;
        border: 4px solid #e0e0e0;
        border-radius: 50%;
        z-index: 1;
    }

    .timeline-event.active[b-covsourxk5]::before {
        border-color: #3498db;
    }

    .timeline-event:first-child .event-time[b-covsourxk5] {
        color: #2c3e50;
        font-weight: 700;
    }

    .timeline-event:first-child .event-description[b-covsourxk5] {
        color: #2c3e50;
        font-weight: 500;
    }

.event-time[b-covsourxk5] {
    font-size: 0.9em;
    color: #7f8c8d;
    margin-bottom: 4px;
    display: block;
}

.event-description[b-covsourxk5] {
    font-size: 1.1em;
    margin: 0 0 4px 0;
    color: #34495e;
}

.event-location[b-covsourxk5] {
    font-size: 0.9em;
    color: #95a5a6;
}
