/* Dialer redesign — page styles on top of tokens + components + contacts. */
.dh-overlay{position:fixed;inset:0;z-index:1000;background:rgba(11,20,33,.45);display:flex;align-items:center;justify-content:center;padding:32px}
.dh-overlay .dh-dialog{position:relative;z-index:1}
.pick-row{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:8px 12px;border:1px solid var(--dh-gray-200);border-radius:12px;background:#fff;text-align:left;font:inherit;color:var(--dh-navy-950);cursor:default}
.pick-row:hover,.pick-row.is-hover{background:var(--dh-teal-10);border-color:var(--dh-green-25, #C5D0CE)}
.pick-row b{display:block;font:600 15px var(--dh-font-heading)}
.pick-row span{display:block;font-size:13px;color:var(--dh-gray-500)}

/* Segments rail */
.dgrid{display:grid;grid-template-columns:260px minmax(0,1fr);gap:16px;align-items:start}
.seg{padding:12px 12px 16px}
.seg h2{font:700 15px var(--dh-font-heading);margin:0 0 8px}
.seg .g{margin:16px 0 8px;font:600 13px var(--dh-font-heading);letter-spacing:.06em;text-transform:uppercase;color:var(--dh-gray-500)}
.seg a,.seg button.seg-item{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;padding:6px 10px;border:0;border-radius:10px;background:none;color:var(--dh-navy-950);text-decoration:none;font:600 14px var(--dh-font-heading);text-align:left;cursor:default}
.seg a:hover,.seg button.seg-item:hover{background:var(--dh-gray-50)}
.seg a.is-on,.seg button.seg-item.is-on{background:var(--dh-teal-10);color:var(--dh-green-900)}
.seg .n{margin-left:auto;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--dh-gray-100);color:var(--dh-gray-500);font:700 13px var(--dh-font-heading);display:inline-flex;align-items:center;justify-content:center}
.seg a.is-on .n,.seg button.seg-item.is-on .n{background:#fff;color:var(--dh-green-900)}
.seg .from{display:block;font:400 13px var(--dh-font-body);color:var(--dh-gray-500);margin-top:2px}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.tags .dh-chip{min-height:44px}
.tags .dh-chip.is-on{background:var(--dh-teal-10);border-color:var(--dh-green-900);color:var(--dh-green-900)}

/* Create call list */
.create{max-width:760px}
.create .lede{margin:0 0 20px;font-size:15px;color:var(--dh-gray-500)}
.create .lede b{color:var(--dh-navy-950)}
.purpose label{display:block;font:600 15px var(--dh-font-heading);margin-bottom:8px}
.purpose textarea{width:100%;min-height:96px;resize:vertical;padding:12px 14px;border:1px solid var(--dh-gray-200);border-radius:12px;font:15px/22px var(--dh-font-body);color:var(--dh-navy-950)}
.purpose textarea:focus{outline:2px solid var(--dh-teal-500);outline-offset:2px;border-color:var(--dh-green-900)}
.purpose textarea.need-hl{border:2px solid var(--dh-amber-500);background:var(--dh-warning-bg)}
.summary{margin:16px 0;padding:16px;border:1px solid var(--dh-gray-200);border-radius:16px;background:#fff}
.summary .row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;min-height:44px;padding:8px 0;border-top:1px solid var(--dh-gray-100)}
.summary .row:first-child{border-top:0;padding-top:0}
.summary .k{display:block;font:600 13px var(--dh-font-heading);color:var(--dh-gray-500)}
.summary .v{display:block;font-size:15px;color:var(--dh-navy-950);margin-top:2px}
.summary .row.need-hl{border:2px solid var(--dh-amber-500);background:var(--dh-warning-bg);border-radius:12px;padding:10px 12px;margin:8px -4px}

/* Needed to start — same pattern as Needed to publish */
.need{background:var(--dh-warning-bg);border:1px solid var(--dh-warning-border);border-radius:16px;padding:12px 14px 6px;margin:0 0 20px;box-shadow:0 2px 8px rgba(23,66,59,.08)}
.need-hd{display:flex;align-items:center;gap:8px;margin:0 0 4px}
.need-hd h2{font:700 17px var(--dh-font-heading);color:var(--dh-warning-fg);flex:1}
.need-hd .cnt{font:600 13px var(--dh-font-heading);color:var(--dh-warning-fg);background:#fff;border:1px solid var(--dh-warning-border);border-radius:10px;padding:2px 8px}
.need-sub{font-size:14px;color:var(--dh-gray-500);margin:0 0 4px;line-height:1.35}
.need-row{width:100%;min-height:52px;display:flex;align-items:center;gap:10px;text-align:left;background:transparent;border:0;border-top:1px solid rgba(255,185,58,.55);padding:8px 0;font:inherit;color:var(--dh-navy-950);cursor:default}
.need-row:first-of-type{border-top:0}
.need-row .ring{width:22px;height:22px;border-radius:50%;border:2px solid var(--dh-warning-fg);flex:none;background:#fff}
.need-row .tx{flex:1;min-width:0}
.need-row .tx b{display:block;font:600 15px var(--dh-font-heading);line-height:1.25}
.need-row .tx span{display:block;font-size:13px;color:var(--dh-gray-500);line-height:1.35;margin-top:2px}
.need-row i[data-lucide]{color:var(--dh-warning-fg);width:18px;height:18px;flex:none}
.pub-blocked{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--dh-warning-border);background:#fff;color:var(--dh-navy-950);font:600 14px var(--dh-font-heading)}
.pub-blocked .dot{width:10px;height:10px;border-radius:50%;background:var(--dh-amber-500);flex:none}

/* Statuses */
.st{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:2px 10px;border-radius:999px;font:600 13px var(--dh-font-heading);white-space:nowrap}
.st--idle{background:var(--dh-gray-100);color:var(--dh-gray-700);border:1px solid var(--dh-gray-200)}
.st--call{background:var(--dh-teal-10);color:var(--dh-green-900);border:1px solid var(--dh-teal-500)}
.st--done{background:var(--dh-success-bg, var(--dh-teal-10));color:var(--dh-green-900);border:1px solid var(--dh-teal-500)}
.st--pause{background:var(--dh-gray-100);color:var(--dh-navy-950);border:1px solid var(--dh-gray-200)}
.st .pulse{width:8px;height:8px;border-radius:50%;background:var(--dh-teal-500);box-shadow:0 0 0 0 rgba(33,189,152,.6);animation:pulse 1.4s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(33,189,152,.5)}70%{box-shadow:0 0 0 8px rgba(33,189,152,0)}100%{box-shadow:0 0 0 0 rgba(33,189,152,0)}}

/* Live */
.now{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:16px;border-radius:16px;border:1px solid var(--dh-teal-500);background:var(--dh-teal-10);margin-bottom:16px}
.now .txt{flex:1;min-width:200px}
.now .txt b{display:block;font:700 20px/26px var(--dh-font-heading);color:var(--dh-navy-950)}
.now .txt span{display:block;margin-top:2px;font-size:14px;color:var(--dh-gray-700)}
.prog{margin:0 0 16px}
.prog .lab{display:flex;justify-content:space-between;gap:8px;font:600 14px var(--dh-font-heading);margin-bottom:8px}
.bar{height:8px;border-radius:999px;background:var(--dh-gray-100);overflow:hidden}
.bar>i{display:block;height:100%;width:43%;background:var(--dh-green-900);border-radius:999px}
.stream{padding:0;overflow:hidden}
.srow{display:grid;grid-template-columns:32px minmax(0,1.2fr) minmax(0,1.4fr) auto;align-items:center;gap:12px;min-height:56px;padding:8px 16px;border-bottom:1px solid var(--dh-gray-100)}
.srow:last-child{border-bottom:0}
.srow.live{background:var(--dh-teal-10)}
.srow b{font:600 15px var(--dh-font-heading)}
.srow .sub{font-size:13px;color:var(--dh-gray-500)}
.srow .out{font:600 14px var(--dh-font-heading);text-align:right}

/* Results tiles + follow-up (from call-results) */
.dh-stats{margin-bottom:16px}
.sent{margin:0 0 16px;font-size:15px;color:var(--dh-gray-700)}
.fu{border:1px solid var(--dh-warning-border);border-left:4px solid var(--dh-amber-500);background:#fff;border-radius:16px;margin-bottom:16px;overflow:hidden}
.fu__hd{display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--dh-warning-bg);color:var(--dh-warning-fg)}
.fu__hd h2{font-size:16px;line-height:22px;color:var(--dh-navy-950)}
.fu__n{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--dh-amber-500);color:var(--dh-navy-950);font:700 13px var(--dh-font-heading)}
.fu__row{display:grid;grid-template-columns:32px minmax(0,2.2fr) minmax(0,1.1fr) auto;align-items:center;gap:12px;padding:8px 8px 8px 16px;border-top:1px solid var(--dh-gray-100);min-height:60px}
.fu__ic{width:32px;height:32px;border-radius:50%;background:var(--dh-amber-10,#FFF8EB);color:var(--dh-warning-fg);display:inline-flex;align-items:center;justify-content:center;flex:none}
.fu .ask{display:block;font:700 15px/21px var(--dh-font-heading);color:var(--dh-navy-950)}
.fu__sub{display:block;font-size:14px;line-height:20px;color:var(--dh-gray-700);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fu .who{display:block;font:600 15px var(--dh-font-heading)}
.fu__more{display:flex;justify-content:center;border-top:1px solid var(--dh-gray-100);padding:4px}
.fu__meta{font-size:13px;color:var(--dh-gray-700)}
.crumb{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--dh-green-900);font-weight:600;text-decoration:none;margin-bottom:4px}

@media (prefers-reduced-motion:reduce){.st .pulse{animation:none}}
@media (max-width:1023px){
  .dgrid{grid-template-columns:minmax(0,1fr)}
  .seg{display:flex;flex-direction:column}
}
@media (max-width:767px){
  .fu__row{grid-template-columns:32px minmax(0,1fr) auto}
  .fu .who,.fu__sub.desk{display:none}
  .srow{grid-template-columns:32px minmax(0,1fr) auto}
  .now{padding:12px}
  .dh-overlay{padding:0;align-items:flex-end}
  .dh-overlay .dh-dialog{width:100%;border-radius:16px 16px 0 0;max-height:92dvh}
}

.pick-row .dh-av{color:#fff;background:var(--dh-green-900)}
.pick-row .dh-av.soft{color:var(--dh-green-900);background:var(--dh-teal-10)}

.pick-row .dh-av{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;flex:none;border-radius:50%;background:var(--dh-green-900);color:#fff !important;font:700 13px var(--dh-font-heading)}
.pick-row .dh-av.soft{background:var(--dh-teal-10);color:var(--dh-green-900) !important}

@media (max-width:767px){
  .dh-overlay{align-items:flex-end;padding:0}
  .dh-overlay .dh-dialog,
  .dh-overlay .dh-dialog--sm{
    width:100%;
    min-height:0 !important;
    max-height:92dvh;
    border-radius:16px 16px 0 0;
  }
}