/* CONNECTOR_COMPLAINT_COSTS_DESKTOP_V1 */

.complaint-costs-header{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    margin-bottom:18px;
}

.complaint-costs-header h1{
    margin:0 0 8px;
}

.complaint-costs-header-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

.complaint-costs-header-actions button,
.complaint-costs-add-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:44px;
    margin:0;
    padding:11px 15px;
    border:0;
    border-radius:12px;
    background:#2563eb;
    color:#fff;
    font-weight:900;
    cursor:pointer;
}

.complaint-costs-header-actions .secondary{
    background:#e2e8f0;
    color:#334155;
}

.complaint-costs-summary{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:14px;
    margin-bottom:18px;
}

.complaint-costs-summary article{
    min-width:0;
    padding:17px;
    border:1px solid #e2e8f0;
    border-radius:18px;
    background:#fff;
    box-shadow:0 8px 22px rgba(15,23,42,.06);
}

.complaint-costs-summary article:nth-child(1){
    border-top:4px solid #dc2626;
}

.complaint-costs-summary article:nth-child(2){
    border-top:4px solid #2563eb;
}

.complaint-costs-summary article:nth-child(3){
    border-top:4px solid #16a34a;
}

.complaint-costs-summary article:nth-child(4){
    border-top:4px solid #f59e0b;
}

.complaint-costs-summary span{
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:900;
    letter-spacing:.04em;
    text-transform:uppercase;
}

.complaint-costs-summary strong{
    display:block;
    margin-top:8px;
    color:#0f172a;
    font-size:24px;
    line-height:1.15;
}

.complaint-costs-panel{
    padding:17px;
    border:1px solid #e2e8f0;
    border-radius:20px;
    background:#fff;
    box-shadow:0 10px 26px rgba(15,23,42,.06);
}

.complaint-costs-filters{
    display:grid;
    grid-template-columns:
        minmax(220px, 1.5fr)
        repeat(4, minmax(145px, 1fr))
        46px;
    gap:9px;
    margin-bottom:14px;
}

.complaint-costs-filters input,
.complaint-costs-filters select{
    width:100%;
    min-width:0;
    min-height:44px;
    padding:10px 12px;
    box-sizing:border-box;
    border:1px solid #cbd5e1;
    border-radius:12px;
    background:#f8fafc;
}

.complaint-costs-filters button{
    width:46px;
    min-width:46px;
    height:44px;
    margin:0;
    padding:0;
    border:0;
    border-radius:12px;
    background:#0f172a;
    color:#fff;
}

.complaint-costs-table-wrap{
    overflow:auto;
    border:1px solid #e5e7eb;
    border-radius:15px;
}

.complaint-costs-table{
    min-width:1450px;
    margin:0;
    border-radius:0;
    box-shadow:none;
}

.complaint-costs-table td small,
.complaint-costs-table td strong{
    display:block;
}

.complaint-costs-table td small{
    margin-top:4px;
    color:#64748b;
}

.complaint-costs-table .money{
    white-space:nowrap;
    font-weight:900;
}

.complaint-costs-table .recovered{
    color:#1d4ed8;
}

.complaint-costs-table .net{
    color:#166534;
}

.complaint-cost-category,
.complaint-cost-status{
    display:inline-flex;
    align-items:center;
    width:max-content;
    max-width:100%;
    padding:6px 9px;
    border-radius:999px;
    font-size:11px;
    font-weight:900;
    line-height:1.25;
}

.complaint-cost-category{
    background:#fee2e2;
    color:#991b1b;
}

.complaint-cost-status.new{
    background:#dbeafe;
    color:#1d4ed8;
}

.complaint-cost-status.progress{
    background:#fef3c7;
    color:#92400e;
}

.complaint-cost-status.done{
    background:#dcfce7;
    color:#166534;
}

.complaint-cost-status.rejected{
    background:#e2e8f0;
    color:#475569;
}

.complaint-cost-status.billing{
    background:#ede9fe;
    color:#6d28d9;
}

.complaint-cost-actions{
    display:flex;
    align-items:center;
    gap:7px;
}

.complaint-cost-actions button{
    display:grid;
    place-items:center;
    width:38px;
    min-width:38px;
    height:38px;
    margin:0;
    padding:0;
    border:0;
    border-radius:10px;
    color:#fff;
}

.complaint-cost-actions .complaint-cost-edit{
    background:#2563eb;
}

.complaint-cost-actions .complaint-cost-delete{
    background:#dc2626;
}

.complaint-cost-mobile-list{
    display:none;
}

