/* Customer directory: useful summaries, filters, and responsive record cards */
.content[data-page="customers"]{max-width:none}
.customers-page{display:grid;gap:15px;min-width:0}
.customers-page>.page-head{margin-bottom:0}
.customer-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.customer-kpis article{display:flex;align-items:center;gap:12px;min-width:0;padding:16px;background:#fff;border:1px solid #e7eaf2;border-radius:15px;box-shadow:0 5px 16px rgba(34,45,82,.045)}
.customer-kpi-icon{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:#e9f6f0;color:#187353;font-size:20px}
.customer-kpis article.needs-followup .customer-kpi-icon{background:#fff0ed;color:#cf604b}
.customer-kpis article div{display:grid;gap:4px;min-width:0}
.customer-kpis small{overflow:hidden;color:#6f7890;font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.customer-kpis strong{color:#182034;font-size:22px;line-height:1.05}
.customer-segment-tabs{display:flex;gap:8px;flex-wrap:wrap}
.customer-segment-tabs button{display:flex;align-items:center;gap:8px;padding:9px 13px;border:1px solid #e7eaf2;border-radius:999px;background:#fff;color:#59647a;font-size:12px;cursor:pointer}
.customer-segment-tabs button b{color:#66728a;font-size:12px}
.customer-segment-tabs button.active{border-color:#155d47;background:#155d47;color:#fff}
.customer-segment-tabs button.active b{color:#d9f3e8}
.customer-filters{display:grid;grid-template-columns:minmax(220px,1fr) minmax(150px,210px) minmax(150px,210px);gap:9px;min-width:0}
.customer-search{position:relative;min-width:0}
.customer-search>span{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:#748096;font-size:20px;line-height:1}
.customer-search input,.customer-filters select{width:100%;height:42px;padding:0 12px;border:1px solid #dfe4ef;border-radius:11px;background:#fff;color:#182034;font:inherit;font-size:12px}
.customer-search input{padding-left:39px}
.customers-workspace{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:14px;align-items:start;min-width:0}
.customer-list-wrap,.customer-insight-card{min-width:0;background:#fff;border:1px solid #e7eaf2;border-radius:15px;box-shadow:0 5px 16px rgba(34,45,82,.045)}
.customer-list-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px 16px 11px}
.customer-list-heading strong{color:#182034;font-size:14px}
.customer-list-heading span{color:#748096;font-size:12px}
.customer-list-wrap .table-wrap{border:0;border-radius:0;box-shadow:none}
.customers-table{width:100%;border-collapse:collapse}
.customers-table th{padding:10px 11px;background:#f7f8fb;color:#6f7890;text-align:left;font-size:12px;font-weight:700;white-space:nowrap}
.customers-table td{padding:11px;border-bottom:1px solid #edf0f6;color:#4e586e;font-size:12px;vertical-align:middle}
.customers-table tbody tr{cursor:pointer}
.customers-table tbody tr:hover{background:#f8fbf9}
.customer-table-person{display:flex;align-items:center;gap:9px;min-width:135px}
.customer-row-avatar{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;background:#edf2f4;color:#315b50;font-size:12px;font-weight:700}
.customer-table-person>div,.customer-followup-row>span:nth-child(2){display:grid;gap:3px;min-width:0}
.customer-table-person strong,.customer-followup-row strong{overflow:hidden;color:#202b3c;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.customer-table-person small,.customer-followup-row small{overflow:hidden;color:#788398;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.customer-segment-badge,.customer-state{display:inline-flex;align-items:center;max-width:120px;padding:5px 8px;border-radius:999px;background:#f1f3f6;color:#526078;font-size:12px;font-weight:700;white-space:nowrap}
.customer-segment-badge.sadik{background:#fff3cf;color:#805b00}
.customer-segment-badge.yeni{background:#e5f6ec;color:#28734b}
.customer-segment-badge.toptan{background:#e9f2ff;color:#285fa3}
.customer-segment-badge.riskli{background:#fff0ed;color:#b04f40}
.customer-state.active{background:#e5f6ec;color:#28734b}
.customer-state.followup{background:#fff0ed;color:#b04f40}
.customer-state.neutral{background:#f1f3f6;color:#66728a}
.customer-insights{display:grid;gap:12px;min-width:0}
.customer-insight-card{padding:15px}
.customer-insight-card h3{margin:0 0 14px;color:#202b3c;font-size:13px}
.segment-stat{display:grid;grid-template-columns:65px minmax(30px,1fr) 28px;gap:8px;align-items:center;margin:11px 0;color:#59647a;font-size:12px}
.segment-stat>div{height:7px;border-radius:99px;background:#eef1f4;overflow:hidden}
.segment-stat i{display:block;height:100%;border-radius:inherit;background:#3d9970}
.segment-stat b{color:#354255;text-align:right;font-size:12px}
.insight-title-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.insight-title-row span{color:#748096;font-size:12px}
.customer-followup-row{display:grid;width:100%;grid-template-columns:32px minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px 0;border:0;border-top:1px solid #edf0f6;background:transparent;text-align:left;cursor:pointer}
.customer-followup-row .customer-row-avatar{width:30px;height:30px;font-size:12px}
.customer-followup-row>b{max-width:75px;color:#778196;font-size:12px;font-weight:600;text-align:right}
.customer-list-wrap .empty{margin:12px}
@media(max-width:1160px){
 .customer-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
 .customers-workspace{grid-template-columns:minmax(0,1fr) 240px}
 .customers-table th,.customers-table td{padding:9px 7px}
}
@media(max-width:820px){
 .customers-page{gap:11px}
 .customer-kpis{gap:8px}
 .customer-kpis article{padding:11px 10px;gap:8px;border-radius:12px}
 .customer-kpi-icon{width:32px;height:32px;font-size:16px}
 .customer-kpis small{font-size:12px}
 .customer-kpis strong{font-size:18px}
 .customer-segment-tabs{flex-wrap:nowrap;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
 .customer-segment-tabs::-webkit-scrollbar{display:none}
 .customer-segment-tabs button{flex:none;padding:8px 11px;font-size:12px}
 .customer-filters{grid-template-columns:minmax(0,1fr) 42px;gap:7px}
 .customer-filters select{min-width:0;font-size:12px}
 .customer-filters select:last-child{grid-column:1/-1}
 .customers-workspace{grid-template-columns:minmax(0,1fr)}
 .customer-insights{grid-template-columns:repeat(2,minmax(0,1fr))}
 .customer-insight-card{padding:12px}
 .customers-table-wrap{overflow:visible}
 .customers-table,.customers-table tbody{display:block;width:100%}
 .customers-table thead{display:none}
 .customers-table tbody{padding:0 10px}
 .customers-table tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;padding:11px 2px;border-bottom:1px solid #edf0f6}
 .customers-table td{display:flex;align-items:center;gap:6px;min-width:0;padding:0;border:0;font-size:12px}
 .customers-table td:before{content:attr(data-label) ": ";color:#8992a3;font-size:12px}
 .customers-table td:first-child{grid-column:1/-1}
 .customers-table td:first-child:before{display:none}
 .customers-table td:nth-child(3){grid-column:1}
 .customers-table td:nth-child(4){grid-column:2;justify-self:end}
 .customers-table td:nth-child(5){grid-column:1}
 .customers-table td:nth-child(6){grid-column:2;justify-self:end}
 .customers-table td:nth-child(7){grid-column:1/-1}
}
@media(max-width:500px){
 .customers-page>.page-head{align-items:flex-start}
 .customers-page>.page-head .head-actions{flex:none}
 .customers-page>.page-head .head-actions .quiet{display:none}
 .customers-page>.page-head .head-actions .primary{padding:9px 10px;font-size:12px}
 .customer-insights{grid-template-columns:1fr}
 .customer-kpis article{min-height:64px}
 .customer-list-heading{padding:12px 12px 9px}
}

.segment-fill.w-0{width:0%}
.segment-fill.w-10{width:10%}
.segment-fill.w-20{width:20%}
.segment-fill.w-30{width:30%}
.segment-fill.w-40{width:40%}
.segment-fill.w-50{width:50%}
.segment-fill.w-60{width:60%}
.segment-fill.w-70{width:70%}
.segment-fill.w-80{width:80%}
.segment-fill.w-90{width:90%}
.segment-fill.w-100{width:100%}

/* Width repair after moving the application from a side rail to the full-width header. */
.content[data-page="customers"]{width:100%;max-width:none;min-width:0;overflow-x:clip}
.content[data-page="customers"] .customers-page{width:100%;max-width:none;min-width:0}
.content[data-page="customers"] .customers-workspace{grid-template-columns:minmax(0,1fr) minmax(245px,290px);width:100%;min-width:0}
.content[data-page="customers"] .customer-list-wrap{min-width:0;max-width:100%;overflow:hidden}
.content[data-page="customers"] .customer-list-wrap>.table-wrap{width:100%;max-width:100%;min-width:0;overflow-x:auto}
.content[data-page="customers"] .customers-table{width:100%;min-width:0;table-layout:fixed}
.content[data-page="customers"] .customers-table th,.content[data-page="customers"] .customers-table td{min-width:0;overflow:hidden;text-overflow:ellipsis}
.content[data-page="customers"] .customers-table th:nth-child(1){width:25%}
.content[data-page="customers"] .customers-table th:nth-child(2){width:12%}
.content[data-page="customers"] .customers-table th:nth-child(3){width:17%}
.content[data-page="customers"] .customers-table th:nth-child(4){width:11%}
.content[data-page="customers"] .customers-table th:nth-child(5){width:14%}
.content[data-page="customers"] .customers-table th:nth-child(6){width:8%}
.content[data-page="customers"] .customers-table th:nth-child(7){width:13%}
@media(max-width:1100px){
 .content[data-page="customers"] .customers-workspace{grid-template-columns:minmax(0,1fr)}
 .content[data-page="customers"] .customer-insights{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:820px){
 .content[data-page="customers"] .customer-insights{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
 .content[data-page="customers"] .customer-insights{grid-template-columns:minmax(0,1fr)}
}

