/* --- Receipt Page General Layout --- */
.receipt-container {
    /* .page-container provides base padding and margin */
}

.receipt-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--theme-medium-gray);
}

.receipt-header .page-title-text {
    font-size: 1.85rem;
    font-weight: 700;
    color: var(--theme-dark-gray);
    margin-bottom: 0;
}

/* --- Overview Card --- */
.receipt-overview-card {
    margin-bottom: 1.5rem;
    border: 1px solid var(--theme-medium-gray);
}
.receipt-overview-card .card-body .h4 {
    color: var(--theme-dark-gray);
}

/* --- Status Badges specific for Receipt (using theme variables) --- */
.status-badge {
    padding: 0.4em 0.8em;
    border-radius: 15px;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: capitalize;
    display: inline-block;
    border: 1px solid transparent;
    line-height: 1.2;
}
.status-badge i {
    font-size: 0.9em;
}

.status-receipt-pending { background-color: #FFF3CD; color: #664d03; border-color: #FFECB5; }
.status-receipt-confirmed { background-color: #CFF4FC; color: #055160; border-color: #B6EFFB; }
.status-receipt-assigned { background-color: #D2E5FE; color: #0A4DB9; border-color: #BCD5FD; }
.status-receipt-picked-up { background-color: #FFE69C; color: #7A5600; border-color: #FFDD80; }
.status-receipt-on-the-way { background-color: #FFE69C; color: #7A5600; border-color: #FFDD80; }
.status-receipt-delivered { background-color: #D4EDDA; color: #146c43; border-color: #C1E5CB; }
.status-receipt-cancelled { background-color: #ffffff; color: #b02a37; border-color: #b02a37; } /* Removed red background, set to white with red border */

/* --- Rider Alert --- */
.alert-info.theme-alert {
    background-color: #cfe2ff;
    border-color: #b6d4fe;
    color: #084298;
}
.alert-info.theme-alert .alert-link {
    color: #062c65;
    font-weight: bold;
}

/* --- Order Progress Bar --- */
.order-progress-card .card-header .card-title-text {
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--theme-dark-gray);
    margin-bottom: 0;
}

.progress-track-container {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    text-align: center;
    flex-wrap: nowrap;
    gap: 0.25rem;
    padding: 0.5rem 0;
}

.progress-track-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    min-width: 70px;
    transition: all 0.3s ease;
}

.progress-track-icon-wrapper {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    transition: all 0.3s ease;
    border: 2px solid var(--theme-medium-gray);
    background-color: var(--theme-light-gray);
    color: var(--theme-text-muted);
    margin-bottom: 0.5rem;
}

.progress-track-label {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--theme-text-muted);
    margin-bottom: 0.25rem;
    line-height: 1.2;
    min-height: 2.4em;
}
.progress-track-date {
    font-size: 0.7rem;
    color: var(--theme-text-muted);
}

/* Step States */
.progress-track-step.completed-step .progress-track-icon-wrapper {
    background-color: var(--theme-dark-yellow);
    border-color: var(--theme-dark-yellow-hover);
    color: var(--theme-white);
}
.progress-track-step.completed-step .progress-track-label {
    color: var(--theme-dark-gray);
    font-weight: 600;
}

.progress-track-step.active-step .progress-track-icon-wrapper {
    background-color: var(--theme-dark-yellow);
    border-color: var(--theme-dark-yellow-hover);
    color: var(--theme-white);
    transform: scale(1.1);
    box-shadow: 0 0 10px rgba(var(--theme-dark-yellow-rgb), 0.5);
}
.progress-track-step.active-step .progress-track-label {
    color: var(--theme-dark-yellow);
    font-weight: 700;
}

.progress-track-step.future-step .progress-track-icon-wrapper {
    background-color: var(--theme-light-gray);
    border-color: var(--theme-medium-gray);
    color: var(--theme-text-muted);
}
.progress-track-step.future-step .progress-track-label {
    color: var(--theme-text-muted);
}

.progress-track-connector {
    flex-grow: 1;
    height: 3px;
    background-color: var(--theme-medium-gray);
    margin-top: 21px;
    transition: background-color 0.3s ease;
    min-width: 10px;
}
.progress-track-connector.completed {
    background-color: var(--theme-dark-yellow);
}

/* Ensure no connector after cancelled step */
.progress-track-container .progress-track-step.active-step.status-receipt-cancelled + .progress-track-connector {
    display: none;
}

/* Enhance cancelled step appearance */
.progress-track-step.active-step.status-receipt-cancelled .progress-track-icon-wrapper {
    background-color: #ffffff; /* Match new badge background */
    border-color: #b02a37; /* Red border to indicate cancellation */
    color: #b02a37; /* Red text/icon */
    box-shadow: 0 0 8px rgba(176, 42, 55, 0.5); /* Subtle shadow */
}

.progress-track-step.active-step.status-receipt-cancelled .progress-track-label {
    color: #b02a37; /* Red text */
    font-weight: 700;
}

/* --- Cards & Tables within Receipt --- */
.receipt-container .card {
    border: 1px solid var(--theme-medium-gray);
    box-shadow: 0 1px 3px rgba(0,0,0,0.03);
}
.receipt-container .card-header {
    background-color: var(--theme-light-gray);
    border-bottom: 1px solid var(--theme-medium-gray);
    padding: 0.75rem 1.25rem;
}
.receipt-container .card-header .card-title-text {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--theme-dark-gray);
    margin-bottom: 0;
}
.card-header-search {
    max-width: 200px;
    background-color: var(--theme-white) !important;
}

/* Order Items Table */
.order-items-card .item-options-list {
    font-size: 0.8em;
    padding-left: 1rem;
}
.order-items-card .item-options-list i {
    color: var(--theme-dark-yellow);
}
.order-items-card .item-special-instructions {
    color: var(--theme-text-muted) !important;
    background-color: #f8f9fa;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
}
.order-items-card .table th {
    font-size: 0.8rem !important;
}
.order-items-card .table td {
    font-size: 0.85rem !important;
}
.order-items-card .order-totals-footer td {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    font-size: 0.9rem;
}
.order-items-card .order-totals-footer .grand-total-row td {
    font-size: 1rem;
    color: var(--theme-dark-gray);
    background-color: var(--theme-light-gray);
    border-top: 2px solid var(--theme-medium-gray);
}

/* --- Map & Rider --- */
.map-container-wrapper {
    border-radius: 0 0 var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius);
    overflow: hidden;
    border: 1px solid var(--theme-medium-gray);
    border-top: none;
}
#mapReceipt {
    height: 400px !important;
}
.delivery-location-card .card-body,
.assigned-rider-card .card-body,
.delivery-address-text-card .card-body {
    font-size: 0.9rem;
}
.delivery-marker-icon { 
    color: var(--bs-danger) !important; 
    display: inline-block !important;
    visibility: visible !important;
}
.rider-marker-icon { 
    color: var(--bs-primary) !important; 
    display: inline-block !important;
    visibility: visible !important;
}

.map-popup-content {
    font-size: 0.875rem;
    padding: 2px;
}
.map-popup-content .map-popup-title {
    color: var(--theme-dark-yellow);
    font-weight: 600;
}

.leaflet-div-icon-transparent {
    background: transparent;
    border: none;
}
.leaflet-popup-content-wrapper {
    border-radius: 6px !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}
.leaflet-popup-content {
    margin: 0;
    padding: 0.5rem 0.75rem;
}

.rider-avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: rgba(var(--theme-dark-yellow-rgb), 0.1);
    color: var(--theme-dark-yellow);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease-in-out;
    flex-shrink: 0;
}
.rider-avatar i {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: var(--theme-dark-yellow) !important;
    font-size: 1.5rem !important;
}
.rider-avatar:hover {
    transform: scale(1.05);
}
.assigned-rider-card .card-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--theme-dark-gray);
}

