/* ============================================
   DELIVERY PORTAL - GLOBAL STYLES
   Following ASP.NET Core conventions
   ============================================ */

/* ============================================
   BASE STYLES (ASP.NET Default)
   ============================================ */

html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

body {
    margin-bottom: 60px;
}

/* ============================================
   ORDER STATUS BADGES
   ============================================ */

.badge-pending {
    background-color: #FFC700;
    color: #fff;
}

.badge-assigned {
    background-color: #7239EA;
    color: #fff;
}

.badge-pickedup {
    background-color: #009EF7;
    color: #fff;
}

.badge-ontheway {
    background-color: #0095E8;
    color: #fff;
}

.badge-delivered {
    background-color: #50CD89;
    color: #fff;
}

.badge-failed {
    background-color: #F1416C;
    color: #fff;
}

.badge-rejected {
    background-color: #181C32;
    color: #fff;
}

.badge-cancelled {
    background-color: #A1A5B7;
    color: #fff;
}

/* ============================================
   GOOGLE MAP CONTAINER
   ============================================ */

.google-map-container {
    height: 400px;
    border-radius: 0.475rem;
    border: 1px solid #e4e6ef;
}

/* Visual indicator when field was auto-filled from map */
.map-autofilled {
    border-color: #009ef7 !important;
    background-color: #f1faff !important;
    transition: border-color 0.3s, background-color 0.3s;
}

/* Hide Google Places Autocomplete pac-container in RTL fix */
.pac-container {
    z-index: 10000 !important;
    direction: ltr !important;
}

/* ============================================
   BULK UPLOAD DROPZONE
   ============================================ */

.upload-dropzone {
    border: 2px dashed #009EF7;
    border-radius: 0.475rem;
    padding: 3rem;
    text-align: center;
    cursor: pointer;
    transition: background-color 0.3s;
}

.upload-dropzone:hover {
    background-color: #f1faff;
}

/* ============================================
   FORM VALIDATION STYLES (Global)
   ============================================ */

/* Invalid state */
.is-invalid {
    border-color: #f1416c !important;
    background-color: #fff5f8 !important;
}

/* Invalid feedback message */
.invalid-feedback {
    color: #f1416c;
    font-size: 0.925rem;
    margin-top: 0.5rem;
    display: none;
}

.invalid-feedback.d-block {
    display: block !important;
}

/* Valid state */
.is-valid {
    border-color: #50cd89 !important;
    background-color: #e8fff3 !important;
}

/* Form control focus enhancement */
.form-control:focus,
.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-check-input:focus {
    border-color: #009ef7;
    box-shadow: 0 0 0 0.25rem rgba(0, 158, 247, 0.1);
}

/* ============================================
   TEXT-ONLY INPUTS (Global - Used in forms)
   ============================================ */

.text-only-input {
    /* Validation handled in JavaScript */
}

/* ============================================
   DATE & TIME PICKERS (Global)
   ============================================ */

input[type="date"],
input[type="time"] {
    cursor: pointer;
}

/* ============================================
   BUTTON ENHANCEMENTS (Global)
   ============================================ */

.btn-light-primary {
    transition: all 0.2s ease;
}

.btn-light-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* ============================================
   LOADING SPINNER (Global)
   ============================================ */

.spinner-border-sm {
    width: 1rem;
    height: 1rem;
    border-width: 0.2em;
}

/* ============================================
   INTL-TEL-INPUT PHONE (Global)
   Always LTR regardless of page direction
   ============================================ */

.iti {
    width: 100%;
    direction: ltr !important;
}

.iti__country-list {
    z-index: 10 !important;
    direction: ltr !important;
}

.iti__selected-flag {
    direction: ltr !important;
}

.iti .phone-input.is-valid {
    background-position: right calc(0.375em + 0.375rem) center !important;
    padding-right: calc(1.5em + 1.5rem) !important;
}

.iti .phone-input.is-invalid {
    background-position: right calc(0.375em + 0.375rem) center !important;
    padding-right: calc(1.5em + 1.5rem) !important;
}

.phone-error.invalid-feedback {
    display: block !important;
    margin-top: 0.25rem;
    font-size: 0.875em;
    color: #f1416c;
}

/* ============================================
   BUTTON LOADING STATE (Global)
   Toggle with: btn.classList.add('btn-loading')
   ============================================ */

.btn.btn-loading .indicator-label { display: none !important; }
.btn.btn-loading .indicator-progress { display: inline-block !important; }

/* ============================================
   ARABIC / RTL FONT (Global)
   ============================================ */

[dir="rtl"] body {
    font-family: 'Cairo', sans-serif;
    font-size: 15px;
}

[dir="rtl"] .menu-title,
[dir="rtl"] .fs-7 {
    font-size: 0.9rem !important;
}

[dir="rtl"] .fw-bold,
[dir="rtl"] .fw-bolder {
    letter-spacing: 0;
}

/* ============================================
   RESPONSIVE (Global)
   ============================================ */