@include('garage.claims.partials.claims-ui')
<style>
.gs-clm-show .gs-clm-show-hd {
    padding: 1rem 1.1rem;
    background: linear-gradient(135deg, #f8fafc 0%, #fff 50%, #f0fdf4 100%);
}
.gs-clm-show .gs-clm-show-title {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: clamp(1.1rem, 3vw, 1.35rem);
    font-weight: 700;
    margin: 0 0 0.25rem;
    color: var(--gs-clm-heading);
}
.gs-clm-show .gs-clm-show-meta {
    font-size: 0.8rem;
    color: var(--gs-clm-muted);
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.75rem;
    align-items: center;
}
.gs-clm-show .gs-clm-show-meta .meta-sep { color: #cbd5e1; }
.gs-clm-show .gs-clm-show-hd-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.85rem 1rem;
}
.gs-clm-show .gs-clm-show-hd-left {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.75rem;
    min-width: 0;
    flex: 1 1 auto;
}
.gs-clm-show .gs-clm-show-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
}
.gs-clm-show .gs-clm-show-hd-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    flex-shrink: 0;
}
.gs-clm-show .gs-clm-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
}
@media (min-width: 768px) {
    .gs-clm-show .gs-clm-info-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.gs-clm-show .gs-clm-info-cell {
    padding: 0.75rem 0.95rem;
    border-bottom: 1px solid #f1f5f9;
    border-right: 1px solid #f1f5f9;
    min-width: 0;
}
.gs-clm-show .gs-clm-info-cell:nth-child(2n) { border-right: 0; }
@media (min-width: 768px) {
    .gs-clm-show .gs-clm-info-cell { border-right: 1px solid #f1f5f9; }
    .gs-clm-show .gs-clm-info-cell:nth-child(2n) { border-right: 1px solid #f1f5f9; }
    .gs-clm-show .gs-clm-info-cell:nth-child(4n) { border-right: 0; }
    .gs-clm-show .gs-clm-info-cell.span-full {
        grid-column: 1 / -1;
        border-right: 0;
    }
}
.gs-clm-show .gs-clm-info-lbl {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #94a3b8;
    margin-bottom: 0.2rem;
}
.gs-clm-show .gs-clm-info-val {
    font-size: 0.875rem;
    color: var(--gs-clm-heading);
    word-break: break-word;
}
.gs-clm-show .gs-clm-workflow-bar {
    padding: 0.85rem 0.95rem;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}
.gs-clm-show .gs-clm-workflow-primary {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}
.gs-clm-show .gs-clm-workflow-primary form,
.gs-clm-show .gs-clm-workflow-primary .btn { width: 100%; }
.gs-clm-show .gs-clm-reject-form {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.45rem;
    width: 100%;
}
.gs-clm-show .gs-clm-reject-form .form-control { flex: 1 1 auto; min-width: 0; }
.gs-clm-show .gs-clm-lines-table .col-qty { width: 4rem; }
.gs-clm-show .gs-clm-lines-table .col-serial { min-width: 5rem; }
.gs-clm-show .col-actions {
    width: 3.25rem;
    white-space: nowrap;
}
@media (max-width: 991.98px) {
    .gs-clm-show .gs-clm-sidebar { order: -1; }
}
@media (max-width: 767.98px) {
    .gs-clm-show .gs-clm-lines-table .col-movements { display: none; }
}
@media (max-width: 575.98px) {
    .gs-clm-show .gs-clm-show-hd-row { flex-direction: column; }
    .gs-clm-show .gs-clm-show-hd-actions { width: 100%; }
    .gs-clm-show .gs-clm-show-hd-actions .btn { flex: 1 1 auto; }
    .gs-clm-show .gs-clm-reject-form { flex-wrap: wrap; }
    .gs-clm-show .gs-clm-reject-form .btn { width: 100%; }
}
</style>