/* ============================================================
   Scientific Calculator Button Styles
   ============================================================ */
.btn-func, .btn-num, .btn-op, .btn-act, .btn-eq, .btn-mode, .memory-btn {
  font-family: 'Fira Code', monospace;
  font-size: 0.95rem;
  font-weight: 500;
  padding: 0.65rem 0.25rem;
  border-radius: 0.5rem;
  transition: all 150ms ease;
  user-select: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.btn-func {
  background-color: #2d3749;
  color: #e2e8f0;
  border: 1px solid #4a5568;
}
.btn-func:hover {
  background-color: #374151;
  transform: translateY(-1px);
}
.btn-func:active {
  transform: translateY(0);
  background-color: #4b5563;
}

.btn-num {
  background-color: #1e293b;
  color: #e2e8f0;
  border: 1px solid #33415c;
}
.btn-num:hover {
  background-color: #33415b;
  transform: translateY(-1px);
}
.btn-num:active {
  transform: translateY(0);
}

.btn-op {
  background-color: #60a5fa;
  color: #000000;
  border: 1px solid #93c5fd;
  font-size: 1.2rem;
}
.btn-op:hover {
  background-color: #3b82f6;
  transform: translateY(-1px);
}
.btn-op:active {
  transform: translateY(0);
}

.btn-act {
  background-color: #4b5563;
  color: #e2e8f0;
  border: 1px solid #6b7280;
}
.btn-act:hover {
  background-color: #6b7280;
}

.btn-eq {
  background-color: #60a5fa;
  color: #000000;
  border: 1px solid #93c5fd;
  font-weight: 600;
  font-size: 1.2rem;
}
.btn-eq:hover {
  background-color: #3b82f6;
  transform: translateY(-1px);
}
.btn-eq:active {
  transform: translateY(0);
}

.btn-mode {
  background-color: #2d3749;
  color: #a78bfa;
  border: 1px solid #6366f1;
  font-size: 0.8rem;
  font-weight: 600;
}
.btn-mode:hover {
  background-color: #374151;
  color: #c4b5ff;
}

.memory-btn {
  background-color: #2d3749;
  color: #e2e8f0;
  border: 1px solid #4a5568;
  font-size: 0.85rem;
  padding: 0.4rem;
  border-radius: 0.4rem;
  position: relative;
  overflow: hidden;
  touch-action: manipulation;
}
.memory-btn:hover {
  background-color: #374151;
  color: #e2e8f0;
}

/* Long-press progress bar (appended dynamically to recall buttons) */
.long-press-progress {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  width: 0%;
  background-color: #4f46e5;
  pointer-events: none;
}

/* Visual state when a long press registers (expression recalled) */
.memory-btn.long-press-active {
  background-color: #4f46e5 !important;
  color: #ffffff !important;
}

.memory-active .memory-value {
  background-color: rgba(99, 102, 241, 0.15);
  border-color: rgba(99, 102, 241, 0.5);
}

/* Expression input focus glow */
#expressionDisplay:focus-within {
  border-color: #6366f1;
}
#expressionDisplay:focus {
  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.3);
}
#keyboardToggle {
  font-size: 0.75rem;
  line-height: 1;
}

/* History item hover */
#historyList [data-hist-idx]:hover {
  background-color: rgba(99, 102, 241, 0.05);
}