.complaint-cost-modal-box{
    width:min(920px, 94vw);
    max-height:92vh;
    padding:0;
    gap:0;
    overflow:hidden;
}

.complaint-cost-modal-box .app-modal-header{
    padding:18px 20px;
    background:linear-gradient(
        135deg,
        #0f172a,
        #1e3a8a
    );
    color:#fff;
}

.complaint-cost-modal-box .app-modal-header h2{
    margin:0;
    color:#fff;
}

.complaint-cost-modal-scroll{
    display:flex;
    flex-direction:column;
    gap:15px;
    min-height:0;
    padding:19px;
    overflow-y:auto;
    background:#f8fafc;
}

.complaint-cost-context{
    display:grid;
    gap:3px;
    padding:12px 14px;
    border:1px solid #bfdbfe;
    border-radius:13px;
    background:#eff6ff;
    color:#1e3a8a;
}

.complaint-cost-context span,
.complaint-cost-context small{
    color:#475569;
}

.complaint-cost-form-grid{
    display:grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap:13px;
}

.complaint-cost-form-grid label{
    display:grid;
    gap:6px;
    min-width:0;
    margin:0;
    color:#475569;
    font-size:12px;
    font-weight:900;
}

.complaint-cost-form-grid label.full{
    grid-column:1/-1;
}

.complaint-cost-form-grid input,
.complaint-cost-form-grid select,
.complaint-cost-form-grid textarea{
    width:100%;
    min-width:0;
    box-sizing:border-box;
    padding:12px 13px;
    border:1px solid #cbd5e1;
    border-radius:12px;
    background:#fff;
}

.complaint-cost-form-grid textarea{
    min-height:96px;
    resize:vertical;
}

.complaint-cost-net-preview{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:14px;
    border:1px solid #bbf7d0;
    border-radius:14px;
    background:#f0fdf4;
}

.complaint-cost-net-preview strong{
    font-size:22px;
    color:#166534;
}

.complaint-cost-modal-actions{
    display:flex;
    justify-content:flex-end;
    gap:10px;
    padding:15px 19px;
    border-top:1px solid #e2e8f0;
    background:#fff;
}

.complaint-cost-modal-actions button{
    min-height:44px;
    margin:0;
    padding:10px 15px;
    border:0;
    border-radius:11px;
    font-weight:900;
}

.complaint-cost-modal-actions .secondary{
    background:#e2e8f0;
    color:#334155;
}

.complaint-cost-modal-actions .primary{
    background:#2563eb;
    color:#fff;
}

.complaint-cost-editor-section,
.complaint-cost-details-section{
    margin-top:14px;
    padding:15px;
    border:1px solid #e2e8f0;
    border-radius:16px;
    background:#f8fafc;
}

.complaint-cost-editor-heading,
.complaint-cost-details-heading{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:11px;
}

.complaint-cost-editor-heading h3,
.complaint-cost-details-heading h3{
    margin:0;
}

.complaint-cost-compact-summary{
    display:grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    gap:8px;
    margin-bottom:9px;
}

.complaint-cost-compact-summary span{
    display:grid;
    gap:3px;
    padding:9px;
    border-radius:11px;
    background:#fff;
    color:#64748b;
    font-size:11px;
}

.complaint-cost-compact-summary strong{
    color:#0f172a;
    font-size:14px;
}

.complaint-cost-compact-row{
    display:grid;
    grid-template-columns:
        minmax(0,1fr)
        auto;
    gap:12px;
    align-items:center;
    padding:10px 12px;
    border-top:1px solid #e2e8f0;
    background:#fff;
}

.complaint-cost-compact-row:first-of-type{
    border-top:0;
}

.complaint-cost-compact-row strong,
.complaint-cost-compact-row small{
    display:block;
}

.complaint-cost-compact-row small{
    margin-top:3px;
    color:#64748b;
}

.complaint-cost-compact-value{
    display:flex;
    align-items:center;
    gap:8px;
    white-space:nowrap;
}

.complaint-cost-compact-value button{
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    margin:0;
    padding:0;
    border:0;
    border-radius:9px;
    background:#dbeafe;
    color:#1d4ed8;
}

.complaint-cost-compact-empty{
    padding:15px;
    color:#64748b;
    text-align:center;
}

.complaint-cost-compact-empty.error{
    color:#b91c1c;
}

@media(max-width:1200px){
    .complaint-costs-summary{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .complaint-costs-filters{
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }

    .complaint-costs-filters button{
        width:100%;
    }
}