/* Ensure icons are always visible and properly sized */
.assigned-rider-card .rider-avatar i.fas,
.assigned-rider-card .rider-avatar i.far {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: auto;
}

/* Responsive adjustments for rider/customer avatar */
@media (max-width: 575.98px) {
    .rider-avatar {
        width: 45px;
        height: 45px;
    }
    .rider-avatar i {
        font-size: 1.25rem !important;
    }
    .assigned-rider-card .card-body {
        flex-wrap: wrap;
        gap: 0.75rem;
    }
    .assigned-rider-card .card-title {
        font-size: 1rem;
    }
}

/* Tracking History Table */
.tracking-history-table-container {
    max-height: 400px;
    overflow-y: auto;
}
.tracking-history-table-container .table th {
    font-size: 0.8rem !important;
}
.tracking-history-table-container .table td {
    font-size: 0.85rem !important;
}
.tracking-history-table-container .sticky-top {
    position: sticky;
    top: 0;
    z-index: 2;
    background-color: var(--theme-light-gray);
}

/* --- Print Specific Styles --- */
@media print {
    body {
        font-size: 10pt;
        background-color: var(--theme-white) !important;
        color: #000 !important;
    }
    .page-container {
        margin: 0 !important;
        padding: 0 !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }
    .receipt-container {
        padding: 0.5cm !important;
    }
    .print-hide { display: none !important; }
    .print-show-only { display: block !important; }

    .receipt-header {
        border-bottom: 1px solid #666 !important;
    }
    .receipt-header .page-title-text {
        font-size: 16pt !important;
    }
    .btn { display: none !important; }

    .card {
        border: 1px solid #ccc !important;
        box-shadow: none !important;
        page-break-inside: avoid;
        margin-bottom: 0.5cm !important;
    }
    .card-header {
        background-color: #eee !important;
        border-bottom: 1px solid #ccc !important;
        padding: 0.25cm 0.4cm !important;
    }
    .card-header .card-title-text {
        font-size: 11pt !important;
        color: #000 !important;
    }
    .card-header-search { display: none !important; }

    .status-badge {
        border: 1px solid #999 !important;
        padding: 0.1cm 0.2cm !important;
        font-size: 8pt !important;
    }
    .status-receipt-pending { background-color: #f0f0f0 !important; color: #333 !important; border-color: #ccc !important; }
    .status-receipt-confirmed { background-color: #e6f7ff !important; color: #004085 !important; border-color: #b8daff !important; }
    .status-receipt-delivered { background-color: #d4edda !important; color: #155724 !important; border-color: #c3e6cb !important; }
    .status-receipt-cancelled { background-color: #ffffff !important; color: #721c24 !important; border-color: #721c24 !important; } /* Updated to white background */

    .alert {
        page-break-inside: avoid;
        border: 1px solid #ccc !important;
        padding: 0.3cm !important;
    }
    .alert-info.theme-alert {
        background-color: #e6f7ff !important;
        color: #004085 !important;
        border-color: #b8daff !important;
    }

    .order-progress-card { display: none; }

    .table-responsive { overflow: visible !important; }
    .table { width: 100% !important; }
    .table th, .table td {
        font-size: 9pt !important;
        padding: 0.15cm 0.25cm !important;
        border-color: #ccc !important;
    }
    .table th { background-color: #f0f0f0 !important; color: #000 !important; }
    .order-items-card .order-totals-footer .grand-total-row td {
        background-color: #e9ecef !important;
        color: #000 !important;
        border-top: 1px solid #aaa !important;
    }

    #mapReceipt {
        height: 8cm !important;
        border: 1px solid #ccc !important;
        page-break-inside: avoid;
    }
    .map-container-wrapper {
        border: 1px solid #ccc !important;
    }
    .leaflet-control-attribution { display: none !important; }
    .leaflet-popup-content-wrapper { box-shadow: none !important; border: 1px solid #ccc !important; }

    .tracking-history-table-container { max-height: none !important; overflow-y: visible !important; }
}