/* Raporlar → Arama performansı (phone.js) */
.no-perm-phoneUsage [data-perm="phoneUsage"] { display: none !important; }

.ph-filter { flex-wrap: wrap; margin: -6px 0 16px; }
.ph-filter .small-text { margin-left: 6px; }

.ph-mine { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 18px; padding: 16px 20px;
  border: 1px solid #e3e0fb; border-radius: 13px; background: linear-gradient(120deg, #f6f4ff, #fff 70%); }
.ph-mine-main { display: flex; align-items: center; gap: 16px; min-width: 260px; flex: 1; }
.ph-mine-main b { display: block; color: #303449; font: 700 14px Manrope, sans-serif; }
.ph-mine-main small { display: block; margin-top: 4px; color: #74788c; font-size: 12px; line-height: 1.45; }
.ph-mine-rank { display: grid; place-items: center; min-width: 74px; height: 74px; padding: 0 10px; border-radius: 16px; color: #fff;
  background: var(--purple); font: 800 30px Manrope, sans-serif; }
.ph-mine-rank small { display: inline; margin: 0; color: #e4e0ff; font-size: 13px; font-weight: 600; }
.ph-mine-stats { display: flex; gap: 22px; flex-wrap: wrap; }
.ph-mine-stats span { display: flex; flex-direction: column; gap: 3px; min-width: 96px; }
.ph-mine-stats small { color: #85899d; font-size: 11px; }
.ph-mine-stats b { color: #20243a; font: 700 17px Manrope, sans-serif; }
.ph-mine-stats em { color: #85899d; font-size: 11px; font-style: normal; }
.ph-mine-stats em.up { color: #24966a; }
.ph-mine-stats em.down { color: #c2414f; }

.ph-metric-label { display: flex; align-items: center; gap: 7px; color: #74788c; font-size: 12px; font-weight: 600; white-space: nowrap; }
.ph-table th[data-metric].sorted { color: var(--purple); }
.ph-table td.ph-active { color: #20243a; font-weight: 700; }
.ph-table td.num small { display: block; color: #a2a4b1; font-size: 10px; font-weight: 500; }
.ph-rank { width: 44px; font: 700 14px Manrope, sans-serif; color: #74788c; }
.ph-person { display: flex; align-items: center; gap: 10px; }
.ph-avatar { flex: none; width: 30px; height: 30px; font-size: 12px; }
.ph-table tr.ph-me td { background: #f6f4ff; }
.ph-table tr.ph-clickable { cursor: pointer; }
.ph-table tr.ph-clickable:hover td { background: #fafaff; }
.ph-table tr.ph-me.ph-clickable:hover td { background: #efecff; }
.ua-tag.ph-you { color: #fff; background: var(--purple); }

.ph-chart-panel { margin-top: 18px; }
.ph-chart { display: flex; gap: 8px; height: 220px; padding-bottom: 22px; }
.ph-chart-axis { display: flex; flex-direction: column; justify-content: space-between; color: #a2a4b1; font-size: 10px; text-align: right; }
.ph-chart-bars { position: relative; display: flex; align-items: end; gap: 2px; flex: 1; height: 100%; border-bottom: 1px solid #eceef3;
  background: linear-gradient(#f1f2f6 1px, transparent 1px) 0 0 / 100% 50%; overflow-x: auto; }
.ph-col { position: relative; display: flex; align-items: end; justify-content: center; flex: 1; min-width: 8px; height: 100%; }
.ph-col.weekend { background: #fafafc; }
.ph-col i { width: min(70%, 22px); min-height: 0; border-radius: 4px 4px 0 0; background: var(--purple); }
.ph-col:hover i { background: var(--purple-dark); }
.ph-day { position: absolute; bottom: -19px; color: #a2a4b1; font-size: 10px; white-space: nowrap; }

.dialog.ph-dialog { width: min(560px, 100%); max-height: calc(100vh - 40px); overflow: auto; }
.dialog.ph-dialog.wide { width: min(1000px, 100%); }
.ph-preview { margin-top: 16px; padding: 14px; border: 1px solid #eceef4; border-radius: 10px; background: #fafbfd; }
.ph-preview-head { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 10px; color: #303449; font-weight: 700; font-size: 13px; }
.ph-preview-head span { color: #85899d; font-weight: 500; }
.ph-preview-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.ph-preview-grid div { padding: 9px 10px; border-radius: 8px; background: #fff; border: 1px solid #eef0f5; }
.ph-preview-grid small { display: block; color: #85899d; font-size: 11px; }
.ph-preview-grid b { color: #20243a; font: 700 16px Manrope, sans-serif; }
.ph-preview-grid em { color: #85899d; font-size: 11px; font-style: normal; font-weight: 500; }
.ph-preview-grid .good b { color: #24966a; }
.ph-preview-grid .warn b { color: #b7791f; }
.ph-error { color: #c2414f; font-size: 13px; }
.ph-lines select, .ph-lines input { width: 100%; min-width: 150px; height: 32px; padding: 0 8px; border: 1px solid #e7e8ef; border-radius: 7px; font-size: 12px; }
.ph-calls-wrap { max-height: 60vh; overflow: auto; }
.ph-desc { max-width: 360px; color: #85899d; font-size: 11px; }
tr.ph-muted td { color: #a2a4b1; }
.ph-danger { color: #c2414f; }

@media (max-width: 760px) {
  .ph-preview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ph-mine-rank { min-width: 60px; height: 60px; font-size: 24px; }
}

/* Ayarlar → Gizli telefon hatları: gizlenen hatlar kartı */
.ph-hidden-panel .panel-heading.padded { align-items: center; margin-bottom: 0; padding: 22px 24px 18px; border-bottom: 1px solid var(--line); }
.ph-hidden-panel .panel-heading h2 { margin-bottom: 6px; }
.ph-hidden-panel .panel-heading .muted { max-width: 620px; margin: 0; line-height: 1.55; }
.ph-hidden-panel .result-count { align-self: flex-start; padding: 4px 10px; border-radius: 999px; color: var(--purple); background: #f0efff; font-weight: 700; }
.ph-hidden-panel th, .ph-hidden-panel td { padding-top: 14px; padding-bottom: 14px; vertical-align: middle; }
.ph-hidden-panel th:first-child, .ph-hidden-panel td:first-child { padding-left: 24px; }
.ph-hidden-panel th:last-child, .ph-hidden-panel td:last-child { padding-right: 24px; }
.ph-added-by span { display: block; color: #4d5165; }
.ph-added-by small { display: block; margin-top: 3px; color: #9a9dad; font-size: 11px; }
.ph-row-action { text-align: right; }
.ph-row-action .button { padding: 6px 11px; font-size: 12px; }
.ph-hidden-panel .empty-state { padding: 28px 24px; }