/* TASK-025F: smart dialer controls */

.dialer-number-wrap {
  position: relative;
  width: 100%;
}

.dialer-number-wrap #dialer-number {
  padding-right: 58px;
}

.dialer-inline-erase {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #64748b;
  font-size: 18px;
  cursor: pointer;
  z-index: 2;
}

.dialer-inline-erase[hidden] {
  display: none;
}

.dialer-inline-erase:hover {
  color: #0f172a;
}

.dialer-actions.smart-controls {
  width: min(100%, 620px);
  margin-left: auto;
  margin-right: auto;
  display: grid;
  grid-template-columns: 1fr !important;
}

.dialer-actions.smart-controls #btnDialerCall {
  width: 100%;
  min-height: clamp(52px, 7vh, 64px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.dialer-actions.smart-controls #btnDialerHangup,
.dialer-actions.smart-controls #btnDialerBackspace,
.dialer-actions.smart-controls #btnDialerLogout {
  display: none !important;
}

.dialer-actions.smart-controls.is-call-active #btnDialerCall {
  background: #dc2626;
}

@media (max-width: 640px) {
  .dialer-number-wrap #dialer-number {
    padding-right: 52px;
  }

  .dialer-inline-erase {
    right: 12px;
    width: 32px;
    height: 32px;
    font-size: 17px;
  }
}

/* TASK-025F vertical fit tuning */
body.dialer-mode .container {
  gap: 4px;
}

body.dialer-mode .status-bar {
  margin-bottom: 0;
}

body.dialer-mode .production-dialer-card {
  margin-top: 0;
  transform: translateY(-8px);
  max-height: calc(100dvh - 128px);
  padding-bottom: 16px;
}

body.dialer-mode .dialer-topline {
  margin-bottom: -2px;
}

body.dialer-mode .production-dialer-card .form-group {
  margin-bottom: 2px;
}

body.dialer-mode .dialer-keypad {
  gap: clamp(6px, 1vh, 10px) clamp(28px, 5vw, 70px);
}

body.dialer-mode .dialer-actions.smart-controls {
  margin-top: 2px;
  margin-bottom: 2px;
}

body.dialer-mode .dialer-actions.smart-controls #btnDialerCall {
  min-height: clamp(50px, 6.6vh, 60px);
}

body.dialer-mode #dialer-note {
  margin-top: 0;
}

@media (max-height: 760px) {
  body.dialer-mode .production-dialer-card {
    transform: translateY(-10px);
    max-height: calc(100dvh - 104px);
    padding-bottom: 14px;
  }

  body.dialer-mode .dialer-keypad {
    gap: 5px clamp(22px, 4vw, 52px);
  }

  body.dialer-mode .dialer-actions.smart-controls #btnDialerCall {
    min-height: 42px;
  }
}
/* END TASK-025F vertical fit tuning */
