/* ==========================================================================
   Umonda Consignment ("Sell with Umonda")
   Adds to the shared vertical UI kit in motors.css. Scoped under .um-consign
   and um-c* class names.
   ========================================================================== */

.um-consign [hidden] { display: none !important; }

/* ---------- Landing ---------- */
.um-chero__actions { display: flex; gap: 12px; flex-wrap: wrap; }
.um-chero__alt { margin: var(--um-space-5) 0 0; color: rgba(255,255,255,.75); font-size: var(--um-text-sm); }
.um-chero__alt a { color: #fff !important; text-decoration: underline; }

.um-cassets { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.um-cassets__item {
    display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: var(--um-space-5);
    background: var(--um-surface); border: 1px solid var(--um-line); border-radius: var(--um-radius-lg);
}
.um-cassets__item > i { font-size: 26px; color: var(--um-primary); }
.um-cassets__item > span:not(.um-mbadge) { color: var(--um-muted); font-size: var(--um-text-sm); flex: 1; }
.um-cassets__item.is-soon { opacity: .75; }
.um-cnotice ul { margin: 0; padding-left: 20px; }
.um-cnotice li + li { margin-top: 6px; }

/* ---------- Process steps ---------- */
.um-csteps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; counter-reset: none; }
.um-csteps__item { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; }
.um-csteps__item:not(:last-child)::after {
    content: ""; position: absolute; top: 21px; left: calc(50% + 26px); right: calc(-50% + 26px);
    height: 2px; background: var(--um-line);
}
.um-csteps__icon {
    display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
    background: var(--um-surface); border: 2px solid var(--um-line); color: var(--um-primary); font-size: 17px;
}
.um-csteps__label { font-weight: 700; font-size: var(--um-text-sm); }
.um-csteps__text { color: var(--um-muted); font-size: var(--um-text-xs); line-height: 1.4; }
.um-csteps--progress .um-csteps__icon { color: var(--um-muted); }
.um-csteps__item.is-done .um-csteps__icon { background: var(--um-success-tint); border-color: var(--um-success); color: var(--um-success); }
.um-csteps__item.is-done:not(:last-child)::after { background: var(--um-success); }
.um-csteps__item.is-current .um-csteps__icon { background: var(--um-primary); border-color: var(--um-primary); color: #fff; }
.um-csteps--progress .um-csteps__item:not(.is-done):not(.is-current) .um-csteps__label { color: var(--um-muted); font-weight: 600; }

/* ---------- Request page ---------- */
.um-cdetail { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--um-space-5); align-items: start; }
.um-cdetail__main, .um-cdetail__side { display: flex; flex-direction: column; gap: var(--um-space-5); min-width: 0; }
.um-cdetail .um-mpanel { margin: 0; }
.um-cterms.is-pending { border-color: var(--um-accent); box-shadow: 0 0 0 3px var(--um-accent-tint); }
.um-cterms__label { font-size: var(--um-text-lg); font-weight: 700; margin: 0 0 6px; }
.um-cterms__form { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-top: var(--um-space-4); }
.um-ctimeline li.is-internal { opacity: .8; }
.um-ctimeline li.is-internal .um-mactivity__action { background: var(--um-surface-sunken); color: var(--um-muted); }

/* ---------- Admin ---------- */
.um-ctabs { flex-wrap: wrap; }
.um-cfilters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 var(--um-space-4); }
.um-cfilters select, .um-cfilters input {
    min-height: 36px; padding: 0 10px; border: 1px solid var(--um-line-strong); border-radius: var(--um-radius-md);
    background: var(--um-surface); font: inherit; font-size: var(--um-text-sm);
}
.um-cfilters input[type=search] { flex: 1 1 200px; }
.um-ctable td { vertical-align: top; }
.um-ctable__notes { max-width: 220px; color: var(--um-ink-soft); font-size: var(--um-text-sm); }
.um-clinked { display: flex; gap: 10px; align-items: flex-start; margin-bottom: var(--um-space-4); }
.um-clinked img { width: 72px; height: 54px; object-fit: cover; border-radius: var(--um-radius-sm); flex: none; }
.um-madmin-review__main > .um-csteps { margin: var(--um-space-4) 0; }
.um-cplan-edit { display: inline-block; }
.um-cplan-edit[open] { display: block; width: 100%; margin-bottom: 10px; }
.um-cplan-edit summary { list-style: none; }
.um-cplan-edit summary::-webkit-details-marker { display: none; }
.um-cplan-edit .um-cplan-form { text-align: left; padding: var(--um-space-4); margin-top: 8px; border: 1px solid var(--um-line); border-radius: var(--um-radius-md); background: var(--um-surface-alt); }

@media (max-width: 991.98px) {
    .um-cdetail { grid-template-columns: 1fr; }
    .um-csteps { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: 18px; }
    .um-csteps__item::after { display: none; }
}
@media (max-width: 575.98px) {
    .um-csteps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .um-csteps__text { display: none; }
}
