/* The microphone, on the board — static/dictate.js's own styling.

   Lifted from templates/jobboard_legacy.html (the "Dictation" rules there):
   a 44px round black mic button, a small one-line control row, live text
   underneath while it's recording. Kish tuned these exact sizes; they are
   not resized here. Colours and radii are the board's own Hairline tokens
   (static/board.css :root) rather than re-declared, since this file is
   always loaded alongside it. */

.dictate{display:flex;flex-direction:column;gap:6px;}
.dictate-row{display:flex;flex-direction:row;align-items:center;gap:10px;flex-wrap:wrap;}

button.mic{
  width:44px;height:44px;min-width:44px;border-radius:999px;background:var(--blue);border:none;
  color:#fff;display:flex;align-items:center;justify-content:center;padding:0;
  box-shadow:var(--shadow-button);
}
button.mic svg{width:22px;height:22px;}
button.mic.listening{background:var(--blue);animation:dictate-pulse 1.1s infinite;}
@keyframes dictate-pulse{
  0%{box-shadow:0 0 0 0 rgba(71,89,252,.45)}
  70%{box-shadow:0 0 0 20px rgba(71,89,252,0)}
  100%{box-shadow:0 0 0 0 rgba(71,89,252,0)}
}
@media (max-width:640px){
  button.mic{width:52px;height:52px;min-width:52px;}
  button.mic svg{width:26px;height:26px;}
}

.dictate .live-text{font-size:var(--t-meta);line-height:1.4;color:var(--muted);}
.dictate .live-text.has-text{font-size:var(--t-label);color:var(--ink);}
.dictate .dictate-status{font-size:var(--t-meta);color:var(--muted);}
.dictate .fallback-row{display:flex;gap:8px;align-items:center;}
.dictate .fallback-row #manualText{width:240px;}

/* Confirm before sending: who each job goes to. Bottom sheet on a phone, centred card on a desk. */
.dc-back{position:fixed;inset:0;background:rgba(0,0,0,.28);z-index:90;display:flex;align-items:flex-end;justify-content:center;}
@media (min-width:640px){.dc-back{align-items:center;padding:24px;}}
.dc-box{background:#fff;width:100%;max-width:520px;max-height:88vh;overflow-y:auto;border-radius:16px 16px 0 0;
  padding:20px 16px calc(20px + env(safe-area-inset-bottom));box-shadow:0 8px 24px rgba(0,0,0,.10);}
@media (min-width:640px){.dc-box{border-radius:16px;padding:24px 28px;}}
.dc-title{font-size:var(--t-body);font-weight:700;margin:0 0 12px;}
.dc-job{display:flex;flex-direction:column;gap:8px;padding:14px 0;border-top:1px solid var(--line,#F3F1F3);}
.dc-job:first-of-type{border-top:none;padding-top:0;}
.dc-text{width:100%;min-height:64px;resize:vertical;}
.dc-who{width:100%;}
.dc-due{font-size:var(--t-meta);color:var(--muted);}
.dc-actions{display:flex;flex-direction:column;gap:8px;margin-top:16px;}
.dc-ok{width:100%;height:52px;}