/* Customer-first number explorer. Scoped to avoid changing other portal routes. */
.ip-explorer { min-width:0; background:var(--panel); }
.ip-explorer [hidden] { display:none!important; }
.ip-explorer h2,.ip-explorer h3,.ip-explorer h4,.ip-explorer p { overflow-wrap:anywhere; }
.ip-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:20px; }
.ip-heading h2 { margin:5px 0 7px; font-size:27px; }
.ip-heading p { margin:0; max-width:720px; line-height:1.65; }
.ip-eyebrow { font-size:11px; text-transform:uppercase; letter-spacing:.1em; font-weight:700; color:var(--muted); }
.ip-inventory-total { display:grid; gap:4px; text-align:right; flex-shrink:0; }
.ip-inventory-total>strong { font-size:34px; color:var(--primary-2); line-height:1; }
.ip-inventory-total>span { font-size:12px; color:var(--muted); }
.ip-overview { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:22px; }
.ip-overview-item { padding:13px 16px; border:1px solid var(--line); border-radius:13px; background:var(--panel-2); display:flex; align-items:center; justify-content:space-between; gap:8px; }
.ip-overview-item>span { font-size:13px; color:var(--muted); }
.ip-overview-item>strong { font-size:24px; }
.ip-overview-item.active>strong { color:var(--success); }
.ip-overview-item.attention>strong { color:var(--warning); }
.ip-filters { display:flex; align-items:flex-start; flex-wrap:wrap; gap:14px; }
.ip-filters>label { font-size:12px; font-weight:600; min-width:150px; }
.ip-filters .ip-search { flex:1; min-width:min(280px,100%); }
.ip-filters input,.ip-filters select { width:100%; min-height:44px; }
.ip-advanced-filters { flex:1 1 100%; border:1px solid var(--line); border-radius:12px; padding:12px 14px; }
.ip-advanced-filters>summary { cursor:pointer; font-size:13px; font-weight:600; }
.ip-advanced-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:14px; }
.ip-advanced-grid label { min-width:0; font-size:12px; }
.ip-list-help { line-height:1.6; margin:12px 0 18px; }
.ip-customer-list { display:grid; gap:14px; }
.ip-customer { min-width:0; border:1px solid var(--line); border-radius:16px; background:var(--panel); }
.ip-customer[open] { border-color:color-mix(in srgb,var(--primary) 45%,var(--line)); }
.ip-customer-summary { list-style:none; display:flex; align-items:center; gap:13px; padding:18px; cursor:pointer; border-radius:15px; background:var(--panel-2); }
.ip-customer-summary::-webkit-details-marker,.ip-number-details>summary::-webkit-details-marker { display:none; }
.ip-customer-summary:hover { background:color-mix(in srgb,var(--primary) 7%,var(--panel-2)); }
.ip-customer-summary:focus-visible,.ip-number-details>summary:focus-visible,.ip-tab:focus-visible,.ip-number-list:focus-visible { outline:3px solid var(--primary); outline-offset:3px; }
.ip-customer[open]>.ip-customer-summary { border-radius:15px 15px 0 0; border-bottom:1px solid var(--line); }
.ip-customer-avatar { width:40px; height:40px; flex:0 0 40px; display:grid; place-items:center; border-radius:12px; background:color-mix(in srgb,var(--primary) 13%,var(--panel)); color:var(--primary-2); font-weight:800; }
.ip-customer-title { display:grid; gap:5px; flex:1; min-width:0; overflow-wrap:anywhere; }
.ip-customer-title>strong { font-size:16px; line-height:1.4; }
.ip-customer-totals { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:12px; font-size:13px; }
.ip-customer-toggle { color:var(--primary-2); font-size:12px; font-weight:700; white-space:nowrap; }
.ip-customer[open]>.ip-customer-summary .ip-customer-toggle>span { display:inline-block; transform:rotate(180deg); }
.ip-customer-body { padding:18px; min-width:0; }
.ip-tabs { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:7px; padding:7px; border:1px solid var(--line); border-radius:14px; background:var(--panel-2); }
.ip-tab { display:flex; align-items:center; justify-content:space-between; gap:8px; min-width:0; padding:11px 10px; min-height:45px; border:1px solid transparent; border-radius:9px; color:var(--muted); background:transparent; cursor:pointer; font-size:12px; font-weight:600; }
.ip-tab>strong { min-width:24px; text-align:center; padding:3px 5px; border-radius:8px; font-size:12px; background:var(--panel); color:var(--text); }
.ip-tab:hover { color:var(--text); background:var(--panel); }
.ip-tab[aria-selected="true"] { color:var(--primary-2); background:var(--panel); border-color:color-mix(in srgb,var(--primary) 50%,var(--line)); box-shadow:0 2px 5px #0001; }
.ip-tab-help { line-height:1.6; margin:12px 0 16px; }
.ip-number-list { display:grid; gap:16px; outline:none; min-width:0; }
.ip-number-card { padding:20px; border:1px solid var(--line); border-radius:15px; background:var(--panel); min-width:0; }
.ip-number-header { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:17px; }
.ip-number-title { min-width:0; }
.ip-number-title h3 { font-size:20px; margin:5px 0; line-height:1.3; }
.ip-number-title p { margin:5px 0 0; }
.ip-number-title .ip-phone { font-size:15px; font-weight:600; color:var(--primary-2); }
.ip-number-header>.badge { flex-shrink:0; max-width:40%; white-space:normal; text-align:center; }
.ip-number-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:0 0 16px; }
.ip-number-facts>div { min-width:0; padding:12px; background:var(--panel-2); border-radius:10px; }
.ip-number-facts dt,.ip-detail-grid dt { font-size:12px; color:var(--muted); margin-bottom:6px; line-height:1.4; }
.ip-number-facts dd,.ip-detail-grid dd { font-size:13px; font-weight:600; margin:0; line-height:1.55; overflow-wrap:anywhere; white-space:normal; }
.ip-note { margin:0 0 14px; padding:12px 14px; border:1px solid color-mix(in srgb,var(--primary) 25%,var(--line)); border-radius:10px; background:color-mix(in srgb,var(--primary) 5%,var(--panel)); font-size:13px; line-height:1.65; overflow-wrap:anywhere; }
.ip-note-danger { border-color:color-mix(in srgb,var(--danger) 40%,var(--line)); background:color-mix(in srgb,var(--danger) 5%,var(--panel)); }
.ip-note p { margin:5px 0 0; }
.ip-number-details { border:1px solid var(--line); border-radius:11px; margin-bottom:14px; }
.ip-number-details>summary { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:13px; cursor:pointer; font-size:13px; font-weight:600; list-style:none; }
.ip-number-details[open]>summary { border-bottom:1px solid var(--line); background:var(--panel-2); border-radius:10px 10px 0 0; }
.ip-number-details[open]>summary>span { transform:rotate(180deg); }
.ip-detail-content { padding:16px; display:grid; gap:24px; }
.ip-detail-content h4 { margin:0 0 8px; font-size:14px; }
.ip-detail-content p { line-height:1.65; }
.ip-detail-content>section { min-width:0; }
.ip-detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 22px; margin:0; }
.ip-detail-grid>div { min-width:0; padding:11px 0; border-bottom:1px solid var(--line); }
.ip-detail-grid dd { font-weight:400; }
.ip-detail-content .instance-health { min-width:0; max-width:none; width:100%; }
.ip-detail-content .instance-health dl { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.ip-detail-content .instance-health dl>div { min-width:0; display:block; padding:12px; background:var(--panel-2); border-radius:9px; }
.ip-detail-content .instance-health dt { color:var(--muted); font-size:12px; }
.ip-detail-content .instance-health dd { margin:5px 0 0; overflow-wrap:anywhere; text-align:left; line-height:1.5; }
.ip-detail-content .instance-health a,.ip-detail-content .instance-health small { display:block; margin:10px 0; overflow-wrap:anywhere; }
.ip-detail-content .instance-health p { white-space:normal; overflow-wrap:anywhere; }
.ip-number-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.ip-number-actions .btn { font-size:12px; min-height:40px; padding:10px 12px; white-space:normal; text-align:center; }
.ip-customer-warning { line-height:1.6; margin-bottom:0; }
.ip-number-pagination { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:12px; padding-top:18px; font-size:12px; color:var(--muted); }
.ip-number-pagination>label { display:flex; align-items:center; gap:7px; }
.ip-number-pagination select { min-width:65px; min-height:38px; padding:6px; }
.ip-number-pagination>div { display:flex; gap:7px; }
.ip-number-pagination .btn { padding:9px 11px; font-size:12px; }
.ip-empty { margin:0; padding:24px; border:1px dashed var(--line); border-radius:12px; line-height:1.6; color:var(--muted); text-align:center; }
.ip-customer-pagination { flex-wrap:wrap; }

/* Keep privileged actions in their existing dialog, but use a single scroll
   container so the appended health section can never be clipped by flex sizing. */
#instanceDetailModal { width:min(1180px,calc(100vw - 24px)); max-width:calc(100vw - 24px); padding:0; }
#instanceDetailModal .instance-detail-card { display:block; width:100%; max-height:calc(100dvh - 32px); overflow-y:auto; overflow-x:hidden; }
#instanceDetailModal .instance-detail-body { overflow:visible; padding:18px; }
#instanceDetailModal .instance-detail-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
#instanceDetailModal .kv { display:grid; grid-template-columns:minmax(0,1fr); gap:6px; padding:11px 0; }
#instanceDetailModal .kv>div { min-width:0; max-width:100%; white-space:normal; word-break:normal; overflow-wrap:anywhere; }
#instanceDetailModal .instance-detail-actions { overflow:visible; max-height:none; padding:16px 18px; }
#instanceDetailModal .instance-detail-actions .btn { white-space:normal; }
#instanceDetailModal #detailInstanceHealth { padding:18px; }
#instanceDetailModal .instance-health { min-width:0; overflow-wrap:anywhere; }
#instanceDetailModal .instance-health dd { margin-left:0; }
#instanceDetailModal .instance-health small,#instanceDetailModal .instance-health>a { display:block; margin-top:12px; }
@media(max-width:1000px) {
  .ip-tabs { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .ip-number-facts,.ip-detail-content .instance-health dl { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ip-advanced-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:640px) {
  .ip-explorer { padding:13px; }
  .ip-heading { align-items:flex-start; gap:12px; }
  .ip-heading h2 { font-size:24px; }
  .ip-heading p { font-size:13px; }
  .ip-inventory-total { display:none; }
  .ip-overview { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .ip-overview-item { padding:11px; }
  .ip-overview-item>span { font-size:12px; }
  .ip-customer-summary { padding:13px; flex-wrap:wrap; gap:10px; }
  .ip-customer-totals { width:100%; justify-content:flex-start; padding-left:50px; }
  .ip-customer-toggle { margin-left:auto; }
  .ip-customer-body { padding:10px; }
  .ip-tabs { display:flex; overflow-x:auto; padding:6px; scroll-snap-type:x proximity; }
  .ip-tab { flex:0 0 auto; min-width:126px; scroll-snap-align:start; }
  .ip-number-card { padding:13px; }
  .ip-number-title h3 { font-size:18px; }
  .ip-number-header { gap:8px; }
  .ip-number-facts { gap:8px; }
  .ip-number-facts>div { padding:10px; }
  .ip-detail-content { padding:12px; }
  .ip-detail-grid { grid-template-columns:1fr; }
  .ip-number-actions .btn { flex:1 1 130px; }
  .ip-number-pagination { justify-content:center; }
  #instanceDetailModal .instance-detail-grid { grid-template-columns:1fr; }
  #instanceDetailModal .instance-detail-body { padding:12px; }
}
@media(prefers-reduced-motion:reduce) { .ip-explorer * { scroll-behavior:auto; transition:none; } }
