/* Staff/admin section additions on top of mobile.css. Only loaded by
   /mobile/ (non-student, non-instructor) pages. Shared cross-section
   components live in mobile.css since /mobile/student/ and
   /mobile/instructor/ need them too. */

/* Pending booking request card */
.m-pending-card {
    background: var(--m-card-bg);
    border-radius: 12px;
    padding: 14px;
    margin-bottom: 12px;
    box-shadow: 0 2px 10px rgba(110, 27, 27, 0.06);
    border-left: 4px solid var(--m-accent);
}

.m-pending-h {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 6px;
}

.m-pending-student {
    font-size: 14px;
    font-weight: 700;
    color: var(--m-text);
}

.m-pending-when {
    font-size: 12px;
    color: var(--m-muted);
    white-space: nowrap;
}

.m-pending-meta {
    font-size: 12.5px;
    color: var(--m-muted);
    margin-bottom: 2px;
}

.m-pending-balance {
    font-size: 12.5px;
    margin-top: 6px;
}

.m-pending-balance.low {
    color: var(--m-danger);
    font-weight: 600;
}

.m-override-row {
    margin-bottom: 16px;
}

/* Selected-student "chip" on the New Booking form, shown once a search
   result has been picked, in place of the search box. */
.m-selected-chip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    background: #f7f2e6;
    border: 1px solid var(--m-border);
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 14px;
    font-weight: 600;
    color: var(--m-text);
}

.m-chip-change {
    font-size: 12px;
    font-weight: 600;
    color: var(--m-primary);
    text-decoration: none;
    white-space: nowrap;
}

.m-chip-change:hover {
    text-decoration: underline;
}